squashing the whitespace changes

IPython/html/static/widgets/js/widget_selection.js

@@ -1,523 +1,551 b''
 // Copyright (c) IPython Development Team.
 // Distributed under the terms of the Modified BSD License.
 
 define([
     "widgets/js/widget",
     "base/js/utils",
     "jquery",
+    "underscore",
     "bootstrap",
-], function(widget, utils, $){
+], function(widget, utils, $, _){
 
     var DropdownView = widget.DOMWidgetView.extend({
         render : function(){
             /**
              * Called when view is rendered.
              */
             this.$el
                 .addClass('widget-hbox widget-dropdown');
             this.$label = $('<div />')
                 .appendTo(this.$el)
                 .addClass('widget-label')
                 .hide();
             this.$buttongroup = $('<div />')
                 .addClass('widget_item')
                 .addClass('btn-group')
                 .appendTo(this.$el);
             this.$droplabel = $('<button />')
                 .addClass('btn btn-default')
                 .addClass('widget-combo-btn')
                 .html("&nbsp;")
                 .appendTo(this.$buttongroup);
             this.$dropbutton = $('<button />')
                 .addClass('btn btn-default')
                 .addClass('dropdown-toggle')
                 .addClass('widget-combo-carrot-btn')
                 .attr('data-toggle', 'dropdown')
                 .append($('<span />').addClass("caret"))
                 .appendTo(this.$buttongroup);
             this.$droplist = $('<ul />')
                 .addClass('dropdown-menu')
                 .appendTo(this.$buttongroup);
 
             this.model.on('change:button_style', function(model, value) {
                 this.update_button_style();
             }, this);
             this.update_button_style('');
             
             // Set defaults.
             this.update();
         },
         
         update : function(options){
             /**
              * Update the contents of this view
              *
-             * Called when the model is changed.  The model may have been 
+             * Called when the model is changed.  The model may have been
              * 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_name');
+                var selected_item_text = this.model.get('selected_label');
                 if (selected_item_text.trim().length === 0) {
                     this.$droplabel.html("&nbsp;");
                 } else {
                     this.$droplabel.text(selected_item_text);
                 }
                 
-                var items = this.model.get('_value_names');
+                var items = this.model.get('_options_labels');
                 var $replace_droplist = $('<ul />')
                     .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 = $('<a href="#"/>')
                         .text(item)
                         .on('click', $.proxy(that.handle_click, that));
                     $replace_droplist.append($('<li />').append(item_button));
                 });
 
                 this.$droplist.replaceWith($replace_droplist);
                 this.$droplist.remove();
                 this.$droplist = $replace_droplist;
                 
                 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');
                 }
 
                 var description = this.model.get('description');
                 if (description.length === 0) {
                     this.$label.hide();
                 } else {
                     this.typeset(this.$label, description);
                     this.$label.show();
                 }
             }
             return DropdownView.__super__.update.apply(this);
         },
 
         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, this.$droplabel);
             this.update_mapped_classes(class_map, 'button_style', previous_trait_value, this.$dropbutton);
         },
 
         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);
             } else if (name == 'width') {
                 this.$droplist.css(name, value);
                 this.$droplabel.css(name, value);
             } else if (name == 'padding') {
                 this.$droplist.css(name, value);
                 this.$buttongroup.css(name, value);
             } else if (name == 'margin') {
                 this.$buttongroup.css(name, value);
             } else if (name == 'height') {
                 this.$droplabel.css(name, value);
                 this.$dropbutton.css(name, value);
             } else if (name == 'padding' || name == 'margin') {
                 this.$el.css(name, value);
             } else {
                 this.$droplist.css(name, value);
                 this.$droplabel.css(name, value);
             }
         },
 
         handle_click: function (e) {
             /**
              * Handle when a value is clicked.
              *
              * Calling model.set will trigger all of the other views of the 
              * model to update.
              */
-            this.model.set('value_name', $(e.target).text(), {updated_view: this});
+            this.model.set('selected_label', $(e.target).text(), {updated_view: this});
             this.touch();
 
             // Manually hide the droplist.
             e.stopPropagation();
             e.preventDefault();
             this.$buttongroup.removeClass('open');
         },
         
     });
 
 
     var RadioButtonsView = widget.DOMWidgetView.extend({    
         render : function(){
             /**
              * Called when view is rendered.
              */
             this.$el
                 .addClass('widget-hbox widget-radio');
             this.$label = $('<div />')
                 .appendTo(this.$el)
                 .addClass('widget-label')
                 .hide();
             this.$container = $('<div />')
                 .appendTo(this.$el)
                 .addClass('widget-radio-box');
             this.update();
         },
         
         update : function(options){
             /**
              * 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.
              */
             if (options === undefined || options.updated_view != this) {
                 // Add missing items to the DOM.
-                var items = this.model.get('_value_names');
+                var items = this.model.get('_options_labels');
                 var disabled = this.model.get('disabled');
                 var that = this;
                 _.each(items, function(item, index) {
                     var item_query = ' :input[data-value="' + encodeURIComponent(item) + '"]';
                     if (that.$el.find(item_query).length === 0) {
                         var $label = $('<label />')
                             .addClass('radio')
                             .text(item)
                             .appendTo(that.$container);
                         
                         $('<input />')
                             .attr('type', 'radio')
                             .addClass(that.model)
                             .val(item)
                             .attr('data-value', encodeURIComponent(item))
                             .prependTo($label)
                             .on('click', $.proxy(that.handle_click, that));
                     }
                     
                     var $item_element = that.$container.find(item_query);
-                    if (that.model.get('value_name') == item) {
+                    if (that.model.get('selected_label') == item) {
                         $item_element.prop('checked', true);
                     } else {
                         $item_element.prop('checked', false);
                     }
                     $item_element.prop('disabled', disabled);
                 });
                 
                 // Remove items that no longer exist.
                 this.$container.find('input').each(function(i, obj) {
                     var value = $(obj).val();
                     var found = false;
                     _.each(items, function(item, index) {
                         if (item == value) {
                             found = true;
                             return false;
                         }
                     });
                     
                     if (!found) {
                         $(obj).parent().remove();
                     }
                 });
 
                 var description = this.model.get('description');
                 if (description.length === 0) {
                     this.$label.hide();
                 } else {
                     this.$label.text(description);
                     this.typeset(this.$label, description);
                     this.$label.show();
                 }
             }
             return RadioButtonsView.__super__.update.apply(this);
         },
 
         update_attr: function(name, value) {
             /**
              * Set a css attr of the widget view.
              */
             if (name == 'padding' || name == 'margin') {
                 this.$el.css(name, value);
             } else {
                 this.$container.css(name, value);
             }
         },
 
         handle_click: function (e) {
             /**
              * Handle when a value is clicked.
              *
              * Calling model.set will trigger all of the other views of the 
              * model to update.
              */
-            this.model.set('value_name', $(e.target).val(), {updated_view: this});
+            this.model.set('selected_label', $(e.target).val(), {updated_view: this});
             this.touch();
         },
     });
     
 
     var ToggleButtonsView = widget.DOMWidgetView.extend({
         initialize: function() {
             this._css_state = {};
             ToggleButtonsView.__super__.initialize.apply(this, arguments);
         },
 
         render: function() {
             /**
              * Called when view is rendered.
              */
             this.$el
                 .addClass('widget-hbox widget-toggle-buttons');
             this.$label = $('<div />')
                 .appendTo(this.$el)
                 .addClass('widget-label')
                 .hide();
             this.$buttongroup = $('<div />')
                 .addClass('btn-group')
                 .appendTo(this.$el);
 
             this.model.on('change:button_style', function(model, value) {
                 this.update_button_style();
             }, this);
             this.update_button_style('');
             this.update();
         },
         
         update : function(options){
             /**
              * 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.
              */
             if (options === undefined || options.updated_view != this) {
                 // Add missing items to the DOM.
-                var items = this.model.get('_value_names');
+                var items = this.model.get('_options_labels');
                 var disabled = this.model.get('disabled');
                 var that = this;
                 var item_html;
                 _.each(items, function(item, index) {
                     if (item.trim().length === 0) {
                         item_html = "&nbsp;";
                     } else {
                         item_html = utils.escape_html(item);
                     }
                     var item_query = '[data-value="' + encodeURIComponent(item) + '"]';
                     var $item_element = that.$buttongroup.find(item_query);
                     if (!$item_element.length) {
                         $item_element = $('<button/>')
                             .attr('type', 'button')
                             .addClass('btn btn-default')
                             .html(item_html)
                             .appendTo(that.$buttongroup)
                             .attr('data-value', encodeURIComponent(item))
                             .attr('value', item)
                             .on('click', $.proxy(that.handle_click, that));
                         that.update_style_traits($item_element);
                     }
-                    if (that.model.get('value_name') == item) {
+                    if (that.model.get('selected_label') == item) {
                         $item_element.addClass('active');
                     } else {
                         $item_element.removeClass('active');
                     }
                     $item_element.prop('disabled', disabled); 
                 });
                 
                 // Remove items that no longer exist.
                 this.$buttongroup.find('button').each(function(i, obj) {
                     var value = $(obj).attr('value');
                     var found = false;
                     _.each(items, function(item, index) {
                         if (item == value) {
                             found = true;
                             return false;
                         }
                     });
 
                     if (!found) {
                         $(obj).remove();
                     }
                 });
 
                 var description = this.model.get('description');
                 if (description.length === 0) {
                     this.$label.hide();
                 } else {
                     this.$label.text();
                     this.typeset(this.$label, description);
                     this.$label.show();
                 }
             }
             return ToggleButtonsView.__super__.update.apply(this);
         },
 
         update_attr: function(name, value) {
             /**
              * Set a css attr of the widget view.
              */
             if (name == 'padding' || name == 'margin') {
                 this.$el.css(name, value);
             } else {
                 this._css_state[name] = value;
                 this.update_style_traits();
             }
         },
 
         update_style_traits: function(button) {
             for (var name in this._css_state) {
                 if (this._css_state.hasOwnProperty(name)) {
                     if (name == 'margin') {
                         this.$buttongroup.css(name, this._css_state[name]);
                     } else if (name != 'width') {
                         if (button) {
                             button.css(name, this._css_state[name]);
                         } else {
                             this.$buttongroup.find('button').css(name, this._css_state[name]);
                         }
                     }
                 }
             }
         },
 
         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, this.$buttongroup.find('button'));
         },
 
         handle_click: function (e) {
             /**
              * Handle when a value is clicked.
              *
              * Calling model.set will trigger all of the other views of the 
              * model to update.
              */
-            this.model.set('value_name', $(e.target).attr('value'), {updated_view: this});
+            this.model.set('selected_label', $(e.target).attr('value'), {updated_view: this});
             this.touch();
         },    
     });
     
 
     var SelectView = widget.DOMWidgetView.extend({    
         render : function(){
             /**
              * Called when view is rendered.
              */
             this.$el
                 .addClass('widget-hbox widget-select');
             this.$label = $('<div />')
                 .appendTo(this.$el)
                 .addClass('widget-label')
                 .hide();
             this.$listbox = $('<select />')
                 .addClass('widget-listbox form-control')
                 .attr('size', 6)
                 .appendTo(this.$el);
             this.update();
         },
         
         update : function(options){
             /**
              * 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.
              */
             if (options === undefined || options.updated_view != this) {
                 // Add missing items to the DOM.
-                var items = this.model.get('_value_names');
+                var items = this.model.get('_options_labels');
                 var that = this;
                 _.each(items, function(item, index) {
                    var item_query = 'option[data-value="' + encodeURIComponent(item) + '"]';
                     if (that.$listbox.find(item_query).length === 0) {
                         $('<option />')
                             .text(item)
                             .attr('data-value', encodeURIComponent(item))
-                            .attr('value_name', item)
+                            .attr('selected_label', item)
                             .appendTo(that.$listbox)
                             .on('click', $.proxy(that.handle_click, that));
                     } 
                 });
 
                 // Select the correct element
-                this.$listbox.val(this.model.get('value_name'));
+                this.$listbox.val(this.model.get('selected_label'));
                 
                 // Disable listbox if needed
                 var disabled = this.model.get('disabled');
                 this.$listbox.prop('disabled', disabled);
 
                 // Remove items that no longer exist.
                 this.$listbox.find('option').each(function(i, obj) {
                     var value = $(obj).text();
                     var found = false;
                     _.each(items, function(item, index) {
                         if (item == value) {
                             found = true;
                             return false;
                         }
                     });
                     
                     if (!found) {
                         $(obj).remove();
                     }
                 });
 
                 var description = this.model.get('description');
                 if (description.length === 0) {
                     this.$label.hide();
                 } else {
                     this.typeset(this.$label, description);
                     this.$label.show();
                 }
             }
             return SelectView.__super__.update.apply(this);
         },
 
         update_attr: function(name, value) {
             /**
              * Set a css attr of the widget view.
              */
             if (name == 'padding' || name == 'margin') {
                 this.$el.css(name, value);
             } else {
                 this.$listbox.css(name, value);
             }
         },
 
         handle_click: function (e) {
             /**
              * Handle when a value is clicked.
              *
              * Calling model.set will trigger all of the other views of the 
              * model to update.
              */
-            this.model.set('value_name', $(e.target).text(), {updated_view: this});
+            this.model.set('selected_label', $(e.target).text(), {updated_view: this});
             this.touch();
-        },    
+        },
+    });
+    var SelectMultipleView = SelectView.extend({
+        render: function(){
+            SelectMultipleView.__super__.render.apply(this);
+            this.$el.removeClass('widget-select')
+              .addClass('widget-select-multiple');
+            this.$listbox.attr('multiple', true)
+              .on('input', $.proxy(this.handle_click, this));
+            return this;
+        },
+
+        update: function(){
+            SelectMultipleView.__super__.update.apply(this, arguments);
+            this.$listbox.val(this.model.get('selected_labels'));
+        },
+
+        handle_click: function (e) {
+            // Handle when a value is clicked.
+
+            // Calling model.set will trigger all of the other views of the
+            // model to update.
+            this.model.set('selected_labels',
+                (this.$listbox.val() || []).slice(),
+                {updated_view: this});
+            this.touch();
+        },
     });
     
     return {
         'DropdownView': DropdownView,
         'RadioButtonsView': RadioButtonsView,
         'ToggleButtonsView': ToggleButtonsView,
         'SelectView': SelectView,
+        'SelectMultipleView': SelectMultipleView,
     };
 });

