1 files changed, 120 insertions, 11 deletions

diff --git a/chromium/chrome/browser/resources/settings/appearance_page/appearance_page.js b/chromium/chrome/browser/resources/settings/appearance_page/appearance_page.js
index d12a1acc5f3..52691cb918f 100644
--- a/chromium/chrome/browser/resources/settings/appearance_page/appearance_page.js
+++ b/chromium/chrome/browser/resources/settings/appearance_page/appearance_page.js
@@ -3,25 +3,33 @@
 // found in the LICENSE file.
 
 /**
- * 'cr-settings-appearance-page' is the settings page containing appearance
+ * 'settings-appearance-page' is the settings page containing appearance
  * settings.
  *
  * Example:
  *
  *    <iron-animated-pages>
- *      <cr-settings-appearance-page prefs="{{prefs}}">
- *      </cr-settings-appearance-page>
+ *      <settings-appearance-page prefs="{{prefs}}">
+ *      </settings-appearance-page>
  *      ... other pages ...
  *    </iron-animated-pages>
  *
  * @group Chrome Settings Elements
- * @element cr-settings-appearance-page
+ * @element settings-appearance-page
  */
 Polymer({
-  is: 'cr-settings-appearance-page',
+  is: 'settings-appearance-page',
 
   properties: {
     /**
+     * The current active route.
+     */
+    currentRoute: {
+      notify: true,
+      type: Object,
+    },
+
+    /**
      * Preferences state.
      */
     prefs: {
@@ -30,18 +38,87 @@ Polymer({
     },
 
     /**
-     * Translated strings used in data binding.
+     * @private
+     */
+    allowResetTheme_: {
+      notify: true,
+      type: Boolean,
+      value: false,
+    },
+
+    /**
+     * @private
      */
-    i18n_: {
+    defaultZoomLevel_: {
+      notify: true,
       type: Object,
       value: function() {
         return {
-          homePageNtp: loadTimeData.getString('homePageNtp'),
-          openThisPage: loadTimeData.getString('openThisPage'),
-          onStartupEnterUrl: loadTimeData.getString('onStartupEnterUrl'),
+          type: chrome.settingsPrivate.PrefType.NUMBER,
         };
       },
     },
+
+    /**
+     * List of options for the font size drop-down menu.
+     * @type {!DropdownMenuOptionList}
+     */
+    fontSizeOptions_: {
+      readOnly: true,
+      type: Array,
+      value: function() {
+        return [
+          {value: 9, name: loadTimeData.getString('verySmall')},
+          {value: 12, name: loadTimeData.getString('small')},
+          {value: 16, name: loadTimeData.getString('medium')},
+          {value: 20, name: loadTimeData.getString('large')},
+          {value: 24, name: loadTimeData.getString('veryLarge')},
+        ];
+      },
+    },
+
+    /**
+     * List of options for the page zoom drop-down menu.
+     * @type {!DropdownMenuOptionList}
+     */
+    pageZoomOptions_: {
+      readOnly: true,
+      type: Array,
+      value: [
+        {value: 25, name: '25%'},
+        {value: 33, name: '33%'},
+        {value: 50, name: '50%'},
+        {value: 67, name: '67%'},
+        {value: 75, name: '75%'},
+        {value: 90, name: '90%'},
+        {value: 100, name: '100%'},
+        {value: 110, name: '110%'},
+        {value: 125, name: '125%'},
+        {value: 150, name: '150%'},
+        {value: 175, name: '175%'},
+        {value: 200, name: '200%'},
+        {value: 300, name: '300%'},
+        {value: 400, name: '400%'},
+        {value: 500, name: '500%'},
+      ],
+    },
+  },
+
+  behaviors: [
+    I18nBehavior,
+  ],
+
+  observers: [
+    'zoomLevelChanged_(defaultZoomLevel_.value)',
+  ],
+
+  ready: function() {
+    this.$.defaultFontSize.menuOptions = this.fontSizeOptions_;
+    this.$.pageZoom.menuOptions = this.pageZoomOptions_;
+    // TODO(dschuyler): Look into adding a listener for the
+    // default zoom percent.
+    chrome.settingsPrivate.getDefaultZoomPercent(
+        this.zoomPrefChanged_.bind(this));
   },
 
   /** @override */
@@ -55,8 +132,16 @@ Polymer({
                         this.setResetThemeEnabled.bind(this));
   },
 
+  /**
+   * @param {boolean} enabled Whether the theme reset is available.
+   */
   setResetThemeEnabled: function(enabled) {
-    this.$.resetTheme.disabled = !enabled;
+    this.allowResetTheme_ = enabled;
+  },
+
+  /** @private */
+  onCustomizeFontsTap_: function() {
+    this.$.pages.setSubpageChain(['appearance-fonts']);
   },
 
   /** @private */
@@ -68,4 +153,28 @@ Polymer({
   resetTheme_: function() {
     chrome.send('resetTheme');
   },
+
+  /** @private */
+  showFontsPage_: function() {
+    return this.currentRoute.subpage[0] == 'appearance-fonts';
+  },
+
+  /**
+   * @param {number} percent The integer percentage of the page zoom.
+   * @private
+   */
+  zoomPrefChanged_: function(percent) {
+    this.set('defaultZoomLevel_.value', percent);
+  },
+
+  /**
+   * @param {number} percent The integer percentage of the page zoom.
+   * @private
+   */
+  zoomLevelChanged_: function(percent) {
+    // The |percent| may be undefined on startup.
+    if (percent === undefined)
+      return;
+    chrome.settingsPrivate.setDefaultZoomPercent(percent);
+  },
 });