lib/dijit/form/HorizontalSlider.js

   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["dijit.form.HorizontalSlider"]){
   9 dojo._hasResource["dijit.form.HorizontalSlider"]=true;
  10 dojo.provide("dijit.form.HorizontalSlider");
  11 dojo.require("dijit.form._FormWidget");
  12 dojo.require("dijit._Container");
  13 dojo.require("dojo.dnd.move");
  14 dojo.require("dijit.form.Button");
  15 dojo.require("dojo.number");
  16 dojo.require("dojo._base.fx");
  17 dojo.declare("dijit.form.HorizontalSlider",[dijit.form._FormValueWidget,dijit._Container],{templateString:dojo.cache("dijit.form","templates/HorizontalSlider.html","<table class=\"dijit dijitReset dijitSlider dijitSliderH\" cellspacing=\"0\" cellpadding=\"0\" border=\"0\" rules=\"none\" dojoAttachEvent=\"onkeypress:_onKeyPress,onkeyup:_onKeyUp\"\n\t><tr class=\"dijitReset\"\n\t\t><td class=\"dijitReset\" colspan=\"2\"></td\n\t\t><td dojoAttachPoint=\"topDecoration\" class=\"dijitReset dijitSliderDecoration dijitSliderDecorationT dijitSliderDecorationH\"></td\n\t\t><td class=\"dijitReset\" colspan=\"2\"></td\n\t></tr\n\t><tr class=\"dijitReset\"\n\t\t><td class=\"dijitReset dijitSliderButtonContainer dijitSliderButtonContainerH\"\n\t\t\t><div class=\"dijitSliderDecrementIconH\" tabIndex=\"-1\" style=\"display:none\" dojoAttachPoint=\"decrementButton\"><span class=\"dijitSliderButtonInner\">-</span></div\n\t\t></td\n\t\t><td class=\"dijitReset\"\n\t\t\t><div class=\"dijitSliderBar dijitSliderBumper dijitSliderBumperH dijitSliderLeftBumper\" dojoAttachEvent=\"onmousedown:_onClkDecBumper\"></div\n\t\t></td\n\t\t><td class=\"dijitReset\"\n\t\t\t><input dojoAttachPoint=\"valueNode\" type=\"hidden\" ${!nameAttrSetting}\n\t\t\t/><div class=\"dijitReset dijitSliderBarContainerH\" waiRole=\"presentation\" dojoAttachPoint=\"sliderBarContainer\"\n\t\t\t\t><div waiRole=\"presentation\" dojoAttachPoint=\"progressBar\" class=\"dijitSliderBar dijitSliderBarH dijitSliderProgressBar dijitSliderProgressBarH\" dojoAttachEvent=\"onmousedown:_onBarClick\"\n\t\t\t\t\t><div class=\"dijitSliderMoveable dijitSliderMoveableH\"\n\t\t\t\t\t\t><div dojoAttachPoint=\"sliderHandle,focusNode\" class=\"dijitSliderImageHandle dijitSliderImageHandleH\" dojoAttachEvent=\"onmousedown:_onHandleClick\" waiRole=\"slider\" valuemin=\"${minimum}\" valuemax=\"${maximum}\"></div\n\t\t\t\t\t></div\n\t\t\t\t></div\n\t\t\t\t><div waiRole=\"presentation\" dojoAttachPoint=\"remainingBar\" class=\"dijitSliderBar dijitSliderBarH dijitSliderRemainingBar dijitSliderRemainingBarH\" dojoAttachEvent=\"onmousedown:_onBarClick\"></div\n\t\t\t></div\n\t\t></td\n\t\t><td class=\"dijitReset\"\n\t\t\t><div class=\"dijitSliderBar dijitSliderBumper dijitSliderBumperH dijitSliderRightBumper\" dojoAttachEvent=\"onmousedown:_onClkIncBumper\"></div\n\t\t></td\n\t\t><td class=\"dijitReset dijitSliderButtonContainer dijitSliderButtonContainerH\"\n\t\t\t><div class=\"dijitSliderIncrementIconH\" tabIndex=\"-1\" style=\"display:none\" dojoAttachPoint=\"incrementButton\"><span class=\"dijitSliderButtonInner\">+</span></div\n\t\t></td\n\t></tr\n\t><tr class=\"dijitReset\"\n\t\t><td class=\"dijitReset\" colspan=\"2\"></td\n\t\t><td dojoAttachPoint=\"containerNode,bottomDecoration\" class=\"dijitReset dijitSliderDecoration dijitSliderDecorationB dijitSliderDecorationH\"></td\n\t\t><td class=\"dijitReset\" colspan=\"2\"></td\n\t></tr\n></table>\n"),value:0,showButtons:true,minimum:0,maximum:100,discreteValues:Infinity,pageIncrement:2,clickSelect:true,slideDuration:dijit.defaultDuration,widgetsInTemplate:true,attributeMap:dojo.delegate(dijit.form._FormWidget.prototype.attributeMap,{id:""}),baseClass:"dijitSlider",cssStateNodes:{incrementButton:"dijitSliderIncrementButton",decrementButton:"dijitSliderDecrementButton",focusNode:"dijitSliderThumb"},_mousePixelCoord:"pageX",_pixelCount:"w",_startingPixelCoord:"x",_startingPixelCount:"l",_handleOffsetCoord:"left",_progressPixelSize:"width",_onKeyUp:function(e){
  18 if(this.disabled||this.readOnly||e.altKey||e.ctrlKey||e.metaKey){
  19 return;
  20 }
  21 this._setValueAttr(this.value,true);
  22 },_onKeyPress:function(e){
  23 if(this.disabled||this.readOnly||e.altKey||e.ctrlKey||e.metaKey){
  24 return;
  25 }
  26 switch(e.charOrCode){
  27 case dojo.keys.HOME:
  28 this._setValueAttr(this.minimum,false);
  29 break;
  30 case dojo.keys.END:
  31 this._setValueAttr(this.maximum,false);
  32 break;
  33 case ((this._descending||this.isLeftToRight())?dojo.keys.RIGHT_ARROW:dojo.keys.LEFT_ARROW):
  34 case (this._descending===false?dojo.keys.DOWN_ARROW:dojo.keys.UP_ARROW):
  35 case (this._descending===false?dojo.keys.PAGE_DOWN:dojo.keys.PAGE_UP):
  36 this.increment(e);
  37 break;
  38 case ((this._descending||this.isLeftToRight())?dojo.keys.LEFT_ARROW:dojo.keys.RIGHT_ARROW):
  39 case (this._descending===false?dojo.keys.UP_ARROW:dojo.keys.DOWN_ARROW):
  40 case (this._descending===false?dojo.keys.PAGE_UP:dojo.keys.PAGE_DOWN):
  41 this.decrement(e);
  42 break;
  43 default:
  44 return;
  45 }
  46 dojo.stopEvent(e);
  47 },_onHandleClick:function(e){
  48 if(this.disabled||this.readOnly){
  49 return;
  50 }
  51 if(!dojo.isIE){
  52 dijit.focus(this.sliderHandle);
  53 }
  54 dojo.stopEvent(e);
  55 },_isReversed:function(){
  56 return !this.isLeftToRight();
  57 },_onBarClick:function(e){
  58 if(this.disabled||this.readOnly||!this.clickSelect){
  59 return;
  60 }
  61 dijit.focus(this.sliderHandle);
  62 dojo.stopEvent(e);
  63 var _1=dojo.position(this.sliderBarContainer,true);
  64 var _2=e[this._mousePixelCoord]-_1[this._startingPixelCoord];
  65 this._setPixelValue(this._isReversed()?(_1[this._pixelCount]-_2):_2,_1[this._pixelCount],true);
  66 this._movable.onMouseDown(e);
  67 },_setPixelValue:function(_3,_4,_5){
  68 if(this.disabled||this.readOnly){
  69 return;
  70 }
  71 _3=_3<0?0:_4<_3?_4:_3;
  72 var _6=this.discreteValues;
  73 if(_6<=1||_6==Infinity){
  74 _6=_4;
  75 }
  76 _6--;
  77 var _7=_4/_6;
  78 var _8=Math.round(_3/_7);
  79 this._setValueAttr((this.maximum-this.minimum)*_8/_6+this.minimum,_5);
  80 },_setValueAttr:function(_9,_a){
  81 this.valueNode.value=this.value=_9;
  82 dijit.setWaiState(this.focusNode,"valuenow",_9);
  83 this.inherited(arguments);
  84 var _b=(_9-this.minimum)/(this.maximum-this.minimum);
  85 var _c=(this._descending===false)?this.remainingBar:this.progressBar;
  86 var _d=(this._descending===false)?this.progressBar:this.remainingBar;
  87 if(this._inProgressAnim&&this._inProgressAnim.status!="stopped"){
  88 this._inProgressAnim.stop(true);
  89 }
  90 if(_a&&this.slideDuration>0&&_c.style[this._progressPixelSize]){
  91 var _e=this;
  92 var _f={};
  93 var _10=parseFloat(_c.style[this._progressPixelSize]);
  94 var _11=this.slideDuration*(_b-_10/100);
  95 if(_11==0){
  96 return;
  97 }
  98 if(_11<0){
  99 _11=0-_11;
 100 }
 101 _f[this._progressPixelSize]={start:_10,end:_b*100,units:"%"};
 102 this._inProgressAnim=dojo.animateProperty({node:_c,duration:_11,onAnimate:function(v){
 103 _d.style[_e._progressPixelSize]=(100-parseFloat(v[_e._progressPixelSize]))+"%";
 104 },onEnd:function(){
 105 delete _e._inProgressAnim;
 106 },properties:_f});
 107 this._inProgressAnim.play();
 108 }else{
 109 _c.style[this._progressPixelSize]=(_b*100)+"%";
 110 _d.style[this._progressPixelSize]=((1-_b)*100)+"%";
 111 }
 112 },_bumpValue:function(_12,_13){
 113 if(this.disabled||this.readOnly){
 114 return;
 115 }
 116 var s=dojo.getComputedStyle(this.sliderBarContainer);
 117 var c=dojo._getContentBox(this.sliderBarContainer,s);
 118 var _14=this.discreteValues;
 119 if(_14<=1||_14==Infinity){
 120 _14=c[this._pixelCount];
 121 }
 122 _14--;
 123 var _15=(this.value-this.minimum)*_14/(this.maximum-this.minimum)+_12;
 124 if(_15<0){
 125 _15=0;
 126 }
 127 if(_15>_14){
 128 _15=_14;
 129 }
 130 _15=_15*(this.maximum-this.minimum)/_14+this.minimum;
 131 this._setValueAttr(_15,_13);
 132 },_onClkBumper:function(val){
 133 if(this.disabled||this.readOnly||!this.clickSelect){
 134 return;
 135 }
 136 this._setValueAttr(val,true);
 137 },_onClkIncBumper:function(){
 138 this._onClkBumper(this._descending===false?this.minimum:this.maximum);
 139 },_onClkDecBumper:function(){
 140 this._onClkBumper(this._descending===false?this.maximum:this.minimum);
 141 },decrement:function(e){
 142 this._bumpValue(e.charOrCode==dojo.keys.PAGE_DOWN?-this.pageIncrement:-1);
 143 },increment:function(e){
 144 this._bumpValue(e.charOrCode==dojo.keys.PAGE_UP?this.pageIncrement:1);
 145 },_mouseWheeled:function(evt){
 146 dojo.stopEvent(evt);
 147 var _16=!dojo.isMozilla;
 148 var _17=evt[(_16?"wheelDelta":"detail")]*(_16?1:-1);
 149 this._bumpValue(_17<0?-1:1,true);
 150 },startup:function(){
 151 if(this._started){
 152 return;
 153 }
 154 dojo.forEach(this.getChildren(),function(_18){
 155 if(this[_18.container]!=this.containerNode){
 156 this[_18.container].appendChild(_18.domNode);
 157 }
 158 },this);
 159 this.inherited(arguments);
 160 },_typematicCallback:function(_19,_1a,e){
 161 if(_19==-1){
 162 this._setValueAttr(this.value,true);
 163 }else{
 164 this[(_1a==(this._descending?this.incrementButton:this.decrementButton))?"decrement":"increment"](e);
 165 }
 166 },postCreate:function(){
 167 if(this.showButtons){
 168 this.incrementButton.style.display="";
 169 this.decrementButton.style.display="";
 170 this._connects.push(dijit.typematic.addMouseListener(this.decrementButton,this,"_typematicCallback",25,500));
 171 this._connects.push(dijit.typematic.addMouseListener(this.incrementButton,this,"_typematicCallback",25,500));
 172 }
 173 this.connect(this.domNode,!dojo.isMozilla?"onmousewheel":"DOMMouseScroll","_mouseWheeled");
 174 var _1b=dojo.declare(dijit.form._SliderMover,{widget:this});
 175 this._movable=new dojo.dnd.Moveable(this.sliderHandle,{mover:_1b});
 176 var _1c=dojo.query("label[for=\""+this.id+"\"]");
 177 if(_1c.length){
 178 _1c[0].id=(this.id+"_label");
 179 dijit.setWaiState(this.focusNode,"labelledby",_1c[0].id);
 180 }
 181 dijit.setWaiState(this.focusNode,"valuemin",this.minimum);
 182 dijit.setWaiState(this.focusNode,"valuemax",this.maximum);
 183 this.inherited(arguments);
 184 this._layoutHackIE7();
 185 },destroy:function(){
 186 this._movable.destroy();
 187 if(this._inProgressAnim&&this._inProgressAnim.status!="stopped"){
 188 this._inProgressAnim.stop(true);
 189 }
 190 this._supportingWidgets=dijit.findWidgets(this.domNode);
 191 this.inherited(arguments);
 192 }});
 193 dojo.declare("dijit.form._SliderMover",dojo.dnd.Mover,{onMouseMove:function(e){
 194 var _1d=this.widget;
 195 var _1e=_1d._abspos;
 196 if(!_1e){
 197 _1e=_1d._abspos=dojo.position(_1d.sliderBarContainer,true);
 198 _1d._setPixelValue_=dojo.hitch(_1d,"_setPixelValue");
 199 _1d._isReversed_=_1d._isReversed();
 200 }
 201 var _1f=e[_1d._mousePixelCoord]-_1e[_1d._startingPixelCoord];
 202 _1d._setPixelValue_(_1d._isReversed_?(_1e[_1d._pixelCount]-_1f):_1f,_1e[_1d._pixelCount],false);
 203 },destroy:function(e){
 204 dojo.dnd.Mover.prototype.destroy.apply(this,arguments);
 205 var _20=this.widget;
 206 _20._abspos=null;
 207 _20._setValueAttr(_20.value,true);
 208 }});
 209 }