IPython/html/tests/widgets/widget_selection.js

@@ -1,148 +1,148 b''
 // Test selection class
 casper.notebook_test(function () {
     index = this.append_cell(
         'from IPython.html import widgets\n' + 
         'from IPython.display import display, clear_output\n' +
         'print("Success")');
     this.execute_cell_then(index);
 
     var combo_selector = '.widget-area .widget-subarea .widget-hbox .btn-group .widget-combo-btn';
     var multibtn_selector = '.widget-area .widget-subarea .widget-hbox.widget-toggle-buttons .btn-group';
     var radio_selector = '.widget-area .widget-subarea .widget-hbox .widget-radio-box';
     var list_selector = '.widget-area .widget-subarea .widget-hbox .widget-listbox';
 
     var selection_index;
     var selection_values = 'abcd';
     var check_state = function(context, index, state){
         if (0 <= index && index < selection_values.length) {
             var multibtn_state = context.cell_element_function(selection_index, multibtn_selector + ' .btn:nth-child(' + (index + 1) + ')', 'hasClass', ['active']);
             var radio_state = context.cell_element_function(selection_index, radio_selector + ' .radio:nth-child(' + (index + 1) + ') input', 'prop', ['checked']);
             var list_val = context.cell_element_function(selection_index, list_selector, 'val');
             var combo_val = context.cell_element_function(selection_index, combo_selector, 'html');
             
             var val = selection_values.charAt(index);
             var list_state = (val == list_val);
             var combo_state = (val == combo_val);
 
             return multibtn_state == state &&
                 radio_state == state &&
                 list_state == state &&
                 combo_state == state;
         }
         return true;
     };
 
     var verify_selection = function(context, index){
         for (var i = 0; i < selection_values.length; i++) {
             if (!check_state(context, i, i==index)) {
                 return false;
             }
         }
         return true;
     };
 
 //values=["' + selection_values + '"[i] for i in range(4)]
     selection_index = this.append_cell(
-        'values=["' + selection_values + '"[i] for i in range(4)]\n' +
-        'selection = [widgets.Dropdown(values=values),\n' +
-        '    widgets.ToggleButtons(values=values),\n' +
-        '    widgets.RadioButtons(values=values),\n' +
-        '    widgets.Select(values=values)]\n' +
+        'options=["' + selection_values + '"[i] for i in range(4)]\n' +
+        'selection = [widgets.Dropdown(options=options),\n' +
+        '    widgets.ToggleButtons(options=options),\n' +
+        '    widgets.RadioButtons(options=options),\n' +
+        '    widgets.Select(options=options)]\n' +
         '[display(selection[i]) for i in range(4)]\n' +
         'for widget in selection:\n' +
         '    def handle_change(name,old,new):\n' +
         '        for other_widget in selection:\n' +
         '            other_widget.value = new\n' +
         '    widget.on_trait_change(handle_change, "value")\n' +
         'print("Success")\n');
     this.execute_cell_then(selection_index, function(index){
         this.test.assertEquals(this.get_output_cell(index).text, 'Success\n', 
             'Create selection cell executed with correct output.');
     });
 
     // Wait for the widgets to actually display.
     this.wait_for_element(selection_index, combo_selector);
     this.wait_for_element(selection_index, multibtn_selector);
     this.wait_for_element(selection_index, radio_selector);
     this.wait_for_element(selection_index, list_selector);
 
     // Continue with the tests.
     this.then(function() {
         this.test.assert(this.cell_element_exists(selection_index, 
             '.widget-area .widget-subarea'),
             'Widget subarea exists.');
 
         this.test.assert(this.cell_element_exists(selection_index, combo_selector),
              'Widget combobox exists.');
 
         this.test.assert(this.cell_element_exists(selection_index, multibtn_selector),
             'Widget multibutton exists.');
 
         this.test.assert(this.cell_element_exists(selection_index, radio_selector),
             'Widget radio buttons exists.');
 
         this.test.assert(this.cell_element_exists(selection_index, list_selector),
             'Widget list exists.');
 
         // Verify that no items are selected.
         this.test.assert(verify_selection(this, 0), 'Default first item selected.');
     });
 
     index = this.append_cell(
         'for widget in selection:\n' +
         '    widget.value = "a"\n' +
         'print("Success")\n');
     this.execute_cell_then(index, function(index){
         this.test.assertEquals(this.get_output_cell(index).text, 'Success\n', 
             'Python select item executed with correct output.');
 
         // Verify that the first item is selected.
         this.test.assert(verify_selection(this, 0), 'Python selected');
 
         // Verify that selecting a radio button updates all of the others.
         this.cell_element_function(selection_index, radio_selector + ' .radio:nth-child(2) input', 'click');
     });
     this.wait_for_idle();
     this.then(function () {
         this.test.assert(verify_selection(this, 1), 'Radio button selection updated view states correctly.');
 
         // Verify that selecting a list option updates all of the others.
         this.cell_element_function(selection_index, list_selector + ' option:nth-child(3)', 'click');
     });
     this.wait_for_idle();
     this.then(function () {
         this.test.assert(verify_selection(this, 2), 'List selection updated view states correctly.');
 
         // Verify that selecting a multibutton option updates all of the others.
         // Bootstrap3 has changed the toggle button group behavior.  Two clicks
         // are required to actually select an item.
         this.cell_element_function(selection_index, multibtn_selector + ' .btn:nth-child(4)', 'click');
         this.cell_element_function(selection_index, multibtn_selector + ' .btn:nth-child(4)', 'click');
     });
     this.wait_for_idle();
     this.then(function () {
         this.test.assert(verify_selection(this, 3), 'Multibutton selection updated view states correctly.');
 
         // Verify that selecting a combobox option updates all of the others.
         this.cell_element_function(selection_index, '.widget-area .widget-subarea .widget-hbox .btn-group ul.dropdown-menu li:nth-child(3) a', 'click');
     });
     this.wait_for_idle();
     this.then(function () {
         this.test.assert(verify_selection(this, 2), 'Combobox selection updated view states correctly.');
     });
 
     this.wait_for_idle();
 
     index = this.append_cell(
         'from copy import copy\n' +
         'for widget in selection:\n' +
-        '    d = copy(widget.values)\n' +
+        '    d = copy(widget.options)\n' +
         '    d.append("z")\n' +
-        '    widget.values = d\n' +
+        '    widget.options = d\n' +
         'selection[0].value = "z"');
     this.execute_cell_then(index, function(index){
 
         // Verify that selecting a combobox option updates all of the others.
         this.test.assert(verify_selection(this, 4), 'Item added to selection widget.');
     });
 });
  No newline at end of file

IPython/html/widgets/__init__.py

@@ -1,38 +1,38 b''
 from .widget import Widget, DOMWidget, CallbackDispatcher, register
 
 from .widget_bool import Checkbox, ToggleButton
 from .widget_button import Button
 from .widget_box import Box, FlexBox, HBox, VBox
 from .widget_float import FloatText, BoundedFloatText, FloatSlider, FloatProgress, FloatRangeSlider
 from .widget_image import Image
 from .widget_int import IntText, BoundedIntText, IntSlider, IntProgress, IntRangeSlider
 from .widget_output import Output
-from .widget_selection import RadioButtons, ToggleButtons, Dropdown, Select
+from .widget_selection import RadioButtons, ToggleButtons, Dropdown, Select, SelectMultiple
 from .widget_selectioncontainer import Tab, Accordion
 from .widget_string import HTML, Latex, Text, Textarea
 from .interaction import interact, interactive, fixed, interact_manual
 from .widget_link import jslink, jsdlink
 
 # Deprecated classes
 from .widget_bool import CheckboxWidget, ToggleButtonWidget
 from .widget_button import ButtonWidget
 from .widget_box import ContainerWidget
 from .widget_float import FloatTextWidget, BoundedFloatTextWidget, FloatSliderWidget, FloatProgressWidget
 from .widget_image import ImageWidget
 from .widget_int import IntTextWidget, BoundedIntTextWidget, IntSliderWidget, IntProgressWidget
 from .widget_selection import RadioButtonsWidget, ToggleButtonsWidget, DropdownWidget, SelectWidget
 from .widget_selectioncontainer import TabWidget, AccordionWidget
 from .widget_string import HTMLWidget, LatexWidget, TextWidget, TextareaWidget
 
 # We use warn_explicit so we have very brief messages without file or line numbers.
 # The concern is that file or line numbers will confuse the interactive user.
 # To ignore this warning, do:
 #
 #     from warnings import filterwarnings
 #     filterwarnings('ignore', module='IPython.html.widgets')
 
 from warnings import warn_explicit
 __warningregistry__ = {}
 warn_explicit("IPython widgets are experimental and may change in the future.",
               FutureWarning, '', 0, module = 'IPython.html.widgets',
               registry = __warningregistry__, module_globals = globals)

IPython/html/widgets/interaction.py

