Rework models to use the new 2.0 layout, extract lbclient/

api/app.api.js

@@ -4,13 +4,13 @@ var loopback = require('loopback');
 var explorer = require('loopback-explorer');
 var boot = require('loopback-boot');
 
+// model definitions
+require('../models');
+
 // server
 var server = module.exports = loopback();
 
-boot(server, {
-  appRootDir: __dirname,
-  modelsRootDir: path.resolve(__dirname, '..'),
-});
+boot(server, __dirname);
 
 // middleware
 server.use(loopback.logger('dev'));

api/models.json

@@ -0,0 +1,8 @@
+{
+  "Todo": {
+    "dataSource": "db"
+  },
+  "user": {
+    "dataSource": "db"
+  }
+}

gulpfile.js

@@ -24,6 +24,7 @@ gulp.task('run', function(cb) {
         '**/node_modules/**',
         '*/build/**',
         '**/test/**',
+        '**/*.bundle.*',
         '.*' // .git, .idea, etc.
       ],
       watch: __dirname,
@@ -68,7 +69,7 @@ function findAndBuild(packageName, cb) {
   writeGlobalConfigModule();
 
   // build each
-  async.each(packages, build, cb);
+  async.eachSeries(packages, build, cb);
 }
 
 var packageCache;
@@ -97,13 +98,27 @@ function listPackages() {
     })
     .map(function(filePath) {
       return path.basename(path.dirname(filePath));
+    })
+    .sort(function(a, b) {
+      // temporary hack - ensure lbclient is built before html5
+      if (a === 'lbclient') return -1;
+      if (b === 'lbclient') return 1;
+      if (a < b) return -1;
+      if (a > b) return 1;
+      return 0;
     });
 }
 
 function build(package, cb) {
-  var buildConfig = config.build[package];
   console.log('building', package);
-  configure(package, 'build', cb);
+  configure(package, 'build', function(err) {
+    if (err) {
+      console.error('%s build failed', package, err.stack);
+    } else {
+      console.log('%s was built', package);
+    }
+    cb(err);
+  });
 }
 
 function configure(package, scope, cb) {

html5/app.html5.js

@@ -1,11 +1,8 @@
 // dependencies
 var LOCAL_CONFIG = require('local.config');
-var loopback = require('loopback');
-var boot = require('loopback-boot');
 
 // loopback client
-var client = exports.client = loopback();
-boot(client);
+var client = exports.client = require('lbclient');
 
 // angular.js dependencies
 require('./bower_components/angular/angular.js');
@@ -23,6 +20,7 @@ var app = module.exports = angular.module('app', dependencies);
 // providers
 app.value('Todo', client.models.LocalTodo);
 app.value('sync', client.sync);
+app.value('network', client.network);
 
 // setup controllers
 // must require controllers in order for browserify

html5/configure.js

@@ -1,11 +1,8 @@
-var gulp = require('gulp');
 var async = require('async');
 var path = require('path');
 var pkg = require('./package.json');
 var fs = require('fs');
 var browserify = require('browserify');
-var sh = require('shelljs');
-var boot = require('loopback-boot');
 
 var buildDir = path.resolve(__dirname, 'build');
 
@@ -47,7 +44,9 @@ exports.global = function(env, global) {
   global.bundle += '.js';
   global.html5Views = path.join(__dirname, 'views');
   global.html5Bundle = path.join(buildDir, global.bundle);
+  global.clientBundle = path.join(buildDir, 'client.' + global.bundle);
   global.bundleURL = '/' + global.bundle;
+  global.clientURL = '/client.' + global.bundle;
 }
 
 exports.local = function configure(env, global, local) {
@@ -65,42 +64,28 @@ exports.local = function configure(env, global, local) {
 }
 
 exports.build = function(env, global, local, cb) {
-  async.waterfall([
-    function createBuildDir(next) {
-      fs.exists(buildDir, function(yes) {
-        if (yes)
-          next();
-        else
-          fs.mkdir(buildDir, next);
-      });
-    },
+  async.parallel([
     function(next) {
       createBundle(env, global, next);
+    },
+    function(next) {
+      copyClientBundle(global, next);
     }
   ], cb);
 };
 
 function createBundle(env, global, cb) {
   var b = browserify({basedir: __dirname});
   b.add('./' + pkg.main);
-
-  try {
-    boot.compileToBrowserify({
-      appRootDir: __dirname,
-      modelsRootDir: path.resolve(__dirname, '..'),
-      env: env
-    }, b);
-  } catch(err) {
-    return cb(err);
-  }
+  b.exclude('lbclient');
 
   var bundleDir = path.dirname(global.html5Bundle);
   if (!fs.existsSync(bundleDir))
     fs.mkdirSync(bundleDir);
 
   var out = fs.createWriteStream(global.html5Bundle);
 
-  if(!isDev(env)) {
+  if (!isDev(env)) {
     b.transform({
       global: true
     }, 'uglifyify');
@@ -110,12 +95,27 @@ function createBundle(env, global, cb) {
     // TODO(bajtos) debug should be always true, the sourcemaps should be
     // saved to a standalone file when !isDev(env)
     debug: isDev(env)
-  }).pipe(out);
+  })
+    .on('error', cb)
+    .pipe(out);
 
   out.on('error', cb);
   out.on('close', cb);
 }
 
+function copyClientBundle(global, cb) {
+  var clientBundle = require.resolve('../lbclient/browser.bundle.js');
+  var client = fs.createReadStream(clientBundle);
+
+  var out = fs.createWriteStream(global.clientBundle);
+
+  client
+    .on('error', cb)
+    .pipe(out)
+    .on('error', cb)
+    .on('close', cb);
+}
+
 function isDev(env) {
   return ~['debug', 'development', 'test'].indexOf(env);
 }

html5/controllers/todo.ctrl.js

@@ -2,7 +2,7 @@ module.exports = TodoCtrl;
 var app = require('../app.html5');
 var async = require('async');
 
-function TodoCtrl($scope, $routeParams, $filter, Todo, $location, sync) {
+function TodoCtrl($scope, $routeParams, $filter, Todo, $location, sync, network) {
   var todos = $scope.todos = [];
 
   $scope.newTodo = '';
@@ -97,16 +97,16 @@ function TodoCtrl($scope, $routeParams, $filter, Todo, $location, sync) {
   };
 
   $scope.connected = function() {
-    return window.connected();
+    return network.isConnected;
   };
 
   $scope.connect = function() {
-    window.isConnected = true;
+    network.isConnected = true;
     sync();
   };
 
   $scope.disconnect = function() {
-    window.isConnected = false;
+    network.isConnected = false;
   };
 
   Todo.on('conflicts', function(conflicts) {

lbclient/.gitignore

@@ -0,0 +1 @@
+browser.bundle.js

lbclient/app.client.js

@@ -0,0 +1,9 @@
+var loopback = require('loopback');
+var boot = require('loopback-boot');
+
+// model definitions
+require('../models');
+require('./models/index');
+
+var client = module.exports = loopback();
+boot(client);

html5/boot/replication.js → lbclient/boot/replication.js

@@ -11,9 +11,20 @@ module.exports = function(client) {
   var LocalTodo = client.models.LocalTodo;
   var RemoteTodo = client.models.Todo;
 
+  client.network = {
+    _isConnected: true,
+    get isConnected() {
+      console.log('isConnected?', this._isConnected);
+      return this._isConnected;
+    },
+    set isConnected(value) {
+      this._isConnected = value;
+    }
+  };
+
   // setup model replication
   function sync(cb) {
-    if (window.connected()) {
+    if (client.network.isConnected) {
       RemoteTodo.replicate(LocalTodo, function() {
         LocalTodo.replicate(RemoteTodo, cb);
       });
@@ -25,11 +36,4 @@ module.exports = function(client) {
   LocalTodo.on('deleted', sync);
 
   client.sync = sync;
-
-  window.isConnected = true;
-
-  window.connected = function connected() {
-    console.log('isConnected?', window.isConnected);
-    return window.isConnected;
-  };
 };

lbclient/configure.js

@@ -0,0 +1,54 @@
+var path = require('path');
+var pkg = require('./package.json');
+var fs = require('fs');
+var browserify = require('browserify');
+var boot = require('loopback-boot');
+
+exports.global = function(env, global) {
+};
+
+exports.local = function configure(env, global, local) {
+  // NOTE: this config will be available in the browser
+  local.serverInfo = {
+    api: global.api,
+    url: global.api.protocol
+        + '://'
+        + global.api.host
+        + ':'
+        + global.api.port
+        + global.api.root
+  };
+  local.routes = global.routes;
+};
+
+exports.build = function(env, global, local, cb) {
+  var b = browserify({ basedir: __dirname });
+  b.require('./' + pkg.main, { expose: 'lbclient' });
+
+  try {
+    boot.compileToBrowserify({
+      appRootDir: __dirname,
+      env: env
+    }, b);
+  } catch(err) {
+    return cb(err);
+  }
+
+  var bundlePath = path.resolve(__dirname, 'browser.bundle.js');
+  var out = fs.createWriteStream(path.resolve(__dirname, bundlePath));
+
+  b.bundle({
+    // TODO(bajtos) debug should be always true, the sourcemaps should be
+    // saved to a standalone file when !isDev(env)
+    debug: isDev(env)
+  })
+    .on('error', cb)
+    .pipe(out);
+
+  out.on('error', cb);
+  out.on('close', cb);
+};
+
+function isDev(env) {
+  return ~['debug', 'development', 'test'].indexOf(env);
+}

html5/datasources.json → lbclient/datasources.json

@@ -1,5 +1,5 @@
 {
-  "db": {
+  "remote": {
     "connector": "remote"
   },
   "local": {

html5/datasources.local.js → lbclient/datasources.local.js

@@ -1,7 +1,7 @@
 var LOCAL_CONFIG = require('local.config');
 
 module.exports = {
-  db: {
+  remote: {
     url: LOCAL_CONFIG.serverInfo.url
   }
 };

lbclient/models.json

@@ -0,0 +1,11 @@
+{
+  "Todo": {
+    "dataSource": "remote"
+  },
+  "LocalTodo": {
+    "dataSource": "local"
+  },
+  "user": {
+    "dataSource": "remote"
+  }
+}

lbclient/models/index.js

@@ -0,0 +1 @@
+exports.LocalTodo = require('./local-todo');

lbclient/models/local-todo.js

@@ -0,0 +1,4 @@
+var loopback = require('loopback');
+
+var LocalTodo = loopback.createModel(require('./local-todo.json'));
+module.exports = LocalTodo;

lbclient/models/local-todo.json

@@ -0,0 +1,4 @@
+{
+  "name": "LocalTodo",
+  "base": "Todo"
+}

lbclient/package.json

@@ -0,0 +1,4 @@
+{
+  "name": "client",
+  "main": "app.client.js"
+}