[MediaRouter UI] Compile MR WebUI js code with Closure.

chrome/browser/resources/media_router/media_router_data.js

Index: chrome/browser/resources/media_router/media_router_data.js
diff --git a/chrome/browser/resources/media_router/media_router_data.js b/chrome/browser/resources/media_router/media_router_data.js
index 794b171eff26de2b52b27b5d0654dec99c6b7700..a9e23397f909e891e7bfcf209e1e4663028ce4f2 100644
--- a/chrome/browser/resources/media_router/media_router_data.js
+++ b/chrome/browser/resources/media_router/media_router_data.js
@@ -38,7 +38,7 @@ cr.define('media_router', function() {
 
   /**
    * This corresponds to the C++ MediaSink IconType.
-   * @enum {mumber}
+   * @enum {number}
    */
   var SinkIconType = {
     CAST: 0,
@@ -59,7 +59,7 @@ cr.define('media_router', function() {
 
 
   /**
-   * @param {media_router.CastModeType} type The type of cast mode.
+   * @param {number} type The type of cast mode.
    * @param {string} description The description of the cast mode.
    * @param {?string} host The hostname of the site to cast.
    * @constructor
@@ -83,6 +83,32 @@ cr.define('media_router', function() {
   var AUTO_CAST_MODE = new CastMode(CastModeType.AUTO,
       loadTimeData.getString('autoCastMode'), null);
 
+  /**
+   * @const {string}
+   */
+  var DEVICE_MISSING_TEXT = loadTimeData.getString('deviceMissing');
+
+  /**
+   * @const {string}
+   */
+  var ISSUE_HEADER_TEXT = loadTimeData.getString('issueHeader');
+
+  /**
+   * @const {string}
+   */
+  var SELECT_CAST_MODE_HEADER_TEXT =
+      loadTimeData.getString('selectCastModeHeader');
+
+  /**
+   * @const {string}
+   */
+  var SHARE_YOUR_SCREEN_SUBHEADING_TEXT =
+      loadTimeData.getString('shareYourScreenSubheading');
+
+  /**
+   * @const {string}
+   */
+  var STOP_CASTING_BUTTON_TEXT = loadTimeData.getString('stopCastingButton');

[Dan Beam, 2015/12/10 23:41:34]

why are these better?  also, have you see I18nBehavior?

[imcheng, 2015/12/11 01:14:59]

Calling loadtimeData from Polymer properties doesn't work: "ERROR - No
properties on this expression"

I could make the value be function() { return loadtimeData.getString(...); }.
But since the string is more of a static constant I wonder if that's the right
thing to do? Or it doesn't matter since media-router-container is supposedly a
singleton?

[Dan Beam, 2015/12/11 04:58:46]

you just need to include load_time_data.js, string.js, and i18n_template.js
before this template

also, yes: you could defer creating the property with:

  properties: {
    i18n_: function() {
      return {
        MSG1: loadTimeData.getString('msg1'),
        ...
      },
    },
  },

and bind to

  [[i18n_.MSG1]]

as well as the single value format like you mentioned:

  properties: {
    MSG1: {
      type: String,
      value: function() { return loadTimeData.getString('msg1'); },
    },
  },

[imcheng, 2015/12/11 20:00:46]

Done. Went with latter.

 
   /**
    * @param {string} id The ID of this issue.
@@ -164,8 +190,8 @@ cr.define('media_router', function() {
    * @param {string} id The ID of the media sink.
    * @param {string} name The name of the sink.
    * @param {?string} description Optional description of the sink.
-   * @param {media_router.SinkIconType} iconType the type of icon for the sink.
-   * @param {media_router.SinkStatus} status The readiness state of the sink.
+   * @param {number} iconType the type of icon for the sink.

[imcheng, 2015/12/10 21:37:21]

The compiler won't let me use media_router.SinkIconType here. Looking at other
projects' code it seems it is WAI?

[imcheng, 2015/12/11 01:14:59]

Moving the enum out of cr.define and using cr.export solves the problem.

+   * @param {string} status The readiness state of the sink.
    * @param {number} castModes Bitset of cast modes compatible with the sink.
    * @constructor
    * @struct
@@ -180,10 +206,10 @@ cr.define('media_router', function() {
     /** @type {?string} */
     this.description = description;
 
-    /** @type {SinkIconType} */
+    /** @type {number} */
     this.iconType = iconType;
 
-    /** @type {media_router.SinkStatus} */
+    /** @type {string} */
     this.status = status;
 
     /** @type {number} */
@@ -207,6 +233,11 @@ cr.define('media_router', function() {
 
   return {
     AUTO_CAST_MODE: AUTO_CAST_MODE,
+    DEVICE_MISSING_TEXT: DEVICE_MISSING_TEXT,
+    ISSUE_HEADER_TEXT: ISSUE_HEADER_TEXT,
+    SELECT_CAST_MODE_HEADER_TEXT: SELECT_CAST_MODE_HEADER_TEXT,
+    SHARE_YOUR_SCREEN_SUBHEADING_TEXT: SHARE_YOUR_SCREEN_SUBHEADING_TEXT,
+    STOP_CASTING_BUTTON_TEXT: STOP_CASTING_BUTTON_TEXT,
     CastModeType: CastModeType,
     MediaRouterView: MediaRouterView,
     SinkIconType: SinkIconType,