OLD | NEW |
| (Empty) |
1 | |
2 | |
3 /** | |
4 * `iron-range-behavior` provides the behavior for something with a minimum to m
aximum range. | |
5 * | |
6 * @demo demo/index.html | |
7 * @polymerBehavior | |
8 */ | |
9 Polymer.IronRangeBehavior = { | |
10 | |
11 properties: { | |
12 | |
13 /** | |
14 * The number that represents the current value. | |
15 */ | |
16 value: { | |
17 type: Number, | |
18 value: 0, | |
19 notify: true, | |
20 reflectToAttribute: true | |
21 }, | |
22 | |
23 /** | |
24 * The number that indicates the minimum value of the range. | |
25 */ | |
26 min: { | |
27 type: Number, | |
28 value: 0, | |
29 notify: true | |
30 }, | |
31 | |
32 /** | |
33 * The number that indicates the maximum value of the range. | |
34 */ | |
35 max: { | |
36 type: Number, | |
37 value: 100, | |
38 notify: true | |
39 }, | |
40 | |
41 /** | |
42 * Specifies the value granularity of the range's value. | |
43 */ | |
44 step: { | |
45 type: Number, | |
46 value: 1, | |
47 notify: true | |
48 }, | |
49 | |
50 /** | |
51 * Returns the ratio of the value. | |
52 */ | |
53 ratio: { | |
54 type: Number, | |
55 value: 0, | |
56 readOnly: true, | |
57 notify: true | |
58 }, | |
59 }, | |
60 | |
61 observers: [ | |
62 '_update(value, min, max, step)' | |
63 ], | |
64 | |
65 _calcRatio: function(value) { | |
66 return (this._clampValue(value) - this.min) / (this.max - this.min); | |
67 }, | |
68 | |
69 _clampValue: function(value) { | |
70 return Math.min(this.max, Math.max(this.min, this._calcStep(value))); | |
71 }, | |
72 | |
73 _calcStep: function(value) { | |
74 return this.step ? (Math.round(value / this.step) / (1 / this.step)) : value
; | |
75 }, | |
76 | |
77 _validateValue: function() { | |
78 var v = this._clampValue(this.value); | |
79 this.value = this.oldValue = isNaN(v) ? this.oldValue : v; | |
80 return this.value !== v; | |
81 }, | |
82 | |
83 _update: function() { | |
84 this._validateValue(); | |
85 this._setRatio(this._calcRatio(this.value) * 100); | |
86 } | |
87 | |
88 }; | |
OLD | NEW |