bool.js
123 lines
| 4.3 KiB
| application/javascript
|
JavascriptLexer
|
r14366 | //---------------------------------------------------------------------------- | ||
// 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. | ||||
//---------------------------------------------------------------------------- | ||||
//============================================================================ | ||||
// BoolWidget | ||||
//============================================================================ | ||||
/** | ||||
* @module IPython | ||||
* @namespace IPython | ||||
**/ | ||||
|
r14259 | |||
|
r14374 | define(["notebook/js/widget"], function(widget_manager){ | ||
|
r14259 | |||
var BoolWidgetModel = IPython.WidgetModel.extend({}); | ||||
|
r14374 | widget_manager.register_widget_model('BoolWidgetModel', BoolWidgetModel); | ||
|
r14259 | |||
var CheckboxView = IPython.WidgetView.extend({ | ||||
// Called when view is rendered. | ||||
render : function(){ | ||||
|
r14395 | this.$el | ||
|
r14295 | .addClass('widget-hbox-single'); | ||
this.$label = $('<div />') | ||||
|
r14297 | .addClass('widget-hlabel') | ||
|
r14295 | .appendTo(this.$el) | ||
|
r14292 | .hide(); | ||
|
r14299 | var that = this; | ||
|
r14259 | this.$checkbox = $('<input />') | ||
.attr('type', 'checkbox') | ||||
|
r14299 | .click(function(el) { | ||
that.user_invoked_update = true; | ||||
that.model.set('value', that.$checkbox.prop('checked')); | ||||
that.model.update_other_views(that); | ||||
that.user_invoked_update = false; | ||||
}) | ||||
|
r14295 | .appendTo(this.$el); | ||
|
r14259 | |||
|
r14314 | this.$el_to_style = this.$checkbox; // Set default element to style | ||
|
r14259 | this.update(); // Set defaults. | ||
}, | ||||
// Handles: Backend -> Frontend Sync | ||||
// Frontent -> Frontend Sync | ||||
update : function(){ | ||||
if (!this.user_invoked_update) { | ||||
this.$checkbox.prop('checked', this.model.get('value')); | ||||
|
r14292 | |||
|
r14304 | var disabled = this.model.get('disabled'); | ||
this.$checkbox.prop('disabled', disabled); | ||||
|
r14292 | var description = this.model.get('description'); | ||
if (description.length == 0) { | ||||
|
r14295 | this.$label.hide(); | ||
|
r14292 | } else { | ||
|
r14295 | this.$label.html(description); | ||
this.$label.show(); | ||||
|
r14292 | } | ||
|
r14259 | } | ||
|
r14279 | return IPython.WidgetView.prototype.update.call(this); | ||
|
r14259 | }, | ||
}); | ||||
|
r14374 | widget_manager.register_widget_view('CheckboxView', CheckboxView); | ||
|
r14262 | |||
var ToggleButtonView = IPython.WidgetView.extend({ | ||||
// Called when view is rendered. | ||||
render : function(){ | ||||
this.$el | ||||
|
r14278 | .html(''); | ||
|
r14262 | this.$button = $('<button />') | ||
.addClass('btn') | ||||
.attr('type', 'button') | ||||
.attr('data-toggle', 'button') | ||||
.appendTo(this.$el); | ||||
|
r14314 | this.$el_to_style = this.$button; // Set default element to style | ||
|
r14262 | |||
this.update(); // Set defaults. | ||||
}, | ||||
// Handles: Backend -> Frontend Sync | ||||
// Frontent -> Frontend Sync | ||||
update : function(){ | ||||
if (!this.user_invoked_update) { | ||||
if (this.model.get('value')) { | ||||
this.$button.addClass('active'); | ||||
} else { | ||||
this.$button.removeClass('active'); | ||||
} | ||||
|
r14292 | |||
|
r14304 | var disabled = this.model.get('disabled'); | ||
this.$button.prop('disabled', disabled); | ||||
|
r14292 | var description = this.model.get('description'); | ||
if (description.length == 0) { | ||||
this.$button.html(' '); // Preserve button height | ||||
} else { | ||||
this.$button.html(description); | ||||
} | ||||
|
r14262 | } | ||
|
r14279 | return IPython.WidgetView.prototype.update.call(this); | ||
|
r14262 | }, | ||
events: {"click button" : "handleClick"}, | ||||
// Handles and validates user input. | ||||
handleClick: function(e) { | ||||
this.user_invoked_update = true; | ||||
this.model.set('value', ! $(e.target).hasClass('active')); | ||||
|
r14278 | this.model.update_other_views(this); | ||
|
r14262 | this.user_invoked_update = false; | ||
}, | ||||
}); | ||||
|
r14374 | widget_manager.register_widget_view('ToggleButtonView', ToggleButtonView); | ||
|
r14262 | |||
|
r14259 | }); | ||