OLD | NEW |
| (Empty) |
1 // Copyright 2014 The Chromium Authors. All rights reserved. | |
2 // Use of this source code is governed by a BSD-style license that can be | |
3 // found in the LICENSE file. | |
4 | |
5 (function() { | |
6 'use strict'; | |
7 | |
8 Polymer('volume-controller', { | |
9 /** | |
10 * Initializes an element. This method is called automatically when the | |
11 * element is ready. | |
12 */ | |
13 ready: function() { | |
14 this.style.width = this.width + 'px'; | |
15 this.style.height = this.height + 'px'; | |
16 | |
17 this.$.rawValueInput.style.width = this.height + 'px'; | |
18 this.$.rawValueInput.style.height = this.width + 'px'; | |
19 this.$.rawValueInput.style.webkitTransformOrigin = | |
20 (this.width / 2) + 'px ' + | |
21 (this.width / 2 - 2) + 'px'; | |
22 | |
23 var barLeft = (this.width / 2 - 1); | |
24 this.$.bar.style.left = barLeft + 'px'; | |
25 this.$.bar.style.right = barLeft + 'px'; | |
26 | |
27 this.addEventListener('keydown', this.onKeyDown_.bind(this)); | |
28 }, | |
29 | |
30 /** | |
31 * Registers handlers for changing of external variables | |
32 */ | |
33 observe: { | |
34 'model.volume': 'onVolumeChanged', | |
35 }, | |
36 | |
37 /** | |
38 * Model object of the Audio Player. | |
39 * @type {AudioPlayerModel} | |
40 */ | |
41 model: null, | |
42 | |
43 /** | |
44 * Invoked when the model changed. | |
45 * @param {AudioPlayerModel} oldValue Old Value. | |
46 * @param {AudioPlayerModel} newValue New Value. | |
47 */ | |
48 modelChanged: function(oldValue, newValue) { | |
49 this.onVolumeChanged((oldValue || {}).volume, (newValue || {}).volume); | |
50 }, | |
51 | |
52 /** | |
53 * Volume. 0 is silent, and 100 is maximum. | |
54 * @type {number} | |
55 */ | |
56 value: 50, | |
57 | |
58 /** | |
59 * Volume. 1000 is silent, and 0 is maximum. | |
60 * @type {number} | |
61 */ | |
62 rawValue: 0, | |
63 | |
64 /** | |
65 * Height of the element in pixels. Must be specified before ready() is | |
66 * called. Dynamic change is not supported. | |
67 * @type {number} | |
68 */ | |
69 height: 100, | |
70 | |
71 /** | |
72 * Width of the element in pixels. Must be specified before ready() is | |
73 * called. Dynamic change is not supported. | |
74 * @type {number} | |
75 */ | |
76 width: 32, | |
77 | |
78 /** | |
79 * Invoked when the 'volume' value in the model is changed. | |
80 * @param {number} oldValue Old value. | |
81 * @param {number} newValue New value. | |
82 */ | |
83 onVolumeChanged: function(oldValue, newValue) { | |
84 if (oldValue != newValue) | |
85 this.rawValue = 100 - newValue; | |
86 }, | |
87 | |
88 /** | |
89 * Invoked when the 'rawValue' property is changed. | |
90 * @param {number} oldValue Old value. | |
91 * @param {number} newValue New value. | |
92 */ | |
93 rawValueChanged: function(oldValue, newValue) { | |
94 if (oldValue != newValue) | |
95 this.model.volume = 100 - newValue; | |
96 }, | |
97 | |
98 /** | |
99 * Invoked when the 'keydown' event is fired. | |
100 * @param {Event} event The event object. | |
101 */ | |
102 onKeyDown_: function(event) { | |
103 switch (event.keyIdentifier) { | |
104 // Prevents the default behavior. These key should be handled in | |
105 // <audio-player> element. | |
106 case 'Up': | |
107 case 'Down': | |
108 case 'PageUp': | |
109 case 'PageDown': | |
110 event.preventDefault(); | |
111 break; | |
112 } | |
113 }, | |
114 }); | |
115 })(); // Anonymous closure | |
OLD | NEW |