Edited - Finished the doAsk and answer functionality and brought the project under test.

.gitignore

@@ -0,0 +1,8 @@
+*.swp
+test/lib/*
+.DS_Store
+
+logs
+
+npm-debug.log
+node_modules

README.md

@@ -19,3 +19,50 @@ Running the HTML5 player on your own website, or locally, you will need to have
 PHP so that the `proxy.php` file can be used to load assets from the same domain.  This is done to be compatible with Javascript security models in today's browsers.  To test the HTML5 player against the Flash player you can use the compare.html web page.
 
 See the file `TESTING.md` for more details.
+
+
+Unit Tests
+----------
+The tests are written using Karma and there should be a 100% passing rate in order to commit any code to the project.
+
+The expectation is to add a unit test for any code that you contribute to the project.
+
+
+Install Node (NPM) (https://npmjs.org/)
+---------------------------------------
+
+Brew:
+```
+$ brew install npm
+```
+
+Mac Ports:
+```
+$ port install npm
+```
+
+In your local scratch directory
+
+```
+$ npm install
+```
+
+Local copy of jQuery
+--------------------
+
+```
+$ cd test/lib
+$ curl http://code.jquery.com/jquery-1.11.0.min.js > jquery-1.11.0.min.js
+```
+
+To Run the tests
+----------------
+
+```
+$ ./scripts/test.sh
+```
+
+
+To configure the unit tests
+---------------------------
+The karam.conf.js file is location in the config directory

compare.html

@@ -8,35 +8,17 @@
 <script src=//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js></script>
 <script src=//ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js></script>
 
-<script src=js/util/Timer.js></script>
-<script src=js/util/OffsetBuffer.js></script>
-<script src=js/util/Color.js></script>
-<script src=js/util/Rectangle.js></script>
-<script src=js/Sprite.js></script>
-<script src=js/Reporter.js></script>
-<script src=js/Stage.js></script>
-<script src=js/sound/WAVFile.js></script>
-<script src=js/sound/SoundDecoder.js></script>
-<script src=js/sound/SoundBank.js></script>
-<script src=js/sound/NotePlayer.js></script>
-<script src=soundbank/Instr.js></script>
-<script src=js/IO.js></script>
-<script src=js/primitives/VarListPrims.js></script>
-<script src=js/primitives/MotionAndPenPrims.js></script>
-<script src=js/primitives/LooksPrims.js></script>
-<script src=js/primitives/SensingPrims.js></script>
-<script src=js/primitives/SoundPrims.js></script>
-<script src=js/primitives/Primitives.js></script>
-<script src=js/Interpreter.js></script>
-<script src=js/Runtime.js></script>
-<script src=js/Scratch.js></script>
 
 <script>
+  $(document).ready(function() {
     var project_id = location.hash && parseInt(location.hash.substr(1)) || 10000160;
+    var scratch = new Scratch(project_id);
+  });
 </script>
 
 <script>
     var flashLog = null;
+    var project_id = location.hash && parseInt(location.hash.substr(1)) || 10000160;
     $(function() {
         // The flashvars tell flash about the project data (and autostart=true)
         var flashvars = {
@@ -133,3 +115,26 @@
     </div>
     <textarea id=flash-debug readonly></textarea>
 </div>
+
+<script src=js/util/Timer.js></script>
+<script src=js/util/OffsetBuffer.js></script>
+<script src=js/util/Color.js></script>
+<script src=js/util/Rectangle.js></script>
+<script src=js/Sprite.js></script>
+<script src=js/Reporter.js></script>
+<script src=js/Stage.js></script>
+<script src=js/sound/WAVFile.js></script>
+<script src=js/sound/SoundDecoder.js></script>
+<script src=js/sound/SoundBank.js></script>
+<script src=js/sound/NotePlayer.js></script>
+<script src=soundbank/Instr.js></script>
+<script src=js/IO.js></script>
+<script src=js/primitives/VarListPrims.js></script>
+<script src=js/primitives/MotionAndPenPrims.js></script>
+<script src=js/primitives/LooksPrims.js></script>
+<script src=js/primitives/SensingPrims.js></script>
+<script src=js/primitives/SoundPrims.js></script>
+<script src=js/primitives/Primitives.js></script>
+<script src=js/Interpreter.js></script>
+<script src=js/Runtime.js></script>
+<script src=js/Scratch.js></script>

config/karma.conf.js

@@ -0,0 +1,37 @@
+module.exports = function(config){
+    config.set({
+    basePath : '../',
+
+    files : [
+      'test/artifacts/**/*.js',
+      'test/lib/**/*.js',
+      'test/unit/**/*.js',
+      'js/sound/SoundDecoder.js',
+      'js/sound/**/*.js',
+      'js/util/**/*.js',
+      'js/**/*.js',
+      'node_modules/jasmine-jquery/lib/jasmine-jquery.js',
+      'node_modules/underscore/underscore.js'
+    ],
+
+    exclude : [
+    ],
+
+    preprocessors: {
+        '*.html': ['html2js']
+    },
+
+    autoWatch : true,
+
+    frameworks: ['jasmine'],
+
+    browsers : ['Chrome'],
+
+    plugins : [
+      'karma-jasmine',
+      'jasmine-jquery',
+      'karma-html2js-preprocessor',
+      'karma-chrome-launcher',
+      'karma-firefox-launcher'
+   ]
+})}

