Bug 587248 - Part 6: Add RTL support to the TabView functionality implemented in ui.js; r=ian a=blocking-betaN+
authorEhsan Akhgari <ehsan@mozilla.com>
Mon, 08 Nov 2010 01:38:24 -0500
changeset 57455 e902872c33b08353285455fcec134b0f0450bce8
parent 57454 51bcf78f8c5901eefe001f41921c976f3bc05502
child 57456 238b879aec66c2fb491cbefe38a7e98406b67c99
push id16934
push usereakhgari@mozilla.com
push dateSat, 13 Nov 2010 22:50:22 +0000
treeherdermozilla-central@674f2ed15cea [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersian, blocking-betaN
bugs587248
milestone2.0b8pre
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 587248 - Part 6: Add RTL support to the TabView functionality implemented in ui.js; r=ian a=blocking-betaN+
browser/base/content/tabview/ui.js
--- a/browser/base/content/tabview/ui.js
+++ b/browser/base/content/tabview/ui.js
@@ -101,16 +101,19 @@ let UI = {
 
   // ----------
   // Function: init
   // Must be called after the object is created.
   init: function UI_init() {
     try {
       let self = this;
 
+      // initialize the direction of the page
+      this._initPageDirection();
+
       // ___ storage
       Storage.init();
       let data = Storage.readUIData(gWindow);
       this._storageSanity(data);
       this._pageBounds = data.pageBounds;
 
       // ___ hook into the browser
       gWindow.addEventListener("tabviewshow", function() {
@@ -239,17 +242,23 @@ let UI = {
 
     this._removeTabActionHandlers();
     this._currentTab = null;
     this._pageBounds = null;
     this._reorderTabItemsOnShow = null;
     this._reorderTabsOnHide = null;
     this._frameInitialized = false;
   },
-  
+
+  // Property: rtl
+  // Returns true if we are in RTL mode, false otherwise
+  get rtl() {
+    return document.documentElement.getAttribute("dir") == "rtl";
+  },
+
   // Function: reset
   // Resets the Panorama view to have just one group with all tabs
   // and, if firstTime == true, add the welcome video/tab
   reset: function UI_reset(firstTime) {
     let padding = Trenches.defaultRadius;
     let welcomeWidth = 300;
     let pageBounds = Items.getPageBounds();
     pageBounds.inset(padding, padding);
@@ -258,16 +267,19 @@ let UI = {
     if ($actions)
       pageBounds.width -= $actions.width();
 
     // ___ make a fresh groupItem
     let box = new Rect(pageBounds);
     box.width = Math.min(box.width * 0.667,
                          pageBounds.width - (welcomeWidth + padding));
     box.height = box.height * 0.667;
+    if (UI.rtl) {
+      box.right = pageBounds.width + pageBounds.left;
+    }
 
     GroupItems.groupItems.forEach(function(group) {
       group.close();
     });
     
     let options = {
       bounds: box,
       immediately: true
@@ -346,29 +358,36 @@ let UI = {
 
   // ----------
   // Function: _isTabViewVisible
   // Returns true if the TabView UI is currently shown.
   _isTabViewVisible: function UI__isTabViewVisible() {
     return gTabViewDeck.selectedIndex == 1;
   },
 
+  // ---------
+  // Function: _initPageDirection
+  // Initializes the page base direction
+  _initPageDirection: function UI__initPageDirection() {
+    let chromeReg = Cc["@mozilla.org/chrome/chrome-registry;1"].
+                    getService(Ci.nsIXULChromeRegistry);
+    document.documentElement.setAttribute("dir", chromeReg.isLocaleRTL("global") ? "rtl" : "ltr");
+  },
+
   // ----------
   // Function: showTabView
   // Shows TabView and hides the main browser UI.
   // Parameters:
   //   zoomOut - true for zoom out animation, false for nothing.
   showTabView: function UI_showTabView(zoomOut) {
     if (this._isTabViewVisible())
       return;
 
     // initialize the direction of the page
-    let chromeReg = Cc["@mozilla.org/chrome/chrome-registry;1"].
-                    getService(Ci.nsIXULChromeRegistry);
-    document.documentElement.setAttribute("dir", chromeReg.isLocaleRTL("global") ? "rtl" : "ltr");
+    this._initPageDirection();
 
     var self = this;
     var currentTab = this._currentTab;
     var item = null;
 
     this._reorderTabItemsOnShow.forEach(function(groupItem) {
       groupItem.reorderTabItemsBasedOnTabOrder();
     });
@@ -1076,17 +1095,17 @@ let UI = {
     var scale = Math.min(hScale, wScale);
     var self = this;
     var pairs = [];
     items.forEach(function(item) {
       if (item.locked.bounds)
         return;
 
       var bounds = item.getBounds();
-      bounds.left += newPageBounds.left - self._pageBounds.left;
+      bounds.left += (UI.rtl ? -1 : 1) * (newPageBounds.left - self._pageBounds.left);
       bounds.left *= scale;
       bounds.width *= scale;
 
       bounds.top += newPageBounds.top - self._pageBounds.top;
       bounds.top *= scale;
       bounds.height *= scale;
 
       pairs.push({