public
Last active

my editor

  • Download Gist
editor.html
HTML
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46
data:text/html,
<style type="text/css">
#e {
position:absolute;
top:0;
right:0;
bottom:0;
left:0;
font-size:16px;
}
</style>
<div id="e"></div>
<script src="http://d1n0x3qji82z53.cloudfront.net/src-min-noconflict/ace.js"></script>
<script src="http://code.jquery.com/jquery-1.9.0.min.js"></script>
<script>
var myKey="SecretKeyz";
$(document).ready(function(){
var e;
var url = "http://api.openkeyval.org/"+myKey;
$.ajax({
url: url,
dataType: "jsonp",
success: function(data){
e = ace.edit("e");
e.setTheme("ace/theme/tomorrow_night_eighties");
e.getSession().setMode("ace/mode/markdown");
e.setValue(data);
}
});
 
$("#e").on("keydown", function (b) {
if (b.ctrlKey && 83 == b.which) {
b.preventDefault();
var data = myKey+"="+encodeURIComponent(e.getValue());
$.ajax({
data: data,
url: "http://api.openkeyval.org/store/",
dataType: "jsonp",
success: function(data){
alert("Saved.");
}
});
}
});
});
</script>

Nice...

Doing it like this you keep the screen from flashing when the theme is being switched.

And the %s is useful if you want to map this as a searchEngine in Chrome ans use a keyword to launch it from OmniBox

data:text/html,
<style type="text/css"> 
    #e { position:absolute; top:0; right:0; bottom:0; left:0; font-size:16px; } 
</style>
<div id="e">%s</div>

<script src="http://d1n0x3qji82z53.cloudfront.net/src-min-noconflict/ace.js"></script>
<script src="http://code.jquery.com/jquery-1.9.0.min.js"></script>
<script> 
    var myKey="SecretKeyz"; 
    $(document).ready( 
        function(){ 
            var e = ace.edit("e");
            e.setTheme("ace/theme/twilight");
            e.getSession().setMode("ace/mode/javascript"); 
            var url = "http://api.openkeyval.org/"+myKey; 
            $.ajax({ 
                url: url, 
                dataType: "jsonp", 
                success: 
                    function(data){                         
                        e.setValue(data); 
                    } 
            }); 
            $("#e").on
            ("keydown", function (b) { 
                if (b.ctrlKey && 83 == b.which) { 
                    b.preventDefault(); 
                    var data = myKey+"="+encodeURIComponent(e.getValue()); 
                    $.ajax({ 
                        data: data, 
                        url: "http://api.openkeyval.org/store/", 
                        dataType: "jsonp", 
                        success: function(data){ alert("Saved."); 
                    } 
                }); 
                } 
            }); 
        }
    ); 
</script>´´´

Nice

<title>TextEditor</title>

光打字多无聊来个画图的玩玩:)

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>

@assassindesign haha.. sketch pad :)

@assassindesign cool

I can ust it to type text, but can not save to a file.

技术宅拯救世界

Please sign in to comment on this gist.

Something went wrong with that request. Please try again.