root / trunk / web / dojo / dojox / layout / RotatorContainer.js
History | View | Annotate | Download (5.94 KB)
| 1 |
/*
|
|---|---|
| 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.RotatorContainer"]){ |
| 9 |
dojo._hasResource["dojox.layout.RotatorContainer"]=true; |
| 10 |
dojo.provide("dojox.layout.RotatorContainer");
|
| 11 |
dojo.require("dojo.fx");
|
| 12 |
dojo.require("dijit.layout.StackContainer");
|
| 13 |
dojo.require("dijit.layout.StackController");
|
| 14 |
dojo.require("dijit._Widget");
|
| 15 |
dojo.require("dijit._Templated");
|
| 16 |
dojo.require("dijit._Contained");
|
| 17 |
dojo.declare("dojox.layout.RotatorContainer",[dijit.layout.StackContainer,dijit._Templated],{templateString:"<div class=\"dojoxRotatorContainer\"><div dojoAttachPoint=\"tabNode\"></div><div class=\"dojoxRotatorPager\" dojoAttachPoint=\"pagerNode\"></div><div class=\"dojoxRotatorContent\" dojoAttachPoint=\"containerNode\"></div></div>",showTabs:true,transitionDelay:5000,transition:"fade",transitionDuration:1000,autoStart:true,suspendOnHover:false,pauseOnManualChange:null,reverse:false,pagerId:"",cycles:-1,pagerClass:"dojox.layout.RotatorPager",postCreate:function(){ |
| 18 |
this.inherited(arguments); |
| 19 |
dojo.style(this.domNode,"position","relative"); |
| 20 |
if(this.cycles-0==this.cycles&&this.cycles!=-1){ |
| 21 |
this.cycles++;
|
| 22 |
}else{
|
| 23 |
this.cycles=-1; |
| 24 |
} |
| 25 |
if(this.pauseOnManualChange===null){ |
| 26 |
this.pauseOnManualChange=!this.suspendOnHover; |
| 27 |
} |
| 28 |
var id=this.id||"rotator"+(new Date()).getTime(),sc=new dijit.layout.StackController({containerId:id},this.tabNode); |
| 29 |
this.tabNode=sc.domNode;
|
| 30 |
this._stackController=sc;
|
| 31 |
dojo.style(this.tabNode,"display",this.showTabs?"":"none"); |
| 32 |
this.connect(sc,"onButtonClick","_manualChange"); |
| 33 |
this._subscriptions=[dojo.subscribe(this.id+"-cycle",this,"_cycle"),dojo.subscribe(this.id+"-state",this,"_state")]; |
| 34 |
var d=Math.round(this.transitionDelay*0.75); |
| 35 |
if(d<this.transitionDuration){ |
| 36 |
this.transitionDuration=d;
|
| 37 |
} |
| 38 |
if(this.suspendOnHover){ |
| 39 |
this.connect(this.domNode,"onmouseover","_onMouseOver"); |
| 40 |
this.connect(this.domNode,"onmouseout","_onMouseOut"); |
| 41 |
} |
| 42 |
},startup:function(){ |
| 43 |
if(this._started){ |
| 44 |
return;
|
| 45 |
} |
| 46 |
var c=this.getChildren(); |
| 47 |
for(var i=0,_1=c.length;i<_1;i++){ |
| 48 |
if(c[i].declaredClass==this.pagerClass){ |
| 49 |
this.pagerNode.appendChild(c[i].domNode);
|
| 50 |
break;
|
| 51 |
} |
| 52 |
} |
| 53 |
this.inherited(arguments); |
| 54 |
if(this.autoStart){ |
| 55 |
setTimeout(dojo.hitch(this,"_play"),10); |
| 56 |
}else{
|
| 57 |
this._updatePager();
|
| 58 |
} |
| 59 |
},destroy:function(){ |
| 60 |
dojo.forEach(this._subscriptions,dojo.unsubscribe);
|
| 61 |
this.inherited(arguments); |
| 62 |
},_setShowTabsAttr:function(_2){ |
| 63 |
this.showTabs=_2;
|
| 64 |
dojo.style(this.tabNode,"display",_2?"":"none"); |
| 65 |
},_updatePager:function(){ |
| 66 |
var c=this.getChildren(); |
| 67 |
dojo.publish(this.id+"-update",[this._playing,dojo.indexOf(c,this.selectedChildWidget)+1,c.length]); |
| 68 |
},_onMouseOver:function(){ |
| 69 |
this._resetTimer();
|
| 70 |
this._over=true; |
| 71 |
},_onMouseOut:function(){ |
| 72 |
this._over=false; |
| 73 |
if(this._playing){ |
| 74 |
clearTimeout(this._timer);
|
| 75 |
this._timer=setTimeout(dojo.hitch(this,"_play",true),200); |
| 76 |
} |
| 77 |
},_resetTimer:function(){ |
| 78 |
clearTimeout(this._timer);
|
| 79 |
this._timer=null; |
| 80 |
},_cycle:function(_3){ |
| 81 |
if(_3 instanceof Boolean||typeof _3=="boolean"){ |
| 82 |
this._manualChange();
|
| 83 |
} |
| 84 |
var c=this.getChildren(),_4=c.length,i=dojo.indexOf(c,this.selectedChildWidget)+(_3===false||(_3!==true&&this.reverse)?-1:1); |
| 85 |
this.selectChild(c[(i<_4?(i<0?_4-1:i):0)]); |
| 86 |
this._updatePager();
|
| 87 |
},_manualChange:function(){ |
| 88 |
if(this.pauseOnManualChange){ |
| 89 |
this._playing=false; |
| 90 |
} |
| 91 |
this.cycles=-1; |
| 92 |
},_play:function(_5){ |
| 93 |
this._playing=true; |
| 94 |
this._resetTimer();
|
| 95 |
if(_5!==true&&this.cycles>0){ |
| 96 |
this.cycles--;
|
| 97 |
} |
| 98 |
if(this.cycles==0){ |
| 99 |
this._pause();
|
| 100 |
}else{
|
| 101 |
if((!this.suspendOnHover||!this._over)&&this.transitionDelay){ |
| 102 |
this._timer=setTimeout(dojo.hitch(this,"_cycle"),this.selectedChildWidget.domNode.getAttribute("transitionDelay")||this.transitionDelay); |
| 103 |
} |
| 104 |
} |
| 105 |
this._updatePager();
|
| 106 |
},_pause:function(){ |
| 107 |
this._playing=false; |
| 108 |
this._resetTimer();
|
| 109 |
},_state:function(_6){ |
| 110 |
if(_6){
|
| 111 |
this.cycles=-1; |
| 112 |
this._play();
|
| 113 |
}else{
|
| 114 |
this._pause();
|
| 115 |
} |
| 116 |
},_transition:function(_7,_8){ |
| 117 |
this._resetTimer();
|
| 118 |
if(_8&&this.transitionDuration){ |
| 119 |
switch(this.transition){ |
| 120 |
case "fade": |
| 121 |
this._fade(_7,_8);
|
| 122 |
return;
|
| 123 |
} |
| 124 |
} |
| 125 |
this._transitionEnd();
|
| 126 |
this.inherited(arguments); |
| 127 |
},_transitionEnd:function(){ |
| 128 |
if(this._playing){ |
| 129 |
this._play();
|
| 130 |
}else{
|
| 131 |
this._updatePager();
|
| 132 |
} |
| 133 |
},_fade:function(_9,_a){ |
| 134 |
this._styleNode(_a.domNode,1,1); |
| 135 |
this._styleNode(_9.domNode,0,2); |
| 136 |
this._showChild(_9);
|
| 137 |
if(this.doLayout&&_9.resize){ |
| 138 |
_9.resize(this._containerContentBox||this._contentBox); |
| 139 |
} |
| 140 |
var _b={duration:this.transitionDuration},_c=dojo.fx.combine([dojo["fadeOut"](dojo.mixin({node:_a.domNode},_b)),dojo["fadeIn"](dojo.mixin({node:_9.domNode},_b))]); |
| 141 |
this.connect(_c,"onEnd",dojo.hitch(this,function(){ |
| 142 |
this._hideChild(_a);
|
| 143 |
this._transitionEnd();
|
| 144 |
})); |
| 145 |
_c.play(); |
| 146 |
},_styleNode:function(_d,_e,_f){ |
| 147 |
dojo.style(_d,"opacity",_e);
|
| 148 |
dojo.style(_d,"zIndex",_f);
|
| 149 |
dojo.style(_d,"position","absolute"); |
| 150 |
}}); |
| 151 |
dojo.declare("dojox.layout.RotatorPager",[dijit._Widget,dijit._Templated,dijit._Contained],{widgetsInTemplate:true,rotatorId:"",postMixInProperties:function(){ |
| 152 |
this.templateString="<div>"+this.srcNodeRef.innerHTML+"</div>"; |
| 153 |
},postCreate:function(){ |
| 154 |
var p=dijit.byId(this.rotatorId)||this.getParent(); |
| 155 |
if(p&&p.declaredClass=="dojox.layout.RotatorContainer"){ |
| 156 |
if(this.previous){ |
| 157 |
dojo.connect(this.previous,"onClick",function(){ |
| 158 |
dojo.publish(p.id+"-cycle",[false]); |
| 159 |
}); |
| 160 |
} |
| 161 |
if(this.next){ |
| 162 |
dojo.connect(this.next,"onClick",function(){ |
| 163 |
dojo.publish(p.id+"-cycle",[true]); |
| 164 |
}); |
| 165 |
} |
| 166 |
if(this.playPause){ |
| 167 |
dojo.connect(this.playPause,"onClick",function(){ |
| 168 |
this.set("label",this.checked?"Pause":"Play"); |
| 169 |
dojo.publish(p.id+"-state",[this.checked]); |
| 170 |
}); |
| 171 |
} |
| 172 |
this._subscriptions=[dojo.subscribe(p.id+"-state",this,"_state"),dojo.subscribe(p.id+"-update",this,"_update")]; |
| 173 |
} |
| 174 |
},destroy:function(){ |
| 175 |
dojo.forEach(this._subscriptions,dojo.unsubscribe);
|
| 176 |
this.inherited(arguments); |
| 177 |
},_state:function(_10){ |
| 178 |
if(this.playPause&&this.playPause.checked!=_10){ |
| 179 |
this.playPause.attr("label",_10?"Pause":"Play"); |
| 180 |
this.playPause.attr("checked",_10); |
| 181 |
} |
| 182 |
},_update:function(_11,_12,_13){ |
| 183 |
this._state(_11);
|
| 184 |
if(this.current&&_12){ |
| 185 |
this.current.innerHTML=_12;
|
| 186 |
} |
| 187 |
if(this.total&&_13){ |
| 188 |
this.total.innerHTML=_13;
|
| 189 |
} |
| 190 |
}}); |
| 191 |
} |