scratch-vm/playground/index.html

<!doctype html>

<html lang="en">
<head>
    <meta charset="utf-8">
    <title>Scratch VM Playground</title>
    <link rel="stylesheet" href="playground.css">
    <link rel="stylesheet" href="zenburn.css">
</head>
<body>
    <div id="vm-devtools">
        <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>
        <div>
            Turbo: <input id='turbomode' type='checkbox' />
        </div>
        <div>
            Compatibility (30 TPS):  <input id='compatmode' type='checkbox' />
        </div>
        <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>
            <li><a id="importexport-link" href="#">Import/Export</a></li>
        </ul><br />
        <div id="tab-renderexplorer">
            Renderer<br />
            <canvas id="scratch-stage" style="width: 480px; height: 360px;"></canvas><br />
            x: <input id='sinfo-x' />
            y: <input id='sinfo-y' /><br />
            dir: <input id='sinfo-direction' />
            rotation style: <input id='sinfo-rotationstyle' /><br />
            visible: <input id='sinfo-visible' />
            <button id='sinfo-post'>Post</button>
        </div>
        <div id="tab-threadexplorer">
            Thread explorer
            <pre id="threadexplorer"></pre>
        </div>
        <div id="tab-blockexplorer">
            Block explorer
            <pre id="blockexplorer"></pre>
        </div>
        <div id="tab-importexport">
            Import/Export<br />
            Project ID: <input id="projectId" value="119615668" />
            <button id="projectLoadButton">Load</button>
            <button id="createEmptyProject">New Project</button><br />
            <p>
                <input type="button" value="Export to JSON" onclick="toJson()">
                &nbsp;
                <input type="button" value="Import from JSON" onclick="fromJson()" id="import">
                <br /><br />
                <textarea id="importExport"></textarea>
            </p>
        </div>
    </div>

    <div id="blocks"></div>

    <!-- FPS counter, Syntax highlighter, Blocks, Renderer -->
    <script src="./vendor.js"></script>
    <!-- VM Worker -->
    <script src="./scratch-vm.js"></script>
    <!-- Playground -->
    <script src="./playground.js"></script>
    <script>
        function toJson() {
            var output = document.getElementById('importExport');
            var json = window.vm.toPrettyJSON(workspace);
            output.value = json;
            output.focus();
            output.select();
          }

          function fromJson() {
            var input = document.getElementById('importExport');
            window.vm.fromJSON(input.value);
          }
    </script>
</body>
</html>
Add a basic demo playground with scratch-blocks 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">`
Provide playground dependencies with webpack This confines all the files the playground needs to the playground directory. 2016-09-24 18:11:01 -04:00			`<link rel="stylesheet" href="zenburn.css">`
Add a basic demo playground with scratch-blocks 2016-06-01 10:04:56 -04:00			`</head>`
			`<body>`
