diff --git a/package.json b/package.json
index 1fcd00ef3..d7a8b859d 100644
--- a/package.json
+++ b/package.json
@@ -20,6 +20,7 @@
"devDependencies": {
"eslint": "2.7.0",
"json-loader": "0.5.4",
+ "scratch-blocks": "git+https://git@github.com/LLK/scratch-blocks.git",
"tap": "5.7.1",
"webpack": "1.13.0"
}
diff --git a/playground/index.html b/playground/index.html
new file mode 100644
index 000000000..495ed36b2
--- /dev/null
+++ b/playground/index.html
@@ -0,0 +1,81 @@
+
+
+
+
+
+ Scratch VM Playground
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 4
+
+
+
+
+
+
+
+
+
+ 1
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 0
+
+
+
+
+ 0
+
+
+
+
+
+
+ 0
+
+
+
+
+ 0
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/playground/playground.css b/playground/playground.css
new file mode 100644
index 000000000..a6292cd4a
--- /dev/null
+++ b/playground/playground.css
@@ -0,0 +1,10 @@
+body {
+ background: rgb(36,36,36);
+}
+#blocks {
+ position: absolute;
+ left: 40%;
+ right: 0;
+ top: 0;
+ bottom: 0;
+}
diff --git a/playground/playground.js b/playground/playground.js
new file mode 100644
index 000000000..da7dbfe44
--- /dev/null
+++ b/playground/playground.js
@@ -0,0 +1,19 @@
+window.onload = function() {
+ // Lots of global variables to make debugging easier
+ var vm = new window.VirtualMachine();
+ window.vm = vm;
+
+ var toolbox = document.getElementById('toolbox');
+ var workspace = window.Blockly.inject('blocks', {
+ toolbox: toolbox,
+ media: '../node_modules/scratch-blocks/media/'
+ });
+ window.workspace = workspace;
+
+ // @todo: Also bind to flyout events, block running feedback.
+ // Block events.
+ workspace.addChangeListener(vm.blockListener);
+
+ // Run threads
+ vm.runtime.start();
+};