[Media Router] Custom Controls 4 - Implement details view WebUI

chrome/browser/resources/media_router/media_router_ui_interface.js

Index: chrome/browser/resources/media_router/media_router_ui_interface.js
diff --git a/chrome/browser/resources/media_router/media_router_ui_interface.js b/chrome/browser/resources/media_router/media_router_ui_interface.js
index a8ec54461a248a242f5475c160923d50dc85ccfd..bbf70dbaf11ea1d3fd450b4124e9d1818a17eafa 100644
--- a/chrome/browser/resources/media_router/media_router_ui_interface.js
+++ b/chrome/browser/resources/media_router/media_router_ui_interface.js
@@ -13,6 +13,9 @@ cr.define('media_router.ui', function() {
   // The media-router-header element.
   var header = null;
 
+  // The route-controls element. Is null if the route details view isn't open.
+  var routeControls = null;
+
   /**
    * Handles response of previous create route attempt.
    *
@@ -26,6 +29,14 @@ cr.define('media_router.ui', function() {
     container.onCreateRouteResponseReceived(sinkId, route, isForDisplay);
   }
 
+  /**
+   * Called when the route controller for the route that is currently selected
+   * is invalidated.
+   */
+  function onRouteControllerInvalidated() {
+    container.onRouteControllerInvalidated();
+  }
+
   /**
    * Handles the search response by forwarding |sinkId| to the container.
    *
@@ -102,6 +113,8 @@ cr.define('media_router.ui', function() {
    * Parameters in data:
    *   deviceMissingUrl - url to be opened on "Device missing?" clicked.
    *   sinksAndIdentity - list of sinks to be displayed and user identity.
+   *   useNewRouteControls - whether the new WebUI route controls should be
+   *                         used.
    *   routes - list of routes that are associated with the sinks.
    *   castModes - list of available cast modes.
    *   useTabMirroring - whether the cast mode should be set to TAB_MIRROR.
@@ -110,6 +123,7 @@ cr.define('media_router.ui', function() {
     container.deviceMissingUrl = data['deviceMissingUrl'];
     container.castModeList = data['castModes'];
     this.setSinkListAndIdentity(data['sinksAndIdentity']);
+    container.useWebUiRouteControls = !!data['useNewRouteControls'];
     container.routeList = data['routes'];
     container.maybeShowRouteDetailsOnOpen();
     if (data['useTabMirroring'])
@@ -127,6 +141,16 @@ cr.define('media_router.ui', function() {
     container.issue = issue;
   }
 
+  /**
+   * Sets |routeControls|. The argument may be null if the route details view is
+   * getting closed.
+   *
+   * @param {?MediaRouterRouteControlsElement} mediaRouterRouteControls
+   */
+  function setRouteControls(mediaRouterRouteControls) {
+    routeControls = mediaRouterRouteControls;
+  }
+
   /**
    * Sets the list of currently active routes.
    *
@@ -166,17 +190,30 @@ cr.define('media_router.ui', function() {
     container.updateMaxDialogHeight(height);
   }
 
+  /**
+   * Updates the route status shown in the route controls.
+   *
+   * @param {!media_router.RouteStatus} status
+   */
+  function updateRouteStatus(status) {
+    if (routeControls)
+      routeControls.routeStatus = status;
+  }
+
   return {
     onCreateRouteResponseReceived: onCreateRouteResponseReceived,
+    onRouteControllerInvalidated: onRouteControllerInvalidated,
     receiveSearchResult: receiveSearchResult,
     setCastModeList: setCastModeList,
     setElements: setElements,
     setFirstRunFlowData: setFirstRunFlowData,
     setInitialData: setInitialData,
     setIssue: setIssue,
+    setRouteControls: setRouteControls,
     setRouteList: setRouteList,
     setSinkListAndIdentity: setSinkListAndIdentity,
     updateMaxHeight: updateMaxHeight,
+    updateRouteStatus: updateRouteStatus,
   };
 });
 
@@ -254,6 +291,36 @@ cr.define('media_router.browserApi', function() {
     chrome.send('onInitialDataReceived');
   }
 
+  /**
+   * Reports that the route details view was closed.
+   */
+  function onMediaControllerClosed() {
+    chrome.send('onMediaControllerClosed');
+  }
+
+  /**
+   * Reports that the route details view was opened for |routeId|.
+   *
+   * @param {string} routeId
+   */
+  function onMediaControllerAvailable(routeId) {
+    chrome.send('onMediaControllerAvailable', [{routeId: routeId}]);
+  }
+
+  /**
+   * Sends a command to pause the route shown in the route details view.
+   */
+  function pauseCurrentMedia() {
+    chrome.send('pauseCurrentMedia');
+  }
+
+  /**
+   * Sends a command to play the route shown in the route details view.
+   */
+  function playCurrentMedia() {
+    chrome.send('playCurrentMedia');
+  }
+
   /**
    * Reports when the user clicks outside the dialog.
    */
@@ -401,6 +468,35 @@ cr.define('media_router.browserApi', function() {
                   selectedCastMode: selectedCastMode}]);
   }
 
+  /**
+   * Sends a command to seek the route shown in the route details view.
+   *
+   * @param {number} time The new current time in seconds.
+   */
+  function seekCurrentMedia(time) {
+    chrome.send('seekCurrentMedia', [{time: time}]);
+  }
+
+  /**
+   * Sends a command to mute or unmute the route shown in the route details
+   * view.
+   *
+   * @param {boolean} mute Mute the route if true, unmute it if false.
+   */
+  function setCurrentMediaMute(mute) {
+    chrome.send('setCurrentMediaMute', [{mute: mute}]);
+  }
+
+  /**
+   * Sends a command to change the volume of the route shown in the route
+   * details view.
+   *
+   * @param {number} volume The volume between 0 and 1.
+   */
+  function setCurrentMediaVolume(volume) {
+    chrome.send('setCurrentMediaVolume', [{volume: volume}]);
+  }
+
   return {
     acknowledgeFirstRunFlow: acknowledgeFirstRunFlow,
     actOnIssue: actOnIssue,
@@ -409,6 +505,10 @@ cr.define('media_router.browserApi', function() {
     closeRoute: closeRoute,
     joinRoute: joinRoute,
     onInitialDataReceived: onInitialDataReceived,
+    onMediaControllerClosed: onMediaControllerClosed,
+    onMediaControllerAvailable: onMediaControllerAvailable,
+    pauseCurrentMedia: pauseCurrentMedia,
+    playCurrentMedia: playCurrentMedia,
     reportBlur: reportBlur,
     reportClickedSinkIndex: reportClickedSinkIndex,
     reportFilter: reportFilter,
@@ -424,5 +524,8 @@ cr.define('media_router.browserApi', function() {
     requestInitialData: requestInitialData,
     requestRoute: requestRoute,
     searchSinksAndCreateRoute: searchSinksAndCreateRoute,
+    seekCurrentMedia: seekCurrentMedia,
+    setCurrentMediaMute: setCurrentMediaMute,
+    setCurrentMediaVolume: setCurrentMediaVolume,
   };
 });