@@ -1,349 +1,349 b''
 """Interact with functions using widgets."""
 
 # Copyright (c) IPython Development Team.
 # Distributed under the terms of the Modified BSD License.
 
 from __future__ import print_function
 
 try:  # Python >= 3.3
     from inspect import signature, Parameter
 except ImportError:
     from IPython.utils.signatures import signature, Parameter
 from inspect import getcallargs
 
 from IPython.core.getipython import get_ipython
 from IPython.html.widgets import (Widget, Text,
     FloatSlider, IntSlider, Checkbox, Dropdown,
     Box, Button, DOMWidget, Output)
 from IPython.display import display, clear_output
 from IPython.utils.py3compat import string_types, unicode_type
 from IPython.utils.traitlets import HasTraits, Any, Unicode
 
 empty = Parameter.empty
 
 
 def _matches(o, pattern):
     """Match a pattern of types in a sequence."""
     if not len(o) == len(pattern):
         return False
     comps = zip(o,pattern)
     return all(isinstance(obj,kind) for obj,kind in comps)
 
 
 def _get_min_max_value(min, max, value=None, step=None):
     """Return min, max, value given input values with possible None."""
     if value is None:
         if not max > min:
             raise ValueError('max must be greater than min: (min={0}, max={1})'.format(min, max))
         value = min + abs(min-max)/2
         value = type(min)(value)
     elif min is None and max is None:
         if value == 0.0:
             min, max, value = 0.0, 1.0, 0.5
         elif value == 0:
             min, max, value = 0, 1, 0
         elif isinstance(value, (int, float)):
             min, max = (-value, 3*value) if value > 0 else (3*value, -value)
         else:
             raise TypeError('expected a number, got: %r' % value)
     else:
         raise ValueError('unable to infer range, value from: ({0}, {1}, {2})'.format(min, max, value))
     if step is not None:
         # ensure value is on a step
         r = (value - min) % step
         value = value - r
     return min, max, value
 
 def _widget_abbrev_single_value(o):
     """Make widgets from single values, which can be used as parameter defaults."""
     if isinstance(o, string_types):
         return Text(value=unicode_type(o))
     elif isinstance(o, dict):
-        return Dropdown(values=o)
+        return Dropdown(options=o)
     elif isinstance(o, bool):
         return Checkbox(value=o)
     elif isinstance(o, float):
         min, max, value = _get_min_max_value(None, None, o)
         return FloatSlider(value=o, min=min, max=max)
     elif isinstance(o, int):
         min, max, value = _get_min_max_value(None, None, o)
         return IntSlider(value=o, min=min, max=max)
     else:
         return None
 
 def _widget_abbrev(o):
     """Make widgets from abbreviations: single values, lists or tuples."""
     float_or_int = (float, int)
     if isinstance(o, (list, tuple)):
         if o and all(isinstance(x, string_types) for x in o):
-            return Dropdown(values=[unicode_type(k) for k in o])
+            return Dropdown(options=[unicode_type(k) for k in o])
         elif _matches(o, (float_or_int, float_or_int)):
             min, max, value = _get_min_max_value(o[0], o[1])
             if all(isinstance(_, int) for _ in o):
                 cls = IntSlider
             else:
                 cls = FloatSlider
             return cls(value=value, min=min, max=max)
         elif _matches(o, (float_or_int, float_or_int, float_or_int)):
             step = o[2]
             if step <= 0:
                 raise ValueError("step must be >= 0, not %r" % step)
             min, max, value = _get_min_max_value(o[0], o[1], step=step)
             if all(isinstance(_, int) for _ in o):
                 cls = IntSlider
             else:
                 cls = FloatSlider
             return cls(value=value, min=min, max=max, step=step)
     else:
         return _widget_abbrev_single_value(o)
 
 def _widget_from_abbrev(abbrev, default=empty):
     """Build a Widget instance given an abbreviation or Widget."""
     if isinstance(abbrev, Widget) or isinstance(abbrev, fixed):
         return abbrev
 
     widget = _widget_abbrev(abbrev)
     if default is not empty and isinstance(abbrev, (list, tuple, dict)):
         # if it's not a single-value abbreviation,
         # set the initial value from the default
         try:
             widget.value = default
         except Exception:
             # ignore failure to set default
             pass
     if widget is None:
         raise ValueError("%r cannot be transformed to a Widget" % (abbrev,))
     return widget
 
 def _yield_abbreviations_for_parameter(param, kwargs):
     """Get an abbreviation for a function parameter."""
     name = param.name
     kind = param.kind
     ann = param.annotation
     default = param.default
     not_found = (name, empty, empty)
     if kind in (Parameter.POSITIONAL_OR_KEYWORD, Parameter.KEYWORD_ONLY):
         if name in kwargs:
             value = kwargs.pop(name)
         elif ann is not empty:
             value = ann
         elif default is not empty:
             value = default
         else:
             yield not_found
         yield (name, value, default)
     elif kind == Parameter.VAR_KEYWORD:
         # In this case name=kwargs and we yield the items in kwargs with their keys.
         for k, v in kwargs.copy().items():
             kwargs.pop(k)
             yield k, v, empty
 
 def _find_abbreviations(f, kwargs):
     """Find the abbreviations for a function and kwargs passed to interact."""
     new_kwargs = []
     for param in signature(f).parameters.values():
         for name, value, default in _yield_abbreviations_for_parameter(param, kwargs):
             if value is empty:
                 raise ValueError('cannot find widget or abbreviation for argument: {!r}'.format(name))
             new_kwargs.append((name, value, default))
     return new_kwargs
 
 def _widgets_from_abbreviations(seq):
     """Given a sequence of (name, abbrev) tuples, return a sequence of Widgets."""
     result = []
     for name, abbrev, default in seq:
         widget = _widget_from_abbrev(abbrev, default)
         if not widget.description:
             widget.description = name
         widget._kwarg = name
         result.append(widget)
     return result
 
 def interactive(__interact_f, **kwargs):
     """
     Builds a group of interactive widgets tied to a function and places the
     group into a Box container.
 
     Returns
     -------
     container : a Box instance containing multiple widgets
 
     Parameters
     ----------
     __interact_f : function
         The function to which the interactive widgets are tied. The **kwargs
         should match the function signature.
     **kwargs : various, optional
         An interactive widget is created for each keyword argument that is a
         valid widget abbreviation.
     """
     f = __interact_f
     co = kwargs.pop('clear_output', True)
     manual = kwargs.pop('__manual', False)
     kwargs_widgets = []
     container = Box()
     container.result = None
     container.args = []
     container.kwargs = dict()
     kwargs = kwargs.copy()
 
     new_kwargs = _find_abbreviations(f, kwargs)
     # Before we proceed, let's make sure that the user has passed a set of args+kwargs
     # that will lead to a valid call of the function. This protects against unspecified
     # and doubly-specified arguments.
     getcallargs(f, **{n:v for n,v,_ in new_kwargs})
     # Now build the widgets from the abbreviations.
     kwargs_widgets.extend(_widgets_from_abbreviations(new_kwargs))
 
     # This has to be done as an assignment, not using container.children.append,
     # so that traitlets notices the update. We skip any objects (such as fixed) that
     # are not DOMWidgets.
     c = [w for w in kwargs_widgets if isinstance(w, DOMWidget)]
 
     # If we are only to run the function on demand, add a button to request this
     if manual:
         manual_button = Button(description="Run %s" % f.__name__)
         c.append(manual_button)
 
     # Use an output widget to capture the output of interact.
     output = Output()
     c.append(output)
     container.children = c
 
     # Build the callback
     def call_f(name=None, old=None, new=None):
         with output:
             container.kwargs = {}
             for widget in kwargs_widgets:
                 value = widget.value
                 container.kwargs[widget._kwarg] = value
             if co:
                 clear_output(wait=True)
             if manual:
                 manual_button.disabled = True
             try:
                 container.result = f(**container.kwargs)
             except Exception as e:
                 ip = get_ipython()
                 if ip is None:
                     container.log.warn("Exception in interact callback: %s", e, exc_info=True)
                 else:
                     ip.showtraceback()
             finally:
                 if manual:
                     manual_button.disabled = False
 
     # Wire up the widgets
     # If we are doing manual running, the callback is only triggered by the button
     # Otherwise, it is triggered for every trait change received
     # On-demand running also suppresses running the function with the initial parameters
     if manual:
         manual_button.on_click(call_f)
     else:
         for widget in kwargs_widgets:
             widget.on_trait_change(call_f, 'value')
 
         container.on_displayed(lambda _: call_f(None, None, None))
 
     return container
 
 def interact(__interact_f=None, **kwargs):
     """
     Displays interactive widgets which are tied to a function.
     Expects the first argument to be a function. Parameters to this function are
     widget abbreviations passed in as keyword arguments (**kwargs). Can be used
     as a decorator (see examples).
 
     Returns
     -------
     f : __interact_f with interactive widget attached to it.
 
     Parameters
     ----------
     __interact_f : function
         The function to which the interactive widgets are tied. The **kwargs
         should match the function signature. Passed to :func:`interactive()`
     **kwargs : various, optional
         An interactive widget is created for each keyword argument that is a
         valid widget abbreviation. Passed to :func:`interactive()`
 
     Examples
     --------
     Renders an interactive text field that shows the greeting with the passed in
     text.
 
     1. Invocation of interact as a function
        def greeting(text="World"):
            print "Hello {}".format(text)
        interact(greeting, text="IPython Widgets")
         
     2. Invocation of interact as a decorator
        @interact
        def greeting(text="World"):
            print "Hello {}".format(text)
         
     3. Invocation of interact as a decorator with named parameters
        @interact(text="IPython Widgets")
        def greeting(text="World"):
            print "Hello {}".format(text)
         
     Renders an interactive slider widget and prints square of number.
 
     1. Invocation of interact as a function
        def square(num=1):
            print "{} squared is {}".format(num, num*num)
        interact(square, num=5)
 
     2. Invocation of interact as a decorator
        @interact
        def square(num=2):
            print "{} squared is {}".format(num, num*num)
         
     3. Invocation of interact as a decorator with named parameters
        @interact(num=5)
        def square(num=2):
            print "{} squared is {}".format(num, num*num)
     """
     # positional arg support in: https://gist.github.com/8851331
     if __interact_f is not None:
         # This branch handles the cases 1 and 2
         # 1. interact(f, **kwargs)
         # 2. @interact
         #    def f(*args, **kwargs):
         #        ...
         f = __interact_f
         w = interactive(f, **kwargs)
         try:
             f.widget = w
         except AttributeError:
             # some things (instancemethods) can't have attributes attached,
             # so wrap in a lambda
             f = lambda *args, **kwargs: __interact_f(*args, **kwargs)
             f.widget = w
         display(w)
         return f
     else:
         # This branch handles the case 3
         # @interact(a=30, b=40)
         # def f(*args, **kwargs):
         #     ...
         def dec(f):
             return interact(f, **kwargs)
         return dec
 
 def interact_manual(__interact_f=None, **kwargs):
     """interact_manual(f, **kwargs)
     
     As `interact()`, generates widgets for each argument, but rather than running
     the function after each widget change, adds a "Run" button and waits for it
     to be clicked. Useful if the function is long-running and has several
     parameters to change.
     """
     return interact(__interact_f, __manual=True, **kwargs)
 
 class fixed(HasTraits):
     """A pseudo-widget whose value is fixed and never synced to the client."""
     value = Any(help="Any Python object")
     description = Unicode('', help="Any Python object")
     def __init__(self, value, **kwargs):
         super(fixed, self).__init__(value=value, **kwargs)

IPython/html/widgets/tests/test_interaction.py

