Refactoring WebSocket connection failure logic.

This completely decouples the connection failed event in kernel.js
from its handling in notificationarea.js.

IPython/frontend/html/notebook/static/js/kernel.js

@@ -1,460 +1,439
 //----------------------------------------------------------------------------
 //  Copyright (C) 2008-2011  The IPython Development Team
 //
 //  Distributed under the terms of the BSD License.  The full license is in
 //  the file COPYING, distributed as part of this software.
 //----------------------------------------------------------------------------
 
 //============================================================================
 // Kernel
 //============================================================================
 
 /**
  * @module IPython
  * @namespace IPython
  * @submodule Kernel
  */
 
 var IPython = (function (IPython) {
 
     var utils = IPython.utils;
 
     // Initialization and connection.
     /**
      * A Kernel Class to communicate with the Python kernel
      * @Class Kernel
      */
     var Kernel = function (base_url) {
         this.kernel_id = null;
         this.shell_channel = null;
         this.iopub_channel = null;
         this.base_url = base_url;
         this.running = false;
         this.username = "username";
         this.session_id = utils.uuid();
         this._msg_callbacks = {};
 
         if (typeof(WebSocket) !== 'undefined') {
             this.WebSocket = WebSocket;
         } else if (typeof(MozWebSocket) !== 'undefined') {
             this.WebSocket = MozWebSocket;
         } else {
             alert('Your browser does not have WebSocket support, please try Chrome, Safari or Firefox ≥ 6. Firefox 4 and 5 are also supported by you have to enable WebSockets in about:config.');
         };
     };
 
 
     Kernel.prototype._get_msg = function (msg_type, content) {
         var msg = {
             header : {
                 msg_id : utils.uuid(),
                 username : this.username,
                 session : this.session_id,
                 msg_type : msg_type
             },
             metadata : {},
             content : content,
             parent_header : {}
         };
         return msg;
     };
 
     /**
      * Start the Python kernel
      * @method start
      */
     Kernel.prototype.start = function (notebook_id) {
         var that = this;
         if (!this.running) {
             var qs = $.param({notebook:notebook_id});
             var url = this.base_url + '?' + qs;
             $.post(url,
                 $.proxy(that._kernel_started,that),
                 'json'
             );
         };
     };
 
     /**
      * Restart the python kernel.
      *
      * Emit a 'status_restarting.Kernel' event with
      * the current object as parameter
      *
      * @method restart
      */
     Kernel.prototype.restart = function () {
         $([IPython.events]).trigger('status_restarting.Kernel', {kernel: this});
         var that = this;
         if (this.running) {
             this.stop_channels();
             var url = this.kernel_url + "/restart";
             $.post(url,
                 $.proxy(that._kernel_started, that),
                 'json'
             );
         };
     };
 
 
     Kernel.prototype._kernel_started = function (json) {
         console.log("Kernel started: ", json.kernel_id);
         this.running = true;
         this.kernel_id = json.kernel_id;
         this.ws_url = json.ws_url;
         this.kernel_url = this.base_url + "/" + this.kernel_id;
         this.start_channels();
         this.shell_channel.onmessage = $.proxy(this._handle_shell_reply,this);
         this.iopub_channel.onmessage = $.proxy(this._handle_iopub_reply,this);
         $([IPython.events]).trigger('status_started.Kernel', {kernel: this});
     };
 
 
     Kernel.prototype._websocket_closed = function(ws_url, early){
-        var msg;
-        var parent_item = $('body');
-        if (early) {
-            msg = "Websocket connection to " + ws_url + " could not be established." +
-            " You will NOT be able to run code." +
-            " Your browser may not be compatible with the websocket version in the server," +
-            " or if the url does not look right, there could be an error in the" +
-            " server's configuration.";
-        } else {
-            IPython.notification_area.widget('kernel').set_message('Reconnecting Websockets', 1000);
-            this.start_channels();
-            return;
-        }
-        var dialog = $('<div/>');
-        dialog.html(msg);
-        parent_item.append(dialog);
-        dialog.dialog({
-            resizable: false,
-            modal: true,
-            title: "Websocket closed",
-            closeText: "",
-            close: function(event, ui) {$(this).dialog('destroy').remove();},
-            buttons : {
-                "OK": function () {
-                    $(this).dialog('close');
-                }
-            }
-        });
-
+        this.stop_channels();
+        $([IPython.events]).trigger('websocket_closed.Kernel', 
+            {ws_url: ws_url, kernel: this, early: early}
+        );
     };
 
     /**
      * Start the `shell`and `iopub` channels.
      * Will stop and restart them if they already exist.
      *
      * @method start_channels
      */
     Kernel.prototype.start_channels = function () {
         var that = this;
         this.stop_channels();
         var ws_url = this.ws_url + this.kernel_url;
-        console.log("Starting WS:", ws_url);
+        console.log("Starting WebSockets:", ws_url);
         this.shell_channel = new this.WebSocket(ws_url + "/shell");
         this.iopub_channel = new this.WebSocket(ws_url + "/iopub");
         send_cookie = function(){
             this.send(document.cookie);
         };
         var already_called_onclose = false; // only alert once
         var ws_closed_early = function(evt){
             if (already_called_onclose){
                 return;
             }
             already_called_onclose = true;
             if ( ! evt.wasClean ){
                 that._websocket_closed(ws_url, true);
             }
         };
         var ws_closed_late = function(evt){
             if (already_called_onclose){
                 return;
             }
             already_called_onclose = true;
             if ( ! evt.wasClean ){
                 that._websocket_closed(ws_url, false);
             }
         };
         this.shell_channel.onopen = send_cookie;
         this.shell_channel.onclose = ws_closed_early;
         this.iopub_channel.onopen = send_cookie;
         this.iopub_channel.onclose = ws_closed_early;
         // switch from early-close to late-close message after 1s
         setTimeout(function(){
+            if (that.shell_channel !== null) {
             that.shell_channel.onclose = ws_closed_late;
+            }
+            if (that.iopub_channel !== null) {
             that.iopub_channel.onclose = ws_closed_late;
+            }
         }, 1000);
     };
 
     /**
      * Start the `shell`and `iopub` channels.
      * @method stop_channels
      */
     Kernel.prototype.stop_channels = function () {
         if (this.shell_channel !== null) {
             this.shell_channel.onclose = function (evt) {};
             this.shell_channel.close();
             this.shell_channel = null;
         };
         if (this.iopub_channel !== null) {
             this.iopub_channel.onclose = function (evt) {};
             this.iopub_channel.close();
             this.iopub_channel = null;
         };
     };
 
     // Main public methods.
 
     /**
      * Get info on object asynchronoulsy
      *
      * @async
      * @param objname {string}
      * @param callback {dict}
      * @method object_info_request
      *
      * @example
      *
      * When calling this method pass a callbacks structure of the form:
      *
      *     callbacks = {
      *      'object_info_reply': object_info_reply_callback
      *     }
      *
      * The `object_info_reply_callback` will be passed the content object of the
      *
      * `object_into_reply` message documented in
      * [IPython dev documentation](http://ipython.org/ipython-doc/dev/development/messaging.html#object-information)
      */
     Kernel.prototype.object_info_request = function (objname, callbacks) {
         if(typeof(objname)!=null && objname!=null)
         {
             var content = {
                 oname : objname.toString(),
             };
             var msg = this._get_msg("object_info_request", content);
             this.shell_channel.send(JSON.stringify(msg));
             this.set_callbacks_for_msg(msg.header.msg_id, callbacks);
             return msg.header.msg_id;
         }
         return;
     }
 
     /**
      * Execute given code into kernel, and pass result to callback.
      *
      * @async
      * @method execute
      * @param {string} code
      * @param callback {Object} With the following keys
      *      @param callback.'execute_reply' {function}
      *      @param callback.'output' {function}
      *      @param callback.'clear_output' {function}
      *      @param callback.'set_next_input' {function}
      * @param {object} [options]
      *      @param [options.silent=false] {Boolean}
      *      @param [options.user_expressions=empty_dict] {Dict}
      *      @param [options.user_variables=empty_list] {List od Strings}
      *      @param [options.allow_stdin=false] {Boolean} true|false
      *
      * @example
      *
      * The options object should contain the options for the execute call. Its default
      * values are:
      *
      *      options = {
      *        silent : true,
      *        user_variables : [],
      *        user_expressions : {},
      *        allow_stdin : false
      *      }
      *
      * When calling this method pass a callbacks structure of the form:
      *
      *      callbacks = {
      *       'execute_reply': execute_reply_callback,
      *       'output': output_callback,
      *       'clear_output': clear_output_callback,
      *       'set_next_input': set_next_input_callback
      *      }
      *
      * The `execute_reply_callback` will be passed the content and metadata
      * objects of the `execute_reply` message documented
      * [here](http://ipython.org/ipython-doc/dev/development/messaging.html#execute)
      *
      * The `output_callback` will be passed `msg_type` ('stream','display_data','pyout','pyerr')
      * of the output and the content and metadata objects of the PUB/SUB channel that contains the
      * output:
      *
      * http://ipython.org/ipython-doc/dev/development/messaging.html#messages-on-the-pub-sub-socket
      *
      * The `clear_output_callback` will be passed a content object that contains
      * stdout, stderr and other fields that are booleans, as well as the metadata object.
      *
      * The `set_next_input_callback` will be passed the text that should become the next
      * input cell.
      */
     Kernel.prototype.execute = function (code, callbacks, options) {
 
         var content = {
             code : code,
             silent : true,
             user_variables : [],
             user_expressions : {},
             allow_stdin : false
         };
         $.extend(true, content, options)
         $([IPython.events]).trigger('execution_request.Kernel', {kernel: this, content:content});
         var msg = this._get_msg("execute_request", content);
         this.shell_channel.send(JSON.stringify(msg));
         this.set_callbacks_for_msg(msg.header.msg_id, callbacks);
         return msg.header.msg_id;
     };
 
     /**
      * When calling this method pass a callbacks structure of the form:
      *
      *      callbacks = {
      *       'complete_reply': complete_reply_callback
      *      }
      *
      * The `complete_reply_callback` will be passed the content object of the
      * `complete_reply` message documented
      * [here](http://ipython.org/ipython-doc/dev/development/messaging.html#complete)
      *
      * @method complete
      * @param line {integer}
      * @param cursor_pos {integer}
      * @param {dict} callbacks
      *      @param callbacks.complete_reply {function} `complete_reply_callback`
      *
      */
     Kernel.prototype.complete = function (line, cursor_pos, callbacks) {
         callbacks = callbacks || {};
         var content = {
             text : '',
             line : line,
             cursor_pos : cursor_pos
         };
         var msg = this._get_msg("complete_request", content);
         this.shell_channel.send(JSON.stringify(msg));
         this.set_callbacks_for_msg(msg.header.msg_id, callbacks);
         return msg.header.msg_id;
     };
 
 
     Kernel.prototype.interrupt = function () {
         if (this.running) {
             $([IPython.events]).trigger('status_interrupting.Kernel', {kernel: this});
             $.post(this.kernel_url + "/interrupt");
         };
     };
 
 
     Kernel.prototype.kill = function () {
         if (this.running) {
             this.running = false;
             var settings = {
                 cache : false,
                 type : "DELETE"
             };
             $.ajax(this.kernel_url, settings);
         };
     };
 
 
     // Reply handlers.
 
     Kernel.prototype.get_callbacks_for_msg = function (msg_id) {
         var callbacks = this._msg_callbacks[msg_id];
         return callbacks;
     };
 
 
     Kernel.prototype.set_callbacks_for_msg = function (msg_id, callbacks) {
         this._msg_callbacks[msg_id] = callbacks || {};
     }
 
 
     Kernel.prototype._handle_shell_reply = function (e) {
         var reply = $.parseJSON(e.data);
         $([IPython.events]).trigger('shell_reply.Kernel', {kernel: this, reply:reply});
         var header = reply.header;
         var content = reply.content;
         var metadata = reply.metadata;
         var msg_type = header.msg_type;
         var callbacks = this.get_callbacks_for_msg(reply.parent_header.msg_id);
         if (callbacks !== undefined) {
             var cb = callbacks[msg_type];
             if (cb !== undefined) {
                 cb(content, metadata);
             }
         };
 
         if (content.payload !== undefined) {
             var payload = content.payload || [];
             this._handle_payload(callbacks, payload);
         }
     };
 
 
     Kernel.prototype._handle_payload = function (callbacks, payload) {
         var l = payload.length;
         // Payloads are handled by triggering events because we don't want the Kernel
         // to depend on the Notebook or Pager classes.
         for (var i=0; i<l; i++) {
             if (payload[i].source === 'IPython.zmq.page.page') {
                 var data = {'text':payload[i].text}
                 $([IPython.events]).trigger('open_with_text.Pager', data);
             } else if (payload[i].source === 'IPython.zmq.zmqshell.ZMQInteractiveShell.set_next_input') {
                 if (callbacks.set_next_input !== undefined) {
                     callbacks.set_next_input(payload[i].text)
                 }
             }
         };
     };
 
 
     Kernel.prototype._handle_iopub_reply = function (e) {
         var reply = $.parseJSON(e.data);
         var content = reply.content;
         var msg_type = reply.header.msg_type;
         var metadata = reply.metadata;
         var callbacks = this.get_callbacks_for_msg(reply.parent_header.msg_id);
         if (msg_type !== 'status' && callbacks === undefined) {
             // Message not from one of this notebook's cells and there are no
             // callbacks to handle it.
             return;
         }
         var output_types = ['stream','display_data','pyout','pyerr'];
         if (output_types.indexOf(msg_type) >= 0) {
             var cb = callbacks['output'];
             if (cb !== undefined) {
                 cb(msg_type, content, metadata);
             }
         } else if (msg_type === 'status') {
             if (content.execution_state === 'busy') {
                 $([IPython.events]).trigger('status_busy.Kernel', {kernel: this});
             } else if (content.execution_state === 'idle') {
                 $([IPython.events]).trigger('status_idle.Kernel', {kernel: this});
             } else if (content.execution_state === 'dead') {
                 this.stop_channels();
                 $([IPython.events]).trigger('status_dead.Kernel', {kernel: this});
             };
         } else if (msg_type === 'clear_output') {
             var cb = callbacks['clear_output'];
             if (cb !== undefined) {
                 cb(content, metadata);
             }
         };
     };
 
 
     IPython.Kernel = Kernel;
 
     return IPython;
 
 }(IPython));
 

