From 9865220d531add526bb6c798e6dfd2b0267a0287 Mon Sep 17 00:00:00 2001
From: Jonathan Frederic <jdfreder@calpoly.edu>
Date: Fri, 17 Apr 2015 12:23:02 -0700
Subject: [PATCH] Remove widget/CodeCell coupling code.

---
 .../static/notebook/js/widgetarea.js          | 116 ++++++++++++++++++
 .../static/notebook/js/codecell.js            | 108 +---------------
 2 files changed, 117 insertions(+), 107 deletions(-)
 create mode 100644 ipython_widgets/static/notebook/js/widgetarea.js

diff --git a/ipython_widgets/static/notebook/js/widgetarea.js b/ipython_widgets/static/notebook/js/widgetarea.js
new file mode 100644
index 000000000..75b93ba2d
--- /dev/null
+++ b/ipython_widgets/static/notebook/js/widgetarea.js
@@ -0,0 +1,116 @@
+
+// Events that this code should rely on.
+// delete.Cell
+// selected_cell_type_changed.Notebook
+// create.Cell
+
+        this.widget_views = [];
+        this._widgets_live = true;
+
+        var widget_area = $('<div/>')
+            .addClass('widget-area')
+            .hide();
+        this.widget_area = widget_area;
+        var widget_prompt = $('<div/>')
+            .addClass('prompt')
+            .appendTo(widget_area);
+        var widget_subarea = $('<div/>')
+            .addClass('widget-subarea')
+            .appendTo(widget_area);
+        this.widget_subarea = widget_subarea;
+        var that = this;
+        var widget_clear_buton = $('<button />')
+            .addClass('close')
+            .html('&times;')
+            .click(function() {
+                widget_area.slideUp('', function(){ 
+                    for (var i = 0; i < that.widget_views.length; i++) {
+                        var view = that.widget_views[i];
+                        view.remove();
+
+                        // Remove widget live events.
+                        view.off('comm:live', that._widget_live);
+                        view.off('comm:dead', that._widget_dead);
+                    }
+                    that.widget_views = [];
+                    widget_subarea.html(''); 
+                });
+            })
+            .appendTo(widget_prompt);
+
+
+    /**
+    *  Display a widget view in the cell.
+    */
+    CodeCell.prototype.display_widget_view = function(view_promise) {
+
+        // Display a dummy element
+        var dummy = $('<div/>');
+        this.widget_subarea.append(dummy);
+
+        // Display the view.
+        var that = this;
+        return view_promise.then(function(view) {
+            that.widget_area.show();
+            dummy.replaceWith(view.$el);
+            that.widget_views.push(view);
+
+            // Check the live state of the view's model.
+            if (view.model.comm_live) {
+                that._widget_live(view);
+            } else {
+                that._widget_dead(view);
+            }
+
+            // Listen to comm live events for the view.
+            view.on('comm:live', that._widget_live, that);
+            view.on('comm:dead', that._widget_dead, that);
+            return view;
+        });
+    };
+
+    /**
+     * Handles when a widget loses it's comm connection.
+     * @param  {WidgetView} view
+     */
+    CodeCell.prototype._widget_dead = function(view) {
+        if (this._widgets_live) {
+            this._widgets_live = false;
+            this.widget_area.addClass('connection-problems');
+        }
+
+    };
+
+    /**
+     * Handles when a widget is connected to a live comm.
+     * @param  {WidgetView} view
+     */
+    CodeCell.prototype._widget_live = function(view) {
+        if (!this._widgets_live) {
+            // Check that the other widgets are live too.  O(N) operation.
+            // Abort the function at the first dead widget found.
+            for (var i = 0; i < this.widget_views.length; i++) {
+                if (!this.widget_views[i].model.comm_live) return;
+            }
+            this._widgets_live = true;
+            this.widget_area.removeClass('connection-problems');
+        }
+    };
+
+
+// TODO: on event execute.CodeCell
+        // Clear widget area
+        for (var i = 0; i < this.widget_views.length; i++) {
+            var view = this.widget_views[i];
+            view.remove();
+
+            // Remove widget live events.
+            view.off('comm:live', this._widget_live);
+            view.off('comm:dead', this._widget_dead);
+        }
+        this.widget_views = [];
+        this.widget_subarea.html('');
+        this.widget_subarea.height('');
+        this.widget_area.height('');
+        this.widget_area.hide();
+        
\ No newline at end of file
diff --git a/jupyter_notebook/static/notebook/js/codecell.js b/jupyter_notebook/static/notebook/js/codecell.js
index 7577c366b..0fb1fd955 100644
--- a/jupyter_notebook/static/notebook/js/codecell.js
+++ b/jupyter_notebook/static/notebook/js/codecell.js
@@ -100,8 +100,6 @@ define([
 
         this.last_msg_id = null;
         this.completer = null;
-        this.widget_views = [];
-        this._widgets_live = true;
 
         Cell.apply(this,[{
             config: $.extend({}, CodeCell.options_default), 
@@ -176,39 +174,8 @@ define([
         inner_cell.append(input_area);
         input.append(prompt).append(inner_cell);
 
-        var widget_area = $('<div/>')
-            .addClass('widget-area')
-            .hide();
-        this.widget_area = widget_area;
-        var widget_prompt = $('<div/>')
-            .addClass('prompt')
-            .appendTo(widget_area);
-        var widget_subarea = $('<div/>')
-            .addClass('widget-subarea')
-            .appendTo(widget_area);
-        this.widget_subarea = widget_subarea;
-        var that = this;
-        var widget_clear_buton = $('<button />')
-            .addClass('close')
-            .html('&times;')
-            .click(function() {
-                widget_area.slideUp('', function(){ 
-                    for (var i = 0; i < that.widget_views.length; i++) {
-                        var view = that.widget_views[i];
-                        view.remove();
-
-                        // Remove widget live events.
-                        view.off('comm:live', that._widget_live);
-                        view.off('comm:dead', that._widget_dead);
-                    }
-                    that.widget_views = [];
-                    widget_subarea.html(''); 
-                });
-            })
-            .appendTo(widget_prompt);
-
         var output = $('<div></div>');
-        cell.append(input).append(widget_area).append(output);
+        cell.append(input).append(output);
         this.element = cell;
         this.output_area = new outputarea.OutputArea({
             selector: output, 
@@ -218,64 +185,6 @@ define([
         this.completer = new completer.Completer(this, this.events);
     };
 
-    /**
-    *  Display a widget view in the cell.
-    */
-    CodeCell.prototype.display_widget_view = function(view_promise) {
-
-        // Display a dummy element
-        var dummy = $('<div/>');
-        this.widget_subarea.append(dummy);
-
-        // Display the view.
-        var that = this;
-        return view_promise.then(function(view) {
-            that.widget_area.show();
-            dummy.replaceWith(view.$el);
-            that.widget_views.push(view);
-
-            // Check the live state of the view's model.
-            if (view.model.comm_live) {
-                that._widget_live(view);
-            } else {
-                that._widget_dead(view);
-            }
-
-            // Listen to comm live events for the view.
-            view.on('comm:live', that._widget_live, that);
-            view.on('comm:dead', that._widget_dead, that);
-            return view;
-        });
-    };
-
-    /**
-     * Handles when a widget loses it's comm connection.
-     * @param  {WidgetView} view
-     */
-    CodeCell.prototype._widget_dead = function(view) {
-        if (this._widgets_live) {
-            this._widgets_live = false;
-            this.widget_area.addClass('connection-problems');
-        }
-
-    };
-
-    /**
-     * Handles when a widget is connected to a live comm.
-     * @param  {WidgetView} view
-     */
-    CodeCell.prototype._widget_live = function(view) {
-        if (!this._widgets_live) {
-            // Check that the other widgets are live too.  O(N) operation.
-            // Abort the function at the first dead widget found.
-            for (var i = 0; i < this.widget_views.length; i++) {
-                if (!this.widget_views[i].model.comm_live) return;
-            }
-            this._widgets_live = true;
-            this.widget_area.removeClass('connection-problems');
-        }
-    };
-
     /** @method bind_events */
     CodeCell.prototype.bind_events = function () {
         Cell.prototype.bind_events.apply(this);
@@ -398,21 +307,6 @@ define([
             stop_on_error = true;
         }
 
-        // Clear widget area
-        for (var i = 0; i < this.widget_views.length; i++) {
-            var view = this.widget_views[i];
-            view.remove();
-
-            // Remove widget live events.
-            view.off('comm:live', this._widget_live);
-            view.off('comm:dead', this._widget_dead);
-        }
-        this.widget_views = [];
-        this.widget_subarea.html('');
-        this.widget_subarea.height('');
-        this.widget_area.height('');
-        this.widget_area.hide();
-        
         var old_msg_id = this.last_msg_id;
 
         if (old_msg_id) {