p2004a/index.html

## index.html
<!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>

## main.js
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);
};
	<!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>
	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);
	};