##// END OF EJS Templates
add locks to update everywhere by using options to pass this...
Jonathan Frederic -
Show More
@@ -33,13 +33,11 b' define(["notebook/js/widgets/widget"], function(widget_manager){'
33 this.$checkbox = $('<input />')
33 this.$checkbox = $('<input />')
34 .attr('type', 'checkbox')
34 .attr('type', 'checkbox')
35 .click(function(el) {
35 .click(function(el) {
36 that.user_invoked_update = true;
37
36
38 // Calling model.set will trigger all of the other views of the
37 // Calling model.set will trigger all of the other views of the
39 // model to update.
38 // model to update.
40 that.model.set('value', that.$checkbox.prop('checked'));
39 that.model.set('value', that.$checkbox.prop('checked'), {updated_view: this});
41 that.touch();
40 that.touch();
42 that.user_invoked_update = false;
43 })
41 })
44 .appendTo(this.$el);
42 .appendTo(this.$el);
45
43
@@ -47,12 +45,12 b' define(["notebook/js/widgets/widget"], function(widget_manager){'
47 this.update(); // Set defaults.
45 this.update(); // Set defaults.
48 },
46 },
49
47
50 update : function(){
48 update : function(options){
51 // Update the contents of this view
49 // Update the contents of this view
52 //
50 //
53 // Called when the model is changed. The model may have been
51 // Called when the model is changed. The model may have been
54 // changed by another view or by a state update from the back-end.
52 // changed by another view or by a state update from the back-end.
55 if (!this.user_invoked_update) {
53 if (options === undefined || options.updated_view != this) {
56 this.$checkbox.prop('checked', this.model.get('value'));
54 this.$checkbox.prop('checked', this.model.get('value'));
57
55
58 var disabled = this.model.get('disabled');
56 var disabled = this.model.get('disabled');
@@ -89,12 +87,12 b' define(["notebook/js/widgets/widget"], function(widget_manager){'
89 this.update(); // Set defaults.
87 this.update(); // Set defaults.
90 },
88 },
91
89
92 update : function(){
90 update : function(options){
93 // Update the contents of this view
91 // Update the contents of this view
94 //
92 //
95 // Called when the model is changed. The model may have been
93 // Called when the model is changed. The model may have been
96 // changed by another view or by a state update from the back-end.
94 // changed by another view or by a state update from the back-end.
97 if (!this.user_invoked_update) {
95 if (options === undefined || options.updated_view != this) {
98 if (this.model.get('value')) {
96 if (this.model.get('value')) {
99 this.$button.addClass('active');
97 this.$button.addClass('active');
100 } else {
98 } else {
@@ -118,13 +116,11 b' define(["notebook/js/widgets/widget"], function(widget_manager){'
118
116
119 // Handles and validates user input.
117 // Handles and validates user input.
120 handleClick: function(e) {
118 handleClick: function(e) {
121 this.user_invoked_update = true;
119
122
123 // Calling model.set will trigger all of the other views of the
120 // Calling model.set will trigger all of the other views of the
124 // model to update.
121 // model to update.
125 this.model.set('value', ! $(e.target).hasClass('active'));
122 this.model.set('value', ! $(e.target).hasClass('active'), {updated_view: this});
126 this.touch();
123 this.touch();
127 this.user_invoked_update = false;
128 },
124 },
129 });
125 });
130
126
@@ -44,66 +44,68 b' define(["notebook/js/widgets/widget"], function(widget_manager){'
44 this.update();
44 this.update();
45 },
45 },
46
46
47 update : function(){
47 update : function(options){
48 // Update the contents of this view
48 // Update the contents of this view
49 //
49 //
50 // Called when the model is changed. The model may have been
50 // Called when the model is changed. The model may have been
51 // changed by another view or by a state update from the back-end.
51 // changed by another view or by a state update from the back-end.
52
52
53 if (options === undefined || options.updated_view != this) {
53 // Slider related keys.
54 // Slider related keys.
54 var _keys = ['step', 'max', 'min', 'disabled'];
55 var _keys = ['step', 'max', 'min', 'disabled'];
55 for (var index in _keys) {
56 for (var index in _keys) {
56 var key = _keys[index];
57 var key = _keys[index];
57 if (this.model.get(key) !== undefined) {
58 if (this.model.get(key) !== undefined) {
58 this.$slider.slider("option", key, this.model.get(key));
59 this.$slider.slider("option", key, this.model.get(key));
60 }
59 }
61 }
60 }
61
62
62 // WORKAROUND FOR JQUERY SLIDER BUG.
63 // WORKAROUND FOR JQUERY SLIDER BUG.
63 // The horizontal position of the slider handle
64 // The horizontal position of the slider handle
64 // depends on the value of the slider at the time
65 // depends on the value of the slider at the time
65 // of orientation change. Before applying the new
66 // of orientation change. Before applying the new
66 // workaround, we set the value to the minimum to
67 // workaround, we set the value to the minimum to
67 // make sure that the horizontal placement of the
68 // make sure that the horizontal placement of the
68 // handle in the vertical slider is always
69 // handle in the vertical slider is always
69 // consistent.
70 // consistent.
70 var orientation = this.model.get('orientation');
71 var orientation = this.model.get('orientation');
71 var value = this.model.get('min');
72 var value = this.model.get('min');
72 this.$slider.slider('option', 'value', value);
73 this.$slider.slider('option', 'value', value);
73 this.$slider.slider('option', 'orientation', orientation);
74 this.$slider.slider('option', 'orientation', orientation);
74 value = this.model.get('value');
75 value = this.model.get('value');
75 this.$slider.slider('option', 'value', value);
76 this.$slider.slider('option', 'value', value);
76
77
77 // Use the right CSS classes for vertical & horizontal sliders
78 // Use the right CSS classes for vertical & horizontal sliders
78 if (orientation=='vertical') {
79 if (orientation=='vertical') {
79 this.$slider_container
80 this.$slider_container
80 .removeClass('widget-hslider')
81 .removeClass('widget-hslider')
81 .addClass('widget-vslider');
82 .addClass('widget-vslider');
82 this.$el
83 this.$el
83 .removeClass('widget-hbox-single')
84 .removeClass('widget-hbox-single')
84 .addClass('widget-vbox-single');
85 .addClass('widget-vbox-single');
85 this.$label
86 this.$label
86 .removeClass('widget-hlabel')
87 .removeClass('widget-hlabel')
87 .addClass('widget-vlabel');
88 .addClass('widget-vlabel');
88
89
89 } else {
90 } else {
90 this.$slider_container
91 this.$slider_container
91 .removeClass('widget-vslider')
92 .removeClass('widget-vslider')
92 .addClass('widget-hslider');
93 .addClass('widget-hslider');
93 this.$el
94 this.$el
94 .removeClass('widget-vbox-single')
95 .removeClass('widget-vbox-single')
95 .addClass('widget-hbox-single');
96 .addClass('widget-hbox-single');
96 this.$label
97 this.$label
97 .removeClass('widget-vlabel')
98 .removeClass('widget-vlabel')
98 .addClass('widget-hlabel');
99 .addClass('widget-hlabel');
99 }
100 }
100
101
101 var description = this.model.get('description');
102 var description = this.model.get('description');
102 if (description.length === 0) {
103 if (description.length === 0) {
103 this.$label.hide();
104 this.$label.hide();
104 } else {
105 } else {
105 this.$label.html(description);
106 this.$label.html(description);
106 this.$label.show();
107 this.$label.show();
108 }
107 }
109 }
108 return IPython.DOMWidgetView.prototype.update.call(this);
110 return IPython.DOMWidgetView.prototype.update.call(this);
109 },
111 },
@@ -114,7 +116,7 b' define(["notebook/js/widgets/widget"], function(widget_manager){'
114
116
115 // Calling model.set will trigger all of the other views of the
117 // Calling model.set will trigger all of the other views of the
116 // model to update.
118 // model to update.
117 this.model.set('value', ui.value);
119 this.model.set('value', ui.value, {updated_view: this});
118 this.touch();
120 this.touch();
119 },
121 },
120 });
122 });
@@ -141,29 +143,31 b' define(["notebook/js/widgets/widget"], function(widget_manager){'
141 this.update(); // Set defaults.
143 this.update(); // Set defaults.
142 },
144 },
143
145
144 update : function(){
146 update : function(options){
145 // Update the contents of this view
147 // Update the contents of this view
146 //
148 //
147 // Called when the model is changed. The model may have been
149 // Called when the model is changed. The model may have been
148 // changed by another view or by a state update from the back-end.
150 // changed by another view or by a state update from the back-end.
149
151
150 var value = this.model.get('value');
152 if (options === undefined || options.updated_view != this) {
151 if (!this.changing && parseFloat(this.$textbox.val()) != value) {
153 var value = this.model.get('value');
152 this.$textbox.val(value);
154 if (parseFloat(this.$textbox.val()) != value) {
153 }
155 this.$textbox.val(value);
154
156 }
155 if (this.model.get('disabled')) {
157
156 this.$textbox.attr('disabled','disabled');
158 if (this.model.get('disabled')) {
157 } else {
159 this.$textbox.attr('disabled','disabled');
158 this.$textbox.removeAttr('disabled');
160 } else {
159 }
161 this.$textbox.removeAttr('disabled');
162 }
160
163
161 var description = this.model.get('description');
164 var description = this.model.get('description');
162 if (description.length === 0) {
165 if (description.length === 0) {
163 this.$label.hide();
166 this.$label.hide();
164 } else {
167 } else {
165 this.$label.html(description);
168 this.$label.html(description);
166 this.$label.show();
169 this.$label.show();
170 }
167 }
171 }
168 return IPython.DOMWidgetView.prototype.update.call(this);
172 return IPython.DOMWidgetView.prototype.update.call(this);
169 },
173 },
@@ -196,13 +200,11 b' define(["notebook/js/widgets/widget"], function(widget_manager){'
196
200
197 // Apply the value if it has changed.
201 // Apply the value if it has changed.
198 if (numericalValue != this.model.get('value')) {
202 if (numericalValue != this.model.get('value')) {
199 this.changing = true;
200
203
201 // Calling model.set will trigger all of the other views of the
204 // Calling model.set will trigger all of the other views of the
202 // model to update.
205 // model to update.
203 this.model.set('value', numericalValue);
206 this.model.set('value', numericalValue, {updated_view: this});
204 this.touch();
207 this.touch();
205 this.changing = false;
206 }
208 }
207 }
209 }
208 },
210 },
@@ -44,66 +44,67 b' define(["notebook/js/widgets/widget"], function(widget_manager){'
44 this.update();
44 this.update();
45 },
45 },
46
46
47 update : function(){
47 update : function(options){
48 // Update the contents of this view
48 // Update the contents of this view
49 //
49 //
50 // Called when the model is changed. The model may have been
50 // Called when the model is changed. The model may have been
51 // changed by another view or by a state update from the back-end.
51 // changed by another view or by a state update from the back-end.
52
52 if (options === undefined || options.updated_view != this) {
53 // Slider related keys.
53 // Slider related keys.
54 var _keys = ['step', 'max', 'min', 'disabled'];
54 var _keys = ['step', 'max', 'min', 'disabled'];
55 for (var index in _keys) {
55 for (var index in _keys) {
56 var key = _keys[index];
56 var key = _keys[index];
57 if (this.model.get(key) !== undefined) {
57 if (this.model.get(key) !== undefined) {
58 this.$slider.slider("option", key, this.model.get(key));
58 this.$slider.slider("option", key, this.model.get(key));
59 }
59 }
60 }
60 }
61
61
62 // WORKAROUND FOR JQUERY SLIDER BUG.
62 // WORKAROUND FOR JQUERY SLIDER BUG.
63 // The horizontal position of the slider handle
63 // The horizontal position of the slider handle
64 // depends on the value of the slider at the time
64 // depends on the value of the slider at the time
65 // of orientation change. Before applying the new
65 // of orientation change. Before applying the new
66 // workaround, we set the value to the minimum to
66 // workaround, we set the value to the minimum to
67 // make sure that the horizontal placement of the
67 // make sure that the horizontal placement of the
68 // handle in the vertical slider is always
68 // handle in the vertical slider is always
69 // consistent.
69 // consistent.
70 var orientation = this.model.get('orientation');
70 var orientation = this.model.get('orientation');
71 var value = this.model.get('min');
71 var value = this.model.get('min');
72 this.$slider.slider('option', 'value', value);
72 this.$slider.slider('option', 'value', value);
73 this.$slider.slider('option', 'orientation', orientation);
73 this.$slider.slider('option', 'orientation', orientation);
74 value = this.model.get('value');
74 value = this.model.get('value');
75 this.$slider.slider('option', 'value', value);
75 this.$slider.slider('option', 'value', value);
76
76
77 // Use the right CSS classes for vertical & horizontal sliders
77 // Use the right CSS classes for vertical & horizontal sliders
78 if (orientation=='vertical') {
78 if (orientation=='vertical') {
79 this.$slider_container
79 this.$slider_container
80 .removeClass('widget-hslider')
80 .removeClass('widget-hslider')
81 .addClass('widget-vslider');
81 .addClass('widget-vslider');
82 this.$el
82 this.$el
83 .removeClass('widget-hbox-single')
83 .removeClass('widget-hbox-single')
84 .addClass('widget-vbox-single');
84 .addClass('widget-vbox-single');
85 this.$label
85 this.$label
86 .removeClass('widget-hlabel')
86 .removeClass('widget-hlabel')
87 .addClass('widget-vlabel');
87 .addClass('widget-vlabel');
88
88
89 } else {
89 } else {
90 this.$slider_container
90 this.$slider_container
91 .removeClass('widget-vslider')
91 .removeClass('widget-vslider')
92 .addClass('widget-hslider');
92 .addClass('widget-hslider');
93 this.$el
93 this.$el
94 .removeClass('widget-vbox-single')
94 .removeClass('widget-vbox-single')
95 .addClass('widget-hbox-single');
95 .addClass('widget-hbox-single');
96 this.$label
96 this.$label
97 .removeClass('widget-vlabel')
97 .removeClass('widget-vlabel')
98 .addClass('widget-hlabel');
98 .addClass('widget-hlabel');
99 }
99 }
100
100
101 var description = this.model.get('description');
101 var description = this.model.get('description');
102 if (description.length === 0) {
102 if (description.length === 0) {
103 this.$label.hide();
103 this.$label.hide();
104 } else {
104 } else {
105 this.$label.html(description);
105 this.$label.html(description);
106 this.$label.show();
106 this.$label.show();
107 }
107 }
108 }
108 return IPython.DOMWidgetView.prototype.update.call(this);
109 return IPython.DOMWidgetView.prototype.update.call(this);
109 },
110 },
@@ -114,7 +115,7 b' define(["notebook/js/widgets/widget"], function(widget_manager){'
114
115
115 // Calling model.set will trigger all of the other views of the
116 // Calling model.set will trigger all of the other views of the
116 // model to update.
117 // model to update.
117 this.model.set('value', ~~ui.value); // Double bit-wise not to truncate decimel
118 this.model.set('value', ~~ui.value, {updated_view: this}); // Double bit-wise not to truncate decimel
118 this.touch();
119 this.touch();
119 },
120 },
120 });
121 });
@@ -140,29 +141,30 b' define(["notebook/js/widgets/widget"], function(widget_manager){'
140 this.update(); // Set defaults.
141 this.update(); // Set defaults.
141 },
142 },
142
143
143 update : function(){
144 update : function(options){
144 // Update the contents of this view
145 // Update the contents of this view
145 //
146 //
146 // Called when the model is changed. The model may have been
147 // Called when the model is changed. The model may have been
147 // changed by another view or by a state update from the back-end.
148 // changed by another view or by a state update from the back-end.
149 if (options === undefined || options.updated_view != this) {
150 var value = this.model.get('value');
151 if (parseInt(this.$textbox.val()) != value) {
152 this.$textbox.val(value);
153 }
154
155 if (this.model.get('disabled')) {
156 this.$textbox.attr('disabled','disabled');
157 } else {
158 this.$textbox.removeAttr('disabled');
159 }
148
160
149 var value = this.model.get('value');
161 var description = this.model.get('description');
150 if (!this.changing && parseInt(this.$textbox.val()) != value) {
162 if (description.length === 0) {
151 this.$textbox.val(value);
163 this.$label.hide();
152 }
164 } else {
153
165 this.$label.html(description);
154 if (this.model.get('disabled')) {
166 this.$label.show();
155 this.$textbox.attr('disabled','disabled');
167 }
156 } else {
157 this.$textbox.removeAttr('disabled');
158 }
159
160 var description = this.model.get('description');
161 if (description.length === 0) {
162 this.$label.hide();
163 } else {
164 this.$label.html(description);
165 this.$label.show();
166 }
168 }
167 return IPython.DOMWidgetView.prototype.update.call(this);
169 return IPython.DOMWidgetView.prototype.update.call(this);
168 },
170 },
@@ -195,13 +197,11 b' define(["notebook/js/widgets/widget"], function(widget_manager){'
195
197
196 // Apply the value if it has changed.
198 // Apply the value if it has changed.
197 if (numericalValue != this.model.get('value')) {
199 if (numericalValue != this.model.get('value')) {
198 this.changing = true;
199
200
200 // Calling model.set will trigger all of the other views of the
201 // Calling model.set will trigger all of the other views of the
201 // model to update.
202 // model to update.
202 this.model.set('value', numericalValue);
203 this.model.set('value', numericalValue, {updated_view: this});
203 this.touch();
204 this.touch();
204 this.changing = false;
205 }
205 }
206 }
206 }
207 },
207 },
@@ -44,38 +44,39 b' define(["notebook/js/widgets/widget"], function(widget_manager){'
44 },
44 },
45
45
46
46
47 update: function() {
47 update: function(options) {
48 // Update the contents of this view
48 // Update the contents of this view
49 //
49 //
50 // Called when the model is changed. The model may have been
50 // Called when the model is changed. The model may have been
51 // changed by another view or by a state update from the back-end.
51 // changed by another view or by a state update from the back-end.
52
52
53 // Set tab titles
53 if (options === undefined || options.updated_view != this) {
54 var titles = this.model.get('_titles');
54 // Set tab titles
55 for (var page_index in titles) {
55 var titles = this.model.get('_titles');
56
56 for (var page_index in titles) {
57 var accordian = this.containers[page_index];
57
58 if (accordian !== undefined) {
58 var accordian = this.containers[page_index];
59 accordian
59 if (accordian !== undefined) {
60 .find('.accordion-heading')
60 accordian
61 .find('.accordion-toggle')
61 .find('.accordion-heading')
62 .html(titles[page_index]);
62 .find('.accordion-toggle')
63 .html(titles[page_index]);
64 }
63 }
65 }
64 }
65
66
66 // Set selected page
67 // Set selected page
67 var selected_index = this.model.get("selected_index");
68 var selected_index = this.model.get("selected_index");
68 if (0 <= selected_index && selected_index < this.containers.length) {
69 if (0 <= selected_index && selected_index < this.containers.length) {
69 for (var index in this.containers) {
70 for (var index in this.containers) {
70 if (index==selected_index) {
71 if (index==selected_index) {
71 this.containers[index].find('.accordion-body').collapse('show');
72 this.containers[index].find('.accordion-body').collapse('show');
72 } else {
73 } else {
73 this.containers[index].find('.accordion-body').collapse('hide');
74 this.containers[index].find('.accordion-body').collapse('hide');
75 }
76
74 }
77 }
75
76 }
78 }
77 }
79 }
78
79 return IPython.DOMWidgetView.prototype.update.call(this);
80 return IPython.DOMWidgetView.prototype.update.call(this);
80 },
81 },
81
82
@@ -99,7 +100,7 b' define(["notebook/js/widgets/widget"], function(widget_manager){'
99
100
100 // Calling model.set will trigger all of the other views of the
101 // Calling model.set will trigger all of the other views of the
101 // model to update.
102 // model to update.
102 that.model.set("selected_index", index);
103 that.model.set("selected_index", index, {updated_view: this});
103 that.touch();
104 that.touch();
104 })
105 })
105 .html('Page ' + index)
106 .html('Page ' + index)
@@ -160,26 +161,26 b' define(["notebook/js/widgets/widget"], function(widget_manager){'
160 }, this)
161 }, this)
161 },
162 },
162
163
163 update: function() {
164 update: function(options) {
164 // Update the contents of this view
165 // Update the contents of this view
165 //
166 //
166 // Called when the model is changed. The model may have been
167 // Called when the model is changed. The model may have been
167 // changed by another view or by a state update from the back-end.
168 // changed by another view or by a state update from the back-end.
168
169 if (options === undefined || options.updated_view != this) {
169 // Set tab titles
170 // Set tab titles
170 var titles = this.model.get('_titles');
171 var titles = this.model.get('_titles');
171 for (var page_index in titles) {
172 for (var page_index in titles) {
172 var tab_text = this.containers[page_index];
173 var tab_text = this.containers[page_index];
173 if (tab_text !== undefined) {
174 if (tab_text !== undefined) {
174 tab_text.html(titles[page_index]);
175 tab_text.html(titles[page_index]);
176 }
175 }
177 }
176 }
177
178
178 var selected_index = this.model.get('selected_index');
179 var selected_index = this.model.get('selected_index');
179 if (0 <= selected_index && selected_index < this.containers.length) {
180 if (0 <= selected_index && selected_index < this.containers.length) {
180 this.select_page(selected_index);
181 this.select_page(selected_index);
182 }
181 }
183 }
182
183 return IPython.DOMWidgetView.prototype.update.call(this);
184 return IPython.DOMWidgetView.prototype.update.call(this);
184 },
185 },
185
186
@@ -200,7 +201,7 b' define(["notebook/js/widgets/widget"], function(widget_manager){'
200
201
201 // Calling model.set will trigger all of the other views of the
202 // Calling model.set will trigger all of the other views of the
202 // model to update.
203 // model to update.
203 that.model.set("selected_index", index);
204 that.model.set("selected_index", index, {updated_view: this});
204 that.touch();
205 that.touch();
205 that.select_page(index);
206 that.select_page(index);
206 });
207 });
@@ -55,49 +55,51 b' define(["notebook/js/widgets/widget"], function(widget_manager){'
55 this.update();
55 this.update();
56 },
56 },
57
57
58 update : function(){
58 update : function(options){
59 // Update the contents of this view
59 // Update the contents of this view
60 //
60 //
61 // Called when the model is changed. The model may have been
61 // Called when the model is changed. The model may have been
62 // changed by another view or by a state update from the back-end.
62 // changed by another view or by a state update from the back-end.
63
63
64 var selected_item_text = this.model.get('value');
64 if (options === undefined || options.updated_view != this) {
65 selected_item_text = selected_item_text.replace(/ /g, '&nbsp;');
65 var selected_item_text = this.model.get('value');
66 selected_item_text = selected_item_text.replace(/\n/g, '<br>\n');
66 selected_item_text = selected_item_text.replace(/ /g, '&nbsp;');
67 if (selected_item_text.length === 0) {
67 selected_item_text = selected_item_text.replace(/\n/g, '<br>\n');
68 this.$droplabel.html('&nbsp;');
68 if (selected_item_text.length === 0) {
69 } else {
69 this.$droplabel.html('&nbsp;');
70 this.$droplabel.html(selected_item_text);
70 } else {
71 }
71 this.$droplabel.html(selected_item_text);
72
72 }
73 var items = this.model.get('values');
73
74 this.$droplist.html('');
74 var items = this.model.get('values');
75 for (var index in items) {
75 this.$droplist.html('');
76 var that = this;
76 for (var index in items) {
77 var item_button = $('<a href="#"/>')
77 var that = this;
78 .html(items[index])
78 var item_button = $('<a href="#"/>')
79 .on('click', $.proxy(this.handle_click, this));
79 .html(items[index])
80 this.$droplist.append($('<li />').append(item_button));
80 .on('click', $.proxy(this.handle_click, this));
81 }
81 this.$droplist.append($('<li />').append(item_button));
82
82 }
83 if (this.model.get('disabled')) {
83
84 this.$buttongroup.attr('disabled','disabled');
84 if (this.model.get('disabled')) {
85 this.$droplabel.attr('disabled','disabled');
85 this.$buttongroup.attr('disabled','disabled');
86 this.$dropbutton.attr('disabled','disabled');
86 this.$droplabel.attr('disabled','disabled');
87 this.$droplist.attr('disabled','disabled');
87 this.$dropbutton.attr('disabled','disabled');
88 } else {
88 this.$droplist.attr('disabled','disabled');
89 this.$buttongroup.removeAttr('disabled');
89 } else {
90 this.$droplabel.removeAttr('disabled');
90 this.$buttongroup.removeAttr('disabled');
91 this.$dropbutton.removeAttr('disabled');
91 this.$droplabel.removeAttr('disabled');
92 this.$droplist.removeAttr('disabled');
92 this.$dropbutton.removeAttr('disabled');
93 }
93 this.$droplist.removeAttr('disabled');
94 }
94
95
95 var description = this.model.get('description');
96 var description = this.model.get('description');
96 if (description.length === 0) {
97 if (description.length === 0) {
97 this.$label.hide();
98 this.$label.hide();
98 } else {
99 } else {
99 this.$label.html(description);
100 this.$label.html(description);
100 this.$label.show();
101 this.$label.show();
102 }
101 }
103 }
102 return IPython.DOMWidgetView.prototype.update.call(this);
104 return IPython.DOMWidgetView.prototype.update.call(this);
103 },
105 },
@@ -107,7 +109,7 b' define(["notebook/js/widgets/widget"], function(widget_manager){'
107
109
108 // Calling model.set will trigger all of the other views of the
110 // Calling model.set will trigger all of the other views of the
109 // model to update.
111 // model to update.
110 this.model.set('value', $(e.target).html(), this);
112 this.model.set('value', $(e.target).html(), {updated_view: this});
111 this.touch();
113 this.touch();
112 },
114 },
113
115
@@ -134,62 +136,63 b' define(["notebook/js/widgets/widget"], function(widget_manager){'
134 this.update();
136 this.update();
135 },
137 },
136
138
137 update : function(){
139 update : function(options){
138 // Update the contents of this view
140 // Update the contents of this view
139 //
141 //
140 // Called when the model is changed. The model may have been
142 // Called when the model is changed. The model may have been
141 // changed by another view or by a state update from the back-end.
143 // changed by another view or by a state update from the back-end.
142
144 if (options === undefined || options.updated_view != this) {
143 // Add missing items to the DOM.
145 // Add missing items to the DOM.
144 var items = this.model.get('values');
146 var items = this.model.get('values');
145 var disabled = this.model.get('disabled');
147 var disabled = this.model.get('disabled');
146 for (var index in items) {
147 var item_query = ' :input[value="' + items[index] + '"]';
148 if (this.$el.find(item_query).length === 0) {
149 var $label = $('<label />')
150 .addClass('radio')
151 .html(items[index])
152 .appendTo(this.$container);
153
154 $('<input />')
155 .attr('type', 'radio')
156 .addClass(this.model)
157 .val(items[index])
158 .prependTo($label)
159 .on('click', $.proxy(this.handle_click, this));
160 }
161
162 var $item_element = this.$container.find(item_query);
163 if (this.model.get('value') == items[index]) {
164 $item_element.prop('checked', true);
165 } else {
166 $item_element.prop('checked', false);
167 }
168 $item_element.prop('disabled', disabled);
169 }
170
171 // Remove items that no longer exist.
172 this.$container.find('input').each(function(i, obj) {
173 var value = $(obj).val();
174 var found = false;
175 for (var index in items) {
148 for (var index in items) {
176 if (items[index] == value) {
149 var item_query = ' :input[value="' + items[index] + '"]';
177 found = true;
150 if (this.$el.find(item_query).length === 0) {
178 break;
151 var $label = $('<label />')
152 .addClass('radio')
153 .html(items[index])
154 .appendTo(this.$container);
155
156 $('<input />')
157 .attr('type', 'radio')
158 .addClass(this.model)
159 .val(items[index])
160 .prependTo($label)
161 .on('click', $.proxy(this.handle_click, this));
162 }
163
164 var $item_element = this.$container.find(item_query);
165 if (this.model.get('value') == items[index]) {
166 $item_element.prop('checked', true);
167 } else {
168 $item_element.prop('checked', false);
179 }
169 }
170 $item_element.prop('disabled', disabled);
180 }
171 }
181
172
182 if (!found) {
173 // Remove items that no longer exist.
183 $(obj).parent().remove();
174 this.$container.find('input').each(function(i, obj) {
184 }
175 var value = $(obj).val();
185 });
176 var found = false;
177 for (var index in items) {
178 if (items[index] == value) {
179 found = true;
180 break;
181 }
182 }
183
184 if (!found) {
185 $(obj).parent().remove();
186 }
187 });
186
188
187 var description = this.model.get('description');
189 var description = this.model.get('description');
188 if (description.length === 0) {
190 if (description.length === 0) {
189 this.$label.hide();
191 this.$label.hide();
190 } else {
192 } else {
191 this.$label.html(description);
193 this.$label.html(description);
192 this.$label.show();
194 this.$label.show();
195 }
193 }
196 }
194 return IPython.DOMWidgetView.prototype.update.call(this);
197 return IPython.DOMWidgetView.prototype.update.call(this);
195 },
198 },
@@ -199,7 +202,7 b' define(["notebook/js/widgets/widget"], function(widget_manager){'
199
202
200 // Calling model.set will trigger all of the other views of the
203 // Calling model.set will trigger all of the other views of the
201 // model to update.
204 // model to update.
202 this.model.set('value', $(e.target).val(), this);
205 this.model.set('value', $(e.target).val(), {updated_view: this});
203 this.touch();
206 this.touch();
204 },
207 },
205 });
208 });
@@ -226,57 +229,58 b' define(["notebook/js/widgets/widget"], function(widget_manager){'
226 this.update();
229 this.update();
227 },
230 },
228
231
229 update : function(){
232 update : function(options){
230 // Update the contents of this view
233 // Update the contents of this view
231 //
234 //
232 // Called when the model is changed. The model may have been
235 // Called when the model is changed. The model may have been
233 // changed by another view or by a state update from the back-end.
236 // changed by another view or by a state update from the back-end.
234
237 if (options === undefined || options.updated_view != this) {
235 // Add missing items to the DOM.
238 // Add missing items to the DOM.
236 var items = this.model.get('values');
239 var items = this.model.get('values');
237 var disabled = this.model.get('disabled');
240 var disabled = this.model.get('disabled');
238 for (var index in items) {
239 var item_query = ' :contains("' + items[index] + '")';
240 if (this.$buttongroup.find(item_query).length === 0) {
241 $('<button />')
242 .attr('type', 'button')
243 .addClass('btn')
244 .html(items[index])
245 .appendTo(this.$buttongroup)
246 .on('click', $.proxy(this.handle_click, this));
247 }
248
249 var $item_element = this.$buttongroup.find(item_query);
250 if (this.model.get('value') == items[index]) {
251 $item_element.addClass('active');
252 } else {
253 $item_element.removeClass('active');
254 }
255 $item_element.prop('disabled', disabled);
256 }
257
258 // Remove items that no longer exist.
259 this.$buttongroup.find('button').each(function(i, obj) {
260 var value = $(obj).html();
261 var found = false;
262 for (var index in items) {
241 for (var index in items) {
263 if (items[index] == value) {
242 var item_query = ' :contains("' + items[index] + '")';
264 found = true;
243 if (this.$buttongroup.find(item_query).length === 0) {
265 break;
244 $('<button />')
245 .attr('type', 'button')
246 .addClass('btn')
247 .html(items[index])
248 .appendTo(this.$buttongroup)
249 .on('click', $.proxy(this.handle_click, this));
250 }
251
252 var $item_element = this.$buttongroup.find(item_query);
253 if (this.model.get('value') == items[index]) {
254 $item_element.addClass('active');
255 } else {
256 $item_element.removeClass('active');
266 }
257 }
258 $item_element.prop('disabled', disabled);
267 }
259 }
268
260
269 if (!found) {
261 // Remove items that no longer exist.
270 $(obj).remove();
262 this.$buttongroup.find('button').each(function(i, obj) {
271 }
263 var value = $(obj).html();
272 });
264 var found = false;
265 for (var index in items) {
266 if (items[index] == value) {
267 found = true;
268 break;
269 }
270 }
271
272 if (!found) {
273 $(obj).remove();
274 }
275 });
273
276
274 var description = this.model.get('description');
277 var description = this.model.get('description');
275 if (description.length === 0) {
278 if (description.length === 0) {
276 this.$label.hide();
279 this.$label.hide();
277 } else {
280 } else {
278 this.$label.html(description);
281 this.$label.html(description);
279 this.$label.show();
282 this.$label.show();
283 }
280 }
284 }
281 return IPython.DOMWidgetView.prototype.update.call(this);
285 return IPython.DOMWidgetView.prototype.update.call(this);
282 },
286 },
@@ -286,7 +290,7 b' define(["notebook/js/widgets/widget"], function(widget_manager){'
286
290
287 // Calling model.set will trigger all of the other views of the
291 // Calling model.set will trigger all of the other views of the
288 // model to update.
292 // model to update.
289 this.model.set('value', $(e.target).html(), this);
293 this.model.set('value', $(e.target).html(), {updated_view: this});
290 this.touch();
294 this.touch();
291 },
295 },
292
296
@@ -313,54 +317,55 b' define(["notebook/js/widgets/widget"], function(widget_manager){'
313 this.update();
317 this.update();
314 },
318 },
315
319
316 update : function(){
320 update : function(options){
317 // Update the contents of this view
321 // Update the contents of this view
318 //
322 //
319 // Called when the model is changed. The model may have been
323 // Called when the model is changed. The model may have been
320 // changed by another view or by a state update from the back-end.
324 // changed by another view or by a state update from the back-end.
321
325 if (options === undefined || options.updated_view != this) {
322 // Add missing items to the DOM.
326 // Add missing items to the DOM.
323 var items = this.model.get('values');
327 var items = this.model.get('values');
324 for (var index in items) {
325 var item_query = ' :contains("' + items[index] + '")';
326 if (this.$listbox.find(item_query).length === 0) {
327 $('<option />')
328 .html(items[index])
329 .attr('value', items[index])
330 .appendTo(this.$listbox)
331 .on('click', $.proxy(this.handle_click, this));
332 }
333 }
334
335 // Select the correct element
336 this.$listbox.val(this.model.get('value'));
337
338 // Disable listbox if needed
339 var disabled = this.model.get('disabled');
340 this.$listbox.prop('disabled', disabled);
341
342 // Remove items that no longer exist.
343 this.$listbox.find('option').each(function(i, obj) {
344 var value = $(obj).html();
345 var found = false;
346 for (var index in items) {
328 for (var index in items) {
347 if (items[index] == value) {
329 var item_query = ' :contains("' + items[index] + '")';
348 found = true;
330 if (this.$listbox.find(item_query).length === 0) {
349 break;
331 $('<option />')
332 .html(items[index])
333 .attr('value', items[index])
334 .appendTo(this.$listbox)
335 .on('click', $.proxy(this.handle_click, this));
350 }
336 }
351 }
337 }
338
339 // Select the correct element
340 this.$listbox.val(this.model.get('value'));
352
341
353 if (!found) {
342 // Disable listbox if needed
354 $(obj).remove();
343 var disabled = this.model.get('disabled');
355 }
344 this.$listbox.prop('disabled', disabled);
356 });
345
346 // Remove items that no longer exist.
347 this.$listbox.find('option').each(function(i, obj) {
348 var value = $(obj).html();
349 var found = false;
350 for (var index in items) {
351 if (items[index] == value) {
352 found = true;
353 break;
354 }
355 }
356
357 if (!found) {
358 $(obj).remove();
359 }
360 });
357
361
358 var description = this.model.get('description');
362 var description = this.model.get('description');
359 if (description.length === 0) {
363 if (description.length === 0) {
360 this.$label.hide();
364 this.$label.hide();
361 } else {
365 } else {
362 this.$label.html(description);
366 this.$label.html(description);
363 this.$label.show();
367 this.$label.show();
368 }
364 }
369 }
365 return IPython.DOMWidgetView.prototype.update.call(this);
370 return IPython.DOMWidgetView.prototype.update.call(this);
366 },
371 },
@@ -370,7 +375,7 b' define(["notebook/js/widgets/widget"], function(widget_manager){'
370
375
371 // Calling model.set will trigger all of the other views of the
376 // Calling model.set will trigger all of the other views of the
372 // model to update.
377 // model to update.
373 this.model.set('value', $(e.target).html(), this);
378 this.model.set('value', $(e.target).html(), {updated_view: this});
374 this.touch();
379 this.touch();
375 },
380 },
376
381
@@ -95,24 +95,24 b' define(["notebook/js/widgets/widget"], function(widget_manager){'
95 },
95 },
96
96
97
97
98 update: function(){
98 update: function(options){
99 // Update the contents of this view
99 // Update the contents of this view
100 //
100 //
101 // Called when the model is changed. The model may have been
101 // Called when the model is changed. The model may have been
102 // changed by another view or by a state update from the back-end.
102 // changed by another view or by a state update from the back-end.
103 if (!this.user_invoked_update) {
103 if (options === undefined || options.updated_view != this) {
104 this.$textbox.val(this.model.get('value'));
104 this.$textbox.val(this.model.get('value'));
105 }
106
105
107 var disabled = this.model.get('disabled');
106 var disabled = this.model.get('disabled');
108 this.$textbox.prop('disabled', disabled);
107 this.$textbox.prop('disabled', disabled);
109
108
110 var description = this.model.get('description');
109 var description = this.model.get('description');
111 if (description.length === 0) {
110 if (description.length === 0) {
112 this.$label.hide();
111 this.$label.hide();
113 } else {
112 } else {
114 this.$label.html(description);
113 this.$label.html(description);
115 this.$label.show();
114 this.$label.show();
115 }
116 }
116 }
117 return IPython.DOMWidgetView.prototype.update.call(this);
117 return IPython.DOMWidgetView.prototype.update.call(this);
118 },
118 },
@@ -123,13 +123,11 b' define(["notebook/js/widgets/widget"], function(widget_manager){'
123
123
124 // Handles and validates user input.
124 // Handles and validates user input.
125 handleChanging: function(e) {
125 handleChanging: function(e) {
126 this.user_invoked_update = true;
127
126
128 // Calling model.set will trigger all of the other views of the
127 // Calling model.set will trigger all of the other views of the
129 // model to update.
128 // model to update.
130 this.model.set('value', e.target.value);
129 this.model.set('value', e.target.value, {updated_view: this});
131 this.touch();
130 this.touch();
132 this.user_invoked_update = false;
133 },
131 },
134 });
132 });
135
133
@@ -154,24 +152,26 b' define(["notebook/js/widgets/widget"], function(widget_manager){'
154 this.update(); // Set defaults.
152 this.update(); // Set defaults.
155 },
153 },
156
154
157 update: function(){
155 update: function(options){
158 // Update the contents of this view
156 // Update the contents of this view
159 //
157 //
160 // Called when the model is changed. The model may have been
158 // Called when the model is changed. The model may have been
161 // changed by another view or by a state update from the back-end.
159 // changed by another view or by a state update from the back-end.
162 if (this.$textbox.val() != this.model.get('value')) {
160 if (options === undefined || options.updated_view != this) {
163 this.$textbox.val(this.model.get('value'));
161 if (this.$textbox.val() != this.model.get('value')) {
164 }
162 this.$textbox.val(this.model.get('value'));
165
163 }
166 var disabled = this.model.get('disabled');
164
167 this.$textbox.prop('disabled', disabled);
165 var disabled = this.model.get('disabled');
168
166 this.$textbox.prop('disabled', disabled);
169 var description = this.model.get('description');
167
170 if (description.length === 0) {
168 var description = this.model.get('description');
171 this.$label.hide();
169 if (description.length === 0) {
172 } else {
170 this.$label.hide();
173 this.$label.html(description);
171 } else {
174 this.$label.show();
172 this.$label.html(description);
173 this.$label.show();
174 }
175 }
175 }
176 return IPython.DOMWidgetView.prototype.update.call(this);
176 return IPython.DOMWidgetView.prototype.update.call(this);
177 },
177 },
@@ -186,7 +186,7 b' define(["notebook/js/widgets/widget"], function(widget_manager){'
186
186
187 // Calling model.set will trigger all of the other views of the
187 // Calling model.set will trigger all of the other views of the
188 // model to update.
188 // model to update.
189 this.model.set('value', e.target.value);
189 this.model.set('value', e.target.value, {updated_view: this});
190 this.touch();
190 this.touch();
191 },
191 },
192
192
General Comments 0
You need to be logged in to leave comments. Login now