Bug 601048 - Remove permanent headers from browser tool panels [r=vingtetun]
authorMark Finkle <mfinkle@mozilla.com>
Wed, 06 Oct 2010 08:56:11 -0400
changeset 66782 8c9b676dfae113519caa450896833db1316e7765
parent 66781 066bc070f35627d80835fe79b96e04b822753fa3
child 66783 ed9d6ab1ebadf1557ef8303a9133e14cf252cfd3
push id1
push userroot
push dateTue, 26 Apr 2011 22:38:44 +0000
treeherdermozilla-beta@bfdb6e623a36 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersvingtetun
bugs601048
Bug 601048 - Remove permanent headers from browser tool panels [r=vingtetun]
mobile/app/profile/extensions/feedback@mobile.mozilla.org/content/overlay.xul
mobile/chrome/content/browser-ui.js
mobile/chrome/content/browser.xul
mobile/chrome/content/downloads.js
mobile/themes/core/browser.css
--- a/mobile/app/profile/extensions/feedback@mobile.mozilla.org/content/overlay.xul
+++ b/mobile/app/profile/extensions/feedback@mobile.mozilla.org/content/overlay.xul
@@ -47,19 +47,20 @@
 <overlay id="feedback-overlay" xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
   <script type="application/javascript" src="chrome://feedback/content/overlay.js"/>
 
   <box id="panel-controls">
     <toolbarbutton id="tool-feedback" autocheck="true" type="radio" group="1" class="panel-button button-image" linkedpanel="feedback-container" insertafter="tool-addons"/>
   </box>
 
   <deck id="panel-items">
-    <vbox id="feedback-container" label="&feedbackHeader.label;" flex="1" hidden="true">
+    <vbox id="feedback-container" flex="1" hidden="true">
       <notificationbox id="feedback-messages" flex="1">
         <richlistbox id="feedback-list" flex="1" onselect="this.ensureSelectedElementIsVisible()">
+          <label id="feedback-list-header" class="panel-header" value="&feedbackHeader.label;"/>
           <settings id="feedback-communicate" label="&feedback.communicate.title;">
             <setting title="&feedback.feedback.title;" type="control">
               <button id="feedback-feedback-happy" class="button-dark" oncommand="Feedback.openFeedback('http://m.input.mozilla.com/en-US/happy');"/>
               <button id="feedback-feedback-sad" class="button-dark" oncommand="Feedback.openFeedback('http://m.input.mozilla.com/en-US/sad');"/>
             </setting>
           </settings>
           <settings id="feedback-information" label="&feedback.information.title;">
             <setting id="feedback-about" title="&feedback.about.title;" type="control">
