mirror of
https://github.com/jupyter/notebook.git
synced 2024-12-27 04:20:22 +08:00
Support multiple types in selection widget.
This commit is contained in:
parent
c9973a7114
commit
9e643f5692
@ -57,14 +57,14 @@ define(["notebook/js/widgets/widget"], function(WidgetManager){
|
||||
// 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');
|
||||
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 items = this.model.get('_values');
|
||||
var $replace_droplist = $('<ul />')
|
||||
.addClass('dropdown-menu');
|
||||
var that = this;
|
||||
@ -107,7 +107,7 @@ define(["notebook/js/widgets/widget"], function(WidgetManager){
|
||||
|
||||
// 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.model.set('_value', $(e.target).text(), {updated_view: this});
|
||||
this.touch();
|
||||
},
|
||||
|
||||
@ -139,7 +139,7 @@ define(["notebook/js/widgets/widget"], function(WidgetManager){
|
||||
// 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 items = this.model.get('_values');
|
||||
var disabled = this.model.get('disabled');
|
||||
var that = this;
|
||||
_.each(items, function(item, index) {
|
||||
@ -159,7 +159,7 @@ define(["notebook/js/widgets/widget"], function(WidgetManager){
|
||||
}
|
||||
|
||||
var $item_element = that.$container.find(item_query);
|
||||
if (that.model.get('value') == item) {
|
||||
if (that.model.get('_value') == item) {
|
||||
$item_element.prop('checked', true);
|
||||
} else {
|
||||
$item_element.prop('checked', false);
|
||||
@ -199,7 +199,7 @@ define(["notebook/js/widgets/widget"], function(WidgetManager){
|
||||
|
||||
// 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.model.set('_value', $(e.target).val(), {updated_view: this});
|
||||
this.touch();
|
||||
},
|
||||
});
|
||||
@ -230,7 +230,7 @@ define(["notebook/js/widgets/widget"], function(WidgetManager){
|
||||
// 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 items = this.model.get('_values');
|
||||
var disabled = this.model.get('disabled');
|
||||
var that = this;
|
||||
_.each(items, function(item, index) {
|
||||
@ -245,7 +245,7 @@ define(["notebook/js/widgets/widget"], function(WidgetManager){
|
||||
}
|
||||
|
||||
var $item_element = that.$buttongroup.find(item_query);
|
||||
if (that.model.get('value') == item) {
|
||||
if (that.model.get('_value') == item) {
|
||||
$item_element.addClass('active');
|
||||
} else {
|
||||
$item_element.removeClass('active');
|
||||
@ -285,7 +285,7 @@ define(["notebook/js/widgets/widget"], function(WidgetManager){
|
||||
|
||||
// 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.model.set('_value', $(e.target).text(), {updated_view: this});
|
||||
this.touch();
|
||||
},
|
||||
});
|
||||
@ -316,21 +316,21 @@ define(["notebook/js/widgets/widget"], function(WidgetManager){
|
||||
// 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 items = this.model.get('_values');
|
||||
var that = this;
|
||||
_.each(items, function(item, index) {
|
||||
var item_query = ' :contains("' + item + '")';
|
||||
if (that.$listbox.find(item_query).length === 0) {
|
||||
$('<option />')
|
||||
.text(item)
|
||||
.attr('value', item)
|
||||
.attr('_value', item)
|
||||
.appendTo(that.$listbox)
|
||||
.on('click', $.proxy(that.handle_click, that));
|
||||
}
|
||||
});
|
||||
|
||||
// Select the correct element
|
||||
this.$listbox.val(this.model.get('value'));
|
||||
this.$listbox.val(this.model.get('_value'));
|
||||
|
||||
// Disable listbox if needed
|
||||
var disabled = this.model.get('disabled');
|
||||
@ -368,7 +368,7 @@ define(["notebook/js/widgets/widget"], function(WidgetManager){
|
||||
|
||||
// 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.model.set('_value', $(e.target).text(), {updated_view: this});
|
||||
this.touch();
|
||||
},
|
||||
});
|
||||
|
@ -13,18 +13,76 @@ Represents an enumeration using a widget.
|
||||
#-----------------------------------------------------------------------------
|
||||
# Imports
|
||||
#-----------------------------------------------------------------------------
|
||||
from threading import Lock
|
||||
|
||||
from .widget import DOMWidget
|
||||
from IPython.utils.traitlets import Unicode, List, Bool
|
||||
from IPython.utils.traitlets import Unicode, List, Bool, Any, Dict
|
||||
|
||||
#-----------------------------------------------------------------------------
|
||||
# SelectionWidget
|
||||
#-----------------------------------------------------------------------------
|
||||
class _SelectionWidget(DOMWidget):
|
||||
value = Unicode(help="Selected value", sync=True) # TODO: Any support
|
||||
values = List(help="List of values the user can select", sync=True)
|
||||
value = Any(help="Selected value")
|
||||
values = List(help="List of values the user can select")
|
||||
value_names = Dict(help="""List of string representations for each value.
|
||||
These string representations are used to display the values in the
|
||||
front-end.""")
|
||||
disabled = Bool(False, help="Enable or disable user changes", sync=True)
|
||||
description = Unicode(help="Description of the value this widget represents", sync=True)
|
||||
|
||||
_value = Unicode(sync=True) # Bi-directionally synced.
|
||||
_values = List(sync=True) # Only back-end to front-end synced.
|
||||
_reverse_value_names = Dict()
|
||||
|
||||
def __init__(self, *pargs, **kwargs):
|
||||
"""Constructor"""
|
||||
DOMWidget.__init__(self, *pargs, **kwargs)
|
||||
self.value_lock = Lock()
|
||||
self.on_trait_change(self._string_value_set, ['_value'])
|
||||
|
||||
def _value_names_changed(self, name=None, old=None, new=None):
|
||||
"""Handles when the value_names Dict has been changed.
|
||||
|
||||
This method sets the _reverse_value_names Dict to the inverse of the new
|
||||
value for the value_names Dict."""
|
||||
self._reverse_value_names = {v:k for k, v in self.value_names.items()}
|
||||
self._values_changed()
|
||||
|
||||
def _values_changed(self, name=None, old=None, new=None):
|
||||
"""Called when values has been changed"""
|
||||
self._values = [self._get_string_repr(v) for v in self.values]
|
||||
|
||||
def _value_changed(self, name, old, new):
|
||||
"""Called when value has been changed"""
|
||||
if self.value_lock.acquire(False):
|
||||
try:
|
||||
# Make sure the value is in the list of values.
|
||||
if new in self.values:
|
||||
# Set the string version of the value.
|
||||
self._value = self._get_string_repr(new)
|
||||
else:
|
||||
raise TypeError('Value must be a value in the values list.')
|
||||
finally:
|
||||
self.value_lock.release()
|
||||
|
||||
def _get_string_repr(self, value):
|
||||
"""Get the string repr of a value"""
|
||||
if value not in self.value_names:
|
||||
self.value_names[value] = str(value)
|
||||
self._value_names_changed()
|
||||
return self.value_names[value]
|
||||
|
||||
def _string_value_set(self, name, old, new):
|
||||
"""Called when _value has been changed."""
|
||||
if self.value_lock.acquire(False):
|
||||
try:
|
||||
if new in self._reverse_value_names:
|
||||
self.value = self._reverse_value_names[new]
|
||||
else:
|
||||
self.value = None
|
||||
finally:
|
||||
self.value_lock.release()
|
||||
|
||||
|
||||
class ToggleButtonsWidget(_SelectionWidget):
|
||||
view_name = Unicode('ToggleButtonsView', sync=True)
|
||||
|
Loading…
Reference in New Issue
Block a user