[Files.app] Initial implementation of new audio player

chrome/browser/resources/file_manager/audio_player/elements/track_list.js

Index: chrome/browser/resources/file_manager/audio_player/elements/track_list.js
diff --git a/chrome/browser/resources/file_manager/audio_player/elements/track_list.js b/chrome/browser/resources/file_manager/audio_player/elements/track_list.js
new file mode 100644
index 0000000000000000000000000000000000000000..66765e670f20aeec65684ce60da75d029bd39a9a
--- /dev/null
+++ b/chrome/browser/resources/file_manager/audio_player/elements/track_list.js
@@ -0,0 +1,185 @@
+// Cpyright (c) 2013 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.
+
+(function() {
+  'use strict';
+
+  Polymer('track-list', {
+    /**
+     * Initialize an element. This method is called automatically when the
+     * element is ready.
+     */
+    ready: function() {
+      this.tracksObserver_ = new ArrayObserver(
+          this.tracks,
+          this.tracksValueChanged_.bind(this));
+    },
+
+    /**
+     * List of tracks.
+     * @type {Array.<AudioPlayer.TrackInfo>}
+     */
+    tracks: [],
+
+    /**
+     * Track index of the current track.
+     * If the tracks propertye is empty, it should be -1. Otherwise, be a valid
+     *     track number.

[mtomasz, 2014/01/23 08:05:09]

AFAIR we don't put indentations for the jsdoc description.

[yoshiki, 2014/01/24 15:34:19]

Yes, you're correct.

+     *
+     * @type {number}
+     */
+    currentTrackIndex: -1,
+
+    /**
+     * Invoked the current track index is changed.

[mtomasz, 2014/01/23 08:05:09]

nit: the -> when the

[yoshiki, 2014/01/24 15:34:19]

Done.

+     * @param {number} oldValue old value.
+     * @param {number} newValue new value.
+     */
+    currentTrackIndexChanged: function(oldValue, newValue) {
+      if (oldValue === newValue)
+        return;
+
+      if (oldValue !== -1)
+        this.tracks[oldValue].active = false;
+
+      if (newValue < 0 || this.tracks.length <= newValue) {
+        if (this.tracks.length === 0)
+          this.currentTrackIndex = -1;
+        else
+          this.currentTrackIndex = 0;
+        return;

[mtomasz, 2014/01/23 08:05:09]

nit: return not needed

[yoshiki, 2014/01/24 15:34:19]

Done.

+      } else {
+        this.tracks[newValue].active = true;
+      }
+    },
+
+    /**
+     * Invoked when 'tracks' property is clicked.
+     * @param {Event} event Click event.
+     */
+    tracksChanged: function(oldValue, newValue) {
+      if (oldValue != newValue) {

[mtomasz, 2014/01/23 08:05:09]

nit: != -> !==

[yoshiki, 2014/01/24 15:34:19]

Done.

+        this.tracksObserver_.close();
+        this.tracksObserver_ = new ArrayObserver(
+            this.tracks,
+            this.tracksValueChanged_.bind(this));
+        if (this.tracks.length !== 0)
+          this.currentTrackIndex = 0;
+      }
+
+      if (this.tracks.length === 0)
+        this.currentTrackIndex = -1;
+    },
+
+    /**
+     * Invoked when the value in the 'tracks' is changed.
+     * @param {Array.<Object>} splices The detail of the change.
+     */
+    tracksValueChanged_: function(splices) {
+      if (this.tracks.length === 0)
+        this.currentTrackIndex = -1;
+      else
+        this.tracks[this.currentTrackIndex].active = true;

[mtomasz, 2014/01/23 08:05:09]

Do we need to set the previous track as inactive?

[yoshiki, 2014/01/24 15:34:19]

In this case, the index of current track is not changed. What is changed is a
value in the this.tracks array.

+    },
+
+    /**
+     * Invoked when the track element is clicked.
+     * @param {Event} event Click event.
+     */
+    trackClicked: function(event) {
+      var track = event.target.templateInstance.model;
+      this.selectTrack(track);
+    },
+
+    /**
+     * Set the current track.
+     *

[mtomasz, 2014/01/23 08:05:09]

Please be consistent with new lines after jsdoc description. Here it is, but in
#35 there is none (both are 3-lines length). I put \n when jsdoc.lines.length >
3. Any way is fine, but I think we should keep consistency.

[yoshiki, 2014/01/24 15:34:19]

Removed the blank line.

+     * @param {AudioPlayer.TrackInfo} track TrackInfo to be set as the current
+     *     track.
+     */
+    selectTrack: function(track) {
+      var index = -1;

[mtomasz, 2014/01/23 08:05:09]

Can we use Array.indexOf?

[yoshiki, 2014/01/24 15:34:19]

I've just realized comparing URLs is better here.

+      for (var i = 0; i < this.tracks.length; i++) {
+        if (this.tracks[i] === track) {
+          index = i;
+          break;
+        }
+      }
+      if (index >= 0)
+        this.currentTrackIndex = index;
+    },
+
+    /**
+     * Return the current track.
+     *

[mtomasz, 2014/01/23 08:05:09]

nit: ditto

[yoshiki, 2014/01/24 15:34:19]

Done.

+     * @param {AudioPlayer.TrackInfo} track TrackInfo of the current track.
+     */
+    getCurrentTrack: function() {
+      if (this.tracks.length === 0)
+        return null;
+
+      if (this.currentTrackIndex < 0 ||

[mtomasz, 2014/01/23 08:05:09]

How about moving this if from the getter to changing handler in #79?

[yoshiki, 2014/01/24 15:34:19]

This check is already done in l.46. Removed it here.

+          this.tracks.length <= this.currentTrackIndex) {
+        this.currentTrackIndex = 0;
+      }
+
+      return this.tracks[this.currentTrackIndex];
+    },
+
+    /**
+     * Returns the next ir prev track in the track list.

[mtomasz, 2014/01/23 08:05:09]

typo: ir

[yoshiki, 2014/01/24 15:34:19]

Done.

+     *
+     * @param {boolean} forward Specify direction: forward or prev mode.

[mtomasz, 2014/01/23 08:05:09]

Can we use an enum for the direction?

[yoshiki, 2014/01/24 15:34:19]

I think boolean is enough, since this takes only two values.

+     *     True: forward mode, false: prev mode.
+     * @return {AudioPlayer.TrackInfo} TrackInfo of the next track. If there is
+     *     no track, the return value is null.
+     */
+    getNextTrackIndex: function(forward) {
+      var defaultTrack = forward ? 0 : (this.tracks.length - 1);
+      var tentativeNewTrackIndex = this.currentTrackIndex + (forward ? +1 : -1);
+      var newTrackIndex;
+
+      if (this.tracks.length === 0) {
+        newTrackIndex = -1;
+      } else {
+        if (this.currentTrackIndex === -1) {
+          newTrackIndex = defaultTrack;
+        } else if (0 <= tentativeNewTrackIndex &&
+                   tentativeNewTrackIndex < this.tracks.length) {
+          newTrackIndex = tentativeNewTrackIndex;
+        } else {
+          newTrackIndex = defaultTrack;
+        }
+      }
+
+      return newTrackIndex;
+    },
+
+    /**
+     * Returns if the next (or prev) track in the track list is available.
+     *
+     * @param {boolean} forward Specify direction: forward or prev mode.
+     *     True: forward mode, false: prev mode.
+     * @return {true} True if the next (or prev) track available. False
+     *     otherwise.
+     */
+    isNextTrackAvailable: function(forward) {
+      if (this.tracks.length === 0) {
+        return false;
+      } else {
+        var tentativeNewTrackIndex =
+            this.currentTrackIndex + (forward ? +1 : -1);
+
+        if (this.currentTrackIndex === -1) {
+          return false;
+        } else if (0 <= tentativeNewTrackIndex &&
+                   tentativeNewTrackIndex < this.tracks.length) {
+          return true;
+        } else {
+          return false;
+        }
+      }
+    }
+  });  // Polymer('track-list') block
+})();  // Anonymosus closure

[mtomasz, 2014/01/23 08:05:09]

typo: Anonymous

[yoshiki, 2014/01/24 15:34:19]

Done.