diff --git a/IPython/html/static/notebook/js/widgets/widget_int.js b/IPython/html/static/notebook/js/widgets/widget_int.js index 94de0a9..23572a7 100644 --- a/IPython/html/static/notebook/js/widgets/widget_int.js +++ b/IPython/html/static/notebook/js/widgets/widget_int.js @@ -25,17 +25,22 @@ define(["notebook/js/widgets/widget"], function(WidgetManager){ .appendTo(this.$el) .addClass('widget-hlabel') .hide(); + this.$slider = $('
') .slider({}) .addClass('slider'); - // Put the slider in a container this.$slider_container = $('
') .addClass('widget-hslider') - .append(this.$slider); + .append(this.$slider) this.$el_to_style = this.$slider_container; // Set default element to style this.$el.append(this.$slider_container); + this.$readout = $('
') + .appendTo(this.$el) + .addClass('widget-hlabel') + .hide(); + // Set defaults. this.update(); }, @@ -103,6 +108,13 @@ define(["notebook/js/widgets/widget"], function(WidgetManager){ this.$label.text(description); this.$label.show(); } + + var readout = this.model.get('readout'); + if (readout) { + this.$readout.show(); + } else { + this.$readout.hide(); + } } return IntSliderView.__super__.update.apply(this); }, @@ -117,7 +129,9 @@ 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', this._validate_slide_value(ui.value), {updated_view: this}); + var actual_value = this._validate_slide_value(ui.value); + this.model.set('value', actual_value, {updated_view: this}); + this.$readout.text(actual_value); this.touch(); }, diff --git a/IPython/html/widgets/widget_float.py b/IPython/html/widgets/widget_float.py index 5132331..5f9e2da 100644 --- a/IPython/html/widgets/widget_float.py +++ b/IPython/html/widgets/widget_float.py @@ -53,6 +53,7 @@ class FloatSliderWidget(_BoundedFloatWidget): _view_name = Unicode('FloatSliderView', sync=True) orientation = Enum([u'horizontal', u'vertical'], u'horizontal', help="Vertical or horizontal.", sync=True) + readout = Bool(False, help="Display the current value of the slider next to it.", sync=True) class FloatProgressWidget(_BoundedFloatWidget): diff --git a/IPython/html/widgets/widget_int.py b/IPython/html/widgets/widget_int.py index 97c2e0e..e1090d9 100644 --- a/IPython/html/widgets/widget_int.py +++ b/IPython/html/widgets/widget_int.py @@ -53,6 +53,7 @@ class IntSliderWidget(_BoundedIntWidget): _view_name = Unicode('IntSliderView', sync=True) orientation = Enum([u'horizontal', u'vertical'], u'horizontal', help="Vertical or horizontal.", sync=True) + readout = Bool(False, help="Display the current value of the slider next to it.", sync=True) class IntProgressWidget(_BoundedIntWidget):