root / trunk / web / dojo / dojox / layout / GridContainer.js
History | View | Annotate | Download (8.71 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.GridContainer"]){ |
||
| 9 | dojo._hasResource["dojox.layout.GridContainer"]=true; |
||
| 10 | dojo.provide("dojox.layout.GridContainer");
|
||
| 11 | dojo.require("dojox.layout.GridContainerLite");
|
||
| 12 | dojo.declare("dojox.layout.GridContainer",dojox.layout.GridContainerLite,{hasResizableColumns:true,liveResizeColumns:false,minColWidth:20,minChildWidth:150,mode:"right",isRightFixed:false,isLeftFixed:false,startup:function(){ |
||
| 13 | this.inherited(arguments); |
||
| 14 | if(this.hasResizableColumns){ |
||
| 15 | for(var i=0;i<this._grid.length-1;i++){ |
||
| 16 | this._createGrip(i);
|
||
| 17 | } |
||
| 18 | if(!this.getParent()){ |
||
| 19 | dojo.ready(dojo.hitch(this,"_placeGrips")); |
||
| 20 | } |
||
| 21 | } |
||
| 22 | },resizeChildAfterDrop:function(_1,_2,_3){ |
||
| 23 | if(this.inherited(arguments)){ |
||
| 24 | this._placeGrips();
|
||
| 25 | } |
||
| 26 | },onShow:function(){ |
||
| 27 | this.inherited(arguments); |
||
| 28 | this._placeGrips();
|
||
| 29 | },resize:function(){ |
||
| 30 | this.inherited(arguments); |
||
| 31 | if(this._isShown()&&this.hasResizableColumns){ |
||
| 32 | this._placeGrips();
|
||
| 33 | } |
||
| 34 | },_createGrip:function(_4){ |
||
| 35 | var _5=this._grid[_4],_6=dojo.create("div",{"class":"gridContainerGrip"},this.domNode); |
||
| 36 | _5.grip=_6; |
||
| 37 | _5.gripHandler=[this.connect(_6,"onmouseover",function(e){ |
||
| 38 | var _7=false; |
||
| 39 | for(var i=0;i<this._grid.length-1;i++){ |
||
| 40 | if(dojo.hasClass(this._grid[i].grip,"gridContainerGripShow")){ |
||
| 41 | _7=true;
|
||
| 42 | break;
|
||
| 43 | } |
||
| 44 | } |
||
| 45 | if(!_7){
|
||
| 46 | dojo.removeClass(e.target,"gridContainerGrip");
|
||
| 47 | dojo.addClass(e.target,"gridContainerGripShow");
|
||
| 48 | } |
||
| 49 | })[0],this.connect(_6,"onmouseout",function(e){ |
||
| 50 | if(!this._isResized){ |
||
| 51 | dojo.removeClass(e.target,"gridContainerGripShow");
|
||
| 52 | dojo.addClass(e.target,"gridContainerGrip");
|
||
| 53 | } |
||
| 54 | })[0],this.connect(_6,"onmousedown","_resizeColumnOn")[0],this.connect(_6,"ondblclick","_onGripDbClick")[0]]; |
||
| 55 | },_placeGrips:function(){ |
||
| 56 | var _8,_9,_a=0,_b; |
||
| 57 | var _c=this.domNode.style.overflowY; |
||
| 58 | dojo.forEach(this._grid,function(_d){ |
||
| 59 | if(_d.grip){
|
||
| 60 | _b=_d.grip; |
||
| 61 | if(!_8){
|
||
| 62 | _8=_b.offsetWidth/2;
|
||
| 63 | } |
||
| 64 | _a+=dojo.marginBox(_d.node).w; |
||
| 65 | dojo.style(_b,"left",(_a-_8)+"px"); |
||
| 66 | if(!_9){
|
||
| 67 | _9=dojo.contentBox(this.gridNode).h;
|
||
| 68 | } |
||
| 69 | if(_9>0){ |
||
| 70 | dojo.style(_b,"height",_9+"px"); |
||
| 71 | } |
||
| 72 | } |
||
| 73 | },this);
|
||
| 74 | },_onGripDbClick:function(){ |
||
| 75 | this._updateColumnsWidth(this._dragManager); |
||
| 76 | this.resize();
|
||
| 77 | },_resizeColumnOn:function(e){ |
||
| 78 | this._activeGrip=e.target;
|
||
| 79 | this._initX=e.pageX;
|
||
| 80 | e.preventDefault(); |
||
| 81 | dojo.body().style.cursor="ew-resize";
|
||
| 82 | this._isResized=true; |
||
| 83 | var _e=[];
|
||
| 84 | var _f;
|
||
| 85 | var i;
|
||
| 86 | for(i=0;i<this._grid.length;i++){ |
||
| 87 | _e[i]=dojo.contentBox(this._grid[i].node).w;
|
||
| 88 | } |
||
| 89 | this._oldTabSize=_e;
|
||
| 90 | for(i=0;i<this._grid.length;i++){ |
||
| 91 | _f=this._grid[i];
|
||
| 92 | if(this._activeGrip==_f.grip){ |
||
| 93 | this._currentColumn=_f.node;
|
||
| 94 | this._currentColumnWidth=_e[i];
|
||
| 95 | this._nextColumn=this._grid[i+1].node; |
||
| 96 | this._nextColumnWidth=_e[i+1]; |
||
| 97 | } |
||
| 98 | _f.node.style.width=_e[i]+"px";
|
||
| 99 | } |
||
| 100 | var _10=function(_11,_12){ |
||
| 101 | var _13=0; |
||
| 102 | var _14=0; |
||
| 103 | dojo.forEach(_11,function(_15){
|
||
| 104 | if(_15.nodeType==1){ |
||
| 105 | var _16=dojo.getComputedStyle(_15);
|
||
| 106 | var _17=(dojo.isIE)?_12:parseInt(_16.minWidth);
|
||
| 107 | _14=_17+parseInt(_16.marginLeft)+parseInt(_16.marginRight); |
||
| 108 | if(_13<_14){
|
||
| 109 | _13=_14; |
||
| 110 | } |
||
| 111 | } |
||
| 112 | }); |
||
| 113 | return _13;
|
||
| 114 | }; |
||
| 115 | var _18=_10(this._currentColumn.childNodes,this.minChildWidth); |
||
| 116 | var _19=_10(this._nextColumn.childNodes,this.minChildWidth); |
||
| 117 | var _1a=Math.round((dojo.marginBox(this.gridContainerTable).w*this.minColWidth)/100); |
||
| 118 | this._currentMinCol=_18;
|
||
| 119 | this._nextMinCol=_19;
|
||
| 120 | if(_1a>this._currentMinCol){ |
||
| 121 | this._currentMinCol=_1a;
|
||
| 122 | } |
||
| 123 | if(_1a>this._nextMinCol){ |
||
| 124 | this._nextMinCol=_1a;
|
||
| 125 | } |
||
| 126 | this._connectResizeColumnMove=dojo.connect(dojo.doc,"onmousemove",this,"_resizeColumnMove"); |
||
| 127 | this._connectOnGripMouseUp=dojo.connect(dojo.doc,"onmouseup",this,"_onGripMouseUp"); |
||
| 128 | },_onGripMouseUp:function(){ |
||
| 129 | dojo.body().style.cursor="default";
|
||
| 130 | dojo.disconnect(this._connectResizeColumnMove);
|
||
| 131 | dojo.disconnect(this._connectOnGripMouseUp);
|
||
| 132 | this._connectOnGripMouseUp=this._connectResizeColumnMove=null; |
||
| 133 | if(this._activeGrip){ |
||
| 134 | dojo.removeClass(this._activeGrip,"gridContainerGripShow"); |
||
| 135 | dojo.addClass(this._activeGrip,"gridContainerGrip"); |
||
| 136 | } |
||
| 137 | this._isResized=false; |
||
| 138 | },_resizeColumnMove:function(e){ |
||
| 139 | e.preventDefault(); |
||
| 140 | if(!this._connectResizeColumnOff){ |
||
| 141 | dojo.disconnect(this._connectOnGripMouseUp);
|
||
| 142 | this._connectOnGripMouseUp=null; |
||
| 143 | this._connectResizeColumnOff=dojo.connect(dojo.doc,"onmouseup",this,"_resizeColumnOff"); |
||
| 144 | } |
||
| 145 | var d=e.pageX-this._initX; |
||
| 146 | if(d==0){ |
||
| 147 | return;
|
||
| 148 | } |
||
| 149 | if(!(this._currentColumnWidth+d<this._currentMinCol||this._nextColumnWidth-d<this._nextMinCol)){ |
||
| 150 | this._currentColumnWidth+=d;
|
||
| 151 | this._nextColumnWidth-=d;
|
||
| 152 | this._initX=e.pageX;
|
||
| 153 | this._activeGrip.style.left=parseInt(this._activeGrip.style.left)+d+"px"; |
||
| 154 | if(this.liveResizeColumns){ |
||
| 155 | this._currentColumn.style["width"]=this._currentColumnWidth+"px"; |
||
| 156 | this._nextColumn.style["width"]=this._nextColumnWidth+"px"; |
||
| 157 | this.resize();
|
||
| 158 | } |
||
| 159 | } |
||
| 160 | },_resizeColumnOff:function(e){ |
||
| 161 | dojo.body().style.cursor="default";
|
||
| 162 | dojo.disconnect(this._connectResizeColumnMove);
|
||
| 163 | dojo.disconnect(this._connectResizeColumnOff);
|
||
| 164 | this._connectResizeColumnOff=this._connectResizeColumnMove=null; |
||
| 165 | if(!this.liveResizeColumns){ |
||
| 166 | this._currentColumn.style["width"]=this._currentColumnWidth+"px"; |
||
| 167 | this._nextColumn.style["width"]=this._nextColumnWidth+"px"; |
||
| 168 | } |
||
| 169 | var _1b=[],_1c=[],_1d=this.gridContainerTable.clientWidth,_1e,_1f=false,i; |
||
| 170 | for(i=0;i<this._grid.length;i++){ |
||
| 171 | _1e=this._grid[i].node;
|
||
| 172 | if(dojo.isIE){
|
||
| 173 | _1b[i]=dojo.marginBox(_1e).w; |
||
| 174 | _1c[i]=dojo.contentBox(_1e).w; |
||
| 175 | }else{
|
||
| 176 | _1b[i]=dojo.contentBox(_1e).w; |
||
| 177 | _1c=_1b; |
||
| 178 | } |
||
| 179 | } |
||
| 180 | for(i=0;i<_1c.length;i++){ |
||
| 181 | if(_1c[i]!=this._oldTabSize[i]){ |
||
| 182 | _1f=true;
|
||
| 183 | break;
|
||
| 184 | } |
||
| 185 | } |
||
| 186 | if(_1f){
|
||
| 187 | var mul=dojo.isIE?100:10000; |
||
| 188 | for(i=0;i<this._grid.length;i++){ |
||
| 189 | this._grid[i].node.style.width=Math.round((100*mul*_1b[i])/_1d)/mul+"%"; |
||
| 190 | } |
||
| 191 | this.resize();
|
||
| 192 | } |
||
| 193 | if(this._activeGrip){ |
||
| 194 | dojo.removeClass(this._activeGrip,"gridContainerGripShow"); |
||
| 195 | dojo.addClass(this._activeGrip,"gridContainerGrip"); |
||
| 196 | } |
||
| 197 | this._isResized=false; |
||
| 198 | },setColumns:function(_20){ |
||
| 199 | var z,j;
|
||
| 200 | if(_20>0){ |
||
| 201 | var _21=this._grid.length,_22=_21-_20; |
||
| 202 | if(_22>0){ |
||
| 203 | var _23=[],_24,_25,end,_26;
|
||
| 204 | if(this.mode=="right"){ |
||
| 205 | end=(this.isLeftFixed&&_21>0)?1:0; |
||
| 206 | _25=(this.isRightFixed)?_21-2:_21-1; |
||
| 207 | for(z=_25;z>=end;z--){
|
||
| 208 | _26=0;
|
||
| 209 | _24=this._grid[z].node;
|
||
| 210 | for(j=0;j<_24.childNodes.length;j++){ |
||
| 211 | if(_24.childNodes[j].nodeType==1&&!(_24.childNodes[j].id=="")){ |
||
| 212 | _26++; |
||
| 213 | break;
|
||
| 214 | } |
||
| 215 | } |
||
| 216 | if(_26==0){ |
||
| 217 | _23[_23.length]=z; |
||
| 218 | } |
||
| 219 | if(_23.length>=_22){
|
||
| 220 | this._deleteColumn(_23);
|
||
| 221 | break;
|
||
| 222 | } |
||
| 223 | } |
||
| 224 | if(_23.length<_22){
|
||
| 225 | dojo.publish("/dojox/layout/gridContainer/noEmptyColumn",[this]); |
||
| 226 | } |
||
| 227 | }else{
|
||
| 228 | _25=(this.isLeftFixed&&_21>0)?1:0; |
||
| 229 | end=(this.isRightFixed)?_21-1:_21; |
||
| 230 | for(z=_25;z<end;z++){
|
||
| 231 | _26=0;
|
||
| 232 | _24=this._grid[z].node;
|
||
| 233 | for(j=0;j<_24.childNodes.length;j++){ |
||
| 234 | if(_24.childNodes[j].nodeType==1&&!(_24.childNodes[j].id=="")){ |
||
| 235 | _26++; |
||
| 236 | break;
|
||
| 237 | } |
||
| 238 | } |
||
| 239 | if(_26==0){ |
||
| 240 | _23[_23.length]=z; |
||
| 241 | } |
||
| 242 | if(_23.length>=_22){
|
||
| 243 | this._deleteColumn(_23);
|
||
| 244 | break;
|
||
| 245 | } |
||
| 246 | } |
||
| 247 | if(_23.length<_22){
|
||
| 248 | dojo.publish("/dojox/layout/gridContainer/noEmptyColumn",[this]); |
||
| 249 | } |
||
| 250 | } |
||
| 251 | }else{
|
||
| 252 | if(_22<0){ |
||
| 253 | this._addColumn(Math.abs(_22));
|
||
| 254 | } |
||
| 255 | } |
||
| 256 | if(this.hasResizableColumns){ |
||
| 257 | this._placeGrips();
|
||
| 258 | } |
||
| 259 | } |
||
| 260 | },_addColumn:function(_27){ |
||
| 261 | var _28=this._grid,_29,_2a,_2b,_2c,_2d=(this.mode=="right"),_2e=this.acceptTypes.join(","),m=this._dragManager; |
||
| 262 | if(this.hasResizableColumns&&((!this.isRightFixed&&_2d)||(this.isLeftFixed&&!_2d&&this.nbZones==1))){ |
||
| 263 | this._createGrip(_28.length-1); |
||
| 264 | } |
||
| 265 | for(var i=0;i<_27;i++){ |
||
| 266 | _2a=dojo.create("td",{"class":"gridContainerZone dojoxDndArea","accept":_2e,"id":this.id+"_dz"+this.nbZones}); |
||
| 267 | _2c=_28.length; |
||
| 268 | if(_2d){
|
||
| 269 | if(this.isRightFixed){ |
||
| 270 | _2b=_2c-1;
|
||
| 271 | _28.splice(_2b,0,{"node":_28[_2b].node.parentNode.insertBefore(_2a,_28[_2b].node)}); |
||
| 272 | }else{
|
||
| 273 | _2b=_2c; |
||
| 274 | _28.push({"node":this.gridNode.appendChild(_2a)});
|
||
| 275 | } |
||
| 276 | }else{
|
||
| 277 | if(this.isLeftFixed){ |
||
| 278 | _2b=(_2c==1)?0:1; |
||
| 279 | this._grid.splice(1,0,{"node":this._grid[_2b].node.parentNode.appendChild(_2a,this._grid[_2b].node)}); |
||
| 280 | _2b=1;
|
||
| 281 | }else{
|
||
| 282 | _2b=_2c-this.nbZones;
|
||
| 283 | this._grid.splice(_2b,0,{"node":_28[_2b].node.parentNode.insertBefore(_2a,_28[_2b].node)}); |
||
| 284 | } |
||
| 285 | } |
||
| 286 | if(this.hasResizableColumns){ |
||
| 287 | if((!_2d&&this.nbZones!=1)||(!_2d&&this.nbZones==1&&!this.isLeftFixed)||(_2d&&i<_27-1)||(_2d&&i==_27-1&&this.isRightFixed)){ |
||
| 288 | this._createGrip(_2b);
|
||
| 289 | } |
||
| 290 | } |
||
| 291 | m.registerByNode(_28[_2b].node); |
||
| 292 | this.nbZones++;
|
||
| 293 | } |
||
| 294 | this._updateColumnsWidth(m);
|
||
| 295 | },_deleteColumn:function(_2f){ |
||
| 296 | var _30,_31,_32,_33=0,_34=_2f.length,m=this._dragManager; |
||
| 297 | for(var i=0;i<_34;i++){ |
||
| 298 | _32=(this.mode=="right")?_2f[i]:_2f[i]-_33; |
||
| 299 | _31=this._grid[_32];
|
||
| 300 | if(this.hasResizableColumns&&_31.grip){ |
||
| 301 | dojo.forEach(_31.gripHandler,function(_35){
|
||
| 302 | dojo.disconnect(_35); |
||
| 303 | }); |
||
| 304 | dojo.destroy(this.domNode.removeChild(_31.grip));
|
||
| 305 | _31.grip=null;
|
||
| 306 | } |
||
| 307 | m.unregister(_31.node); |
||
| 308 | dojo.destroy(this.gridNode.removeChild(_31.node));
|
||
| 309 | this._grid.splice(_32,1); |
||
| 310 | this.nbZones--;
|
||
| 311 | _33++; |
||
| 312 | } |
||
| 313 | var _36=this._grid[this.nbZones-1]; |
||
| 314 | if(_36.grip){
|
||
| 315 | dojo.forEach(_36.gripHandler,dojo.disconnect); |
||
| 316 | dojo.destroy(this.domNode.removeChild(_36.grip));
|
||
| 317 | _36.grip=null;
|
||
| 318 | } |
||
| 319 | this._updateColumnsWidth(m);
|
||
| 320 | },_updateColumnsWidth:function(_37){ |
||
| 321 | this.inherited(arguments); |
||
| 322 | _37._dropMode.updateAreas(_37._areaList); |
||
| 323 | },destroy:function(){ |
||
| 324 | dojo.unsubscribe(this._dropHandler);
|
||
| 325 | this.inherited(arguments); |
||
| 326 | }}); |
||
| 327 | } |