Skip to content

Instantly share code, notes, and snippets.

@jakeonrails jakeonrails/Ruby Notepad Bookmarklet
Created Jan 29, 2013

Embed
What would you like to do?
Learn more about clone URLs
Download ZIP
This bookmarklet gives you a code editor in your browser with a single click.
Raw
Ruby Notepad Bookmarklet
data:text/html, <style type="text/css">#e{position:absolute;top:0;right:0;bottom:0;left:0;}</style><div id="e"></div><script src="http://d1n0x3qji82z53.cloudfront.net/src-min-noconflict/ace.js" type="text/javascript" charset="utf-8"></script><script>var e=ace.edit("e");e.setTheme("ace/theme/monokai");e.getSession().setMode("ace/mode/ruby");</script>
@theunraveler

This comment has been minimized.

Sign in to view
Copy link

theunraveler commented Jan 29, 2013

Doesn't work on Firefox 18, fwiw.
@tekknolagi

This comment has been minimized.

Sign in to view
Copy link

tekknolagi commented Jan 29, 2013

Confirmed, doesn't work on Firefox.
@randito

This comment has been minimized.

Sign in to view
Copy link

randito commented Jan 29, 2013

Confirmed: Still pretty cool, though.
@backwardm

This comment has been minimized.

Sign in to view
Copy link

backwardm commented Jan 29, 2013

Uh, Roger that... Confirmed Cool. Over.
@pato

This comment has been minimized.

Sign in to view
Copy link

pato commented Jan 29, 2013

Works in Chrome 26 dev. This is very useful and cool!
@bhurlow

This comment has been minimized.

Sign in to view
Copy link

bhurlow commented Jan 29, 2013

way cool
@nixpulvis

This comment has been minimized.

Sign in to view
Copy link

nixpulvis commented Jan 29, 2013

This reminds me of my dream to get sublime text on the web :P
@hayden-jones

This comment has been minimized.

Sign in to view
Copy link

hayden-jones commented Jan 29, 2013

Firefox is garbage, what's wrong with you people?
@pdillon3

This comment has been minimized.

Sign in to view
Copy link

pdillon3 commented Jan 29, 2013

What is Firefox?
@Apocryphon

This comment has been minimized.

Sign in to view
Copy link

Apocryphon commented Jan 29, 2013

Wha?
@sergiotapia

This comment has been minimized.

Sign in to view
Copy link

sergiotapia commented Jan 29, 2013

Woah! This is fantastic!
@antoniorosado

This comment has been minimized.

Sign in to view
Copy link

antoniorosado commented Jan 30, 2013

:)
@lashkari

This comment has been minimized.

Sign in to view
Copy link

lashkari commented Jan 30, 2013

If you URL encode the HTML, it should work in both Firefox and Chrome:

data:text/html, %3Cstyle%20type%3D%22text%2Fcss%22%3E%23e%7Bposition%3Aabsolute%3Btop%3A0%3Bright%3A0%3Bbottom%3A0%3Bleft%3A0%3B%7D%3C%2Fstyle%3E%3Cdiv%20id%3D%22e%22%3E%3C%2Fdiv%3E%3Cscript%20src%3D%22http%3A%2F%2Fd1n0x3qji82z53.cloudfront.net%2Fsrc-min-noconflict%2Face.js%22%20type%3D%22text%2Fjavascript%22%20charset%3D%22utf-8%22%3E%3C%2Fscript%3E%3Cscript%3Evar%20e%3Dace.edit(%22e%22)%3Be.setTheme(%22ace%2Ftheme%2Fmonokai%22)%3Be.getSession().setMode(%22ace%2Fmode%2Fruby%22)%3B%3C%2Fscript%3E
@markbrown4

This comment has been minimized.

Sign in to view
Copy link

markbrown4 commented Jan 30, 2013

Firefox is the greatest browser of all time Losers!
@mufid

This comment has been minimized.

Sign in to view
Copy link

mufid commented Jan 30, 2013

Working on Chrome 25. Great! Love it!
@cswuyg

This comment has been minimized.

Sign in to view
Copy link

cswuyg commented Jan 30, 2013

So good, thanks.
@slawdan

This comment has been minimized.

Sign in to view
Copy link

slawdan commented Jan 30, 2013