index.html

@@ -12,31 +12,12 @@
 
 <script src=//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js></script>
 
-<script src=js/util/Timer.js></script>
-<script src=js/util/OffsetBuffer.js></script>
-<script src=js/util/Color.js></script>
-<script src=js/util/Rectangle.js></script>
-<script src=js/Sprite.js></script>
-<script src=js/Reporter.js></script>
-<script src=js/Stage.js></script>
-<script src=js/sound/WAVFile.js></script>
-<script src=js/sound/SoundDecoder.js></script>
-<script src=js/sound/SoundBank.js></script>
-<script src=js/sound/NotePlayer.js></script>
-<script src=soundbank/Instr.js></script>
-<script src=js/IO.js></script>
-<script src=js/primitives/VarListPrims.js></script>
-<script src=js/primitives/MotionAndPenPrims.js></script>
-<script src=js/primitives/LooksPrims.js></script>
-<script src=js/primitives/SensingPrims.js></script>
-<script src=js/primitives/SoundPrims.js></script>
-<script src=js/primitives/Primitives.js></script>
-<script src=js/Interpreter.js></script>
-<script src=js/Runtime.js></script>
-<script src=js/Scratch.js></script>
 
-<script>
+<script type="text/javascript">
+  $(document).ready(function() {
     var project_id = location.hash && parseInt(location.hash.substr(1)) || 10000160;
+    var scratch = new Scratch(project_id);
+  });
 </script>
 
 <div id=player-container>
@@ -68,3 +49,27 @@
 
 <h1>Scratch HTML5 player</h1>
 <p>The Scratch HTML5 player is still in development. Feedback is welcome! Please report any bugs (or differences from the Flash player) <a href=https://github.com/LLK/scratch-html5>on Github</a>.</p>
+
+<script src=js/util/Timer.js></script>
+<script src=js/util/OffsetBuffer.js></script>
+<script src=js/util/Color.js></script>
+<script src=js/util/Rectangle.js></script>
+<script src=js/Sprite.js></script>
+<script src=js/Reporter.js></script>
+<script src=js/Stage.js></script>
+<script src=js/sound/WAVFile.js></script>
+<script src=js/sound/SoundDecoder.js></script>
+<script src=js/sound/SoundBank.js></script>
+<script src=js/sound/NotePlayer.js></script>
+<script src=soundbank/Instr.js></script>
+<script src=js/IO.js></script>
+<script src=js/primitives/VarListPrims.js></script>
+<script src=js/primitives/MotionAndPenPrims.js></script>
+<script src=js/primitives/LooksPrims.js></script>
+<script src=js/primitives/SensingPrims.js></script>
+<script src=js/primitives/SoundPrims.js></script>
+<script src=js/primitives/Primitives.js></script>
+<script src=js/Interpreter.js></script>
+<script src=js/Runtime.js></script>
+<!-- <script src=js/Scratch.js></script> -->
+<script type="text/JavaScript" src="js/Scratch.js"></script> 

