| OLD | NEW |
| 1 Polymer({ | 1 Polymer({ |
| 2 is: 'paper-slider', | 2 is: 'paper-slider', |
| 3 | 3 |
| 4 behaviors: [ | 4 behaviors: [ |
| 5 Polymer.IronA11yKeysBehavior, | 5 Polymer.IronA11yKeysBehavior, |
| 6 Polymer.IronFormElementBehavior, | 6 Polymer.IronFormElementBehavior, |
| 7 Polymer.PaperInkyFocusBehavior, | 7 Polymer.PaperInkyFocusBehavior, |
| 8 Polymer.IronRangeBehavior | 8 Polymer.IronRangeBehavior |
| 9 ], | 9 ], |
| 10 | 10 |
| (...skipping 77 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 88 | 88 |
| 89 transiting: { | 89 transiting: { |
| 90 type: Boolean, | 90 type: Boolean, |
| 91 value: false, | 91 value: false, |
| 92 readOnly: true | 92 readOnly: true |
| 93 }, | 93 }, |
| 94 | 94 |
| 95 markers: { | 95 markers: { |
| 96 type: Array, | 96 type: Array, |
| 97 readOnly: true, | 97 readOnly: true, |
| 98 value: [] | 98 value: function() { |
| 99 return []; |
| 100 } |
| 99 }, | 101 }, |
| 100 }, | 102 }, |
| 101 | 103 |
| 102 observers: [ | 104 observers: [ |
| 103 '_updateKnob(value, min, max, snaps, step)', | 105 '_updateKnob(value, min, max, snaps, step)', |
| 104 '_valueChanged(value)', | 106 '_valueChanged(value)', |
| 105 '_immediateValueChanged(immediateValue)', | 107 '_immediateValueChanged(immediateValue)', |
| 106 '_updateMarkers(maxMarkers, min, max, snaps)' | 108 '_updateMarkers(maxMarkers, min, max, snaps)' |
| 107 ], | 109 ], |
| 108 | 110 |
| (...skipping 90 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 199 this._w = this.$.sliderBar.offsetWidth; | 201 this._w = this.$.sliderBar.offsetWidth; |
| 200 this._x = this.ratio * this._w; | 202 this._x = this.ratio * this._w; |
| 201 this._startx = this._x; | 203 this._startx = this._x; |
| 202 this._knobstartx = this._startx; | 204 this._knobstartx = this._startx; |
| 203 this._minx = - this._startx; | 205 this._minx = - this._startx; |
| 204 this._maxx = this._w - this._startx; | 206 this._maxx = this._w - this._startx; |
| 205 this.$.sliderKnob.classList.add('dragging'); | 207 this.$.sliderKnob.classList.add('dragging'); |
| 206 this._setDragging(true); | 208 this._setDragging(true); |
| 207 }, | 209 }, |
| 208 | 210 |
| 209 _trackX: function(e) { | 211 _trackX: function(event) { |
| 210 if (!this.dragging) { | 212 if (!this.dragging) { |
| 211 this._trackStart(e); | 213 this._trackStart(event); |
| 212 } | 214 } |
| 213 | 215 |
| 214 var dx = Math.min(this._maxx, Math.max(this._minx, e.detail.dx)); | 216 var dx = Math.min(this._maxx, Math.max(this._minx, event.detail.dx)); |
| 215 this._x = this._startx + dx; | 217 this._x = this._startx + dx; |
| 216 | 218 |
| 217 var immediateValue = this._calcStep(this._calcKnobPosition(this._x / thi
s._w)); | 219 var immediateValue = this._calcStep(this._calcKnobPosition(this._x / thi
s._w)); |
| 218 this._setImmediateValue(immediateValue); | 220 this._setImmediateValue(immediateValue); |
| 219 | 221 |
| 220 // update knob's position | 222 // update knob's position |
| 221 var translateX = ((this._calcRatio(this.immediateValue) * this._w) - thi
s._knobstartx); | 223 var translateX = ((this._calcRatio(this.immediateValue) * this._w) - thi
s._knobstartx); |
| 222 this.translate3d(translateX + 'px', 0, 0, this.$.sliderKnob); | 224 this.translate3d(translateX + 'px', 0, 0, this.$.sliderKnob); |
| 223 }, | 225 }, |
| 224 | 226 |
| (...skipping 89 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
| 314 }, | 316 }, |
| 315 | 317 |
| 316 _incrementKey: function(event) { | 318 _incrementKey: function(event) { |
| 317 if (!this.disabled) { | 319 if (!this.disabled) { |
| 318 if (event.detail.key === 'end') { | 320 if (event.detail.key === 'end') { |
| 319 this.value = this.max; | 321 this.value = this.max; |
| 320 } else { | 322 } else { |
| 321 this.increment(); | 323 this.increment(); |
| 322 } | 324 } |
| 323 this.fire('change'); | 325 this.fire('change'); |
| 326 event.preventDefault(); |
| 324 } | 327 } |
| 325 }, | 328 }, |
| 326 | 329 |
| 327 _decrementKey: function(event) { | 330 _decrementKey: function(event) { |
| 328 if (!this.disabled) { | 331 if (!this.disabled) { |
| 329 if (event.detail.key === 'home') { | 332 if (event.detail.key === 'home') { |
| 330 this.value = this.min; | 333 this.value = this.min; |
| 331 } else { | 334 } else { |
| 332 this.decrement(); | 335 this.decrement(); |
| 333 } | 336 } |
| 334 this.fire('change'); | 337 this.fire('change'); |
| 338 event.preventDefault(); |
| 335 } | 339 } |
| 336 }, | 340 }, |
| 337 | 341 |
| 338 _changeValue: function(event) { | 342 _changeValue: function(event) { |
| 339 this.value = event.target.value; | 343 this.value = event.target.value; |
| 340 this.fire('change'); | 344 this.fire('change'); |
| 341 }, | 345 }, |
| 342 | 346 |
| 343 _inputKeyDown: function(event) { | 347 _inputKeyDown: function(event) { |
| 344 event.stopPropagation(); | 348 event.stopPropagation(); |
| (...skipping 27 matching lines...) Expand all Loading... |
| 372 /** | 376 /** |
| 373 * Fired when the slider's value changes. | 377 * Fired when the slider's value changes. |
| 374 * | 378 * |
| 375 * @event value-change | 379 * @event value-change |
| 376 */ | 380 */ |
| 377 | 381 |
| 378 /** | 382 /** |
| 379 * Fired when the slider's immediateValue changes. Only occurs while the | 383 * Fired when the slider's immediateValue changes. Only occurs while the |
| 380 * user is dragging. | 384 * user is dragging. |
| 381 * | 385 * |
| 382 * To detect changes to immediateValue that happen for any input (i.e.
| 386 * To detect changes to immediateValue that happen for any input (i.e. |
| 383 * dragging, tapping, clicking, etc.) listen for immediate-value-changed | 387 * dragging, tapping, clicking, etc.) listen for immediate-value-changed |
| 384 * instead. | 388 * instead. |
| 385 * | 389 * |
| 386 * @event immediate-value-change | 390 * @event immediate-value-change |
| 387 */ | 391 */ |
| 388 | 392 |
| 389 /** | 393 /** |
| 390 * Fired when the slider's value changes due to user interaction. | 394 * Fired when the slider's value changes due to user interaction. |
| 391 * | 395 * |
| 392 * Changes to the slider's value due to changes in an underlying | 396 * Changes to the slider's value due to changes in an underlying |
| 393 * bound variable will not trigger this event. | 397 * bound variable will not trigger this event. |
| 394 * | 398 * |
| 395 * @event change | 399 * @event change |
| 396 */ | 400 */ |
| OLD | NEW |