OLD | NEW |
1 // Copyright 2014 The Chromium Authors. All rights reserved. | 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 | 2 // Use of this source code is governed by a BSD-style license that can be |
3 // found in the LICENSE file. | 3 // found in the LICENSE file. |
4 | 4 |
5 Polymer({ | 5 Polymer({ |
6 is: 'audio-player', | 6 is: 'audio-player', |
7 | 7 |
8 properties: { | 8 properties: { |
9 /** | 9 /** |
10 * Flag whether the audio is playing or paused. True if playing, or false | 10 * Flag whether the audio is playing or paused. True if playing, or false |
(...skipping 76 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
87 * The number of played tracks. (exposed publicly for tests) | 87 * The number of played tracks. (exposed publicly for tests) |
88 */ | 88 */ |
89 playcount: { | 89 playcount: { |
90 type: Number, | 90 type: Number, |
91 value: 0, | 91 value: 0, |
92 reflectToAttribute: true | 92 reflectToAttribute: true |
93 } | 93 } |
94 }, | 94 }, |
95 | 95 |
96 /** | 96 /** |
97 * The last playing state when user starts dragging the seek bar. | |
98 * @private {boolean} | |
99 */ | |
100 wasPlayingOnDragStart_: false, | |
101 | |
102 /** | |
103 * Handles change event for shuffle mode. | 97 * Handles change event for shuffle mode. |
104 * @param {boolean} shuffle | 98 * @param {boolean} shuffle |
105 */ | 99 */ |
106 shuffleChanged: function(shuffle) { | 100 shuffleChanged: function(shuffle) { |
107 if (this.model) | 101 if (this.model) |
108 this.model.shuffle = shuffle; | 102 this.model.shuffle = shuffle; |
109 }, | 103 }, |
110 | 104 |
111 /** | 105 /** |
112 * Handles change event for repeat mode. | 106 * Handles change event for repeat mode. |
(...skipping 21 matching lines...) Expand all Loading... |
134 this.model.expanded = expanded; | 128 this.model.expanded = expanded; |
135 }, | 129 }, |
136 | 130 |
137 /** | 131 /** |
138 * Initializes an element. This method is called automatically when the | 132 * Initializes an element. This method is called automatically when the |
139 * element is ready. | 133 * element is ready. |
140 */ | 134 */ |
141 ready: function() { | 135 ready: function() { |
142 this.addEventListener('keydown', this.onKeyDown_.bind(this)); | 136 this.addEventListener('keydown', this.onKeyDown_.bind(this)); |
143 | 137 |
144 this.$.audioController.addEventListener('dragging-changed', | |
145 this.onDraggingChanged_.bind(this)); | |
146 | |
147 this.$.audio.volume = 0; // Temporary initial volume. | 138 this.$.audio.volume = 0; // Temporary initial volume. |
148 this.$.audio.addEventListener('ended', this.onAudioEnded.bind(this)); | 139 this.$.audio.addEventListener('ended', this.onAudioEnded.bind(this)); |
149 this.$.audio.addEventListener('error', this.onAudioError.bind(this)); | 140 this.$.audio.addEventListener('error', this.onAudioError.bind(this)); |
150 | 141 |
151 var onAudioStatusUpdatedBound = this.onAudioStatusUpdate_.bind(this); | 142 var onAudioStatusUpdatedBound = this.onAudioStatusUpdate_.bind(this); |
152 this.$.audio.addEventListener('timeupdate', onAudioStatusUpdatedBound); | 143 this.$.audio.addEventListener('timeupdate', onAudioStatusUpdatedBound); |
153 this.$.audio.addEventListener('ended', onAudioStatusUpdatedBound); | 144 this.$.audio.addEventListener('ended', onAudioStatusUpdatedBound); |
154 this.$.audio.addEventListener('play', onAudioStatusUpdatedBound); | 145 this.$.audio.addEventListener('play', onAudioStatusUpdatedBound); |
155 this.$.audio.addEventListener('pause', onAudioStatusUpdatedBound); | 146 this.$.audio.addEventListener('pause', onAudioStatusUpdatedBound); |
156 this.$.audio.addEventListener('suspend', onAudioStatusUpdatedBound); | 147 this.$.audio.addEventListener('suspend', onAudioStatusUpdatedBound); |
(...skipping 241 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
398 }, | 389 }, |
399 | 390 |
400 /** | 391 /** |
401 * Invoked when the audio player is being unloaded. | 392 * Invoked when the audio player is being unloaded. |
402 */ | 393 */ |
403 onPageUnload: function() { | 394 onPageUnload: function() { |
404 this.$.audio.src = ''; // Hack to prevent crashing. | 395 this.$.audio.src = ''; // Hack to prevent crashing. |
405 }, | 396 }, |
406 | 397 |
407 /** | 398 /** |
408 * Invoked when dragging state of seek bar on control panel is changed. | |
409 * During the user is dragging it, audio playback is paused temporalily. | |
410 */ | |
411 onDraggingChanged_: function() { | |
412 if (this.$.audioController.dragging) { | |
413 if (this.playing) { | |
414 this.wasPlayingOnDragStart_ = true; | |
415 this.$.audio.pause(); | |
416 } | |
417 } else { | |
418 if (this.wasPlayingOnDragStart_) { | |
419 this.$.audio.play(); | |
420 this.wasPlayingOnDragStart_ = false; | |
421 } | |
422 } | |
423 }, | |
424 | |
425 /** | |
426 * Invoked when the 'keydown' event is fired. | 399 * Invoked when the 'keydown' event is fired. |
427 * @param {Event} event The event object. | 400 * @param {Event} event The event object. |
428 */ | 401 */ |
429 onKeyDown_: function(event) { | 402 onKeyDown_: function(event) { |
430 switch (event.keyIdentifier) { | 403 switch (event.keyIdentifier) { |
431 case 'Up': | 404 case 'Up': |
432 if (this.$.audioController.volumeSliderShown && this.model.volume < 100) | 405 if (this.$.audioController.volumeSliderShown && this.model.volume < 100) |
433 this.model.volume += 1; | 406 this.model.volume += 1; |
434 break; | 407 break; |
435 case 'Down': | 408 case 'Down': |
(...skipping 25 matching lines...) Expand all Loading... |
461 | 434 |
462 /** | 435 /** |
463 * Computes volume value for audio element. (should be in [0.0, 1.0]) | 436 * Computes volume value for audio element. (should be in [0.0, 1.0]) |
464 * @param {number} volume Volume which is set in the UI. ([0, 100]) | 437 * @param {number} volume Volume which is set in the UI. ([0, 100]) |
465 * @return {number} | 438 * @return {number} |
466 */ | 439 */ |
467 computeAudioVolume_: function(volume) { | 440 computeAudioVolume_: function(volume) { |
468 return volume / 100; | 441 return volume / 100; |
469 } | 442 } |
470 }); | 443 }); |
OLD | NEW |