Create a new JsPy module every time the editor is expanded. (To work …

…around crashes.)

apps/editor/html/editor.html

@@ -11,10 +11,6 @@
     <textarea id="output" readonly></textarea>
     <div id="tip">Press Ctrl-Enter to execute the python code.</div>
 
-    <embed id="jspy" width="0" height="0" src="/jspy/jspy.nmf" type="application/x-nacl" />
-
-
-
     <script src="ace/ace-uncompressed.js"></script>
     <script src="ace/theme-eclipse-uncompressed.js"></script>
     <script src="ace/mode-python-uncompressed.js"></script>

apps/editor/html/editor.js

@@ -25,7 +25,11 @@ var jspy = (function() {
 
     function init() {
       if (DEBUG) console.log('JSPY.init');
-      module = document.getElementById('jspy');
+      module = document.createElement('embed');
+      module.src = '/jspy/jspy.nmf';
+      module.type = 'application/x-nacl';
+      document.body.appendChild(module);
+
       module.addEventListener('load', function() {
         if (DEBUG) console.log('JSPY.load');
         // TODO: grey out Run until module is ready.

apps/udacity_ext/README.markdown

@@ -1,7 +1,5 @@
 TODO
 
-* better layout
-
 * support timeout
 * syntax checking
 
@@ -13,6 +11,7 @@ TODO
 
 Maybe
 
+* Putscroll bars around editor. (rather than right of page and bottom of code).
 * BUG: grab new codemirror if editor changes
 * ?run on contract if dirty? (to save)
 * date + time to run
@@ -21,4 +20,5 @@ DONE
 * shift-enter
 * remove autorun
 * empty response -> no output
-* line numbers for error - reset before run
+* line numbers for error - reset before run
+* better layout

apps/udacity_ext/background.js

@@ -0,0 +1,54 @@
+//HACK: some way to reload module?
+
+var jspy;
+
+var DEBUG = true;
+
+var waiting_callback;
+
+function initModule(callback) {
+  if (DEBUG) console.log('JsPy init');
+  if (jspy) {
+    jspy.parentNode.removeChild(jspy);
+  }
+  jspy = document.createElement('embed');
+  jspy.src = '/jspy/jspy.nmf';
+  jspy.type = 'application/x-nacl';
+  document.body.appendChild(jspy);
+  waiting_callback = function() { console.error('Should never be called'); };
+  jspy.addEventListener('load', function() { initModuleMessageHandler(callback); });
+}
+
+function initModuleMessageHandler(initCallback) {
+  if (DEBUG) console.log('JsPy Module loaded');
+  waiting_callback = null;
+  jspy.addEventListener('message', messageHandler);
+  initCallback();
+}
+
+function messageHandler(e) {
+  if (DEBUG) console.log('From JsPy:', e.data);
+  if (!waiting_callback) {
+    console.error('No waiting callback');
+  } else {
+    waiting_callback(e.data);
+    waiting_callback = null;
+  }
+}
+
+function handleContentScriptMessage(msg, sender, sendResponse) {
+  if (DEBUG) console.log('To   JsPy:', msg);
+  if (msg === 'init') {
+    initModule(sendResponse);
+    return;
+  }
+  if (waiting_callback) {
+    sendResponse('stderr:JSPY error: outstanding callback');
+    return;
+  }
+  waiting_callback = sendResponse;
+  jspy.postMessage(msg);
+}
+
+
+chrome.extension.onRequest.addListener(handleContentScriptMessage);

apps/udacity_ext/manifest.json

@@ -2,7 +2,9 @@
   "name": "Udacity Helper??",
   "description": "HACK: TODO: + See ... for more info.",
   "version": "0.1",
-  "background_page": "background.html",
+  "background": {
+    "scripts": ["background.js"]
+  },
   "content_scripts": [{
     "matches": ["http://www.udacity.com/*"],
     "run_at": "document_idle",

apps/udacity_ext/page.css

@@ -9,13 +9,13 @@ body.ssExpanded>.CodeMirror { display:block; }
 body.ssExpanded .CodeMirror {
   height: 100%;
   border: none;
-  border-right: solid 1px #bbb;
 }
 body.ssExpanded .CodeMirror-scroll {
   height: auto;
   overflow-y: hidden;
   overflow-x: auto;
   width: 100%;
+  border-right: solid 1px #bbb;
 }
 
 .ssErrorLine { color: red; font-weight:bold; }
@@ -38,9 +38,9 @@ body.ssExpanded .ssContractedOnly { display: none; }
 
 .ssFloating { z-index:30000; cursor:pointer; opacity:0.8; background-color:white; }
 
-#ssRun { cursor:pointer; position:fixed; top:11px; right:65px; }
+#ssButtonRun { cursor:pointer; position:fixed; top:11px; right:65px; }
 
-#ssOutput { width:100%; height:100%; overflow:auto; padding-top:0.3em; border:none; }
+#ssOutput { width:100%; height:100%; overflow:auto; padding-top:3.3em; border:none; }
 
 .ssError { color:red; }
 

apps/udacity_ext/page.html

@@ -3,7 +3,7 @@
 
 <div id="ssColRight" class="ssExpandedOnly">
   <img id="ssButtonContract" class="ssFloating" title="Close Fullscreen (Escape)"  src="BASEURL/images/arrow_contract.png"/>
-  <button id="ssRun" class="orange-button" title="To execute your code press (Shift or Ctrl) + Enter">Run</button>
+  <button id="ssButtonRun" class="orange-button" title="To execute your code press (Shift or Ctrl) + Enter">Run</button>
   <textarea id="ssOutput" disabled>Run to see results</textarea>
 </div>
 

apps/udacity_ext/ss_content_script.js

@@ -1,3 +1,5 @@
+var DEBUG = true;
+
 var dom = {};
 
 var currentlyExpanded = false;
@@ -42,7 +44,17 @@ function showOutput(result) {
   el.className = className;
 }
 
+function elide(str) {
+  if (str.length<80) return str;
+  return str.slice(0,80) + '...';
+}
+
 var PyRunner = (function() {
+  var state = {
+    running: false,
+    stopping: false
+  };
+
   var decodeResponse = function(response) {
     var i = response.indexOf(':');
     var header = response.slice(0,i);
@@ -52,16 +64,55 @@ var PyRunner = (function() {
     return result;;
   };
 
-  var run = function(pyCode, callback) {
-    var wrapper = function(r) { callback(decodeResponse(r)); };
-    chrome.extension.sendRequest(pyCode, wrapper);
+  var send = function(cmd, data, callback) {
+    var msg = cmd;
+    if (data) {
+      msg += ':' + data;
+    }
+    if (DEBUG) console.log('JSPY.send:', elide(msg));
+    chrome.extension.sendRequest(msg, callback);
   };
 
-  return { run:run };
-})();
+  var init = function(callback) {
+    send('init', null, callback);
+  };
 
+  var run = function(pyCode, callback) {
+    if (state.running) {
+      stop(function() { run(pyCode, callback); });
+    }
+    state.running = true;
+    var wrapper = function(r) {
+      state.running = false;
+      callback(decodeResponse(r));
+    };
+    send('run', pyCode, wrapper);
+  };
 
+  var stop = function(callback) {
+    if (DEBUG) console.log('JSPY: stop');
+    if (state.stopping) {
+      console.error('Already stopping!');
+      return;
+    }
+    state.stopping = true;
+    var stop_cb = function(response) {
+      if (DEBUG) console.log('JSPY stopped', response);
+      // There is a bug in the JsPy module that causes the next 'run' command to fail.
+      // so send a dummy program. TODO: fix this!
+      // Once this has (failed to) execute, JsPy is back to normal.
+      var dummyCode = 'True';
+      var stop_cb2 = function() {
+        state.stopping = false;
+        callback();
+      };
+      send('run', dummyCode, stop_cb2);
+    };
+    send('stop', null, stop_cb);
+  };
 
+  return { init:init, run:run, stop:stop };
+})();
 
 
 function make(tagname, opt_parent, opt_props) {
@@ -86,9 +137,7 @@ function doExpandEditor() {
 
   document.body.className += ' ssExpanded';
 
-  // Bug: Could not get this to work. (Screen just goes blank).
-  //dom.editor.webkitRequestFullScreen(Element.ALLOW_KEYBOARD_INPUT);
-  //document.webkitCancelFullScreen();
+  PyRunner.init(function() { console.log('SS JsPy loaded.'); });
 }
 
 function doContractEditor() {
@@ -103,21 +152,17 @@ function keyHandler(e) {
     currentlyExpanded ? doContractEditor() : doExpandEditor();
   }
 
+  // No other keys are handled when in contracted mode.
+  if (!currentlyExpanded) return;
+
   // Cmd/Ctrl-Enter runs.
   if (e.which === 13 && (e.metaKey || e.ctrlKey || e.shiftKey)) {
-    if (!currentlyExpanded) {
-      doExpandEditor();
-    }
     doRun();
     e.preventDefault();
   }
 
-  // No other keys are handled when in contracted mode.
-  // if (!currentlyExpanded) return;
-
 }
 
-// HACK: need state (in flight)
 function doRun() {
   showOutput({stdout:'Running...'});
   injectScript('SS.run();' );
@@ -147,7 +192,7 @@ function modifyEditor(editor) {
   injectHtml(  loadFile('page.html'), editor);
   injectScript(loadFile('page.js'  ), true);
 
-  document.getElementById('ssRun'           ).addEventListener('click', doRun,            false);
+  document.getElementById('ssButtonRun'     ).addEventListener('click', doRun,            false);
   document.getElementById('ssButtonExpand'  ).addEventListener('click', doExpandEditor,   false);
   document.getElementById('ssButtonContract').addEventListener('click', doContractEditor, false);
   document.addEventListener('keydown', keyHandler, false);
@@ -158,13 +203,13 @@ function waitForEditor() {
   if (editor) {
     modifyEditor(editor);
   } else {
-    console.log('.');
+    if (DEBUG) console.log('.');
     window.setTimeout(waitForEditor, 300);
   }
 }
 
 function init() {
-  console.log('init');
+  if (DEBUG) console.log('SS:init');
   window.onerror = null; // Kill the Udacity error supressor.
   waitForEditor();
 }