@@ -1,636 +1,692 b''
 """Test interact and interactive."""
 
 # Copyright (c) IPython Development Team.
 # Distributed under the terms of the Modified BSD License.
 
 from __future__ import print_function
 
 from collections import OrderedDict
 
 import nose.tools as nt
 import IPython.testing.tools as tt
 
 from IPython.kernel.comm import Comm
 from IPython.html import widgets
 from IPython.html.widgets import interact, interactive, Widget, interaction
 from IPython.utils.py3compat import annotate
 
 #-----------------------------------------------------------------------------
 # Utility stuff
 #-----------------------------------------------------------------------------
 
 class DummyComm(Comm):
     comm_id = 'a-b-c-d'
     
     def open(self, *args, **kwargs):
         pass
     
     def send(self, *args, **kwargs):
         pass
     
     def close(self, *args, **kwargs):
         pass
 
 _widget_attrs = {}
 displayed = []
 undefined = object()
 
 def setup():
     _widget_attrs['_comm_default'] = getattr(Widget, '_comm_default', undefined)
     Widget._comm_default = lambda self: DummyComm()
     _widget_attrs['_ipython_display_'] = Widget._ipython_display_
     def raise_not_implemented(*args, **kwargs):
         raise NotImplementedError()
     Widget._ipython_display_ = raise_not_implemented
 
 def teardown():
     for attr, value in _widget_attrs.items():
         if value is undefined:
             delattr(Widget, attr)
         else:
             setattr(Widget, attr, value)
 
 def f(**kwargs):
     pass
 
 def clear_display():
     global displayed
     displayed = []
 
 def record_display(*args):
     displayed.extend(args)
 
 #-----------------------------------------------------------------------------
 # Actual tests
 #-----------------------------------------------------------------------------
 
 def check_widget(w, **d):
     """Check a single widget against a dict"""
     for attr, expected in d.items():
         if attr == 'cls':
             nt.assert_is(w.__class__, expected)
         else:
             value = getattr(w, attr)
             nt.assert_equal(value, expected,
                 "%s.%s = %r != %r" % (w.__class__.__name__, attr, value, expected)
             )
 
 def check_widgets(container, **to_check):
     """Check that widgets are created as expected"""
     # build a widget dictionary, so it matches
     widgets = {}
     for w in container.children:
         if hasattr(w, 'description'):
             widgets[w.description] = w
     
     for key, d in to_check.items():
         nt.assert_in(key, widgets)
         check_widget(widgets[key], **d)
     
 
 def test_single_value_string():
     a = u'hello'
     c = interactive(f, a=a)
     w = c.children[0]
     check_widget(w,
         cls=widgets.Text,
         description='a',
         value=a,
     )
 
 def test_single_value_bool():
     for a in (True, False):
         c = interactive(f, a=a)
         w = c.children[0]
         check_widget(w,
             cls=widgets.Checkbox,
             description='a',
             value=a,
         )
 
 def test_single_value_dict():
     for d in [
         dict(a=5),
         dict(a=5, b='b', c=dict),
     ]:
         c = interactive(f, d=d)
         w = c.children[0]
         check_widget(w,
             cls=widgets.Dropdown,
             description='d',
-            values=d,
+            options=d,
             value=next(iter(d.values())),
         )
 
 def test_single_value_float():
     for a in (2.25, 1.0, -3.5):
         c = interactive(f, a=a)
         w = c.children[0]
         check_widget(w,
             cls=widgets.FloatSlider,
             description='a',
             value=a,
             min= -a if a > 0 else 3*a,
             max= 3*a if a > 0 else -a,
             step=0.1,
             readout=True,
         )
 
 def test_single_value_int():
     for a in (1, 5, -3):
         c = interactive(f, a=a)
         nt.assert_equal(len(c.children), 2)
         w = c.children[0]
         check_widget(w,
             cls=widgets.IntSlider,
             description='a',
             value=a,
             min= -a if a > 0 else 3*a,
             max= 3*a if a > 0 else -a,
             step=1,
             readout=True,
         )
 
 def test_list_tuple_2_int():
     with nt.assert_raises(ValueError):
         c = interactive(f, tup=(1,1))
     with nt.assert_raises(ValueError):
         c = interactive(f, tup=(1,-1))
     for min, max in [ (0,1), (1,10), (1,2), (-5,5), (-20,-19) ]:
         c = interactive(f, tup=(min, max), lis=[min, max])
         nt.assert_equal(len(c.children), 3)
         d = dict(
             cls=widgets.IntSlider,
             min=min,
             max=max,
             step=1,
             readout=True,
         )
         check_widgets(c, tup=d, lis=d)
 
 def test_list_tuple_3_int():
     with nt.assert_raises(ValueError):
         c = interactive(f, tup=(1,2,0))
     with nt.assert_raises(ValueError):
         c = interactive(f, tup=(1,2,-1))
     for min, max, step in [ (0,2,1), (1,10,2), (1,100,2), (-5,5,4), (-100,-20,4) ]:
         c = interactive(f, tup=(min, max, step), lis=[min, max, step])
         nt.assert_equal(len(c.children), 3)
         d = dict(
             cls=widgets.IntSlider,
             min=min,
             max=max,
             step=step,
             readout=True,
         )
         check_widgets(c, tup=d, lis=d)
 
 def test_list_tuple_2_float():
     with nt.assert_raises(ValueError):
         c = interactive(f, tup=(1.0,1.0))
     with nt.assert_raises(ValueError):
         c = interactive(f, tup=(0.5,-0.5))
     for min, max in [ (0.5, 1.5), (1.1,10.2), (1,2.2), (-5.,5), (-20,-19.) ]:
         c = interactive(f, tup=(min, max), lis=[min, max])
         nt.assert_equal(len(c.children), 3)
         d = dict(
             cls=widgets.FloatSlider,
             min=min,
             max=max,
             step=.1,
             readout=True,
         )
         check_widgets(c, tup=d, lis=d)
 
 def test_list_tuple_3_float():
     with nt.assert_raises(ValueError):
         c = interactive(f, tup=(1,2,0.0))
     with nt.assert_raises(ValueError):
         c = interactive(f, tup=(-1,-2,1.))
     with nt.assert_raises(ValueError):
         c = interactive(f, tup=(1,2.,-1.))
     for min, max, step in [ (0.,2,1), (1,10.,2), (1,100,2.), (-5.,5.,4), (-100,-20.,4.) ]:
         c = interactive(f, tup=(min, max, step), lis=[min, max, step])
         nt.assert_equal(len(c.children), 3)
         d = dict(
             cls=widgets.FloatSlider,
             min=min,
             max=max,
             step=step,
             readout=True,
         )
         check_widgets(c, tup=d, lis=d)
 
 def test_list_tuple_str():
     values = ['hello', 'there', 'guy']
     first = values[0]
     c = interactive(f, tup=tuple(values), lis=list(values))
     nt.assert_equal(len(c.children), 3)
     d = dict(
         cls=widgets.Dropdown,
         value=first,
-        values=values
+        options=values
     )
     check_widgets(c, tup=d, lis=d)
 
 def test_list_tuple_invalid():
     for bad in [
         (),
         (5, 'hi'),
         ('hi', 5),
         ({},),
         (None,),
     ]:
         with nt.assert_raises(ValueError):
             print(bad) # because there is no custom message in assert_raises
             c = interactive(f, tup=bad)
 
 def test_defaults():
     @annotate(n=10)
     def f(n, f=4.5, g=1):
         pass
     
     c = interactive(f)
     check_widgets(c,
         n=dict(
             cls=widgets.IntSlider,
             value=10,
         ),
         f=dict(
             cls=widgets.FloatSlider,
             value=4.5,
         ),
         g=dict(
             cls=widgets.IntSlider,
             value=1,
         ),
     )
 
 def test_default_values():
     @annotate(n=10, f=(0, 10.), g=5, h={'a': 1, 'b': 2}, j=['hi', 'there'])
     def f(n, f=4.5, g=1, h=2, j='there'):
         pass
     
     c = interactive(f)
     check_widgets(c,
         n=dict(
             cls=widgets.IntSlider,
             value=10,
         ),
         f=dict(
             cls=widgets.FloatSlider,
             value=4.5,
         ),
         g=dict(
             cls=widgets.IntSlider,
             value=5,
         ),
         h=dict(
             cls=widgets.Dropdown,
-            values={'a': 1, 'b': 2},
+            options={'a': 1, 'b': 2},
             value=2
         ),
         j=dict(
             cls=widgets.Dropdown,
-            values=['hi', 'there'],
+            options=['hi', 'there'],
             value='there'
         ),
     )
 
 def test_default_out_of_bounds():
     @annotate(f=(0, 10.), h={'a': 1}, j=['hi', 'there'])
     def f(f='hi', h=5, j='other'):
         pass
     
     c = interactive(f)
     check_widgets(c,
         f=dict(
             cls=widgets.FloatSlider,
             value=5.,
         ),
         h=dict(
             cls=widgets.Dropdown,
-            values={'a': 1},
+            options={'a': 1},
             value=1,
         ),
         j=dict(
             cls=widgets.Dropdown,
-            values=['hi', 'there'],
+            options=['hi', 'there'],
             value='hi',
         ),
     )
 
 def test_annotations():
     @annotate(n=10, f=widgets.FloatText())
     def f(n, f):
         pass
     
     c = interactive(f)
     check_widgets(c,
         n=dict(
             cls=widgets.IntSlider,
             value=10,
         ),
         f=dict(
             cls=widgets.FloatText,
         ),
     )
 
 def test_priority():
     @annotate(annotate='annotate', kwarg='annotate')
     def f(kwarg='default', annotate='default', default='default'):
         pass
     
     c = interactive(f, kwarg='kwarg')
     check_widgets(c,
         kwarg=dict(
             cls=widgets.Text,
             value='kwarg',
         ),
         annotate=dict(
             cls=widgets.Text,
             value='annotate',
         ),
     )
 
 @nt.with_setup(clear_display)
 def test_decorator_kwarg():
     with tt.monkeypatch(interaction, 'display', record_display):
         @interact(a=5)
         def foo(a):
             pass
     nt.assert_equal(len(displayed), 1)
     w = displayed[0].children[0]
     check_widget(w,
         cls=widgets.IntSlider,
         value=5,
     )
 
 @nt.with_setup(clear_display)
 def test_interact_instancemethod():
     class Foo(object):
         def show(self, x):
             print(x)
 
     f = Foo()
     
     with tt.monkeypatch(interaction, 'display', record_display):
         g = interact(f.show, x=(1,10))
     nt.assert_equal(len(displayed), 1)
     w = displayed[0].children[0]
     check_widget(w,
         cls=widgets.IntSlider,
         value=5,
     )
 
 @nt.with_setup(clear_display)
 def test_decorator_no_call():
     with tt.monkeypatch(interaction, 'display', record_display):
         @interact
         def foo(a='default'):
             pass
     nt.assert_equal(len(displayed), 1)
     w = displayed[0].children[0]
     check_widget(w,
         cls=widgets.Text,
         value='default',
     )
 
 @nt.with_setup(clear_display)
 def test_call_interact():
     def foo(a='default'):
         pass
     with tt.monkeypatch(interaction, 'display', record_display):
         ifoo = interact(foo)
     nt.assert_equal(len(displayed), 1)
     w = displayed[0].children[0]
     check_widget(w,
         cls=widgets.Text,
         value='default',
     )
 
 @nt.with_setup(clear_display)
 def test_call_interact_kwargs():
     def foo(a='default'):
         pass
     with tt.monkeypatch(interaction, 'display', record_display):
         ifoo = interact(foo, a=10)
     nt.assert_equal(len(displayed), 1)
     w = displayed[0].children[0]
     check_widget(w,
         cls=widgets.IntSlider,
         value=10,
     )
 
 @nt.with_setup(clear_display)
 def test_call_decorated_on_trait_change():
     """test calling @interact decorated functions"""
     d = {}
     with tt.monkeypatch(interaction, 'display', record_display):
         @interact
         def foo(a='default'):
             d['a'] = a
             return a
     nt.assert_equal(len(displayed), 1)
     w = displayed[0].children[0]
     check_widget(w,
         cls=widgets.Text,
         value='default',
     )
     # test calling the function directly
     a = foo('hello')
     nt.assert_equal(a, 'hello')
     nt.assert_equal(d['a'], 'hello')
     
     # test that setting trait values calls the function
     w.value = 'called'
     nt.assert_equal(d['a'], 'called')
 
 @nt.with_setup(clear_display)
 def test_call_decorated_kwargs_on_trait_change():
     """test calling @interact(foo=bar) decorated functions"""
     d = {}
     with tt.monkeypatch(interaction, 'display', record_display):
         @interact(a='kwarg')
         def foo(a='default'):
             d['a'] = a
             return a
     nt.assert_equal(len(displayed), 1)
     w = displayed[0].children[0]
     check_widget(w,
         cls=widgets.Text,
         value='kwarg',
     )
     # test calling the function directly
     a = foo('hello')
     nt.assert_equal(a, 'hello')
     nt.assert_equal(d['a'], 'hello')
     
     # test that setting trait values calls the function
     w.value = 'called'
     nt.assert_equal(d['a'], 'called')
 
 def test_fixed():
     c = interactive(f, a=widgets.fixed(5), b='text')
     nt.assert_equal(len(c.children), 2)
     w = c.children[0]
     check_widget(w,
         cls=widgets.Text,
         value='text',
         description='b',
     )
 
 def test_default_description():
     c = interactive(f, b='text')
     w = c.children[0]
     check_widget(w,
         cls=widgets.Text,
         value='text',
         description='b',
     )
 
 def test_custom_description():
     d = {}
     def record_kwargs(**kwargs):
         d.clear()
         d.update(kwargs)
     
     c = interactive(record_kwargs, b=widgets.Text(value='text', description='foo'))
     w = c.children[0]
     check_widget(w,
         cls=widgets.Text,
         value='text',
         description='foo',
     )
     w.value = 'different text'
     nt.assert_equal(d, {'b': 'different text'})
 
 def test_interact_manual_button():
     c = interactive(f, __manual=True)
     w = c.children[0]
     check_widget(w, cls=widgets.Button)
 
 def test_interact_manual_nocall():
     callcount = 0
     def calltest(testarg):
         callcount += 1
     c = interactive(calltest, testarg=5, __manual=True)
     c.children[0].value = 10
     nt.assert_equal(callcount, 0)
 
 def test_int_range_logic():
     irsw = widgets.IntRangeSlider
     w = irsw(value=(2, 4), min=0, max=6)
     check_widget(w, cls=irsw, value=(2, 4), min=0, max=6)
     w.value = (4, 2)
     check_widget(w, cls=irsw, value=(2, 4), min=0, max=6)
     w.value = (-1, 7)
     check_widget(w, cls=irsw, value=(0, 6), min=0, max=6)
     w.min = 3
     check_widget(w, cls=irsw, value=(3, 6), min=3, max=6)
     w.max = 3
     check_widget(w, cls=irsw, value=(3, 3), min=3, max=3)
     
     w.min = 0
     w.max = 6
     w.lower = 2
     w.upper = 4
     check_widget(w, cls=irsw, value=(2, 4), min=0, max=6)
     w.value = (0, 1) #lower non-overlapping range
     check_widget(w, cls=irsw, value=(0, 1), min=0, max=6)
     w.value = (5, 6) #upper non-overlapping range
     check_widget(w, cls=irsw, value=(5, 6), min=0, max=6)
     w.value = (-1, 4) #semi out-of-range
     check_widget(w, cls=irsw, value=(0, 4), min=0, max=6)
     w.lower = 2
     check_widget(w, cls=irsw, value=(2, 4), min=0, max=6)
     w.value = (-2, -1) #wholly out of range
     check_widget(w, cls=irsw, value=(0, 0), min=0, max=6)
     w.value = (7, 8)
     check_widget(w, cls=irsw, value=(6, 6), min=0, max=6)
     
     with nt.assert_raises(ValueError):
         w.min = 7
     with nt.assert_raises(ValueError):
         w.max = -1
     with nt.assert_raises(ValueError):
         w.lower = 5
     with nt.assert_raises(ValueError):
         w.upper = 1
     
     w = irsw(min=2, max=3)
     check_widget(w, min=2, max=3)
     w = irsw(min=100, max=200)
     check_widget(w, lower=125, upper=175, value=(125, 175))
     
     with nt.assert_raises(ValueError):
         irsw(value=(2, 4), lower=3)
     with nt.assert_raises(ValueError):
         irsw(value=(2, 4), upper=3)
     with nt.assert_raises(ValueError):
         irsw(value=(2, 4), lower=3, upper=3)
     with nt.assert_raises(ValueError):
         irsw(min=2, max=1)
     with nt.assert_raises(ValueError):
         irsw(lower=5)
     with nt.assert_raises(ValueError):
         irsw(upper=5)
     
 
 def test_float_range_logic():
     frsw = widgets.FloatRangeSlider
     w = frsw(value=(.2, .4), min=0., max=.6)
     check_widget(w, cls=frsw, value=(.2, .4), min=0., max=.6)
     w.value = (.4, .2)
     check_widget(w, cls=frsw, value=(.2, .4), min=0., max=.6)
     w.value = (-.1, .7)
     check_widget(w, cls=frsw, value=(0., .6), min=0., max=.6)
     w.min = .3
     check_widget(w, cls=frsw, value=(.3, .6), min=.3, max=.6)
     w.max = .3
     check_widget(w, cls=frsw, value=(.3, .3), min=.3, max=.3)
     
     w.min = 0.
     w.max = .6
     w.lower = .2
     w.upper = .4
     check_widget(w, cls=frsw, value=(.2, .4), min=0., max=.6)
     w.value = (0., .1) #lower non-overlapping range
     check_widget(w, cls=frsw, value=(0., .1), min=0., max=.6)
     w.value = (.5, .6) #upper non-overlapping range
     check_widget(w, cls=frsw, value=(.5, .6), min=0., max=.6)
     w.value = (-.1, .4) #semi out-of-range
     check_widget(w, cls=frsw, value=(0., .4), min=0., max=.6)
     w.lower = .2
     check_widget(w, cls=frsw, value=(.2, .4), min=0., max=.6)
     w.value = (-.2, -.1) #wholly out of range
     check_widget(w, cls=frsw, value=(0., 0.), min=0., max=.6)
     w.value = (.7, .8)
     check_widget(w, cls=frsw, value=(.6, .6), min=.0, max=.6)
     
     with nt.assert_raises(ValueError):
         w.min = .7
     with nt.assert_raises(ValueError):
         w.max = -.1
     with nt.assert_raises(ValueError):
         w.lower = .5
     with nt.assert_raises(ValueError):
         w.upper = .1
     
     w = frsw(min=2, max=3)
     check_widget(w, min=2, max=3)
     w = frsw(min=1., max=2.)
     check_widget(w, lower=1.25, upper=1.75, value=(1.25, 1.75))
     
     with nt.assert_raises(ValueError):
         frsw(value=(2, 4), lower=3)
     with nt.assert_raises(ValueError):
         frsw(value=(2, 4), upper=3)
     with nt.assert_raises(ValueError):
         frsw(value=(2, 4), lower=3, upper=3)
     with nt.assert_raises(ValueError):
         frsw(min=.2, max=.1)
     with nt.assert_raises(ValueError):
         frsw(lower=5)
     with nt.assert_raises(ValueError):
         frsw(upper=5)
