Moved flexible box model attrs out of Container and Modal js

into a common function
This commit is contained in:
Jonathan Frederic 2013-11-25 15:03:01 -08:00 committed by Jonathan Frederic
parent 8b08e1c53c
commit 1fb4340503

View File

@ -15,6 +15,35 @@
**/
define(["notebook/js/widget"], function(widget_manager) {
var set_flex_property = function(element, property_name, enabled) {
if (enabled) {
element.addClass(property_name);
} else {
element.removeClass(property_name);
}
};
var set_flex_properties = function(context, element) {
// Apply flexible box model properties by adding and removing
// corrosponding CSS classes.
// Defined in IPython/html/static/base/less/flexbox.less
set_flex_property(element, 'vbox', context.model.get('_vbox'));
set_flex_property(element, 'hbox', context.model.get('_hbox'));
set_flex_property(element, 'start', context.model.get('_pack_start'));
set_flex_property(element, 'center', context.model.get('_pack_center'));
set_flex_property(element, 'end', context.model.get('_pack_end'));
set_flex_property(element, 'align-start', context.model.get('_align_start'));
set_flex_property(element, 'align-center', context.model.get('_align_center'));
set_flex_property(element, 'align-end', context.model.get('_align_end'));
set_flex_property(element, 'box-flex0', context.model.get('_flex0'));
set_flex_property(element, 'box-flex1', context.model.get('_flex1'));
set_flex_property(element, 'box-flex2', context.model.get('_flex2'));
};
var ContainerModel = IPython.WidgetModel.extend({});
widget_manager.register_widget_model('ContainerWidgetModel', ContainerModel);
@ -26,33 +55,10 @@ define(["notebook/js/widget"], function(widget_manager) {
},
update: function(){
// Apply flexible box model properties by adding and removing
// corrosponding CSS classes.
// Defined in IPython/html/static/base/less/flexbox.less
this.set_flex_property('vbox', this.model.get('_vbox'));
this.set_flex_property('hbox', this.model.get('_hbox'));
this.set_flex_property('start', this.model.get('_pack_start'));
this.set_flex_property('center', this.model.get('_pack_center'));
this.set_flex_property('end', this.model.get('_pack_end'));
this.set_flex_property('align-start', this.model.get('_align_start'));
this.set_flex_property('align-center', this.model.get('_align_center'));
this.set_flex_property('align-end', this.model.get('_align_end'));
this.set_flex_property('box-flex0', this.model.get('_flex0'));
this.set_flex_property('box-flex1', this.model.get('_flex1'));
this.set_flex_property('box-flex2', this.model.get('_flex2'));
set_flex_properties(this, this.$el);
return IPython.WidgetView.prototype.update.call(this);
},
set_flex_property: function(property_name, enabled) {
if (enabled) {
this.$el.addClass(property_name);
} else {
this.$el.removeClass(property_name);
}
},
display_child: function(view) {
this.$el.append(view.$el);
},
@ -127,21 +133,7 @@ define(["notebook/js/widget"], function(widget_manager) {
},
update: function(){
// Apply flexible box model properties by adding and removing
// corrosponding CSS classes.
// Defined in IPython/html/static/base/less/flexbox.less
this.set_flex_property('vbox', this.model.get('_vbox'));
this.set_flex_property('hbox', this.model.get('_hbox'));
this.set_flex_property('start', this.model.get('_pack_start'));
this.set_flex_property('center', this.model.get('_pack_center'));
this.set_flex_property('end', this.model.get('_pack_end'));
this.set_flex_property('align-start', this.model.get('_align_start'));
this.set_flex_property('align-center', this.model.get('_align_center'));
this.set_flex_property('align-end', this.model.get('_align_end'));
this.set_flex_property('box-flex0', this.model.get('_flex0'));
this.set_flex_property('box-flex1', this.model.get('_flex1'));
this.set_flex_property('box-flex2', this.model.get('_flex2'));
set_flex_properties(this, this.$body);
var description = this.model.get('description');
description = description.replace(/ /g, ' ', 'm');
@ -169,14 +161,6 @@ define(["notebook/js/widget"], function(widget_manager) {
return IPython.WidgetView.prototype.update.call(this);
},
set_flex_property: function(property_name, enabled) {
if (enabled) {
this.$body.addClass(property_name);
} else {
this.$body.removeClass(property_name);
}
},
display_child: function(view) {
this.$body.append(view.$el);
},