root / trunk / web / dojo / dojox / layout / RadioGroup.js @ 12
History | View | Annotate | Download (4.58 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.RadioGroup"]){ |
||
| 9 | dojo._hasResource["dojox.layout.RadioGroup"]=true; |
||
| 10 | dojo.provide("dojox.layout.RadioGroup");
|
||
| 11 | dojo.experimental("dojox.layout.RadioGroup");
|
||
| 12 | dojo.require("dijit._Widget");
|
||
| 13 | dojo.require("dijit._Templated");
|
||
| 14 | dojo.require("dijit._Contained");
|
||
| 15 | dojo.require("dijit.layout.StackContainer");
|
||
| 16 | dojo.require("dojo.fx.easing");
|
||
| 17 | dojo.declare("dojox.layout.RadioGroup",[dijit.layout.StackContainer,dijit._Templated],{duration:750,hasButtons:false,buttonClass:"dojox.layout._RadioButton",templateString:"<div class=\"dojoxRadioGroup\">"+" \t<div dojoAttachPoint=\"buttonHolder\" style=\"display:none;\">"+"\t\t<table class=\"dojoxRadioButtons\"><tbody><tr class=\"dojoxRadioButtonRow\" dojoAttachPoint=\"buttonNode\"></tr></tbody></table>"+"\t</div>"+"\t<div class=\"dojoxRadioView\" dojoAttachPoint=\"containerNode\"></div>"+"</div>",startup:function(){ |
||
| 18 | this.inherited(arguments); |
||
| 19 | this._children=this.getChildren(); |
||
| 20 | this._buttons=this._children.length; |
||
| 21 | this._size=dojo.coords(this.containerNode); |
||
| 22 | if(this.hasButtons){ |
||
| 23 | dojo.style(this.buttonHolder,"display","block"); |
||
| 24 | } |
||
| 25 | },_setupChild:function(_1){ |
||
| 26 | if(this.hasButtons){ |
||
| 27 | dojo.style(_1.domNode,"position","absolute"); |
||
| 28 | var _2=this.buttonNode.appendChild(dojo.create("td")); |
||
| 29 | var n=dojo.create("div",null,_2),_3=dojo.getObject(this.buttonClass),_4=new _3({label:_1.title,page:_1},n); |
||
| 30 | dojo.mixin(_1,{_radioButton:_4});
|
||
| 31 | _4.startup(); |
||
| 32 | } |
||
| 33 | _1.domNode.style.display="none";
|
||
| 34 | },removeChild:function(_5){ |
||
| 35 | if(this.hasButtons&&_5._radioButton){ |
||
| 36 | _5._radioButton.destroy(); |
||
| 37 | delete _5._radioButton;
|
||
| 38 | } |
||
| 39 | this.inherited(arguments); |
||
| 40 | },_transition:function(_6,_7){ |
||
| 41 | this._showChild(_6);
|
||
| 42 | if(_7){
|
||
| 43 | this._hideChild(_7);
|
||
| 44 | } |
||
| 45 | if(this.doLayout&&_6.resize){ |
||
| 46 | _6.resize(this._containerContentBox||this._contentBox); |
||
| 47 | } |
||
| 48 | },_showChild:function(_8){ |
||
| 49 | var _9=this.getChildren(); |
||
| 50 | _8.isFirstChild=(_8==_9[0]);
|
||
| 51 | _8.isLastChild=(_8==_9[_9.length-1]);
|
||
| 52 | _8.selected=true;
|
||
| 53 | _8.domNode.style.display="";
|
||
| 54 | if(_8._onShow){
|
||
| 55 | _8._onShow(); |
||
| 56 | }else{
|
||
| 57 | if(_8.onShow){
|
||
| 58 | _8.onShow(); |
||
| 59 | } |
||
| 60 | } |
||
| 61 | },_hideChild:function(_a){ |
||
| 62 | _a.selected=false;
|
||
| 63 | _a.domNode.style.display="none";
|
||
| 64 | if(_a.onHide){
|
||
| 65 | _a.onHide(); |
||
| 66 | } |
||
| 67 | }}); |
||
| 68 | dojo.declare("dojox.layout.RadioGroupFade",dojox.layout.RadioGroup,{_hideChild:function(_b){ |
||
| 69 | dojo.fadeOut({node:_b.domNode,duration:this.duration,onEnd:dojo.hitch(this,"inherited",arguments,arguments)}).play();
|
||
| 70 | },_showChild:function(_c){ |
||
| 71 | this.inherited(arguments); |
||
| 72 | dojo.style(_c.domNode,"opacity",0); |
||
| 73 | dojo.fadeIn({node:_c.domNode,duration:this.duration}).play();
|
||
| 74 | }}); |
||
| 75 | dojo.declare("dojox.layout.RadioGroupSlide",dojox.layout.RadioGroup,{easing:"dojo.fx.easing.backOut",zTop:99,constructor:function(){ |
||
| 76 | if(dojo.isString(this.easing)){ |
||
| 77 | this.easing=dojo.getObject(this.easing); |
||
| 78 | } |
||
| 79 | },_positionChild:function(_d){ |
||
| 80 | if(!this._size){ |
||
| 81 | return;
|
||
| 82 | } |
||
| 83 | var rA=true,rB=true; |
||
| 84 | switch(_d.slideFrom){
|
||
| 85 | case "bottom": |
||
| 86 | rB=!rB; |
||
| 87 | break;
|
||
| 88 | case "right": |
||
| 89 | rA=!rA; |
||
| 90 | rB=!rB; |
||
| 91 | break;
|
||
| 92 | case "top": |
||
| 93 | break;
|
||
| 94 | case "left": |
||
| 95 | rA=!rA; |
||
| 96 | break;
|
||
| 97 | default:
|
||
| 98 | rA=Math.round(Math.random()); |
||
| 99 | rB=Math.round(Math.random()); |
||
| 100 | break;
|
||
| 101 | } |
||
| 102 | var _e=rA?"top":"left",_f=(rB?"-":"")+(this._size[rA?"h":"w"]+20)+"px"; |
||
| 103 | dojo.style(_d.domNode,_e,_f); |
||
| 104 | },_showChild:function(_10){ |
||
| 105 | var _11=this.getChildren(); |
||
| 106 | _10.isFirstChild=(_10==_11[0]);
|
||
| 107 | _10.isLastChild=(_10==_11[_11.length-1]);
|
||
| 108 | _10.selected=true;
|
||
| 109 | dojo.style(_10.domNode,{zIndex:this.zTop,display:""});
|
||
| 110 | if(this._anim&&this._anim.status()=="playing"){ |
||
| 111 | this._anim.gotoPercent(100,true); |
||
| 112 | } |
||
| 113 | this._anim=dojo.animateProperty({node:_10.domNode,properties:{left:0,top:0},duration:this.duration,easing:this.easing,onEnd:dojo.hitch(_10,function(){ |
||
| 114 | if(this.onShow){ |
||
| 115 | this.onShow();
|
||
| 116 | } |
||
| 117 | if(this._onShow){ |
||
| 118 | this._onShow();
|
||
| 119 | } |
||
| 120 | }),beforeBegin:dojo.hitch(this,"_positionChild",_10)}); |
||
| 121 | this._anim.play();
|
||
| 122 | },_hideChild:function(_12){ |
||
| 123 | _12.selected=false;
|
||
| 124 | _12.domNode.style.zIndex=this.zTop-1; |
||
| 125 | if(_12.onHide){
|
||
| 126 | _12.onHide(); |
||
| 127 | } |
||
| 128 | }}); |
||
| 129 | dojo.declare("dojox.layout._RadioButton",[dijit._Widget,dijit._Templated,dijit._Contained],{label:"",page:null,templateString:"<div dojoAttachPoint=\"focusNode\" class=\"dojoxRadioButton\"><span dojoAttachPoint=\"titleNode\" class=\"dojoxRadioButtonLabel\">${label}</span></div>",startup:function(){ |
||
| 130 | this.connect(this.domNode,"onmouseenter","_onMouse"); |
||
| 131 | },_onMouse:function(e){ |
||
| 132 | this.getParent().selectChild(this.page); |
||
| 133 | this._clearSelected();
|
||
| 134 | dojo.addClass(this.domNode,"dojoxRadioButtonSelected"); |
||
| 135 | },_clearSelected:function(){ |
||
| 136 | dojo.query(".dojoxRadioButtonSelected",this.domNode.parentNode.parentNode).removeClass("dojoxRadioButtonSelected"); |
||
| 137 | }}); |
||
| 138 | dojo.extend(dijit._Widget,{slideFrom:"random"});
|
||
| 139 | } |