+
+
+def test_multiple_selection():
+    smw = widgets.SelectMultiple
+
+    # degenerate multiple select
+    w = smw()
+    check_widget(w, value=tuple(), options=None, selected_labels=tuple())
+
+    # don't accept random other value when no options
+    with nt.assert_raises(KeyError):
+        w.value = (2,)
+    check_widget(w, value=tuple(), selected_labels=tuple())
+
+    # basic multiple select
+    w = smw(options=[(1, 1)], value=[1])
+    check_widget(w, cls=smw, value=(1,), options=[(1, 1)])
+
+    # don't accept random other value
+    with nt.assert_raises(KeyError):
+        w.value = w.value + (2,)
+    check_widget(w, value=(1,), selected_labels=(1,))
+
+    # change options
+    w.options = w.options + [(2, 2)]
+    check_widget(w, options=[(1, 1), (2,2)])
+
+    # change value
+    w.value = w.value + (2,)
+    check_widget(w, value=(1, 2), selected_labels=(1, 2))
+
+    # change value name
+    w.selected_labels = (1,)
+    check_widget(w, value=(1,))
+
+    # don't accept random other names when no options
+    with nt.assert_raises(KeyError):
+        w.selected_labels = (3,)
+    check_widget(w, value=(1,))
+
+    # don't accept selected_label (from superclass)
+    with nt.assert_raises(AttributeError):
+        w.selected_label = 3
+
+    # don't return selected_label (from superclass)
+    with nt.assert_raises(AttributeError):
+        print(w.selected_label)
+
+    # dict style
+    w.options = {1: 1}
+    check_widget(w, options={1: 1})
+
+    # updating
+    with nt.assert_raises(KeyError):
+        w.value = (2,)
+    check_widget(w, options={1: 1})

IPython/html/widgets/widget_selection.py

@@ -1,172 +1,238 b''
 """Selection classes.
 
 Represents an enumeration using a widget.
 """
 #-----------------------------------------------------------------------------
 # Copyright (c) 2013, the IPython Development Team.
 #
 # Distributed under the terms of the Modified BSD License.
 #
 # The full license is in the file COPYING.txt, distributed with this software.
 #-----------------------------------------------------------------------------
 
 #-----------------------------------------------------------------------------
 # Imports
 #-----------------------------------------------------------------------------
 
 from collections import OrderedDict
 from threading import Lock
 
 from .widget import DOMWidget, register
 from IPython.utils.traitlets import (
     Unicode, Bool, Any, Dict, TraitError, CaselessStrEnum, Tuple
 )
 from IPython.utils.py3compat import unicode_type
 from IPython.utils.warn import DeprecatedClass
 
 #-----------------------------------------------------------------------------
 # SelectionWidget
 #-----------------------------------------------------------------------------
 class _Selection(DOMWidget):
     """Base class for Selection widgets
     
-    ``values`` can be specified as a list or dict. If given as a list,
+    ``options`` can be specified as a list or dict. If given as a list,
     it will be transformed to a dict of the form ``{str(value):value}``.
     """
     
     value = Any(help="Selected value")
