Bug 386228 - "Unify back and forward tab history and provide only one drop-down button (IE7 style)" [p=zeniko@gmail.com (Simon B��nzli) ui-r=beltzner r=gavin a=blocking-firefox3+]

browser/base/content/browser.css

@@ -23,6 +23,17 @@ toolbar[printpreview="true"] {
   -moz-binding: url("chrome://browser/content/urlbarBindings.xml#urlbar-rich-result-popup");
 }
 
+/* ::::: Unified Back-/Forward Button ::::: */
+#unified-back-forward-button {
+  -moz-binding: url("chrome://browser/content/bindings.xml#unified-back-forward-button-wrapper");
+}
+#unified-back-forward-button > toolbarbutton > dropmarker {
+  display: none; /* we provide our own */
+}
+.unified-nav-current {
+  font-weight: bold;
+}
+
 menuitem.spell-suggestion {
   font-weight: bold;
 }

browser/base/content/browser.js

@@ -170,6 +170,45 @@ function UpdateBackForwardCommands(aWebNavigation)
   }
 }
 
+var UnifiedBackForwardButton = {
+  unify: function() {
+    var backButton = document.getElementById("back-button");
+    if (!backButton || !backButton.nextSibling || backButton.nextSibling.id != "forward-button")
+      return; // back and forward buttons aren't adjacent
+
+    var wrapper = document.createElement("toolbaritem");
+    wrapper.id = "unified-back-forward-button";
+    wrapper.className = "chromeclass-toolbar-additional";
+    wrapper.setAttribute("context", "backMenu");
+    
+    var toolbar = backButton.parentNode;
+    toolbar.insertBefore(wrapper, backButton);
+    
+    var forwardButton = backButton.nextSibling;
+    wrapper.appendChild(backButton);
+    wrapper.appendChild(forwardButton);
+    
+    var popup = backButton.getElementsByTagName("menupopup")[0].cloneNode(true);
+    wrapper.appendChild(popup);
+    
+    this._unified = true;
+  },
+
+  separate: function() {
+    if (!this._unified)
+      return;
+    
+    var wrapper = document.getElementById("unified-back-forward-button");
+    var toolbar = wrapper.parentNode;
+    
+    toolbar.insertBefore(wrapper.firstChild, wrapper); // Back button
+    toolbar.insertBefore(wrapper.firstChild, wrapper); // Forward button
+    toolbar.removeChild(wrapper);
+    
+    this._unified = false;
+  }
+};
+
 #ifdef XP_MACOSX
 /**
  * Click-and-Hold implementation for the Back and Forward buttons
@@ -909,6 +948,7 @@ function delayedStartup()
     sidebar.setAttribute("src", sidebarBox.getAttribute("src"));
   }
 
+  UnifiedBackForwardButton.unify();
   UpdateUrlbarSearchSplitterState();
   
   try {
@@ -1418,12 +1458,14 @@ function BrowserHandleShiftBackspace()
 
 function BrowserBackMenu(event)
 {
-  return FillHistoryMenu(event.target, "back");
+  var menuType = UnifiedBackForwardButton._unified ? "unified" : "back";
+  return FillHistoryMenu(event.target, menuType);
 }
 
 function BrowserForwardMenu(event)
 {
-  return FillHistoryMenu(event.target, "forward");
+  var menuType = UnifiedBackForwardButton._unified ? "unified" : "forward";
+  return FillHistoryMenu(event.target, menuType);
 }
 
 function BrowserStop()
@@ -2894,6 +2936,7 @@ function FillHistoryMenu(aParent, aMenu)
 
     var webNav = getWebNavigation();
     var sessionHistory = webNav.sessionHistory;
+    var bundle_browser = document.getElementById("bundle_browser");
 
     var count = sessionHistory.count;
     var index = sessionHistory.index;
@@ -2910,7 +2953,8 @@ function FillHistoryMenu(aParent, aMenu)
             {
               entry = sessionHistory.getEntryAtIndex(j, false);
               if (entry)
-                createMenuItem(aParent, j, entry.title);
+                createMenuItem(aParent, j, entry.title || entry.URI.spec,
+                               bundle_browser.getString("tabHistory.goBack"));
             }
           break;
         case "forward":
@@ -2920,9 +2964,39 @@ function FillHistoryMenu(aParent, aMenu)
             {
               entry = sessionHistory.getEntryAtIndex(j, false);
               if (entry)
-                createMenuItem(aParent, j, entry.title);
+                createMenuItem(aParent, j, entry.title || entry.URI.spec,
+                               bundle_browser.getString("tabHistory.goForward"));
             }
           break;
+        case "unified":
+          if (count <= 1) // don't display the popup for a single item
+            return false;
+          
+          var half_length = Math.floor(MAX_HISTORY_MENU_ITEMS / 2);
+          var start = Math.max(index - half_length, 0);
+          end = Math.min(start == 0 ? MAX_HISTORY_MENU_ITEMS : index + half_length + 1, count);
+          if (end == count)
+            start = Math.max(count - MAX_HISTORY_MENU_ITEMS, 0);
+          
+          var tooltips = [
+            bundle_browser.getString("tabHistory.goBack"),
+            bundle_browser.getString("tabHistory.current"),
+            bundle_browser.getString("tabHistory.goForward")
+          ];
+          var classNames = ["unified-nav-back", "unified-nav-current", "unified-nav-forward"];
+          
+          for (var j = end - 1; j >= start; j--) {
+            entry = sessionHistory.getEntryAtIndex(j, false);
+            var tooltip = tooltips[j < index ? 0 : j == index ? 1 : 2];
+            var className = classNames[j < index ? 0 : j == index ? 1 : 2];
+            var item = createMenuItem(aParent, j, entry.title || entry.URI.spec, tooltip, className);
+            
+            if (j == index) { // mark the current history item
+              item.setAttribute("type", "radio");
+              item.setAttribute("checked", "true");
+            }
+          }
+          break;
       }
 
     return true;
@@ -2944,12 +3018,16 @@ function addToUrlbarHistory(aUrlToAdd)
    }
 }
 
-function createMenuItem( aParent, aIndex, aLabel)
+function createMenuItem(aParent, aIndex, aLabel, aTooltipText, aClassName)
   {
     var menuitem = document.createElement( "menuitem" );
     menuitem.setAttribute( "label", aLabel );
     menuitem.setAttribute( "index", aIndex );
-    aParent.appendChild( menuitem );
+    if (aTooltipText)
+      menuitem.setAttribute("tooltiptext", aTooltipText);
+    if (aClassName)
+      menuitem.className = aClassName;
+    return aParent.appendChild(menuitem);
   }
 
 function deleteHistoryItems(aParent)
@@ -3042,6 +3120,8 @@ function BrowserCustomizeToolbar()
   var cmd = document.getElementById("cmd_CustomizeToolbars");
   cmd.setAttribute("disabled", "true");
 
+  UnifiedBackForwardButton.separate();
+
   var splitter = document.getElementById("urlbar-search-splitter");
   if (splitter)
     splitter.parentNode.removeChild(splitter);
@@ -3080,6 +3160,7 @@ function BrowserToolboxCustomizeDone(aToolboxChanged)
     window.XULBrowserWindow.init();
   }
 
+  UnifiedBackForwardButton.unify();
   UpdateUrlbarSearchSplitterState();
 
   // Update the urlbar

browser/base/jar.mn

@@ -13,6 +13,7 @@ browser.jar:
 *       content/browser/aboutDialog.xul               (content/aboutDialog.xul)
 *       content/browser/aboutDialog.js                (content/aboutDialog.js)
         content/browser/aboutDialog.css               (content/aboutDialog.css)
+*       content/browser/bindings.xml                  (content/bindings.xml)
 *       content/browser/browser.css                   (content/browser.css)
 *       content/browser/browser.js                    (content/browser.js)
 *       content/browser/browser.xul                   (content/browser.xul)

browser/locales/en-US/chrome/browser/browser.properties

@@ -81,6 +81,11 @@ feedHasFeedsNew=Subscribe to this page…
 menuOpenAllInTabs.label=Open All in Tabs
 menuOpenAllInTabs.accesskey=o
 
+# Unified Back-/Forward Popup
+tabHistory.current=Stay on this page
+tabHistory.goBack=Go back to this page
+tabHistory.goForward=Go forward to this page
+
 # Block autorefresh
 refreshBlocked.goButton=Allow
 refreshBlocked.goButton.accesskey=A