aboutsummaryrefslogtreecommitdiff
path: root/node_modules/montage/ui/skeleton/range-input.reel/range-input.js
diff options
context:
space:
mode:
Diffstat (limited to 'node_modules/montage/ui/skeleton/range-input.reel/range-input.js')
-rw-r--r--node_modules/montage/ui/skeleton/range-input.reel/range-input.js300
1 files changed, 0 insertions, 300 deletions
diff --git a/node_modules/montage/ui/skeleton/range-input.reel/range-input.js b/node_modules/montage/ui/skeleton/range-input.reel/range-input.js
deleted file mode 100644
index 1dbd4272..00000000
--- a/node_modules/montage/ui/skeleton/range-input.reel/range-input.js
+++ /dev/null
@@ -1,300 +0,0 @@
1/* <copyright>
2 This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
3 No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
4 (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
5 </copyright> */
6/*global require,exports */
7var Montage = require("montage").Montage,
8 Component = require("ui/component").Component;
9
10/**
11 * The input type="range" field
12 */
13var RangeInput = exports.RangeInput = Montage.create(Component, {
14
15 DEFAULT_WIDTH: {
16 value: 300
17 },
18
19 HANDLE_ADJUST: {
20 value: 5
21 },
22
23 // public API
24 _min: {
25 value: null
26 },
27
28 min: {
29 get: function() {
30 return this._min;
31 },
32 set: function(value) {
33 this._min = String.isString(value) ? parseFloat(value) : value;
34 this.needsDraw = true;
35 },
36 serializable: true
37 },
38
39 _max: {
40 value: null
41 },
42
43 max: {
44 get: function() {
45 return this._max;
46 },
47 set: function(value) {
48 this._max = String.isString(value) ? parseFloat(value) : value;
49 this.needsDraw = true;
50 },
51 serializable: true
52 },
53
54 _step: {
55 value: null
56 },
57
58 step: {
59 get: function() {
60 return this._step;
61 },
62 set: function(value) {
63 this._step = String.isString(value) ? parseFloat(value) : value;
64 this.needsDraw = true;
65 },
66 serializable: true
67 },
68
69 /** Width of the slider in px. Default = 300 */
70 _width: {
71 value: null
72 },
73
74 width: {
75 get: function() {
76 return this._width;
77 },
78 set: function(value) {
79 this._width = String.isString(value) ? parseFloat(value) : value;
80 this.needsDraw = true;
81 },
82 serializable: true
83 },
84
85 percent: {
86 value: null
87 },
88
89 _valueSyncedWithPosition: {
90 value: null
91 },
92
93 _value: {
94 value: null
95 },
96
97 value: {
98 get: function() {
99 return this._value;
100 },
101 set: function(value, fromInput) {
102 this._value = String.isString(value) ? parseFloat(value) : value;
103
104 if(fromInput) {
105 this._valueSyncedWithPosition = true;
106 } else {
107 this._valueSyncedWithPosition = false;
108 this._calculatePositionFromValue();
109 this.needsDraw = true;
110 }
111 },
112 serializable: true
113 },
114
115 // private
116 _handleEl: {
117 value: null,
118 serializable: true
119 },
120
121 _translateComposer: {
122 value: null,
123 serializable: true
124 },
125
126 _sliderLeft: {
127 value: null
128 },
129
130 _sliderWidth: {
131 value: null
132 },
133
134 __positionX: {
135 value: null
136 },
137
138 _positionX: {
139 get: function() {
140 return this.__positionX;
141 },
142 set: function(value, fromValue) {
143
144 if(value !== null && !isNaN(value)) {
145 this.__positionX = value;
146 if(!fromValue) {
147 this._calculateValueFromPosition();
148 this._valueSyncedWithPosition = true;
149 }
150 this.needsDraw = true;
151 }
152
153 }
154 },
155
156 _calculateValueFromPosition: {
157 value: function() {
158 if(this._sliderWidth > 0) {
159 var percent = this.percent = (this._positionX / this._sliderWidth) * 100;
160 var value = (this.min + ((percent/100) * (this.max - this.min)));
161 Object.getPropertyDescriptor(this, "value").set.call(this, value, true);
162 }
163
164 }
165 },
166
167 _calculatePositionFromValue: {
168 value: function() {
169 // unless the element is ready, we cannot position the handle
170 if(this._sliderWidth) {
171 var percent, value = this.value;
172 var range = (this.max - this.min);
173 percent = ((this.value-this.min)/range) * 100;
174 var positionX = (percent/100)*this._sliderWidth;
175 Object.getPropertyDescriptor(this, "_positionX").set.call(this, positionX, true);
176
177 this.percent = percent;
178 this._valueSyncedWithPosition = true;
179 } else {
180 this._valueSyncedWithPosition = false;
181 }
182 }
183 },
184
185 deserializedFromTemplate: {
186 value: function() {
187 // read initial values from the input type=range
188 this.min = this.min || this.element.getAttribute('min') || 0;
189 this.max = this.max || this.element.getAttribute('max') || 100;
190 this.step = this.step || this.element.getAttribute('step') || 1;
191 this.value = this.value || this.element.getAttribute('value') || 0;
192 }
193 },
194
195 prepareForDraw: {
196 value: function() {
197 this._sliderLeft = this.element.offsetLeft;
198 this._sliderWidth = (this.width || RangeInput.DEFAULT_WIDTH); //this.element.offsetWidth || 300;
199 this.element.style.width = (this._sliderWidth + RangeInput.HANDLE_ADJUST) + 'px';
200
201 if(!this._valueSyncedWithPosition) {
202 this._calculatePositionFromValue();
203 }
204 }
205 },
206
207 // @todo: Without prepareForActivationEvents, the _translateComposer does not work
208 prepareForActivationEvents: {
209 value: function() {
210 this._translateComposer.addEventListener('translateStart', this, false);
211 this._translateComposer.addEventListener('translateEnd', this, false);
212
213 this._addEventListeners();
214
215 }
216 },