Video Player: Support casting a video

ui/file_manager/video_player/js/video_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.
 
 'use strict';
 
 /**
  * @param {Element} playerContainer Main container.
  * @param {Element} videoContainer Container for the video element.
  * @param {Element} controlsContainer Container for video controls.
@@ skipping 57 matching lines @@
 
   this.inactivityWatcher_.check();
 }
 
 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);
   errorBanner.setAttribute('visible', 'true');
 
   // The window is hidden if the video has not loaded yet.
   chrome.app.window.current().show();
 };
 
 /**
  * Handles playback (decoder) errors.
  * @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.
   this.inactivityWatcher.disabled = true;
   document.querySelector('#video-player').setAttribute('disabled', 'true');
 
   // Detach the video element, since it may be unreliable and reset stored
   // current playback time.
   this.cleanup();
   this.clearState();
@@ skipping 160 matching lines @@
     videoPlayerElement.setAttribute('first-video', true);
   else
     videoPlayerElement.removeAttribute('first-video');
 
   // Re-enables ui and hides error message if already displayed.
   document.querySelector('#video-player').removeAttribute('disabled');
   document.querySelector('#error').removeAttribute('visible');
   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_);
+    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;
+      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();
+  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) {
+            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);
+        }
+      }.bind(this),
+      function videoElementInitializePromiseRejected() {
+        console.error('Failed to initialize the video element.',
+                      error.stack || error);
+        this.controls_.showErrorMessage('GALLERY_VIDEO_ERROR');
+      }.bind(this));
 };
 
 /**
  * Plays the first video.
  */
 VideoPlayer.prototype.playFirstVideo = function() {
   this.currentPos_ = 0;
   this.reloadCurrentVideo_(this.onFirstVideoReady_.wrap(this));
 };
 
@@ skipping 162 matching lines @@
 var initPromise = Promise.all(
     [new Promise(initVideos.wrap(null)),
      new Promise(initStrings.wrap(null)),
      new Promise(util.addPageLoadHandler.wrap(null))]);
 
 initPromise.then(function(results) {
   var videos = results[0];
   player.prepare(videos);
   return new Promise(player.playFirstVideo.wrap(player));
 }.wrap(null));