widget_button.js
70 lines
| 2.1 KiB
| application/javascript
|
JavascriptLexer
|
r17198 | // Copyright (c) IPython Development Team. | ||
// Distributed under the terms of the Modified BSD License. | ||||
|
r14366 | |||
|
r17198 | define([ | ||
"widgets/js/widget", | ||||
|
r17216 | "jquery", | ||
|
r17312 | "bootstrap", | ||
|
r17216 | ], function(widget, $){ | ||
|
r14366 | |||
|
r17198 | var ButtonView = widget.DOMWidgetView.extend({ | ||
|
r14270 | render : function(){ | ||
|
r14609 | // Called when view is rendered. | ||
|
r14397 | this.setElement($("<button />") | ||
|
r16913 | .addClass('btn btn-default')); | ||
|
r14270 | |||
|
r17728 | this.model.on('change:button_style', function(model, value) { | ||
this.update_button_style(); | ||||
}, this); | ||||
this.update_button_style(''); | ||||
|
r14270 | this.update(); // Set defaults. | ||
}, | ||||
update : function(){ | ||||
|
r14568 | // 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. | ||||
|
r14292 | var description = this.model.get('description'); | ||
|
r14466 | if (description.length === 0) { | ||
|
r15329 | this.$el.html(" "); // Preserve button height | ||
|
r14292 | } else { | ||
|
r14663 | this.$el.text(description); | ||
|
r14292 | } | ||
|
r14430 | if (this.model.get('disabled')) { | ||
this.$el.attr('disabled','disabled'); | ||||
} else { | ||||
this.$el.removeAttr('disabled'); | ||||
} | ||||
|
r14583 | return ButtonView.__super__.update.apply(this); | ||
|
r14270 | }, | ||
|
r14400 | |||
|
r17728 | update_button_style: function(previous_trait_value) { | ||
var class_map = { | ||||
primary: ['btn-primary'], | ||||
success: ['btn-success'], | ||||
info: ['btn-info'], | ||||
warning: ['btn-warning'], | ||||
danger: ['btn-danger'] | ||||
}; | ||||
this.update_mapped_classes(class_map, 'button_style', previous_trait_value); | ||||
}, | ||||
|
r14400 | events: { | ||
|
r14609 | // Dictionary of events and their handlers. | ||
|
r14400 | 'click': '_handle_click', | ||
}, | ||||
|
r14270 | |||
|
r14400 | _handle_click: function(){ | ||
|
r14609 | // Handles when the button is clicked. | ||
|
r14403 | this.send({event: 'click'}); | ||
|
r14400 | }, | ||
|
r14270 | }); | ||
|
r17198 | |||
return { | ||||
'ButtonView': ButtonView, | ||||
}; | ||||
|
r14270 | }); | ||