Add a block representation explorer to playground 2016-06-01 10:18:08 -04:00			`<div id="vm-devtools">`
Fixes for #138 (#166) * Markup/CSS adjustments * Move assets to folder * Strip extra font-family * More robust handling of project-load fail state * Move empty project creation to its own function * Move green flag/stop back out of the tab * Restore default id 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>`
Interpreter fixes, enhancements, features (#280) * Thread stepping rework; interp.redraw equivalent * Add turbo mode and pause mode * Yielding behavior to match Scratch 2.0 * Implement warp-mode procedure threads * Add check for recursive call * Inline wait block timer * Revert to setInterval and always drawing * Restore yielding in glide * 30TPS compatibility mode * 5-call count recursion limit * Removing dead primitive code * To simplify, access runtime.threads inline in `stepThreads`. * Warp mode/timer fixes; recursive check fixes; clean-up * Add basic single-stepping * Add single-stepping speed slider * Allow yielding threads to run in single-stepping * Restore inactive threads tracking for block glows * Add clock pausing during pause mode * Documentation and clean-up throughout * Don't look for block glows in `thread.topBlock`. * Add null check for block glows; rename `_updateScriptGlows` to reflect block glowing * Use the current executed block for glow, instead of stack * Add more comments to `stepToProcedure`, and re-arrange to match 2.0 * Tweak to Blocks.prototype.getTopLevelScript * Revert previous * Fix threads array to be resilient to changes during `stepThreads` * Restore inactive threads filtering * Fix typo in "procedure" * !! instead of == true 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>`
Fixes for #138 (#166) * Markup/CSS adjustments * Move assets to folder * Strip extra font-family * More robust handling of project-load fail state * Move empty project creation to its own function * Move green flag/stop back out of the tab * Restore default id 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>`
Offline Support [READY TO MERGE?] [ALONG WITH THE SCRATCH-RENDER PR] (#138) * Remove Fallback Project * Added A Newline and Removed Fallback Project * Made The SB2 Project Import Field Fit In More With All Other Textboxes * Better Description Of SB2 Import Field * Oops! * The XML Import Area Doses Not Need To Be Resizable! * That Didn't Work As Planned * Now it won't rezize * Added SB3New * Add Code For SB3New * Better 404 * Indentation * NodeJS complains about quotes * Moved And Renamed SB3New * Renamed Refrences * Prefix With ./ * Typo * Newline Fix * Scratch Cat By Default! * Single Quotes And Max Legth Fixed * Better Comment Above loadProject * Move newProject to index.js * Added Dependincies to index.js * Deleted newProject.js * Removed Unneeeded Semicolon * @param {?string} * Added SVG For Scxratch Cat * Now Uses Scratch Cat Offline (REQUIRES PULL REQUEST MADE TO SCRATCH-RENDER TO BE MERGED OR IT WILL NOT WORK) * Added Stage PNG * Added Stage Creation * Fix Sizing Issues * Import And Compatibility With Less Hacky Image Import (Scratch-Render) * Import And Compatibility With Less Hacky Image Import (Scratch-Render) * Fixed Line Length * Added Navigation Bar * Added CSS For Drop Down Menus * Nicer Scale * Nicer Dropdowns * Remobved Dropdown CSS (It Didn't Work) * Add Scratch Player Bar CSS * Add Scratch Player Bar HTML 2016-09-12 11:05:16 -04:00			`<li><a id="importexport-link" href="#">Import/Export</a></li>`
			`</ul><br />`
Add renderer demo using scratch-render-webgl 2016-06-29 20:56:55 -04:00			`<div id="tab-renderexplorer">`
Fixes for #138 (#166) * Markup/CSS adjustments * Move assets to folder * Strip extra font-family * More robust handling of project-load fail state * Move empty project creation to its own function * Move green flag/stop back out of the tab * Restore default id 2016-09-12 12:03:24 -04:00			`Renderer<br />`
Offline Support [READY TO MERGE?] [ALONG WITH THE SCRATCH-RENDER PR] (#138) * Remove Fallback Project * Added A Newline and Removed Fallback Project * Made The SB2 Project Import Field Fit In More With All Other Textboxes * Better Description Of SB2 Import Field * Oops! * The XML Import Area Doses Not Need To Be Resizable! * That Didn't Work As Planned * Now it won't rezize * Added SB3New * Add Code For SB3New * Better 404 * Indentation * NodeJS complains about quotes * Moved And Renamed SB3New * Renamed Refrences * Prefix With ./ * Typo * Newline Fix * Scratch Cat By Default! * Single Quotes And Max Legth Fixed * Better Comment Above loadProject * Move newProject to index.js * Added Dependincies to index.js * Deleted newProject.js * Removed Unneeeded Semicolon * @param {?string} * Added SVG For Scxratch Cat * Now Uses Scratch Cat Offline (REQUIRES PULL REQUEST MADE TO SCRATCH-RENDER TO BE MERGED OR IT WILL NOT WORK) * Added Stage PNG * Added Stage Creation * Fix Sizing Issues * Import And Compatibility With Less Hacky Image Import (Scratch-Render) * Import And Compatibility With Less Hacky Image Import (Scratch-Render) * Fixed Line Length * Added Navigation Bar * Added CSS For Drop Down Menus * Nicer Scale * Nicer Dropdowns * Remobved Dropdown CSS (It Didn't Work) * Add Scratch Player Bar CSS * Add Scratch Player Bar HTML 2016-09-12 11:05:16 -04:00			`<canvas id="scratch-stage" style="width: 480px; height: 360px;"></canvas><br />`
Implement sprite info emitting and posting (#320) 2016-10-26 13:27:12 -04:00			`x: <input id='sinfo-x' />`
			`y: <input id='sinfo-y' /><br />`
			`dir: <input id='sinfo-direction' />`
			`rotation style: <input id='sinfo-rotationstyle' /><br />`
			`visible: <input id='sinfo-visible' />`
			`<button id='sinfo-post'>Post</button>`
Add renderer demo using scratch-render-webgl 2016-06-29 20:56:55 -04:00			`</div>`
Add tab to VM playground to show threads 2016-06-07 20:44:08 -04:00			`<div id="tab-threadexplorer">`
			`Thread explorer`
			`<pre id="threadexplorer"></pre>`
			`</div>`
Add a block representation explorer to playground 2016-06-01 10:18:08 -04:00			`<div id="tab-blockexplorer">`
Add tab to VM playground to show threads 2016-06-07 20:44:08 -04:00			`Block explorer`
Update to use syntax highlighting in block explorer 2016-06-01 10:47:47 -04:00			`<pre id="blockexplorer"></pre>`
Add a block representation explorer to playground 2016-06-01 10:18:08 -04:00			`</div>`
XML Import/Export (#119) * Added Import/Export Area In Block Representations (Copied Some Code From scratch-blocks) * Better TextArea Size For XML * Made Import/Export It's Own Catatagory 1/3 * Made Import/Export It's Own Catatagory 2/3 * Made Import/Export It's Own Catatagory 3/3 * Added A Newline * Removed Port 80 From StartServerWindows.bat * </a> before <br /> * Removed taChange from HTML * No More taChange() 2016-09-02 08:27:43 -04:00			`<div id="tab-importexport">`
Offline Support [READY TO MERGE?] [ALONG WITH THE SCRATCH-RENDER PR] (#138) * Remove Fallback Project * Added A Newline and Removed Fallback Project * Made The SB2 Project Import Field Fit In More With All Other Textboxes * Better Description Of SB2 Import Field * Oops! * The XML Import Area Doses Not Need To Be Resizable! * That Didn't Work As Planned * Now it won't rezize * Added SB3New * Add Code For SB3New * Better 404 * Indentation * NodeJS complains about quotes * Moved And Renamed SB3New * Renamed Refrences * Prefix With ./ * Typo * Newline Fix * Scratch Cat By Default! * Single Quotes And Max Legth Fixed * Better Comment Above loadProject * Move newProject to index.js * Added Dependincies to index.js * Deleted newProject.js * Removed Unneeeded Semicolon * @param {?string} * Added SVG For Scxratch Cat * Now Uses Scratch Cat Offline (REQUIRES PULL REQUEST MADE TO SCRATCH-RENDER TO BE MERGED OR IT WILL NOT WORK) * Added Stage PNG * Added Stage Creation * Fix Sizing Issues * Import And Compatibility With Less Hacky Image Import (Scratch-Render) * Import And Compatibility With Less Hacky Image Import (Scratch-Render) * Fixed Line Length * Added Navigation Bar * Added CSS For Drop Down Menus * Nicer Scale * Nicer Dropdowns * Remobved Dropdown CSS (It Didn't Work) * Add Scratch Player Bar CSS * Add Scratch Player Bar HTML 2016-09-12 11:05:16 -04:00			`Import/Export<br />`
Fixes for #138 (#166) * Markup/CSS adjustments * Move assets to folder * Strip extra font-family * More robust handling of project-load fail state * Move empty project creation to its own function * Move green flag/stop back out of the tab * Restore default id 2016-09-12 12:03:24 -04:00			`Project ID: <input id="projectId" value="119615668" />`
Update for RenderWebGLLocal -> RenderWebGL (#181) * Update for RenderWebGLLocal -> RenderWebGL * Move button under title 2016-09-15 19:02:03 -04:00			`<button id="projectLoadButton">Load</button>`
			`<button id="createEmptyProject">New Project</button><br />`
XML Import/Export (#119) * Added Import/Export Area In Block Representations (Copied Some Code From scratch-blocks) * Better TextArea Size For XML * Made Import/Export It's Own Catatagory 1/3 * Made Import/Export It's Own Catatagory 2/3 * Made Import/Export It's Own Catatagory 3/3 * Added A Newline * Removed Port 80 From StartServerWindows.bat * </a> before <br /> * Removed taChange from HTML * No More taChange() 2016-09-02 08:27:43 -04:00			`<p>`
Add To Playground 2016-12-03 13:25:15 -05:00			`<input type="button" value="Export to JSON" onclick="toJson()">`
XML Import/Export (#119) * Added Import/Export Area In Block Representations (Copied Some Code From scratch-blocks) * Better TextArea Size For XML * Made Import/Export It's Own Catatagory 1/3 * Made Import/Export It's Own Catatagory 2/3 * Made Import/Export It's Own Catatagory 3/3 * Added A Newline * Removed Port 80 From StartServerWindows.bat * </a> before <br /> * Removed taChange from HTML * No More taChange() 2016-09-02 08:27:43 -04:00			` `
Add To Playground 2016-12-03 13:25:15 -05:00			`<input type="button" value="Import from JSON" onclick="fromJson()" id="import">`
Fixes for #138 (#166) * Markup/CSS adjustments * Move assets to folder * Strip extra font-family * More robust handling of project-load fail state * Move empty project creation to its own function * Move green flag/stop back out of the tab * Restore default id 2016-09-12 12:03:24 -04:00			`<br /><br />`
CSS tweaks to import/export (#121) 2016-09-02 08:41:12 -04:00			`<textarea id="importExport"></textarea>`
XML Import/Export (#119) * Added Import/Export Area In Block Representations (Copied Some Code From scratch-blocks) * Better TextArea Size For XML * Made Import/Export It's Own Catatagory 1/3 * Made Import/Export It's Own Catatagory 2/3 * Made Import/Export It's Own Catatagory 3/3 * Added A Newline * Removed Port 80 From StartServerWindows.bat * </a> before <br /> * Removed taChange from HTML * No More taChange() 2016-09-02 08:27:43 -04:00			`</p>`
			`</div>`
Add a block representation explorer to playground 2016-06-01 10:18:08 -04:00			`</div>`
Add playground tools for targets, loading 2.0 projects 2016-08-31 12:28:44 -04:00
Add a basic demo playground with scratch-blocks 2016-06-01 10:04:56 -04:00			`<div id="blocks"></div>`
Add a block representation explorer to playground 2016-06-01 10:18:08 -04:00
Provide playground dependencies with webpack This confines all the files the playground needs to the playground directory. 2016-09-24 18:11:01 -04:00			`<!-- FPS counter, Syntax highlighter, Blocks, Renderer -->`
			`<script src="./vendor.js"></script>`
Update playground to use unified interface and worker 2016-06-21 15:30:36 -04:00			`<!-- VM Worker -->`
Move build outputs into a `dist/` subdirectory (#375) * Move Node output: /dist.js => /dist/node/scratch-vm.js * Move web output: /vm{.js,.min.js} => /dist/web/scratch-vm{.js,.min.js} * Update build output references in package.json and the playground's index.html * Move the VirtualMachine class out of index.js into its own file, referenced by index.js. The VirtualMachine class is otherwise unchanged. * Add .gitattributes rules for new file types which were added to this repository without specifying their text/binary attributes * Turn on source maps in webpack and add corresponding .gitignore rule 2017-01-13 16:34:26 -05:00			`<script src="./scratch-vm.js"></script>`
Add a basic demo playground with scratch-blocks 2016-06-01 10:04:56 -04:00			`<!-- Playground -->`
			`<script src="./playground.js"></script>`
XML Import/Export (#119) * Added Import/Export Area In Block Representations (Copied Some Code From scratch-blocks) * Better TextArea Size For XML * Made Import/Export It's Own Catatagory 1/3 * Made Import/Export It's Own Catatagory 2/3 * Made Import/Export It's Own Catatagory 3/3 * Added A Newline * Removed Port 80 From StartServerWindows.bat * </a> before <br /> * Removed taChange from HTML * No More taChange() 2016-09-02 08:27:43 -04:00			`<script>`
Add To Playground 2016-12-03 13:25:15 -05:00			`function toJson() {`
XML Import/Export (#119) * Added Import/Export Area In Block Representations (Copied Some Code From scratch-blocks) * Better TextArea Size For XML * Made Import/Export It's Own Catatagory 1/3 * Made Import/Export It's Own Catatagory 2/3 * Made Import/Export It's Own Catatagory 3/3 * Added A Newline * Removed Port 80 From StartServerWindows.bat * </a> before <br /> * Removed taChange from HTML * No More taChange() 2016-09-02 08:27:43 -04:00			`var output = document.getElementById('importExport');`
Update index.html 2016-12-04 08:39:46 -05:00			`var json = window.vm.toPrettyJSON(workspace);`
Add To Playground 2016-12-03 13:25:15 -05:00			`output.value = json;`
XML Import/Export (#119) * Added Import/Export Area In Block Representations (Copied Some Code From scratch-blocks) * Better TextArea Size For XML * Made Import/Export It's Own Catatagory 1/3 * Made Import/Export It's Own Catatagory 2/3 * Made Import/Export It's Own Catatagory 3/3 * Added A Newline * Removed Port 80 From StartServerWindows.bat * </a> before <br /> * Removed taChange from HTML * No More taChange() 2016-09-02 08:27:43 -04:00			`output.focus();`
			`output.select();`
			`}`
Tweaks from SB2 importer audit (#137) * Fix SB2 variable imports! * Fix expectedArg field types * motion_pointindirection uses math_angle * Fix "think for secs" expected input * Add handling for empty input case (empty if-else, for example) * Fix opcodes for if_else, repeat_until, set tempo * Specialized number fields for SB2 import * Convert color picker numbers to hex in SB2 import * KEY_OPTIONS -> KEY_OPTION * Backdrop blocks get BACKDROP * Update toolbox XML to match naming changes * Merge in math_angle case * Move color converter to its own utility * Fix merge conflicts * Add negative color check. * Fix keyoptions naming * Pen JSON tweak post-scratch-blocks update 2016-09-06 11:46:10 -04:00
Add To Playground 2016-12-03 13:25:15 -05:00			`function fromJson() {`
XML Import/Export (#119) * Added Import/Export Area In Block Representations (Copied Some Code From scratch-blocks) * Better TextArea Size For XML * Made Import/Export It's Own Catatagory 1/3 * Made Import/Export It's Own Catatagory 2/3 * Made Import/Export It's Own Catatagory 3/3 * Added A Newline * Removed Port 80 From StartServerWindows.bat * </a> before <br /> * Removed taChange from HTML * No More taChange() 2016-09-02 08:27:43 -04:00			`var input = document.getElementById('importExport');`
Add To Playground 2016-12-03 13:25:15 -05:00			`window.vm.fromJSON(input.value);`
XML Import/Export (#119) * Added Import/Export Area In Block Representations (Copied Some Code From scratch-blocks) * Better TextArea Size For XML * Made Import/Export It's Own Catatagory 1/3 * Made Import/Export It's Own Catatagory 2/3 * Made Import/Export It's Own Catatagory 3/3 * Added A Newline * Removed Port 80 From StartServerWindows.bat * </a> before <br /> * Removed taChange from HTML * No More taChange() 2016-09-02 08:27:43 -04:00			`}`
			`</script>`
Add a basic demo playground with scratch-blocks 2016-06-01 10:04:56 -04:00			`</body>`
			`</html>`