-
Star
(420)
You must be signed in to star a gist -
Fork
(103)
You must be signed in to fork a gist
-
-
Save jdkanani/4670615 to your computer and use it in GitHub Desktop.
This bookmarklet gives you a code editor in your browser with a single click.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
data:text/html, <style type="text/css">.e{position:absolute;top:0;right:0;bottom:0;left:0;}</style><div class="e" id="editor"></div><script src="http://d1n0x3qji82z53.cloudfront.net/src-min-noconflict/ace.js" type="text/javascript" charset="utf-8"></script><script>var e=ace.edit("editor");e.setTheme("ace/theme/monokai");e.getSession().setMode("ace/mode/ruby");</script> | |
<!-- | |
For other language: Instead of `ace/mode/ruby`, Use | |
Markdown -> `ace/mode/markdown` | |
Python -> `ace/mode/python` | |
C/C++ -> `ace/mode/c_cpp` | |
Javscript -> `ace/mode/javascript` | |
Java -> `ace/mode/java` | |
Scala- -> `ace/mode/scala` | |
CoffeeScript -> `ace/mode/coffee` | |
and | |
css, html, php, latex, | |
tex, sh, sql, lua, clojure, dart, typescript, go, groovy, json, jsp, less, lisp, | |
lucene, perl, powershell, scss, textile, xml, yaml, xquery, liquid, diff and many more... | |
For other theme: Instead of `ace/theme/monokai`, Use | |
Eclipse -> ace/theme/eclipse | |
GitHub -> ace/theme/github | |
TextMate -> ace/theme/textmate | |
and | |
ambiance, dawn, chaos, chrome, dreamweaver, xcode, vibrant_ink, solarized_dark, solarized_light, tomorrow, tomorrow_night, tomorrow_night_blue, | |
twilight, tomorrow_night_eighties, pastel_on_dark and many more.. | |
--> | |
<!-- If you want a markdown converter use this : !--> | |
data:text/html,<style type="text/css">.e{position:absolute;top:0;right:50%;bottom:0;left:0;} .c{position:absolute;overflow:auto;top:0;right:0;bottom:0;left:50%;}</style><div class="e" id="editor"></div><div class="c"></div><script src="http://d1n0x3qji82z53.cloudfront.net/src-min-noconflict/ace.js" type="text/javascript" charset="utf-8"></script><script src="http://cdnjs.cloudflare.com/ajax/libs/showdown/0.3.1/showdown.min.js"></script><script> function showResult(e){consoleEl.innerHTML=e}var e=ace.edit("editor");e.setTheme("ace/theme/monokai");e.getSession().setMode("ace/mode/markdown");var consoleEl=document.getElementsByClassName("c")[0];var converter=new Showdown.converter;e.commands.addCommand({name:"markdown",bindKey:{win:"Ctrl-M",mac:"Command-M"},exec:function(t){var n=e.getSession().getMode().$id;if(n=="ace/mode/markdown"){showResult(converter.makeHtml(t.getValue()))}},readOnly:true})</script> | |
<!-- Press Ctrl+M or Command+M to convert your markdown code to html :) --> |
is there a way to run the code
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
As someone else mentioned in a previous comment,
ace.js
has moved. Refer to this CDN directory to get the latest Ace version whenever you are using this.Right now, the latest version is Ace v1.4.12 (the directory listing also mentions that there are no known vulnerabilities as of now but use this at your own risk) and the link is: https://cdnjs.cloudflare.com/ajax/libs/ace/1.4.12/ace.js.
Replace the
src
attribute in the script tag with the link you copied in the previous step. The code snippets would now become:Simple editor
Markdown Editor
This uses
showdown.js
for converting markdown to html. This is the CDN directory link for showdown. Here's the current CDN link for Showdown v1.9.1: https://cdnjs.cloudflare.com/ajax/libs/showdown/1.9.1/showdown.min.js.I have replaced both ace and showdown CDN links in the src attributes for this editable snippet.
As mentioned in the original gist,
Ctrl+M
orCmd+M
converts the markdown to html on the side panel.