Create Help Tips section in settings

This creates a new section to host the Wayback Machine toggle option. Option is located under Additional settings panel as per spec. For further info, see https://docs.google.com/document/d/1ioGkGUVmLE0ndfvLRBjDN1d9QtOKeyPOM-33lK0L78k
brave · Oct 31, 2019 · 75b5b3b · 75b5b3b
1 parent 36e29c5
commit 75b5b3b
Show file tree

Hide file tree

Showing 11 changed files with 104 additions and 5 deletions.
diff --git a/app/brave_generated_resources.grd b/app/brave_generated_resources.grd
@@ -400,6 +400,13 @@ By installing this extension, you are agreeing to the Google Widevine Terms of U
       <message name="IDS_SETTINGS_BRAVE_SYNC_LINK_LABEL" desc="Brave Sync link label">
         Access Sync via
       </message>
+      <!-- Help Tips Page -->
+      <message name="IDS_SETTINGS_HELP_TIPS" desc="Title for an item in the 'Help Tips' section of Brave Settings">
+        Help Tips
+      </message>
+      <message name="IDS_SETTINGS_HELP_TIPS_SHOW_BRAVE_WAYBACK_MACHINE_PROMPT" desc="The label describing the 'wayback machine' toggle option">
+        Show Wayback Machine prompt on 404 pages
+      </message>
       <!-- Brave Theme -->
       <message name="IDS_BRAVE_THEME_TYPE_LIGHT" desc="Text for light theme type">
         Light

diff --git a/browser/resources/settings/brave_default_extensions_page/brave_default_extensions_page.html b/browser/resources/settings/brave_default_extensions_page/brave_default_extensions_page.html
@@ -78,9 +78,6 @@
         sub-label="$i18n{webTorrentEnabledDesc}"
         on-settings-boolean-control-change="onWebTorrentEnabledChange_">
     </settings-toggle-button>
-    <settings-toggle-button id="braveWaybackMachineEnabled"
-        pref="{{prefs.brave.wayback_machine_enabled}}"
-        label="Show Wayback Machine prompt on 404 pages">
     </settings-toggle-button>
     <settings-toggle-button id="hangoutsEnabled"
         pref="{{prefs.brave.hangouts_enabled}}"

