/** * @class YAHOO.ext.SplitLayoutRegion * @extends YAHOO.ext.LayoutRegion * Adds a splitbar and other (private) useful functionality to a LayoutRegion */ YAHOO.ext.SplitLayoutRegion = function(mgr, config, pos, cursor){ this.cursor = cursor; YAHOO.ext.SplitLayoutRegion.superclass.constructor.call(this, mgr, config, pos); if(config.split){ this.hide(); } }; YAHOO.extendX(YAHOO.ext.SplitLayoutRegion, YAHOO.ext.LayoutRegion, { applyConfig : function(config){ YAHOO.ext.SplitLayoutRegion.superclass.applyConfig.call(this, config); if(config.split){ if(!this.split){ var splitEl = YAHOO.ext.DomHelper.append(this.mgr.el.dom, {tag: 'div', id: this.el.id + '-split', cls: 'ylayout-split ylayout-split-'+this.position, html: ' '}); /** The SplitBar for this region @type YAHOO.ext.SplitBar */ this.split = new YAHOO.ext.SplitBar(splitEl, this.el); this.split.onMoved.subscribe(this.onSplitMove, this, true); this.split.useShim = config.useShim === true; YAHOO.util.Dom.setStyle([this.split.el.dom, this.split.proxy], 'cursor', this.cursor); this.split.getMaximumSize = this.getMaxSize.createDelegate(this); } if(typeof config.minSize != 'undefined'){ this.split.minSize = config.minSize; } if(typeof config.maxSize != 'undefined'){ this.split.maxSize = config.maxSize; } } }, getMaxSize : function(){ var cmax = this.config.maxSize || 10000; var center = this.mgr.getRegion('center'); return Math.min(cmax, (this.el.getWidth()+center.getEl().getWidth())-center.getMinWidth()); }, onSplitMove : function(split, newSize){ this.fireEvent('resized', this, newSize); }, /** * Returns the SplitBar for this region. * @return {YAHOO.ext.SplitBar} */ getSplitBar : function(){ return this.split; }, hide : function(){ if(this.split){ this.split.el.setLocation(-2000,-2000); this.split.el.hide(); } YAHOO.ext.SplitLayoutRegion.superclass.hide.call(this); }, show : function(){ if(this.split){ this.split.el.show(); } YAHOO.ext.SplitLayoutRegion.superclass.show.call(this); }, beforeSlide: function(){ if(YAHOO.ext.util.Browser.isGecko){// firefox overflow auto bug workaround this.bodyEl.clip(); if(this.tabs) this.tabs.bodyEl.clip(); if(this.activePanel){ this.activePanel.getEl().clip(); if(this.activePanel.beforeSlide){ this.activePanel.beforeSlide(); } } } }, afterSlide : function(){ if(YAHOO.ext.util.Browser.isGecko){// firefox overflow auto bug workaround this.bodyEl.unclip(); if(this.tabs) this.tabs.bodyEl.unclip(); if(this.activePanel){ this.activePanel.getEl().unclip(); if(this.activePanel.afterSlide){ this.activePanel.afterSlide(); } } } }, slideOut : function(){ if(!this.slideEl){ this.slideEl = new YAHOO.ext.Actor( YAHOO.ext.DomHelper.append(this.mgr.el.dom, {tag: 'div', cls:'ylayout-slider'})); if(this.config.autoHide !== false){ var slideInTask = new YAHOO.ext.util.DelayedTask(this.slideIn, this); this.slideEl.mon('mouseout', function(e){ var to = e.getRelatedTarget(); if(to && to != this.slideEl.dom && !YAHOO.util.Dom.isAncestor(this.slideEl.dom, to)){ slideInTask.delay(500); } }, this, true); this.slideEl.mon('mouseover', function(e){ slideInTask.cancel(); }, this, true); } } var sl = this.slideEl, c = this.collapsedEl, cm = this.cmargins; this.isSlid = true; this.snapshot = { 'left': this.el.getLeft(true), 'top': this.el.getTop(true), 'colbtn': this.collapseBtn.isVisible(), 'closebtn': this.closeBtn.isVisible() }; this.collapseBtn.hide(); this.closeBtn.hide(); this.el.show(); this.el.setLeftTop(0,0); sl.startCapture(true); var size; switch(this.position){ case 'west': sl.setLeft(c.getRight(true)); sl.setTop(c.getTop(true)); size = this.el.getWidth(); break; case 'east': sl.setRight(this.mgr.getViewSize().width-c.getLeft(true)); sl.setTop(c.getTop(true)); size = this.el.getWidth(); break; case 'north': sl.setLeft(c.getLeft(true)); sl.setTop(c.getBottom(true)); size = this.el.getHeight(); break; case 'south': sl.setLeft(c.getLeft(true)); sl.setBottom(this.mgr.getViewSize().height-c.getTop(true)); size = this.el.getHeight(); break; } sl.dom.appendChild(this.el.dom); YAHOO.util.Event.on(document.body, 'click', this.slideInIf, this, true); sl.setSize(this.el.getWidth(), this.el.getHeight()); this.beforeSlide(); if(this.activePanel){ this.activePanel.setSize(this.bodyEl.getWidth(), this.bodyEl.getHeight()); } sl.slideShow(this.getAnchor(), size, this.slideDuration, null, false); sl.play(function(){ this.afterSlide(); }.createDelegate(this)); }, slideInIf : function(e){ var t = YAHOO.util.Event.getTarget(e); if(!YAHOO.util.Dom.isAncestor(this.el.dom, t)){ this.slideIn(); } }, slideIn : function(callback){ if(this.isSlid && !this.slideEl.playlist.isPlaying()){ YAHOO.util.Event.removeListener(document.body, 'click', this.slideInIf, this, true); this.slideEl.startCapture(true); this.slideEl.slideHide(this.getAnchor(), this.slideDuration, null); this.beforeSlide(); this.slideEl.play(function(){ this.isSlid = false; this.el.setPositioning(this.snapshot); this.collapseBtn.setVisible(this.snapshot.colbtn); this.closeBtn.setVisible(this.snapshot.closebtn); this.afterSlide(); this.mgr.el.dom.appendChild(this.el.dom); if(typeof callback == 'function'){ callback(); } }.createDelegate(this)); } }, animateExpand : function(){ var em = this.margins, cm = this.cmargins; var c = this.collapsedEl, el = this.el; var direction, distance; switch(this.position){ case 'west': direction = 'right'; el.setLeft(-(el.getWidth() + (em.right+em.left))); el.setTop(c.getTop(true)-cm.top+em.top); distance = el.getWidth() + (em.right+em.left); break; case 'east': direction = 'left'; el.setLeft(this.mgr.getViewSize().width + em.left); el.setTop(c.getTop(true)-cm.top+em.top); distance = el.getWidth() + (em.right+em.left); break; case 'north': direction = 'down'; el.setLeft(em.left); el.setTop(-(el.getHeight() + (em.top+em.bottom))); distance = el.getHeight() + (em.top+em.bottom); break; case 'south': direction = 'up'; el.setLeft(em.left); el.setTop(this.mgr.getViewSize().height + em.top); distance = el.getHeight() + (em.top+em.bottom); break; } this.beforeSlide(); el.setStyle('z-index', '100'); el.show(); c.setLocation(-2000,-2000); c.hide(); el.move(direction, distance, true, this.duration, function(){ this.afterSlide(); el.setStyle('z-index', ''); if(this.split){ this.split.el.show(); } this.fireEvent('invalidated', this); this.fireEvent('expanded', this); }.createDelegate(this), this.config.easing || YAHOO.util.Easing.easeOut); }, animateCollapse : function(){ var em = this.margins, cm = this.cmargins; var c = this.collapsedEl, el = this.el; var direction, distance; switch(this.position){ case 'west': direction = 'left'; distance = el.getWidth() + (em.right+em.left); break; case 'east': direction = 'right'; distance = el.getWidth() + (em.right+em.left); break; case 'north': direction = 'up'; distance = el.getHeight() + (em.top+em.bottom); break; case 'south': direction = 'down'; distance = el.getHeight() + (em.top+em.bottom); break; } this.el.setStyle('z-index', '100'); this.beforeSlide(); this.el.move(direction, distance, true, this.duration, function(){ this.afterSlide(); this.el.setStyle('z-index', ''); this.el.setLocation(-20000,-20000); this.el.hide(); this.collapsedEl.show(); this.fireEvent('collapsed', this); }.createDelegate(this), YAHOO.util.Easing.easeIn); }, getAnchor : function(){ switch(this.position){ case 'west': return 'left'; case 'east': return 'right'; case 'north': return 'top'; case 'south': return 'bottom'; } } });