scratch-blocks/tests/custom_procedure_playground.html

137 lines
5.2 KiB
HTML
Raw Normal View History

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<title>Custom Procedure Playground</title>
<script src="../blockly_uncompressed_vertical.js"></script>
<script src="../msg/messages.js"></script>
<script src="../blocks_vertical/vertical_extensions.js"></script>
<script src="../blocks_common/math.js"></script>
<script src="../blocks_common/text.js"></script>
<script src="../blocks_common/colour.js"></script>
<script src="../blocks_vertical/control.js"></script>
<script src="../blocks_vertical/event.js"></script>
<script src="../blocks_vertical/motion.js"></script>
<script src="../blocks_vertical/looks.js"></script>
<script src="../blocks_vertical/procedures.js"></script>
<script src="../blocks_vertical/operators.js"></script>
<script src="../blocks_vertical/pen.js"></script>
<script src="../blocks_vertical/sound.js"></script>
<script src="../blocks_vertical/sensing.js"></script>
<script src="../blocks_vertical/data.js"></script>
<style>
body {
background-color: #fff;
font-family: sans-serif;
}
h1 {
font-weight: normal;
font-size: 140%;
}
</style>
</head>
<body>
<p>This page has two workspaces. The workspace on the left (primaryWorkspace) will be the custom procedure editing workspace, which will hold a single non-deletable block. The workspace on the right will hold the resulting procedure definition and call blocks.</p>
<table width="100%">
<tr>
<td>
<div id="primaryDiv" style="height: 480px; width: 600px;"></div>
</td>
<td>
<div id="secondaryDiv" style="height: 480px; width: 600px;"></div>
</td>
</tr>
2017-10-23 17:04:44 -07:00
<tr>
<td>
<button id="text_number">Add text/number input</button>
<button id="boolean">Add boolean input</button>
<button id="label">Add label</button>
<button id="cancelButton">cancel</button>
<button id="okButton" onclick="applyMutation()">ok</button>
2017-10-23 17:04:44 -07:00
</td>
<td></td>
</tr>
</table>
<xml id="toolbox" style="display: none">
<block type="pen_clear"></block>
<block type="pen_stamp"></block>
<block type="pen_pendown"></block>
<block type="pen_penup"></block>
</xml>
2017-10-23 17:04:44 -07:00
<xml id="mutator_blocks" style="display:none">
2017-10-24 12:57:56 -07:00
<block type="procedures_mutator_root" x="25" y="25" deletable="false">
<mutation proccode="say %s %n times if %b" argumentnames="[&quot;something&quot;,&quot;this many&quot;,&quot;this is true&quot;]" argumentdefaults="[&quot;&quot;,1,false]" warp="false" argumentids="[&quot;a42&quot;, &quot;b23&quot;, &quot;c99&quot;]"/>
2017-10-24 12:57:56 -07:00
</block>
2017-10-23 17:04:44 -07:00
</xml>
<xml id="main_ws_blocks" style="display:none">
2017-10-24 12:57:56 -07:00
<block id="]){{Y!7N9ezN+j@Vr`8p" type="procedures_defnoreturn" x="25" y="25">
<statement name="custom_block">
<shadow type="procedures_callnoreturn_internal" id="caller_internal">
<mutation proccode="say %s %n times if %b" argumentnames="[&quot;something&quot;,&quot;this many&quot;,&quot;this is true&quot;]" argumentdefaults="[&quot;&quot;,1,false]" warp="false" argumentids="[&quot;a42&quot;, &quot;b23&quot;, &quot;c99&quot;]"/>
2017-10-24 12:57:56 -07:00
</shadow>
</statement>
<next>
<block id="caller_external" type="procedures_callnoreturn">
2017-10-24 12:57:56 -07:00
<mutation proccode="say %s %n times if %b"/>
<value name="input0">
<shadow id="V0~M:TxRk0Ua%osjGzh," type="text">
<field name="TEXT"/>
</shadow>
</value>
<value name="input1">
<shadow id="uPx3si(KkbL1)-XpbXoQ" type="math_number">
<field name="NUM">1</field>
</shadow>
</value>
</block>
</next>
</block>
2017-10-23 17:04:44 -07:00
</xml>
<xml id="main_ws_blocks_simpler" style="display:none">
<block id="]){{Y!7N9ezN+j@Vr`8p" type="procedures_defnoreturn" x="25" y="25">
<statement name="custom_block">
<shadow type="procedures_callnoreturn_internal" id="caller_internal">
<mutation proccode="say %s %n times if %b" argumentnames="[&quot;something&quot;,&quot;this many&quot;,&quot;this is true&quot;]" argumentdefaults="[&quot;&quot;,1,false]" warp="false" argumentids="[&quot;a42&quot;, &quot;b23&quot;, &quot;c99&quot;]"/>
</shadow>
</statement>
<next>
<block id="caller_external" type="procedures_callnoreturn">
</block>
</next>
</block>
</xml>
2017-10-24 12:57:56 -07:00
<script>
// Inject primary workspace.
var primaryWorkspace = Blockly.inject('primaryDiv',
{media: '../media/'});
2017-10-24 12:57:56 -07:00
Blockly.Xml.domToWorkspace(document.getElementById('mutator_blocks'),
primaryWorkspace);
// Inject secondary workspace.
var secondaryWorkspace = Blockly.inject('secondaryDiv',
{media: '../media/'});
2017-10-24 12:57:56 -07:00
Blockly.Xml.domToWorkspace(document.getElementById('main_ws_blocks_simpler'),
2017-10-24 12:57:56 -07:00
secondaryWorkspace);
function applyMutation() {
var mutation = primaryWorkspace.getTopBlocks()[0].mutationToDom();
console.log(mutation);
secondaryWorkspace.getBlockById('caller_external').domToMutation(mutation);
}
</script>
</body>
</html>