If replace the last ace/mode/rubyto ace/mode/python, you can get a Python version editor, and maybe also other languages.
@justdark

This comment has been minimized.

Sign in to view
Copy link

justdark commented Jan 30, 2013

cool!
@jdkanani

This comment has been minimized.

Sign in to view
Copy link

jdkanani commented Jan 30, 2013

For all browser including firefox 18 :)

https://gist.github.com/4670615

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
TextMate -> ace/theme/textmate
and
xcode, vibrant_ink, solarized_dark, solarized_light, tomorrow, tomorrow_night, tomorrow_night_blue, twilight, tomorrow_night_eighties, pastel_on_dark
and some more....
@jayzeng

This comment has been minimized.

Sign in to view
Copy link

jayzeng commented Jan 30, 2013

very cool!
@Galilyou

This comment has been minimized.

Sign in to view
Copy link

Galilyou commented Jan 30, 2013

Awesome! :)
@zhaoxingyun

This comment has been minimized.

Sign in to view
Copy link

zhaoxingyun commented Jan 30, 2013

Nice!
@cuthead

This comment has been minimized.

Sign in to view
Copy link

cuthead commented Jan 30, 2013

Working on Chrome 24. Great works.
@minikomi

This comment has been minimized.

Sign in to view
Copy link

minikomi commented Jan 30, 2013

Adding openkeyval for storage :)

https://gist.github.com/4672169
@NaixSpirit

This comment has been minimized.

Sign in to view
Copy link

NaixSpirit commented Jan 30, 2013

cool!
@raecoo

This comment has been minimized.

Sign in to view
Copy link

raecoo commented Jan 30, 2013

Good job, works well on Chrome 24.x.x. Thanks
@kafkaliu

This comment has been minimized.

Sign in to view
Copy link

kafkaliu commented Jan 30, 2013

terrific!!
@icepole-jon

This comment has been minimized.

Sign in to view
Copy link

icepole-jon commented Jan 30, 2013

