Setup new-dashboard to use browserify

- Had to update grunt-contrib-jasmine to latest version to allow
exclude-globs to work.
- Removed the need for a special browserify_modules dir, the module
code can coexist in existing dir structure.
- Migrated the existing new-dashboard files to browserify structure.

.gitignore

@@ -44,6 +44,7 @@ npm-debug.log
 lib/build/dist
 lib/build/grunt-aws.json
 lib/build/app_config.js
+lib/build/.grunt/**/*
 rubygems
 vendor/bundle/*
 .vagrant

Gruntfile.js

@@ -35,7 +35,6 @@
         src: 'lib/assets/javascripts/cartodb/browserify_modules',
         dest: '.grunt/browserify_modules',
         tests: {
-          src: 'lib/assets/test/spec/cartodb/browserify_modules/**/*.js',
           dest: '.grunt/browserify_modules_tests.js'
         }
       },

app/views/admin/visualizations/new-dashboard.html.erb

@@ -2,7 +2,7 @@
   <%= current_user.username -%> |
 <% end -%>
 <%= content_for(:js) do -%>
-  <%= javascript_include_tag 'cdb.js', 'models.js', 'new_dashboard_templates.js', 'new_dashboard.js' -%>
+  <%= javascript_include_tag 'cdb.js', 'models.js', 'new_dashboard_templates.js', 'new_dashboard_deps.js', 'new_dashboard.js' -%>
   <script type="text/javascript">
     var username = "<%= current_user.username %>";
     var user_data = <%=raw current_user.data.to_json.html_safe %>;

config/application.rb

@@ -59,7 +59,7 @@ module CartoDB
     config.assets.paths << Rails.root.join('bower_components')
 
     # Default setting is [/\w+\.(?!js|css).+/, /application.(css|js)$/]
-    config.assets.precompile = %w( app.js application.js cdb.js common_data.js new_dashboard.js new_dashboard_templates.js dashboard.js keys.js login.js models.js organization.js modernizr.js statsc.js table.js public_dashboard.js public_table.js map_public.js templates.js templates_mustache.js tipsy.js common.js jquery.tipsy.js specs.js )
+    config.assets.precompile = %w( app.js application.js cdb.js common_data.js new_dashboard_deps.js new_dashboard.js new_dashboard_templates.js dashboard.js keys.js login.js models.js organization.js modernizr.js statsc.js table.js public_dashboard.js public_table.js map_public.js templates.js templates_mustache.js tipsy.js common.js jquery.tipsy.js specs.js )
     config.assets.precompile += %w( cdb.css cdb/themes/css/cartodb.css cdb/themes/css/cartodb.ie.css common.css new_dashboard.css dashboard.css db.css cartodb.css fonts_ie.css front.css keys.css leaflet.css map.css map/leaflet.ie.css organization.css pages.css plugins/tipsy.css public.css password_protected.css public_dashboard.css public_table.css public_map.css public_ie.css specs.css table.css tables.css)
     config.assets.precompile += %w( *.jpg *.ico *.gif *.png *.eot *.otf *.svg *.woff *.ttf *.swf )
 

lib/assets/javascripts/cartodb/browserify_modules/new_dashboard/console_log.js

@@ -1 +0,0 @@
-window.consoleLog = require('new_dashboard/test');

lib/assets/javascripts/cartodb/browserify_modules/new_dashboard/test.js

@@ -1,6 +0,0 @@
-module.exports = function(str, console) {
-  console = console || window.console || {info:function(){}};
-  if (console.info) {
-    console.info(str);
-  }
-};

lib/assets/javascripts/cartodb/new_dashboard/common/error_stats.js

@@ -1,3 +1,4 @@
+var cdb = require('cartodb.js');
 
 /**
  *  Class for javascript errors in CartoDB App
@@ -6,7 +7,7 @@
  *    service we set at the begining.
  */
 