js/Interpreter.js

@@ -40,6 +40,7 @@ var Thread = function(block, target) {
     this.tmp = null; // used for thread operations like Timer
     this.tmpObj = []; // used for Sprite operations like glide
     this.firstTime = true;
+    this.paused = false;
 };
 
 var Interpreter = function() {
@@ -135,6 +136,8 @@ Interpreter.prototype.stepActiveThread = function() {
     if (b == null) return;
     this.yield = false;
     while (true) {
+      if (this.activeThread.paused) return;
+
         ++this.opCount;
         // Advance the "program counter" to the next block before running the primitive.
         // Control flow primitives (e.g. if) may change activeThread.nextBlock.
@@ -247,6 +250,10 @@ Interpreter.prototype.targetSprite = function() {
     return this.activeThread.target;
 };
 
+Interpreter.prototype.targetStage = function() {
+    return runtime.stage;
+};
+
 // Timer
 Interpreter.prototype.startTimer = function(secs) {
     var waitMSecs = 1000 * secs;

js/Reporter.js

@@ -19,7 +19,6 @@ var Reporter = function(data) {
     this.cmd = data.cmd;
     this.color = data.color;
     this.isDiscrete = data.isDiscrete;
-    this.label = data.label;
     this.mode = data.mode;
     this.param = data.param;
     this.sliderMin = data.sliderMin;
@@ -30,11 +29,24 @@ var Reporter = function(data) {
     this.y = data.y;
     this.z = io.getCount();
 
+    //Set the label after hydrating the cmd and param variables
+    this.label = this.determineReporterLabel();
+
     this.el = null; // jQuery Element for the outer box
     this.valueEl = null; // jQ element containing the reporter value
     this.slider = null; // slider jQ element
 };
 
+Reporter.prototype.determineReporterLabel = function() {
+  if (this.target === 'Stage' && this.cmd === "getVar:") {
+    return this.param;
+  } else if (this.target === 'Stage' && this.param === null) {
+    return this.cmd;
+  } else {
+    return this.target + ': ' + this.param;
+  }
+}
+
 Reporter.prototype.attach = function(scene) {
     switch (this.mode) {
         case 1: // Normal
@@ -77,6 +89,9 @@ Reporter.prototype.update = function() {
     var newValue = '';
     var target = runtime.spriteNamed(this.target);
     switch (this.cmd) {
+        case 'answer':
+            newValue = target.askAnswer;
+            break;
         case 'getVar:':
             newValue = target.variables[this.param];
             break;

js/Runtime.js

@@ -88,19 +88,14 @@ Runtime.prototype.stopAll = function() {
     interp.activeThread = new Thread(null);
     interp.threads = [];
     stopAllSounds();
-    // Hide reporters
+    // Hide sprite bubbles, resetFilters and doAsk prompts
     for (var s = 0; s < runtime.sprites.length; s++) {
-        if (runtime.sprites[s].hideBubble) {
-            runtime.sprites[s].hideBubble();
-        }
+        if (runtime.sprites[s].hideBubble) runtime.sprites[s].hideBubble();
+        if (runtime.sprites[s].resetFilters) runtime.sprites[s].resetFilters();
+        if (runtime.sprites[s].hideAsk) runtime.sprites[s].hideAsk();
     }
     // Reset graphic effects
     runtime.stage.resetFilters();
-    for (var s = 0; s < runtime.sprites.length; s++) {
-        if (runtime.sprites[s].resetFilters) {
-            runtime.sprites[s].resetFilters();
-        }
-    }
 };
 
 // Step method for execution - called every 33 milliseconds

js/Scratch.js

@@ -23,7 +23,7 @@
 'use strict';
 
 var runtime, interp, io, iosAudioActive = false;
-$(function() {
+function Scratch(project_id) {
     runtime = new Runtime();
     runtime.init();
 
@@ -151,4 +151,4 @@ $(function() {
     // Load the requested project and go!
     io = new IO();
     io.loadProject(project_id);
-});
+};