standalone update, uses improved local server

6004x · Dec 4, 2015 · f3c6c32 · f3c6c32
1 parent d7b3e72
commit f3c6c32
Show file tree

Hide file tree

Showing 6 changed files with 39 additions and 27 deletions.
diff --git a/Gruntfile.js b/Gruntfile.js
@@ -19,7 +19,7 @@ module.exports = function(grunt) {
                            },
             jade_standalone: {expand: true,
                               flatten: true,
-                              src: ['jade_standalone.html', 'jade.css'],
+                              src: ['jade_standalone.html', 'jade.css', 'server.py'],
                               dest: 'build/'
                              },
             jade_6004: {expand: true,

diff --git a/README.md b/README.md
@@ -29,7 +29,7 @@ Jade can be used either standalone or as embedded courseware in the
 edX framework.  To use Jade locally in standalone mode, simply change
 to the top-level directory of this repo and run
 
-    python -m SimpleHTTPServer
+    python server.py
 
 to start a basic HTTP server listening on port localhost:8000.
 You can access Jade at
@@ -39,7 +39,7 @@ You can access Jade at
 Or, of course, you can serve Jade as part of your website. For
 "production use", you can build a minified Jade distribution using
 "grunt jade_standalone" and then copying the following files from
-the build subdirectory
+the standalone subdirectory
 
     jade_standalone.html
     jade.css
@@ -51,15 +51,12 @@ the build subdirectory
     fontawesome-webfont.woff
     fontawesome-webfont.woff2
 
-As you enter schematics they are saved using the HTML5 localStorage
-persistent store supplied by your browser, which is specific to the
-particular URL (different URLs => different localStoage).  Each time
-you modify your design, it will be saved in localStorage, which
-persists across browser sessions.  Next time you browse to the URL
-above, you'll be able to pick up your design where you left off.
-Note: in many browsers localStorage does not function correctly with
-file:// URLs, which is why we needed to start a local HTTP server in
-order to access Jade.
+In the standalone version of Jade, changes are saved to the local
+server as they're made.  The saved state is for the particular .html
+file you accessed, so if you have several .html files for, say,
+different projects, their state will be stored separately.  Next time
+you browse to the URL above, you'll be able to pick up your design
+where you left off.
 
 Jade can be configured to display only certain simulation tools and
 parts.  The default configuration in jade_standalone.html shows all

diff --git a/jade_standalone.html b/jade_standalone.html
@@ -27,7 +27,6 @@
 <body>
 <div class="jade">{
   "hierarchical":"true",
-  "cloud_url": "http://localhost:8000/"
 }</div>
 </body>
 </html>
diff --git a/jade_standalone.js b/jade_standalone.js
@@ -4,58 +4,64 @@ jade_defs.services = function (jade) {
     var host;   // window target for state updates
     var jade_instance;  // jade instance whose state we'll save
 
-    jade.model.AUTOSAVE_TRIGGER = 1;  // save after every edit
+    jade.model.set_autosave_trigger(1);  // save after every edit
 
     jade.load_from_server = function (filename,shared,callback) {
     };
 
     jade.save_to_server = function (json,callback) {
         try {
             // grab the complete state and save it away
-            var state = $('.jade')[0].jade.get_state();
-            localStorage.setItem(window.location.pathname,JSON.stringify(state));
-            if (callback) callback();
+            //var state = $('.jade')[0].jade.get_state();
+            //localStorage.setItem(window.location.pathname,JSON.stringify(state));
+            //if (callback) callback();
+
+            // send to local server
+            jade.cloud_upload($('.jade')[0].jade,window.location.origin,callback);
         } catch (e) {
             console.log('Failed to save state in localStorage.');
         }
     };
 
-    jade.cloud_upload = function (j) {
+    jade.cloud_upload = function (j,url,callback) {
+        if (url === undefined) url = j.configuration.cloud_url;
         var args = {
-            url: j.configuration.cloud_url,
+            url: url,
             type: 'POST',
             dataType: 'text',
             data: {key: window.location.pathname, value: JSON.stringify(j.get_state())},
             error: function(jqXHR, textStatus, errorThrown) {
                 console.log('Error: '+errorThrown);
             },
             success: function(result) {
-                console.log('upload complete');
+                if (callback) callback();
+                //console.log('upload complete');
             }
         };
         $.ajax(args);
     };
 
-    jade.cloud_download = function (j) {
+    jade.cloud_download = function (j,url) {
+        if (url === undefined) url = j.configuration.cloud_url;
         var args = {
-            url: j.configuration.cloud_url,
+            url: url,
             type: 'POST',
             dataType: 'text',
             data: {key: window.location.pathname},
             error: function(jqXHR, textStatus, errorThrown) {
                 console.log('Error: '+errorThrown);
             },
             success: function(result) {
-                localStorage.setItem(window.location.pathname,result);
+                //localStorage.setItem(window.location.pathname,result);
                 var config = {};
                 $.extend(config,initial_config);
-                $.extend(config,JSON.parse(result));
+                if (result) $.extend(config,JSON.parse(result));
                 j.initialize(config);
             }
         };
         $.ajax(args);
 
-        console.log('cloud_download');
+        //console.log('cloud_download');
     };
 
     jade.unsaved_changes = function(which) {
@@ -86,6 +92,7 @@ jade_defs.services = function (jade) {
                 }
             else initial_config = {};
 
+            /*
             var config = {};
             $.extend(config,initial_config);
 
@@ -100,10 +107,14 @@ jade_defs.services = function (jade) {
                     console.log(e.stack);
                 }
             }
+             */
 
             // now create the editor, pass along initial configuration
             var j = new jade.Jade(div);
-            j.initialize(config);
+
+            // initialize with state from server
+            //j.initialize(config);
+            jade.cloud_download(j,window.location.origin);
         }
     };
 };

diff --git a/jade_workbook.js b/jade_workbook.js
@@ -4,7 +4,7 @@ jade_defs.services = function (jade) {
     var host;   // window target for state updates
     var jade_instance;  // jade instance whose state we'll save
 
-    jade.model.AUTOSAVE_TRIGGER = 1;  // save after every edit
+    jade.model.set_autosave_trigger(1);  // save after every edit
 
     jade.load_from_server = function (filename,shared,callback) {
     };

diff --git a/model.js b/model.js
@@ -12,6 +12,10 @@ jade_defs.model = function (jade) {
     var AUTOSAVE_TRIGGER = 25;  // number edits that triggers an autosave
     var edit_counter = 0;
 
+    function set_autosave_trigger(n) {
+        AUTOSAVE_TRIGGER = n;
+    }
+
     //////////////////////////////////////////////////////////////////////
     //
     // Modules
@@ -1326,6 +1330,7 @@ jade_defs.model = function (jade) {
 
     return {
         AUTOSAVE_TRIGGER: AUTOSAVE_TRIGGER,
+        set_autosave_trigger: set_autosave_trigger,
         get_modules: get_modules,
         clear_modules: clear_modules,
         load_modules: load_modules,