Update to use syntax highlighting in block explorer

This commit is contained in:
Tim Mickel 2016-06-01 10:47:47 -04:00
parent 4df584bc20
commit 6593c399c1
4 changed files with 8 additions and 2 deletions

View file

@ -19,6 +19,7 @@
},
"devDependencies": {
"eslint": "2.7.0",
"highlightjs": "^8.7.0",
"json-loader": "0.5.4",
"scratch-blocks": "git+https://git@github.com/LLK/scratch-blocks.git",
"tap": "5.7.1",

View file

@ -5,12 +5,13 @@
<meta charset="utf-8">
<title>Scratch VM Playground</title>
<link rel="stylesheet" href="playground.css">
<link rel="stylesheet" href="../node_modules/highlightjs/styles/zenburn.css">
</head>
<body>
<div id="vm-devtools">
<div id="tab-blockexplorer">
<h2>VM Block Representation</h2>
<textarea id="blockexplorer" spellcheck="false"></textarea>
<pre id="blockexplorer"></pre>
</div>
</div>
<div id="blocks"></div>
@ -75,6 +76,8 @@
</category>
</xml>
<!-- Syntax highlighter -->
<script src="../node_modules/highlightjs/highlight.pack.min.js"></script>
<!-- Scratch Blocks -->
<!-- For easier development between the two, use `npm link` -->
<script src="../node_modules/scratch-blocks/blockly_compressed_vertical.js"></script>

View file

@ -20,7 +20,8 @@ body {
#blockexplorer {
position: absolute;
width: 100%;
height: 90%;
height: 80%;
overflow: scroll;
border: 1px solid #fff;
background: rgb(36,36,36);
color: rgb(217,217,217);

View file

@ -18,6 +18,7 @@ window.onload = function() {
workspace.addChangeListener(function() {
// On a change, update the block explorer.
explorer.innerHTML = JSON.stringify(vm.runtime.blocks, null, 2);
window.hljs.highlightBlock(explorer);
});
// Run threads