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..07627baba356d1c372dd01f99a0c25a1abae2905 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,77 @@ 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());
+      });
+
+      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);
+      }.bind(this), 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.');

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

The argument of the error handler is useful.
It may be Error thrown in callback functions, so you can print the stack trace
of the exception as following.

console.error('Failed to...', error.stack || error);

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

Done.

+        this.controls_.showErrorMessage('GALLERY_VIDEO_ERROR');
+      }.bind(this));
 };
 
 /**