6 frequency = 10; |
6 frequency = 10; |
7 origin = undefined; |
7 origin = undefined; |
8 range = undefined; |
8 range = undefined; |
9 |
9 |
10 dispatch(value) { |
10 dispatch(value) { |
|
11 this.display_val = value; |
|
12 this.request_animate(); |
|
13 } |
|
14 |
|
15 animate(){ |
11 if(this.value_elt) |
16 if(this.value_elt) |
12 this.value_elt.textContent = String(value); |
17 this.value_elt.textContent = String(this.display_val); |
13 let [min,max,totallength] = this.range; |
18 let [min,max,totallength] = this.range; |
14 let length = Math.max(0,Math.min(totallength,(Number(value)-min)*totallength/(max-min))); |
19 let length = Math.max(0,Math.min(totallength,(Number(this.display_val)-min)*totallength/(max-min))); |
15 let tip = this.range_elt.getPointAtLength(length); |
20 let tip = this.range_elt.getPointAtLength(length); |
16 this.needle_elt.setAttribute('d', "M "+this.origin.x+","+this.origin.y+" "+tip.x+","+tip.y); |
21 this.needle_elt.setAttribute('d', "M "+this.origin.x+","+this.origin.y+" "+tip.x+","+tip.y); |
17 } |
22 } |
18 |
23 |
19 init() { |
24 init() { |
20 let min = this.min_elt ? |
25 let [min,max] = [[this.min_elt,0],[this.max_elt,100]].map(([elt,def],i)=>elt? |
21 Number(this.min_elt.textContent) : |
26 Number(elt.textContent) : |
22 this.args.length >= 1 ? this.args[0] : 0; |
27 this.args.length >= i+1 ? this.args[i] : def); |
23 let max = this.max_elt ? |
28 |
24 Number(this.max_elt.textContent) : |
|
25 this.args.length >= 2 ? this.args[1] : 100; |
|
26 this.range = [min, max, this.range_elt.getTotalLength()] |
29 this.range = [min, max, this.range_elt.getTotalLength()] |
27 this.origin = this.needle_elt.getPointAtLength(0); |
30 this.origin = this.needle_elt.getPointAtLength(0); |
28 } |
31 } |
29 |
32 |
30 } |
33 } |