diff --git a/IPython/html/static/notebook/js/widget.js b/IPython/html/static/notebook/js/widget.js index 3b92a61..3a255b6 100644 --- a/IPython/html/static/notebook/js/widget.js +++ b/IPython/html/static/notebook/js/widget.js @@ -15,243 +15,239 @@ * @submodule widget */ - "use strict"; // Only run once on a notebook. -require(["components/underscore/underscore-min", - "components/backbone/backbone-min"], function () { - if (IPython.notebook.widget_manager == undefined) { - - //----------------------------------------------------------------------- - // WidgetModel class - //----------------------------------------------------------------------- - var WidgetModel = Backbone.Model.extend({ - apply: function(sender) { - this.save(); - - for (var index in this.views) { - var view = this.views[index]; - if (view !== sender) { - view.refresh(); - } +if (IPython.notebook.widget_manager == undefined) { + + //----------------------------------------------------------------------- + // WidgetModel class + //----------------------------------------------------------------------- + var WidgetModel = Backbone.Model.extend({ + apply: function(sender) { + this.save(); + + for (var index in this.views) { + var view = this.views[index]; + if (view !== sender) { + view.refresh(); } } - }); - - - //----------------------------------------------------------------------- - // WidgetView class - //----------------------------------------------------------------------- - var WidgetView = Backbone.View.extend({ - - initialize: function() { - this.model.on('change',this.refresh,this); - }, + } + }); + + + //----------------------------------------------------------------------- + // WidgetView class + //----------------------------------------------------------------------- + var WidgetView = Backbone.View.extend({ + + initialize: function() { + this.model.on('change',this.refresh,this); + }, + + refresh: function() { + this.update(); - refresh: function() { - this.update(); - - if (this.model.css != undefined) { - for (var selector in this.model.css) { - if (this.model.css.hasOwnProperty(selector)) { - - // Get the elements via the css selector. If the selector is - // blank, assume the current element is the target. - var elements = this.$el.find(selector); - if (selector=='') { - elements = this.$el; - } - - // Apply the css traits to all elements that match the 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)) { + + // Get the elements via the css selector. If the selector is + // blank, assume the current element is the target. + var elements = this.$el.find(selector); + if (selector=='') { + elements = this.$el; + } + + // Apply the css traits to all elements that match the 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]); } } } } } - }, - }); + } + }, + }); + + + //----------------------------------------------------------------------- + // WidgetManager class + //----------------------------------------------------------------------- + // Public constructor + var WidgetManager = function(comm_manager){ + this.comm_manager = comm_manager; + this.widget_model_types = {}; + this.widget_view_types = {}; + this.model_widget_views = {}; + + var that = this; + Backbone.sync = function(method, model, options, error) { + var result = that.send_sync(method, model); + if (options.success) { + options.success(result); + } + }; + } + // Register a widget model type. + 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. + this.comm_manager.register_target(widget_model_name, $.proxy(this.handle_com_open, this)); + + // Register the types of the model and view correspong to this widget type. Later + // the widget manager will initialize these when the comm is opened. + this.widget_model_types[widget_model_name] = widget_model_type; + } - //----------------------------------------------------------------------- - // WidgetManager class - //----------------------------------------------------------------------- - // Public constructor - var WidgetManager = function(comm_manager){ - this.comm_manager = comm_manager; - this.widget_model_types = {}; - this.widget_view_types = {}; - this.model_widget_views = {}; - - var that = this; - Backbone.sync = function(method, model, options, error) { - var result = that.send_sync(method, model); - if (options.success) { - options.success(result); - } - }; - } + // Register a 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; + } - // Register a widget model type. - 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. - this.comm_manager.register_target(widget_model_name, $.proxy(this.handle_com_open, this)); - - // Register the types of the model and view correspong to this widget type. Later - // the widget manager will initialize these when the comm is opened. - this.widget_model_types[widget_model_name] = widget_model_type; - } + // Handle when a comm is opened. + WidgetManager.prototype.handle_com_open = function (comm, msg) { + var widget_type_name = msg.content.target_name; + + // Create the corresponding widget model. + var widget_model = new this.widget_model_types[widget_type_name]; - // Register a 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; - } + // Remember comm associated with the model. + widget_model.comm = comm; + comm.model = widget_model; - // Handle when a comm is opened. - WidgetManager.prototype.handle_com_open = function (comm, msg) { - var widget_type_name = msg.content.target_name; - - // Create the corresponding widget model. - var widget_model = new this.widget_model_types[widget_type_name]; + // Create an array to remember the views associated with the model. + widget_model.views = []; - // Remember comm associated with the model. - widget_model.comm = comm; - comm.model = widget_model; + // Add a handle to delete the control when the comm is closed. + var that = this; + var handle_close = function(msg) { + that.handle_comm_closed(comm, msg); + } + comm.on_close(handle_close); - // Create an array to remember the views associated with the model. - widget_model.views = []; + // Handle incomming messages. + var handle_msg = function(msg) { + that.handle_comm_msg(comm, msg); + } + comm.on_msg(handle_msg); + } - // Add a handle to delete the control when the comm is closed. - var that = this; - var handle_close = function(msg) { - that.handle_comm_closed(comm, msg); + // Create view that represents the model. + WidgetManager.prototype.show_view = function (widget_area, widget_model, widget_view_name) { + var widget_view = new this.widget_view_types[widget_view_name]({model: widget_model}); + widget_view.render(); + widget_model.views.push(widget_view); + + // Handle when the view element is remove from the page. + widget_view.$el.on("remove", function(){ + var index = widget_model.views.indexOf(widget_view); + if (index > -1) { + widget_model.views.splice(index, 1); } - comm.on_close(handle_close); + widget_view.remove(); // Clean-up view - // Handle incomming messages. - var handle_msg = function(msg) { - that.handle_comm_msg(comm, msg); + // Close the comm if there are no views left. + if (widget_model.views.length()==0) { + widget_model.comm.close(); } - comm.on_msg(handle_msg); - } - - // Create view that represents the model. - WidgetManager.prototype.show_view = function (widget_area, widget_model, widget_view_name) { - var widget_view = new this.widget_view_types[widget_view_name]({model: widget_model}); - widget_view.render(); - widget_model.views.push(widget_view); - - // Handle when the view element is remove from the page. - widget_view.$el.on("remove", function(){ - var index = widget_model.views.indexOf(widget_view); - if (index > -1) { - widget_model.views.splice(index, 1); - } - widget_view.remove(); // Clean-up view - - // Close the comm if there are no views left. - if (widget_model.views.length()==0) { - widget_model.comm.close(); - } - }); + }); - // Add the view's element to cell's widget div. - widget_area - .append($("
").append(widget_view.$el)) - .parent().show(); // Show the widget_area (parent of widget_subarea) + // Add the view's element to cell's widget div. + widget_area + .append($("
").append(widget_view.$el)) + .parent().show(); // Show the widget_area (parent of widget_subarea) - // Update the view based on the model contents. - widget_view.refresh(); - } + // Update the view based on the model contents. + widget_view.refresh(); + } - // Handle incomming comm msg. - WidgetManager.prototype.handle_comm_msg = function (comm, msg) { - // Different logic for different methods. - var method = msg.content.data.method; - switch (method){ - case 'show': - - // TODO: Get cell from registered output handler. - var cell = IPython.notebook.get_cell(IPython.notebook.get_selected_index()-1); - var widget_subarea = cell.element.find('.widget_area').find('.widget_subarea'); - - if (msg.content.data.parent != undefined) { - var find_results = widget_subarea.find("." + msg.content.data.parent); - if (find_results.length > 0) { - widget_subarea = find_results; - } + // Handle incomming comm msg. + WidgetManager.prototype.handle_comm_msg = function (comm, msg) { + // Different logic for different methods. + var method = msg.content.data.method; + switch (method){ + case 'show': + + // TODO: Get cell from registered output handler. + var cell = IPython.notebook.get_cell(IPython.notebook.get_selected_index()-1); + var widget_subarea = cell.element.find('.widget_area').find('.widget_subarea'); + + if (msg.content.data.parent != undefined) { + var find_results = widget_subarea.find("." + msg.content.data.parent); + if (find_results.length > 0) { + widget_subarea = find_results; } + } - this.show_view(widget_subarea, comm.model, msg.content.data.view_name); - break; - case 'update': - this.handle_update(comm, msg.content.data.state); - break; - } + this.show_view(widget_subarea, comm.model, msg.content.data.view_name); + break; + case 'update': + this.handle_update(comm, msg.content.data.state); + break; } + } - // Handle when a widget is updated via the python side. - WidgetManager.prototype.handle_update = function (comm, state) { - for (var key in state) { - if (state.hasOwnProperty(key)) { - if (key=="_css"){ - comm.model.css = state[key]; - } else { - comm.model.set(key, state[key]); - } + // Handle when a widget is updated via the python side. + WidgetManager.prototype.handle_update = function (comm, state) { + for (var key in state) { + if (state.hasOwnProperty(key)) { + if (key=="_css"){ + comm.model.css = state[key]; + } else { + comm.model.set(key, state[key]); } } - comm.model.save(); } + comm.model.save(); + } - // Handle when a widget is closed. - WidgetManager.prototype.handle_comm_closed = function (comm, msg) { - for (var view_index in comm.model.views) { - var view = comm.model.views[view_index]; - view.remove(); - } + // Handle when a widget is closed. + WidgetManager.prototype.handle_comm_closed = function (comm, msg) { + for (var view_index in comm.model.views) { + var view = comm.model.views[view_index]; + view.remove(); } + } - // Get the cell output area corresponding to the comm. - WidgetManager.prototype._get_comm_outputarea = function (comm) { - // TODO: get element from comm instead of guessing - var cell = IPython.notebook.get_cell(IPython.notebook.get_selected_index()) - return cell.output_area; - } + // Get the cell output area corresponding to the comm. + WidgetManager.prototype._get_comm_outputarea = function (comm) { + // TODO: get element from comm instead of guessing + var cell = IPython.notebook.get_cell(IPython.notebook.get_selected_index()) + return cell.output_area; + } - // Send widget state to python backend. - WidgetManager.prototype.send_sync = function (method, model) { - - // Create a callback for the output if the widget has an output area associate with it. - var callbacks = {}; - var comm = model.comm; - var outputarea = this._get_comm_outputarea(comm); - if (outputarea != null) { - callbacks = { - iopub : { - output : $.proxy(outputarea.handle_output, outputarea), - clear_output : $.proxy(outputarea.handle_clear_output, outputarea)} - }; + // Send widget state to python backend. + WidgetManager.prototype.send_sync = function (method, model) { + + // Create a callback for the output if the widget has an output area associate with it. + var callbacks = {}; + var comm = model.comm; + var outputarea = this._get_comm_outputarea(comm); + if (outputarea != null) { + callbacks = { + iopub : { + output : $.proxy(outputarea.handle_output, outputarea), + clear_output : $.proxy(outputarea.handle_clear_output, outputarea)} }; - var model_json = model.toJSON(); - var data = {sync_method: method, sync_data: model_json}; - comm.send(data, callbacks); - return model_json; - } + }; + var model_json = model.toJSON(); + var data = {sync_method: method, sync_data: model_json}; + comm.send(data, callbacks); + return model_json; + } - IPython.WidgetManager = WidgetManager; - IPython.WidgetModel = WidgetModel; - IPython.WidgetView = WidgetView; + IPython.WidgetManager = WidgetManager; + IPython.WidgetModel = WidgetModel; + IPython.WidgetView = WidgetView; - IPython.notebook.widget_manager = new WidgetManager(IPython.notebook.kernel.comm_manager); + IPython.notebook.widget_manager = new WidgetManager(IPython.notebook.kernel.comm_manager); - } -}); +}; diff --git a/IPython/html/static/notebook/js/widgets/container.js b/IPython/html/static/notebook/js/widgets/container.js index b0a0cf7..a4f1325 100644 --- a/IPython/html/static/notebook/js/widgets/container.js +++ b/IPython/html/static/notebook/js/widgets/container.js @@ -1,19 +1,17 @@ -require(["notebook/js/widget"], function () { - var ContainerModel = IPython.WidgetModel.extend({}); - IPython.notebook.widget_manager.register_widget_model('container_widget', ContainerModel); +var ContainerModel = IPython.WidgetModel.extend({}); +IPython.notebook.widget_manager.register_widget_model('container_widget', ContainerModel); - var ContainerView = IPython.WidgetView.extend({ - - render : function(){ - this.$el.html(''); - this.$container = $('
') - .addClass('container') - .addClass(this.model.comm.comm_id); - this.$el.append(this.$container); - }, - - update : function(){}, - }); +var ContainerView = IPython.WidgetView.extend({ + + render : function(){ + this.$el.html(''); + this.$container = $('
') + .addClass('container') + .addClass(this.model.comm.comm_id); + this.$el.append(this.$container); + }, + + update : function(){}, +}); - IPython.notebook.widget_manager.register_widget_view('ContainerView', ContainerView); -}); \ No newline at end of file +IPython.notebook.widget_manager.register_widget_view('ContainerView', ContainerView); diff --git a/IPython/html/static/notebook/js/widgets/float_range.js b/IPython/html/static/notebook/js/widgets/float_range.js index 8992097..0fc5366 100644 --- a/IPython/html/static/notebook/js/widgets/float_range.js +++ b/IPython/html/static/notebook/js/widgets/float_range.js @@ -1,121 +1,119 @@ -require(["notebook/js/widget"], function () { - var FloatRangeWidgetModel = IPython.WidgetModel.extend({}); - IPython.notebook.widget_manager.register_widget_model('FloatRangeWidgetModel', FloatRangeWidgetModel); +var FloatRangeWidgetModel = IPython.WidgetModel.extend({}); +IPython.notebook.widget_manager.register_widget_model('FloatRangeWidgetModel', FloatRangeWidgetModel); - var FloatSliderView = IPython.WidgetView.extend({ +var FloatSliderView = IPython.WidgetView.extend({ + + // Called when view is rendered. + render : function(){ + this.$el + .html('') + .addClass(this.model.comm.comm_id); + this.$slider = $('
') + .slider({}) + .addClass('slider'); - // Called when view is rendered. - render : function(){ - this.$el - .html('') - .addClass(this.model.comm.comm_id); - this.$slider = $('
') - .slider({}) - .addClass('slider'); - - // Put the slider in a container - this.$slider_container = $('
') - .css('padding-top', '4px') - .css('padding-bottom', '4px') - .append(this.$slider); - this.$el.append(this.$slider_container); - - // Set defaults. - this.update(); - }, + // Put the slider in a container + this.$slider_container = $('
') + .css('padding-top', '4px') + .css('padding-bottom', '4px') + .append(this.$slider); + this.$el.append(this.$slider_container); - // Handles: Backend -> Frontend Sync - // Frontent -> Frontend Sync - update : function(){ - // Slider related keys. - var _keys = ['value', 'step', 'max', 'min', 'disabled', 'orientation']; - for (var index in _keys) { - var key = _keys[index]; - if (this.model.get(key) != undefined) { - this.$slider.slider("option", key, this.model.get(key)); - } + // Set defaults. + this.update(); + }, + + // Handles: Backend -> Frontend Sync + // Frontent -> Frontend Sync + update : function(){ + // Slider related keys. + var _keys = ['value', 'step', 'max', 'min', 'disabled', 'orientation']; + for (var index in _keys) { + var key = _keys[index]; + if (this.model.get(key) != undefined) { + this.$slider.slider("option", key, this.model.get(key)); } - }, - - // Handles: User input - events: { "slide" : "handleSliderChange" }, - handleSliderChange: function(e, ui) { - this.model.set('value', ui.value); - this.model.apply(this); - }, - }); + } + }, + + // Handles: User input + events: { "slide" : "handleSliderChange" }, + handleSliderChange: function(e, ui) { + this.model.set('value', ui.value); + this.model.apply(this); + }, +}); - IPython.notebook.widget_manager.register_widget_view('FloatSliderView', FloatSliderView); +IPython.notebook.widget_manager.register_widget_view('FloatSliderView', FloatSliderView); - var FloatTextView = IPython.WidgetView.extend({ - - // Called when view is rendered. - render : function(){ - this.$el - .html('') - .addClass(this.model.comm.comm_id); - this.$textbox = $('') - .addClass('input') - .appendTo(this.$el); - this.update(); // Set defaults. - }, - - // Handles: Backend -> Frontend Sync - // Frontent -> Frontend Sync - update : function(){ - var value = this.model.get('value'); - if (!this.changing && parseFloat(this.$textbox.val()) != value) { - this.$textbox.val(value); - } - - if (this.model.get('disabled')) { - this.$textbox.attr('disabled','disabled'); - } else { - this.$textbox.removeAttr('disabled'); - } - }, +var FloatTextView = IPython.WidgetView.extend({ + + // Called when view is rendered. + render : function(){ + this.$el + .html('') + .addClass(this.model.comm.comm_id); + this.$textbox = $('') + .addClass('input') + .appendTo(this.$el); + this.update(); // Set defaults. + }, + + // Handles: Backend -> Frontend Sync + // Frontent -> Frontend Sync + update : function(){ + var value = this.model.get('value'); + if (!this.changing && parseFloat(this.$textbox.val()) != value) { + this.$textbox.val(value); + } + if (this.model.get('disabled')) { + this.$textbox.attr('disabled','disabled'); + } else { + this.$textbox.removeAttr('disabled'); + } + }, + + + events: {"keyup input" : "handleChanging", + "paste input" : "handleChanging", + "cut input" : "handleChanging", + "change input" : "handleChanged"}, // Fires only when control is validated or looses focus. + + // Handles and validates user input. + handleChanging: function(e) { - events: {"keyup input" : "handleChanging", - "paste input" : "handleChanging", - "cut input" : "handleChanging", - "change input" : "handleChanged"}, // Fires only when control is validated or looses focus. + // Try to parse value as a float. + var numericalValue = 0.0; + if (e.target.value != '') { + numericalValue = parseFloat(e.target.value); + } - // Handles and validates user input. - handleChanging: function(e) { - - // Try to parse value as a float. - var numericalValue = 0.0; - if (e.target.value != '') { - numericalValue = parseFloat(e.target.value); - } + // If parse failed, reset value to value stored in model. + if (isNaN(numericalValue)) { + e.target.value = this.model.get('value'); + } else if (!isNaN(numericalValue)) { + numericalValue = Math.min(this.model.get('max'), numericalValue); + numericalValue = Math.max(this.model.get('min'), numericalValue); - // If parse failed, reset value to value stored in model. - if (isNaN(numericalValue)) { - e.target.value = this.model.get('value'); - } else if (!isNaN(numericalValue)) { - numericalValue = Math.min(this.model.get('max'), numericalValue); - numericalValue = Math.max(this.model.get('min'), numericalValue); - - // Apply the value if it has changed. - if (numericalValue != this.model.get('value')) { - this.changing = true; - this.model.set('value', numericalValue); - this.model.apply(this); - this.changing = false; - } - } - }, - - // Applies validated input. - handleChanged: function(e) { - // Update the textbox - if (this.model.get('value') != e.target.value) { - e.target.value = this.model.get('value'); + // Apply the value if it has changed. + if (numericalValue != this.model.get('value')) { + this.changing = true; + this.model.set('value', numericalValue); + this.model.apply(this); + this.changing = false; } } - }); + }, + + // Applies validated input. + handleChanged: function(e) { + // Update the textbox + if (this.model.get('value') != e.target.value) { + e.target.value = this.model.get('value'); + } + } +}); - IPython.notebook.widget_manager.register_widget_view('FloatTextView', FloatTextView); -}); \ No newline at end of file +IPython.notebook.widget_manager.register_widget_view('FloatTextView', FloatTextView); diff --git a/IPython/html/static/notebook/js/widgets/int_range.js b/IPython/html/static/notebook/js/widgets/int_range.js index bf71c6c..996aeec 100644 --- a/IPython/html/static/notebook/js/widgets/int_range.js +++ b/IPython/html/static/notebook/js/widgets/int_range.js @@ -1,119 +1,117 @@ -require(["notebook/js/widget"], function () { - var IntRangeWidgetModel = IPython.WidgetModel.extend({}); - IPython.notebook.widget_manager.register_widget_model('IntRangeWidgetModel', IntRangeWidgetModel); +var IntRangeWidgetModel = IPython.WidgetModel.extend({}); +IPython.notebook.widget_manager.register_widget_model('IntRangeWidgetModel', IntRangeWidgetModel); - var IntSliderView = IPython.WidgetView.extend({ +var IntSliderView = IPython.WidgetView.extend({ + + // Called when view is rendered. + render : function(){ + this.$el.html(''); + this.$slider = $('
') + .slider({}) + .addClass('slider'); - // Called when view is rendered. - render : function(){ - this.$el.html(''); - this.$slider = $('
') - .slider({}) - .addClass('slider'); - - // Put the slider in a container - this.$slider_container = $('
') - .css('padding-top', '4px') - .css('padding-bottom', '4px') - .addClass(this.model.comm.comm_id) - .append(this.$slider); - this.$el.append(this.$slider_container); - - // Set defaults. - this.update(); - }, + // Put the slider in a container + this.$slider_container = $('
') + .css('padding-top', '4px') + .css('padding-bottom', '4px') + .addClass(this.model.comm.comm_id) + .append(this.$slider); + this.$el.append(this.$slider_container); - // Handles: Backend -> Frontend Sync - // Frontent -> Frontend Sync - update : function(){ - // Slider related keys. - var _keys = ['value', 'step', 'max', 'min', 'disabled', 'orientation']; - for (var index in _keys) { - var key = _keys[index]; - if (this.model.get(key) != undefined) { - this.$slider.slider("option", key, this.model.get(key)); - } + // Set defaults. + this.update(); + }, + + // Handles: Backend -> Frontend Sync + // Frontent -> Frontend Sync + update : function(){ + // Slider related keys. + var _keys = ['value', 'step', 'max', 'min', 'disabled', 'orientation']; + for (var index in _keys) { + var key = _keys[index]; + if (this.model.get(key) != undefined) { + this.$slider.slider("option", key, this.model.get(key)); } - }, - - // Handles: User input - events: { "slide" : "handleSliderChange" }, - handleSliderChange: function(e, ui) { - this.model.set('value', ~~ui.value); // Double bit-wise not to truncate decimel - this.model.apply(this); - }, - }); + } + }, + + // Handles: User input + events: { "slide" : "handleSliderChange" }, + handleSliderChange: function(e, ui) { + this.model.set('value', ~~ui.value); // Double bit-wise not to truncate decimel + this.model.apply(this); + }, +}); - IPython.notebook.widget_manager.register_widget_view('IntSliderView', IntSliderView); +IPython.notebook.widget_manager.register_widget_view('IntSliderView', IntSliderView); - var IntTextView = IPython.WidgetView.extend({ - - // Called when view is rendered. - render : function(){ - this.$el - .html('') - .addClass(this.model.comm.comm_id); - this.$textbox = $('') - .addClass('input') - .appendTo(this.$el); - this.update(); // Set defaults. - }, - - // Handles: Backend -> Frontend Sync - // Frontent -> Frontend Sync - update : function(){ - var value = this.model.get('value'); - if (!this.changing && parseInt(this.$textbox.val()) != value) { - this.$textbox.val(value); - } - - if (this.model.get('disabled')) { - this.$textbox.attr('disabled','disabled'); - } else { - this.$textbox.removeAttr('disabled'); - } - }, +var IntTextView = IPython.WidgetView.extend({ + + // Called when view is rendered. + render : function(){ + this.$el + .html('') + .addClass(this.model.comm.comm_id); + this.$textbox = $('') + .addClass('input') + .appendTo(this.$el); + this.update(); // Set defaults. + }, + + // Handles: Backend -> Frontend Sync + // Frontent -> Frontend Sync + update : function(){ + var value = this.model.get('value'); + if (!this.changing && parseInt(this.$textbox.val()) != value) { + this.$textbox.val(value); + } + if (this.model.get('disabled')) { + this.$textbox.attr('disabled','disabled'); + } else { + this.$textbox.removeAttr('disabled'); + } + }, + + + events: {"keyup input" : "handleChanging", + "paste input" : "handleChanging", + "cut input" : "handleChanging", + "change input" : "handleChanged"}, // Fires only when control is validated or looses focus. + + // Handles and validates user input. + handleChanging: function(e) { - events: {"keyup input" : "handleChanging", - "paste input" : "handleChanging", - "cut input" : "handleChanging", - "change input" : "handleChanged"}, // Fires only when control is validated or looses focus. + // Try to parse value as a float. + var numericalValue = 0; + if (e.target.value != '') { + numericalValue = parseInt(e.target.value); + } - // Handles and validates user input. - handleChanging: function(e) { - - // Try to parse value as a float. - var numericalValue = 0; - if (e.target.value != '') { - numericalValue = parseInt(e.target.value); - } + // If parse failed, reset value to value stored in model. + if (isNaN(numericalValue)) { + e.target.value = this.model.get('value'); + } else if (!isNaN(numericalValue)) { + numericalValue = Math.min(this.model.get('max'), numericalValue); + numericalValue = Math.max(this.model.get('min'), numericalValue); - // If parse failed, reset value to value stored in model. - if (isNaN(numericalValue)) { - e.target.value = this.model.get('value'); - } else if (!isNaN(numericalValue)) { - numericalValue = Math.min(this.model.get('max'), numericalValue); - numericalValue = Math.max(this.model.get('min'), numericalValue); - - // Apply the value if it has changed. - if (numericalValue != this.model.get('value')) { - this.changing = true; - this.model.set('value', numericalValue); - this.model.apply(this); - this.changing = false; - } - } - }, - - // Applies validated input. - handleChanged: function(e) { - // Update the textbox - if (this.model.get('value') != e.target.value) { - e.target.value = this.model.get('value'); + // Apply the value if it has changed. + if (numericalValue != this.model.get('value')) { + this.changing = true; + this.model.set('value', numericalValue); + this.model.apply(this); + this.changing = false; } } - }); + }, + + // Applies validated input. + handleChanged: function(e) { + // Update the textbox + if (this.model.get('value') != e.target.value) { + e.target.value = this.model.get('value'); + } + } +}); - IPython.notebook.widget_manager.register_widget_view('IntTextView', IntTextView); -}); \ No newline at end of file +IPython.notebook.widget_manager.register_widget_view('IntTextView', IntTextView); diff --git a/IPython/html/static/notebook/js/widgets/selection.js b/IPython/html/static/notebook/js/widgets/selection.js index a7b0a97..e4eedb5 100644 --- a/IPython/html/static/notebook/js/widgets/selection.js +++ b/IPython/html/static/notebook/js/widgets/selection.js @@ -1,130 +1,128 @@ -require(["notebook/js/widget"], function () { - var SelectionWidgetModel = IPython.WidgetModel.extend({}); - IPython.notebook.widget_manager.register_widget_model('SelectionWidgetModel', SelectionWidgetModel); +var SelectionWidgetModel = IPython.WidgetModel.extend({}); +IPython.notebook.widget_manager.register_widget_model('SelectionWidgetModel', SelectionWidgetModel); - var DropdownView = IPython.WidgetView.extend({ +var DropdownView = IPython.WidgetView.extend({ + + // Called when view is rendered. + render : function(){ - // Called when view is rendered. - render : function(){ - - this.$el - .html('') - .addClass(this.model.comm.comm_id); - this.$buttongroup = $('
') - .addClass('btn-group') - .appendTo(this.$el); - this.$droplabel = $('