root / trunk / web / dojo / dojox / widget / gauge / _Gauge.js
History | View | Annotate | Download (9.01 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.widget.gauge._Gauge"]){ |
||
| 9 | dojo._hasResource["dojox.widget.gauge._Gauge"]=true; |
||
| 10 | dojo.provide("dojox.widget.gauge._Gauge");
|
||
| 11 | dojo.require("dijit._Widget");
|
||
| 12 | dojo.require("dijit._Templated");
|
||
| 13 | dojo.require("dijit._Container");
|
||
| 14 | dojo.require("dijit._Contained");
|
||
| 15 | dojo.require("dijit.Tooltip");
|
||
| 16 | dojo.require("dojo.fx.easing");
|
||
| 17 | dojo.require("dojox.gfx");
|
||
| 18 | dojo.experimental("dojox.widget.gauge._Gauge");
|
||
| 19 | dojo.declare("dojox.widget.gauge._Gauge",[dijit._Widget,dijit._Templated,dijit._Container],{width:0,height:0,background:null,min:0,max:0,image:null,useRangeStyles:0,useTooltip:true,majorTicks:null,minorTicks:null,_defaultIndicator:null,defaultColors:[[0,84,170,1],[68,119,187,1],[102,153,204,1],[153,187,238,1],[153,204,255,1],[204,238,255,1],[221,238,255,1]],min:null,max:null,surface:null,hideValues:false,gaugeContent:undefined,templateString:dojo.cache("dojox.widget.gauge","_Gauge.html","<div>\n\t<div class=\"dojoxGaugeContent\" dojoAttachPoint=\"gaugeContent\"></div>\n\t<div dojoAttachPoint=\"containerNode\"></div>\n\t<div dojoAttachPoint=\"mouseNode\"></div>\n</div>\n"),_backgroundDefault:{color:"#E0E0E0"},_rangeData:null,_indicatorData:null,_drag:null,_img:null,_overOverlay:false,_lastHover:"",startup:function(){ |
||
| 20 | if(this.image===null){ |
||
| 21 | this.image={};
|
||
| 22 | } |
||
| 23 | this.connect(this.gaugeContent,"onmousemove",this.handleMouseMove); |
||
| 24 | this.connect(this.gaugeContent,"onmouseover",this.handleMouseOver); |
||
| 25 | this.connect(this.gaugeContent,"onmouseout",this.handleMouseOut); |
||
| 26 | this.connect(this.gaugeContent,"onmouseup",this.handleMouseUp); |
||
| 27 | if(!dojo.isArray(this.ranges)){ |
||
| 28 | this.ranges=[];
|
||
| 29 | } |
||
| 30 | if(!dojo.isArray(this.indicators)){ |
||
| 31 | this.indicators=[];
|
||
| 32 | } |
||
| 33 | var _1=[],_2=[];
|
||
| 34 | var i;
|
||
| 35 | if(this.hasChildren()){ |
||
| 36 | var _3=this.getChildren(); |
||
| 37 | for(i=0;i<_3.length;i++){ |
||
| 38 | if(/dojox\.widget\..*Indicator/.test(_3[i].declaredClass)){ |
||
| 39 | _2.push(_3[i]); |
||
| 40 | continue;
|
||
| 41 | } |
||
| 42 | switch(_3[i].declaredClass){
|
||
| 43 | case "dojox.widget.gauge.Range": |
||
| 44 | _1.push(_3[i]); |
||
| 45 | break;
|
||
| 46 | } |
||
| 47 | } |
||
| 48 | this.ranges=this.ranges.concat(_1); |
||
| 49 | this.indicators=this.indicators.concat(_2); |
||
| 50 | } |
||
| 51 | if(!this.background){ |
||
| 52 | this.background=this._backgroundDefault; |
||
| 53 | } |
||
| 54 | this.background=this.background.color||this.background; |
||
| 55 | if(!this.surface){ |
||
| 56 | this.createSurface();
|
||
| 57 | } |
||
| 58 | this.addRanges(this.ranges); |
||
| 59 | if(this.minorTicks&&this.minorTicks.interval){ |
||
| 60 | this.setMinorTicks(this.minorTicks); |
||
| 61 | } |
||
| 62 | if(this.majorTicks&&this.majorTicks.interval){ |
||
| 63 | this.setMajorTicks(this.majorTicks); |
||
| 64 | } |
||
| 65 | for(i=0;i<this.indicators.length;i++){ |
||
| 66 | this.addIndicator(this.indicators[i]); |
||
| 67 | } |
||
| 68 | },_setTicks:function(_4,_5,_6){ |
||
| 69 | var i;
|
||
| 70 | if(_4&&dojo.isArray(_4._ticks)){
|
||
| 71 | for(i=0;i<_4._ticks.length;i++){ |
||
| 72 | this.removeIndicator(_4._ticks[i]);
|
||
| 73 | } |
||
| 74 | } |
||
| 75 | var t={length:_5.length,offset:_5.offset,noChange:true}; |
||
| 76 | if(_5.color){
|
||
| 77 | t.color=_5.color; |
||
| 78 | } |
||
| 79 | if(_5.font){
|
||
| 80 | t.font=_5.font; |
||
| 81 | } |
||
| 82 | _5._ticks=[]; |
||
| 83 | for(i=this.min;i<=this.max;i+=_5.interval){ |
||
| 84 | t.value=i; |
||
| 85 | if(_6){
|
||
| 86 | t.label=""+i;
|
||
| 87 | } |
||
| 88 | _5._ticks.push(this.addIndicator(t));
|
||
| 89 | } |
||
| 90 | return _5;
|
||
| 91 | },setMinorTicks:function(_7){ |
||
| 92 | this.minorTicks=this._setTicks(this.minorTicks,_7,false); |
||
| 93 | },setMajorTicks:function(_8){ |
||
| 94 | this.majorTicks=this._setTicks(this.majorTicks,_8,true); |
||
| 95 | },postCreate:function(){ |
||
| 96 | if(this.hideValues){ |
||
| 97 | dojo.style(this.containerNode,"display","none"); |
||
| 98 | } |
||
| 99 | dojo.style(this.mouseNode,"width","0"); |
||
| 100 | dojo.style(this.mouseNode,"height","0"); |
||
| 101 | dojo.style(this.mouseNode,"position","absolute"); |
||
| 102 | dojo.style(this.mouseNode,"z-index","100"); |
||
| 103 | if(this.useTooltip){ |
||
| 104 | dijit.showTooltip("test",this.mouseNode,!this.isLeftToRight()); |
||
| 105 | dijit.hideTooltip(this.mouseNode);
|
||
| 106 | } |
||
| 107 | },createSurface:function(){ |
||
| 108 | this.gaugeContent.style.width=this.width+"px"; |
||
| 109 | this.gaugeContent.style.height=this.height+"px"; |
||
| 110 | this.surface=dojox.gfx.createSurface(this.gaugeContent,this.width,this.height); |
||
| 111 | this._background=this.surface.createRect({x:0,y:0,width:this.width,height:this.height}); |
||
| 112 | this._background.setFill(this.background); |
||
| 113 | if(this.image.url){ |
||
| 114 | this._img=this.surface.createImage({width:this.image.width||this.width,height:this.image.height||this.height,src:this.image.url}); |
||
| 115 | if(this.image.overlay){ |
||
| 116 | this._img.getEventSource().setAttribute("overlay",true); |
||
| 117 | } |
||
| 118 | if(this.image.x||this.image.y){ |
||
| 119 | this._img.setTransform({dx:this.image.x||0,dy:this.image.y||0}); |
||
| 120 | } |
||
| 121 | } |
||
| 122 | },setBackground:function(_9){ |
||
| 123 | if(!_9){
|
||
| 124 | _9=this._backgroundDefault;
|
||
| 125 | } |
||
| 126 | this.background=_9.color||_9;
|
||
| 127 | this._background.setFill(this.background); |
||
| 128 | },addRange:function(_a){ |
||
| 129 | this.addRanges([_a]);
|
||
| 130 | },addRanges:function(_b){ |
||
| 131 | if(!this._rangeData){ |
||
| 132 | this._rangeData=[];
|
||
| 133 | } |
||
| 134 | var _c;
|
||
| 135 | for(var i=0;i<_b.length;i++){ |
||
| 136 | _c=_b[i]; |
||
| 137 | if((this.min===null)||(_c.low<this.min)){ |
||
| 138 | this.min=_c.low;
|
||
| 139 | } |
||
| 140 | if((this.max===null)||(_c.high>this.max)){ |
||
| 141 | this.max=_c.high;
|
||
| 142 | } |
||
| 143 | if(!_c.color){
|
||
| 144 | var _d=this._rangeData.length%this.defaultColors.length; |
||
| 145 | if(dojox.gfx.svg&&this.useRangeStyles>0){ |
||
| 146 | _d=(this._rangeData.length%this.useRangeStyles)+1; |
||
| 147 | _c.color={style:"dojoxGaugeRange"+_d};
|
||
| 148 | }else{
|
||
| 149 | _d=this._rangeData.length%this.defaultColors.length; |
||
| 150 | _c.color=this.defaultColors[_d];
|
||
| 151 | } |
||
| 152 | } |
||
| 153 | this._rangeData[this._rangeData.length]=_c; |
||
| 154 | } |
||
| 155 | this.draw();
|
||
| 156 | },addIndicator:function(_e){ |
||
| 157 | _e._gauge=this;
|
||
| 158 | if(!_e.declaredClass){
|
||
| 159 | _e=new this._defaultIndicator(_e); |
||
| 160 | } |
||
| 161 | if(!_e.hideValue){
|
||
| 162 | this.containerNode.appendChild(_e.domNode);
|
||
| 163 | } |
||
| 164 | if(!this._indicatorData){ |
||
| 165 | this._indicatorData=[];
|
||
| 166 | } |
||
| 167 | this._indicatorData[this._indicatorData.length]=_e; |
||
| 168 | _e.draw(); |
||
| 169 | return _e;
|
||
| 170 | },removeIndicator:function(_f){ |
||
| 171 | for(var i=0;i<this._indicatorData.length;i++){ |
||
| 172 | if(this._indicatorData[i]===_f){ |
||
| 173 | this._indicatorData.splice(i,1); |
||
| 174 | _f.remove(); |
||
| 175 | break;
|
||
| 176 | } |
||
| 177 | } |
||
| 178 | },moveIndicatorToFront:function(_10){ |
||
| 179 | if(_10.shapes){
|
||
| 180 | for(var i=0;i<_10.shapes.length;i++){ |
||
| 181 | _10.shapes[i].moveToFront(); |
||
| 182 | } |
||
| 183 | } |
||
| 184 | },drawText:function(txt,x,y,_11,_12,_13,_14){ |
||
| 185 | var t=this.surface.createText({x:x,y:y,text:txt,align:_11}); |
||
| 186 | t.setFill(_13); |
||
| 187 | t.setFont(_14); |
||
| 188 | return t;
|
||
| 189 | },removeText:function(t){ |
||
| 190 | this.surface.rawNode.removeChild(t);
|
||
| 191 | },updateTooltip:function(txt,e){ |
||
| 192 | if(this._lastHover!=txt){ |
||
| 193 | if(txt!==""){ |
||
| 194 | dijit.hideTooltip(this.mouseNode);
|
||
| 195 | dijit.showTooltip(txt,this.mouseNode,!this.isLeftToRight()); |
||
| 196 | }else{
|
||
| 197 | dijit.hideTooltip(this.mouseNode);
|
||
| 198 | } |
||
| 199 | this._lastHover=txt;
|
||
| 200 | } |
||
| 201 | },handleMouseOver:function(_15){ |
||
| 202 | var _16=_15.target.getAttribute("hover"); |
||
| 203 | if(_15.target.getAttribute("overlay")){ |
||
| 204 | this._overOverlay=true; |
||
| 205 | var r=this.getRangeUnderMouse(_15); |
||
| 206 | if(r&&r.hover){
|
||
| 207 | _16=r.hover; |
||
| 208 | } |
||
| 209 | } |
||
| 210 | if(this.useTooltip&&!this._drag){ |
||
| 211 | if(_16){
|
||
| 212 | this.updateTooltip(_16,_15);
|
||
| 213 | }else{
|
||
| 214 | this.updateTooltip("",_15); |
||
| 215 | } |
||
| 216 | } |
||
| 217 | },handleMouseOut:function(_17){ |
||
| 218 | if(_17.target.getAttribute("overlay")){ |
||
| 219 | this._overOverlay=false; |
||
| 220 | } |
||
| 221 | if(this.useTooltip&&this.mouseNode){ |
||
| 222 | dijit.hideTooltip(this.mouseNode);
|
||
| 223 | } |
||
| 224 | },handleMouseDown:function(_18){ |
||
| 225 | for(var i=0;i<this._indicatorData.length;i++){ |
||
| 226 | var _19=this._indicatorData[i].shapes; |
||
| 227 | for(var s=0;s<_19.length;s++){ |
||
| 228 | if(_19[s].getEventSource()==_18.target){
|
||
| 229 | this._drag=this._indicatorData[i]; |
||
| 230 | s=_19.length; |
||
| 231 | i=this._indicatorData.length;
|
||
| 232 | } |
||
| 233 | } |
||
| 234 | } |
||
| 235 | dojo.stopEvent(_18); |
||
| 236 | },handleMouseUp:function(_1a){ |
||
| 237 | this._drag=null; |
||
| 238 | dojo.stopEvent(_1a); |
||
| 239 | },handleMouseMove:function(_1b){ |
||
| 240 | if(_1b){
|
||
| 241 | dojo.style(this.mouseNode,"left",_1b.pageX+1+"px"); |
||
| 242 | dojo.style(this.mouseNode,"top",_1b.pageY+1+"px"); |
||
| 243 | } |
||
| 244 | if(this._drag){ |
||
| 245 | this._dragIndicator(this,_1b); |
||
| 246 | }else{
|
||
| 247 | if(this.useTooltip&&this._overOverlay){ |
||
| 248 | var r=this.getRangeUnderMouse(_1b); |
||
| 249 | if(r&&r.hover){
|
||
| 250 | this.updateTooltip(r.hover,_1b);
|
||
| 251 | }else{
|
||
| 252 | this.updateTooltip("",_1b); |
||
| 253 | } |
||
| 254 | } |
||
| 255 | } |
||
| 256 | }}); |
||
| 257 | dojo.declare("dojox.widget.gauge.Range",[dijit._Widget,dijit._Contained],{low:0,high:0,hover:"",color:null,size:0,startup:function(){ |
||
| 258 | this.color=this.color.color||this.color; |
||
| 259 | }}); |
||
| 260 | dojo.declare("dojox.widget.gauge._Indicator",[dijit._Widget,dijit._Contained,dijit._Templated],{value:0,type:"",color:"black",label:"",font:{family:"sans-serif",size:"12px"},length:0,width:0,offset:0,hover:"",front:false,easing:dojo._defaultEasing,duration:1000,hideValue:false,noChange:false,_gauge:null,title:"",templateString:dojo.cache("dojox.widget.gauge","_Indicator.html","<div class=\"dojoxGaugeIndicatorDiv\">\n\t<label class=\"dojoxGaugeIndicatorLabel\" for=\"${title}\">${title}:</label>\n\t<input class=\"dojoxGaugeIndicatorInput\" name=\"${title}\" size=\"5\" value=\"${value}\" dojoAttachPoint=\"valueNode\" dojoAttachEvent=\"onchange:_update\"></input>\n</div>\n"),startup:function(){ |
||
| 261 | if(this.onDragMove){ |
||
| 262 | this.onDragMove=dojo.hitch(this.onDragMove); |
||
| 263 | } |
||
| 264 | },postCreate:function(){ |
||
| 265 | if(this.title===""){ |
||
| 266 | dojo.style(this.domNode,"display","none"); |
||
| 267 | } |
||
| 268 | if(dojo.isString(this.easing)){ |
||
| 269 | this.easing=dojo.getObject(this.easing); |
||
| 270 | } |
||
| 271 | },_update:function(_1c){ |
||
| 272 | var _1d=this.valueNode.value; |
||
| 273 | if(_1d===""){ |
||
| 274 | this.value=null; |
||
| 275 | }else{
|
||
| 276 | this.value=Number(_1d);
|
||
| 277 | this.hover=this.title+": "+_1d; |
||
| 278 | } |
||
| 279 | if(this._gauge){ |
||
| 280 | this.draw();
|
||
| 281 | this.valueNode.value=this.value; |
||
| 282 | if((this.title=="Target"||this.front)&&this._gauge.moveIndicator){ |
||
| 283 | this._gauge.moveIndicatorToFront(this); |
||
| 284 | } |
||
| 285 | } |
||
| 286 | },update:function(_1e){ |
||
| 287 | if(!this.noChange){ |
||
| 288 | this.valueNode.value=_1e;
|
||
| 289 | this._update();
|
||
| 290 | } |
||
| 291 | },onDragMove:function(){ |
||
| 292 | this.value=Math.floor(this.value); |
||
| 293 | this.valueNode.value=this.value; |
||
| 294 | this.hover=this.title+": "+this.value; |
||
| 295 | },draw:function(_1f){ |
||
| 296 | },remove:function(){ |
||
| 297 | for(var i=0;i<this.shapes.length;i++){ |
||
| 298 | this._gauge.surface.remove(this.shapes[i]); |
||
| 299 | } |
||
| 300 | if(this.text){ |
||
| 301 | this._gauge.surface.remove(this.text); |
||
| 302 | } |
||
| 303 | }}); |
||
| 304 | } |