1 | define(["dojo/_base/declare", "./ScaleIndicatorBase", "dojox/gfx", "dojo/_base/event", "dojo/dom-geometry"], |
---|
2 | function(declare, ScaleIndicatorBase, gfx, eventUtil, domGeom){ |
---|
3 | return declare("dojox.dgauges.RectangularValueIndicator", ScaleIndicatorBase, { |
---|
4 | // summary: |
---|
5 | // The rectangular value indicator, typically used for creating markers or thumbs. |
---|
6 | |
---|
7 | // paddingLeft: Number |
---|
8 | // The left padding. |
---|
9 | paddingLeft: 0, |
---|
10 | // paddingTop: Number |
---|
11 | // The top padding. |
---|
12 | paddingTop: 0, |
---|
13 | // paddingRight: Number |
---|
14 | // The right padding. |
---|
15 | paddingRight: 0, |
---|
16 | // paddingBottom: Number |
---|
17 | // The bottom padding. |
---|
18 | paddingBottom: 0, |
---|
19 | |
---|
20 | |
---|
21 | constructor: function(){ |
---|
22 | this.addInvalidatingProperties(["paddingTop", "paddingLeft", "paddingRight", "paddingBottom"]); |
---|
23 | }, |
---|
24 | |
---|
25 | indicatorShapeFunc: function(group, indicator){ |
---|
26 | // summary: |
---|
27 | // Draws the indicator. |
---|
28 | // group: dojox/gfx/Group |
---|
29 | // A GFX group for drawing. The indicator is always centered horizontally and is |
---|
30 | // automatically rotated if the scale is vertical. |
---|
31 | // indicator: dojox/dgauges/IndicatorBase |
---|
32 | // A reference to this indicator. |
---|
33 | // returns: dojox/gfx/shape.Shape |
---|
34 | // A GFX shape retrievable using the getIndicatorRenderer method of the associated scale. |
---|
35 | return group.createPolyline([0, 0, 10, 0, 0, 10, -10, 0, 0, 0]).setStroke({ |
---|
36 | color: "black", |
---|
37 | width: 1 |
---|
38 | }); |
---|
39 | }, |
---|
40 | |
---|
41 | refreshRendering: function(){ |
---|
42 | this.inherited(arguments); |
---|
43 | |
---|
44 | // get position corresponding to the value |
---|
45 | var v = isNaN(this._transitionValue) ? this.value : this._transitionValue; |
---|
46 | var pos = this.scale.positionForValue(v); |
---|
47 | |
---|
48 | // computes offsets to move the indicator |
---|
49 | var dx = 0, dy = 0; |
---|
50 | var angle = 0; |
---|
51 | if(this.scale._gauge.orientation == "horizontal"){ |
---|
52 | dx = pos; |
---|
53 | dy = this.paddingTop; |
---|
54 | }else{ |
---|
55 | dx = this.paddingLeft; |
---|
56 | dy = pos; |
---|
57 | angle = 90; |
---|
58 | } |
---|
59 | |
---|
60 | // translate the indicator |
---|
61 | |
---|
62 | this._gfxGroup.setTransform([{ |
---|
63 | dx: dx, |
---|
64 | dy: dy |
---|
65 | }, gfx.matrix.rotateg(angle)]); |
---|
66 | }, |
---|
67 | |
---|
68 | _onMouseDown: function(event){ |
---|
69 | // summary: |
---|
70 | // Internal method. |
---|
71 | // tags: |
---|
72 | // private |
---|
73 | this.inherited(arguments); |
---|
74 | var np = domGeom.position(this.scale._gauge.domNode, true); |
---|
75 | this.set("value", this.scale.valueForPosition({x: event.pageX - np.x, y: event.pageY - np.y})); |
---|
76 | |
---|
77 | // prevent the browser from selecting text |
---|
78 | eventUtil.stop(event); |
---|
79 | }, |
---|
80 | |
---|
81 | _onMouseMove: function(event){ |
---|
82 | // summary: |
---|
83 | // Internal method. |
---|
84 | // tags: |
---|
85 | // private |
---|
86 | this.inherited(arguments); |
---|
87 | |
---|
88 | var np = domGeom.position(this.scale._gauge.domNode, true); |
---|
89 | this.set("value", this.scale.valueForPosition({x: event.pageX - np.x, y: event.pageY - np.y})); |
---|
90 | } |
---|
91 | }) |
---|
92 | }); |
---|