From 1354d17270961fff662d40f90521223f8fd0d73b Mon Sep 17 00:00:00 2001 From: Andrew Dolgov Date: Tue, 14 Aug 2012 18:59:10 +0400 Subject: update dojo to 1.7.3 --- lib/dijit/layout/BorderContainer.js | 529 +----------------------------------- 1 file changed, 2 insertions(+), 527 deletions(-) (limited to 'lib/dijit/layout/BorderContainer.js') diff --git a/lib/dijit/layout/BorderContainer.js b/lib/dijit/layout/BorderContainer.js index c053256d4..db41c9cb6 100644 --- a/lib/dijit/layout/BorderContainer.js +++ b/lib/dijit/layout/BorderContainer.js @@ -1,527 +1,2 @@ -/* - 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.BorderContainer"]){ //_hasResource checks added by build. Do not use _hasResource directly in your code. -dojo._hasResource["dijit.layout.BorderContainer"] = true; -dojo.provide("dijit.layout.BorderContainer"); -dojo.require("dijit.layout._LayoutWidget"); -dojo.require("dojo.cookie"); -dojo.require("dijit._Templated"); - - -dojo.declare( - "dijit.layout.BorderContainer", - dijit.layout._LayoutWidget, -{ - // summary: - // Provides layout in up to 5 regions, a mandatory center with optional borders along its 4 sides. - // - // description: - // A BorderContainer is a box with a specified size, such as style="width: 500px; height: 500px;", - // that contains a child widget marked region="center" and optionally children widgets marked - // region equal to "top", "bottom", "leading", "trailing", "left" or "right". - // Children along the edges will be laid out according to width or height dimensions and may - // include optional splitters (splitter="true") to make them resizable by the user. The remaining - // space is designated for the center region. - // - // The outer size must be specified on the BorderContainer node. Width must be specified for the sides - // and height for the top and bottom, respectively. No dimensions should be specified on the center; - // it will fill the remaining space. Regions named "leading" and "trailing" may be used just like - // "left" and "right" except that they will be reversed in right-to-left environments. - // - // For complex layouts, multiple children can be specified for a single region. In this case, the - // layoutPriority flag on the children determines which child is closer to the edge (low layoutPriority) - // and which child is closer to the center (high layoutPriority). layoutPriority can also be used - // instead of the design attribute to conrol layout precedence of horizontal vs. vertical panes. - // example: - // |
- // |
header text
- // |
table of contents
- // |
client area
- // |
- - // design: String - // Which design is used for the layout: - // - "headline" (default) where the top and bottom extend - // the full width of the container - // - "sidebar" where the left and right sides extend from top to bottom. - design: "headline", - - // gutters: [const] Boolean - // Give each pane a border and margin. - // Margin determined by domNode.paddingLeft. - // When false, only resizable panes have a gutter (i.e. draggable splitter) for resizing. - gutters: true, - - // liveSplitters: [const] Boolean - // Specifies whether splitters resize as you drag (true) or only upon mouseup (false) - liveSplitters: true, - - // persist: Boolean - // Save splitter positions in a cookie. - persist: false, - - baseClass: "dijitBorderContainer", - - // _splitterClass: String - // Optional hook to override the default Splitter widget used by BorderContainer - _splitterClass: "dijit.layout._Splitter", - - postMixInProperties: function(){ - // change class name to indicate that BorderContainer is being used purely for - // layout (like LayoutContainer) rather than for pretty formatting. - if(!this.gutters){ - this.baseClass += "NoGutter"; - } - this.inherited(arguments); - }, - - startup: function(){ - if(this._started){ return; } - dojo.forEach(this.getChildren(), this._setupChild, this); - this.inherited(arguments); - }, - - _setupChild: function(/*dijit._Widget*/ child){ - // Override _LayoutWidget._setupChild(). - - var region = child.region; - if(region){ - this.inherited(arguments); - - dojo.addClass(child.domNode, this.baseClass+"Pane"); - - var ltr = this.isLeftToRight(); - if(region == "leading"){ region = ltr ? "left" : "right"; } - if(region == "trailing"){ region = ltr ? "right" : "left"; } - - // Create draggable splitter for resizing pane, - // or alternately if splitter=false but BorderContainer.gutters=true then - // insert dummy div just for spacing - if(region != "center" && (child.splitter || this.gutters) && !child._splitterWidget){ - var _Splitter = dojo.getObject(child.splitter ? this._splitterClass : "dijit.layout._Gutter"); - var splitter = new _Splitter({ - id: child.id + "_splitter", - container: this, - child: child, - region: region, - live: this.liveSplitters - }); - splitter.isSplitter = true; - child._splitterWidget = splitter; - - dojo.place(splitter.domNode, child.domNode, "after"); - - // Splitters aren't added as Contained children, so we need to call startup explicitly - splitter.startup(); - } - child.region = region; // TODO: technically wrong since it overwrites "trailing" with "left" etc. - } - }, - - layout: function(){ - // Implement _LayoutWidget.layout() virtual method. - this._layoutChildren(); - }, - - addChild: function(/*dijit._Widget*/ child, /*Integer?*/ insertIndex){ - // Override _LayoutWidget.addChild(). - this.inherited(arguments); - if(this._started){ - this.layout(); //OPT - } - }, - - removeChild: function(/*dijit._Widget*/ child){ - // Override _LayoutWidget.removeChild(). - - var region = child.region; - var splitter = child._splitterWidget - if(splitter){ - splitter.destroy(); - delete child._splitterWidget; - } - this.inherited(arguments); - - if(this._started){ - this._layoutChildren(); - } - // Clean up whatever style changes we made to the child pane. - // Unclear how height and width should be handled. - dojo.removeClass(child.domNode, this.baseClass+"Pane"); - dojo.style(child.domNode, { - top: "auto", - bottom: "auto", - left: "auto", - right: "auto", - position: "static" - }); - dojo.style(child.domNode, region == "top" || region == "bottom" ? "width" : "height", "auto"); - }, - - getChildren: function(){ - // Override _LayoutWidget.getChildren() to only return real children, not the splitters. - return dojo.filter(this.inherited(arguments), function(widget){ - return !widget.isSplitter; - }); - }, - - // TODO: remove in 2.0 - getSplitter: function(/*String*/region){ - // summary: - // Returns the widget responsible for rendering the splitter associated with region - // tags: - // deprecated - return dojo.filter(this.getChildren(), function(child){ - return child.region == region; - })[0]._splitterWidget; - }, - - resize: function(newSize, currentSize){ - // Overrides _LayoutWidget.resize(). - - // resetting potential padding to 0px to provide support for 100% width/height + padding - // TODO: this hack doesn't respect the box model and is a temporary fix - if(!this.cs || !this.pe){ - var node = this.domNode; - this.cs = dojo.getComputedStyle(node); - this.pe = dojo._getPadExtents(node, this.cs); - this.pe.r = dojo._toPixelValue(node, this.cs.paddingRight); - this.pe.b = dojo._toPixelValue(node, this.cs.paddingBottom); - - dojo.style(node, "padding", "0px"); - } - - this.inherited(arguments); - }, - - _layoutChildren: function(/*String?*/ changedChildId, /*Number?*/ changedChildSize){ - // summary: - // This is the main routine for setting size/position of each child. - // description: - // With no arguments, measures the height of top/bottom panes, the width - // of left/right panes, and then sizes all panes accordingly. - // - // With changedRegion specified (as "left", "top", "bottom", or "right"), - // it changes that region's width/height to changedRegionSize and - // then resizes other regions that were affected. - // changedChildId: - // Id of the child which should be resized because splitter was dragged. - // changedChildSize: - // The new width/height (in pixels) to make specified child - - if(!this._borderBox || !this._borderBox.h){ - // We are currently hidden, or we haven't been sized by our parent yet. - // Abort. Someone will resize us later. - return; - } - - // Generate list of wrappers of my children in the order that I want layoutChildren() - // to process them (i.e. from the outside to the inside) - var wrappers = dojo.map(this.getChildren(), function(child, idx){ - return { - pane: child, - weight: [ - child.region == "center" ? Infinity : 0, - child.layoutPriority, - (this.design == "sidebar" ? 1 : -1) * (/top|bottom/.test(child.region) ? 1 : -1), - idx - ] - }; - }, this); - wrappers.sort(function(a, b){ - var aw = a.weight, bw = b.weight; - for(var i=0; i
', - - postMixInProperties: function(){ - this.inherited(arguments); - - this.horizontal = /top|bottom/.test(this.region); - this._factor = /top|left/.test(this.region) ? 1 : -1; - this._cookieName = this.container.id + "_" + this.region; - }, - - buildRendering: function(){ - this.inherited(arguments); - - dojo.addClass(this.domNode, "dijitSplitter" + (this.horizontal ? "H" : "V")); - - if(this.container.persist){ - // restore old size - var persistSize = dojo.cookie(this._cookieName); - if(persistSize){ - this.child.domNode.style[this.horizontal ? "height" : "width"] = persistSize; - } - } - }, - - _computeMaxSize: function(){ - // summary: - // Return the maximum size that my corresponding pane can be set to - - var dim = this.horizontal ? 'h' : 'w', - childSize = dojo.marginBox(this.child.domNode)[dim], - center = dojo.filter(this.container.getChildren(), function(child){ return child.region == "center";})[0], - spaceAvailable = dojo.marginBox(center.domNode)[dim]; // can expand until center is crushed to 0 - - return Math.min(this.child.maxSize, childSize + spaceAvailable); - }, - - _startDrag: function(e){ - if(!this.cover){ - this.cover = dojo.doc.createElement('div'); - dojo.addClass(this.cover, "dijitSplitterCover"); - dojo.place(this.cover, this.child.domNode, "after"); - } - dojo.addClass(this.cover, "dijitSplitterCoverActive"); - - // Safeguard in case the stop event was missed. Shouldn't be necessary if we always get the mouse up. - if(this.fake){ dojo.destroy(this.fake); } - if(!(this._resize = this.live)){ //TODO: disable live for IE6? - // create fake splitter to display at old position while we drag - (this.fake = this.domNode.cloneNode(true)).removeAttribute("id"); - dojo.addClass(this.domNode, "dijitSplitterShadow"); - dojo.place(this.fake, this.domNode, "after"); - } - dojo.addClass(this.domNode, "dijitSplitterActive dijitSplitter" + (this.horizontal ? "H" : "V") + "Active"); - if(this.fake){ - dojo.removeClass(this.fake, "dijitSplitterHover dijitSplitter" + (this.horizontal ? "H" : "V") + "Hover"); - } - - //Performance: load data info local vars for onmousevent function closure - var factor = this._factor, - isHorizontal = this.horizontal, - axis = isHorizontal ? "pageY" : "pageX", - pageStart = e[axis], - splitterStyle = this.domNode.style, - dim = isHorizontal ? 'h' : 'w', - childStart = dojo.marginBox(this.child.domNode)[dim], - max = this._computeMaxSize(), - min = this.child.minSize || 20, - region = this.region, - splitterAttr = region == "top" || region == "bottom" ? "top" : "left", // style attribute of splitter to adjust - splitterStart = parseInt(splitterStyle[splitterAttr], 10), - resize = this._resize, - layoutFunc = dojo.hitch(this.container, "_layoutChildren", this.child.id), - de = dojo.doc; - - this._handlers = (this._handlers || []).concat([ - dojo.connect(de, "onmousemove", this._drag = function(e, forceResize){ - var delta = e[axis] - pageStart, - childSize = factor * delta + childStart, - boundChildSize = Math.max(Math.min(childSize, max), min); - - if(resize || forceResize){ - layoutFunc(boundChildSize); - } - // TODO: setting style directly (usually) sets content box size, need to set margin box size - splitterStyle[splitterAttr] = delta + splitterStart + factor*(boundChildSize - childSize) + "px"; - }), - dojo.connect(de, "ondragstart", dojo.stopEvent), - dojo.connect(dojo.body(), "onselectstart", dojo.stopEvent), - dojo.connect(de, "onmouseup", this, "_stopDrag") - ]); - dojo.stopEvent(e); - }, - - _onMouse: function(e){ - var o = (e.type == "mouseover" || e.type == "mouseenter"); - dojo.toggleClass(this.domNode, "dijitSplitterHover", o); - dojo.toggleClass(this.domNode, "dijitSplitter" + (this.horizontal ? "H" : "V") + "Hover", o); - }, - - _stopDrag: function(e){ - try{ - if(this.cover){ - dojo.removeClass(this.cover, "dijitSplitterCoverActive"); - } - if(this.fake){ dojo.destroy(this.fake); } - dojo.removeClass(this.domNode, "dijitSplitterActive dijitSplitter" - + (this.horizontal ? "H" : "V") + "Active dijitSplitterShadow"); - this._drag(e); //TODO: redundant with onmousemove? - this._drag(e, true); - }finally{ - this._cleanupHandlers(); - delete this._drag; - } - - if(this.container.persist){ - dojo.cookie(this._cookieName, this.child.domNode.style[this.horizontal ? "height" : "width"], {expires:365}); - } - }, - - _cleanupHandlers: function(){ - dojo.forEach(this._handlers, dojo.disconnect); - delete this._handlers; - }, - - _onKeyPress: function(/*Event*/ e){ - // should we apply typematic to this? - this._resize = true; - var horizontal = this.horizontal; - var tick = 1; - var dk = dojo.keys; - switch(e.charOrCode){ - case horizontal ? dk.UP_ARROW : dk.LEFT_ARROW: - tick *= -1; -// break; - case horizontal ? dk.DOWN_ARROW : dk.RIGHT_ARROW: - break; - default: -// this.inherited(arguments); - return; - } - var childSize = dojo._getMarginSize(this.child.domNode)[ horizontal ? 'h' : 'w' ] + this._factor * tick; - this.container._layoutChildren(this.child.id, Math.max(Math.min(childSize, this._computeMaxSize()), this.child.minSize)); - dojo.stopEvent(e); - }, - - destroy: function(){ - this._cleanupHandlers(); - delete this.child; - delete this.container; - delete this.cover; - delete this.fake; - this.inherited(arguments); - } -}); - -dojo.declare("dijit.layout._Gutter", [dijit._Widget, dijit._Templated], -{ - // summary: - // Just a spacer div to separate side pane from center pane. - // Basically a trick to lookup the gutter/splitter width from the theme. - // description: - // Instantiated by `dijit.layout.BorderContainer`. Users should not - // create directly. - // tags: - // private - - templateString: '', - - postMixInProperties: function(){ - this.inherited(arguments); - this.horizontal = /top|bottom/.test(this.region); - }, - - buildRendering: function(){ - this.inherited(arguments); - dojo.addClass(this.domNode, "dijitGutter" + (this.horizontal ? "H" : "V")); - } -}); - -} +//>>built +define("dijit/layout/BorderContainer",["dojo/_base/array","dojo/cookie","dojo/_base/declare","dojo/dom-class","dojo/dom-construct","dojo/dom-geometry","dojo/dom-style","dojo/_base/event","dojo/keys","dojo/_base/lang","dojo/on","dojo/touch","dojo/_base/window","../_WidgetBase","../_Widget","../_TemplatedMixin","./_LayoutWidget","./utils"],function(_1,_2,_3,_4,_5,_6,_7,_8,_9,_a,on,_b,_c,_d,_e,_f,_10,_11){var _12=_3("dijit.layout._Splitter",[_e,_f],{live:true,templateString:"
",constructor:function(){this._handlers=[];},postMixInProperties:function(){this.inherited(arguments);this.horizontal=/top|bottom/.test(this.region);this._factor=/top|left/.test(this.region)?1:-1;this._cookieName=this.container.id+"_"+this.region;},buildRendering:function(){this.inherited(arguments);_4.add(this.domNode,"dijitSplitter"+(this.horizontal?"H":"V"));if(this.container.persist){var _13=_2(this._cookieName);if(_13){this.child.domNode.style[this.horizontal?"height":"width"]=_13;}}},_computeMaxSize:function(){var dim=this.horizontal?"h":"w",_14=_6.getMarginBox(this.child.domNode)[dim],_15=_1.filter(this.container.getChildren(),function(_16){return _16.region=="center";})[0],_17=_6.getMarginBox(_15.domNode)[dim];return Math.min(this.child.maxSize,_14+_17);},_startDrag:function(e){if(!this.cover){this.cover=_c.doc.createElement("div");_4.add(this.cover,"dijitSplitterCover");_5.place(this.cover,this.child.domNode,"after");}_4.add(this.cover,"dijitSplitterCoverActive");if(this.fake){_5.destroy(this.fake);}if(!(this._resize=this.live)){(this.fake=this.domNode.cloneNode(true)).removeAttribute("id");_4.add(this.domNode,"dijitSplitterShadow");_5.place(this.fake,this.domNode,"after");}_4.add(this.domNode,"dijitSplitterActive dijitSplitter"+(this.horizontal?"H":"V")+"Active");if(this.fake){_4.remove(this.fake,"dijitSplitterHover dijitSplitter"+(this.horizontal?"H":"V")+"Hover");}var _18=this._factor,_19=this.horizontal,_1a=_19?"pageY":"pageX",_1b=e[_1a],_1c=this.domNode.style,dim=_19?"h":"w",_1d=_6.getMarginBox(this.child.domNode)[dim],max=this._computeMaxSize(),min=this.child.minSize||20,_1e=this.region,_1f=_1e=="top"||_1e=="bottom"?"top":"left",_20=parseInt(_1c[_1f],10),_21=this._resize,_22=_a.hitch(this.container,"_layoutChildren",this.child.id),de=_c.doc;this._handlers=this._handlers.concat([on(de,_b.move,this._drag=function(e,_23){var _24=e[_1a]-_1b,_25=_18*_24+_1d,_26=Math.max(Math.min(_25,max),min);if(_21||_23){_22(_26);}_1c[_1f]=_24+_20+_18*(_26-_25)+"px";}),on(de,"dragstart",_8.stop),on(_c.body(),"selectstart",_8.stop),on(de,_b.release,_a.hitch(this,"_stopDrag"))]);_8.stop(e);},_onMouse:function(e){var o=(e.type=="mouseover"||e.type=="mouseenter");_4.toggle(this.domNode,"dijitSplitterHover",o);_4.toggle(this.domNode,"dijitSplitter"+(this.horizontal?"H":"V")+"Hover",o);},_stopDrag:function(e){try{if(this.cover){_4.remove(this.cover,"dijitSplitterCoverActive");}if(this.fake){_5.destroy(this.fake);}_4.remove(this.domNode,"dijitSplitterActive dijitSplitter"+(this.horizontal?"H":"V")+"Active dijitSplitterShadow");this._drag(e);this._drag(e,true);}finally{this._cleanupHandlers();delete this._drag;}if(this.container.persist){_2(this._cookieName,this.child.domNode.style[this.horizontal?"height":"width"],{expires:365});}},_cleanupHandlers:function(){var h;while(h=this._handlers.pop()){h.remove();}},_onKeyPress:function(e){this._resize=true;var _27=this.horizontal;var _28=1;switch(e.charOrCode){case _27?_9.UP_ARROW:_9.LEFT_ARROW:_28*=-1;case _27?_9.DOWN_ARROW:_9.RIGHT_ARROW:break;default:return;}var _29=_6.getMarginSize(this.child.domNode)[_27?"h":"w"]+this._factor*_28;this.container._layoutChildren(this.child.id,Math.max(Math.min(_29,this._computeMaxSize()),this.child.minSize));_8.stop(e);},destroy:function(){this._cleanupHandlers();delete this.child;delete this.container;delete this.cover;delete this.fake;this.inherited(arguments);}});var _2a=_3("dijit.layout._Gutter",[_e,_f],{templateString:"
",postMixInProperties:function(){this.inherited(arguments);this.horizontal=/top|bottom/.test(this.region);},buildRendering:function(){this.inherited(arguments);_4.add(this.domNode,"dijitGutter"+(this.horizontal?"H":"V"));}});var _2b=_3("dijit.layout.BorderContainer",_10,{design:"headline",gutters:true,liveSplitters:true,persist:false,baseClass:"dijitBorderContainer",_splitterClass:_12,postMixInProperties:function(){if(!this.gutters){this.baseClass+="NoGutter";}this.inherited(arguments);},startup:function(){if(this._started){return;}_1.forEach(this.getChildren(),this._setupChild,this);this.inherited(arguments);},_setupChild:function(_2c){var _2d=_2c.region;if(_2d){this.inherited(arguments);_4.add(_2c.domNode,this.baseClass+"Pane");var ltr=this.isLeftToRight();if(_2d=="leading"){_2d=ltr?"left":"right";}if(_2d=="trailing"){_2d=ltr?"right":"left";}if(_2d!="center"&&(_2c.splitter||this.gutters)&&!_2c._splitterWidget){var _2e=_2c.splitter?this._splitterClass:_2a;if(_a.isString(_2e)){_2e=_a.getObject(_2e);}var _2f=new _2e({id:_2c.id+"_splitter",container:this,child:_2c,region:_2d,live:this.liveSplitters});_2f.isSplitter=true;_2c._splitterWidget=_2f;_5.place(_2f.domNode,_2c.domNode,"after");_2f.startup();}_2c.region=_2d;}},layout:function(){this._layoutChildren();},addChild:function(_30,_31){this.inherited(arguments);if(this._started){this.layout();}},removeChild:function(_32){var _33=_32.region;var _34=_32._splitterWidget;if(_34){_34.destroy();delete _32._splitterWidget;}this.inherited(arguments);if(this._started){this._layoutChildren();}_4.remove(_32.domNode,this.baseClass+"Pane");_7.set(_32.domNode,{top:"auto",bottom:"auto",left:"auto",right:"auto",position:"static"});_7.set(_32.domNode,_33=="top"||_33=="bottom"?"width":"height","auto");},getChildren:function(){return _1.filter(this.inherited(arguments),function(_35){return !_35.isSplitter;});},getSplitter:function(_36){return _1.filter(this.getChildren(),function(_37){return _37.region==_36;})[0]._splitterWidget;},resize:function(_38,_39){if(!this.cs||!this.pe){var _3a=this.domNode;this.cs=_7.getComputedStyle(_3a);this.pe=_6.getPadExtents(_3a,this.cs);this.pe.r=_7.toPixelValue(_3a,this.cs.paddingRight);this.pe.b=_7.toPixelValue(_3a,this.cs.paddingBottom);_7.set(_3a,"padding","0px");}this.inherited(arguments);},_layoutChildren:function(_3b,_3c){if(!this._borderBox||!this._borderBox.h){return;}var _3d=_1.map(this.getChildren(),function(_3e,idx){return {pane:_3e,weight:[_3e.region=="center"?Infinity:0,_3e.layoutPriority,(this.design=="sidebar"?1:-1)*(/top|bottom/.test(_3e.region)?1:-1),idx]};},this);_3d.sort(function(a,b){var aw=a.weight,bw=b.weight;for(var i=0;i