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 08f368a86c409e1308ce67d103a1cdf8b2164513..39f7ddfc72c99f2bb366f080387125c0b9175b59 100644
--- a/ui/file_manager/video_player/js/video_player.js
+++ b/ui/file_manager/video_player/js/video_player.js
@@ -75,9 +75,8 @@ FullWindowVideoControls.prototype = { __proto__: VideoControls.prototype };
  * Displays error message.
  *
  * @param {string} message Message id.
- * @private
  */
-FullWindowVideoControls.prototype.showErrorMessage_ = function(message) {
+FullWindowVideoControls.prototype.showErrorMessage = function(message) {
   var errorBanner = document.querySelector('#error');
   errorBanner.textContent =
       loadTimeData.getString(message);
@@ -92,7 +91,7 @@ FullWindowVideoControls.prototype.showErrorMessage_ = function(message) {
  * @private
  */
 FullWindowVideoControls.prototype.onPlaybackError_ = function() {
-  this.showErrorMessage_('GALLERY_VIDEO_DECODING_ERROR');
+  this.showErrorMessage('GALLERY_VIDEO_DECODING_ERROR');
   this.decodeErrorOccured = true;
 
   // Disable inactivity watcher, and disable the ui, by hiding tools manually.
@@ -273,37 +272,80 @@ VideoPlayer.prototype.loadVideo_ = function(video, 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) {
+      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);
+      });
+
+      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());

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

The exception thrown in the callback will be reported doubly.
How about passing innerFulfill to getDriveEntryProperties directly and map the
result value by continuing 'then'.

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

Done.

+      });
+
+      Promise.all([downloadUrlPromise, mimePromise]).then(function(results) {
+        var downloadUrl = results[0];
+        var mime = results[1];
+
+        return new Promise(function(innerFulfill, innerReject) {
+          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_);
+            innerFulfill();
+          }.wrap(this), innerReject, undefined, this.currentCast_.label);
+        }.bind(this));
+      }.bind(this)).then(fulfill, reject);
+    }.bind(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 = video.url;
+      this.controls.attachMedia(this.videoElement_);
+      this.videoElement_.src = video.url;
+      fulfill();
+    }.bind(this));
   }
 
-  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_);
-
-    this.videoElement_.addEventListener('loadedmetadata', handler);
-  }
+  videoElementInitializePromise.then(
+      function() {
+        this.videoElement_.load();
+
+        if (opt_callback) {
+          var handler = function(currentPos, event) {
+            if (currentPos === this.currentPos_)
+              opt_callback();
+            this.videoElement_.removeEventListener('loadedmetadata', handler);
+          }.wrap(this, this.currentPos_);
+
+          this.videoElement_.addEventListener('loadedmetadata', handler);
+        }
+      }.bind(this),
+      function videoElementInitializePromiseRejected() {
+        console.error('Failed to initialize the video element.',
+                      error.stack || error);
+        this.controls_.showErrorMessage('GALLERY_VIDEO_ERROR');
+      }.bind(this));
 };
 
 /**