mirror of
https://github.com/jupyter/notebook.git
synced 2025-02-05 12:19:58 +08:00
Moved view code into model files
This commit is contained in:
parent
bc0363039e
commit
e88950238f
@ -1,2 +1,17 @@
|
||||
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 = $('<div />')
|
||||
.addClass('container')
|
||||
.addClass(this.model.comm.comm_id);
|
||||
this.$el.append(this.$container);
|
||||
},
|
||||
|
||||
update : function(){},
|
||||
});
|
||||
|
||||
IPython.notebook.widget_manager.register_widget_view('ContainerView', ContainerView);
|
||||
|
@ -1,2 +1,128 @@
|
||||
var SelectionWidgetModel = IPython.WidgetModel.extend({});
|
||||
IPython.notebook.widget_manager.register_widget_model('SelectionWidgetModel', SelectionWidgetModel);
|
||||
|
||||
var DropdownView = IPython.WidgetView.extend({
|
||||
|
||||
// Called when view is rendered.
|
||||
render : function(){
|
||||
|
||||
this.$el
|
||||
.html('')
|
||||
.addClass(this.model.comm.comm_id);
|
||||
this.$buttongroup = $('<div />')
|
||||
.addClass('btn-group')
|
||||
.appendTo(this.$el);
|
||||
this.$droplabel = $('<button />')
|
||||
.addClass('btn')
|
||||
.appendTo(this.$buttongroup);
|
||||
this.$dropbutton = $('<button />')
|
||||
.addClass('btn')
|
||||
.addClass('dropdown-toggle')
|
||||
.attr('data-toggle', 'dropdown')
|
||||
.html('<span class="caret"></span>')
|
||||
.appendTo(this.$buttongroup);
|
||||
this.$droplist = $('<ul />')
|
||||
.addClass('dropdown-menu')
|
||||
.appendTo(this.$buttongroup);
|
||||
|
||||
// Set defaults.
|
||||
this.update();
|
||||
},
|
||||
|
||||
// Handles: Backend -> Frontend Sync
|
||||
// Frontent -> Frontend Sync
|
||||
update : function(){
|
||||
this.$droplabel.html(this.model.get('value'));
|
||||
|
||||
var items = this.model.get('values');
|
||||
this.$droplist.html('');
|
||||
for (var index in items) {
|
||||
var that = this;
|
||||
var item_button = $('<a href="#"/>')
|
||||
.html(items[index])
|
||||
.on('click', function(e){
|
||||
that.model.set('value', $(e.target).html(), this );
|
||||
})
|
||||
|
||||
this.$droplist.append($('<li />').append(item_button))
|
||||
}
|
||||
|
||||
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');
|
||||
}
|
||||
},
|
||||
|
||||
});
|
||||
|
||||
IPython.notebook.widget_manager.register_widget_view('DropdownView', DropdownView);
|
||||
var RadioButtonView = IPython.WidgetView.extend({
|
||||
|
||||
// Called when view is rendered.
|
||||
render : function(){
|
||||
this.$el
|
||||
.html('')
|
||||
.addClass(this.model.comm.comm_id);
|
||||
this.update();
|
||||
},
|
||||
|
||||
// Handles: Backend -> Frontend Sync
|
||||
// Frontent -> Frontend Sync
|
||||
update : function(){
|
||||
|
||||
// Add missing items to the DOM.
|
||||
var items = this.model.get('values');
|
||||
for (var index in items) {
|
||||
var item_query = ' :input[value="' + items[index] + '"]';
|
||||
if (this.$el.find(item_query).length == 0) {
|
||||
var $label = $('<label />')
|
||||
.addClass('radio')
|
||||
.html(items[index])
|
||||
.appendTo(this.$el);
|
||||
|
||||
var that = this;
|
||||
$('<input />')
|
||||
.attr('type', 'radio')
|
||||
.addClass(this.model)
|
||||
.val(items[index])
|
||||
.prependTo($label)
|
||||
.on('click', function(e){
|
||||
that.model.set('value', $(e.target).val(), this);
|
||||
that.model.apply();
|
||||
});
|
||||
}
|
||||
|
||||
if (this.model.get('value') == items[index]) {
|
||||
this.$el.find(item_query).prop('checked', true);
|
||||
} else {
|
||||
this.$el.find(item_query).prop('checked', false);
|
||||
}
|
||||
}
|
||||
|
||||
// Remove items that no longer exist.
|
||||
this.$el.find('input').each(function(i, obj) {
|
||||
var value = $(obj).val();
|
||||
var found = false;
|
||||
for (var index in items) {
|
||||
if (items[index] == value) {
|
||||
found = true;
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
if (!found) {
|
||||
$(obj).parent().remove();
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
});
|
||||
|
||||
IPython.notebook.widget_manager.register_widget_view('RadioButtonView', RadioButtonView);
|
||||
|
@ -1,2 +1,74 @@
|
||||
var StringWidgetModel = IPython.WidgetModel.extend({});
|
||||
IPython.notebook.widget_manager.register_widget_model('StringWidgetModel', StringWidgetModel);
|
||||
|
||||
var TextareaView = IPython.WidgetView.extend({
|
||||
|
||||
// Called when view is rendered.
|
||||
render : function(){
|
||||
this.$el
|
||||
.html('')
|
||||
.addClass(this.model.comm.comm_id);
|
||||
this.$textbox = $('<textarea />')
|
||||
.attr('rows', 5)
|
||||
.appendTo(this.$el);
|
||||
this.update(); // Set defaults.
|
||||
},
|
||||
|
||||
// Handles: Backend -> Frontend Sync
|
||||
// Frontent -> Frontend Sync
|
||||
update : function(){
|
||||
if (!this.user_invoked_update) {
|
||||
this.$textbox.val(this.model.get('value'));
|
||||
}
|
||||
},
|
||||
|
||||
events: {"keyup textarea" : "handleChanging",
|
||||
"paste textarea" : "handleChanging",
|
||||
"cut textarea" : "handleChanging"},
|
||||
|
||||
// Handles and validates user input.
|
||||
handleChanging: function(e) {
|
||||
this.user_invoked_update = true;
|
||||
this.model.set('value', e.target.value);
|
||||
this.model.apply(this);
|
||||
this.user_invoked_update = false;
|
||||
},
|
||||
});
|
||||
|
||||
IPython.notebook.widget_manager.register_widget_view('TextareaView', TextareaView);
|
||||
|
||||
var TextboxView = IPython.WidgetView.extend({
|
||||
|
||||
// Called when view is rendered.
|
||||
render : function(){
|
||||
this.$el
|
||||
.html('')
|
||||
.addClass(this.model.comm.comm_id);
|
||||
this.$textbox = $('<input type="text" />')
|
||||
.addClass('input')
|
||||
.appendTo(this.$el);
|
||||
this.update(); // Set defaults.
|
||||
},
|
||||
|
||||
// Handles: Backend -> Frontend Sync
|
||||
// Frontent -> Frontend Sync
|
||||
update : function(){
|
||||
if (!this.user_invoked_update) {
|
||||
this.$textbox.val(this.model.get('value'));
|
||||
}
|
||||
},
|
||||
|
||||
events: {"keyup input" : "handleChanging",
|
||||
"paste input" : "handleChanging",
|
||||
"cut input" : "handleChanging"},
|
||||
|
||||
// Handles and validates user input.
|
||||
handleChanging: function(e) {
|
||||
this.user_invoked_update = true;
|
||||
this.model.set('value', e.target.value);
|
||||
this.model.apply(this);
|
||||
this.user_invoked_update = false;
|
||||
},
|
||||
});
|
||||
|
||||
IPython.notebook.widget_manager.register_widget_view('TextboxView', TextboxView);
|
||||
|
Loading…
Reference in New Issue
Block a user