diff options
author | Andrew Dolgov <[email protected]> | 2011-11-08 20:40:44 +0400 |
---|---|---|
committer | Andrew Dolgov <[email protected]> | 2011-11-08 20:40:44 +0400 |
commit | 81bea17aefb26859f825b9293c7c99192874806e (patch) | |
tree | fb244408ca271affa2899adb634788802c9a89d8 /lib/dijit/layout/_TabContainerBase.js | |
parent | 870a70e109ac9e80a88047044530de53d0404ec7 (diff) |
upgrade Dojo to 1.6.1
Diffstat (limited to 'lib/dijit/layout/_TabContainerBase.js')
-rw-r--r-- | lib/dijit/layout/_TabContainerBase.js | 193 |
1 files changed, 135 insertions, 58 deletions
diff --git a/lib/dijit/layout/_TabContainerBase.js b/lib/dijit/layout/_TabContainerBase.js index 0ba42ec35..5e07cb653 100644 --- a/lib/dijit/layout/_TabContainerBase.js +++ b/lib/dijit/layout/_TabContainerBase.js @@ -1,68 +1,145 @@ /* - Copyright (c) 2004-2010, The Dojo Foundation All Rights Reserved. + Copyright (c) 2004-2011, The Dojo Foundation All Rights Reserved. Available via Academic Free License >= 2.1 OR the modified BSD license. see: http://dojotoolkit.org/license for details */ -if(!dojo._hasResource["dijit.layout._TabContainerBase"]){ -dojo._hasResource["dijit.layout._TabContainerBase"]=true; +if(!dojo._hasResource["dijit.layout._TabContainerBase"]){ //_hasResource checks added by build. Do not use _hasResource directly in your code. +dojo._hasResource["dijit.layout._TabContainerBase"] = true; dojo.provide("dijit.layout._TabContainerBase"); dojo.require("dijit.layout.StackContainer"); dojo.require("dijit._Templated"); -dojo.declare("dijit.layout._TabContainerBase",[dijit.layout.StackContainer,dijit._Templated],{tabPosition:"top",baseClass:"dijitTabContainer",tabStrip:false,nested:false,templateString:dojo.cache("dijit.layout","templates/TabContainer.html","<div class=\"dijitTabContainer\">\n\t<div class=\"dijitTabListWrapper\" dojoAttachPoint=\"tablistNode\"></div>\n\t<div dojoAttachPoint=\"tablistSpacer\" class=\"dijitTabSpacer ${baseClass}-spacer\"></div>\n\t<div class=\"dijitTabPaneWrapper ${baseClass}-container\" dojoAttachPoint=\"containerNode\"></div>\n</div>\n"),postMixInProperties:function(){ -this.baseClass+=this.tabPosition.charAt(0).toUpperCase()+this.tabPosition.substr(1).replace(/-.*/,""); -this.srcNodeRef&&dojo.style(this.srcNodeRef,"visibility","hidden"); -this.inherited(arguments); -},postCreate:function(){ -this.inherited(arguments); -this.tablist=this._makeController(this.tablistNode); -if(!this.doLayout){ -dojo.addClass(this.domNode,"dijitTabContainerNoLayout"); -} -if(this.nested){ -dojo.addClass(this.domNode,"dijitTabContainerNested"); -dojo.addClass(this.tablist.containerNode,"dijitTabContainerTabListNested"); -dojo.addClass(this.tablistSpacer,"dijitTabContainerSpacerNested"); -dojo.addClass(this.containerNode,"dijitTabPaneWrapperNested"); -}else{ -dojo.addClass(this.domNode,"tabStrip-"+(this.tabStrip?"enabled":"disabled")); -} -},_setupChild:function(_1){ -dojo.addClass(_1.domNode,"dijitTabPane"); -this.inherited(arguments); -},startup:function(){ -if(this._started){ -return; -} -this.tablist.startup(); -this.inherited(arguments); -},layout:function(){ -if(!this._contentBox||typeof (this._contentBox.l)=="undefined"){ -return; -} -var sc=this.selectedChildWidget; -if(this.doLayout){ -var _2=this.tabPosition.replace(/-h/,""); -this.tablist.layoutAlign=_2; -var _3=[this.tablist,{domNode:this.tablistSpacer,layoutAlign:_2},{domNode:this.containerNode,layoutAlign:"client"}]; -dijit.layout.layoutChildren(this.domNode,this._contentBox,_3); -this._containerContentBox=dijit.layout.marginBox2contentBox(this.containerNode,_3[2]); -if(sc&&sc.resize){ -sc.resize(this._containerContentBox); -} -}else{ -if(this.tablist.resize){ -this.tablist.resize({w:dojo.contentBox(this.domNode).w}); -} -if(sc&&sc.resize){ -sc.resize(); -} -} -},destroy:function(){ -if(this.tablist){ -this.tablist.destroy(); -} -this.inherited(arguments); -}}); + + +dojo.declare("dijit.layout._TabContainerBase", + [dijit.layout.StackContainer, dijit._Templated], + { + // summary: + // Abstract base class for TabContainer. Must define _makeController() to instantiate + // and return the widget that displays the tab labels + // description: + // A TabContainer is a container that has multiple panes, but shows only + // one pane at a time. There are a set of tabs corresponding to each pane, + // where each tab has the name (aka title) of the pane, and optionally a close button. + + // tabPosition: String + // Defines where tabs go relative to tab content. + // "top", "bottom", "left-h", "right-h" + tabPosition: "top", + + baseClass: "dijitTabContainer", + + // tabStrip: [const] Boolean + // Defines whether the tablist gets an extra class for layouting, putting a border/shading + // around the set of tabs. Not supported by claro theme. + tabStrip: false, + + // nested: [const] Boolean + // If true, use styling for a TabContainer nested inside another TabContainer. + // For tundra etc., makes tabs look like links, and hides the outer + // border since the outer TabContainer already has a border. + nested: false, + + templateString: dojo.cache("dijit.layout", "templates/TabContainer.html", "<div class=\"dijitTabContainer\">\n\t<div class=\"dijitTabListWrapper\" dojoAttachPoint=\"tablistNode\"></div>\n\t<div dojoAttachPoint=\"tablistSpacer\" class=\"dijitTabSpacer ${baseClass}-spacer\"></div>\n\t<div class=\"dijitTabPaneWrapper ${baseClass}-container\" dojoAttachPoint=\"containerNode\"></div>\n</div>\n"), + + postMixInProperties: function(){ + // set class name according to tab position, ex: dijitTabContainerTop + this.baseClass += this.tabPosition.charAt(0).toUpperCase() + this.tabPosition.substr(1).replace(/-.*/, ""); + + this.srcNodeRef && dojo.style(this.srcNodeRef, "visibility", "hidden"); + + this.inherited(arguments); + }, + + buildRendering: function(){ + this.inherited(arguments); + + // Create the tab list that will have a tab (a.k.a. tab button) for each tab panel + this.tablist = this._makeController(this.tablistNode); + + if(!this.doLayout){ dojo.addClass(this.domNode, "dijitTabContainerNoLayout"); } + + if(this.nested){ + /* workaround IE's lack of support for "a > b" selectors by + * tagging each node in the template. + */ + dojo.addClass(this.domNode, "dijitTabContainerNested"); + dojo.addClass(this.tablist.containerNode, "dijitTabContainerTabListNested"); + dojo.addClass(this.tablistSpacer, "dijitTabContainerSpacerNested"); + dojo.addClass(this.containerNode, "dijitTabPaneWrapperNested"); + }else{ + dojo.addClass(this.domNode, "tabStrip-" + (this.tabStrip ? "enabled" : "disabled")); + } + }, + + _setupChild: function(/*dijit._Widget*/ tab){ + // Overrides StackContainer._setupChild(). + dojo.addClass(tab.domNode, "dijitTabPane"); + this.inherited(arguments); + }, + + startup: function(){ + if(this._started){ return; } + + // wire up the tablist and its tabs + this.tablist.startup(); + + this.inherited(arguments); + }, + + layout: function(){ + // Overrides StackContainer.layout(). + // Configure the content pane to take up all the space except for where the tabs are + + if(!this._contentBox || typeof(this._contentBox.l) == "undefined"){return;} + + var sc = this.selectedChildWidget; + + if(this.doLayout){ + // position and size the titles and the container node + var titleAlign = this.tabPosition.replace(/-h/, ""); + this.tablist.layoutAlign = titleAlign; + var children = [this.tablist, { + domNode: this.tablistSpacer, + layoutAlign: titleAlign + }, { + domNode: this.containerNode, + layoutAlign: "client" + }]; + dijit.layout.layoutChildren(this.domNode, this._contentBox, children); + + // Compute size to make each of my children. + // children[2] is the margin-box size of this.containerNode, set by layoutChildren() call above + this._containerContentBox = dijit.layout.marginBox2contentBox(this.containerNode, children[2]); + + if(sc && sc.resize){ + sc.resize(this._containerContentBox); + } + }else{ + // just layout the tab controller, so it can position left/right buttons etc. + if(this.tablist.resize){ + //make the tabs zero width so that they don't interfere with width calc, then reset + var s = this.tablist.domNode.style; + s.width="0"; + var width = dojo.contentBox(this.domNode).w; + s.width=""; + this.tablist.resize({w: width}); + } + + // and call resize() on the selected pane just to tell it that it's been made visible + if(sc && sc.resize){ + sc.resize(); + } + } + }, + + destroy: function(){ + if(this.tablist){ + this.tablist.destroy(); + } + this.inherited(arguments); + } +}); + } |