Derby2 pre-webpack changes

.gitignore

@@ -1,3 +1,4 @@
 .DS_Store
 *.swp
 node_modules
+.vscode

lib/App.js

@@ -18,6 +18,17 @@ var serializedViews = require('./_views');
 
 module.exports = App;
 
+globalThis.APPS = globalThis.APPS || new Map();
+
+App.register = function register(name) {
+  if (!globalThis.APPS.has(name)) {
+    globalThis.APPS.set(name, {
+      attached: false,
+      initialState: null,
+    });
+  }
+}
+
 function App(derby, name, filename, options) {
   EventEmitter.call(this);
   this.derby = derby;
@@ -33,6 +44,7 @@ function App(derby, name, filename, options) {
   this.page = null;
   this._pendingComponentMap = {};
   this._init(options);
+  App.register(name);
 }
 
 function createAppPage(derby) {
@@ -58,9 +70,10 @@ App.prototype._init = function() {
   // Must also wait for content ready so that bundle is fully downloaded.
   this._contentReady();
 };
+
 App.prototype._finishInit = function() {
-  var script = this._getScript();
-  var data = App._parseInitialData(script.nextSibling.innerHTML);
+  var script = this._getAppStateScript();
+  var data = App._parseInitialData(script.textContent);
   this.model.createConnection(data);
   this.emit('model', this.model);
   util.isProduction = data.nodeEnv === 'production';
@@ -72,7 +85,7 @@ App.prototype._finishInit = function() {
   this._waitForAttach = false;
   // Instead of attaching, do a route and render if a link was clicked before
   // the page finished attaching
-  if (this._cancelAttach) {
+  if (this._cancelAttach || this._isAttached()) {
     this.history.refresh();
     return;
   }
@@ -91,6 +104,27 @@ App.prototype._finishInit = function() {
   }
   this.emit('load', page);
 };
+
+App.prototype._isAttached = function isInitialized() {
+  const { attached } = globalThis.APPS.get(this.name);
+  return attached;
+}
+
+App.prototype._persistInitialState = function persistInitialState(state) {
+  if (this._isAttached()) {
+    return;
+  }
+  globalThis.APPS.set(this.name, {
+    attached: true,
+    initialState: state,
+  });
+}
+
+App.prototype._initialState = function initialState() {
+  const { initialState } = globalThis.APPS.get(this.name);
+  return initialState;
+}
+
 // Modified from: https://github.com/addyosmani/jquery.parts/blob/master/jquery.documentReady.js
 App.prototype._contentReady = function() {
   // Is the DOM ready to be used? Set to true once it occurs.
@@ -166,8 +200,8 @@ App.prototype._contentReady = function() {
   }
 };
 
-App.prototype._getScript = function() {
-  return document.querySelector('script[data-derby-app]');
+App.prototype._getAppStateScript = function() {
+  return document.querySelector('script[data-derby-app-state]');
 };
 
 App.prototype.use = util.use;

lib/AppForServer.js

@@ -128,9 +128,9 @@ AppForServer.prototype.writeScripts = function(backend, dir, options, cb) {
 };
 
 AppForServer.prototype._viewsSource = function(options) {
-  return '/*DERBY_SERIALIZED_VIEWS*/' +
-    'module.exports = ' + this.views.serialize(options) + ';' +
-    '/*DERBY_SERIALIZED_VIEWS_END*/';
+  return `/*DERBY_SERIALIZED_VIEWS ${this.name}*/\n` +
+    'module.exports = ' + this.views.serialize(options) + ';\n' +
+    `/*DERBY_SERIALIZED_VIEWS_END ${this.name}*/\n`;
 };
 
 AppForServer.prototype.serialize = function() {

lib/PageForServer.js

@@ -31,7 +31,7 @@ PageForServer.prototype.render = function(status, ns) {
   this.res.write(pageHtml);
   this.app.emit('htmlDone', this);
 
-  this.res.write('<script type="application/json">');
+  this.res.write('<script data-derby-app-state type="application/json">');
   var tailHtml = this.get('Tail', ns);
 
   this.model.destroy('$components');

lib/bundler/index.js

@@ -13,10 +13,10 @@ module.exports = function derbyBundler(app, options) {
     // not in server
     throw new Error('Bundler plugin should only be included server-side');
   }
-  const { App, util } = app.derby;
+  var { App, util } = app.derby;
 
   App.prototype.bundle = function(backend, options, cb) {
-    const app = this;
+    var app = this;
     if (typeof options === 'function') {
       cb = options;
       options = null;
@@ -27,14 +27,14 @@ module.exports = function derbyBundler(app, options) {
     if (options.minify == null) options.minify = util.isProduction;
     // Turn all of the app's currently registered views into a javascript
     // function that can recreate them in the client
-    const viewsSource = this._viewsSource(options);
-    const bundleFiles = [];
+    var viewsSource = this._viewsSource(options);
+    var bundleFiles = [];
     backend.once('bundle', function(bundle) {
-      const derbyPath = path.dirname(path.resolve(__dirname, '..'));
+      var derbyPath = path.dirname(path.resolve(__dirname, '..'));
       bundle.require(derbyPath, {expose: 'derby'});
       // Hack to inject the views script into the Browserify bundle by replacing
       // the empty _views.js file with the generated source
-      const viewsFilename = require.resolve('../_views');
+      var viewsFilename = require.resolve('../_views');
       bundle.transform(function(filename) {
         if (filename !== viewsFilename) return through();
         return through(
@@ -64,13 +64,13 @@ module.exports = function derbyBundler(app, options) {
   };
 
   App.prototype.writeScripts = function(backend, dir, options, cb) {
-    const app = this;
+    var app = this;
     this.bundle(backend, options, function(err, source, map) {
       if (err) return cb(err);
       dir = path.join(dir, 'derby');
       if (!fs.existsSync(dir)) fs.mkdirSync(dir);
-      const filename = app.name + '-' + app.scriptHash;
-      const base = path.join(dir, filename);
+      var filename = app.name + '-' + app.scriptHash;
+      var base = path.join(dir, filename);
       app.scriptUrl = app.scriptBaseUrl + '/derby/' + filename + '.js';
 
       // Write current map and bundle files
@@ -89,11 +89,11 @@ module.exports = function derbyBundler(app, options) {
       // different versions of the app in parallel out of the same directory,
       // such as during a rolling restart.
       if (app.watchFiles) {
-        const appPrefix = app.name + '-';
-        const currentBundlePrefix = appPrefix + app.scriptHash;
-        const filenames = fs.readdirSync(dir);
-        for (let i = 0; i < filenames.length; i++) {
-          const filename = filenames[i];
+        var appPrefix = app.name + '-';
+        var currentBundlePrefix = appPrefix + app.scriptHash;
+        var filenames = fs.readdirSync(dir);
+        for (var i = 0; i < filenames.length; i++) {
+          var filename = filenames[i];
           if (filename.indexOf(appPrefix) !== 0) {
             // Not a bundle for this app, skip.
             continue;
@@ -103,7 +103,7 @@ module.exports = function derbyBundler(app, options) {
             continue;
           }
           // Older bundle for this app, clean it up.
-          const oldFilename = path.join(dir, filename);
+          var oldFilename = path.join(dir, filename);
           fs.unlinkSync(oldFilename);
         }
       }
@@ -114,7 +114,7 @@ module.exports = function derbyBundler(app, options) {
   };
 
   app.on('htmlDone', page => {
-    let bundleScriptTag = `<script async data-derby-app src="${page.app.scriptUrl}"`;
+    var bundleScriptTag = `<script async data-derby-app src="${page.app.scriptUrl}"`;
     if (page.app.scriptCrossOrigin) {
       // Scripts loaded from a different origin (such as a CDN) won't report
       // much information to the host page's window.onerror. Adding the

package.json

@@ -1,7 +1,7 @@
 {
   "name": "derby",
   "description": "MVC framework making it easy to write realtime, collaborative applications that run in both Node.js and browsers.",
-  "version": "2.0.0-rc.1",
+  "version": "2.0.0-rc.3",
   "homepage": "http://derbyjs.com/",
   "repository": {
     "type": "git",