a little change,open in the new tab and with 18px fontsize
javascript:(function(){window.open('data:text/html, <style type="text/css">#e{position:absolute;top:0;right:0;bottom:0;left:0;font-size:18px;}</style>

<script src="http://d1n0x3qji82z53.cloudfront.net/src-min-noconflict/ace.js" type="text/javascript" charset="utf-8"></script><script>var e=ace.edit("e");e.setTheme("ace/theme/monokai");e.getSession().setMode("ace/mode/c_cpp");</script>','_blank');})()
@shouya

This comment has been minimized.

Sign in to view
Copy link

shouya commented Jan 30, 2013

Awesome is it!
@gongscut

This comment has been minimized.

Sign in to view
Copy link

gongscut commented Jan 30, 2013

how about COBOL ?
@cballenar

This comment has been minimized.

Sign in to view
Copy link

cballenar commented Jan 30, 2013

Nice...
@assassindesign

This comment has been minimized.

Sign in to view
Copy link

assassindesign commented Jan 30, 2013

光打字多无聊来个画图的玩玩：）

data:text/html, <body><canvas id="dyDraw">你的浏览器不支持HTML5 Canvas</canvas></body><script>function $(id){return document.getElementById(id);} $('dyDraw').width=document.body.clientWidth;$('dyDraw').height=document.body.clientHeight;if(window.addEventListener){window.addEventListener('load',function(){var canvas,canvastext;var hua=false;function dyDrawing(){canvas=$('dyDraw');canvastext=canvas.getContext('2d');canvas.addEventListener('mousedown',canvasMouse,false);canvas.addEventListener('mousemove',canvasMouse,false);window.addEventListener('mouseup',canvasMouse,false);} function canvasMouse(dy){var x,y;if(dy.layerX||dy.layerX==0){x=dy.layerX;y=dy.layerY;}else if(dy.offsetX||dy.offsetX==0){x=dy.offsetX;y=dy.offsetY;} x-=dyDraw.offsetLeft;y-=dyDraw.offsetTop;if(dy.type=='mousedown'){hua=false;canvastext.beginPath();canvastext.moveTo(x,y);hua=true;}else if(dy.type=='mousemove'){if(hua){canvastext.strokeStyle="rgb(255,0,0)";canvastext.lineWidth=9;canvastext.lineTo(x,y);canvastext.stroke();}}else if(dy.type=='mouseup'){hua=false;}} dyDrawing();},false);}</script>
@itomatik

This comment has been minimized.

Sign in to view
Copy link

itomatik commented Jan 31, 2013

very cool
@ajduke

This comment has been minimized.

Sign in to view
Copy link

ajduke commented Jan 31, 2013

Cool stuff !!
@maximx

This comment has been minimized.

Sign in to view
Copy link

maximx commented Feb 1, 2013

pretty nice!
@laihui0207

This comment has been minimized.

Sign in to view
Copy link

laihui0207 commented Feb 1, 2013

very cool !
@hit9

This comment has been minimized.

Sign in to view
Copy link

hit9 commented Feb 12, 2013

nice!
@lvwzhen

This comment has been minimized.

Sign in to view
Copy link

lvwzhen commented Feb 20, 2013

cool!
@tylerlong

This comment has been minimized.

Sign in to view
Copy link

tylerlong commented Mar 9, 2013

Now we have Slim Text

Slim Text
@tsi

This comment has been minimized.

Sign in to view
Copy link

tsi commented May 22, 2013

This is kinda similar to Acelet, only without the import-highlighted-text thingy that acelet does ;)
@shmuelix

This comment has been minimized.

Sign in to view
Copy link

shmuelix commented Jul 8, 2013

I am wondering who will take this as a challenge to create from this bookmarklet a cross-browser extension.
It can easily be done with the Crossrider extension development framework (http://crossrider.com).

There is also a tutorial about this on the Crossrider blog:
http://blog.crossrider.com/post/52302194099/from-bookmarklet-to-extension-in-just-5-minutes
@FrankFan

This comment has been minimized.

Sign in to view
Copy link

FrankFan commented Oct 24, 2013

wow~ awesome~
@Yhzhtk

This comment has been minimized.

Sign in to view
Copy link

Yhzhtk commented Jan 2, 2014

good!
@rafaelcgo

This comment has been minimized.

Sign in to view
Copy link

rafaelcgo commented Jan 10, 2014

man, this is sick! Amazing
@PeterRao

This comment has been minimized.

Sign in to view
Copy link

PeterRao commented Mar 18, 2014

so cool
@PeterRao

This comment has been minimized.

Sign in to view
Copy link

PeterRao commented Mar 18, 2014

so cool
@jesuscast

This comment has been minimized.

Sign in to view
Copy link

jesuscast commented Jun 15, 2014

You're Amazing dude
@dlio

This comment has been minimized.

Sign in to view
Copy link

dlio commented Jun 22, 2014

Is it possible to set this as the new tab page default in chrome?
I've tried a few workarounds to no avail.
Awesome project -- thanks for sharing.
@g8d3

This comment has been minimized.

Sign in to view
Copy link

g8d3 commented Feb 10, 2015

It saves the file with weird characters, I am in Chrome.
@whzecomjm

This comment has been minimized.

Sign in to view
Copy link

whzecomjm commented Apr 20, 2015

👍Amazing! Works on Chrome 42.
@gopalindians

This comment has been minimized.

Sign in to view
Copy link

gopalindians commented Jul 10, 2015

Great!
@NicholasGraf

This comment has been minimized.

Sign in to view
Copy link

NicholasGraf commented Mar 24, 2017 •
edited

Try this: http://listpl.us
@ryanlid

This comment has been minimized.

Sign in to view
Copy link

ryanlid commented Apr 27, 2017

👍 Cool~
@reatang

This comment has been minimized.

Sign in to view
Copy link

reatang commented May 13, 2017

http://d1n0x3qji82z53.cloudfront.net/src-min-noconflict/ace.js is 404

http://ajaxorg.github.io/ace-builds/src-noconflict/ace.js it work

data:text/html, <style type="text/css">#e{position:absolute;top:0;right:0;bottom:0;left:0;}</style><div id="e"></div><script src="http://ajaxorg.github.io/ace-builds/src-noconflict/ace.js" type="text/javascript" charset="utf-8"></script><script>var e=ace.edit("e");e.setTheme("ace/theme/monokai");e.getSession().setMode("ace/mode/ruby");</script>
@nobody5050

This comment has been minimized.

Sign in to view
Copy link

nobody5050 commented Oct 27, 2019

does not work on mobile safari, typing doesn’t show up
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.