diff --git a/IPython/html/static/widgets/js/widget_bool.js b/IPython/html/static/widgets/js/widget_bool.js
index 83af9d4..1b925af 100644
--- a/IPython/html/static/widgets/js/widget_bool.js
+++ b/IPython/html/static/widgets/js/widget_bool.js
@@ -24,6 +24,11 @@ define([
this.update(); // Set defaults.
},
+ update_attr: function(name, value) {
+ // Set a css attr of the widget view.
+ this.$checkbox.css(name, value);
+ },
+
handle_click: function() {
// Handles when the checkbox is clicked.
diff --git a/IPython/html/static/widgets/js/widget_int.js b/IPython/html/static/widgets/js/widget_int.js
index c8a736b..503fa0f 100644
--- a/IPython/html/static/widgets/js/widget_int.js
+++ b/IPython/html/static/widgets/js/widget_int.js
@@ -30,10 +30,30 @@ define([
.appendTo(this.$el)
.addClass('widget-hreadout')
.hide();
+
+ this.model.on('change:slider_color', function(sender, value) {
+ this.$slider.find('a').css('background', value);
+ }, this);
// Set defaults.
this.update();
},
+
+ update_attr: function(name, value) {
+ // Set a css attr of the widget view.
+ if (name == 'color') {
+ this.$readout.css(name, value);
+ } else if (name.substring(0, 4) == 'font') {
+ this.$readout.css(name, value);
+ } else if (name.substring(0, 6) == 'border') {
+ this.$slider.find('a').css(name, value);
+ this.$slider_container.css(name, value);
+ } else if (name == 'width' || name == 'height' || name == 'background') {
+ this.$slider_container.css(name, value);
+ } else {
+ this.$slider.css(name, value);
+ }
+ },
update : function(options){
// Update the contents of this view
@@ -221,6 +241,11 @@ define([
return IntTextView.__super__.update.apply(this);
},
+ update_attr: function(name, value) {
+ // Set a css attr of the widget view.
+ this.$textbox.css(name, value);
+ },
+
events: {
// Dictionary of events and their handlers.
"keyup input" : "handleChanging",
@@ -320,6 +345,17 @@ define([
}
return ProgressView.__super__.update.apply(this);
},
+
+ update_attr: function(name, value) {
+ // Set a css attr of the widget view.
+ if (name.substring(0, 6) == 'border' || name == 'width' || name == 'height' || name == 'background') {
+ this.$progress.css(name, value);
+ } else if (name == 'color') {
+ this.$bar.css('background', value);
+ } else {
+ this.$bar.css(name, value);
+ }
+ },
});
return {
diff --git a/IPython/html/static/widgets/js/widget_selection.js b/IPython/html/static/widgets/js/widget_selection.js
index 3922dc9..99c01ee 100644
--- a/IPython/html/static/widgets/js/widget_selection.js
+++ b/IPython/html/static/widgets/js/widget_selection.js
@@ -58,6 +58,8 @@ define([
var items = this.model.get('value_names');
var $replace_droplist = $('')
.addClass('dropdown-menu');
+ // Copy the style
+ $replace_droplist.attr('style', this.$droplist.attr('style'));
var that = this;
_.each(items, function(item, i) {
var item_button = $('')
@@ -94,6 +96,29 @@ define([
return DropdownView.__super__.update.apply(this);
},
+ update_attr: function(name, value) {
+ // Set a css attr of the widget view.
+ if (name.substring(0, 6) == 'border' || name == 'background' || name == 'color') {
+ this.$droplabel.css(name, value);
+ this.$dropbutton.css(name, value);
+ this.$droplist.css(name, value);
+ } if (name.substring(0, 4) == 'font') {
+ this.$droplabel.css(name, value);
+ this.$droplist.css(name, value);
+ } else if (name == 'width') {
+ this.$buttongroup.width(value);
+ var width = value - this.$dropbutton.width();
+ this.$droplist.css(name, width);
+ this.$droplabel.css(name, width);
+ } else if (name == 'height') {
+ this.$droplist.css(name, value);
+ this.$dropbutton.css(name, value);
+ } else {
+ this.$droplabel.css(name, value);
+ this.$droplist.css(name, value);
+ }
+ },
+
handle_click: function (e) {
// Handle when a value is clicked.
diff --git a/IPython/html/widgets/widget.py b/IPython/html/widgets/widget.py
index 9c85b6c..d6e5e74 100644
--- a/IPython/html/widgets/widget.py
+++ b/IPython/html/widgets/widget.py
@@ -18,8 +18,8 @@ import collections
from IPython.core.getipython import get_ipython
from IPython.kernel.comm import Comm
from IPython.config import LoggingConfigurable
-from IPython.utils.traitlets import Unicode, Dict, Instance, Bool, List,
- CaselessStrEnum, Tuple, CTuple, CUnicode, Int, Set
+from IPython.utils.traitlets import Unicode, Dict, Instance, Bool, List, \
+ CaselessStrEnum, Tuple, CUnicode, Int, Set
from IPython.utils.py3compat import string_types
#-----------------------------------------------------------------------------
@@ -380,8 +380,8 @@ class Widget(LoggingConfigurable):
class DOMWidget(Widget):
visible = Bool(True, help="Whether the widget is visible.", sync=True)
- _css = CTuple(sync=True, help="CSS property list: (selector, key, value)")
- _dom_classes = CTuple(sync=True, help="DOM classes applied to widget.$el.")
+ _css = Tuple(sync=True, help="CSS property list: (selector, key, value)")
+ _dom_classes = Tuple(sync=True, help="DOM classes applied to widget.$el.")
width = CUnicode(sync=True)
height = CUnicode(sync=True)
diff --git a/IPython/html/widgets/widget_float.py b/IPython/html/widgets/widget_float.py
index dc08afd..10db14c 100644
--- a/IPython/html/widgets/widget_float.py
+++ b/IPython/html/widgets/widget_float.py
@@ -57,6 +57,7 @@ class FloatSlider(_BoundedFloat):
help="Vertical or horizontal.", sync=True)
_range = Bool(False, help="Display a range selector", sync=True)
readout = Bool(True, help="Display the current value of the slider next to it.", sync=True)
+ slider_color = Unicode(sync=True)
class FloatProgress(_BoundedFloat):
diff --git a/IPython/html/widgets/widget_int.py b/IPython/html/widgets/widget_int.py
index 5777287..81ba8b5 100644
--- a/IPython/html/widgets/widget_int.py
+++ b/IPython/html/widgets/widget_int.py
@@ -62,6 +62,7 @@ class IntSlider(_BoundedInt):
help="Vertical or horizontal.", sync=True)
_range = Bool(False, help="Display a range selector", sync=True)
readout = Bool(True, help="Display the current value of the slider next to it.", sync=True)
+ slider_color = Unicode(sync=True)
class IntProgress(_BoundedInt):