-cdb.common.ErrorStats = cdb.core.Model.extend({
+module.exports = cdb.core.Model.extend({
 
   defaults: {
     name:        'trackJs',              // Name of the service

lib/assets/javascripts/cartodb/new_dashboard/common/local_storage.js

@@ -1,3 +1,4 @@
+var _ = require('underscore');
 
 /**
  *  Local storage wrapper
@@ -56,4 +57,4 @@ LocalStorageWrapper.prototype.destroy = function() {
   delete localStorage[this.name]
 }
 
-cdb.common.LocalStorage = LocalStorageWrapper;
+module.exports = LocalStorageWrapper;

lib/assets/javascripts/cartodb/new_dashboard/entry.js

@@ -1,7 +1,12 @@
+var Router = require('new_dashboard/router');
+var $ = require('jquery');
+var cdb = require('cartodb-editor');
+var ErrorStats = require('new_dashboard/common/error_stats');
+var LocalStorage = require('new_dashboard/common/local_storage');
+
 /**
 *  The Holy Dashboard
 */
-
 $(function() {
 
   cdb.dashboard.Main = cdb.core.View.extend({
@@ -37,7 +42,7 @@ $(function() {
 
       this.router = this.options.router;
       this.model = new cdb.core.Model({ first_time: true });
-      this.localStorage = new cdb.common.LocalStorage();
+      this.localStorage = new LocalStorage();
     },
 
     _onRouterChange: function(m, changes) {
@@ -269,7 +274,7 @@ $(function() {
       cdb.config.set('url_prefix', cdb.config.organizationUrl());
     }
 
-    var router = new cdb.dashboard.Router();
+    var router = new Router();
 
     // Mixpanel test
     if (window.mixpanel) {
@@ -280,7 +285,7 @@ $(function() {
     }
 
     // Store JS errors
-    var errors = new cdb.common.ErrorStats({ user_data: user_data });
+    var errors = new ErrorStats({ user_data: user_data });
 
     // Main view
     var dashboard = new cdb.dashboard.Main({
@@ -300,4 +305,4 @@ $(function() {
     });
   });
 
-});
+});

lib/assets/javascripts/cartodb/new_dashboard/router.js

@@ -1,17 +1,17 @@
-
-  /**
-   *  Backbone router for dashboard urls
-   *
-   *  - Manage all available urls
-   *    · Organization
-   *    · Shared
-   *    · Pretty urls
-   *    · ...
-   *
-   */
-
-
-cdb.dashboard.Router = Backbone.Router.extend({
+var Backbone = require('backbone');
+var _ = require('underscore');
+
+/**
+ *  Backbone router for dashboard urls
+ *
+ *  - Manage all available urls
+ *    · Organization
+ *    · Shared
+ *    · Pretty urls
+ *    · ...
+ *
+ */
+module.exports = Backbone.Router.extend({
 
   routes: {
 
@@ -202,4 +202,4 @@ cdb.dashboard.Router = Backbone.Router.extend({
     return page && _.isNumber(page) ? page : 1;
   }
 
-});
+});

lib/assets/test/spec/browserify_modules/new_dashboard/test.spec.js

@@ -1,10 +0,0 @@
-var myTest = require('new_dashboard/test');
-
-describe('test', function() {
-  it ('returns the given str as-is', function() {
-    var consoleSpy = jasmine.createSpyObj('console', ['info']);
-    myTest('foobar', consoleSpy);
-
-    expect(consoleSpy.info).toHaveBeenCalledWith('foobar');
-  });
-});

lib/assets/test/spec/cartodb/new_dashboard/common/local_storage.spec.js

@@ -1,9 +1,11 @@
-describe('cdb.common.LocalStorage', function() {
+var LocalStorage = require('new_dashboard/common/local_storage');
+
+describe('LocalStorage', function() {
   var storage;
   
   beforeEach(function() {
     delete localStorage['tests'];
-    storage = new cdb.common.LocalStorage('tests');
+    storage = new LocalStorage('tests');
   });
 
   afterEach(function() {

lib/build/files/js_files.js

@@ -2,12 +2,9 @@ var _ = require('underscore');
 
 module.exports = files = {
 
-  new_dashboard: [
-    '<%= browserify_modules.dest %>/new_dashboard.js',
+  new_dashboard_deps: [
     'vendor/assets/javascripts/jquery.tipsy.js',
-    'vendor/assets/javascripts/rails.js',
-    'lib/assets/javascripts/cartodb/new_dashboard/common/**/*.js',  // Common (right now inside new-dashboard)
-    'lib/assets/javascripts/cartodb/new_dashboard/**/*.js'          // New dashboard
+    'vendor/assets/javascripts/rails.js'
   ],
   dashboard: [
     'vendor/assets/javascripts/d3.v2.js',
@@ -127,6 +124,9 @@ module.exports = files = {
   /*'test/lib/jasmine-1.3.1/jasmine.js',
   'test/lib/jasmine-1.3.1/jasmine-html.js',*/
     'lib/assets/test/spec/cartodb/**/*.js',
+
+    // Test files that use browserify should be added in the tests bundle defined in lib/build/tasks/browserify.js
+    '!lib/assets/test/spec/cartodb/new_dashboard/**/*.js',
     '<%= browserify_modules.tests.dest %>'
   ],
 
@@ -284,7 +284,7 @@ var _all = [
   'application',
   'models',
   'dashboard',
-  'new_dashboard',
+  'new_dashboard_deps',
   'table',
   'common_data',
   'public_dashboard',

lib/build/tasks/browserify.js

@@ -8,7 +8,7 @@ module.exports = {
         preBundleCB: function (b) {
           b.plugin(remapify, [
             {
-              cwd: './lib/assets/javascripts/cartodb/browserify_modules',
+              cwd: './lib/assets/javascripts/cartodb',
               src: './**/*.js',
               expose: ''
             }
@@ -16,8 +16,8 @@ module.exports = {
         }
       },
       new_dashboard: {
-        src: '<%= browserify_modules.src %>/new_dashboard/console_log.js',
-        dest: '<%= browserify_modules.dest %>/new_dashboard.js',
+        src: '<%= browserify_modules.src %>/new_dashboard/entry.js',
+        dest: '<%= assets_dir %>/javascripts/new_dashboard.js',
         options: {
           watch: '<%= env.browserify.watch %>',
           browserifyOptions: {
@@ -26,7 +26,10 @@ module.exports = {
         }
       },
       browserify_modules_tests: {
-        src: '<%= browserify_modules.tests.src %>',
+        src: [
+          // Add test files that use browserify here:
+          'lib/assets/test/spec/cartodb/new_dashboard/**/*.js'
+        ],
         dest: '<%= browserify_modules.tests.dest %>',
         options: {
           watch: '<%= env.browserify.watch %>',

package.json

@@ -31,7 +31,7 @@
     "grunt-contrib-compress": "~0.7.0",
     "grunt-contrib-concat": "~0.3.0",
     "grunt-contrib-copy": "~0.5.0",
-    "grunt-contrib-jasmine": "~0.6.3",
+    "grunt-contrib-jasmine": "~0.8.1",
     "grunt-contrib-jst": "git://github.com/javisantana/grunt-contrib-jst.git#master",
     "grunt-contrib-sass": "~0.7.3",
     "grunt-contrib-uglify": "~0.4.0",
@@ -57,7 +57,8 @@
   "browserify-shim": {
     "jquery": "global:$",
     "underscore": "global:_",
-    "cartodbui": "global:cdb",
-    "cartodb.js": "global:cdb"
+    "cartodb-editor": "global:cdb",
+    "cartodb.js": "global:cdb",
+    "backbone": "global:Backbone"
   }
 }