Project

General

Profile

Statistics
| Revision:

root / trunk / web / dojo / dijit / layout / ScrollingTabController.js @ 13

History | View | Annotate | Download (8.65 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["dijit.layout.ScrollingTabController"]){
9
dojo._hasResource["dijit.layout.ScrollingTabController"]=true;
10
dojo.provide("dijit.layout.ScrollingTabController");
11
dojo.require("dijit.layout.TabController");
12
dojo.require("dijit.Menu");
13
dojo.declare("dijit.layout.ScrollingTabController",dijit.layout.TabController,{templateString:dojo.cache("dijit.layout","templates/ScrollingTabController.html","<div class=\"dijitTabListContainer-${tabPosition}\" style=\"visibility:hidden\">\n\t<div dojoType=\"dijit.layout._ScrollingTabControllerButton\"\n\t\t\tclass=\"tabStripButton-${tabPosition}\"\n\t\t\tid=\"${id}_menuBtn\" iconClass=\"dijitTabStripMenuIcon\"\n\t\t\tdojoAttachPoint=\"_menuBtn\" showLabel=false>&#9660;</div>\n\t<div dojoType=\"dijit.layout._ScrollingTabControllerButton\"\n\t\t\tclass=\"tabStripButton-${tabPosition}\"\n\t\t\tid=\"${id}_leftBtn\" iconClass=\"dijitTabStripSlideLeftIcon\"\n\t\t\tdojoAttachPoint=\"_leftBtn\" dojoAttachEvent=\"onClick: doSlideLeft\" showLabel=false>&#9664;</div>\n\t<div dojoType=\"dijit.layout._ScrollingTabControllerButton\"\n\t\t\tclass=\"tabStripButton-${tabPosition}\"\n\t\t\tid=\"${id}_rightBtn\" iconClass=\"dijitTabStripSlideRightIcon\"\n\t\t\tdojoAttachPoint=\"_rightBtn\" dojoAttachEvent=\"onClick: doSlideRight\" showLabel=false>&#9654;</div>\n\t<div class='dijitTabListWrapper' dojoAttachPoint='tablistWrapper'>\n\t\t<div wairole='tablist' dojoAttachEvent='onkeypress:onkeypress'\n\t\t\t\tdojoAttachPoint='containerNode' class='nowrapTabStrip'></div>\n\t</div>\n</div>\n"),useMenu:true,useSlider:true,tabStripClass:"",widgetsInTemplate:true,_minScroll:5,attributeMap:dojo.delegate(dijit._Widget.prototype.attributeMap,{"class":"containerNode"}),postCreate:function(){
14
this.inherited(arguments);
15
var n=this.domNode;
16
this.scrollNode=this.tablistWrapper;
17
this._initButtons();
18
if(!this.tabStripClass){
19
this.tabStripClass="dijitTabContainer"+this.tabPosition.charAt(0).toUpperCase()+this.tabPosition.substr(1).replace(/-.*/,"")+"None";
20
dojo.addClass(n,"tabStrip-disabled");
21
}
22
dojo.addClass(this.tablistWrapper,this.tabStripClass);
23
},onStartup:function(){
24
this.inherited(arguments);
25
dojo.style(this.domNode,"visibility","visible");
26
this._postStartup=true;
27
},onAddChild:function(_1,_2){
28
this.inherited(arguments);
29
var _3;
30
if(this.useMenu){
31
var _4=this.containerId;
32
_3=new dijit.MenuItem({id:_1.id+"_stcMi",label:_1.title,dir:_1.dir,lang:_1.lang,onClick:dojo.hitch(this,function(){
33
var _5=dijit.byId(_4);
34
_5.selectChild(_1);
35
})});
36
this._menuChildren[_1.id]=_3;
37
this._menu.addChild(_3,_2);
38
}
39
this.pane2handles[_1.id].push(this.connect(this.pane2button[_1.id],"set",function(_6,_7){
40
if(this._postStartup){
41
if(_6=="label"){
42
if(_3){
43
_3.set(_6,_7);
44
}
45
if(this._dim){
46
this.resize(this._dim);
47
}
48
}
49
}
50
}));
51
dojo.style(this.containerNode,"width",(dojo.style(this.containerNode,"width")+200)+"px");
52
},onRemoveChild:function(_8,_9){
53
var _a=this.pane2button[_8.id];
54
if(this._selectedTab===_a.domNode){
55
this._selectedTab=null;
56
}
57
if(this.useMenu&&_8&&_8.id&&this._menuChildren[_8.id]){
58
this._menu.removeChild(this._menuChildren[_8.id]);
59
this._menuChildren[_8.id].destroy();
60
delete this._menuChildren[_8.id];
61
}
62
this.inherited(arguments);
63
},_initButtons:function(){
64
this._menuChildren={};
65
this._btnWidth=0;
66
this._buttons=dojo.query("> .tabStripButton",this.domNode).filter(function(_b){
67
if((this.useMenu&&_b==this._menuBtn.domNode)||(this.useSlider&&(_b==this._rightBtn.domNode||_b==this._leftBtn.domNode))){
68
this._btnWidth+=dojo.marginBox(_b).w;
69
return true;
70
}else{
71
dojo.style(_b,"display","none");
72
return false;
73
}
74
},this);
75
if(this.useMenu){
76
this._menu=new dijit.Menu({id:this.id+"_menu",dir:this.dir,lang:this.lang,targetNodeIds:[this._menuBtn.domNode],leftClickToOpen:true,refocus:false});
77
this._supportingWidgets.push(this._menu);
78
}
79
},_getTabsWidth:function(){
80
var _c=this.getChildren();
81
if(_c.length){
82
var _d=_c[this.isLeftToRight()?0:_c.length-1].domNode,_e=_c[this.isLeftToRight()?_c.length-1:0].domNode;
83
return _e.offsetLeft+dojo.style(_e,"width")-_d.offsetLeft;
84
}else{
85
return 0;
86
}
87
},_enableBtn:function(_f){
88
var _10=this._getTabsWidth();
89
_f=_f||dojo.style(this.scrollNode,"width");
90
return _10>0&&_f<_10;
91
},resize:function(dim){
92
if(this.domNode.offsetWidth==0){
93
return;
94
}
95
this._dim=dim;
96
this.scrollNode.style.height="auto";
97
this._contentBox=dijit.layout.marginBox2contentBox(this.domNode,{h:0,w:dim.w});
98
this._contentBox.h=this.scrollNode.offsetHeight;
99
dojo.contentBox(this.domNode,this._contentBox);
100
var _11=this._enableBtn(this._contentBox.w);
101
this._buttons.style("display",_11?"":"none");
102
this._leftBtn.layoutAlign="left";
103
this._rightBtn.layoutAlign="right";
104
this._menuBtn.layoutAlign=this.isLeftToRight()?"right":"left";
105
dijit.layout.layoutChildren(this.domNode,this._contentBox,[this._menuBtn,this._leftBtn,this._rightBtn,{domNode:this.scrollNode,layoutAlign:"client"}]);
106
if(this._selectedTab){
107
if(this._anim&&this._anim.status()=="playing"){
108
this._anim.stop();
109
}
110
var w=this.scrollNode,sl=this._convertToScrollLeft(this._getScrollForSelectedTab());
111
w.scrollLeft=sl;
112
}
113
this._setButtonClass(this._getScroll());
114
this._postResize=true;
115
},_getScroll:function(){
116
var sl=(this.isLeftToRight()||dojo.isIE<8||(dojo.isIE&&dojo.isQuirks)||dojo.isWebKit)?this.scrollNode.scrollLeft:dojo.style(this.containerNode,"width")-dojo.style(this.scrollNode,"width")+(dojo.isIE==8?-1:1)*this.scrollNode.scrollLeft;
117
return sl;
118
},_convertToScrollLeft:function(val){
119
if(this.isLeftToRight()||dojo.isIE<8||(dojo.isIE&&dojo.isQuirks)||dojo.isWebKit){
120
return val;
121
}else{
122
var _12=dojo.style(this.containerNode,"width")-dojo.style(this.scrollNode,"width");
123
return (dojo.isIE==8?-1:1)*(val-_12);
124
}
125
},onSelectChild:function(_13){
126
var tab=this.pane2button[_13.id];
127
if(!tab||!_13){
128
return;
129
}
130
var _14=tab.domNode;
131
if(this._postResize&&_14!=this._selectedTab){
132
this._selectedTab=_14;
133
var sl=this._getScroll();
134
if(sl>_14.offsetLeft||sl+dojo.style(this.scrollNode,"width")<_14.offsetLeft+dojo.style(_14,"width")){
135
this.createSmoothScroll().play();
136
}
137
}
138
this.inherited(arguments);
139
},_getScrollBounds:function(){
140
var _15=this.getChildren(),_16=dojo.style(this.scrollNode,"width"),_17=dojo.style(this.containerNode,"width"),_18=_17-_16,_19=this._getTabsWidth();
141
if(_15.length&&_19>_16){
142
return {min:this.isLeftToRight()?0:_15[_15.length-1].domNode.offsetLeft,max:this.isLeftToRight()?(_15[_15.length-1].domNode.offsetLeft+dojo.style(_15[_15.length-1].domNode,"width"))-_16:_18};
143
}else{
144
var _1a=this.isLeftToRight()?0:_18;
145
return {min:_1a,max:_1a};
146
}
147
},_getScrollForSelectedTab:function(){
148
var w=this.scrollNode,n=this._selectedTab,_1b=dojo.style(this.scrollNode,"width"),_1c=this._getScrollBounds();
149
var pos=(n.offsetLeft+dojo.style(n,"width")/2)-_1b/2;
150
pos=Math.min(Math.max(pos,_1c.min),_1c.max);
151
return pos;
152
},createSmoothScroll:function(x){
153
if(arguments.length>0){
154
var _1d=this._getScrollBounds();
155
x=Math.min(Math.max(x,_1d.min),_1d.max);
156
}else{
157
x=this._getScrollForSelectedTab();
158
}
159
if(this._anim&&this._anim.status()=="playing"){
160
this._anim.stop();
161
}
162
var _1e=this,w=this.scrollNode,_1f=new dojo._Animation({beforeBegin:function(){
163
if(this.curve){
164
delete this.curve;
165
}
166
var _20=w.scrollLeft,_21=_1e._convertToScrollLeft(x);
167
_1f.curve=new dojo._Line(_20,_21);
168
},onAnimate:function(val){
169
w.scrollLeft=val;
170
}});
171
this._anim=_1f;
172
this._setButtonClass(x);
173
return _1f;
174
},_getBtnNode:function(e){
175
var n=e.target;
176
while(n&&!dojo.hasClass(n,"tabStripButton")){
177
n=n.parentNode;
178
}
179
return n;
180
},doSlideRight:function(e){
181
this.doSlide(1,this._getBtnNode(e));
182
},doSlideLeft:function(e){
183
this.doSlide(-1,this._getBtnNode(e));
184
},doSlide:function(_22,_23){
185
if(_23&&dojo.hasClass(_23,"dijitTabDisabled")){
186
return;
187
}
188
var _24=dojo.style(this.scrollNode,"width");
189
var d=(_24*0.75)*_22;
190
var to=this._getScroll()+d;
191
this._setButtonClass(to);
192
this.createSmoothScroll(to).play();
193
},_setButtonClass:function(_25){
194
var _26=this._getScrollBounds();
195
this._leftBtn.set("disabled",_25<=_26.min);
196
this._rightBtn.set("disabled",_25>=_26.max);
197
}});
198
dojo.declare("dijit.layout._ScrollingTabControllerButton",dijit.form.Button,{baseClass:"dijitTab tabStripButton",templateString:dojo.cache("dijit.layout","templates/_ScrollingTabControllerButton.html","<div dojoAttachEvent=\"onclick:_onButtonClick\">\n\t<div waiRole=\"presentation\" class=\"dijitTabInnerDiv\" dojoattachpoint=\"innerDiv,focusNode\">\n\t\t<div waiRole=\"presentation\" class=\"dijitTabContent dijitButtonContents\" dojoattachpoint=\"tabContent\">\n\t\t\t<img waiRole=\"presentation\" alt=\"\" src=\"${_blankGif}\" class=\"dijitTabStripIcon\" dojoAttachPoint=\"iconNode\"/>\n\t\t\t<span dojoAttachPoint=\"containerNode,titleNode\" class=\"dijitButtonText\"></span>\n\t\t</div>\n\t</div>\n</div>\n"),tabIndex:"-1"});
199
}