2016-06-01 10:04:56 -04:00
|
|
|
<!doctype html>
|
|
|
|
|
|
|
|
|
|
<html lang="en">
|
|
|
|
|
<head>
|
|
|
|
|
<meta charset="utf-8">
|
|
|
|
|
<title>Scratch VM Playground</title>
|
|
|
|
|
<link rel="stylesheet" href="playground.css">
|
2016-09-24 18:11:01 -04:00
|
|
|
<link rel="stylesheet" href="zenburn.css">
|
2016-06-01 10:04:56 -04:00
|
|
|
</head>
|
|
|
|
|
<body>
|
2016-06-01 10:18:08 -04:00
|
|
|
<div id="vm-devtools">
|
2016-09-12 12:03:24 -04:00
|
|
|
<h2>Scratch VM Playground</h2>
|
|
|
|
|
<select id="selectedTarget" multiple></select>
|
|
|
|
|
<div id="projectButtons">
|
|
|
|
|
<button id="greenflag">Green flag</button>
|
|
|
|
|
<button id="stopall">Stop</button>
|
|
|
|
|
</div>
|
2016-10-17 23:23:16 -04:00
|
|
|
<div>
|
|
|
|
|
Turbo: <input id='turbomode' type='checkbox' />
|
|
|
|
|
</div>
|
|
|
|
|
<div>
|
|
|
|
|
Compatibility (30 TPS): <input id='compatmode' type='checkbox' />
|
|
|
|
|
</div>
|
2016-09-12 12:03:24 -04:00
|
|
|
<br />
|
|
|
|
|
<ul id="playgroundLinks">
|
|
|
|
|
<li><a id="renderexplorer-link" href="#">Renderer</a></li>
|
|
|
|
|
<li><a id="threadexplorer-link" href="#">Threads</a></li>
|
|
|
|
|
<li><a id="blockexplorer-link" href="#">Block Representation</a></li>
|
2016-09-12 11:05:16 -04:00
|
|
|
<li><a id="importexport-link" href="#">Import/Export</a></li>
|
|
|
|
|
</ul><br />
|
2016-06-29 20:56:55 -04:00
|
|
|
<div id="tab-renderexplorer">
|
2016-09-12 12:03:24 -04:00
|
|
|
Renderer<br />
|
2016-09-12 11:05:16 -04:00
|
|
|
<canvas id="scratch-stage" style="width: 480px; height: 360px;"></canvas><br />
|
2016-06-29 20:56:55 -04:00
|
|
|
</div>
|
2016-06-07 20:44:08 -04:00
|
|
|
<div id="tab-threadexplorer">
|
|
|
|
|
Thread explorer
|
|
|
|
|
<pre id="threadexplorer"></pre>
|
|
|
|
|
</div>
|
2016-06-01 10:18:08 -04:00
|
|
|
<div id="tab-blockexplorer">
|
2016-06-07 20:44:08 -04:00
|
|
|
Block explorer
|
2016-06-01 10:47:47 -04:00
|
|
|
<pre id="blockexplorer"></pre>
|
2016-06-01 10:18:08 -04:00
|
|
|
</div>
|
2016-09-02 08:27:43 -04:00
|
|
|
<div id="tab-importexport">
|
2016-09-12 11:05:16 -04:00
|
|
|
Import/Export<br />
|
2016-09-12 12:03:24 -04:00
|
|
|
Project ID: <input id="projectId" value="119615668" />
|
2016-09-15 19:02:03 -04:00
|
|
|
<button id="projectLoadButton">Load</button>
|
|
|
|
|
<button id="createEmptyProject">New Project</button><br />
|
2016-09-02 08:27:43 -04:00
|
|
|
<p>
|
|
|
|
|
<input type="button" value="Export to XML" onclick="toXml()">
|
|
|
|
|
|
|
|
|
|
<input type="button" value="Import from XML" onclick="fromXml()" id="import">
|
2016-09-12 12:03:24 -04:00
|
|
|
<br /><br />
|
2016-09-02 08:41:12 -04:00
|
|
|
<textarea id="importExport"></textarea>
|
2016-09-02 08:27:43 -04:00
|
|
|
</p>
|
|
|
|
|
</div>
|
2016-06-01 10:18:08 -04:00
|
|
|
</div>
|
2016-08-31 12:28:44 -04:00
|
|
|
|
2016-06-01 10:04:56 -04:00
|
|
|
<div id="blocks"></div>
|
2016-06-01 10:18:08 -04:00
|
|
|
|
2016-09-24 18:11:01 -04:00
|
|
|
<!-- FPS counter, Syntax highlighter, Blocks, Renderer -->
|
|
|
|
|
<script src="./vendor.js"></script>
|
2016-06-21 15:30:36 -04:00
|
|
|
<!-- VM Worker -->
|
2016-09-24 18:11:01 -04:00
|
|
|
<script src="./vm.js"></script>
|
2016-06-01 10:04:56 -04:00
|
|
|
<!-- Playground -->
|
|
|
|
|
<script src="./playground.js"></script>
|
2016-09-02 08:27:43 -04:00
|
|
|
<script>
|
|
|
|
|
function toXml() {
|
|
|
|
|
var output = document.getElementById('importExport');
|
|
|
|
|
var xml = Blockly.Xml.workspaceToDom(workspace);
|
|
|
|
|
output.value = Blockly.Xml.domToPrettyText(xml);
|
|
|
|
|
output.focus();
|
|
|
|
|
output.select();
|
|
|
|
|
}
|
2016-09-06 11:46:10 -04:00
|
|
|
|
2016-09-02 08:27:43 -04:00
|
|
|
function fromXml() {
|
|
|
|
|
var input = document.getElementById('importExport');
|
|
|
|
|
var xml = Blockly.Xml.textToDom(input.value);
|
|
|
|
|
Blockly.Xml.domToWorkspace(workspace, xml);
|
|
|
|
|
}
|
|
|
|
|
</script>
|
2016-06-01 10:04:56 -04:00
|
|
|
</body>
|
|
|
|
|
</html>
|
