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-06-01 10:47:47 -04:00
|
|
|
<link rel="stylesheet" href="../node_modules/highlightjs/styles/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-06-01 14:17:18 -04:00
|
|
|
<h2>Scratch VM Playground</h2>
|
|
|
|
|
<button id="greenflag">Green flag</button>
|
|
|
|
|
<button id="stopall">Stop</button>
|
2016-06-07 20:44:08 -04:00
|
|
|
<p>
|
2016-06-29 20:56:55 -04:00
|
|
|
<a id="renderexplorer-link" href="#">Renderer</a><br />
|
2016-06-07 20:44:08 -04:00
|
|
|
<a id="threadexplorer-link" href="#">VM Threads</a><br />
|
|
|
|
|
<a id="blockexplorer-link" href="#">VM Block Representation</a>
|
|
|
|
|
</p>
|
2016-06-29 20:56:55 -04:00
|
|
|
<div id="tab-renderexplorer">
|
|
|
|
|
Render<br />
|
|
|
|
|
<canvas id="scratch-stage" style="width: 480px; height: 360px;"></canvas>
|
|
|
|
|
</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>
|
|
|
|
|
</div>
|
2016-06-01 10:04:56 -04:00
|
|
|
<div id="blocks"></div>
|
2016-06-01 10:18:08 -04:00
|
|
|
|
2016-06-01 10:04:56 -04:00
|
|
|
<xml id="toolbox" style="display: none">
|
2016-07-06 13:17:14 -04:00
|
|
|
<category name="Events">
|
|
|
|
|
<block type="event_whenflagclicked"></block>
|
|
|
|
|
<block type="event_whenkeypressed">
|
|
|
|
|
<value name="KEY_OPTION">
|
|
|
|
|
<shadow type="event_keyoptions"></shadow>
|
|
|
|
|
</value>
|
|
|
|
|
</block>
|
|
|
|
|
<block type="event_whenbroadcastreceived">
|
|
|
|
|
<value name="BROADCAST_OPTION">
|
|
|
|
|
<shadow type="event_broadcast_menu"></shadow>
|
|
|
|
|
</value>
|
|
|
|
|
</block>
|
|
|
|
|
<block type="event_broadcast">
|
|
|
|
|
<value name="BROADCAST_OPTION">
|
|
|
|
|
<shadow type="event_broadcast_menu"></shadow>
|
|
|
|
|
</value>
|
|
|
|
|
</block>
|
|
|
|
|
<block type="event_broadcastandwait">
|
|
|
|
|
<value name="BROADCAST_OPTION">
|
|
|
|
|
<shadow type="event_broadcast_menu"></shadow>
|
|
|
|
|
</value>
|
|
|
|
|
</block>
|
|
|
|
|
</category>
|
|
|
|
|
<category name="Control">
|
|
|
|
|
<block type="control_wait">
|
|
|
|
|
<value name="DURATION">
|
|
|
|
|
<shadow type="math_positive_number">
|
|
|
|
|
<field name="NUM">1</field>
|
|
|
|
|
</shadow>
|
|
|
|
|
</value>
|
|
|
|
|
</block>
|
|
|
|
|
<block type="control_repeat">
|
|
|
|
|
<value name="TIMES">
|
|
|
|
|
<shadow type="math_whole_number">
|
|
|
|
|
<field name="NUM">10</field>
|
|
|
|
|
</shadow>
|
|
|
|
|
</value>
|
|
|
|
|
</block>
|
|
|
|
|
<block type="control_forever"></block>
|
|
|
|
|
<block type="control_if"></block>
|
|
|
|
|
<block type="control_if_else"></block>
|
|
|
|
|
<block type="control_wait_until"></block>
|
|
|
|
|
<block type="control_repeat_until"></block>
|
|
|
|
|
<block type="control_stop">
|
|
|
|
|
<value name="STOP_OPTION">
|
|
|
|
|
<shadow type="control_stop_menu"></shadow>
|
|
|
|
|
</value>
|
|
|
|
|
</block>
|
|
|
|
|
<block type="control_start_as_clone"></block>
|
|
|
|
|
<block type="control_create_clone_of">
|
|
|
|
|
<value name="CLONE_OPTION">
|
|
|
|
|
<shadow type="control_create_clone_of_menu"></shadow>
|
|
|
|
|
</value>
|
|
|
|
|
</block>
|
|
|
|
|
<block type="control_delete_this_clone"></block>
|
|
|
|
|
</category>
|
|
|
|
|
<category name="Operators">
|
|
|
|
|
<block type="operator_add">
|
|
|
|
|
<value name="NUM1">
|
|
|
|
|
<shadow type="math_number">
|
|
|
|
|
<field name="NUM"></field>
|
|
|
|
|
</shadow>
|
|
|
|
|
</value>
|
|
|
|
|
<value name="NUM2">
|
|
|
|
|
<shadow type="math_number">
|
|
|
|
|
<field name="NUM"></field>
|
|
|
|
|
</shadow>
|
|
|
|
|
</value>
|
|
|
|
|
</block>
|
|
|
|
|
<block type="operator_subtract">
|
|
|
|
|
<value name="NUM1">
|
|
|
|
|
<shadow type="math_number">
|
|
|
|
|
<field name="NUM"></field>
|
|
|
|
|
</shadow>
|
2016-06-29 23:51:21 -04:00
|
|
|
</value>
|
2016-07-06 13:17:14 -04:00
|
|
|
<value name="NUM2">
|
2016-06-29 23:51:21 -04:00
|
|
|
<shadow type="math_number">
|
2016-07-06 13:17:14 -04:00
|
|
|
<field name="NUM"></field>
|
2016-06-29 23:51:21 -04:00
|
|
|
</shadow>
|
|
|
|
|
</value>
|
|
|
|
|
</block>
|
2016-07-06 13:17:14 -04:00
|
|
|
<block type="operator_multiply">
|
|
|
|
|
<value name="NUM1">
|
|
|
|
|
<shadow type="math_number">
|
|
|
|
|
<field name="NUM"></field>
|
|
|
|
|
</shadow>
|
2016-06-29 23:51:21 -04:00
|
|
|
</value>
|
2016-07-06 13:17:14 -04:00
|
|
|
<value name="NUM2">
|
2016-06-29 23:51:21 -04:00
|
|
|
<shadow type="math_number">
|
2016-07-06 13:17:14 -04:00
|
|
|
<field name="NUM"></field>
|
2016-06-29 23:51:21 -04:00
|
|
|
</shadow>
|
|
|
|
|
</value>
|
|
|
|
|
</block>
|
2016-07-06 13:17:14 -04:00
|
|
|
<block type="operator_divide">
|
|
|
|
|
<value name="NUM1">
|
|
|
|
|
<shadow type="math_number">
|
|
|
|
|
<field name="NUM"></field>
|
|
|
|
|
</shadow>
|
|
|
|
|
</value>
|
|
|
|
|
<value name="NUM2">
|
|
|
|
|
<shadow type="math_number">
|
|
|
|
|
<field name="NUM"></field>
|
|
|
|
|
</shadow>
|
|
|
|
|
</value>
|
|
|
|
|
</block>
|
|
|
|
|
<block type="operator_random">
|
|
|
|
|
<value name="FROM">
|
|
|
|
|
<shadow type="math_number">
|
|
|
|
|
<field name="NUM">1</field>
|
|
|
|
|
</shadow>
|
|
|
|
|
</value>
|
|
|
|
|
<value name="TO">
|
2016-06-29 23:51:21 -04:00
|
|
|
<shadow type="math_number">
|
|
|
|
|
<field name="NUM">10</field>
|
|
|
|
|
</shadow>
|
|
|
|
|
</value>
|
|
|
|
|
</block>
|
2016-07-06 13:17:14 -04:00
|
|
|
<block type="operator_lt">
|
|
|
|
|
<value name="OPERAND1">
|
|
|
|
|
<shadow type="text">
|
|
|
|
|
<field name="TEXT"></field>
|
|
|
|
|
</shadow>
|
|
|
|
|
</value>
|
|
|
|
|
<value name="OPERAND2">
|
|
|
|
|
<shadow type="text">
|
|
|
|
|
<field name="TEXT"></field>
|
|
|
|
|
</shadow>
|
|
|
|
|
</value>
|
|
|
|
|
</block>
|
|
|
|
|
<block type="operator_equals">
|
|
|
|
|
<value name="OPERAND1">
|
|
|
|
|
<shadow type="text">
|
|
|
|
|
<field name="TEXT"></field>
|
|
|
|
|
</shadow>
|
|
|
|
|
</value>
|
|
|
|
|
<value name="OPERAND2">
|
|
|
|
|
<shadow type="text">
|
|
|
|
|
<field name="TEXT"></field>
|
|
|
|
|
</shadow>
|
|
|
|
|
</value>
|
|
|
|
|
</block>
|
|
|
|
|
<block type="operator_gt">
|
|
|
|
|
<value name="OPERAND1">
|
|
|
|
|
<shadow type="text">
|
|
|
|
|
<field name="TEXT"></field>
|
|
|
|
|
</shadow>
|
|
|
|
|
</value>
|
|
|
|
|
<value name="OPERAND2">
|
|
|
|
|
<shadow type="text">
|
|
|
|
|
<field name="TEXT"></field>
|
|
|
|
|
</shadow>
|
|
|
|
|
</value>
|
|
|
|
|
</block>
|
|
|
|
|
<block type="operator_and"></block>
|
|
|
|
|
<block type="operator_or"></block>
|
|
|
|
|
<block type="operator_not"></block>
|
|
|
|
|
<block type="operator_join">
|
|
|
|
|
<value name="STRING1">
|
|
|
|
|
<shadow type="text">
|
|
|
|
|
<field name="TEXT">hello</field>
|
|
|
|
|
</shadow>
|
|
|
|
|
</value>
|
|
|
|
|
<value name="STRING2">
|
|
|
|
|
<shadow type="text">
|
|
|
|
|
<field name="TEXT">world</field>
|
|
|
|
|
</shadow>
|
|
|
|
|
</value>
|
|
|
|
|
</block>
|
|
|
|
|
<block type="operator_letter_of">
|
|
|
|
|
<value name="LETTER">
|
|
|
|
|
<shadow type="math_whole_number">
|
|
|
|
|
<field name="NUM">1</field>
|
|
|
|
|
</shadow>
|
|
|
|
|
</value>
|
|
|
|
|
<value name="STRING">
|
|
|
|
|
<shadow type="text">
|
|
|
|
|
<field name="TEXT">world</field>
|
|
|
|
|
</shadow>
|
|
|
|
|
</value>
|
|
|
|
|
</block>
|
|
|
|
|
<block type="operator_length">
|
|
|
|
|
<value name="STRING">
|
|
|
|
|
<shadow type="text">
|
|
|
|
|
<field name="TEXT">world</field>
|
|
|
|
|
</shadow>
|
|
|
|
|
</value>
|
|
|
|
|
</block>
|
|
|
|
|
<block type="operator_mod">
|
|
|
|
|
<value name="NUM1">
|
|
|
|
|
<shadow type="math_number">
|
|
|
|
|
<field name="NUM"></field>
|
|
|
|
|
</shadow>
|
|
|
|
|
</value>
|
|
|
|
|
<value name="NUM2">
|
|
|
|
|
<shadow type="math_number">
|
|
|
|
|
<field name="NUM"></field>
|
|
|
|
|
</shadow>
|
|
|
|
|
</value>
|
|
|
|
|
</block>
|
|
|
|
|
<block type="operator_round">
|
|
|
|
|
<value name="NUM">
|
|
|
|
|
<shadow type="math_number">
|
|
|
|
|
<field name="NUM"></field>
|
|
|
|
|
</shadow>
|
|
|
|
|
</value>
|
|
|
|
|
</block>
|
|
|
|
|
<block type="operator_mathop">
|
|
|
|
|
<value name="OPERATOR">
|
|
|
|
|
<shadow type="operator_mathop_menu"></shadow>
|
|
|
|
|
</value>
|
|
|
|
|
<value name="NUM">
|
2016-06-29 23:51:21 -04:00
|
|
|
<shadow type="math_number">
|
2016-07-06 13:17:14 -04:00
|
|
|
<field name="NUM"></field>
|
2016-06-29 23:51:21 -04:00
|
|
|
</shadow>
|
|
|
|
|
</value>
|
|
|
|
|
</block>
|
2016-07-06 13:17:14 -04:00
|
|
|
</category>
|
|
|
|
|
<category name="Looks">
|
|
|
|
|
<block type="looks_sayforsecs">
|
|
|
|
|
<value name="MESSAGE">
|
|
|
|
|
<shadow type="text">
|
|
|
|
|
<field name="TEXT">Hello!</field>
|
|
|
|
|
</shadow>
|
|
|
|
|
</value>
|
|
|
|
|
<value name="SECS">
|
|
|
|
|
<shadow type="math_number">
|
|
|
|
|
<field name="NUM">2</field>
|
|
|
|
|
</shadow>
|
|
|
|
|
</value>
|
|
|
|
|
</block>
|
|
|
|
|
<block type="looks_say">
|
|
|
|
|
<value name="MESSAGE">
|
|
|
|
|
<shadow type="text">
|
|
|
|
|
<field name="TEXT">Hello!</field>
|
|
|
|
|
</shadow>
|
|
|
|
|
</value>
|
|
|
|
|
</block>
|
|
|
|
|
<block type="looks_thinkforsecs">
|
|
|
|
|
<value name="MESSAGE">
|
|
|
|
|
<shadow type="text">
|
|
|
|
|
<field name="TEXT">Hmm...</field>
|
|
|
|
|
</shadow>
|
|
|
|
|
</value>
|
|
|
|
|
<value name="SECS">
|
|
|
|
|
<shadow type="math_number">
|
|
|
|
|
<field name="NUM">2</field>
|
|
|
|
|
</shadow>
|
|
|
|
|
</value>
|
|
|
|
|
</block>
|
|
|
|
|
<block type="looks_think">
|
|
|
|
|
<value name="MESSAGE">
|
|
|
|
|
<shadow type="text">
|
|
|
|
|
<field name="TEXT">Hmm...</field>
|
|
|
|
|
</shadow>
|
|
|
|
|
</value>
|
|
|
|
|
</block>
|
|
|
|
|
<block type="looks_show"></block>
|
|
|
|
|
<block type="looks_hide"></block>
|
|
|
|
|
<block type="looks_changeeffectby">
|
|
|
|
|
<value name="EFFECT">
|
|
|
|
|
<shadow type="looks_effectmenu"></shadow>
|
|
|
|
|
</value>
|
|
|
|
|
<value name="CHANGE">
|
|
|
|
|
<shadow type="math_number">
|
|
|
|
|
<field name="NUM">10</field>
|
|
|
|
|
</shadow>
|
|
|
|
|
</value>
|
|
|
|
|
</block>
|
|
|
|
|
<block type="looks_seteffectto">
|
|
|
|
|
<value name="EFFECT">
|
|
|
|
|
<shadow type="looks_effectmenu"></shadow>
|
|
|
|
|
</value>
|
|
|
|
|
<value name="VALUE">
|
|
|
|
|
<shadow type="math_number">
|
|
|
|
|
<field name="NUM">10</field>
|
|
|
|
|
</shadow>
|
|
|
|
|
</value>
|
|
|
|
|
</block>
|
|
|
|
|
<block type="looks_cleargraphiceffects"></block>
|
|
|
|
|
<block type="looks_changesizeby">
|
|
|
|
|
<value name="CHANGE">
|
|
|
|
|
<shadow type="math_number">
|
|
|
|
|
<field name="NUM">10</field>
|
|
|
|
|
</shadow>
|
|
|
|
|
</value>
|
|
|
|
|
</block>
|
|
|
|
|
<block type="looks_setsizeto">
|
|
|
|
|
<value name="SIZE">
|
|
|
|
|
<shadow type="math_number">
|
|
|
|
|
<field name="NUM">100</field>
|
|
|
|
|
</shadow>
|
|
|
|
|
</value>
|
|
|
|
|
</block>
|
|
|
|
|
<block type="looks_size"></block>
|
|
|
|
|
</category>
|
|
|
|
|
<category name="Motion">
|
2016-06-29 23:51:21 -04:00
|
|
|
<block type="motion_movesteps">
|
|
|
|
|
<value name="STEPS">
|
|
|
|
|
<shadow type="math_number">
|
|
|
|
|
<field name="NUM">10</field>
|
|
|
|
|
</shadow>
|
|
|
|
|
</value>
|
|
|
|
|
</block>
|
|
|
|
|
<block type="motion_turnright">
|
|
|
|
|
<value name="DEGREES">
|
|
|
|
|
<shadow type="math_number">
|
|
|
|
|
<field name="NUM">15</field>
|
|
|
|
|
</shadow>
|
|
|
|
|
</value>
|
|
|
|
|
</block>
|
|
|
|
|
<block type="motion_turnleft">
|
|
|
|
|
<value name="DEGREES">
|
|
|
|
|
<shadow type="math_number">
|
|
|
|
|
<field name="NUM">15</field>
|
|
|
|
|
</shadow>
|
|
|
|
|
</value>
|
|
|
|
|
</block>
|
|
|
|
|
<block type="motion_pointindirection">
|
|
|
|
|
<value name="DIRECTION">
|
|
|
|
|
<shadow type="math_number">
|
|
|
|
|
<field name="NUM">90</field>
|
|
|
|
|
</shadow>
|
|
|
|
|
</value>
|
|
|
|
|
</block>
|
|
|
|
|
<block type="motion_pointtowards">
|
|
|
|
|
<value name="TOWARDS">
|
|
|
|
|
<shadow type="motion_pointtowards_menu">
|
|
|
|
|
</shadow>
|
|
|
|
|
</value>
|
|
|
|
|
</block>
|
|
|
|
|
<block type="motion_gotoxy">
|
|
|
|
|
<value name="X">
|
|
|
|
|
<shadow type="math_number">
|
|
|
|
|
<field name="NUM">0</field>
|
|
|
|
|
</shadow>
|
|
|
|
|
</value>
|
|
|
|
|
<value name="Y">
|
|
|
|
|
<shadow type="math_number">
|
|
|
|
|
<field name="NUM">0</field>
|
|
|
|
|
</shadow>
|
|
|
|
|
</value>
|
|
|
|
|
</block>
|
2016-07-06 13:17:14 -04:00
|
|
|
<block type="motion_goto">
|
|
|
|
|
<value name="TO">
|
|
|
|
|
<shadow type="motion_goto_menu">
|
|
|
|
|
</shadow>
|
|
|
|
|
</value>
|
|
|
|
|
</block>
|
|
|
|
|
<block type="motion_glidesecstoxy">
|
|
|
|
|
<value name="SECS">
|
|
|
|
|
<shadow type="math_number">
|
|
|
|
|
<field name="NUM">1</field>
|
|
|
|
|
</shadow>
|
|
|
|
|
</value>
|
|
|
|
|
<value name="X">
|
|
|
|
|
<shadow type="math_number">
|
|
|
|
|
<field name="NUM">0</field>
|
|
|
|
|
</shadow>
|
|
|
|
|
</value>
|
|
|
|
|
<value name="Y">
|
|
|
|
|
<shadow type="math_number">
|
|
|
|
|
<field name="NUM">0</field>
|
|
|
|
|
</shadow>
|
|
|
|
|
</value>
|
|
|
|
|
</block>
|
2016-06-29 23:51:21 -04:00
|
|
|
<block type="motion_changexby">
|
|
|
|
|
<value name="DX">
|
|
|
|
|
<shadow type="math_number">
|
|
|
|
|
<field name="NUM">10</field>
|
|
|
|
|
</shadow>
|
|
|
|
|
</value>
|
|
|
|
|
</block>
|
|
|
|
|
<block type="motion_setx">
|
|
|
|
|
<value name="X">
|
|
|
|
|
<shadow type="math_number">
|
|
|
|
|
<field name="NUM">0</field>
|
|
|
|
|
</shadow>
|
|
|
|
|
</value>
|
|
|
|
|
</block>
|
|
|
|
|
<block type="motion_changeyby">
|
|
|
|
|
<value name="DY">
|
|
|
|
|
<shadow type="math_number">
|
|
|
|
|
<field name="NUM">10</field>
|
|
|
|
|
</shadow>
|
|
|
|
|
</value>
|
|
|
|
|
</block>
|
|
|
|
|
<block type="motion_sety">
|
|
|
|
|
<value name="Y">
|
|
|
|
|
<shadow type="math_number">
|
|
|
|
|
<field name="NUM">0</field>
|
|
|
|
|
</shadow>
|
|
|
|
|
</value>
|
|
|
|
|
</block>
|
2016-07-06 13:17:14 -04:00
|
|
|
<block type="motion_ifonedgebounce"></block>
|
|
|
|
|
<block type="motion_setrotationstyle">
|
|
|
|
|
<value name="STYLE">
|
|
|
|
|
<shadow type="motion_setrotationstyle_menu"></shadow>
|
|
|
|
|
</value>
|
|
|
|
|
</block>
|
2016-06-29 23:51:21 -04:00
|
|
|
<block type="motion_xposition"></block>
|
|
|
|
|
<block type="motion_yposition"></block>
|
2016-07-01 12:57:13 -04:00
|
|
|
<block type="motion_direction"></block>
|
2016-06-29 23:51:21 -04:00
|
|
|
</category>
|
2016-07-06 13:17:14 -04:00
|
|
|
</xml>
|
2016-06-01 10:04:56 -04:00
|
|
|
|
2016-06-01 10:47:47 -04:00
|
|
|
<!-- Syntax highlighter -->
|
|
|
|
|
<script src="../node_modules/highlightjs/highlight.pack.min.js"></script>
|
2016-06-01 10:04:56 -04:00
|
|
|
<!-- Scratch Blocks -->
|
|
|
|
|
<!-- For easier development between the two, use `npm link` -->
|
|
|
|
|
<script src="../node_modules/scratch-blocks/blockly_compressed_vertical.js"></script>
|
|
|
|
|
<script src="../node_modules/scratch-blocks/blocks_compressed.js"></script>
|
|
|
|
|
<script src="../node_modules/scratch-blocks/blocks_compressed_vertical.js"></script>
|
2016-06-29 20:56:55 -04:00
|
|
|
<!-- Renderer -->
|
|
|
|
|
<script src="../node_modules/scratch-render-webgl/build/render-webgl.js"></script>
|
2016-06-21 15:30:36 -04:00
|
|
|
<!-- VM Worker -->
|
|
|
|
|
<script src="../vm.worker.js"></script>
|
2016-06-01 10:04:56 -04:00
|
|
|
<!-- Playground -->
|
|
|
|
|
<script src="./playground.js"></script>
|
|
|
|
|
</body>
|
|
|
|
|
</html>
|
