Separate Settings and Help from History and Extensions when settings-in-

chrome/browser/resources/uber/uber_frame.js

 // Copyright (c) 2012 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.
 
 // This file contains the navigation controls that are visible on the left side
 // of the uber page. It exists separately from uber.js so that it may be loaded
 // in an iframe. Iframes can be layered on top of each other, but not mixed in
 // with page content, so all overlapping content on uber must be framed.
 
 <include src="../../../../ui/webui/resources/js/util.js"></include>
@@ skipping 59 matching lines @@
   }
 
   /**
    * Changes the selected nav control.
    * @param {Object} params Must contain pageId.
    */
   function changeSelection(params) {
     var navItem =
         document.querySelector('li[controls="' + params.pageId + '"]');
     setSelection(navItem);
+    showNavItems();
+  }
+
+  /**
+   * @return {Element} The currently selected nav item, if any.
+   */
+  function getSelectedNavItem() {
+    return document.querySelector('li.selected');
   }
 
   /**
    * Sets selection on the given nav item.
-   * @param {boolean} newSelection The item to be selected.
+   * @param {Element} newSelection The item to be selected.
    */
   function setSelection(newSelection) {
-    var lastSelectedNavItem = document.querySelector('li.selected');
+    var lastSelectedNavItem = getSelectedNavItem();
     if (lastSelectedNavItem !== newSelection) {
       newSelection.classList.add('selected');
       if (lastSelectedNavItem)
         lastSelectedNavItem.classList.remove('selected');
     }
   }
 
   /**
+   * Shows nav items belonging to the same group as the selected item.
+   */
+  function showNavItems() {
+    var navItems = document.querySelectorAll('li');
+    var selectedNavItem = getSelectedNavItem();
+    assert(selectedNavItem);
+
+    var selectedGroup = selectedNavItem.getAttribute('group');
+    for (var i = 0; i < navItems.length; ++i) {
+      navItems[i].hidden = navItems[i].getAttribute('group') != selectedGroup;
+    }
+  }
+
+  /**
    * Adjusts this frame's content to scrolls from the outer frame. This is done
    * to obscure text in RTL as a user scrolls over the content of this frame (as
    * currently RTL scrollbars still draw on the right).
    * @param {number} scroll document.body.scrollLeft of the content frame.
    */
   function adjustToScroll(scrollLeft) {
     assert(isRTL());
     document.body.style.webkitTransform = 'translateX(' + -scrollLeft + 'px)';
   }
 
@@ skipping 11 matching lines @@
   /**
    * Handles mouse wheels on the top level element. Forwards them to uber.js.
    * @param {Event} e The mouse wheel event.
    */
   function onMouseWheel(e) {
     uber.invokeMethodOnParent('mouseWheel',
         {deltaX: e.wheelDeltaX, deltaY: e.wheelDeltaY});
   }
 
   /**
-   * @return {Object} The currently selected iframe container.
+   * @return {Element} The currently selected iframe container.
    * @private
    */
   function getSelectedIframe() {
     return document.querySelector('.iframe-container.selected');
   }
 
   /**
    * Finds the <li> element whose 'controls' attribute is |controls| and sets
    * its 'override' attribute to |override|.
    * @param {string} controls The value of the 'controls' attribute of the
    *     element to change.
    * @param {string} override The value to set for the 'override' attribute of
    *     that element (either 'yes' or 'no').
    */
   function setNavigationOverride(controls, override) {
     var navItem =
         document.querySelector('li[controls="' + controls + '"]');
     navItem.setAttribute('override', override);
   }
 
   return {
     onLoad: onLoad,
     setNavigationOverride: setNavigationOverride,
   };
 
 });
 
 document.addEventListener('DOMContentLoaded', uber_frame.onLoad);