Video Player: Support casting a video

ui/file_manager/video_player/js/video_player.js

Index: ui/file_manager/video_player/js/video_player.js
diff --git a/ui/file_manager/video_player/js/video_player.js b/ui/file_manager/video_player/js/video_player.js
index 73ada6a9ec31cbb54db85af69c0253b1d11bd92f..abb5724c14b9ad5000785816227814434b796417 100644
--- a/ui/file_manager/video_player/js/video_player.js
+++ b/ui/file_manager/video_player/js/video_player.js
@@ -274,37 +274,74 @@ VideoPlayer.prototype.loadVideo_ = function(url, title, opt_callback) {
   this.controls.inactivityWatcher.disabled = false;
   this.controls.decodeErrorOccured = false;
 
+  var videoElementInitializePromise;
   if (this.currentCast_) {
-    videoPlayerElement.setAttribute('casting', true);
-    this.videoElement_ = new CastVideoElement();
-    this.controls.attachMedia(this.videoElement_);
-
-    document.querySelector('#cast-name-label').textContent =
-        loadTimeData.getString('VIDEO_PLAYER_PLAYING_ON');
-    document.querySelector('#cast-name').textContent =
-        this.currentCast_.friendlyName;
+
+    videoElementInitializePromise = new Promise(function(fulfill, reject) {

[hirono, 2014/07/24 02:12:37]

To relay rejected states, the videoElementInitializePromise should be composed
from the other promises.

1. Assign the returning value of 'then' at 304 to the variable.
2. Wrap chrome.cast.request at #308 with 'new Promise' and return the promise as
the result value of the callback function for then at 304.

[yoshiki, 2014/07/24 02:57:32]

I'm not sure but can't we call the outer reject inside the inner promise
directly?

[hirono, 2014/07/24 03:42:49]

We can. But currently if downloadUrlPromise or mimePromise is rejected, the
outer promise does not fulfilled/rejected because
Promise.all([downloadUrlPromise, mimePromise]) is also rejected, and thus the
following then's callback is not invoked.

Composing promises is a good practice (I think) to ensure to convey rejected
states to the last promise.

[yoshiki, 2014/07/24 05:19:00]

I agree this. How about the current code?

[hirono, 2014/07/24 05:46:09]

It looks good. But I would rather stop nesting 'new Promise'. It makes the
indent shallow and frees us from having both fulfill/reject and
innerFulfill/innerReject. 

[yoshiki, 2014/07/24 06:03:22]

Done.

+      videoPlayerElement.setAttribute('casting', true);
+
+      document.querySelector('#cast-name-label').textContent =
+          loadTimeData.getString('VIDEO_PLAYER_PLAYING_ON');
+      document.querySelector('#cast-name').textContent =
+          this.currentCast_.friendlyName;
+
+      var downloadUrlPromise = new Promise(function(innerFulfill, innerReject) {
+        chrome.fileBrowserPrivate.getDownloadUrl(video.url, innerFulfill);
+      }.wrap());

[hirono, 2014/07/24 02:12:36]

We don't need to wrap the function for Promise. Because Promise is rejected
automatically if the function throw an exception.
Instead, you should call 'catch' function for the eventual composed promise,
which is the return value of then at #331 in this case.

[yoshiki, 2014/07/24 02:57:32]

Done.

+
+      var mimePromise = new Promise(function(innerFulfill, innerReject) {
+        chrome.fileBrowserPrivate.getDriveEntryProperties(
+            [video.entry.toURL()],
+            function(props) {
+              if (!props || props.length === 0 || !props[0].contentMimeType) {
+                // TODO(yoshiki): Adds a logic to guess the mime.
+                innerFulfill('');
+              }
+              innerFulfill(props[0].contentMimeType);
+            }.wrap());
+      }.wrap());
+
+      Promise.all([downloadUrlPromise, mimePromise]).then(function(results) {
+        var downloadUrl = results[0];
+        var mime = results[1];
+
+        chrome.cast.requestSession(function(session) {
+          var mediaInfo = new chrome.cast.media.MediaInfo(downloadUrl);
+          mediaInfo.contentType = mime;
+          this.videoElement_ = new CastVideoElement(mediaInfo, session);
+          this.controls.attachMedia(this.videoElement_);
+          fulfill();
+        }.wrap(this), reject, undefined, this.currentCast_.label);
+      }.wrap(this));
+    }.wrap(this));
   } else {
-    videoPlayerElement.removeAttribute('casting');
+    videoElementInitializePromise = new Promise(function(fulfill, reject) {
+      videoPlayerElement.removeAttribute('casting');
 
-    this.videoElement_ = document.createElement('video');
-    document.querySelector('#video-container').appendChild(this.videoElement_);
+      this.videoElement_ = document.createElement('video');
+      document.querySelector('#video-container').appendChild(
+          this.videoElement_);
 
-    this.controls.attachMedia(this.videoElement_);
-    this.videoElement_.src = url;
+      this.controls.attachMedia(this.videoElement_);
+      this.videoElement_.src = video.url;
+      fulfill();
+    }.wrap(this));
   }
 
-  this.videoElement_.load();
+  videoElementInitializePromise.then(function() {
+    this.videoElement_.load();
 
-  if (opt_callback) {
-    var handler = function(currentPos, event) {
-      console.log('loaded: ', currentPos, this.currentPos_);
-      if (currentPos === this.currentPos_)
-        opt_callback();
-      this.videoElement_.removeEventListener('loadedmetadata', handler);
-    }.wrap(this, this.currentPos_);
+    if (opt_callback) {
+      var handler = function(currentPos, event) {
+        console.log('loaded: ', currentPos, this.currentPos_);

[hirono, 2014/07/24 02:12:37]

nit: debug log?

[yoshiki, 2014/07/24 02:57:32]

Done.

+        if (currentPos === this.currentPos_)
+          opt_callback();
+        this.videoElement_.removeEventListener('loadedmetadata', handler);
+      }.wrap(this, this.currentPos_);
 
-    this.videoElement_.addEventListener('loadedmetadata', handler);
-  }
+      this.videoElement_.addEventListener('loadedmetadata', handler);
+    }
+  }.wrap(this));
 };
 
 /**