diff --git a/browser/resources/settings/brave_help_tips_page/brave_help_tips_browser_proxy.html b/browser/resources/settings/brave_help_tips_page/brave_help_tips_browser_proxy.html
@@ -0,0 +1,2 @@
+<link rel="href" src="chrome://resources/html/cr.html">
+<script src="brave_help_tips_browser_proxy.js"></script>
diff --git a/browser/resources/settings/brave_help_tips_page/brave_help_tips_browser_proxy.js b/browser/resources/settings/brave_help_tips_page/brave_help_tips_browser_proxy.js
@@ -0,0 +1,20 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this file,
+ * You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+ cr.define('settings', function() {
+  /** @interface */
+  class BraveHelpTipsBrowserProxy {}
+
+  /**
+   * @implements {settings.BraveHelpTipsBrowserProxy}
+   */
+  class BraveHelpTipsBrowserProxyImpl {}
+
+  cr.addSingletonGetter(BraveHelpTipsBrowserProxyImpl);
+
+  return {
+    BraveHelpTipsBrowserProxy,
+    BraveHelpTipsBrowserProxyImpl
+  };
+});
diff --git a/browser/resources/settings/brave_help_tips_page/brave_help_tips_page.html b/browser/resources/settings/brave_help_tips_page/brave_help_tips_page.html
@@ -0,0 +1,16 @@
+<link rel="import" href="chrome://resources/html/polymer.html">
+
+<link rel="import" href="chrome://resources/html/i18n_behavior.html">
+<link rel="import" href="chrome://resources/cr_elements/md_select_css.html">
+<link rel="import" href="brave_help_tips_browser_proxy.html">
+<link rel="import" href="../settings_shared_css.html">
+<link rel="import" href="../settings_vars_css.html">
+
+<dom-module id="settings-brave-help-tips-page">
+  <template>
+  <settings-toggle-button
+      pref="{{prefs.brave.wayback_machine_enabled}}"
+      label="$i18n{braveHelpTipsWaybackMachineLabel}">
+  </template>
+  <script src="brave_help_tips_page.js"></script>
+</dom-module>
diff --git a/browser/resources/settings/brave_help_tips_page/brave_help_tips_page.js b/browser/resources/settings/brave_help_tips_page/brave_help_tips_page.js
@@ -0,0 +1,23 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this file,
+ * You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+(function() {
+  'use strict';
+
+  /**
+   * 'settings-brave-help-tips-page' is the settings page containing
+   * brave's help tips features.
+   */
+  Polymer({
+    is: 'settings-brave-help-tips-page',
+
+    /** @private {?settings.BraveHelpTipsBrowserProxy} */
+    browserProxy_: null,
+
+    /** @override */
+    created: function() {
+      this.browserProxy_ = settings.BraveHelpTipsBrowserProxyImpl.getInstance();
+    },
+  });
+})();
diff --git a/browser/resources/settings/brave_icons.html b/browser/resources/settings/brave_icons.html
@@ -63,6 +63,10 @@
         <path
           d="M10.038 2c-.478 0-.889.34-.98.809l-.334 1.714c-.82.31-1.58.744-2.246 1.291l-1.645-.566a1 1 0 0 0-1.19.445L2.133 8.307a1 1 0 0 0 .21 1.255l1.317 1.147A8.07 8.07 0 0 0 3.548 12c0 .44.045.87.113 1.291l-1.318 1.146c-.36.315-.448.84-.21 1.256l1.51 2.614a1 1 0 0 0 1.19.447l1.645-.567c.674.55 1.433.985 2.246 1.29l.334 1.714c.092.47.501.809.98.809h3.02c.479 0 .89-.34.98-.809l.334-1.714a7.966 7.966 0 0 0 2.246-1.291l1.645.566a1 1 0 0 0 1.191-.445l1.508-2.616a1 1 0 0 0-.209-1.254l-1.318-1.146A8.07 8.07 0 0 0 19.548 12c0-.44-.045-.87-.113-1.291l1.318-1.146c.361-.315.448-.841.21-1.256l-1.509-2.614a1 1 0 0 0-1.19-.447l-1.646.566a7.984 7.984 0 0 0-2.246-1.289l-.334-1.713a.998.998 0 0 0-.98-.81h-3.02zm1.51 7a3 3 0 1 1 0 6 3 3 0 0 1 0-6z" />
       </g>
+      <g id="help">
+        <path
+          d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 17h-2v-2h2v2zm2.07-7.75l-.9.92C13.45 12.9 13 13.5 13 15h-2v-.5c0-1.1.45-2.1 1.17-2.83l1.24-1.26c.37-.36.59-.86.59-1.41 0-1.1-.9-2-2-2s-2 .9-2 2H8c0-2.21 1.79-4 4-4s4 1.79 4 4c0 .88-.36 1.68-.93 2.25z"></path>
+      </g>
       <g id="reset-settings" viewBox="0 0 24 24">
         <path
           d="M20.292 3.71l-1.234 1.234a9.965 9.965 0 0 0-8.846-2.785c-4.03.704-7.29 3.92-8.035 7.942-1.178 6.346 3.686 11.902 9.822 11.902 5.134 0 9.378-3.89 9.938-8.879a1.009 1.009 0 0 0-1-1.12c-.5 0-.93.367-.985.864-.433 4.005-3.833 7.135-7.953 7.135-4.941 0-8.85-4.5-7.84-9.62.608-3.08 3.074-5.57 6.149-6.204a7.978 7.978 0 0 1 7.334 2.181l-.936.936a1 1 0 0 0 .707 1.707H21a1 1 0 0 0 1-1V4.418a1 1 0 0 0-1.707-.708z" />

diff --git a/browser/resources/settings/brave_settings_overrides.html b/browser/resources/settings/brave_settings_overrides.html
@@ -7,6 +7,7 @@
 <link rel="import" href="default_brave_shields_page/default_brave_shields_page.html">
 <link rel="import" href="social_blocking_page/social_blocking_page.html">
 <link rel="import" href="brave_sync_page/brave_sync_page.html">
