Video Player: Use Google Cast API extension

Previously the video player used old way to control a cast, but it's now deprecated and we need to migrate to new way.

BUG=305511
TEST=List of casts is shown
R=hirono@chromium.org

Review URL: https://codereview.chromium.org/410043003

git-svn-id: svn://svn.chromium.org/chrome/trunk/src@284902 0039d316-1c4b-4281-b951-d872f2087c98

ui/file_manager/video_player/js/cast/caster.js

@@ -4,11 +4,11 @@
 
 'use strict';
 
-/**
- * The instance of cast api.
- * @type {cast.ExtensionApi}
- */
-var castApi = null;
+// This hack prevents a bug on the cast extension.
+// TODO(yoshiki): Remove this once the cast extension supports Chrome apps.
+// Although localStorage in Chrome app is not supported, but it's used in the
+// cast extension. This line prevents an exception on using localStorage.
+window.__defineGetter__('localStorage', function() { return {}; });
 
 /**
  * @type {string}
@@ -16,37 +16,83 @@ var castApi = null;
  */
 var CAST_COMMAND_LINE_FLAG = 'enable-video-player-chromecast-support';
 
+// THIS IS A TEST APP.
+// TODO(yoshiki): Fix this before launch.
+var APPLICATION_ID = '214CC863';
+
 chrome.commandLinePrivate.hasSwitch(CAST_COMMAND_LINE_FLAG, function(result) {
   if (!result)
     return;
 
-  CastExtensionDiscoverer.findInstalledExtension(onCastExtensionFound);
+  ensureLoad(initializeApi);
 });
 
-function onCastExtensionFound(extensionId) {
-  if (!extensionId) {
-    console.info('Cast extention is not found.');
-    return;
+/**
+ * Executes the given callback after the cast extension is initialized.
+ * @param {function} callback Callback (executed asynchronously).
+ */
+function ensureLoad(callback) {
+  if(!chrome.cast || !chrome.cast.isAvailable) {
+    var checkTimer = setTimeout(function() {
+      console.error('Either "Google Cast API" or "Google Cast" extension ' +
+                    'seems not to be installed?');
+    }, 5000);
+
+    window['__onGCastApiAvailable'] = function(loaded, errorInfo) {
+      if (loaded) {
+        callback();
+        clearTimeout(checkTimer);
+      } else {
+        console.error(errorInfo);
+      }
+    }
+  } else {
+    setTimeout(callback);  // Runs asynchronously.
   }
+}
 
-  var api = document.createElement('script');
-  api.src = 'chrome-extension://' + extensionId + '/api_script.js';
-  api.onload = function() {
-    initializeCast(extensionId);
+/**
+ * Initialize Cast API.
+ */
+function initializeApi() {
+  var onSession = function() {
+    // TODO(yoshiki): Implement this.
   };
-  api.onerror = function() {
-    console.error('api_script.js load failed.');
+
+  var onInitSuccess = function() {
+    // TODO(yoshiki): Implement this.
   };
-  document.body.appendChild(api);
-};
 
-function initializeCast(extensionId) {
-  loadCastExtensionApi();
+  /**
+   * @param {chrome.cast.Error} error
+   */
+  var onError = function(error) {
+    console.error('Error on Cast initialization.', error);
+  };
 
-  castApi = new cast.ExtensionApi(extensionId);
-  castApi.addReceiverListener('ChromeCast', onReceiverUpdate);
+  var sessionRequest = new chrome.cast.SessionRequest(APPLICATION_ID);
+  var apiConfig = new chrome.cast.ApiConfig(sessionRequest,
+                                            onSession,
+                                            onReceiver);
+  chrome.cast.initialize(apiConfig, onInitSuccess, onError);
 }
 
-function onReceiverUpdate(receivers) {
-  player.setCastList(receivers);
+/**
+ * @param {chrome.cast.ReceiverAvailability} availability Availability of casts.
+ * @param {Array.<Object>} receivers List of casts.
+ */
+function onReceiver(availability, receivers) {
+  if (availability === chrome.cast.ReceiverAvailability.AVAILABLE) {
+    if (!receivers) {
+      console.error('Receiver list is empty.');
+      receivers = [];
+    }
+
+    player.setCastList(receivers);
+  } else if (availability == chrome.cast.ReceiverAvailability.UNAVAILABLE) {
+    player.setCastList([]);
+  } else {
+    console.error('Unexpected response in onReceiver.', arguments);
+    player.setCastList([]);
+  }
 }

ui/file_manager/video_player/js/video_player.js

@@ -280,8 +280,9 @@ VideoPlayer.prototype.loadVideo_ = function(url, title, opt_callback) {
     this.controls.attachMedia(this.videoElement_);
 
     document.querySelector('#cast-name-label').textContent =
-        loadTimeData.getString('VIDEO_PLAYER_PLAYING_ON');;
-    document.querySelector('#cast-name').textContent = this.currentCast_.name;
+        loadTimeData.getString('VIDEO_PLAYER_PLAYING_ON');
+    document.querySelector('#cast-name').textContent =
+        this.currentCast_.friendlyName;
   } else {
     videoPlayerElement.removeAttribute('casting');
 
@@ -400,7 +401,7 @@ VideoPlayer.prototype.reloadCurrentVideo_ = function(opt_callback) {
  */
 VideoPlayer.prototype.onCastSelected_ = function(cast) {
   // If the selected item is same as the current item, do nothing.
-  if ((this.currentCast_ && this.currentCast_.name) === (cast && cast.name))
+  if ((this.currentCast_ && this.currentCast_.label) === (cast && cast.label))
     return;
 
   this.currentCast_ = cast || null;
@@ -434,7 +435,7 @@ VideoPlayer.prototype.setCastList = function(casts) {
 
   for (var i = 0; i < casts.length; i++) {
     var item = new cr.ui.MenuItem();
-    item.label = casts[i].name;
+    item.label = casts[i].friendlyName;
     item.addEventListener('activate',
                           this.onCastSelected_.wrap(this, casts[i]));
     menu.appendChild(item);

ui/file_manager/video_player/manifest.json

@@ -45,6 +45,13 @@
       ]
     }
   },
+  "import": [
+    // Google Cast API extension
+    {
+      "id": "mafeflapfdfljijmlienjedomfjfmhpd",
+      "minimum_version":  "14.507.0.31276"
+    }
+  ],
   "app": {
     "background": {
       "scripts": [

ui/file_manager/video_player/video_player.html

@@ -17,6 +17,8 @@
   <link rel="stylesheet" type="text/css" href="css/arrow_box.css">
   <link rel="stylesheet" type="text/css" href="css/cast_menu.css">
 
+  <!-- Google Cast API extension -->
+  <script src="_modules/mafeflapfdfljijmlienjedomfjfmhpd/cast_sender.js"></script>
   <script src="js/video_player_scripts.js"></script>
 </head>
 <body>