1 jls.loader.provide('jls.gui.CardLayout'); 2 3 jls.loader.require('jls.gui.Layout'); 4 jls.loader.require('jls.gui.FlowLayout'); 5 6 /** 7 * @augments jls.gui.Layout 8 * @class This class represents a card layout. The children can have the same size and only one is visible. 9 */ 10 jls.gui.CardLayout = jls.lang.Class.create(jls.gui.Layout, 11 { 12 initialize : function($super, element) { 13 this._selectedIndex = 0; 14 $super(element); 15 }, 16 /*onCreate : function() { 17 var childCount = this._element.getChildCount(); 18 for (var i = 0; i < childCount; i++) { 19 var child = this._element.getChild(i); 20 child.getStyle().setProperty('visibility', i == this._selectedIndex ? 'visible' : 'hidden'); 21 } 22 },*/ 23 show : function(index) { 24 //jls.logger.warn('show(' + index + ')'); 25 if (this._selectedIndex >= 0) { 26 this._element.getChild(this._selectedIndex).getStyle().setProperty('visibility', 'hidden'); 27 } 28 this._selectedIndex = index; 29 this._element.getChild(this._selectedIndex).getStyle().setProperty('visibility', 'visible'); 30 }, 31 onUpdate : function() { 32 var cSize = this._element.getClientSize(); 33 var cWidth = cSize[0]; 34 var cHeight = cSize[1]; 35 var cStyle = this._element.getStyle(); 36 var hGap = cStyle.getPropertyValue('hGap') || 0; 37 var vGap = cStyle.getPropertyValue('vGap') || 0; 38 // TODO Only resize the selected child? 39 var childCount = this._element.getChildCount(); 40 for (var i = 0; i < childCount; i++) { 41 var child = this._element.getChild(i); 42 //child.getStyle().setProperty('visibility', i == this._selectedIndex ? 'visible' : 'hidden'); 43 jls.gui.FlowLayout.place(child, hGap, vGap, cWidth - hGap * 2, cHeight - vGap * 2); 44 } 45 }, 46 onAddChild : function($super, child) { 47 /*if (child.getStyle().getPropertyValue('visibility') == 'visible') { 48 this.show(this._element.getChildCount() - 1); 49 //this._selectedIndex = this._element.getChildCount() - 1; 50 }*/ 51 child.getStyle().setProperty('visibility', ((this._element.getChildCount() - 1) == this._selectedIndex) ? 'visible' : 'hidden'); 52 $super(child); 53 } 54 }); 55