IPython/frontend/html/notebook/static/js/notificationarea.js

@@ -1,141 +1,188
 //----------------------------------------------------------------------------
 //  Copyright (C) 2012 The IPython Development Team
 //
 //  Distributed under the terms of the BSD License.  The full license is in
 //  the file COPYING, distributed as part of this software.
 //----------------------------------------------------------------------------
 
 //============================================================================
 // Notification widget
 //============================================================================
 
 var IPython = (function (IPython) {
     "use strict";
     var utils = IPython.utils;
 
 
     var NotificationArea = function (selector) {
         this.selector = selector;
         if (this.selector !== undefined) {
             this.element = $(selector);
         }
         this.widget_dict = {};
     };
 
     NotificationArea.prototype.temp_message = function (msg, timeout, css_class) {
         var uuid = utils.uuid();
         if( css_class == 'danger') {css_class = 'ui-state-error';}
         if( css_class == 'warning') {css_class = 'ui-state-highlight';}
         var tdiv = $('<div>')
             .attr('id',uuid)
             .addClass('notification_widget ui-widget ui-widget-content ui-corner-all')
             .addClass('border-box-sizing')
             .addClass(css_class)
             .hide()
             .text(msg);
 
         $(this.selector).append(tdiv);
         var tmout = Math.max(1500,(timeout||1500));
         tdiv.fadeIn(100);
 
         setTimeout(function () {
                 tdiv.fadeOut(100, function () {tdiv.remove();});
             }, tmout);
     };
 
     NotificationArea.prototype.widget = function(name) {
         if(this.widget_dict[name] == undefined) {
             return this.new_notification_widget(name);
         }
         return this.get_widget(name);
     };
 
     NotificationArea.prototype.get_widget = function(name) {
         if(this.widget_dict[name] == undefined) {
             throw('no widgets with this name');
         }
         return this.widget_dict[name];
     };
 
     NotificationArea.prototype.new_notification_widget = function(name) {
         if(this.widget_dict[name] != undefined) {
             throw('widget with that name already exists ! ');
         }
         var div = $('<div/>').attr('id','notification_'+name);
         $(this.selector).append(div);
         this.widget_dict[name] = new IPython.NotificationWidget('#notification_'+name);
         return this.widget_dict[name];
     };
 
     NotificationArea.prototype.init_notification_widgets = function() {
         var knw = this.new_notification_widget('kernel');
 
         // Kernel events
         $([IPython.events]).on('status_idle.Kernel',function () {
             IPython.save_widget.update_document_title();
             knw.set_message('Kernel Idle',200);
             }
         );
 
         $([IPython.events]).on('status_busy.Kernel',function () {
             window.document.title='(Busy) '+window.document.title;
             knw.set_message("Kernel busy");
         });
 
         $([IPython.events]).on('status_restarting.Kernel',function () {
             IPython.save_widget.update_document_title();
             knw.set_message("Restarting kernel",1000);
         });
 
         $([IPython.events]).on('status_interrupting.Kernel',function () {
             knw.set_message("Interrupting kernel");
         });
 
         $([IPython.events]).on('status_dead.Kernel',function () {
             var dialog = $('<div/>');
-            dialog.html('The kernel has died, would you like to restart it? If you do not restart the kernel, you will be able to save the notebook, but running code will not work until the notebook is reopened.');
+            dialog.html('The kernel has died, would you like to restart it?' +
+                ' If you do not restart the kernel, you will be able to save' +
+                ' the notebook, but running code will not work until the notebook' +
+                ' is reopened.'
+            );
             $(document).append(dialog);
             dialog.dialog({
                 resizable: false,
                 modal: true,
                 title: "Dead kernel",
+                close: function(event, ui) {$(this).dialog('destroy').remove();},
                 buttons : {
                     "Restart": function () {
                         $([IPython.events]).trigger('status_restarting.Kernel');
                         IPython.notebook.start_kernel();
                         $(this).dialog('close');
                     },
-                    "Continue running": function () {
+                    "Don't restart": function () {
                         $(this).dialog('close');
                     }
                 }
             });
         });
 
+        $([IPython.events]).on('websocket_closed.Kernel', function (event, data) {
+            var kernel = data.kernel;
+            var ws_url = data.ws_url;
+            var early = data.early;
+            var msg;
+            console.log(early);
+            if (!early) {
+                    knw.set_message('Reconnecting WebSockets', 1000);
+                    setTimeout(function () {
+                        kernel.start_channels();
+                    }, 5000);
+                return;
+            }
+            console.log('WebSocket connection failed: ', ws_url)
+            msg = "A WebSocket connection to could not be established." +
+                " You will NOT be able to run code. Check your" +
+                " network connection or notebook server configuration.";
+            var dialog = $('<div/>');
+            dialog.html(msg);
+            $(document).append(dialog);
+            dialog.dialog({
+                resizable: false,
+                modal: true,
+                title: "WebSocket connection failed",
+                closeText: "",
+                close: function(event, ui) {$(this).dialog('destroy').remove();},
+                buttons : {
+                    "OK": function () {
+                        $(this).dialog('close');
+                    },
+                    "Reconnect": function () {
+                        knw.set_message('Reconnecting WebSockets', 1000);
+                        setTimeout(function () {
+                            kernel.start_channels();
+                        }, 5000);
+                        $(this).dialog('close');
+                    }
+                }
+            });
+        });
+
+
         var nnw = this.new_notification_widget('notebook');
 
         // Notebook events
         $([IPython.events]).on('notebook_loading.Notebook', function () {
             nnw.set_message("Loading notebook",500);
         });
         $([IPython.events]).on('notebook_loaded.Notebook', function () {
             nnw.set_message("Notebook loaded",500);
         });
         $([IPython.events]).on('notebook_saving.Notebook', function () {
             nnw.set_message("Saving notebook",500);
         });
         $([IPython.events]).on('notebook_saved.Notebook', function () {
             nnw.set_message("Notebook saved",2000);
         });
         $([IPython.events]).on('notebook_save_failed.Notebook', function () {
             nnw.set_message("Notebook save failed");
         });
 
     };
 
     IPython.NotificationArea = NotificationArea;
 
     return IPython;
 
 }(IPython));