root / trunk / web / dojo / dojox / layout / ToggleSplitter.js @ 12
History | View | Annotate | Download (4.44 KB)
| 1 | 9 | andrej.cim | /*
|
|---|---|---|---|
| 2 | Copyright (c) 2004-2010, The Dojo Foundation All Rights Reserved.
|
||
| 3 | Available via Academic Free License >= 2.1 OR the modified BSD license.
|
||
| 4 | see: http://dojotoolkit.org/license for details
|
||
| 5 | */
|
||
| 6 | |||
| 7 | |||
| 8 | if(!dojo._hasResource["dojox.layout.ToggleSplitter"]){ |
||
| 9 | dojo._hasResource["dojox.layout.ToggleSplitter"]=true; |
||
| 10 | dojo.provide("dojox.layout.ToggleSplitter");
|
||
| 11 | dojo.experimental("dojox.layout.ToggleSplitter");
|
||
| 12 | dojo.require("dijit.layout.BorderContainer");
|
||
| 13 | dojo.declare("dojox.layout.ToggleSplitter",[dijit.layout._Splitter],{open:true,closedThreshold:5,openSize:"",_closedSize:"0",templateString:"<div class=\"dijitSplitter dojoxToggleSplitter\" dojoAttachEvent=\"onkeypress:_onKeyPress,onmousedown:_onMouseDown\" tabIndex=\"0\" waiRole=\"separator\"><div dojoAttachPoint=\"toggleNode\" class=\"dijitSplitterThumb dojoxToggleSplitterIcon\"></div></div>",postCreate:function(){ |
||
| 14 | this._started=false; |
||
| 15 | this.inherited(arguments); |
||
| 16 | var _1=this.region; |
||
| 17 | dojo.addClass(this.domNode,"dojoxToggleSplitter"+_1.charAt(0).toUpperCase()+_1.substring(1)); |
||
| 18 | this.connect(this,"onDblClick","_toggleMe"); |
||
| 19 | },startup:function(){ |
||
| 20 | this.inherited(arguments); |
||
| 21 | var _2=this.child.domNode,_3=dojo.style(_2,(this.horizontal?"height":"width")); |
||
| 22 | dojo.forEach(["toggleSplitterOpen","toggleSplitterClosedThreshold","toggleSplitterOpenSize"],function(_4){ |
||
| 23 | var _5=_4.substring("toggleSplitter".length); |
||
| 24 | _5=_5.charAt(0).toLowerCase()+_5.substring(1); |
||
| 25 | if(_4 in this.child){ |
||
| 26 | this[_5]=this.child[_4]; |
||
| 27 | } |
||
| 28 | },this);
|
||
| 29 | if(!this.openSize){ |
||
| 30 | this.openSize=(this.open)?_3+"px":"75px"; |
||
| 31 | } |
||
| 32 | this._openStyleProps=this._getStyleProps(_2,true); |
||
| 33 | this._started=true; |
||
| 34 | this.set("open",this.open); |
||
| 35 | return this; |
||
| 36 | },_onMouseUp:function(_6){ |
||
| 37 | dojo.disconnect(this._onMoveHandle);
|
||
| 38 | dojo.disconnect(this._onUpHandle);
|
||
| 39 | delete this._onMoveHandle; |
||
| 40 | delete this._onUpHandle; |
||
| 41 | delete this._startPosn; |
||
| 42 | },_onPrelimMouseMove:function(_7){ |
||
| 43 | var _8=this._startPosn||0; |
||
| 44 | var _9=3; |
||
| 45 | var _a=Math.abs(_8-(this.horizontal?_7.clientY:_7.clientX)); |
||
| 46 | if(_a>=_9){
|
||
| 47 | dojo.disconnect(this._onMoveHandle);
|
||
| 48 | this._startDrag(_7);
|
||
| 49 | } |
||
| 50 | },_onMouseDown:function(_b){ |
||
| 51 | if(!this.open){ |
||
| 52 | return;
|
||
| 53 | } |
||
| 54 | if(!this._onUpHandle){ |
||
| 55 | this._onUpHandle=dojo.connect(dojo.body(),"onmouseup",this,"_onMouseUp"); |
||
| 56 | } |
||
| 57 | if(!this._onMoveHandle){ |
||
| 58 | this._startPosn=this.horizontal?_b.clientY:_b.clientX; |
||
| 59 | this._onMoveHandle=dojo.connect(dojo.body(),"onmousemove",this,"_onPrelimMouseMove"); |
||
| 60 | } |
||
| 61 | },_handleOnChange:function(){ |
||
| 62 | var _c=this.child.domNode,_d,_e=this.horizontal?"height":"width"; |
||
| 63 | if(this.open){ |
||
| 64 | var _f=dojo.mixin({display:"block",overflow:"auto",visibility:"visible"},this._openStyleProps); |
||
| 65 | _f[_e]=(this._openStyleProps&&this._openStyleProps[_e])?this._openStyleProps[_e]:this.openSize; |
||
| 66 | dojo.style(_c,_f); |
||
| 67 | this.connect(this.domNode,"onmousedown","_onMouseDown"); |
||
| 68 | }else{
|
||
| 69 | var _10=dojo.getComputedStyle(_c);
|
||
| 70 | _d=this._getStyleProps(_c,true,_10); |
||
| 71 | var _11=this._getStyleProps(_c,false,_10); |
||
| 72 | this._openStyleProps=_d;
|
||
| 73 | dojo.style(_c,_11); |
||
| 74 | } |
||
| 75 | this._setStateClass();
|
||
| 76 | if(this.container._started){ |
||
| 77 | this.container._layoutChildren(this.region); |
||
| 78 | } |
||
| 79 | },_getStyleProps:function(_12,_13,_14){ |
||
| 80 | if(!_14){
|
||
| 81 | _14=dojo.getComputedStyle(_12); |
||
| 82 | } |
||
| 83 | var _15={},dim=this.horizontal?"height":"width"; |
||
| 84 | _15["overflow"]=(_13)?_14["overflow"]:"hidden"; |
||
| 85 | _15["visibility"]=(_13)?_14["visibility"]:"hidden"; |
||
| 86 | _15[dim]=(_13)?_12.style[dim]||_14[dim]:this._closedSize;
|
||
| 87 | var _16=["Top","Right","Bottom","Left"]; |
||
| 88 | dojo.forEach(["padding","margin","border"],function(_17){ |
||
| 89 | for(var i=0;i<_16.length;i++){ |
||
| 90 | var _18=_17+_16[i];
|
||
| 91 | if(_17=="border"){ |
||
| 92 | _17+="Width";
|
||
| 93 | } |
||
| 94 | if(undefined!==_14[_18]){ |
||
| 95 | _15[_18]=(_13)?_14[_18]:0;
|
||
| 96 | } |
||
| 97 | } |
||
| 98 | }); |
||
| 99 | return _15;
|
||
| 100 | },_setStateClass:function(){ |
||
| 101 | if(this.open){ |
||
| 102 | dojo.removeClass(this.domNode,"dojoxToggleSplitterClosed"); |
||
| 103 | dojo.addClass(this.domNode,"dojoxToggleSplitterOpen"); |
||
| 104 | dojo.removeClass(this.toggleNode,"dojoxToggleSplitterIconClosed"); |
||
| 105 | dojo.addClass(this.toggleNode,"dojoxToggleSplitterIconOpen"); |
||
| 106 | }else{
|
||
| 107 | dojo.addClass(this.domNode,"dojoxToggleSplitterClosed"); |
||
| 108 | dojo.removeClass(this.domNode,"dojoxToggleSplitterOpen"); |
||
| 109 | dojo.addClass(this.toggleNode,"dojoxToggleSplitterIconClosed"); |
||
| 110 | dojo.removeClass(this.toggleNode,"dojoxToggleSplitterIconOpen"); |
||
| 111 | } |
||
| 112 | },_setOpenAttr:function(_19){ |
||
| 113 | if(!this._started){ |
||
| 114 | return;
|
||
| 115 | } |
||
| 116 | this.open=_19;
|
||
| 117 | this._handleOnChange(_19,true); |
||
| 118 | var evt=this.open?"onOpen":"onClose"; |
||
| 119 | this[evt](this.child); |
||
| 120 | },onOpen:function(){ |
||
| 121 | },onClose:function(){ |
||
| 122 | },_toggleMe:function(evt){ |
||
| 123 | if(evt){
|
||
| 124 | dojo.stopEvent(evt); |
||
| 125 | } |
||
| 126 | this.set("open",!this.open); |
||
| 127 | },_onKeyPress:function(e){ |
||
| 128 | this.inherited(arguments); |
||
| 129 | }}); |
||
| 130 | dojo.extend(dijit._Widget,{toggleSplitterOpen:true,toggleSplitterClosedThreshold:5,toggleSplitterOpenSize:""});
|
||
| 131 | } |