Remove init_widget_js, use require.js for everything

Updated examples
Fixed bug with message throttling

IPython/html/static/notebook/js/main.js

@@ -14,7 +14,8 b''
 // as injecting require.js make marked not to put itself in the globals,
 // which make both this file fail at setting marked configuration, and textcell.js
 // which search marked into global.
-require(['components/marked/lib/marked'],
+require(['components/marked/lib/marked',
+         'notebook/js/widgets/basic_widgets'],
 
 function (marked) {
 

IPython/html/static/notebook/js/notebook.js

@@ -1295,11 +1295,13 b' var IPython = (function (IPython) {'
 
 
     /**
-     * Once a session is started, link the code cells to the kernel
+     * Once a session is started, link the code cells to the kernel and pass the 
+     * comm manager to the widget manager
      *
      */
     Notebook.prototype._session_started = function(){
         this.kernel = this.session.kernel;
+        IPython.widget_manager.attach_comm_manager(this.kernel.comm_manager);
         var ncells = this.ncells();
         for (var i=0; i<ncells; i++) {
             var cell = this.get_cell(i);

IPython/html/static/notebook/js/widget.js

@@ -24,445 +24,453 b' define(["components/underscore/underscore-min",'
          "components/backbone/backbone-min",
         ], function(){
 
-    // Only run once on a notebook.
-    if (IPython.notebook.widget_manager == undefined) {
-
-        //--------------------------------------------------------------------
-        // WidgetModel class
-        //--------------------------------------------------------------------
-        var WidgetModel = Backbone.Model.extend({
-            constructor: function(comm_manager, comm, widget_view_types) {
-                this.comm_manager = comm_manager;
-                this.widget_view_types = widget_view_types;
-                this.pending_msgs = 0;
-                this.msg_throttle = 3;
-                this.msg_buffer = null;
-                this.views = {};
-
-                // Remember comm associated with the model.
-                this.comm = comm;
-                comm.model = this;
-
-                // Hook comm messages up to model.
-                comm.on_close($.proxy(this.handle_comm_closed, this));
-                comm.on_msg($.proxy(this.handle_comm_msg, this));
-
-                return Backbone.Model.apply(this);
-            },
-
-
-            update_other_views: function(caller) {
-                this.last_modified_view = caller;
-                this.save(this.changedAttributes(), {patch: true});
-
-                for (var output_area in this.views) {
-                    var views = this.views[output_area];
-                    for (var view_index in views) {
-                        var view = views[view_index];
-                        if (view !== caller) {
-                            view.update();    
-                        }
+
+    //--------------------------------------------------------------------
+    // WidgetModel class
+    //--------------------------------------------------------------------
+    var WidgetModel = Backbone.Model.extend({
+        constructor: function(comm_manager, comm, widget_view_types) {
+            this.comm_manager = comm_manager;
+            this.widget_view_types = widget_view_types;
+            this.pending_msgs = 0;
+            this.msg_throttle = 3;
+            this.msg_buffer = null;
+            this.views = {};
+
+            // Remember comm associated with the model.
+            this.comm = comm;
+            comm.model = this;
+
+            // Hook comm messages up to model.
+            comm.on_close($.proxy(this.handle_comm_closed, this));
+            comm.on_msg($.proxy(this.handle_comm_msg, this));
+
+            return Backbone.Model.apply(this);
+        },
+
+
+        update_other_views: function(caller) {
+            this.last_modified_view = caller;
+            this.save(this.changedAttributes(), {patch: true});
+
+            for (var output_area in this.views) {
+                var views = this.views[output_area];
+                for (var view_index in views) {
+                    var view = views[view_index];
+                    if (view !== caller) {
+                        view.update();    
                     }
                 }
-            },
-
-
-            handle_status: function (output_area, msg) {
-                //execution_state : ('busy', 'idle', 'starting')
-                if (msg.content.execution_state=='idle') {
-                    
-                    // Send buffer if this message caused another message to be
-                    // throttled.
-                    if (this.msg_buffer != null) {
-                        if (this.msg_throttle == this.pending_msgs && 
-                            this.msg_buffer.length > 0) {
-                            
-                            var output_area = this._get_msg_output_area(msg);
-                            var callbacks = this._make_callbacks(output_area);
-                            var data = {sync_method: 'update', sync_data: this.msg_buffer};
-                            comm.send(data, callbacks);   
-                            this.msg_buffer = null;
-                        } else {
+            }
+        },
 
-                            // Only decrease the pending message count if the buffer
-                            // doesn't get flushed (sent).
-                            --this.pending_msgs;
-                        }
-                    }
+
+        handle_status: function (output_area, msg) {
+            //execution_state : ('busy', 'idle', 'starting')
+            if (msg.content.execution_state=='idle') {
+                
+                // Send buffer if this message caused another message to be
+                // throttled.
+                if (this.msg_buffer != null &&
+                    this.msg_throttle == this.pending_msgs && 
+                    this.msg_buffer.length > 0) {
+                        
+                        var output_area = this._get_msg_output_area(msg);
+                        var callbacks = this._make_callbacks(output_area);
+                        var data = {sync_method: 'update', sync_data: this.msg_buffer};
+                        comm.send(data, callbacks);   
+                        this.msg_buffer = null;
+                } else {
+
+                    // Only decrease the pending message count if the buffer
+                    // doesn't get flushed (sent).
+                    --this.pending_msgs;
                 }
-            },
-
-
-            // Custom syncronization logic.
-            handle_sync: function (method, options) {
-                var model_json = this.toJSON();
-
-                // Only send updated state if the state hasn't been changed 
-                // during an update.
-                if (!this.updating) {
-                    if (this.pending_msgs >= this.msg_throttle) {
-                        // The throttle has been exceeded, buffer the current msg so
-                        // it can be sent once the kernel has finished processing 
-                        // some of the existing messages.
-                        if (method=='patch') {
-                            if (this.msg_buffer == null) {
-                                this.msg_buffer = $.extend({}, model_json); // Copy
-                            }
-                            for (var attr in options.attrs) {
-                                this.msg_buffer[attr] = options.attrs[attr];
-                            }
-                        } else {
+            }
+        },
+
+
+        // Custom syncronization logic.
+        handle_sync: function (method, options) {
+            var model_json = this.toJSON();
+
+            // Only send updated state if the state hasn't been changed 
+            // during an update.
+            if (!this.updating) {
+                if (this.pending_msgs >= this.msg_throttle) {
+                    // The throttle has been exceeded, buffer the current msg so
+                    // it can be sent once the kernel has finished processing 
+                    // some of the existing messages.
+                    if (method=='patch') {
+                        if (this.msg_buffer == null) {
                             this.msg_buffer = $.extend({}, model_json); // Copy
                         }
-
-                    } else {
-                        // We haven't exceeded the throttle, send the message like 
-                        // normal.  If this is a patch operation, just send the 
-                        // changes.
-                        var send_json = model_json;
-                        if (method=='patch') {
-                            send_json = {};
-                            for (var attr in options.attrs) {
-                                send_json[attr] = options.attrs[attr];
-                            }
+                        for (var attr in options.attrs) {
+                            this.msg_buffer[attr] = options.attrs[attr];
                         }
+                    } else {
+                        this.msg_buffer = $.extend({}, model_json); // Copy
+                    }
 
-                        var data = {sync_method: method, sync_data: send_json};
-                        var output_area = this.last_modified_view.output_area;
-                        var callbacks = this._make_callbacks(output_area);
-                        this.comm.send(data, callbacks);    
-                        this.pending_msgs++;
+                } else {
+                    // We haven't exceeded the throttle, send the message like 
+                    // normal.  If this is a patch operation, just send the 
+                    // changes.
+                    var send_json = model_json;
+                    if (method=='patch') {
+                        send_json = {};
+                        for (var attr in options.attrs) {
+                            send_json[attr] = options.attrs[attr];
+                        }
                     }
+
+                    var data = {sync_method: method, sync_data: send_json};
+                    var output_area = this.last_modified_view.output_area;
+                    var callbacks = this._make_callbacks(output_area);
+                    this.comm.send(data, callbacks);    
+                    this.pending_msgs++;
                 }
-                
-                // Since the comm is a one-way communication, assume the message 
-                // arrived.
-                return model_json;
-            },
-
-
-            // Handle incomming comm msg.
-            handle_comm_msg: function (msg) {
-                var method = msg.content.data.method;
-                switch (method){
-                    case 'display':
-
-                        // Try to get the cell index.
-                        var output_area = this._get_output_area(msg.parent_header.msg_id);
-                        if (output_area == null) {
-                            console.log("Could not determine where the display" + 
-                                " message was from.  Widget will not be displayed")
+            }
+            
+            // Since the comm is a one-way communication, assume the message 
+            // arrived.
+            return model_json;
+        },
+
+
+        // Handle incomming comm msg.
+        handle_comm_msg: function (msg) {
+            var method = msg.content.data.method;
+            switch (method){
+                case 'display':
+
+                    // Try to get the cell index.
+                    var output_area = this._get_output_area(msg.parent_header.msg_id);
+                    if (output_area == null) {
+                        console.log("Could not determine where the display" + 
+                            " message was from.  Widget will not be displayed")
+                    } else {
+                        this.display_view(msg.content.data.view_name, 
+                        msg.content.data.parent,
+                        output_area);
+                    }
+                    break;
+                case 'update':
+                    this.handle_update(msg.content.data.state);
+                    break;
+            }
+        },
+
+
+        // Handle when a widget is updated via the python side.
+        handle_update: function (state) {
+            this.updating = true;
+            try {
+                for (var key in state) {
+                    if (state.hasOwnProperty(key)) {
+                        if (key == "_css"){
+                            this.css = state[key];
                         } else {
-                            this.display_view(msg.content.data.view_name, 
-                            msg.content.data.parent,
-                            output_area);
-                        }
-                        break;
-                    case 'update':
-                        this.handle_update(msg.content.data.state);
-                        break;
-                }
-            },
-
-
-            // Handle when a widget is updated via the python side.
-            handle_update: function (state) {
-                this.updating = true;
-                try {
-                    for (var key in state) {
-                        if (state.hasOwnProperty(key)) {
-                            if (key == "_css"){
-                                this.css = state[key];
-                            } else {
-                                this.set(key, state[key]); 
-                            }
+                            this.set(key, state[key]); 
                         }
                     }
-                    this.id = this.comm.comm_id;
-                    this.save();
-                } finally {
-                    this.updating = false;
                 }
-            },
-
-
-            // Handle when a widget is closed.
-            handle_comm_closed: function (msg) {
-                for (var output_area in this.views) {
-                    var views = this.views[output_area];
-                    for (var view_index in views) {
-                        var view = views[view_index];
-                        view.remove();
-                    }
+                this.id = this.comm.comm_id;
+                this.save();
+            } finally {
+                this.updating = false;
+            }
+        },
+
+
+        // Handle when a widget is closed.
+        handle_comm_closed: function (msg) {
+            for (var output_area in this.views) {
+                var views = this.views[output_area];
+                for (var view_index in views) {
+                    var view = views[view_index];
+                    view.remove();
                 }
-            },
-
-
-            // Create view that represents the model.
-            display_view: function (view_name, parent_comm_id, output_area) {
-                var new_views = [];
-
-                var displayed = false;
-                if (parent_comm_id != undefined) {
-                    var parent_comm = this.comm_manager.comms[parent_comm_id];
-                    var parent_model = parent_comm.model;
-                    var parent_views = parent_model.views[output_area];
-                    for (var parent_view_index in parent_views) {
-                        var parent_view = parent_views[parent_view_index];
-                        if (parent_view.display_child != undefined) {
-                            var view = this._create_view(view_name, output_area);
-                            new_views.push(view);
-                            parent_view.display_child(view);
-                            displayed = true;
-                        }
+            }
+        },
+
+
+        // Create view that represents the model.
+        display_view: function (view_name, parent_comm_id, output_area) {
+            var new_views = [];
+
+            var displayed = false;
+            if (parent_comm_id != undefined) {
+                var parent_comm = this.comm_manager.comms[parent_comm_id];
+                var parent_model = parent_comm.model;
+                var parent_views = parent_model.views[output_area];
+                for (var parent_view_index in parent_views) {
+                    var parent_view = parent_views[parent_view_index];
+                    if (parent_view.display_child != undefined) {
+                        var view = this._create_view(view_name, output_area);
+                        new_views.push(view);
+                        parent_view.display_child(view);
+                        displayed = true;
                     }
                 }
-
-                if (!displayed) {
-                    // No parent view is defined or exists.  Add the view's 
-                    // element to cell's widget div.
-                    var view = this._create_view(view_name, output_area);
-                    new_views.push(view);
-                    this._get_widget_area_element(output_area, true)
-                        .append(view.$el);
-                
+            }
+
+            if (!displayed) {
+                // No parent view is defined or exists.  Add the view's 
+                // element to cell's widget div.
+                var view = this._create_view(view_name, output_area);
+                new_views.push(view);
+                this._get_widget_area_element(output_area, true)
+                    .append(view.$el);
+            
+            }
+
+            for (var view_index in new_views) {
+                var view = new_views[view_index];
+                view.update();
+            }
+        },
+
+
+        // Create a view
+        _create_view: function (view_name, output_area) {
+            var view = new this.widget_view_types[view_name]({model: this});
+            view.render();
+            if (this.views[output_area]==undefined) {
+                this.views[output_area] = []
+            }
+            this.views[output_area].push(view);
+            view.output_area = output_area;
+
+            // Handle when the view element is remove from the page.
+            var that = this;
+            view.$el.on("remove", function(){ 
+                var index = that.views[output_area].indexOf(view);
+                if (index > -1) {
+                    that.views[output_area].splice(index, 1);
                 }
-
-                for (var view_index in new_views) {
-                    var view = new_views[view_index];
-                    view.update();
+                view.remove(); // Clean-up view 
+                if (that.views[output_area].length()==0) {
+                    delete that.views[output_area];
                 }
-            },
-
 
-            // Create a view
-            _create_view: function (view_name, output_area) {
-                var view = new this.widget_view_types[view_name]({model: this});
-                view.render();
-                if (this.views[output_area]==undefined) {
-                    this.views[output_area] = []
+                // Close the comm if there are no views left.
+                if (that.views.length()==0) {
+                    that.comm.close();     
                 }
-                this.views[output_area].push(view);
-                view.output_area = output_area;
-
-                // Handle when the view element is remove from the page.
-                var that = this;
-                view.$el.on("remove", function(){ 
-                    var index = that.views[output_area].indexOf(view);
-                    if (index > -1) {
-                        that.views[output_area].splice(index, 1);
-                    }
-                    view.remove(); // Clean-up view 
-                    if (that.views[output_area].length()==0) {
-                        delete that.views[output_area];
-                    }
-
-                    // Close the comm if there are no views left.
-                    if (that.views.length()==0) {
-                        that.comm.close();     
-                    }
-                });
-                return view;
-            },
+            });
+            return view;
+        },
 
 
-            // Build a callback dict.
-            _make_callbacks: function (output_area) {
-                var callbacks = {};
-                if (output_area != null) {
-                    var that = this;
-                    callbacks = {
-                        iopub : {
-                            output : $.proxy(output_area.handle_output, output_area),
-                            clear_output : $.proxy(output_area.handle_clear_output, output_area),
-                            status : function(msg){
-                                that.handle_status(output_area, msg);
-                            },
-                            get_output_area : function() {
-                                if (that.last_modified_view != undefined && 
-                                    that.last_modified_view.output_area != undefined) {
-                                    return that.last_modified_view.output_area;
-                                } else {
-                                    return null
-                                }
-                            },
+        // Build a callback dict.
+        _make_callbacks: function (output_area) {
+            var callbacks = {};
+            if (output_area != null) {
+                var that = this;
+                callbacks = {
+                    iopub : {
+                        output : $.proxy(output_area.handle_output, output_area),
+                        clear_output : $.proxy(output_area.handle_clear_output, output_area),
+                        status : function(msg){
+                            that.handle_status(output_area, msg);
                         },
-                    };
-                }
-                return callbacks;
-            },
+                        get_output_area : function() {
+                            if (that.last_modified_view != undefined && 
+                                that.last_modified_view.output_area != undefined) {
+                                return that.last_modified_view.output_area;
+                            } else {
+                                return null
+                            }
+                        },
+                    },
+                };
+            }
+            return callbacks;
+        },
 
 
-            // Get the output area corresponding to the msg_id.
-            // output_area is an instance of Ipython.OutputArea
-            _get_output_area: function (msg_id) {
-                
-                // First, guess cell.execute triggered
-                var cells = IPython.notebook.get_cells();
-                for (var cell_index in cells) {
-                    if (cells[cell_index].last_msg_id == msg_id) {
-                        var cell = IPython.notebook.get_cell(cell_index)
-                        return cell.output_area;
-                    }
+        // Get the output area corresponding to the msg_id.
+        // output_area is an instance of Ipython.OutputArea
+        _get_output_area: function (msg_id) {
+            
+            // First, guess cell.execute triggered
+            var cells = IPython.notebook.get_cells();
+            for (var cell_index in cells) {
+                if (cells[cell_index].last_msg_id == msg_id) {
+                    var cell = IPython.notebook.get_cell(cell_index)
+                    return cell.output_area;
                 }
+            }
 
-                // Second, guess widget triggered
-                var callbacks = this.comm_manager.kernel.get_callbacks_for_msg(msg_id)
-                if (callbacks != undefined && callbacks.iopub != undefined && callbacks.iopub.get_output_area != undefined) {
-                    var output_area = callbacks.iopub.get_output_area();
-                    if (output_area != null) {
-                        return output_area;
-                    }
+            // Second, guess widget triggered
+            var callbacks = this.comm_manager.kernel.get_callbacks_for_msg(msg_id)
+            if (callbacks != undefined && callbacks.iopub != undefined && callbacks.iopub.get_output_area != undefined) {
+                var output_area = callbacks.iopub.get_output_area();
+                if (output_area != null) {
+                    return output_area;
                 }
-                
-                // Not triggered by a widget or a cell
-                return null;
-            },
-
-            // Gets widget output area (as a JQuery element) from the 
-            // output_area (Ipython.OutputArea instance)
-            _get_widget_area_element: function (output_area, show) {
-                var widget_area = output_area.element
-                    .parent() // output_wrapper
-                    .parent() // cell
-                    .find('.widget-area');
-                if (show) { widget_area.show(); }
-                return widget_area.find('.widget-subarea');
-            },
-
-        });
-
-
-        //--------------------------------------------------------------------
-        // WidgetView class
-        //--------------------------------------------------------------------
-        var WidgetView = Backbone.View.extend({
-            
-            initialize: function() {
-                this.visible = true;
-                this.model.on('change',this.update,this);
-                this._add_class_calls = this.model.get('_add_class')[0];
-                this._remove_class_calls = this.model.get('_remove_class')[0];
-            },
+            }
             
-            update: function() {
-                if (this.model.get('visible') != undefined) {
-                    if (this.visible != this.model.get('visible')) {
-                        this.visible = this.model.get('visible');
-                        if (this.visible) {
-                            this.$el.show();
-                        } else {
-                            this.$el.hide();
-                        }
+            // Not triggered by a widget or a cell
+            return null;
+        },
+
+        // Gets widget output area (as a JQuery element) from the 
+        // output_area (Ipython.OutputArea instance)
+        _get_widget_area_element: function (output_area, show) {
+            var widget_area = output_area.element
+                .parent() // output_wrapper
+                .parent() // cell
+                .find('.widget-area');
+            if (show) { widget_area.show(); }
+            return widget_area.find('.widget-subarea');
+        },
+
+    });
+
+
+    //--------------------------------------------------------------------
+    // WidgetView class
+    //--------------------------------------------------------------------
+    var WidgetView = Backbone.View.extend({
+        
+        initialize: function() {
+            this.visible = true;
+            this.model.on('change',this.update,this);
+            this._add_class_calls = this.model.get('_add_class')[0];
+            this._remove_class_calls = this.model.get('_remove_class')[0];
+        },
+        
+        update: function() {
+            if (this.model.get('visible') != undefined) {
+                if (this.visible != this.model.get('visible')) {
+                    this.visible = this.model.get('visible');
+                    if (this.visible) {
+                        this.$el.show();
+                    } else {
+                        this.$el.hide();
                     }
                 }
-
-                if (this.model.css != undefined) {
-                    for (var selector in this.model.css) {
-                        if (this.model.css.hasOwnProperty(selector)) {
-                            
-                            // Apply the css traits to all elements that match the selector.
-                            var elements = this.get_selector_element(selector);
-                            if (elements.length > 0) {
-                                var css_traits = this.model.css[selector];    
-                                for (var css_key in css_traits) {
-                                    if (css_traits.hasOwnProperty(css_key)) {
-                                        elements.css(css_key, css_traits[css_key]);
-                                    }
+            }
+
+            if (this.model.css != undefined) {
+                for (var selector in this.model.css) {
+                    if (this.model.css.hasOwnProperty(selector)) {
+                        
+                        // Apply the css traits to all elements that match the selector.
+                        var elements = this.get_selector_element(selector);
+                        if (elements.length > 0) {
+                            var css_traits = this.model.css[selector];    
+                            for (var css_key in css_traits) {
+                                if (css_traits.hasOwnProperty(css_key)) {
+                                    elements.css(css_key, css_traits[css_key]);
                                 }
                             }
                         }
                     }
                 }
-
-                var add_class = this.model.get('_add_class');
-                if (add_class != undefined){
-                    var add_class_calls = add_class[0];
-                    if (add_class_calls > this._add_class_calls) {
-                        this._add_class_calls = add_class_calls;
-                        var elements = this.get_selector_element(add_class[1]);
-                        if (elements.length > 0) {
-                            elements.addClass(add_class[2]);
-                        }
-                    }    
-                }
-
-                var remove_class = this.model.get('_remove_class');
-                if (remove_class != undefined){
-                    var remove_class_calls = remove_class[0];
-                    if (remove_class_calls > this._remove_class_calls) {
-                        this._remove_class_calls = remove_class_calls;
-                        var elements = this.get_selector_element(remove_class[1]);
-                        if (elements.length > 0) {
-                            elements.removeClass(remove_class[2]);
-                        }
-                    }    
-                }
-            },
-
-            get_selector_element: function(selector) {
-                // Get the elements via the css selector.  If the selector is
-                // blank, apply the style to the $el_to_style element.  If
-                // the $el_to_style element is not defined, use apply the 
-                // style to the view's element.
-                var elements = this.$el.find(selector);
-                if (selector=='') {
-                    if (this.$el_to_style == undefined) {
-                        elements = this.$el;
-                    } else {
-                        elements = this.$el_to_style;
+            }
+
+            var add_class = this.model.get('_add_class');
+            if (add_class != undefined){
+                var add_class_calls = add_class[0];
+                if (add_class_calls > this._add_class_calls) {
+                    this._add_class_calls = add_class_calls;
+                    var elements = this.get_selector_element(add_class[1]);
+                    if (elements.length > 0) {
+                        elements.addClass(add_class[2]);
                     }
+                }    
+            }
+
+            var remove_class = this.model.get('_remove_class');
+            if (remove_class != undefined){
+                var remove_class_calls = remove_class[0];
+                if (remove_class_calls > this._remove_class_calls) {
+                    this._remove_class_calls = remove_class_calls;
+                    var elements = this.get_selector_element(remove_class[1]);
+                    if (elements.length > 0) {
+                        elements.removeClass(remove_class[2]);
+                    }
+                }    
+            }
+        },
+
+        get_selector_element: function(selector) {
+            // Get the elements via the css selector.  If the selector is
+            // blank, apply the style to the $el_to_style element.  If
+            // the $el_to_style element is not defined, use apply the 
+            // style to the view's element.
+            var elements = this.$el.find(selector);
+            if (selector=='') {
+                if (this.$el_to_style == undefined) {
+                    elements = this.$el;
+                } else {
+                    elements = this.$el_to_style;
                 }
-                return elements;
-            },
-        });
-
-
-        //--------------------------------------------------------------------
-        // WidgetManager class
-        //--------------------------------------------------------------------
-        var WidgetManager = function(comm_manager){
-            this.comm_manager = comm_manager;
-            this.widget_model_types = {};
-            this.widget_view_types = {};
-            
-            var that = this;
-            Backbone.sync = function(method, model, options, error) {
-                var result = model.handle_sync(method, options);
-                if (options.success) {
-                  options.success(result);
-                }
-            }; 
+            }
+            return elements;
+        },
+    });
+
+
+    //--------------------------------------------------------------------
+    // WidgetManager class
+    //--------------------------------------------------------------------
+    var WidgetManager = function(){
+        this.comm_manager = null;
+        this.widget_model_types = {};
+        this.widget_view_types = {};
+        
+        var that = this;
+        Backbone.sync = function(method, model, options, error) {
+            var result = model.handle_sync(method, options);
+            if (options.success) {
+              options.success(result);
+            }
+        }; 
+    }
+
+
+    WidgetManager.prototype.attach_comm_manager = function (comm_manager) {
+        this.comm_manager = comm_manager;
+
+        // Register already register widget model types with the comm manager.
+        for (var widget_model_name in this.widget_model_types) {
+            this.comm_manager.register_target(widget_model_name, $.proxy(this.handle_com_open, this));
         }
+    }
 
 
-        WidgetManager.prototype.register_widget_model = function (widget_model_name, widget_model_type) {
-            // Register the widget with the comm manager.  Make sure to pass this object's context
-            // in so `this` works in the call back.
+    WidgetManager.prototype.register_widget_model = function (widget_model_name, widget_model_type) {
+        // Register the widget with the comm manager.  Make sure to pass this object's context
+        // in so `this` works in the call back.
+        if (this.comm_manager!=null) {
             this.comm_manager.register_target(widget_model_name, $.proxy(this.handle_com_open, this));
-            this.widget_model_types[widget_model_name] = widget_model_type;
         }
+        this.widget_model_types[widget_model_name] = widget_model_type;
+    }
 
 
-        WidgetManager.prototype.register_widget_view = function (widget_view_name, widget_view_type) {
-            this.widget_view_types[widget_view_name] = widget_view_type;
-        }
+    WidgetManager.prototype.register_widget_view = function (widget_view_name, widget_view_type) {
+        this.widget_view_types[widget_view_name] = widget_view_type;
+    }
 
 
-        WidgetManager.prototype.handle_com_open = function (comm, msg) {
-            var widget_type_name = msg.content.target_name;
-            var widget_model = new this.widget_model_types[widget_type_name](this.comm_manager, comm, this.widget_view_types);
-        }
+    WidgetManager.prototype.handle_com_open = function (comm, msg) {
+        var widget_type_name = msg.content.target_name;
+        var widget_model = new this.widget_model_types[widget_type_name](this.comm_manager, comm, this.widget_view_types);
+    }
 
 
-        //--------------------------------------------------------------------
-        // Init code
-        //--------------------------------------------------------------------
-        IPython.WidgetManager = WidgetManager;
-        IPython.WidgetModel = WidgetModel;
-        IPython.WidgetView = WidgetView;
+    //--------------------------------------------------------------------
+    // Init code
+    //--------------------------------------------------------------------
+    IPython.WidgetManager = WidgetManager;
+    IPython.WidgetModel = WidgetModel;
+    IPython.WidgetView = WidgetView;
 
-        IPython.notebook.widget_manager = new WidgetManager(IPython.notebook.kernel.comm_manager);    
+    IPython.widget_manager = new WidgetManager();
 
-    };
 });

IPython/html/static/notebook/js/widgets/bool.js

@@ -1,8 +1,8 b''
 
-require(["notebook/js/widget"], function(){
+define(["notebook/js/widget"], function(){
     
     var BoolWidgetModel = IPython.WidgetModel.extend({});
-    IPython.notebook.widget_manager.register_widget_model('BoolWidgetModel', BoolWidgetModel);
+    IPython.widget_manager.register_widget_model('BoolWidgetModel', BoolWidgetModel);
 
     var CheckboxView = IPython.WidgetView.extend({
       
@@ -51,7 +51,7 b' require(["notebook/js/widget"], function(){'
         
     });
 
-    IPython.notebook.widget_manager.register_widget_view('CheckboxView', CheckboxView);
+    IPython.widget_manager.register_widget_view('CheckboxView', CheckboxView);
 
     var ToggleButtonView = IPython.WidgetView.extend({
       
@@ -104,6 +104,6 b' require(["notebook/js/widget"], function(){'
         },
     });
 
-    IPython.notebook.widget_manager.register_widget_view('ToggleButtonView', ToggleButtonView);
+    IPython.widget_manager.register_widget_view('ToggleButtonView', ToggleButtonView);
 
 });

IPython/html/static/notebook/js/widgets/button.js

@@ -1,8 +1,8 b''
 
-require(["notebook/js/widget"], function(){
+define(["notebook/js/widget"], function(){
     
     var ButtonWidgetModel = IPython.WidgetModel.extend({});
-    IPython.notebook.widget_manager.register_widget_model('ButtonWidgetModel', ButtonWidgetModel);
+    IPython.widget_manager.register_widget_model('ButtonWidgetModel', ButtonWidgetModel);
 
     var ButtonView = IPython.WidgetView.extend({
       
@@ -34,6 +34,6 b' require(["notebook/js/widget"], function(){'
         
     });
 
-    IPython.notebook.widget_manager.register_widget_view('ButtonView', ButtonView);
+    IPython.widget_manager.register_widget_view('ButtonView', ButtonView);
 
 });

IPython/html/static/notebook/js/widgets/container.js

@@ -1,6 +1,6 b''
-require(["notebook/js/widget"], function(){
+define(["notebook/js/widget"], function(){
     var ContainerModel = IPython.WidgetModel.extend({});
-    IPython.notebook.widget_manager.register_widget_model('ContainerWidgetModel', ContainerModel);
+    IPython.widget_manager.register_widget_model('ContainerWidgetModel', ContainerModel);
 
     var ContainerView = IPython.WidgetView.extend({
         
@@ -42,5 +42,5 b' require(["notebook/js/widget"], function(){'
         },
     });
 
-    IPython.notebook.widget_manager.register_widget_view('ContainerView', ContainerView);
+    IPython.widget_manager.register_widget_view('ContainerView', ContainerView);
 });
  No newline at end of file

IPython/html/static/notebook/js/widgets/float.js

@@ -1,4 +1,4 b''
-require(["notebook/js/widget"], function(){
+define(["notebook/js/widget"], function(){
     var FloatWidgetModel = IPython.WidgetModel.extend({});
-    IPython.notebook.widget_manager.register_widget_model('FloatWidgetModel', FloatWidgetModel);
+    IPython.widget_manager.register_widget_model('FloatWidgetModel', FloatWidgetModel);
 });
  No newline at end of file

IPython/html/static/notebook/js/widgets/float_range.js

@@ -1,6 +1,6 b''
-require(["notebook/js/widget"], function(){
+define(["notebook/js/widget"], function(){
     var FloatRangeWidgetModel = IPython.WidgetModel.extend({});
-    IPython.notebook.widget_manager.register_widget_model('FloatRangeWidgetModel', FloatRangeWidgetModel);
+    IPython.widget_manager.register_widget_model('FloatRangeWidgetModel', FloatRangeWidgetModel);
 
     var FloatSliderView = IPython.WidgetView.extend({
         
@@ -97,7 +97,7 b' require(["notebook/js/widget"], function(){'
         },
     });
 
-    IPython.notebook.widget_manager.register_widget_view('FloatSliderView', FloatSliderView);
+    IPython.widget_manager.register_widget_view('FloatSliderView', FloatSliderView);
 
 
     var FloatTextView = IPython.WidgetView.extend({
@@ -188,7 +188,7 b' require(["notebook/js/widget"], function(){'
         }
     });
 
-    IPython.notebook.widget_manager.register_widget_view('FloatTextView', FloatTextView);
+    IPython.widget_manager.register_widget_view('FloatTextView', FloatTextView);
 
 
     var ProgressView = IPython.WidgetView.extend({
@@ -235,5 +235,5 b' require(["notebook/js/widget"], function(){'
         
     });
 
-    IPython.notebook.widget_manager.register_widget_view('ProgressView', ProgressView);
+    IPython.widget_manager.register_widget_view('ProgressView', ProgressView);
 });

IPython/html/static/notebook/js/widgets/int.js

@@ -1,4 +1,4 b''
-require(["notebook/js/widget"], function(){
+define(["notebook/js/widget"], function(){
     var IntWidgetModel = IPython.WidgetModel.extend({});
-    IPython.notebook.widget_manager.register_widget_model('IntWidgetModel', IntWidgetModel);
+    IPython.widget_manager.register_widget_model('IntWidgetModel', IntWidgetModel);
 });
  No newline at end of file

IPython/html/static/notebook/js/widgets/int_range.js

@@ -1,6 +1,6 b''
-require(["notebook/js/widget"], function(){
+define(["notebook/js/widget"], function(){
     var IntRangeWidgetModel = IPython.WidgetModel.extend({});
-    IPython.notebook.widget_manager.register_widget_model('IntRangeWidgetModel', IntRangeWidgetModel);
+    IPython.widget_manager.register_widget_model('IntRangeWidgetModel', IntRangeWidgetModel);
 
     var IntSliderView = IPython.WidgetView.extend({
         
@@ -97,7 +97,7 b' require(["notebook/js/widget"], function(){'
         },
     });
 
-    IPython.notebook.widget_manager.register_widget_view('IntSliderView', IntSliderView);
+    IPython.widget_manager.register_widget_view('IntSliderView', IntSliderView);
 
     var IntTextView = IPython.WidgetView.extend({
         
@@ -187,5 +187,5 b' require(["notebook/js/widget"], function(){'
         }
     });
 
-    IPython.notebook.widget_manager.register_widget_view('IntTextView', IntTextView);
+    IPython.widget_manager.register_widget_view('IntTextView', IntTextView);
 });

IPython/html/static/notebook/js/widgets/multicontainer.js

@@ -1,6 +1,6 b''
-require(["notebook/js/widget"], function(){
+define(["notebook/js/widget"], function(){
     var MulticontainerModel = IPython.WidgetModel.extend({});
-    IPython.notebook.widget_manager.register_widget_model('MulticontainerWidgetModel', MulticontainerModel);
+    IPython.widget_manager.register_widget_model('MulticontainerWidgetModel', MulticontainerModel);
 
     var AccordionView = IPython.WidgetView.extend({
         
@@ -57,7 +57,7 b' require(["notebook/js/widget"], function(){'
         },
     });
 
-    IPython.notebook.widget_manager.register_widget_view('AccordionView', AccordionView);
+    IPython.widget_manager.register_widget_view('AccordionView', AccordionView);
     
     var TabView = IPython.WidgetView.extend({
         
@@ -134,6 +134,6 b' require(["notebook/js/widget"], function(){'
         },
     });
 
-    IPython.notebook.widget_manager.register_widget_view('TabView', TabView);
+    IPython.widget_manager.register_widget_view('TabView', TabView);
 
 });

IPython/html/static/notebook/js/widgets/selection.js

@@ -1,6 +1,6 b''
-require(["notebook/js/widget"], function(){
+define(["notebook/js/widget"], function(){
     var SelectionWidgetModel = IPython.WidgetModel.extend({});
-    IPython.notebook.widget_manager.register_widget_model('SelectionWidgetModel', SelectionWidgetModel);
+    IPython.widget_manager.register_widget_model('SelectionWidgetModel', SelectionWidgetModel);
 
     var DropdownView = IPython.WidgetView.extend({
         
@@ -80,7 +80,7 b' require(["notebook/js/widget"], function(){'
         
     });
 
-    IPython.notebook.widget_manager.register_widget_view('DropdownView', DropdownView);
+    IPython.widget_manager.register_widget_view('DropdownView', DropdownView);
 
     var RadioButtonsView = IPython.WidgetView.extend({
         
@@ -165,7 +165,7 b' require(["notebook/js/widget"], function(){'
         
     });
 
-    IPython.notebook.widget_manager.register_widget_view('RadioButtonsView', RadioButtonsView);
+    IPython.widget_manager.register_widget_view('RadioButtonsView', RadioButtonsView);
 
 
     var ToggleButtonsView = IPython.WidgetView.extend({
@@ -247,5 +247,5 b' require(["notebook/js/widget"], function(){'
         
     });
 
-    IPython.notebook.widget_manager.register_widget_view('ToggleButtonsView', ToggleButtonsView);
+    IPython.widget_manager.register_widget_view('ToggleButtonsView', ToggleButtonsView);
 });

IPython/html/static/notebook/js/widgets/string.js

@@ -1,6 +1,6 b''
-require(["notebook/js/widget"], function(){
+define(["notebook/js/widget"], function(){
     var StringWidgetModel = IPython.WidgetModel.extend({});
-    IPython.notebook.widget_manager.register_widget_model('StringWidgetModel', StringWidgetModel);
+    IPython.widget_manager.register_widget_model('StringWidgetModel', StringWidgetModel);
 
     var LabelView = IPython.WidgetView.extend({
       
@@ -19,7 +19,7 b' require(["notebook/js/widget"], function(){'
         
     });
 
-    IPython.notebook.widget_manager.register_widget_view('LabelView', LabelView);
+    IPython.widget_manager.register_widget_view('LabelView', LabelView);
 
     var TextAreaView = IPython.WidgetView.extend({
       
@@ -73,7 +73,7 b' require(["notebook/js/widget"], function(){'
         },
     });
 
-    IPython.notebook.widget_manager.register_widget_view('TextAreaView', TextAreaView);
+    IPython.widget_manager.register_widget_view('TextAreaView', TextAreaView);
 
     var TextBoxView = IPython.WidgetView.extend({
       
@@ -127,5 +127,5 b' require(["notebook/js/widget"], function(){'
         },
     });
 
-    IPython.notebook.widget_manager.register_widget_view('TextBoxView', TextBoxView);
+    IPython.widget_manager.register_widget_view('TextBoxView', TextBoxView);
 });

IPython/html/widgets/__init__.py

@@ -1,4 +1,4 b''
-from .widget import Widget, init_widget_js
+from .widget import Widget
 
 from .widget_bool import BoolWidget
 from .widget_button import ButtonWidget

IPython/html/widgets/widget.py

@@ -26,19 +26,6 b' from IPython.utils.traitlets import Unicode, Dict, List, Instance, Bool'
 from IPython.display import Javascript, display
 from IPython.utils.py3compat import string_types
 
-#-----------------------------------------------------------------------------
-# Shared
-#-----------------------------------------------------------------------------
-def init_widget_js():
-    path = os.path.split(os.path.abspath( __file__ ))[0]
-    for filepath in glob(os.path.join(path, "*.py")):
-        filename = os.path.split(filepath)[1]
-        name = filename.rsplit('.', 1)[0]
-        if not (name == 'widget' or name == '__init__') and name.startswith('widget_'):
-            # Remove 'widget_' from the start of the name before compiling the path.
-            js_path = 'static/notebook/js/widgets/%s.js' % name[7:]
-            display(Javascript(data='$.getScript($("body").data("baseProjectUrl") + "%s");' % js_path), exclude="text/plain")  
-
 
 #-----------------------------------------------------------------------------
 # Classes

examples/widgets/File Upload Widget.ipynb

@@ -18,85 +18,11 b''
      "collapsed": false,
      "input": [
       "from IPython.html import widgets # Widget definitions\n",
-      "from IPython.display import display # Used to display widgets in the notebook\n",
-      "\n",
-      "# Enable widgets in this notebook\n",
-      "widgets.init_widget_js()"
+      "from IPython.display import display # Used to display widgets in the notebook"
      ],
      "language": "python",
      "metadata": {},
-     "outputs": [
-      {
-       "javascript": [
-        "$.getScript($(\"body\").data(\"baseProjectUrl\") + \"static/notebook/js/widgets/button.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript($(\"body\").data(\"baseProjectUrl\") + \"static/notebook/js/widgets/int_range.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript($(\"body\").data(\"baseProjectUrl\") + \"static/notebook/js/widgets/string.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript($(\"body\").data(\"baseProjectUrl\") + \"static/notebook/js/widgets/multicontainer.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript($(\"body\").data(\"baseProjectUrl\") + \"static/notebook/js/widgets/bool.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript($(\"body\").data(\"baseProjectUrl\") + \"static/notebook/js/widgets/int.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript($(\"body\").data(\"baseProjectUrl\") + \"static/notebook/js/widgets/selection.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript($(\"body\").data(\"baseProjectUrl\") + \"static/notebook/js/widgets/float.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript($(\"body\").data(\"baseProjectUrl\") + \"static/notebook/js/widgets/float_range.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript($(\"body\").data(\"baseProjectUrl\") + \"static/notebook/js/widgets/container.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      }
-     ],
+     "outputs": [],
      "prompt_number": 1
     },
     {
@@ -141,7 +67,7 b''
       "    \n",
       "    // Define the FileModel and register it with the widget manager.\n",
       "    var FileModel = IPython.WidgetModel.extend({});\n",
-      "    IPython.notebook.widget_manager.register_widget_model('FileWidgetModel', FileModel);\n",
+      "    IPython.widget_manager.register_widget_model('FileWidgetModel', FileModel);\n",
       "    \n",
       "    // Define the FilePickerView\n",
       "    var FilePickerView = IPython.WidgetView.extend({\n",
@@ -176,7 +102,7 b''
       "    });\n",
       "        \n",
       "    // Register the DatePickerView with the widget manager.\n",
-      "    IPython.notebook.widget_manager.register_widget_view('FilePickerView', FilePickerView);\n",
+      "    IPython.widget_manager.register_widget_view('FilePickerView', FilePickerView);\n",
       "});"
      ],
      "language": "python",
@@ -189,7 +115,7 b''
         "    \n",
         "    // Define the FileModel and register it with the widget manager.\n",
         "    var FileModel = IPython.WidgetModel.extend({});\n",
-        "    IPython.notebook.widget_manager.register_widget_model('FileWidgetModel', FileModel);\n",
+        "    IPython.widget_manager.register_widget_model('FileWidgetModel', FileModel);\n",
         "    \n",
         "    // Define the FilePickerView\n",
         "    var FilePickerView = IPython.WidgetView.extend({\n",
@@ -202,7 +128,6 b''
         "        },\n",
         "        \n",
         "        // Handles: User input\n",
-        "        events: { \"change\" : \"handleFileChange\" }, \n",
         "        handleFileChange: function(evt) { \n",
         "            \n",
         "            //Retrieve the first (and only!) File from the FileList object\n",
@@ -225,13 +150,13 b''
         "    });\n",
         "        \n",
         "    // Register the DatePickerView with the widget manager.\n",
-        "    IPython.notebook.widget_manager.register_widget_view('FilePickerView', FilePickerView);\n",
+        "    IPython.widget_manager.register_widget_view('FilePickerView', FilePickerView);\n",
         "});"
        ],
        "metadata": {},
        "output_type": "display_data",
        "text": [
-        "<IPython.core.display.Javascript at 0x2fa80d0>"
+        "<IPython.core.display.Javascript at 0x319fe90>"
        ]
       }
      ],

examples/widgets/Part 1 - Basics.ipynb

@@ -1,5 +1,11 b''
 {
  "metadata": {
+  "cell_tags": [
+   [
+    "<None>",
+    null
+   ]
+  ],
   "name": ""
  },
  "nbformat": 3,
@@ -11,7 +17,7 b''
      "cell_type": "markdown",
      "metadata": {},
      "source": [
-      "To enable the use IPython widgets in the notebook, the widget namespace and display function need to be imported.  The Javascript dependencies need to be loaded via `IPython.html.widgets.init_widget_js()`.  This method needs to be called each time the notebook webpage is refreshed."
+      "To use IPython widgets in the notebook, the widget namespace and display function need to be imported."
      ]
     },
     {
@@ -19,85 +25,11 b''
      "collapsed": false,
      "input": [
       "from IPython.html import widgets # Widget definitions\n",
-      "from IPython.display import display # Used to display widgets in the notebook\n",
-      "\n",
-      "# Enable widgets in this notebook\n",
-      "widgets.init_widget_js()"
+      "from IPython.display import display # Used to display widgets in the notebook"
      ],
      "language": "python",
      "metadata": {},
-     "outputs": [
-      {
-       "javascript": [
-        "$.getScript(\"/static/notebook/js/widgets/bool.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript(\"/static/notebook/js/widgets/int_range.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript(\"/static/notebook/js/widgets/int.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript(\"/static/notebook/js/widgets/selection.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript(\"/static/notebook/js/widgets/string.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript(\"/static/notebook/js/widgets/float.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript(\"/static/notebook/js/widgets/container.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript(\"/static/notebook/js/widgets/multicontainer.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript(\"/static/notebook/js/widgets/button.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript(\"/static/notebook/js/widgets/float_range.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      }
-     ],
+     "outputs": [],
      "prompt_number": 1
     },
     {

examples/widgets/Part 2 - Events.ipynb

@@ -1,5 +1,11 b''
 {
  "metadata": {
+  "cell_tags": [
+   [
+    "<None>",
+    null
+   ]
+  ],
   "name": ""
  },
  "nbformat": 3,
@@ -12,85 +18,11 b''
      "collapsed": false,
      "input": [
       "from IPython.html import widgets # Widget definitions\n",
-      "from IPython.display import display # Used to display widgets in the notebook\n",
-      "\n",
-      "# Enable widgets in this notebook\n",
-      "widgets.init_widget_js()"
+      "from IPython.display import display # Used to display widgets in the notebook"
      ],
      "language": "python",
      "metadata": {},
-     "outputs": [
-      {
-       "javascript": [
-        "$.getScript(\"/static/notebook/js/widgets/bool.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript(\"/static/notebook/js/widgets/int_range.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript(\"/static/notebook/js/widgets/int.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript(\"/static/notebook/js/widgets/selection.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript(\"/static/notebook/js/widgets/string.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript(\"/static/notebook/js/widgets/float.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript(\"/static/notebook/js/widgets/container.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript(\"/static/notebook/js/widgets/multicontainer.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript(\"/static/notebook/js/widgets/button.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript(\"/static/notebook/js/widgets/float_range.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      }
-     ],
+     "outputs": [],
      "prompt_number": 1
     },
     {

examples/widgets/Part 3 - Placement.ipynb

@@ -1,5 +1,11 b''
 {
  "metadata": {
+  "cell_tags": [
+   [
+    "<None>",
+    null
+   ]
+  ],
   "name": ""
  },
  "nbformat": 3,
@@ -12,85 +18,11 b''
      "collapsed": false,
      "input": [
       "from IPython.html import widgets # Widget definitions\n",
-      "from IPython.display import display # Used to display widgets in the notebook\n",
-      "\n",
-      "# Enable widgets in this notebook\n",
-      "widgets.init_widget_js()"
+      "from IPython.display import display # Used to display widgets in the notebook"
      ],
      "language": "python",
      "metadata": {},
-     "outputs": [
-      {
-       "javascript": [
-        "$.getScript(\"/static/notebook/js/widgets/bool.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript(\"/static/notebook/js/widgets/int_range.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript(\"/static/notebook/js/widgets/int.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript(\"/static/notebook/js/widgets/selection.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript(\"/static/notebook/js/widgets/string.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript(\"/static/notebook/js/widgets/float.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript(\"/static/notebook/js/widgets/container.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript(\"/static/notebook/js/widgets/multicontainer.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript(\"/static/notebook/js/widgets/button.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript(\"/static/notebook/js/widgets/float_range.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      }
-     ],
+     "outputs": [],
      "prompt_number": 1
     },
     {

examples/widgets/Part 4 - Styles.ipynb

@@ -1,5 +1,11 b''
 {
  "metadata": {
+  "cell_tags": [
+   [
+    "<None>",
+    null
+   ]
+  ],
   "name": ""
  },
  "nbformat": 3,
@@ -12,85 +18,11 b''
      "collapsed": false,
      "input": [
       "from IPython.html import widgets # Widget definitions\n",
-      "from IPython.display import display # Used to display widgets in the notebook\n",
-      "\n",
-      "# Enable widgets in this notebook\n",
-      "widgets.init_widget_js()"
+      "from IPython.display import display # Used to display widgets in the notebook"
      ],
      "language": "python",
      "metadata": {},
-     "outputs": [
-      {
-       "javascript": [
-        "$.getScript(\"../static/notebook/js/widgets/bool.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript(\"../static/notebook/js/widgets/int_range.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript(\"../static/notebook/js/widgets/int.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript(\"../static/notebook/js/widgets/selection.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript(\"../static/notebook/js/widgets/string.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript(\"../static/notebook/js/widgets/float.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript(\"../static/notebook/js/widgets/container.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript(\"../static/notebook/js/widgets/multicontainer.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript(\"../static/notebook/js/widgets/button.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript(\"../static/notebook/js/widgets/float_range.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      }
-     ],
+     "outputs": [],
      "prompt_number": 1
     },
     {

examples/widgets/Part 5 - Alignment.ipynb

@@ -18,85 +18,11 b''
      "collapsed": false,
      "input": [
       "from IPython.html import widgets # Widget definitions\n",
-      "from IPython.display import display # Used to display widgets in the notebook\n",
-      "\n",
-      "# Enable widgets in this notebook\n",
-      "widgets.init_widget_js()"
+      "from IPython.display import display # Used to display widgets in the notebook"
      ],
      "language": "python",
      "metadata": {},
-     "outputs": [
-      {
-       "javascript": [
-        "$.getScript($(\"body\").data(\"baseProjectUrl\") + \"static/notebook/js/widgets/button.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript($(\"body\").data(\"baseProjectUrl\") + \"static/notebook/js/widgets/int_range.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript($(\"body\").data(\"baseProjectUrl\") + \"static/notebook/js/widgets/string.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript($(\"body\").data(\"baseProjectUrl\") + \"static/notebook/js/widgets/multicontainer.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript($(\"body\").data(\"baseProjectUrl\") + \"static/notebook/js/widgets/bool.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript($(\"body\").data(\"baseProjectUrl\") + \"static/notebook/js/widgets/int.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript($(\"body\").data(\"baseProjectUrl\") + \"static/notebook/js/widgets/selection.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript($(\"body\").data(\"baseProjectUrl\") + \"static/notebook/js/widgets/float.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript($(\"body\").data(\"baseProjectUrl\") + \"static/notebook/js/widgets/float_range.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript($(\"body\").data(\"baseProjectUrl\") + \"static/notebook/js/widgets/container.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      }
-     ],
+     "outputs": [],
      "prompt_number": 1
     },
     {

examples/widgets/Part 6 - Custom Widget.ipynb

@@ -30,85 +30,11 b''
      "collapsed": false,
      "input": [
       "from IPython.html import widgets # Widget definitions\n",
-      "from IPython.display import display # Used to display widgets in the notebook\n",
-      "\n",
-      "# Enable widgets in this notebook\n",
-      "widgets.init_widget_js()"
+      "from IPython.display import display # Used to display widgets in the notebook"
      ],
      "language": "python",
      "metadata": {},
-     "outputs": [
-      {
-       "javascript": [
-        "$.getScript($(\"body\").data(\"baseProjectUrl\") + \"static/notebook/js/widgets/button.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript($(\"body\").data(\"baseProjectUrl\") + \"static/notebook/js/widgets/int_range.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript($(\"body\").data(\"baseProjectUrl\") + \"static/notebook/js/widgets/string.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript($(\"body\").data(\"baseProjectUrl\") + \"static/notebook/js/widgets/multicontainer.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript($(\"body\").data(\"baseProjectUrl\") + \"static/notebook/js/widgets/bool.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript($(\"body\").data(\"baseProjectUrl\") + \"static/notebook/js/widgets/int.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript($(\"body\").data(\"baseProjectUrl\") + \"static/notebook/js/widgets/selection.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript($(\"body\").data(\"baseProjectUrl\") + \"static/notebook/js/widgets/float.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript($(\"body\").data(\"baseProjectUrl\") + \"static/notebook/js/widgets/float_range.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      },
-      {
-       "javascript": [
-        "$.getScript($(\"body\").data(\"baseProjectUrl\") + \"static/notebook/js/widgets/container.js\");"
-       ],
-       "metadata": {},
-       "output_type": "display_data"
-      }
-     ],
+     "outputs": [],
      "prompt_number": 1
     },
     {
@@ -213,7 +139,7 b''
        "metadata": {},
        "output_type": "display_data",
        "text": [
-        "<IPython.core.display.Javascript at 0x168b0d0>"
+        "<IPython.core.display.Javascript at 0x21f8f10>"
        ]
       }
      ],
@@ -236,7 +162,7 b''
       "    \n",
       "    // Define the DateModel and register it with the widget manager.\n",
       "    var DateModel = IPython.WidgetModel.extend({});\n",
-      "    IPython.notebook.widget_manager.register_widget_model('DateWidgetModel', DateModel);\n",
+      "    IPython.widget_manager.register_widget_model('DateWidgetModel', DateModel);\n",
       "});"
      ],
      "language": "python",
@@ -249,13 +175,13 b''
         "    \n",
         "    // Define the DateModel and register it with the widget manager.\n",
         "    var DateModel = IPython.WidgetModel.extend({});\n",
-        "    IPython.notebook.widget_manager.register_widget_model('DateWidgetModel', DateModel);\n",
+        "    IPython.widget_manager.register_widget_model('DateWidgetModel', DateModel);\n",
         "});"
        ],
        "metadata": {},
        "output_type": "display_data",
        "text": [
-        "<IPython.core.display.Javascript at 0x168df50>"
+        "<IPython.core.display.Javascript at 0x21f8ed0>"
        ]
       }
      ],
@@ -280,7 +206,7 b''
       "    \n",
       "    // Define the DateModel and register it with the widget manager.\n",
       "    var DateModel = IPython.WidgetModel.extend({});\n",
-      "    IPython.notebook.widget_manager.register_widget_model('DateWidgetModel', DateModel);\n",
+      "    IPython.widget_manager.register_widget_model('DateWidgetModel', DateModel);\n",
       "    \n",
       "    // Define the DatePickerView\n",
       "    var DatePickerView = IPython.WidgetView.extend({\n",
@@ -292,7 +218,7 b''
       "    });\n",
       "    \n",
       "    // Register the DatePickerView with the widget manager.\n",
-      "    IPython.notebook.widget_manager.register_widget_view('DatePickerView', DatePickerView);\n",
+      "    IPython.widget_manager.register_widget_view('DatePickerView', DatePickerView);\n",
       "});"
      ],
      "language": "python",
@@ -305,7 +231,7 b''
         "    \n",
         "    // Define the DateModel and register it with the widget manager.\n",
         "    var DateModel = IPython.WidgetModel.extend({});\n",
-        "    IPython.notebook.widget_manager.register_widget_model('DateWidgetModel', DateModel);\n",
+        "    IPython.widget_manager.register_widget_model('DateWidgetModel', DateModel);\n",
         "    \n",
         "    // Define the DatePickerView\n",
         "    var DatePickerView = IPython.WidgetView.extend({\n",
@@ -317,13 +243,13 b''
         "    });\n",
         "    \n",
         "    // Register the DatePickerView with the widget manager.\n",
-        "    IPython.notebook.widget_manager.register_widget_view('DatePickerView', DatePickerView);\n",
+        "    IPython.widget_manager.register_widget_view('DatePickerView', DatePickerView);\n",
         "});"
        ],
        "metadata": {},
        "output_type": "display_data",
        "text": [
-        "<IPython.core.display.Javascript at 0x168f050>"
+        "<IPython.core.display.Javascript at 0x21f8cd0>"
        ]
       }
      ],
@@ -426,7 +352,7 b''
       "    \n",
       "    // Define the DateModel and register it with the widget manager.\n",
       "    var DateModel = IPython.WidgetModel.extend({});\n",
-      "    IPython.notebook.widget_manager.register_widget_model('DateWidgetModel', DateModel);\n",
+      "    IPython.widget_manager.register_widget_model('DateWidgetModel', DateModel);\n",
       "    \n",
       "    // Define the DatePickerView\n",
       "    var DatePickerView = IPython.WidgetView.extend({\n",
@@ -443,7 +369,7 b''
       "    });\n",
       "    \n",
       "    // Register the DatePickerView with the widget manager.\n",
-      "    IPython.notebook.widget_manager.register_widget_view('DatePickerView', DatePickerView);\n",
+      "    IPython.widget_manager.register_widget_view('DatePickerView', DatePickerView);\n",
       "});"
      ],
      "language": "python",
@@ -456,7 +382,7 b''
         "    \n",
         "    // Define the DateModel and register it with the widget manager.\n",
         "    var DateModel = IPython.WidgetModel.extend({});\n",
-        "    IPython.notebook.widget_manager.register_widget_model('DateWidgetModel', DateModel);\n",
+        "    IPython.widget_manager.register_widget_model('DateWidgetModel', DateModel);\n",
         "    \n",
         "    // Define the DatePickerView\n",
         "    var DatePickerView = IPython.WidgetView.extend({\n",
@@ -473,13 +399,13 b''
         "    });\n",
         "    \n",
         "    // Register the DatePickerView with the widget manager.\n",
-        "    IPython.notebook.widget_manager.register_widget_view('DatePickerView', DatePickerView);\n",
+        "    IPython.widget_manager.register_widget_view('DatePickerView', DatePickerView);\n",
         "});"
        ],
        "metadata": {},
        "output_type": "display_data",
        "text": [
-        "<IPython.core.display.Javascript at 0x17822d0>"
+        "<IPython.core.display.Javascript at 0x21fc310>"
        ]
       }
      ],
@@ -502,7 +428,7 b''
       "    \n",
       "    // Define the DateModel and register it with the widget manager.\n",
       "    var DateModel = IPython.WidgetModel.extend({});\n",
-      "    IPython.notebook.widget_manager.register_widget_model('DateWidgetModel', DateModel);\n",
+      "    IPython.widget_manager.register_widget_model('DateWidgetModel', DateModel);\n",
       "    \n",
       "    // Define the DatePickerView\n",
       "    var DatePickerView = IPython.WidgetView.extend({\n",
@@ -526,7 +452,7 b''
       "    });\n",
       "    \n",
       "    // Register the DatePickerView with the widget manager.\n",
-      "    IPython.notebook.widget_manager.register_widget_view('DatePickerView', DatePickerView);\n",
+      "    IPython.widget_manager.register_widget_view('DatePickerView', DatePickerView);\n",
       "});"
      ],
      "language": "python",
@@ -539,7 +465,7 b''
         "    \n",
         "    // Define the DateModel and register it with the widget manager.\n",
         "    var DateModel = IPython.WidgetModel.extend({});\n",
-        "    IPython.notebook.widget_manager.register_widget_model('DateWidgetModel', DateModel);\n",
+        "    IPython.widget_manager.register_widget_model('DateWidgetModel', DateModel);\n",
         "    \n",
         "    // Define the DatePickerView\n",
         "    var DatePickerView = IPython.WidgetView.extend({\n",
@@ -563,13 +489,13 b''
         "    });\n",
         "    \n",
         "    // Register the DatePickerView with the widget manager.\n",
-        "    IPython.notebook.widget_manager.register_widget_view('DatePickerView', DatePickerView);\n",
+        "    IPython.widget_manager.register_widget_view('DatePickerView', DatePickerView);\n",
         "});"
        ],
        "metadata": {},
        "output_type": "display_data",
        "text": [
-        "<IPython.core.display.Javascript at 0x1782390>"
+        "<IPython.core.display.Javascript at 0x21fc290>"
        ]
       }
      ],
@@ -596,7 +522,7 b''
       "    \n",
       "    // Define the DateModel and register it with the widget manager.\n",
       "    var DateModel = IPython.WidgetModel.extend({});\n",
-      "    IPython.notebook.widget_manager.register_widget_model('DateWidgetModel', DateModel);\n",
+      "    IPython.widget_manager.register_widget_model('DateWidgetModel', DateModel);\n",
       "    \n",
       "    // Define the DatePickerView\n",
       "    var DatePickerView = IPython.WidgetView.extend({\n",
@@ -632,7 +558,7 b''
       "    });\n",
       "    \n",
       "    // Register the DatePickerView with the widget manager.\n",
-      "    IPython.notebook.widget_manager.register_widget_view('DatePickerView', DatePickerView);\n",
+      "    IPython.widget_manager.register_widget_view('DatePickerView', DatePickerView);\n",
       "});"
      ],
      "language": "python",
@@ -645,7 +571,7 b''
         "    \n",
         "    // Define the DateModel and register it with the widget manager.\n",
         "    var DateModel = IPython.WidgetModel.extend({});\n",
-        "    IPython.notebook.widget_manager.register_widget_model('DateWidgetModel', DateModel);\n",
+        "    IPython.widget_manager.register_widget_model('DateWidgetModel', DateModel);\n",
         "    \n",
         "    // Define the DatePickerView\n",
         "    var DatePickerView = IPython.WidgetView.extend({\n",
@@ -681,13 +607,13 b''
         "    });\n",
         "    \n",
         "    // Register the DatePickerView with the widget manager.\n",
-        "    IPython.notebook.widget_manager.register_widget_view('DatePickerView', DatePickerView);\n",
+        "    IPython.widget_manager.register_widget_view('DatePickerView', DatePickerView);\n",
         "});"
        ],
        "metadata": {},
        "output_type": "display_data",
        "text": [
-        "<IPython.core.display.Javascript at 0x17821d0>"
+        "<IPython.core.display.Javascript at 0x21fc3d0>"
        ]
       }
      ],
@@ -759,7 +685,7 b''
        "output_type": "pyout",
        "prompt_number": 13,
        "text": [
-        "u''"
+        "u'2013-11-14'"
        ]
       }
      ],
@@ -1041,7 +967,7 b''
       "    \n",
       "    // Define the DateModel and register it with the widget manager.\n",
       "    var DateModel = IPython.WidgetModel.extend({});\n",
-      "    IPython.notebook.widget_manager.register_widget_model('DateWidgetModel', DateModel);\n",
+      "    IPython.widget_manager.register_widget_model('DateWidgetModel', DateModel);\n",
       "    \n",
       "    // Define the DatePickerView\n",
       "    var DatePickerView = IPython.WidgetView.extend({\n",
@@ -1095,7 +1021,7 b''
       "    });\n",
       "    \n",
       "    // Register the DatePickerView with the widget manager.\n",
-      "    IPython.notebook.widget_manager.register_widget_view('DatePickerView', DatePickerView);\n",
+      "    IPython.widget_manager.register_widget_view('DatePickerView', DatePickerView);\n",
       "});"
      ],
      "language": "python",
@@ -1108,7 +1034,7 b''
         "    \n",
         "    // Define the DateModel and register it with the widget manager.\n",
         "    var DateModel = IPython.WidgetModel.extend({});\n",
-        "    IPython.notebook.widget_manager.register_widget_model('DateWidgetModel', DateModel);\n",
+        "    IPython.widget_manager.register_widget_model('DateWidgetModel', DateModel);\n",
         "    \n",
         "    // Define the DatePickerView\n",
         "    var DatePickerView = IPython.WidgetView.extend({\n",
@@ -1162,13 +1088,13 b''
         "    });\n",
         "    \n",
         "    // Register the DatePickerView with the widget manager.\n",
-        "    IPython.notebook.widget_manager.register_widget_view('DatePickerView', DatePickerView);\n",
+        "    IPython.widget_manager.register_widget_view('DatePickerView', DatePickerView);\n",
         "});"
        ],
        "metadata": {},
        "output_type": "display_data",
        "text": [
-        "<IPython.core.display.Javascript at 0x179f790>"
+        "<IPython.core.display.Javascript at 0x221a850>"
        ]
       }
      ],
@@ -1216,7 +1142,6 b''
      "cell_type": "code",
      "collapsed": false,
      "input": [
-      "\n",
       "display(my_widget, view_name=\"TextBoxView\")"
      ],
      "language": "python",