Fixed some typos related to _.each loops

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

@@ -1,188 +1,189
 //----------------------------------------------------------------------------
 //  Copyright (C) 2013  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.
 //----------------------------------------------------------------------------
 
 //============================================================================
 // WidgetModel, WidgetView, and WidgetManager
 //============================================================================
 /**
  * Base Widget classes
  * @module IPython
  * @namespace IPython
  * @submodule widget
  */
 
 (function () {
     "use strict";
 
     // Use require.js 'define' method so that require.js is intelligent enough to
     // syncronously load everything within this file when it is being 'required' 
     // elsewhere.
     define(["underscore",
              "backbone",
             ], function (Underscore, Backbone) {
 
         //--------------------------------------------------------------------
         // WidgetManager class
         //--------------------------------------------------------------------
         var WidgetManager = function (comm_manager) {
             // Public constructor
             WidgetManager._managers.push(this);
 
             // Attach a comm manager to the 
             this.comm_manager = comm_manager;
             this._models = {}; /* Dictionary of model ids and model instances */
 
             // Register already-registered widget model types with the comm manager.
+            var that = this;
             _.each(WidgetManager._model_types, function(value, key) {
-                this.comm_manager.register_target(value, $.proxy(this._handle_comm_open, this));
+                that.comm_manager.register_target(value, $.proxy(that._handle_comm_open, that));
             });
         };
 
         //--------------------------------------------------------------------
         // Class level
         //--------------------------------------------------------------------
         WidgetManager._model_types = {}; /* Dictionary of model type names (target_name) and model types. */
         WidgetManager._view_types = {}; /* Dictionary of view names and view types. */
         WidgetManager._managers = []; /* List of widget managers */
 
         WidgetManager.register_widget_model = function (model_name, model_type) {
             // Registers a widget model by name.
             WidgetManager._model_types[model_name] = 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.
             _.each(WidgetManager._managers, function(instance, i) {
                 if (instance.comm_manager !== null) {
                     instance.comm_manager.register_target(model_name, $.proxy(instance._handle_comm_open, instance));
                 }
             });
         };
 
         WidgetManager.register_widget_view = function (view_name, view_type) {
             // Registers a widget view by name.
             WidgetManager._view_types[view_name] = view_type;
         };
 
         //--------------------------------------------------------------------
         // Instance level
         //--------------------------------------------------------------------
         WidgetManager.prototype.display_view = function(msg, model) {
             var cell = this.get_msg_cell(msg.parent_header.msg_id);
             if (cell === null) {
                 console.log("Could not determine where the display" + 
                     " message was from.  Widget will not be displayed");
             } else {
                 var view = this.create_view(model, {cell: cell});
                 if (view === null) {
                     console.error("View creation failed", model);
                 }
                 if (cell.widget_subarea !== undefined
                     && cell.widget_subarea !== null) {
                     
                     cell.widget_area.show();
                     cell.widget_subarea.append(view.$el);
                 }
             }
         },
 
         WidgetManager.prototype.create_view = function(model, options) {
             var view_name = model.get('view_name');
             var ViewType = WidgetManager._view_types[view_name];
             if (ViewType !== undefined && ViewType !== null) {
                 var parameters = {model: model, options: options};
                 var view = new ViewType(parameters);
                 view.render();
                 IPython.keyboard_manager.register_events(view.$el);
                 model.views.push(view);
                 model.on('destroy', view.remove, view);
                 return view;
             }
             return null;
         },
 
         WidgetManager.prototype.get_msg_cell = function (msg_id) {
             var cell = null;
             // First, check to see if the msg was triggered by cell execution.
             if (IPython.notebook !== undefined && IPython.notebook !== null) {
                 cell = IPython.notebook.get_msg_cell(msg_id);
             }
             if (cell !== null) {
                 return cell
             }
             // Second, check to see if a get_cell callback was defined
             // for the message.  get_cell callbacks are registered for
             // widget messages, so this block is actually checking to see if the
             // message was triggered by a widget.
             var kernel = this.comm_manager.kernel;
             if (kernel !== undefined && kernel !== null) {
                 var callbacks = kernel.get_callbacks_for_msg(msg_id);
                 if (callbacks !== undefined && 
                     callbacks.iopub !== undefined && 
                     callbacks.iopub.get_cell !== undefined) {
 
                     return callbacks.iopub.get_cell();
                 }    
             }
             
             // Not triggered by a cell or widget (no get_cell callback 
             // exists).
             return null;
         };
 
         WidgetManager.prototype.callbacks = function (view) {
             // callback handlers specific a view
             var callbacks = {};
             var cell = view.options.cell;
             if (cell !== null) {
                 // Try to get output handlers
                 var handle_output = null;
                 var handle_clear_output = null;
                 if (cell.output_area !== undefined && cell.output_area !== null) {
                     handle_output = $.proxy(cell.output_area.handle_output, cell.output_area);
                     handle_clear_output = $.proxy(cell.output_area.handle_clear_output, cell.output_area);
                 }
 
                 // Create callback dict using what is known
                 var that = this;
                 callbacks = {
                     iopub : {
                         output : handle_output,
                         clear_output : handle_clear_output,
 
                         // Special function only registered by widget messages.
                         // Allows us to get the cell for a message so we know
                         // where to add widgets if the code requires it.
                         get_cell : function () {
                             return cell;
                         },
                     },
                 };
             }
             return callbacks;
         };
 
         WidgetManager.prototype.get_model = function (model_id) {
             // Look-up a model instance by its id.
             var model = this._models[model_id];
             if (model !== undefined && model.id == model_id) {
                 return model;
             }
             return null;
         };
 
         WidgetManager.prototype._handle_comm_open = function (comm, msg) {
             // Handle when a comm is opened.
             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);
             this._models[model_id] = widget_model;
         };
         
         IPython.WidgetManager = WidgetManager;
         return IPython.WidgetManager;
     });
 }());

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

