scratchfoundation/scratch-vm
1
0
Fork 0
mirror of https://github.com/scratchfoundation/scratch-vm.git synced 2025-03-14 01:09:51 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions1

Add a block representation explorer to playground

Browse source
This commit is contained in:
Tim Mickel 2016-06-01 10:18:08 -04:00
parent 1c253df3a2
commit 8374d116bf
3 changed files with 31 additions and 0 deletions

7
playground/index.html
View file

@ -7,7 +7,14 @@
<link rel="stylesheet" href="playground.css"> <link rel="stylesheet" href="playground.css">
</head> </head>
<body> <body>
<div id="vm-devtools">
<div id="tab-blockexplorer">
<h2>VM Block Representation</h2>
<textarea id="blockexplorer"></textarea>
</div>
</div>
<div id="blocks"></div> <div id="blocks"></div>
<xml id="toolbox" style="display: none"> <xml id="toolbox" style="display: none">
<category name="Events"> <category name="Events">
<block type="event_whenflagclicked"></block> <block type="event_whenflagclicked"></block>

18
playground/playground.css
View file

@ -8,3 +8,21 @@ body {
top: 0; top: 0;
bottom: 0; bottom: 0;
} }
#vm-devtools {
color: rgb(217,217,217);
position: absolute;
left: 1%;
right: 60%;
top: 0;
bottom: 0;
width: 35%;
}
#blockexplorer {
position: absolute;
width: 100%;
height: 90%;
border: 1px solid #fff;
background: rgb(36,36,36);
color: rgb(217,217,217);
font-family: monospace;
}

6
playground/playground.js
View file

@ -14,6 +14,12 @@ window.onload = function() {
// Block events. // Block events.
workspace.addChangeListener(vm.blockListener); workspace.addChangeListener(vm.blockListener);
var explorer = document.getElementById('blockexplorer');
workspace.addChangeListener(function() {
// On a change, update the block explorer.
explorer.innerHTML = JSON.stringify(vm.runtime.blocks, null, 2);
});
// Run threads // Run threads
vm.runtime.start(); vm.runtime.start();
}; };