--- a/mobile/chrome/content/browser-ui.js
+++ b/mobile/chrome/content/browser-ui.js
@@ -347,18 +347,16 @@ var BrowserUI = {
   switchPane: function switchPane(aPanelId) {
     let button = document.getElementsByAttribute("linkedpanel", aPanelId)[0];
     if (button)
       button.checked = true;
 
     this.blurFocusedElement();
 
     let pane = document.getElementById(aPanelId);
-    let title = pane.getAttribute("label");
-    document.getElementById("panel-header").setAttribute("value", title);
     document.getElementById("panel-items").selectedPanel = pane;
   },
 
   get toolbarH() {
     if (!this._toolbarH) {
       let toolbar = document.getElementById("toolbar-main");
       this._toolbarH = toolbar.boxObject.height;
     }
--- a/mobile/chrome/content/browser.xul
+++ b/mobile/chrome/content/browser.xul
@@ -378,45 +378,46 @@
         <toolbarbutton id="tool-addons" type="radio" group="1" class="panel-button button-image" linkedpanel="addons-container"/>
         <toolbarbutton id="tool-console" type="radio" group="1" hidden="true" class="panel-button button-image" linkedpanel="console-container"/>
 #ifndef ANDROID
         <spacer flex="1"/>
         <toolbarbutton id="tool-panel-close" class="button-image" command="cmd_panel"/>
 #endif
       </hbox>
       <vbox flex="1">
-        <hbox class="panel-header" align="center" flex="1">
-          <label id="panel-header" value="&prefsHeader.label;"/>
-        </hbox>
         <deck id="panel-items" selectedIndex="2" flex="1">
-          <vbox id="addons-container" label="&addonsHeader.label;" flex="1">
+          <vbox id="addons-container" flex="1">
             <notificationbox id="addons-messages" flex="1">
               <richlistbox id="addons-list" flex="1" onselect="ExtensionsView.hideOnSelect(event)">
+                <label id="addons-list-header" class="panel-header" value="&addonsHeader.label;"/>
                 <richlistitem id="addons-local" class="section-header" align="center" nohighlight="true">
                   <label value="&addonsLocal.label;" flex="1"/>
                   <spacer flex="1"/>
                   <button id="addons-update-all" label="&addonsUpdate.label;" hidden="true"
                           oncommand="ExtensionsView.updateAll();"/>
                 </richlistitem>
                 <richlistitem id="addons-repo" class="section-header" nohighlight="true">
                   <label value="&addonsRepo.label;" flex="1"/>
                   <textbox id="addons-search-text" emptytext="&addonsSearch2.emptytext;" type="search" searchbutton="false"
                            oncommand="ExtensionsView.getAddonsFromRepo(this.value);"/>
                 </richlistitem>
               </richlistbox>
             </notificationbox>
           </vbox>
 
-          <vbox id="downloads-container" label="&downloadsHeader.label;" flex="1">
-            <richlistbox id="downloads-list" flex="1" onselect="this.ensureSelectedElementIsVisible()"/>
+          <vbox id="downloads-container" flex="1">
+            <richlistbox id="downloads-list" flex="1" onselect="this.ensureSelectedElementIsVisible()">
+              <label id="downloads-list-header" class="panel-header" value="&downloadsHeader.label;"/>
+            </richlistbox>
           </vbox>
 
-          <vbox id="prefs-container" label="&prefsHeader.label;" flex="1">
+          <vbox id="prefs-container" flex="1">
             <notificationbox id="prefs-messages" flex="1">
               <richlistbox id="prefs-list" seltype="single" flex="1" onselect="this.ensureSelectedElementIsVisible()">
+                <label id="prefs-list-header" class="panel-header" value="&prefsHeader.label;"/>
                 <setting title="&about.title;" type="control">
                   <button id="prefs-about-button" label="&about.button;"
 #ifdef MOZ_OFFICIAL_BRANDING
 # these two point to the same page, this just matters for what shows up in the
 # URL bar
                           oncommand="BrowserUI.newTab('about:firefox');"/>
 #else
                           oncommand="BrowserUI.newTab('about:fennec');"/>
@@ -465,18 +466,19 @@
                     <button id="sync-syncButton" label="&sync.syncNow;" oncommand="WeaveGlue.sync();"/>
                   </setting>
                 </settings>
 #endif
               </richlistbox>
             </notificationbox>
           </vbox>
 
-          <vbox id="console-container" label="&consoleHeader.label;" flex="1">
-            <vbox id="console-header" class="panel-header">
+          <vbox id="console-container" flex="1">
+            <vbox id="console-header">
+              <label class="panel-header" value="&consoleHeader.label;"/>
               <hbox align="center">
                 <label value="&consoleCodeEval.label;" control="console-eval-textbox"/>
                 <textbox id="console-eval-textbox" class="toolbar" value="" onkeypress="ConsoleView.onEvalKeyPress(event)" flex="1"/>
                 <button id="console-button-eval" class="button-dark show-text" label="&consoleEvaluate.label;" oncommand="ConsoleView.evaluateTypein()"/>
               </hbox>
               <hbox align="center" pack="end">
                 <radiogroup id="console-filter" class="toggle-dark" oncommand="ConsoleView.changeMode();">
                   <radio id="console-filter-all" label="&consoleAll.label;" value="all" selected="true"/>
--- a/mobile/chrome/content/downloads.js
+++ b/mobile/chrome/content/downloads.js
@@ -102,23 +102,24 @@ var DownloadsView = {
       return;
 
     let index = this._list.selectedIndex;
     this._list.removeChild(aItem);
     this._list.selectedIndex = Math.min(index, this._list.itemCount - 1);
   },
 
   _clearList: function dv__clearList() {
-    // Clear the list by replacing with a shallow copy
-    let empty = this._list.cloneNode(false);
-    this._list.parentNode.replaceChild(empty, this._list);
-    this._list = empty;
+    // Clear the list except for the header row
+    let header = document.getElementById("downloads-list-header");
+    while (header.nextSibling)
+      this._list.removeChild(header.nextSibling);
   },
   
   _ifEmptyShowMessage: function dv__ifEmptyShowMessage() {
+    // The header row is not counted in the list itemCount
     if (this._list.itemCount == 0) {
       let emptyString = Elements.browserBundle.getString("downloadsEmpty");
       let emptyItem = this._list.appendItem(emptyString);
       emptyItem.id = "dl-empty-message";
     }
   },
 
   get visible() {
--- a/mobile/themes/core/browser.css
+++ b/mobile/themes/core/browser.css
@@ -436,17 +436,21 @@ toolbarbutton.panel-button {
   /* match #browser-controls end padding */
   -moz-padding-start: 8px; /* core spacing */
   -moz-padding-end: 8px; /* core spacing */
   -moz-box-pack: start;
   border-bottom: 1px solid #262629;
 }
 
 .panel-header {
-  padding: 4px; /* core spacing */
+  font-weight: bold;
+  color: white;
+  background-color: #6576eb;
+  margin: 0;
+  padding: 2px;
 }
 
 #tool-addons {
   list-style-image: url("chrome://browser/skin/images/addons-default-64.png");
 }
 
 #tool-addons:hover:active,
 #tool-addons[checked="true"] {