Add an update warning for downloading over mobile data

https://screenshot.googleplex.com/sHy71kU48TQ

BUG=691108
CQ_INCLUDE_TRYBOTS=master.tryserver.chromium.linux:closure_compilation

Review-Url: https://codereview.chromium.org/2795603002
Cr-Commit-Position: refs/heads/master@{#463314}

chrome/app/settings_strings.grdp

@@ -107,6 +107,17 @@
     <message name="IDS_SETTINGS_ABOUT_PAGE_DIALOG_CHANNEL_DEV" desc="The development option in the channel select.">
       Developer - unstable
     </message>
+
+    <!-- About Page: Update warning dialog -->
+    <message name="IDS_SETTINGS_ABOUT_PAGE_UPDATE_WARNING_MESSAGE" desc="Warning about update over mobile data, specifying the size in megabytes.">
+      Update will be downloaded using <ph name="UPDATE_SIZE_MB">$1<ex>0</ex></ph> MB of mobile data. Would you like to continue?
+    </message>
+    <message name="IDS_SETTINGS_ABOUT_PAGE_UPDATE_WARNING_TITLE" desc="The title of the warning about update over mobile data.">
+      Download update using mobile data
+    </message>
+    <message name="IDS_SETTINGS_ABOUT_PAGE_UPDATE_WARNING_CONTINUE_BUTTON" desc="A button that accepts downloading the update over mobile data.">
+      Continue
+    </message>
   </if>
   <if expr="not chromeos">
     <message name="IDS_SETTINGS_ABOUT_PAGE_RELAUNCH" desc="The label for the relaunch button that relaunches the browser once update is complete">

chrome/browser/resources/settings/about_page/update_warning_dialog.html

+<link rel="import" href="chrome://resources/cr_elements/cr_dialog/cr_dialog.html">
+<link rel="import" href="chrome://resources/html/i18n_behavior.html">
+<link rel="import" href="chrome://resources/html/polymer.html">
+<link rel="import" href="chrome://resources/polymer/v1_0/paper-button/paper-button.html">
+<link rel="import" href="about_page_browser_proxy.html">
+<link rel="import" href="../settings_shared_css.html">
+
+<dom-module id="settings-update-warning-dialog">
+  <template>
+    <style include="settings-shared"></style>
+    <dialog is="cr-dialog" id="dialog" close-text="$i18n{close}">
+      <div class="title">$i18n{aboutUpdateWarningTitle}</div>
+      <div class="body">
+        <div id="update-warning-message"></div>
+      </div>
+      <div class="button-container">
+        <paper-button id="cancel" class="cancel-button"
+            on-tap="onCancelTap_">$i18n{cancel}</paper-button>
+        <paper-button id="continue" class="action-button"
+            on-tap="onContinueTap_">
+          $i18n{aboutUpdateWarningContinue}
+        </paper-button>
+      </div>
+    </dialog>
+  </template>
+  <script src="update_warning_dialog.js"></script>
+</dom-module>

chrome/browser/resources/settings/about_page/update_warning_dialog.js

+// Copyright 2017 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.
+
+/**
+ * @fileoverview 'settings-update-warning-dialog' is a component warning the
+ * user about update over mobile data. By clicking 'Continue', the user
+ * agrees to download update using mobile data.
+ */
+Polymer({
+  is: 'settings-update-warning-dialog',
+
+  behaviors: [I18nBehavior],
+
+  /** @override */
+  ready: function() {
+    this.browserProxy_ = settings.AboutPageBrowserProxyImpl.getInstance();
+  },
+
+  /** @override */
+  attached: function() {
+    this.$.dialog.showModal();
+  },
+
+  /** @private */
+  onCancelTap_: function() {
+    // TODO(weidongg): implement the real behaviors here.
+    this.$.dialog.close();
+  },
+
+  /** @private */
+  onContinueTap_: function() {
+    // TODO(weidongg): implement the real behaviors here.
+    this.$.dialog.close();
+  },
+
+  /**
+   * @param {string} updateSizeMb Size of the update in megabytes.
+   * @private
+   */
+  setUpdateWarningMessage: function(updateSizeMb) {
+     this.$$("#update-warning-message").innerHTML =
+         this.i18n("aboutUpdateWarningMessage", updateSizeMb);
+  },
+});

chrome/browser/resources/settings/settings_resources.grd

@@ -58,6 +58,12 @@
         <structure name="IDR_SETTINGS_DETAILED_BUILD_INFO_HTML"
                    file="about_page/detailed_build_info.html"
                    type="chrome_html" />
+        <structure name="IDR_SETTINGS_UPDATE_WARNING_DIALOG_HTML"
+                   file="about_page/update_warning_dialog.html"
+                   type="chrome_html" />
+        <structure name="IDR_SETTINGS_UPDATE_WARNING_DIALOG_JS"
+                   file="about_page/update_warning_dialog.js"
+                   type="chrome_html" />
       </if>
       <structure name="IDR_SETTINGS_ADD_SITE_DIALOG_HTML"
                  file="site_settings/add_site_dialog.html"

chrome/browser/ui/webui/settings/md_settings_localized_strings_provider.cc

@@ -269,6 +269,13 @@ void AddAboutStrings(content::WebUIDataSource* html_source) {
     {"aboutChannelDialogBeta", IDS_SETTINGS_ABOUT_PAGE_DIALOG_CHANNEL_BETA},
     {"aboutChannelDialogDev", IDS_SETTINGS_ABOUT_PAGE_DIALOG_CHANNEL_DEV},
     {"aboutChannelDialogStable", IDS_SETTINGS_ABOUT_PAGE_DIALOG_CHANNEL_STABLE},
+
+    // About page, update warning dialog.
+    {"aboutUpdateWarningMessage",
+     IDS_SETTINGS_ABOUT_PAGE_UPDATE_WARNING_MESSAGE},
+    {"aboutUpdateWarningTitle", IDS_SETTINGS_ABOUT_PAGE_UPDATE_WARNING_TITLE},
+    {"aboutUpdateWarningContinue",
+     IDS_SETTINGS_ABOUT_PAGE_UPDATE_WARNING_CONTINUE_BUTTON},
 #endif
   };
   AddLocalizedStringsBulk(html_source, localized_strings,