-    value_name = Unicode(help="The name of the selected value", sync=True)
-    values = Any(help="""List of (key, value) tuples or dict of values that the 
+    selected_label = Unicode(help="The label of the selected value", sync=True)
+    options = Any(help="""List of (key, value) tuples or dict of values that the
         user can select.
     
     The keys of this list are the strings that will be displayed in the UI,
     representing the actual Python choices.
     
-    The keys of this list are also available as _value_names.
+    The keys of this list are also available as _options_labels.
     """)
     
-    _values_dict = Dict()
-    _value_names = Tuple(sync=True)
-    _value_values = Tuple()
+    _options_dict = Dict()
+    _options_labels = Tuple(sync=True)
+    _options_values = Tuple()
 
     disabled = Bool(False, help="Enable or disable user changes", sync=True)
     description = Unicode(help="Description of the value this widget represents", sync=True)
         
     def __init__(self, *args, **kwargs):
         self.value_lock = Lock()
-        self.values_lock = Lock()
-        self.on_trait_change(self._values_readonly_changed, ['_values_dict', '_value_names', '_value_values', '_values'])
-        if 'values' in kwargs:
-            self.values = kwargs.pop('values')
+        self.options_lock = Lock()
+        self.on_trait_change(self._options_readonly_changed, ['_options_dict', '_options_labels', '_options_values', '_options'])
+        if 'options' in kwargs:
+            self.options = kwargs.pop('options')
         DOMWidget.__init__(self, *args, **kwargs)
-        self._value_in_values()
+        self._value_in_options()
     
-    def _make_values(self, x):
+    def _make_options(self, x):
         # If x is a dict, convert it to list format.
         if isinstance(x, (OrderedDict, dict)):
             return [(k, v) for k, v in x.items()]
         
         # Make sure x is a list or tuple.
         if not isinstance(x, (list, tuple)):
             raise ValueError('x')
         
-        # If x is an ordinary list, use the values as names.
+        # If x is an ordinary list, use the option values as names.
         for y in x:
             if not isinstance(y, (list, tuple)) or len(y) < 2:
                 return [(i, i) for i in x]
         
         # Value is already in the correct format.
         return x
 
-    def _values_changed(self, name, old, new):
-        """Handles when the values tuple has been changed.
+    def _options_changed(self, name, old, new):
+        """Handles when the options tuple has been changed.
 
-        Setting values implies setting value names from the keys of the dict.
-        """        
-        if self.values_lock.acquire(False):
+        Setting options implies setting option labels from the keys of the dict.
+        """
+        if self.options_lock.acquire(False):
             try:
-                self.values = new
+                self.options = new
 
-                values = self._make_values(new)
-                self._values_dict = {i[0]: i[1] for i in values}
-                self._value_names = [i[0] for i in values]
-                self._value_values = [i[1] for i in values]
-                self._value_in_values()
+                options = self._make_options(new)
+                self._options_dict = {i[0]: i[1] for i in options}
+                self._options_labels = [i[0] for i in options]
+                self._options_values = [i[1] for i in options]
+                self._value_in_options()
             finally:
-                self.values_lock.release()
+                self.options_lock.release()
         
-    def _value_in_values(self):
+    def _value_in_options(self):
         # ensure that the chosen value is one of the choices
-        if self._value_values:
-            if self.value not in self._value_values:
-                self.value = next(iter(self._value_values))
     
-    def _values_readonly_changed(self, name, old, new):
-        if not self.values_lock.locked():
-            raise TraitError("`.%s` is a read-only trait. Use the `.values` tuple instead." % name)
+        if self._options_values:
+            if self.value not in self._options_values:
+                self.value = next(iter(self._options_values))
 
+    def _options_readonly_changed(self, name, old, new):
+        if not self.options_lock.locked():
+            raise TraitError("`.%s` is a read-only trait. Use the `.options` tuple instead." % name)
     def _value_changed(self, name, old, new):
         """Called when value has been changed"""
         if self.value_lock.acquire(False):
             try:
                 # Reverse dictionary lookup for the value name
-                for k,v in self._values_dict.items():
+                for k, v in self._options_dict.items():
                     if new == v:
                         # set the selected value name
-                        self.value_name = k
+                        self.selected_label = k
                         return
                 # undo the change, and raise KeyError
                 self.value = old
                 raise KeyError(new)
             finally:
                 self.value_lock.release()
 
-    def _value_name_changed(self, name, old, new):
+    def _selected_label_changed(self, name, old, new):
         """Called when the value name has been changed (typically by the frontend)."""
         if self.value_lock.acquire(False):
             try:
-                self.value = self._values_dict[new]
+                self.value = self._options_dict[new]
+            finally:
+                self.value_lock.release()
+
+
+class _MultipleSelection(_Selection):
+    """Base class for MultipleSelection widgets.
+
+    As with ``_Selection``, ``options`` can be specified as a list or dict. If
+    given as a list, it will be transformed to a dict of the form
+    ``{str(value): value}``.
+
+    Despite their names, ``value`` (and ``selected_label``) will be tuples, even
+    if only a single option is selected.
+    """
+
+    value = Tuple(help="Selected values")
+    selected_labels = Tuple(help="The labels of the selected options",
+                            sync=True)
+
+    @property
+    def selected_label(self):
+        raise AttributeError(
+            "Does not support selected_label, use selected_labels")
+
+    def _value_in_options(self):
+        # ensure that the chosen value is one of the choices
+        if self.options:
+            old_value = self.value or []
+            new_value = []
+            for value in old_value:
+                if value in self._options_dict.values():
+                    new_value.append(value)
+            if new_value:
+                self.value = new_value
+            else:
+                self.value = [next(iter(self._options_dict.values()))]
+
+    def _value_changed(self, name, old, new):
+        """Called when value has been changed"""
+        if self.value_lock.acquire(False):
+            try:
+                self.selected_labels = [
+                    self._options_labels[self._options_values.index(v)]
+                    for v in new
+                ]
+            except:
+                self.value = old
+                raise KeyError(new)
+            finally:
+                self.value_lock.release()
+
+    def _selected_labels_changed(self, name, old, new):
+        """Called when the selected label has been changed (typically by the
+        frontend)."""
+        if self.value_lock.acquire(False):
+            try:
+                self.value = [self._options_dict[name] for name in new]
             finally:
                 self.value_lock.release()
 
 
 @register('IPython.ToggleButtons')
 class ToggleButtons(_Selection):
     """Group of toggle buttons that represent an enumeration.  Only one toggle
     button can be toggled at any point in time.""" 
     _view_name = Unicode('ToggleButtonsView', sync=True)
 
     button_style = CaselessStrEnum(
         values=['primary', 'success', 'info', 'warning', 'danger', ''], 
         default_value='', allow_none=True, sync=True, help="""Use a
         predefined styling for the buttons.""")
 
 @register('IPython.Dropdown')
 class Dropdown(_Selection):
     """Allows you to select a single item from a dropdown."""
     _view_name = Unicode('DropdownView', sync=True)
 
     button_style = CaselessStrEnum(
         values=['primary', 'success', 'info', 'warning', 'danger', ''], 
         default_value='', allow_none=True, sync=True, help="""Use a
         predefined styling for the buttons.""")
 
 @register('IPython.RadioButtons')
 class RadioButtons(_Selection):
     """Group of radio buttons that represent an enumeration.  Only one radio
     button can be toggled at any point in time.""" 
     _view_name = Unicode('RadioButtonsView', sync=True)
     
 
 
 @register('IPython.Select')
 class Select(_Selection):
     """Listbox that only allows one item to be selected at any given time."""
     _view_name = Unicode('SelectView', sync=True)
 
 
+@register('IPython.SelectMultiple')
+class SelectMultiple(_MultipleSelection):
+    """Listbox that allows many items to be selected at any given time.
+    Despite their names, inherited from ``_Selection``, the currently chosen
+    option values, ``value``, or their labels, ``selected_labels`` must both be
+    updated with a list-like object."""
+    _view_name = Unicode('SelectMultipleView', sync=True)
+
+
 # Remove in IPython 4.0
 ToggleButtonsWidget = DeprecatedClass(ToggleButtons, 'ToggleButtonsWidget')
 DropdownWidget = DeprecatedClass(Dropdown, 'DropdownWidget')
 RadioButtonsWidget = DeprecatedClass(RadioButtons, 'RadioButtonsWidget')
 SelectWidget = DeprecatedClass(Select, 'SelectWidget')

examples/Interactive Widgets/Export As (nbconvert).ipynb

@@ -1,176 +1,176 b''
 {
  "cells": [
   {
    "cell_type": "code",
    "execution_count": null,
    "metadata": {
     "collapsed": false
    },
    "outputs": [],
    "source": [
     "# Widget related imports\n",
     "from IPython.html import widgets\n",
     "from IPython.display import display, clear_output, Javascript\n",
     "from IPython.utils.traitlets import Unicode\n",
     "\n",
     "# nbconvert related imports\n",
     "from IPython.nbconvert import get_export_names, export_by_name\n",
     "from IPython.nbconvert.writers import FilesWriter\n",
     "from IPython.nbformat import current\n",
     "from IPython.nbconvert.utils.exceptions import ConversionException"
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {},
    "source": [
     "Create a text Widget without displaying it.  The widget will be used to store the notebook's name which is otherwise only available in the front-end."
    ]
   },
   {
    "cell_type": "code",
    "execution_count": null,
    "metadata": {
     "collapsed": false
    },
    "outputs": [],
    "source": [
     "notebook_name = widgets.Text()"
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {},
    "source": [
     "Get the current notebook's name by pushing JavaScript to the browser that sets the notebook name in a string widget."
    ]
   },
   {
    "cell_type": "code",
    "execution_count": null,
    "metadata": {
     "collapsed": false
    },
    "outputs": [],
    "source": [
     "js = \"\"\"var model = IPython.notebook.kernel.widget_manager.get_model('{model_id}');\n",
     "model.set('value', IPython.notebook.notebook_name);\n",
     "model.save();\"\"\".format(model_id=notebook_name.model_id)\n",
     "display(Javascript(data=js))"
    ]
   },
   {
    "cell_type": "code",
    "execution_count": null,
    "metadata": {
     "collapsed": false
    },
    "outputs": [],
    "source": [
     "filename = notebook_name.value\n",
     "filename"
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {},
    "source": [
     "Create the widget that will allow the user to Export the current notebook."
    ]
   },
   {
    "cell_type": "code",
    "execution_count": null,
    "metadata": {
     "collapsed": false
    },
    "outputs": [],
    "source": [
-    "exporter_names = widgets.Dropdown(values=get_export_names(), value='html')\n",
+    "exporter_names = widgets.Dropdown(options=get_export_names(), value='html')\n",
     "export_button = widgets.Button(description=\"Export\")\n",
     "download_link = widgets.HTML(visible=False)"
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {},
    "source": [
     "Export the notebook when the export button is clicked."
    ]
   },
   {
    "cell_type": "code",
    "execution_count": null,
    "metadata": {
     "collapsed": false
    },
    "outputs": [],
    "source": [
     "file_writer = FilesWriter()\n",
     "\n",
     "def export(name, nb):\n",
     "    \n",
     "    # Get a unique key for the notebook and set it in the resources object.\n",
     "    notebook_name = name[:name.rfind('.')]\n",
     "    resources = {}\n",
     "    resources['unique_key'] = notebook_name\n",
     "    resources['output_files_dir'] = '%s_files' % notebook_name\n",
     "\n",
     "    # Try to export\n",
     "    try:\n",
     "        output, resources = export_by_name(exporter_names.value, nb)\n",
     "    except ConversionException as e:\n",
     "        download_link.value = \"<br>Could not export notebook!\"\n",
     "    else:\n",
     "        write_results = file_writer.write(output, resources, notebook_name=notebook_name)\n",
     "    \n",
     "        download_link.value = \"<br>Results: <a href='files/{filename}'><i>\\\"{filename}\\\"</i></a>\".format(filename=write_results)\n",
     "        download_link.visible = True\n",
     "        \n",
     "def handle_export(widget):\n",
     "    with open(filename, 'r') as f:\n",
     "        export(filename, current.read(f, 'json'))\n",
     "export_button.on_click(handle_export)"
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {},
    "source": [
     "Display the controls."
    ]
   },
   {
    "cell_type": "code",
    "execution_count": null,
    "metadata": {
     "collapsed": false
    },
    "outputs": [],
    "source": [
     "display(exporter_names, export_button, download_link)"
    ]
   }
  ],
  "metadata": {
   "kernelspec": {
    "display_name": "Python 3",
    "language": "python",
    "name": "python3"
   },
   "language_info": {
    "codemirror_mode": {
     "name": "ipython",
     "version": 3
    },
    "file_extension": ".py",
    "mimetype": "text/x-python",
    "name": "python",
    "nbconvert_exporter": "python",
    "pygments_lexer": "ipython3",
    "version": "3.4.2"
   }
  },
  "nbformat": 4,
  "nbformat_minor": 0
 }

examples/Interactive Widgets/Widget List.ipynb

@@ -1,587 +1,621 b''
 {
  "cells": [
   {
    "cell_type": "markdown",
    "metadata": {},
    "source": [
     "[Index](Index.ipynb) - [Back](Widget Basics.ipynb) - [Next](Widget Events.ipynb)"
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {},
    "source": [
     "# Widget List"
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {},
    "source": [
     "## Complete list"
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {
     "slideshow": {
      "slide_type": "slide"
     }
    },
    "source": [
     "For a complete list of the widgets available to you, you can list the classes in the widget namespace (as seen below).  `Widget` and `DOMWidget`, not listed below, are base classes."
    ]
   },
   {
    "cell_type": "code",
    "execution_count": null,
    "metadata": {
     "collapsed": false
    },
    "outputs": [],
    "source": [
     "from IPython.html import widgets\n",
     "[n for n in dir(widgets) if not n.endswith('Widget') and n[0] == n[0].upper() and not n[0] == '_']"
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {
     "slideshow": {
      "slide_type": "slide"
     }
    },
    "source": [
     "## Numeric widgets"
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {},
    "source": [
     "There are 8 widgets distributed with IPython that are designed to display numeric values.  Widgets exist for displaying integers and floats, both bounded and unbounded.  The integer widgets share a similar naming scheme to their floating point counterparts.  By replacing `Float` with `Int` in the widget name, you can find the Integer equivalent."
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {
     "slideshow": {
      "slide_type": "slide"
     }
    },
    "source": [
     "### FloatSlider"
    ]
   },
   {
    "cell_type": "code",
    "execution_count": null,
    "metadata": {
     "collapsed": false
    },
    "outputs": [],
    "source": [
     "widgets.FloatSlider(\n",
     "    value=7.5,\n",
     "    min=5.0,\n",
     "    max=10.0,\n",
     "    step=0.1,\n",
     "    description='Test:',\n",
     ")"
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {},
    "source": [
     "Sliders can also be **displayed vertically**."
    ]
   },
   {
    "cell_type": "code",
    "execution_count": null,
    "metadata": {
     "collapsed": false
    },
    "outputs": [],
    "source": [
     "widgets.FloatSlider(\n",
     "    value=7.5,\n",
     "    min=5.0,\n",
     "    max=10.0,\n",
     "    step=0.1,\n",
     "    description='Test',\n",
     "    orientation='vertical',\n",
     ")"
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {
     "slideshow": {
      "slide_type": "slide"
     }
    },
    "source": [
     "### FloatProgress"
    ]
   },
   {
    "cell_type": "code",
    "execution_count": null,
    "metadata": {
     "collapsed": false
    },
    "outputs": [],
    "source": [
     "widgets.FloatProgress(\n",
     "    value=7.5,\n",
     "    min=5.0,\n",
     "    max=10.0,\n",
     "    step=0.1,\n",
     "    description='Loading:',\n",
     ")"
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {
     "slideshow": {
      "slide_type": "slide"
     }
    },
    "source": [
     "### BoundedFloatText"
    ]
   },
   {
    "cell_type": "code",
    "execution_count": null,
    "metadata": {
     "collapsed": false
    },
    "outputs": [],
    "source": [
     "widgets.BoundedFloatText(\n",
     "    value=7.5,\n",
     "    min=5.0,\n",
     "    max=10.0,\n",
     "    description='Text:',\n",
     ")"
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {
     "slideshow": {
      "slide_type": "slide"
     }
    },
    "source": [
     "### FloatText"
    ]
   },
   {
    "cell_type": "code",
    "execution_count": null,
    "metadata": {
     "collapsed": false
    },
    "outputs": [],
    "source": [
     "widgets.FloatText(\n",
     "    value=7.5,\n",
     "    description='Any:',\n",
     ")"
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {
     "slideshow": {
      "slide_type": "slide"
     }
    },
    "source": [
     "## Boolean widgets"
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {},
    "source": [
     "There are two widgets that are designed to display a boolean value."
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {},
    "source": [
     "### ToggleButton"
    ]
   },
   {
    "cell_type": "code",
    "execution_count": null,
    "metadata": {
     "collapsed": false
    },
    "outputs": [],
    "source": [
     "widgets.ToggleButton(\n",
     "    description='Click me',\n",
     "    value=False,\n",
     ")"
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {
     "slideshow": {
      "slide_type": "slide"
     }
    },
    "source": [
     "### Checkbox"
    ]
   },
   {
    "cell_type": "code",
    "execution_count": null,
    "metadata": {
     "collapsed": false
    },
    "outputs": [],
    "source": [
     "widgets.Checkbox(\n",
     "    description='Check me',\n",
     "    value=True,\n",
     ")"
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {
     "slideshow": {
      "slide_type": "slide"
     }
    },
    "source": [
     "## Selection widgets"
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {},
    "source": [
-    "There are four widgets that can be used to display single selection lists.  All four inherit from the same base class.  You can specify the **enumeration of selectables by passing a list**.  You can **also specify the enumeration as a dictionary**, in which case the **keys will be used as the item displayed** in the list and the corresponding **value will be returned** when an item is selected."
+    "There are four widgets that can be used to display single selection lists, and one that can be used to display multiple selection lists.  All inherit from the same base class.  You can specify the **enumeration of selectable options by passing a list**.  You can **also specify the enumeration as a dictionary**, in which case the **keys will be used as the item displayed** in the list and the corresponding **value will be returned** when an item is selected."
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {
     "slideshow": {
      "slide_type": "slide"
     }
    },
    "source": [
     "### Dropdown"
    ]
   },
   {
    "cell_type": "code",
    "execution_count": null,
    "metadata": {
     "collapsed": false
    },
    "outputs": [],
    "source": [
     "from IPython.display import display\n",
     "w = widgets.Dropdown(\n",
-    "    values=['1', '2', '3'],\n",
+    "    options=['1', '2', '3'],\n",
     "    value='2',\n",
     "    description='Number:',\n",
     ")\n",
     "display(w)"
    ]
   },
   {
    "cell_type": "code",
    "execution_count": null,
    "metadata": {
     "collapsed": false
    },
    "outputs": [],
    "source": [
     "w.value"
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {},
    "source": [
     "The following is also valid:"
    ]
   },
   {
    "cell_type": "code",
    "execution_count": null,
    "metadata": {
     "collapsed": false
    },
    "outputs": [],
    "source": [
     "w = widgets.Dropdown(\n",
-    "    values={'One': 1, 'Two': 2, 'Three': 3},\n",
+    "    options={'One': 1, 'Two': 2, 'Three': 3},\n",
     "    value=2,\n",
     "    description='Number:',\n",
     ")\n",
     "display(w)"
    ]
   },
   {
    "cell_type": "code",
    "execution_count": null,
    "metadata": {
     "collapsed": false
    },
    "outputs": [],
    "source": [
     "w.value"
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {
     "slideshow": {
      "slide_type": "slide"
     }
    },
    "source": [
     "### RadioButtons"
    ]
   },
   {
    "cell_type": "code",
    "execution_count": null,
    "metadata": {
     "collapsed": false
    },
    "outputs": [],
    "source": [
     "widgets.RadioButtons(\n",
     "    description='Pizza topping:',\n",
-    "    values=['pepperoni', 'pineapple', 'anchovies'],\n",
+    "    options=['pepperoni', 'pineapple', 'anchovies'],\n",
     ")"
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {
     "slideshow": {
      "slide_type": "slide"
     }
    },
    "source": [
     "### Select"
    ]
   },
   {
    "cell_type": "code",
    "execution_count": null,
    "metadata": {
     "collapsed": false
    },
    "outputs": [],
    "source": [
     "widgets.Select(\n",
     "    description='OS:',\n",
-    "    values=['Linux', 'Windows', 'OSX'],\n",
+    "    options=['Linux', 'Windows', 'OSX'],\n",
     ")"
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {
     "slideshow": {
      "slide_type": "slide"
     }
    },
    "source": [
     "### ToggleButtons"
    ]
   },
   {
    "cell_type": "code",
    "execution_count": null,
    "metadata": {
     "collapsed": false
    },
    "outputs": [],
    "source": [
     "widgets.ToggleButtons(\n",
     "    description='Speed:',\n",
-    "    values=['Slow', 'Regular', 'Fast'],\n",
+    "    options=['Slow', 'Regular', 'Fast'],\n",
     ")"
    ]
   },
   {
    "cell_type": "markdown",
+   "metadata": {},
+   "source": [
+    "### SelectMultiple\n",
+    "Multiple values can be selected with <kbd>shift</kbd> and <kbd>ctrl</kbd> pressed and mouse clicks or arrow keys."
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "metadata": {
+    "collapsed": true
+   },
+   "outputs": [],
+   "source": [
+    "w = widgets.SelectMultiple(\n",
+    "    description=\"Fruits\",\n",
+    "    options=['Apples', 'Oranges', 'Pears']\n",
+    ")\n",
+    "display(w)"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "metadata": {
+    "collapsed": false
+   },
+   "outputs": [],
+   "source": [
+    "w.value"
+   ]
+  },
+  {
+   "cell_type": "markdown",
    "metadata": {
     "slideshow": {
      "slide_type": "slide"
     }
    },
    "source": [
     "## String widgets"
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {},
    "source": [
     "There are 4 widgets that can be used to display a string value.  Of those, the **`Text` and `Textarea` widgets accept input**.  The **`Latex` and `HTML` widgets display the string** as either Latex or HTML respectively, but **do not accept input**."
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {
     "slideshow": {
      "slide_type": "slide"
     }
    },
    "source": [
     "### Text"
    ]
   },
   {
    "cell_type": "code",
    "execution_count": null,
    "metadata": {
     "collapsed": false
    },
    "outputs": [],
    "source": [
     "widgets.Text(\n",
     "    description='String:',\n",
     "    value='Hello World',\n",
     ")"
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {},
    "source": [
     "### Textarea"
    ]
   },
   {
    "cell_type": "code",
    "execution_count": null,
    "metadata": {
     "collapsed": false
    },
    "outputs": [],
    "source": [
     "widgets.Textarea(\n",
     "    description='String:',\n",
     "    value='Hello World',\n",
     ")"
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {
     "slideshow": {
      "slide_type": "slide"
     }
    },
    "source": [
     "### Latex"
    ]
   },
   {
    "cell_type": "code",
    "execution_count": null,
    "metadata": {
     "collapsed": false
    },
    "outputs": [],
    "source": [
     "widgets.Latex(\n",
     "    value=\"$$\\\\frac{n!}{k!(n-k)!} = \\\\binom{n}{k}$$\",\n",
     ")"
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {},
    "source": [
     "### HTML"
    ]
   },
   {
    "cell_type": "code",
    "execution_count": null,
    "metadata": {
     "collapsed": false
    },
    "outputs": [],
    "source": [
     "widgets.HTML(\n",
     "    value=\"Hello <b>World</b>\"\n",
     ")"
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {
     "slideshow": {
      "slide_type": "slide"
     }
    },
    "source": [
     "## Button"
    ]
   },
   {
    "cell_type": "code",
    "execution_count": null,
    "metadata": {
     "collapsed": false
    },
    "outputs": [],
    "source": [
     "widgets.Button(description='Click me')"
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {},
    "source": [
     "[Index](Index.ipynb) - [Back](Widget Basics.ipynb) - [Next](Widget Events.ipynb)"
    ]
   }
  ],
  "metadata": {
   "kernelspec": {
    "display_name": "Python 3",
    "language": "python",
    "name": "python3"
   },
   "language_info": {
    "codemirror_mode": {
     "name": "ipython",
     "version": 3
    },
    "file_extension": ".py",
    "mimetype": "text/x-python",
    "name": "python",
    "nbconvert_exporter": "python",
    "pygments_lexer": "ipython3",
    "version": "3.4.2"
   }
  },
  "nbformat": 4,
  "nbformat_minor": 0
 }

examples/Interactive Widgets/Widget Styling.ipynb

@@ -1,585 +1,585 b''
 {
  "cells": [
   {
    "cell_type": "markdown",
    "metadata": {},
    "source": [
     "[Index](Index.ipynb) - [Back](Widget Events.ipynb) - [Next](Custom Widget - Hello World.ipynb)"
    ]
   },
   {
    "cell_type": "code",
    "execution_count": null,
    "metadata": {
     "collapsed": false
    },
    "outputs": [],
    "source": [
     "%%html\n",
     "<style>\n",
     ".example-container { background: #999999; padding: 2px; min-height: 100px; }\n",
     ".example-container.sm { min-height: 50px; }\n",
     ".example-box { background: #9999FF; width: 50px; height: 50px; text-align: center; vertical-align: middle; color: white; font-weight: bold; margin: 2px;}\n",
     ".example-box.med { width: 65px; height: 65px; }   \n",
     ".example-box.lrg { width: 80px; height: 80px; }   \n",
     "</style>"
    ]
   },
   {
    "cell_type": "code",
    "execution_count": null,
    "metadata": {
     "collapsed": false
    },
    "outputs": [],
    "source": [
     "from IPython.html import widgets\n",
     "from IPython.display import display"
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {
     "slideshow": {
      "slide_type": "slide"
     }
    },
    "source": [
     "# Widget Styling"
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {},
    "source": [
     "## Basic styling"
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {},
    "source": [
     "The widgets distributed with IPython can be styled by setting the following traits:\n",
     "\n",
     "- width  \n",
     "- height  \n",
     "- fore_color  \n",
     "- back_color  \n",
     "- border_color  \n",
     "- border_width  \n",
     "- border_style  \n",
     "- font_style  \n",
     "- font_weight  \n",
     "- font_size  \n",
     "- font_family  \n",
     "\n",
     "The example below shows how a `Button` widget can be styled:"
    ]
   },
   {
    "cell_type": "code",
    "execution_count": null,
    "metadata": {
     "collapsed": false
    },
    "outputs": [],
    "source": [
     "button = widgets.Button(\n",
     "    description='Hello World!',\n",
     "    width=100, # Integers are interpreted as pixel measurements.\n",
     "    height='2em', # em is valid HTML unit of measurement.\n",
     "    color='lime', # Colors can be set by name,\n",
     "    background_color='#0022FF', # and also by color code.\n",
     "    border_color='red')\n",
     "display(button)"
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {
     "slideshow": {
      "slide_type": "slide"
     }
    },
    "source": [
     "## Parent/child relationships"
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {},
    "source": [
     "To display widget A inside widget B, widget A must be a child of widget B.  Widgets that can contain other widgets have a **`children` attribute**.  This attribute can be **set via a keyword argument** in the widget's constructor **or after construction**.  Calling display on an **object with children automatically displays those children**, too."
    ]
   },
   {
    "cell_type": "code",
    "execution_count": null,
    "metadata": {
     "collapsed": false
    },
    "outputs": [],
    "source": [
     "from IPython.display import display\n",
     "\n",
     "float_range = widgets.FloatSlider()\n",
     "string = widgets.Text(value='hi')\n",
     "container = widgets.Box(children=[float_range, string])\n",
     "\n",
     "container.border_color = 'red'\n",
     "container.border_style = 'dotted'\n",
     "container.border_width = 3\n",
     "display(container) # Displays the `container` and all of it's children."
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {},
    "source": [
     "### After the parent is displayed"
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {
     "slideshow": {
      "slide_type": "slide"
     }
    },
    "source": [
     "Children **can be added to parents** after the parent has been displayed.  The **parent is responsible for rendering its children**."
    ]
   },
   {
    "cell_type": "code",
    "execution_count": null,
    "metadata": {
     "collapsed": false
    },
    "outputs": [],
    "source": [
     "container = widgets.Box()\n",
     "container.border_color = 'red'\n",
     "container.border_style = 'dotted'\n",
     "container.border_width = 3\n",
     "display(container)\n",
     "\n",
     "int_range = widgets.IntSlider()\n",
     "container.children=[int_range]"
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {
     "slideshow": {
      "slide_type": "slide"
     }
    },
    "source": [
     "## Fancy boxes"
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {},
    "source": [
     "If you need to display a more complicated set of widgets, there are **specialized containers** that you can use.  To display **multiple sets of widgets**, you can use an **`Accordion` or a `Tab` in combination with one `Box` per set of widgets** (as seen below).  The \"pages\" of these widgets are their children.  To set the titles of the pages, one can **call `set_title`**."
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {},
    "source": [
     "### Accordion"
    ]
   },
   {
    "cell_type": "code",
    "execution_count": null,
    "metadata": {
     "collapsed": false
    },
    "outputs": [],
    "source": [
     "name1 = widgets.Text(description='Location:')\n",
     "zip1 = widgets.BoundedIntText(description='Zip:', min=0, max=99999)\n",
     "page1 = widgets.Box(children=[name1, zip1])\n",
     "\n",
     "name2 = widgets.Text(description='Location:')\n",
     "zip2 = widgets.BoundedIntText(description='Zip:', min=0, max=99999)\n",
     "page2 = widgets.Box(children=[name2, zip2])\n",
     "\n",
     "accord = widgets.Accordion(children=[page1, page2])\n",
     "display(accord)\n",
     "\n",
     "accord.set_title(0, 'From')\n",
     "accord.set_title(1, 'To')"
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {
     "slideshow": {
      "slide_type": "slide"
     }
    },
    "source": [
     "### TabWidget"
    ]
   },
   {
    "cell_type": "code",
    "execution_count": null,
    "metadata": {
     "collapsed": false
    },
    "outputs": [],
    "source": [
     "name = widgets.Text(description='Name:')\n",
-    "color = widgets.Dropdown(description='Color:', values=['red', 'orange', 'yellow', 'green', 'blue', 'indigo', 'violet'])\n",
+    "color = widgets.Dropdown(description='Color:', options=['red', 'orange', 'yellow', 'green', 'blue', 'indigo', 'violet'])\n",
     "page1 = widgets.Box(children=[name, color])\n",
     "\n",
     "age = widgets.IntSlider(description='Age:', min=0, max=120, value=50)\n",
-    "gender = widgets.RadioButtons(description='Gender:', values=['male', 'female'])\n",
+    "gender = widgets.RadioButtons(description='Gender:', options=['male', 'female'])\n",
     "page2 = widgets.Box(children=[age, gender])\n",
     "\n",
     "tabs = widgets.Tab(children=[page1, page2])\n",
     "display(tabs)\n",
     "\n",
     "tabs.set_title(0, 'Name')\n",
     "tabs.set_title(1, 'Details')"
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {
     "slideshow": {
      "slide_type": "slide"
     }
    },
    "source": [
     "# Alignment"
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {},
    "source": [
     "Most widgets have a **`description` attribute**, which allows a label for the widget to be defined.\n",
     "The label of the widget **has a fixed minimum width**.\n",
     "The text of the label is **always right aligned and the widget is left aligned**:"
    ]
   },
   {
    "cell_type": "code",
    "execution_count": null,
    "metadata": {
     "collapsed": false
    },
    "outputs": [],
    "source": [
     "display(widgets.Text(description=\"a:\"))\n",
     "display(widgets.Text(description=\"aa:\"))\n",
     "display(widgets.Text(description=\"aaa:\"))"
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {
     "slideshow": {
      "slide_type": "slide"
     }
    },
    "source": [
     "If a **label is longer** than the minimum width, the **widget is shifted to the right**:"
    ]
   },
   {
    "cell_type": "code",
    "execution_count": null,
    "metadata": {
     "collapsed": false
    },
    "outputs": [],
    "source": [
     "display(widgets.Text(description=\"a:\"))\n",
     "display(widgets.Text(description=\"aa:\"))\n",
     "display(widgets.Text(description=\"aaa:\"))\n",
     "display(widgets.Text(description=\"aaaaaaaaaaaaaaaaaa:\"))"
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {
     "slideshow": {
      "slide_type": "slide"
     }
    },
    "source": [
     "If a `description` is **not set** for the widget, the **label is not displayed**:"
    ]
   },
   {
    "cell_type": "code",
    "execution_count": null,
    "metadata": {
     "collapsed": false
    },
    "outputs": [],
    "source": [
     "display(widgets.Text(description=\"a:\"))\n",
     "display(widgets.Text(description=\"aa:\"))\n",
     "display(widgets.Text(description=\"aaa:\"))\n",
     "display(widgets.Text())"
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {
     "slideshow": {
      "slide_type": "slide"
     }
    },
    "source": [
     "## Flex boxes"
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {},
    "source": [
     "Widgets can be aligned using the `FlexBox`, `HBox`, and `VBox` widgets."
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {
     "slideshow": {
      "slide_type": "slide"
     }
    },
    "source": [
     "### Application to widgets"
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {},
    "source": [
     "Widgets display vertically by default:"
    ]
   },
   {
    "cell_type": "code",
    "execution_count": null,
    "metadata": {
     "collapsed": false
    },
    "outputs": [],
    "source": [
     "buttons = [widgets.Button(description=str(i)) for i in range(3)]\n",
     "display(*buttons)"
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {
     "slideshow": {
      "slide_type": "slide"
     }
    },
    "source": [
     "### Using hbox"
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {},
    "source": [
     "To make widgets display horizontally, you need to **child them to a `HBox` widget**."
    ]
   },
   {
    "cell_type": "code",
    "execution_count": null,
    "metadata": {
     "collapsed": false
    },
    "outputs": [],
    "source": [
     "container = widgets.HBox(children=buttons)\n",
     "display(container)"
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {},
    "source": [
     "By setting the width of the container to 100% and its `pack` to `center`, you can center the buttons."
    ]
   },
   {
    "cell_type": "code",
    "execution_count": null,
    "metadata": {
     "collapsed": false
    },
    "outputs": [],
    "source": [
     "container.width = '100%'\n",
     "container.pack = 'center'"
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {
     "slideshow": {
      "slide_type": "slide"
     }
    },
    "source": [
     "## Visibility"
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {},
    "source": [
     "Sometimes it is necessary to **hide or show widgets** in place, **without having to re-display** the widget.\n",
     "The `visible` property of widgets can be used to hide or show **widgets that have already been displayed** (as seen below).  The `visible` property can be:\n",
     "* `True` - the widget is displayed\n",
     "* `False` - the widget is hidden, and the empty space where the widget would be is collapsed\n",
     "* `None` - the widget is hidden, and the empty space where the widget would be is shown"
    ]
   },
   {
    "cell_type": "code",
    "execution_count": null,
    "metadata": {
     "collapsed": false
    },
    "outputs": [],
    "source": [
     "w1 = widgets.Latex(value=\"First line\")\n",
     "w2 = widgets.Latex(value=\"Second line\")\n",
     "w3 = widgets.Latex(value=\"Third line\")\n",
     "display(w1, w2, w3)"
    ]
   },
   {
    "cell_type": "code",
    "execution_count": null,
    "metadata": {
     "collapsed": true
    },
    "outputs": [],
    "source": [
     "w2.visible=None"
    ]
   },
   {
    "cell_type": "code",
    "execution_count": null,
    "metadata": {
     "collapsed": false
    },
    "outputs": [],
    "source": [
     "w2.visible=False"
    ]
   },
   {
    "cell_type": "code",
    "execution_count": null,
    "metadata": {
     "collapsed": false
    },
    "outputs": [],
    "source": [
     "w2.visible=True"
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {
     "slideshow": {
      "slide_type": "slide"
     }
    },
    "source": [
     "### Another example"
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {},
    "source": [
     "In the example below, a form is rendered, which conditionally displays widgets depending on the state of other widgets.  Try toggling the student checkbox."
    ]
   },
   {
    "cell_type": "code",
    "execution_count": null,
    "metadata": {
     "collapsed": false
    },
    "outputs": [],
    "source": [
     "form = widgets.VBox()\n",
     "first = widgets.Text(description=\"First Name:\")\n",
     "last = widgets.Text(description=\"Last Name:\")\n",
     "\n",
     "student = widgets.Checkbox(description=\"Student:\", value=False)\n",
     "school_info = widgets.VBox(visible=False, children=[\n",
     "    widgets.Text(description=\"School:\"),\n",
     "    widgets.IntText(description=\"Grade:\", min=0, max=12)\n",
     "    ])\n",
     "\n",
     "pet = widgets.Text(description=\"Pet's Name:\")\n",
     "form.children = [first, last, student, school_info, pet]\n",
     "display(form)\n",
     "\n",
     "def on_student_toggle(name, value):\n",
     "    if value:\n",
     "        school_info.visible = True\n",
     "    else:\n",
     "        school_info.visible = False\n",
     "student.on_trait_change(on_student_toggle, 'value')\n"
    ]
   },
   {
    "cell_type": "markdown",
    "metadata": {},
    "source": [
     "[Index](Index.ipynb) - [Back](Widget Events.ipynb) - [Next](Custom Widget - Hello World.ipynb)"
    ]
   }
  ],
  "metadata": {
   "cell_tags": [
    [
     "<None>",
     null
    ]
   ],
   "kernelspec": {
    "display_name": "Python 3",
    "language": "python",
    "name": "python3"
   },
   "language_info": {
    "codemirror_mode": {
     "name": "ipython",
     "version": 3
    },
    "file_extension": ".py",
    "mimetype": "text/x-python",
    "name": "python",
    "nbconvert_exporter": "python",
    "pygments_lexer": "ipython3",
    "version": "3.4.2"
   }
  },
  "nbformat": 4,
  "nbformat_minor": 0
 }