Reland MD Audio Player.

ui/file_manager/audio_player/elements/audio_player.js

 // Copyright 2014 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
 Polymer({
   is: 'audio-player',
 
   properties: {
     /**
      * Flag whether the audio is playing or paused. True if playing, or false
@@ skipping 72 matching lines @@
       reflectToAttribute: true
     },
 
     /**
      * The number of played tracks. (exposed publicly for tests)
      */
     playcount: {
       type: Number,
       value: 0,
       reflectToAttribute: true
+    },
+
+    ariaLabels: {
+      type: Object
     }
   },
 
   /**
+   * The last playing state when user starts dragging the seek bar.
+   * @private {boolean}
+   */
+  wasPlayingOnDragStart_: false,
+
+  /**
    * Handles change event for shuffle mode.
    * @param {boolean} shuffle
    */
   shuffleChanged: function(shuffle) {
     if (this.model)
       this.model.shuffle = shuffle;
   },
 
   /**
    * Handles change event for repeat mode.
@@ skipping 21 matching lines @@
       this.model.expanded = expanded;
   },
 
   /**
    * Initializes an element. This method is called automatically when the
    * element is ready.
    */
   ready: function() {
     this.addEventListener('keydown', this.onKeyDown_.bind(this));
 
+    this.$.audioController.addEventListener('dragging-changed',
+        this.onDraggingChanged_.bind(this));
+
     this.$.audio.volume = 0;  // Temporary initial volume.
     this.$.audio.addEventListener('ended', this.onAudioEnded.bind(this));
     this.$.audio.addEventListener('error', this.onAudioError.bind(this));
 
     var onAudioStatusUpdatedBound = this.onAudioStatusUpdate_.bind(this);
     this.$.audio.addEventListener('timeupdate', onAudioStatusUpdatedBound);
     this.$.audio.addEventListener('ended', onAudioStatusUpdatedBound);
     this.$.audio.addEventListener('play', onAudioStatusUpdatedBound);
     this.$.audio.addEventListener('pause', onAudioStatusUpdatedBound);
     this.$.audio.addEventListener('suspend', onAudioStatusUpdatedBound);
@@ skipping 120 matching lines @@
    * This handler is registered in this.ready().
    * @private
    */
   onAudioStatusUpdate_: function() {
     this.time = (this.lastAudioUpdateTime_ = this.$.audio.currentTime * 1000);
     this.duration = this.$.audio.duration * 1000;
     this.playing = !this.$.audio.paused;
   },
 
   /**
+   * Invoked when receivig a request to start playing the current music.
+   */
+  onPlayCurrentTrack: function() {
+    this.$.audio.play();
+  },
+
+  /**
    * Invoked when receiving a request to replay the current music from the track
    * list element.
    */
   onReplayCurrentTrack: function() {
     // Changes the current time back to the beginning, regardless of the current
     // status (playing or paused).
     this.$.audio.currentTime = 0;
     this.time = 0;
   },
 
@@ skipping 101 matching lines @@
   },
 
   /**
    * Invoked when the audio player is being unloaded.
    */
   onPageUnload: function() {
     this.$.audio.src = '';  // Hack to prevent crashing.
   },
 
   /**
+   * Invoked when dragging state of seek bar on control panel is changed.
+   * During the user is dragging it, audio playback is paused temporalily.
+   */
+  onDraggingChanged_: function() {
+    if (this.$.audioController.dragging) {
+      if (this.playing) {
+        this.wasPlayingOnDragStart_ = true;
+        this.$.audio.pause();
+      }
+    } else {
+      if (this.wasPlayingOnDragStart_) {
+        this.$.audio.play();
+        this.wasPlayingOnDragStart_ = false;
+      }
+    }
+  },
+
+  /**
    * Invoked when the 'keydown' event is fired.
    * @param {Event} event The event object.
    */
   onKeyDown_: function(event) {
     switch (event.keyIdentifier) {
       case 'Up':
         if (this.$.audioController.volumeSliderShown && this.model.volume < 100)
           this.model.volume += 1;
         break;
       case 'Down':
@@ skipping 25 matching lines @@
 
   /**
    * Computes volume value for audio element. (should be in [0.0, 1.0])
    * @param {number} volume Volume which is set in the UI. ([0, 100])
    * @return {number}
    */
   computeAudioVolume_: function(volume) {
     return volume / 100;
   }
 });