Show More
@@ -15,6 +15,35 b'' | |||||
15 | **/ |
|
15 | **/ | |
16 |
|
16 | |||
17 | define(["notebook/js/widget"], function(widget_manager) { |
|
17 | define(["notebook/js/widget"], function(widget_manager) { | |
|
18 | ||||
|
19 | var set_flex_property = function(element, property_name, enabled) { | |||
|
20 | if (enabled) { | |||
|
21 | element.addClass(property_name); | |||
|
22 | } else { | |||
|
23 | element.removeClass(property_name); | |||
|
24 | } | |||
|
25 | }; | |||
|
26 | ||||
|
27 | var set_flex_properties = function(context, element) { | |||
|
28 | ||||
|
29 | // Apply flexible box model properties by adding and removing | |||
|
30 | // corrosponding CSS classes. | |||
|
31 | // Defined in IPython/html/static/base/less/flexbox.less | |||
|
32 | set_flex_property(element, 'vbox', context.model.get('_vbox')); | |||
|
33 | set_flex_property(element, 'hbox', context.model.get('_hbox')); | |||
|
34 | set_flex_property(element, 'start', context.model.get('_pack_start')); | |||
|
35 | set_flex_property(element, 'center', context.model.get('_pack_center')); | |||
|
36 | set_flex_property(element, 'end', context.model.get('_pack_end')); | |||
|
37 | set_flex_property(element, 'align-start', context.model.get('_align_start')); | |||
|
38 | set_flex_property(element, 'align-center', context.model.get('_align_center')); | |||
|
39 | set_flex_property(element, 'align-end', context.model.get('_align_end')); | |||
|
40 | set_flex_property(element, 'box-flex0', context.model.get('_flex0')); | |||
|
41 | set_flex_property(element, 'box-flex1', context.model.get('_flex1')); | |||
|
42 | set_flex_property(element, 'box-flex2', context.model.get('_flex2')); | |||
|
43 | }; | |||
|
44 | ||||
|
45 | ||||
|
46 | ||||
18 | var ContainerModel = IPython.WidgetModel.extend({}); |
|
47 | var ContainerModel = IPython.WidgetModel.extend({}); | |
19 | widget_manager.register_widget_model('ContainerWidgetModel', ContainerModel); |
|
48 | widget_manager.register_widget_model('ContainerWidgetModel', ContainerModel); | |
20 |
|
49 | |||
@@ -26,33 +55,10 b' define(["notebook/js/widget"], function(widget_manager) {' | |||||
26 | }, |
|
55 | }, | |
27 |
|
56 | |||
28 | update: function(){ |
|
57 | update: function(){ | |
29 |
|
58 | set_flex_properties(this, this.$el); | ||
30 | // Apply flexible box model properties by adding and removing |
|
|||
31 | // corrosponding CSS classes. |
|
|||
32 | // Defined in IPython/html/static/base/less/flexbox.less |
|
|||
33 | this.set_flex_property('vbox', this.model.get('_vbox')); |
|
|||
34 | this.set_flex_property('hbox', this.model.get('_hbox')); |
|
|||
35 | this.set_flex_property('start', this.model.get('_pack_start')); |
|
|||
36 | this.set_flex_property('center', this.model.get('_pack_center')); |
|
|||
37 | this.set_flex_property('end', this.model.get('_pack_end')); |
|
|||
38 | this.set_flex_property('align-start', this.model.get('_align_start')); |
|
|||
39 | this.set_flex_property('align-center', this.model.get('_align_center')); |
|
|||
40 | this.set_flex_property('align-end', this.model.get('_align_end')); |
|
|||
41 | this.set_flex_property('box-flex0', this.model.get('_flex0')); |
|
|||
42 | this.set_flex_property('box-flex1', this.model.get('_flex1')); |
|
|||
43 | this.set_flex_property('box-flex2', this.model.get('_flex2')); |
|
|||
44 |
|
||||
45 | return IPython.WidgetView.prototype.update.call(this); |
|
59 | return IPython.WidgetView.prototype.update.call(this); | |
46 | }, |
|
60 | }, | |
47 |
|
61 | |||
48 | set_flex_property: function(property_name, enabled) { |
|
|||
49 | if (enabled) { |
|
|||
50 | this.$el.addClass(property_name); |
|
|||
51 | } else { |
|
|||
52 | this.$el.removeClass(property_name); |
|
|||
53 | } |
|
|||
54 | }, |
|
|||
55 |
|
||||
56 | display_child: function(view) { |
|
62 | display_child: function(view) { | |
57 | this.$el.append(view.$el); |
|
63 | this.$el.append(view.$el); | |
58 | }, |
|
64 | }, | |
@@ -127,21 +133,7 b' define(["notebook/js/widget"], function(widget_manager) {' | |||||
127 | }, |
|
133 | }, | |
128 |
|
134 | |||
129 | update: function(){ |
|
135 | update: function(){ | |
130 |
|
136 | set_flex_properties(this, this.$body); | ||
131 | // Apply flexible box model properties by adding and removing |
|
|||
132 | // corrosponding CSS classes. |
|
|||
133 | // Defined in IPython/html/static/base/less/flexbox.less |
|
|||
134 | this.set_flex_property('vbox', this.model.get('_vbox')); |
|
|||
135 | this.set_flex_property('hbox', this.model.get('_hbox')); |
|
|||
136 | this.set_flex_property('start', this.model.get('_pack_start')); |
|
|||
137 | this.set_flex_property('center', this.model.get('_pack_center')); |
|
|||
138 | this.set_flex_property('end', this.model.get('_pack_end')); |
|
|||
139 | this.set_flex_property('align-start', this.model.get('_align_start')); |
|
|||
140 | this.set_flex_property('align-center', this.model.get('_align_center')); |
|
|||
141 | this.set_flex_property('align-end', this.model.get('_align_end')); |
|
|||
142 | this.set_flex_property('box-flex0', this.model.get('_flex0')); |
|
|||
143 | this.set_flex_property('box-flex1', this.model.get('_flex1')); |
|
|||
144 | this.set_flex_property('box-flex2', this.model.get('_flex2')); |
|
|||
145 |
|
137 | |||
146 | var description = this.model.get('description'); |
|
138 | var description = this.model.get('description'); | |
147 | description = description.replace(/ /g, ' ', 'm'); |
|
139 | description = description.replace(/ /g, ' ', 'm'); | |
@@ -169,14 +161,6 b' define(["notebook/js/widget"], function(widget_manager) {' | |||||
169 | return IPython.WidgetView.prototype.update.call(this); |
|
161 | return IPython.WidgetView.prototype.update.call(this); | |
170 | }, |
|
162 | }, | |
171 |
|
163 | |||
172 | set_flex_property: function(property_name, enabled) { |
|
|||
173 | if (enabled) { |
|
|||
174 | this.$body.addClass(property_name); |
|
|||
175 | } else { |
|
|||
176 | this.$body.removeClass(property_name); |
|
|||
177 | } |
|
|||
178 | }, |
|
|||
179 |
|
||||
180 | display_child: function(view) { |
|
164 | display_child: function(view) { | |
181 | this.$body.append(view.$el); |
|
165 | this.$body.append(view.$el); | |
182 | }, |
|
166 | }, |
General Comments 0
You need to be logged in to leave comments.
Login now