[MD settings] clickable toggle labels on category default toggles

chrome/browser/resources/settings/site_settings/category_default_setting.js

 // Copyright 2016 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
  * 'category-default-setting' is the polymer element for showing a certain
  * category under Site Settings.
  */
 Polymer({
   is: 'category-default-setting',
 
   behaviors: [SiteSettingsBehavior, WebUIListenerBehavior],
 
   properties: {
+    /**
+     * The second line (secondary) text to be shown next to the toggle.
+     */
+    optionDescription: String,
+
+    /* Labels for the toggle on/off positions. */
+    toggleOffLabel: String,
+    toggleOnLabel: String,

[stevenjb, 2017/03/31 23:28:15]

Maybe move these above optionDescription and mention that they are used to set
optionLabel_ below? That way we expain option label, option desc, sub-option
label, sub-option desc.

[dschuyler, 2017/04/01 00:09:38]

I didn't do exactly that. I've sorted the public above the @privates. I've also
tried to re-write the comments to be clearer. PTAL, WDYT?

+
+    /**
+     * The second line (secondary) text to be shown next to the toggle.
+     */
+    subOptionLabel: String,
+
+    /**
+     * The second line (secondary) text to be shown next to the toggle.

[stevenjb, 2017/03/31 23:28:15]

All three of these have the same comment.

[dschuyler, 2017/04/01 00:09:38]

Whoops, thanks!

+     */
+    subOptionDescription: String,
+
     /** @private {chrome.settingsPrivate.PrefObject} */
     controlParams_: {
       type: Object,
       value: function() {
         return /** @type {chrome.settingsPrivate.PrefObject} */({});
       },
     },
 
     /** @private {!DefaultContentSetting} */
     priorDefaultContentSetting_: {
       type: Object,
       value: function() {
         return /** @type {DefaultContentSetting} */({});
       },
     },
 
     /**
-     * The description to be shown next to the slider.
+     * The label to be shown next to the toggle. This will be either
+     * toggleOffLabel or toggleOnLabel.
      * @private
      */
-    sliderDescription_: String,
+    optionLabel_: String,
 
     /**
      * Cookies and Flash settings have a sub-control that is used to mimic a
      * tri-state value.
      * @private {chrome.settingsPrivate.PrefObject}
      */
     subControlParams_: {
       type: Object,
       value: function() {
         return /** @type {chrome.settingsPrivate.PrefObject} */({});
       },
     },
-
-    /* Labels for the toggle on/off positions. */
-    toggleOffLabel: String,
-    toggleOnLabel: String,
-
-    subOptionLabel: String,
-    subOptionSecondary: {
-      type: String,
-      value: null,  // Needs default value so binding fires upon initialization.
-    },
   },
 
   observers: [
     'onCategoryChanged_(category)',
     'onChangePermissionControl_(category, controlParams_.value, ' +
         'subControlParams_.value)',
   ],
 
   ready: function() {
     this.addWebUIListener('contentSettingCategoryChanged',
@@ skipping 117 matching lines @@
   /**
    * Handles changes to the category pref and the |category| member variable.
    * @private
    */
   onCategoryChanged_: function() {
     this.browserProxy
         .getDefaultValueForContentType(
           this.category).then(function(defaultValue) {
             this.updateControlParams_(defaultValue);
 
-            // Flash only shows ALLOW or BLOCK descriptions on the slider.
+            // Flash only shows ALLOW or BLOCK descriptions on the toggle.
             var setting = defaultValue.setting;
             if (this.category == settings.ContentSettingsTypes.PLUGINS &&
                 setting == settings.PermissionValues.IMPORTANT_CONTENT) {
               setting = settings.PermissionValues.ALLOW;
             } else if (
                 this.category == settings.ContentSettingsTypes.COOKIES &&
                 setting == settings.PermissionValues.SESSION_ONLY) {
               setting = settings.PermissionValues.ALLOW;
             }
             var categoryEnabled = setting != settings.PermissionValues.BLOCK;
-            this.sliderDescription_ =
+            this.optionLabel_ =
                 categoryEnabled ? this.toggleOnLabel : this.toggleOffLabel;
           }.bind(this));
   },
 
   /**
    * @return {boolean}
    * @private
    */
   isToggleDisabled_: function() {
     return this.category == settings.ContentSettingsTypes.POPUPS &&
         loadTimeData.getBoolean('isGuest');
   },
-
-  /**
-   * Returns classname to indicate secondary label exists.
-   * @param {boolean} subOptionLabel
-   * @return {string}
-   * @private
-   */
-  subOptionClass_: function(subOptionLabel) {
-    return subOptionLabel ? 'two-line' : '';
-  }
 });