Use NPM, node ES5, and browserify.

.gitignore

@@ -25,3 +25,17 @@ src
 
 *.swp
 *.map
+
+.eggs/
+
+# Bundled/generated JavaScript
+notebook/static/auth/js
+notebook/static/base/js
+notebook/static/edit/js
+notebook/static/notebook/js
+notebook/static/services
+notebook/static/terminal/js
+notebook/static/tree/js
+
+# npm logs
+npm-debug.log

.jshintrc

@@ -0,0 +1,6 @@
+{
+    "browserify": true,
+    "node": true,
+    "jquery": true,
+    "predef": [ "requirejs", "define", "Promise", "CodeMirror"]
+}

README.md

@@ -27,3 +27,36 @@ pip install --pre -e .
 jupyter notebook
 ```
 
+## Working on the frontend
+The Notebook frontend depends on a wide set of libraries and package managers.
+NPM is used to macro manage the frontend build process.  You can build the 
+frontend Javascript and LESS by running
+
+```
+npm run build
+```
+
+If you need to build the Javascript alone
+
+```
+npm run build:js
+```
+
+Or LESS
+
+```
+npm run build:css
+```
+
+To build specific sub components, separate using a colon.  i.e. to build only
+the terminal's Javascript
+
+```
+npm run build:js:terminal
+```
+
+To clean all built output
+
+```
+npm run clean
+```

bower.json

@@ -2,20 +2,21 @@
   "name": "jupyter-notebook-deps",
   "version": "0.0.1",
   "dependencies": {
-    "backbone": "components/backbone#~1.2",
-    "bootstrap": "components/bootstrap#~3.3",
-    "bootstrap-tour": "0.9.0",
-    "codemirror": "~5.5",
     "es6-promise": "~1.0",
     "font-awesome": "components/font-awesome#~4.2.0",
+    "requirejs": "~2.1",
     "google-caja": "5669",
+    "MathJax": "components/MathJax#~2.5",
+    "bootstrap": "components/bootstrap#~3.3",
+    "bootstrap-tour": "0.9.0",
     "jquery": "components/jquery#~2.0",
     "jquery-ui": "components/jqueryui#~1.10",
+    "codemirror": "~5.5",
+
+    "term.js": "chjj/term.js#~0.0.4",
+    "backbone": "components/backbone#~1.2",
     "marked": "~0.3",
-    "MathJax": "components/MathJax#~2.5",
     "moment": "~2.8.4",
-    "requirejs": "~2.1",
-    "term.js": "chjj/term.js#~0.0.4",
     "text-encoding": "~0.1",
     "underscore": "components/underscore#~1.5",
     "jquery-typeahead": "~2.0.0"

notebook/amd.js

@@ -0,0 +1,35 @@
+var amdWrap = require("amd-wrap-legacy");
+var glob = require("glob");
+var path = require('path');
+var fs = require('fs');
+var mkdirp = require("mkdirp");
+
+var source = "./notebook/static-src";
+var destination = "./notebook/static";
+
+glob(path.join(source, "**/*.js"), function(err, files) {
+    if (err) {
+        console.error('Could not glob files.', err);
+    } else {
+        files.forEach(function(file, index) {
+            var toFile = path.join(destination, path.relative(source, file));
+            fs.readFile(file, 'utf8', function (err, data) {
+                if (err) {
+                    console.error('Could not read file ' + file, err);
+                } else {
+                    mkdirp(path.dirname(toFile), function(err) { 
+                        if (err) {
+                            console.error('Could not mkdirp ', err);
+                        } else {
+                            fs.writeFile(toFile, amdWrap(data), function(err) {
+                                if(err) {
+                                    return console.error('Could not write file ' + toFile, err);
+                                }
+                            });
+                        } 
+                    }); 
+                }
+            });
+        });
+    }
+});

notebook/base/handlers.py

@@ -172,8 +172,8 @@ def ws_url(self):
     @property
     def contents_js_source(self):
         self.log.debug("Using contents: %s", self.settings.get('contents_js_source',
-            'services/contents'))
-        return self.settings.get('contents_js_source', 'services/contents')
+            'services/contents.bundle'))
+        return self.settings.get('contents_js_source', 'services/contents.bundle')
 
     #---------------------------------------------------------------
     # Manager objects

notebook/build.js

@@ -0,0 +1,35 @@
+var fs = require('fs');
+var aliasify = require('aliasify');
+var browserify = require('browserify');
+var mkdirp = require("mkdirp");
+var path = require('path');
+
+var aliasifyConfig = {
+    aliases: {
+        jqueryui: 'jquery-ui',
+        termjs: 'term.js',
+        caja: 'google-caja/html-css-sanitizer-minified'
+    },
+    verbose: false
+}
+
+var b = browserify({
+    paths: [
+        __dirname + '/static-src',
+        __dirname + '/static/components',
+    ],
+    debug: true,
+    fullPaths: true
+});
+
+b.transform(aliasify, aliasifyConfig);
+var mkdirp = require("mkdirp");
+b.add(__dirname + '/static-src/' + process.argv[2]);
+var toFile = __dirname + '/static/' + process.argv[3];
+mkdirp(path.dirname(toFile), function(err) { 
+    if (err) {
+        console.error('Could not mkdirp ', err);
+    } else {
+        b.bundle().pipe(fs.createWriteStream(toFile));
+    }
+});

notebook/static-src/auth/js/loginmain.js

@@ -0,0 +1,14 @@
+// Copyright (c) Jupyter Development Team.
+// Distributed under the terms of the Modified BSD License.
+
+    var IPython = require('base/js/namespace');
+    var page = require('base/js/page');
+
+    module.exports = function loginMain() {
+        var page_instance = new page.Page();
+        $('button#login_submit').addClass("btn btn-default");
+        page_instance.show();
+        $('input#password_input').focus();
+
+        IPython.page = page_instance;
+    };

notebook/static/auth/js/loginwidget.js → notebook/static-src/auth/js/loginwidget.js

@@ -1,12 +1,10 @@
 // Copyright (c) Jupyter Development Team.
 // Distributed under the terms of the Modified BSD License.
 
-define([
-    'base/js/utils',
-    'jquery',
-], function(utils, $){
     "use strict";
 
+    var utils = require('base/js/utils');
+
     var LoginWidget = function (selector, options) {
         options = options || {};
         this.base_url = options.base_url || utils.get_body_data("baseUrl");
@@ -34,5 +32,4 @@ define([
         });
     };
 
-    return {'LoginWidget': LoginWidget};
-});
+    exports.LoginWidget = LoginWidget;

notebook/static/auth/js/logoutmain.js → notebook/static-src/auth/js/logoutmain.js

@@ -1,12 +1,12 @@
 // Copyright (c) Jupyter Development Team.
 // Distributed under the terms of the Modified BSD License.
 
-define(['base/js/namespace', 'base/js/page'], function(IPython, page) {
-    function logout_main() {
+    var IPython = require('base/js/namespace');
+    var page = require('base/js/page');
+
+    module.exports = function logoutMain() {
         var page_instance = new page.Page();
         page_instance.show();
 
         IPython.page = page_instance;
-    }
-    return logout_main;
-});
+    };

notebook/static-src/auth/js/main.js

@@ -0,0 +1,5 @@
+// Copyright (c) Jupyter Development Team.
+// Distributed under the terms of the Modified BSD License.
+
+exports.login_main = require('./loginmain');
+exports.logout_main = require('./logoutmain');

notebook/static/base/js/dialog.js → notebook/static-src/base/js/dialog.js

@@ -1,11 +1,7 @@
 // Copyright (c) Jupyter Development Team.
 // Distributed under the terms of the Modified BSD License.
 
-define(function(require) {
     "use strict";
-
-    var CodeMirror = require('codemirror/lib/codemirror');
-    var $ = require('jquery');
 
     /**
      * A wrapper around bootstrap modal for easier use
@@ -37,7 +33,6 @@ define(function(require) {
      *
      **/
     var modal = function (options) {
-
         var modal = $("<div/>")
             .addClass("modal")
             .addClass("fade")
@@ -198,13 +193,11 @@ define(function(require) {
         });
 
         modal_obj.on('shown.bs.modal', function(){ editor.refresh(); });
+
     };
-    
-    var dialog = {
+
+    module.exports = {
         modal : modal,
         kernel_modal : kernel_modal,
         edit_metadata : edit_metadata,
     };
-
-    return dialog;
-});

notebook/static/base/js/events.js → notebook/static-src/base/js/events.js

@@ -8,17 +8,11 @@
 // require(['base/js/events'], function (events) {
 //     events.on("event.Namespace", function () { do_stuff(); });
 // });
+"use strict";
 
-define(['base/js/namespace', 'jquery'], function(IPython, $) {
-    "use strict";
-
+if (!window.jupyterEvents) {
     var Events = function () {};
-
-    var events = new Events();
-
-    // Backwards compatability.
-    IPython.Events = Events;
-    IPython.events = events;
-
-    return $([events]);
-});
+    window.jupyterEvents = $([new Events()]);
+}
+
+module.exports = window.jupyterEvents;

notebook/static-src/base/js/globals.js

@@ -0,0 +1,94 @@
+// Copyright (c) Jupyter Development Team.
+// Distributed under the terms of the Modified BSD License.
+
+"use strict";
+
+/**
+ * jquery, jquery-ui, and bootstrap all really on weird window level logic.
+ * This module handles the global loading of those tools. 
+ */
+module.exports = new Promise(function(resolve, reject) {
+    if (window.hasOwnProperty('jquery')) {
+        resolve();
+    }
+
+    requirejs(['jquery'], function($) {
+        var jQueryProperty = {
+            get: function() {
+                return $;
+            },
+            configurable: false
+        };
+        Object.defineProperty(window, '$', jQueryProperty);
+        Object.defineProperty(window, 'jQuery', jQueryProperty);
+        console.log('jQuery loaded and available in global namespace');
+
+        requirejs(['jqueryui', 'bootstrap'], function() {
+            if ($.prototype.modal) {
+                console.log('bootstrap loaded and injected into jQuery\'s namespace');
+            } else {
+                reject(new Error('bootstrap not injected into jQuery prototype'));
+            }
+
+            if ($.prototype.draggable && $.prototype.resizable) {
+                console.log('jQueryUI loaded and injected into jQuery\'s namespace');
+            } else {
+                reject(new Error('jQueryUI not injected into jQuery prototype'));
+            }
+
+            requirejs([
+                'codemirror/lib/codemirror',
+                'codemirror/mode/meta',
+                'codemirror/addon/comment/comment',
+                'codemirror/addon/dialog/dialog',
+                'codemirror/addon/edit/closebrackets',
+                'codemirror/addon/edit/matchbrackets',
+                'codemirror/addon/search/searchcursor',
+                'codemirror/addon/search/search',
+                'codemirror/keymap/emacs',
+                'codemirror/keymap/sublime',
+                'codemirror/keymap/vim',
+                'codemirror/mode/python/python',
+                'codemirror/addon/runmode/runmode',
+                'codemirror/mode/gfm/gfm',
+                'notebook/js/codemirror-ipython',
+                'notebook/js/codemirror-ipythongfm'
+            ], function(CodeMirror) {
+                var codeMirrorProperty = {
+                    get: function() {
+                        return CodeMirror;
+                    },
+                    configurable: false
+                };
+                Object.defineProperty(window, 'CodeMirror', codeMirrorProperty);
+                console.log('CodeMirror loaded and available in global namespace');
+
+
+                requirejs(['underscore'], function(_) {
+                    var underscoreProperty = {
+                        get: function() {
+                            return _;
+                        },
+                        configurable: false
+                    };
+                    Object.defineProperty(window, '_', underscoreProperty);
+                    console.log('underscore loaded and available in global namespace');
+
+                    resolve();
+                }, function(err) {
+                    console.error('could not load underscore');
+                    reject(err);
+                });
+            }, function(err) {
+                console.error('could not load CodeMirror and/or it\'s plugins');
+                reject(err);
+            });
+        }, function(err) {
+            console.error('could not load jqueryui and/or bootstrap');
+            reject(err);
+        });
+    }, function(err) {
+        console.error('could not load jquery');
+        reject(err);
+    });
+});