+<link rel="import" href="brave_help_tips_page/brave_help_tips_page.html">
 
 <dom-module id="brave-settings-getting-started">
   <template>

diff --git a/browser/resources/settings/brave_settings_overrides.js b/browser/resources/settings/brave_settings_overrides.js
@@ -147,9 +147,12 @@ BravePatching.RegisterPolymerTemplateModifications({
     // Add Sync item
     const syncEl = createMenuElement(loadTimeData.getString('braveSync'), '/braveSync', 'brave_settings:sync')
     appearanceBrowserEl.insertAdjacentElement('afterend', syncEl)
+    // Add Help Tips item
+    const helpTipsEl = createMenuElement(loadTimeData.getString('braveHelpTips'), '/braveHelpTips', 'brave_settings:help')
+    syncEl.insertAdjacentElement('afterend', helpTipsEl)
     // Add Shields item
     const shieldsEl = createMenuElement(loadTimeData.getString('braveShieldsTitle'), '/shields',  'brave_settings:shields')
-    syncEl.insertAdjacentElement('afterend', shieldsEl)
+    helpTipsEl.insertAdjacentElement('afterend', shieldsEl)
     // Add Embed Blocking item
     const embedEl = createMenuElement(loadTimeData.getString('socialBlocking'), '/socialBlocking', 'brave_settings:social-permissions')
     shieldsEl.insertAdjacentElement('afterend', embedEl)
@@ -172,6 +175,9 @@ BravePatching.RegisterPolymerTemplateModifications({
     const autofillEl = getMenuElement(templateContent, '/autofill')
     const privacyEl = getMenuElement(templateContent, '/privacy')
     privacyEl.insertAdjacentElement('afterend', autofillEl)
+    // Move helptips to advanced
+    const printingEl = getMenuElement(templateContent, '/printing')
+    printingEl.insertAdjacentElement('afterend', helpTipsEl)
     // Remove extensions link
     const extensionsLinkEl = templateContent.querySelector('#extensionsLink')
     if (!extensionsLinkEl) {
@@ -207,6 +213,7 @@ BravePatching.RegisterPolymerTemplateModifications({
     r.SOCIAL_BLOCKING = r.BASIC.createSection('/socialBlocking', 'socialBlocking')
     r.EXTENSIONS = r.BASIC.createSection('/extensions', 'extensions')
     r.BRAVE_SYNC = r.BASIC.createSection('/braveSync', 'braveSync')
+    r.BRAVE_HELP_TIPS = r.BASIC.createSection('/braveHelpTips', 'braveHelpTips')
     if (!r.SITE_SETTINGS) {
       console.error('[Brave Settings Overrides] Routes: could not find SITE_SETTINGS page')
     }
@@ -276,6 +283,15 @@ BravePatching.RegisterPolymerTemplateModifications({
           <settings-social-blocking-page prefs="{{prefs}}"></settings-social-blocking-page>
         </settings-section>
       `
+      const sectionHelpTips = document.createElement('template')
+      sectionHelpTips.setAttribute('is', 'dom-if')
+      sectionHelpTips.setAttribute('restamp', true)
+      sectionHelpTips.setAttribute('if', '[[showPage_(pageVisibility.braveHelpTips)]]')
+      sectionHelpTips.innerHTML = `
+        <settings-section page-title="${loadTimeData.getString('braveHelpTips')}" section="braveHelpTips">
+          <settings-brave-help-tips-page prefs="{{prefs}}"></settings-brave-help-tips-page>
+        </settings-section>
+      `
       // Get Started at top
       basicPageEl.insertAdjacentElement('afterbegin', sectionGetStarted)
       // Move Appearance item
@@ -317,6 +333,9 @@ BravePatching.RegisterPolymerTemplateModifications({
       const sectionAutofill = getSectionElement(actualTemplate.content, 'autofill')
       const sectionPrivacy = getSectionElement(advancedSubSectionsTemplate.content, 'privacy')
       sectionPrivacy.insertAdjacentElement('afterend', sectionAutofill)
+      // Move help tips after printing
+      const sectionPrinting = getSectionElement(advancedSubSectionsTemplate.content, 'printing')
+      sectionPrinting.insertAdjacentElement('afterend', sectionHelpTips)
     }
   },
   'settings-default-browser-page': (templateContent) => {
@@ -325,7 +344,7 @@ BravePatching.RegisterPolymerTemplateModifications({
       for (const boxEl of templateEl.content.querySelectorAll('.settings-box')) {
         boxEl.classList.remove('first')
       }
-    }
+    }   
   },
   'settings-people-page': (templateContent) => {
     // People page needs to think it's in the getStarted section, since it is

diff --git a/browser/resources/settings/settings_resources.grd b/browser/resources/settings/settings_resources.grd
@@ -41,6 +41,12 @@
       <structure name="IDR_SETTINGS_BRAVE_SYNC_BROWSER_PROXY_JS" file="brave_sync_page/brave_sync_browser_proxy.js" type="chrome_html" preprocess="true" />
       <structure name="IDR_SETTINGS_BRAVE_SYNC_PAGE_JS" file="brave_sync_page/brave_sync_page.js" type="chrome_html" preprocess="true" />
       <structure name="IDR_SETTINGS_BRAVE_SYNC_PAGE_HTML" file="brave_sync_page/brave_sync_page.html" type="chrome_html" preprocess="true" allowexternalscript="true" />
+      <!-- brave help and tips -->
+      <structure name="IDR_SETTINGS_BRAVE_HELP_TIPS_BROWSER_PROXY_HTML" file="brave_help_tips_page/brave_help_tips_browser_proxy.html" type="chrome_html" />
+      <structure name="IDR_SETTINGS_BRAVE_HELP_TIPS_BROWSER_PROXY_JS" file="brave_help_tips_page/brave_help_tips_browser_proxy.js" type="chrome_html" preprocess="true" />
+      <structure name="IDR_SETTINGS_BRAVE_HELP_TIPS_PAGE_JS" file="brave_help_tips_page/brave_help_tips_page.js" type="chrome_html" preprocess="true" />
+      <structure name="IDR_SETTINGS_BRAVE_HELP_TIPS_PAGE_HTML" file="brave_help_tips_page/brave_help_tips_page.html" type="chrome_html" preprocess="true" allowexternalscript="true" />
+      <!-- default extensions -->
       <structure name="IDR_SETTINGS_BRAVE_DEFAULT_EXTENSIONS_BROWSER_PROXY_HTML" file="brave_default_extensions_page/brave_default_extensions_browser_proxy.html" type="chrome_html" />
       <structure name="IDR_SETTINGS_BRAVE_DEFAULT_EXTENSIONS_BROWSER_PROXY_JS" file="brave_default_extensions_page/brave_default_extensions_browser_proxy.js" type="chrome_html" preprocess="true" />
       <structure name="IDR_SETTINGS_BRAVE_DEFAULT_EXTENSIONS_PAGE_JS" file="brave_default_extensions_page/brave_default_extensions_page.js" type="chrome_html" preprocess="true" />

diff --git a/chromium_src/chrome/browser/ui/webui/settings/settings_localized_strings_provider.cc b/chromium_src/chrome/browser/ui/webui/settings/settings_localized_strings_provider.cc
@@ -133,6 +133,10 @@ void BraveAddCommonStrings(content::WebUIDataSource* html_source,
       IDS_SETTINGS_BRAVE_SYNC_TITLE},
     {"braveSyncLabel",
       IDS_SETTINGS_BRAVE_SYNC_LINK_LABEL},
+    {"braveHelpTips",
+      IDS_SETTINGS_HELP_TIPS},
+    {"braveHelpTipsWaybackMachineLabel",
+      IDS_SETTINGS_HELP_TIPS_SHOW_BRAVE_WAYBACK_MACHINE_PROMPT},
     {"onExitPageTitle",
       IDS_SETTINGS_BRAVE_ON_EXIT},
     {"braveDefaultExtensions",
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1,2 @@
		<link rel="href" src="chrome://resources/html/cr.html">
		<script src="brave_help_tips_browser_proxy.js"></script>