Created
November 19, 2014 22:05
-
-
Save p2004a/28981ba3f2f9ec199f99 to your computer and use it in GitHub Desktop.
Simple iframe js runner
This file contains 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
<!DOCTYPE html> | |
<html> | |
<head> | |
<meta charset="utf-8"> | |
<title>iframe runner</title> | |
<script src="http://ajaxorg.github.io/ace-builds/src-min-noconflict/ace.js" type="text/javascript" charset="utf-8"></script> | |
<script src="http://ajaxorg.github.io/ace-builds/src-min-noconflict/ext-language_tools.js" type="text/javascript" charset="utf-8"></script> | |
<script src="main.js" type="text/javascript" charset="utf-8"></script> | |
</head> | |
<body> | |
<p>Pres Ctrl+Enter to run code</p> | |
<div id="editor" style="width: 500px; height: 180px;">window.onload = function () { | |
document.body.innerText = "Hello World!"; | |
};</div> | |
<iframe id="frame" sandbox="allow-scripts allow-popups" style="border: 1px solid black; width:500px; height:500x;"></iframe> | |
</body> | |
</html> |
This file contains 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
window.onload = function () { | |
'use strict'; | |
var $frame = document.getElementById('frame'); | |
function execCode(script) { | |
var html = "<html><head><script>" + script + "</script></head><body><body></html>"; | |
$frame.src = "data:text/html;encoding=utf8;base64," + btoa(html); | |
} | |
ace.require("ace/ext/language_tools"); | |
var editor = ace.edit("editor"); | |
editor.setOptions({ | |
enableBasicAutocompletion: true, | |
enableLiveAutocompletion: true | |
}); | |
editor.setTheme("ace/theme/tomorrow"); | |
editor.getSession().setMode("ace/mode/javascript"); | |
editor.commands.addCommand({ | |
name: "execjs", | |
bindKey: { | |
win: "Ctrl-Enter", | |
mac: "Command-Enter" | |
}, | |
exec: function(editor) { | |
var code = editor.getValue(); | |
execCode(code); | |
}, | |
readOnly: true | |
}); | |
editor.commands.exec("execjs", editor); | |
}; |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment