OLD | NEW |
1 // Copyright (c) 2012 The Chromium Authors. All rights reserved. | 1 // Copyright (c) 2012 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 /** | 5 /** |
6 * Overrided metadata worker's path. | 6 * Overrided metadata worker's path. |
7 * @type {string} | 7 * @type {string} |
8 */ | 8 */ |
9 ContentMetadataProvider.WORKER_SCRIPT = '/js/metadata_worker.js'; | 9 ContentMetadataProvider.WORKER_SCRIPT = '/js/metadata_worker.js'; |
10 | 10 |
11 /** | 11 /** |
12 * @param {Element} container Container element. | 12 * @param {Element} container Container element. |
13 * @constructor | 13 * @constructor |
14 */ | 14 */ |
15 function AudioPlayer(container) { | 15 function AudioPlayer(container) { |
16 this.container_ = container; | 16 this.container_ = container; |
17 this.volumeManager_ = new VolumeManagerWrapper( | 17 this.volumeManager_ = new VolumeManagerWrapper( |
18 VolumeManagerWrapper.NonNativeVolumeStatus.ENABLED); | 18 VolumeManagerWrapper.NonNativeVolumeStatus.ENABLED); |
19 this.metadataModel_ = MetadataModel.create(this.volumeManager_); | 19 this.metadataModel_ = MetadataModel.create(this.volumeManager_); |
20 this.selectedEntry_ = null; | 20 this.selectedEntry_ = null; |
21 this.invalidTracks_ = {}; | 21 this.invalidTracks_ = {}; |
22 | 22 |
23 this.model_ = new AudioPlayerModel(); | 23 this.model_ = new AudioPlayerModel(); |
24 Object.observe(this.model_, function(changes) { | 24 Object.observe(this.model_, function(changes) { |
25 for (var i = 0; i < changes.length; i++) { | 25 for (var i = 0; i < changes.length; i++) { |
26 var change = changes[i]; | 26 var change = changes[i]; |
27 if (change.name === 'expanded' && | 27 if (change.name == 'expanded' && |
28 (change.type === 'add' || change.type === 'update')) { | 28 (change.type == 'add' || change.type == 'update')) { |
29 this.onModelExpandedChanged(change.oldValue, change.object.expanded); | 29 this.onModelExpandedChanged(change.oldValue, change.object.expanded); |
30 break; | 30 break; |
31 } else if (change.name === 'volumeSliderShown' && | |
32 (change.type === 'add' || change.type === 'update')) { | |
33 this.onModelVolumeSliderShownChanged(); | |
34 break; | |
35 } | 31 } |
36 } | 32 } |
37 }.bind(this)); | 33 }.bind(this)); |
38 | 34 |
39 this.entries_ = []; | 35 this.entries_ = []; |
40 this.currentTrackIndex_ = -1; | 36 this.currentTrackIndex_ = -1; |
41 this.playlistGeneration_ = 0; | 37 this.playlistGeneration_ = 0; |
42 | 38 |
43 /** | 39 /** |
44 * Whether if the playlist is expanded or not. This value is changed by | 40 * Whether if the playlist is expanded or not. This value is changed by |
(...skipping 236 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
281 }; | 277 }; |
282 | 278 |
283 /** | 279 /** |
284 * Toggles the expanded mode when resizing. | 280 * Toggles the expanded mode when resizing. |
285 * | 281 * |
286 * @param {Event} event Resize event. | 282 * @param {Event} event Resize event. |
287 * @private | 283 * @private |
288 */ | 284 */ |
289 AudioPlayer.prototype.onResize_ = function(event) { | 285 AudioPlayer.prototype.onResize_ = function(event) { |
290 if (!this.isExpanded_ && | 286 if (!this.isExpanded_ && |
291 window.innerHeight >= this.getExpandedModeMinHeight_()) { | 287 window.innerHeight >= AudioPlayer.EXPANDED_MODE_MIN_HEIGHT) { |
292 this.isExpanded_ = true; | 288 this.isExpanded_ = true; |
293 this.player_.expanded = true; | 289 this.player_.expanded = true; |
294 } else if (this.isExpanded_ && | 290 } else if (this.isExpanded_ && |
295 window.innerHeight < this.getExpandedModeMinHeight_()) { | 291 window.innerHeight < AudioPlayer.EXPANDED_MODE_MIN_HEIGHT) { |
296 this.isExpanded_ = false; | 292 this.isExpanded_ = false; |
297 this.player_.expanded = false; | 293 this.player_.expanded = false; |
298 } | 294 } |
299 }; | 295 }; |
300 | 296 |
301 /** | 297 /** |
302 * Handles keydown event to open inspector with shortcut keys. | 298 * Handles keydown event to open inspector with shortcut keys. |
303 * | 299 * |
304 * @param {Event} event KeyDown event. | 300 * @param {Event} event KeyDown event. |
305 * @private | 301 * @private |
(...skipping 26 matching lines...) Expand all Loading... |
332 AudioPlayer.HEADER_HEIGHT = 33; // 32px + border 1px | 328 AudioPlayer.HEADER_HEIGHT = 33; // 32px + border 1px |
333 | 329 |
334 /** | 330 /** |
335 * Track height in pixels. | 331 * Track height in pixels. |
336 * @type {number} | 332 * @type {number} |
337 * @const | 333 * @const |
338 */ | 334 */ |
339 AudioPlayer.TRACK_HEIGHT = 48; | 335 AudioPlayer.TRACK_HEIGHT = 48; |
340 | 336 |
341 /** | 337 /** |
342 * Volume slider's height in pixels. | 338 * Controls bar height in pixels. |
343 * @type {number} | 339 * @type {number} |
344 * @const | 340 * @const |
345 */ | 341 */ |
346 AudioPlayer.VOLUME_SLIDER_HEIGHT = 48; | 342 AudioPlayer.CONTROLS_HEIGHT = 96; |
347 | |
348 /** | |
349 * Height of the control which has buttons such as play, next, shffule, etc... | |
350 * @type {number} | |
351 * @const | |
352 */ | |
353 AudioPlayer.BUTTONS_CONTROL_HEIGHT = 48; | |
354 | |
355 /** | |
356 * Height of the control which has progress slider, time, and duration. | |
357 * @type {number} | |
358 * @const | |
359 */ | |
360 AudioPlayer.TIME_CONTROL_HEIGHT = 48; | |
361 | 343 |
362 /** | 344 /** |
363 * Default number of items in the expanded mode. | 345 * Default number of items in the expanded mode. |
364 * @type {number} | 346 * @type {number} |
365 * @const | 347 * @const |
366 */ | 348 */ |
367 AudioPlayer.DEFAULT_EXPANDED_ITEMS = 5; | 349 AudioPlayer.DEFAULT_EXPANDED_ITEMS = 5; |
368 | 350 |
369 /** | 351 /** |
| 352 * Minimum size of the window in the expanded mode in pixels. |
| 353 * @type {number} |
| 354 * @const |
| 355 */ |
| 356 AudioPlayer.EXPANDED_MODE_MIN_HEIGHT = AudioPlayer.CONTROLS_HEIGHT + |
| 357 AudioPlayer.TRACK_HEIGHT * 2; |
| 358 |
| 359 /** |
370 * Invoked when the 'expanded' property in the model is changed. | 360 * Invoked when the 'expanded' property in the model is changed. |
371 * @param {boolean} oldValue Old value. | 361 * @param {boolean} oldValue Old value. |
372 * @param {boolean} newValue New value. | 362 * @param {boolean} newValue New value. |
373 */ | 363 */ |
374 AudioPlayer.prototype.onModelExpandedChanged = function(oldValue, newValue) { | 364 AudioPlayer.prototype.onModelExpandedChanged = function(oldValue, newValue) { |
375 if (this.isExpanded_ !== null && | 365 if (this.isExpanded_ !== null && |
376 this.isExpanded_ === newValue) | 366 this.isExpanded_ === newValue) |
377 return; | 367 return; |
378 | 368 |
379 if (this.isExpanded_ && !newValue) | 369 if (this.isExpanded_ && !newValue) |
380 this.lastExpandedHeight_ = window.innerHeight; | 370 this.lastExpandedHeight_ = window.innerHeight; |
381 | 371 |
382 if (this.isExpanded_ !== newValue) { | 372 if (this.isExpanded_ !== newValue) { |
383 this.isExpanded_ = newValue; | 373 this.isExpanded_ = newValue; |
384 this.syncHeight_(); | 374 this.syncHeight_(); |
385 | 375 |
386 // Saves new state. | 376 // Saves new state. |
387 window.appState.expanded = newValue; | 377 window.appState.expanded = newValue; |
388 util.saveAppState(); | 378 util.saveAppState(); |
389 } | 379 } |
390 }; | 380 }; |
391 | 381 |
392 /** | 382 /** |
393 * Invoked when the 'volumeSliderShown' property in the model is changed. | |
394 */ | |
395 AudioPlayer.prototype.onModelVolumeSliderShownChanged = function() { | |
396 this.syncHeight_(); | |
397 }; | |
398 | |
399 /** | |
400 * @private | 383 * @private |
401 */ | 384 */ |
402 AudioPlayer.prototype.syncHeight_ = function() { | 385 AudioPlayer.prototype.syncHeight_ = function() { |
403 var targetHeight; | 386 var targetHeight; |
404 | 387 |
405 if (this.player_.expanded) { | 388 if (this.player_.expanded) { |
406 // Expanded. | 389 // Expanded. |
407 if (!this.lastExpandedHeight_ || | 390 if (!this.lastExpandedHeight_ || |
408 this.lastExpandedHeight_ < this.getExpandedModeMinHeight_()) { | 391 this.lastExpandedHeight_ < AudioPlayer.EXPANDED_MODE_MIN_HEIGHT) { |
409 var expandedListHeight = | 392 var expandedListHeight = |
410 Math.min(this.entries_.length, AudioPlayer.DEFAULT_EXPANDED_ITEMS) * | 393 Math.min(this.entries_.length, AudioPlayer.DEFAULT_EXPANDED_ITEMS) * |
411 AudioPlayer.TRACK_HEIGHT; | 394 AudioPlayer.TRACK_HEIGHT; |
412 targetHeight = this.getControlsHeight_() + expandedListHeight; | 395 targetHeight = AudioPlayer.CONTROLS_HEIGHT + expandedListHeight; |
413 this.lastExpandedHeight_ = targetHeight; | 396 this.lastExpandedHeight_ = targetHeight; |
414 } else { | 397 } else { |
415 targetHeight = this.lastExpandedHeight_; | 398 targetHeight = this.lastExpandedHeight_; |
416 } | 399 } |
417 } else { | 400 } else { |
418 // Not expanded. | 401 // Not expanded. |
419 targetHeight = this.getControlsHeight_() + AudioPlayer.TRACK_HEIGHT; | 402 targetHeight = AudioPlayer.CONTROLS_HEIGHT + AudioPlayer.TRACK_HEIGHT; |
420 } | 403 } |
421 | 404 |
422 window.resizeTo(window.innerWidth, targetHeight + AudioPlayer.HEADER_HEIGHT); | 405 window.resizeTo(window.innerWidth, targetHeight + AudioPlayer.HEADER_HEIGHT); |
423 }; | 406 }; |
424 | 407 |
425 /** | 408 /** |
426 * Calculates the height of control panel. | |
427 * @return {number} Current height of control panel in pixels. | |
428 * @private | |
429 */ | |
430 AudioPlayer.prototype.getControlsHeight_ = function() { | |
431 var height = AudioPlayer.BUTTONS_CONTROL_HEIGHT + | |
432 AudioPlayer.TIME_CONTROL_HEIGHT; | |
433 if (this.player_.volumeSliderShown) | |
434 height += AudioPlayer.VOLUME_SLIDER_HEIGHT; | |
435 | |
436 return height; | |
437 }; | |
438 | |
439 /** | |
440 * Calculates the minium height of the app to show the playlist in expanded | |
441 * mode. | |
442 * @return {number} The minimum height of audio app window in which we can show | |
443 * the playlist in expanded mode. | |
444 * @private | |
445 */ | |
446 AudioPlayer.prototype.getExpandedModeMinHeight_ = function() { | |
447 return this.getControlsHeight_() + AudioPlayer.TRACK_HEIGHT * 2; | |
448 }; | |
449 | |
450 /** | |
451 * Create a TrackInfo object encapsulating the information about one track. | 409 * Create a TrackInfo object encapsulating the information about one track. |
452 * | 410 * |
453 * @param {FileEntry} entry FileEntry to be retrieved the track info from. | 411 * @param {FileEntry} entry FileEntry to be retrieved the track info from. |
454 * @constructor | 412 * @constructor |
455 */ | 413 */ |
456 AudioPlayer.TrackInfo = function(entry) { | 414 AudioPlayer.TrackInfo = function(entry) { |
457 this.url = entry.toURL(); | 415 this.url = entry.toURL(); |
458 this.title = this.getDefaultTitle(); | 416 this.title = this.getDefaultTitle(); |
459 this.artist = this.getDefaultArtist(); | 417 this.artist = this.getDefaultArtist(); |
460 | 418 |
(...skipping 34 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
495 // TODO(yoshiki): Handle error in better way. | 453 // TODO(yoshiki): Handle error in better way. |
496 // TODO(yoshiki): implement artwork (metadata.thumbnail) | 454 // TODO(yoshiki): implement artwork (metadata.thumbnail) |
497 this.title = metadata.mediaTitle || this.getDefaultTitle(); | 455 this.title = metadata.mediaTitle || this.getDefaultTitle(); |
498 this.artist = error || metadata.mediaArtist || this.getDefaultArtist(); | 456 this.artist = error || metadata.mediaArtist || this.getDefaultArtist(); |
499 }; | 457 }; |
500 | 458 |
501 // Starts loading the audio player. | 459 // Starts loading the audio player. |
502 window.addEventListener('DOMContentLoaded', function(e) { | 460 window.addEventListener('DOMContentLoaded', function(e) { |
503 AudioPlayer.load(); | 461 AudioPlayer.load(); |
504 }); | 462 }); |
OLD | NEW |