@@ -1,372 +1,372
 //----------------------------------------------------------------------------
 //  Copyright (C) 2013 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.
 //----------------------------------------------------------------------------
 
 //============================================================================
 // SelectionWidget
 //============================================================================
 
 /**
  * @module IPython
  * @namespace IPython
  **/
 
 define(["notebook/js/widgets/widget"], function(WidgetManager){
 
     var DropdownView = IPython.DOMWidgetView.extend({
         render : function(){
             // Called when view is rendered.            
             this.$el
                 .addClass('widget-hbox-single');
             this.$label = $('<div />')
                 .appendTo(this.$el)
                 .addClass('widget-hlabel')
                 .hide();
             this.$buttongroup = $('<div />')
                 .addClass('widget_item')
                 .addClass('btn-group')
                 .appendTo(this.$el);
             this.$el_to_style = this.$buttongroup; // Set default element to style
             this.$droplabel = $('<button />')
                 .addClass('btn')
                 .addClass('widget-combo-btn')
                 .text(' ')
                 .appendTo(this.$buttongroup);
             this.$dropbutton = $('<button />')
                 .addClass('btn')
                 .addClass('dropdown-toggle')
                 .addClass('widget-combo-carrot-btn')
                 .attr('data-toggle', 'dropdown')
                 .append($('<span />').addClass("caret"))
                 .appendTo(this.$buttongroup);
             this.$droplist = $('<ul />')
                 .addClass('dropdown-menu')
                 .appendTo(this.$buttongroup);
             
             // Set defaults.
             this.update();
         },
         
         update : function(options){
             // Update the contents of this view
             //
             // Called when the model is changed.  The model may have been 
             // changed by another view or by a state update from the back-end.
 
             if (options === undefined || options.updated_view != this) {
                 var selected_item_text = this.model.get('value');
                 if (selected_item_text.length === 0) {
                     this.$droplabel.text(' ');
                 } else {
                     this.$droplabel.text(selected_item_text);
                 }
                 
                 var items = this.model.get('values');
                 var $replace_droplist = $('<ul />')
                     .addClass('dropdown-menu');
                 _.each(items, function(item, i) {
                     var item_button = $('<a href="#"/>')
                         .text(item)
                         .on('click', $.proxy(this.handle_click, this));
                     $replace_droplist.append($('<li />').append(item_button));
                 });
 
                 this.$droplist.replaceWith($replace_droplist);
                 this.$droplist.remove();
                 this.$droplist = $replace_droplist;
                 
                 if (this.model.get('disabled')) {
                     this.$buttongroup.attr('disabled','disabled');
                     this.$droplabel.attr('disabled','disabled');
                     this.$dropbutton.attr('disabled','disabled');
                     this.$droplist.attr('disabled','disabled');
                 } else {
                     this.$buttongroup.removeAttr('disabled');
                     this.$droplabel.removeAttr('disabled');
                     this.$dropbutton.removeAttr('disabled');
                     this.$droplist.removeAttr('disabled');
                 }
 
                 var description = this.model.get('description');
                 if (description.length === 0) {
                     this.$label.hide();
                 } else {
                     this.$label.text(description);
                     this.$label.show();
                 }
             }
             return DropdownView.__super__.update.apply(this);
         },
 
         handle_click: function (e) {
             // Handle when a value is clicked.
             
             // Calling model.set will trigger all of the other views of the 
             // model to update.
             this.model.set('value', $(e.target).text(), {updated_view: this});
             this.touch();
         },
         
     });
     WidgetManager.register_widget_view('DropdownView', DropdownView);
 
 
     var RadioButtonsView = IPython.DOMWidgetView.extend({    
         render : function(){
             // Called when view is rendered.
             this.$el
                 .addClass('widget-hbox');
             this.$label = $('<div />')
                 .appendTo(this.$el)
                 .addClass('widget-hlabel')
                 .hide();
             this.$container = $('<div />')
                 .appendTo(this.$el)
                 .addClass('widget-container')
                 .addClass('vbox');
             this.$el_to_style = this.$container; // Set default element to style
             this.update();
         },
         
         update : function(options){
             // Update the contents of this view
             //
             // Called when the model is changed.  The model may have been 
             // changed by another view or by a state update from the back-end.
             if (options === undefined || options.updated_view != this) {
                 // Add missing items to the DOM.
                 var items = this.model.get('values');
                 var disabled = this.model.get('disabled');
                 _.each(items, function(item, index) {
                     var item_query = ' :input[value="' + item + '"]';
                     if (this.$el.find(item_query).length === 0) {
                         var $label = $('<label />')
                             .addClass('radio')
                             .text(item)
                             .appendTo(this.$container);
                         
                         $('<input />')
                             .attr('type', 'radio')
                             .addClass(this.model)
                             .val(item)
                             .prependTo($label)
                             .on('click', $.proxy(this.handle_click, this));
                     }
                     
                     var $item_element = this.$container.find(item_query);
                     if (this.model.get('value') == item) {
                         $item_element.prop('checked', true);
                     } else {
                         $item_element.prop('checked', false);
                     }
                     $item_element.prop('disabled', disabled);
                 });
                 
                 // Remove items that no longer exist.
                 this.$container.find('input').each(function(i, obj) {
                     var value = $(obj).val();
                     var found = false;
                     _.each(items, function(item, index) {
                         if (item == value) {
                             found = true;
-                            break;
+                            return false;
                         }
                     });
                     
                     if (!found) {
                         $(obj).parent().remove();
                     }
                 });
 
                 var description = this.model.get('description');
                 if (description.length === 0) {
                     this.$label.hide();
                 } else {
                     this.$label.text(description);
                     this.$label.show();
                 }
             }
             return RadioButtonsView.__super__.update.apply(this);
         },
 
         handle_click: function (e) {
             // Handle when a value is clicked.
             
             // Calling model.set will trigger all of the other views of the 
             // model to update.
             this.model.set('value', $(e.target).val(), {updated_view: this});
             this.touch();
         },
     });
     WidgetManager.register_widget_view('RadioButtonsView', RadioButtonsView);
 
 
     var ToggleButtonsView = IPython.DOMWidgetView.extend({    
         render : function(){
             // Called when view is rendered.
             this.$el
                 .addClass('widget-hbox-single');
             this.$label = $('<div />')
                 .appendTo(this.$el)
                 .addClass('widget-hlabel')
                 .hide();
             this.$buttongroup = $('<div />')
                 .addClass('btn-group')
                 .attr('data-toggle', 'buttons-radio')
                 .appendTo(this.$el);
             this.$el_to_style = this.$buttongroup; // Set default element to style
             this.update();
         },
         
         update : function(options){
             // Update the contents of this view
             //
             // Called when the model is changed.  The model may have been 
             // changed by another view or by a state update from the back-end.
             if (options === undefined || options.updated_view != this) {
                 // Add missing items to the DOM.
                 var items = this.model.get('values');
                 var disabled = this.model.get('disabled');
                 _.each(items, function(item, index) {
                    var item_query = ' :contains("' + item + '")';
                     if (this.$buttongroup.find(item_query).length === 0) {
                         $('<button />')
                             .attr('type', 'button')
                             .addClass('btn')
                             .text(item)
                             .appendTo(this.$buttongroup)
                             .on('click', $.proxy(this.handle_click, this));
                     }
                     
                     var $item_element = this.$buttongroup.find(item_query);
                     if (this.model.get('value') == item) {
                         $item_element.addClass('active');
                     } else {
                         $item_element.removeClass('active');
                     }
                     $item_element.prop('disabled', disabled); 
                 });
                 
                 // Remove items that no longer exist.
                 this.$buttongroup.find('button').each(function(i, obj) {
                     var value = $(obj).text();
                     var found = false;
                     _.each(items, function(item, index) {
                         if (item == value) {
                             found = true;
-                            break;
+                            return false;
                         }
                     });
 
                     if (!found) {
                         $(obj).remove();
                     }
                 });
 
                 var description = this.model.get('description');
                 if (description.length === 0) {
                     this.$label.hide();
                 } else {
                     this.$label.text(description);
                     this.$label.show();
                 }
             }
             return ToggleButtonsView.__super__.update.apply(this);
         },
 
         handle_click: function (e) {
             // Handle when a value is clicked.
             
             // Calling model.set will trigger all of the other views of the 
             // model to update.
             this.model.set('value', $(e.target).text(), {updated_view: this});
             this.touch();
         },    
     });
     WidgetManager.register_widget_view('ToggleButtonsView', ToggleButtonsView);
 
 
     var ListBoxView = IPython.DOMWidgetView.extend({    
         render : function(){
             // Called when view is rendered.
             this.$el
                 .addClass('widget-hbox');
             this.$label = $('<div />')
                 .appendTo(this.$el)
                 .addClass('widget-hlabel')
                 .hide();
             this.$listbox = $('<select />')
                 .addClass('widget-listbox')
                 .attr('size', 6)
                 .appendTo(this.$el);
             this.$el_to_style = this.$listbox; // Set default element to style
             this.update();
         },
         
         update : function(options){
             // Update the contents of this view
             //
             // Called when the model is changed.  The model may have been 
             // changed by another view or by a state update from the back-end.
             if (options === undefined || options.updated_view != this) {
                 // Add missing items to the DOM.
                 var items = this.model.get('values');
                 _.each(items, function(item, index) {
                    var item_query = ' :contains("' + item + '")';
                     if (this.$listbox.find(item_query).length === 0) {
                         $('<option />')
                             .text(item)
                             .attr('value', item)
                             .appendTo(this.$listbox)
                             .on('click', $.proxy(this.handle_click, this));
                     } 
                 });
 
                 // Select the correct element
                 this.$listbox.val(this.model.get('value'));
                 
                 // Disable listbox if needed
                 var disabled = this.model.get('disabled');
                 this.$listbox.prop('disabled', disabled);
 
                 // Remove items that no longer exist.
                 this.$listbox.find('option').each(function(i, obj) {
                     var value = $(obj).text();
                     var found = false;
                     _.each(items, function(item, index) {
                         if (item == value) {
                             found = true;
-                            break;
+                            return false;
                         }
                     });
                     
                     if (!found) {
                         $(obj).remove();
                     }
                 });
 
                 var description = this.model.get('description');
                 if (description.length === 0) {
                     this.$label.hide();
                 } else {
                     this.$label.text(description);
                     this.$label.show();
                 }
             }
             return ListBoxView.__super__.update.apply(this);
         },
 
         handle_click: function (e) {
             // Handle when a value is clicked.
             
             // Calling model.set will trigger all of the other views of the 
             // model to update.
             this.model.set('value', $(e.target).text(), {updated_view: this});
             this.touch();
         },    
     });
     WidgetManager.register_widget_view('ListBoxView', ListBoxView);
 });