Merge pull request #5896 from ellisonbg/widget-fixes

Widget fixes

IPython/html/static/widgets/js/manager.js

@@ -120,7 +120,6 @@
                 var parameters = {model: model, options: options};
                 view = new ViewType(parameters);
                 view.render();
-                model.views.push(view);
                 model.on('destroy', view.remove, view);
                 return view;
             }
@@ -198,9 +197,13 @@
 
         WidgetManager.prototype._handle_comm_open = function (comm, msg) {
             // Handle when a comm is opened.
+            var that = this;
             var model_id = comm.comm_id;
             var widget_type_name = msg.content.target_name;
             var widget_model = new WidgetManager._model_types[widget_type_name](this, model_id, comm);
+            widget_model.on('comm:close', function () {
+              delete that._models[model_id];
+            });
             this._models[model_id] = widget_model;
         };
         

IPython/html/static/widgets/js/widget.js

@@ -313,6 +313,7 @@ function(WidgetManager, _, Backbone){
             if (view !== undefined) {
                 delete this.child_views[child_model.id];
                 view.remove();
+                child_model.views.pop(view);
             }
         },
 

IPython/html/static/widgets/js/widget_container.js

@@ -27,6 +27,18 @@ define(["widgets/js/widget"], function(WidgetManager) {
                 this.update_children(model.previous('_children'), value);
             }, this);
             this.update();
+
+            // Trigger model displayed events for any models that are child to 
+            // this model when this model is displayed.
+            var that = this;
+            this.model.on('displayed', function(){
+                that.is_displayed = true;
+                for (var property in that.child_views) {
+                    if (that.child_views.hasOwnProperty(property)) {
+                        that.child_views[property].model.trigger('displayed');
+                    }
+                }
+            });
         },
         
         update_children: function(old_list, new_list) {
@@ -47,6 +59,11 @@ define(["widgets/js/widget"], function(WidgetManager) {
             // Called when a model is added to the children list.
             var view = this.create_child_view(model);
             this.$el.append(view.$el);
+
+            // Trigger the displayed event if this model is displayed.
+            if (this.is_displayed) {
+                model.trigger('displayed');
+            }
         },
         
         update: function(){
@@ -81,7 +98,7 @@ define(["widgets/js/widget"], function(WidgetManager) {
             // need to know about all of the top-level widgets.  The IPython
             // widget manager uses this to register the elements with the
             // keyboard manager.
-            this.additional_elements = [this.$window]
+            this.additional_elements = [this.$window];
 
             this.$title_bar = $('<div />')
                 .addClass('popover-title')
@@ -169,6 +186,17 @@ define(["widgets/js/widget"], function(WidgetManager) {
                 this.update_children(model.previous('_children'), value);
             }, this);
             this.update();
+
+            // Trigger model displayed events for any models that are child to 
+            // this model when this model is displayed.
+            this.model.on('displayed', function(){
+                that.is_displayed = true;
+                for (var property in that.child_views) {
+                    if (that.child_views.hasOwnProperty(property)) {
+                        that.child_views[property].model.trigger('displayed');
+                    }
+                }
+            });
         },
         
         hide: function() {
@@ -228,6 +256,11 @@ define(["widgets/js/widget"], function(WidgetManager) {
             // Called when a child is added to children list.
             var view = this.create_child_view(model);
             this.$body.append(view.$el);
+
+            // Trigger the displayed event if this model is displayed.
+            if (this.is_displayed) {
+                model.trigger('displayed');
+            }
         },
         
         update: function(){

IPython/html/static/widgets/js/widget_selectioncontainer.js

@@ -35,8 +35,17 @@ define(["widgets/js/widget"], function(WidgetManager){
             this.model.on('change:_titles', function(model, value, options) {
                 this.update_titles(value);
             }, this);
+            var that = this;
             this.model.on('displayed', function() {
                 this.update_titles();
+                // Trigger model displayed events for any models that are child to 
+                // this model when this model is displayed.
+                that.is_displayed = true;
+                for (var property in that.child_views) {
+                    if (that.child_views.hasOwnProperty(property)) {
+                        that.child_views[property].model.trigger('displayed');
+                    }
+                }
             }, this);
         },
 
@@ -125,6 +134,11 @@ define(["widgets/js/widget"], function(WidgetManager){
 
             this.update();
             this.update_titles();
+
+            // Trigger the displayed event if this model is displayed.
+            if (this.is_displayed) {
+                model.trigger('displayed');
+            }
         },
     });
     WidgetManager.register_widget_view('AccordionView', AccordionView);
@@ -153,6 +167,17 @@ define(["widgets/js/widget"], function(WidgetManager){
             this.model.on('change:_children', function(model, value, options) {
                 this.update_children(model.previous('_children'), value);
             }, this);
+
+            // Trigger model displayed events for any models that are child to 
+            // this model when this model is displayed.
+            this.model.on('displayed', function(){
+                that.is_displayed = true;
+                for (var property in that.child_views) {
+                    if (that.child_views.hasOwnProperty(property)) {
+                        that.child_views[property].model.trigger('displayed');
+                    }
+                }
+            });
         },
 
         update_children: function(old_list, new_list) {
@@ -206,6 +231,11 @@ define(["widgets/js/widget"], function(WidgetManager){
                 .append(view.$el)
                 .appendTo(this.$tab_contents);
             view.parent_container = contents_div;
+
+            // Trigger the displayed event if this model is displayed.
+            if (this.is_displayed) {
+                model.trigger('displayed');
+            }
         },
 
         update: function(options) {