Issue 1668 - Fixed direction on add-on pages for right-to-left scripts

chrome/content/ui/i18n.js

 /*
  * This file is part of Adblock Plus <http://adblockplus.org/>,
  * Copyright (C) 2006-2014 Eyeo GmbH
  *
  * Adblock Plus is free software: you can redistribute it and/or modify
  * it under the terms of the GNU General Public License version 3 as
  * published by the Free Software Foundation.
  *
  * Adblock Plus is distributed in the hope that it will be useful,
  * but WITHOUT ANY WARRANTY; without even the implied warranty of
  * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
  * GNU General Public License for more details.
  *
  * You should have received a copy of the GNU General Public License
  * along with Adblock Plus.  If not, see <http://www.gnu.org/licenses/>.
  */
 
 var i18n;
-var locale;
 
 if (typeof ext != "undefined")
 {
   i18n = ext.i18n;
-  locale = ext.i18n.getMessage("@@ui_locale").replace(/_/g, "-");

[Thomas Greiner, 2014/12/09 10:29:04]

What about Safari? We don't handle those predefined messages there yet so we
would need to implement those first in safari/ext/common.js

[Sebastian Noack, 2014/12/09 10:41:13]

We do handle @@ui_locale on Safari.

[Thomas Greiner, 2014/12/09 16:51:56]

Sorry, missed that before. But why not simply use `Utils.appLocale`? Because
that's exactly the same code as used here and you are already using it in the
Firefox-specific code below anyway.

[Sebastian Noack, 2014/12/09 17:40:19]

Because in block.html on Chrome/Opera/Safari there is no require(), and
therefore no Utils.

+
+  document.documentElement.lang = ext.i18n.getMessage("@@ui_locale").replace(/_/g, "-");
+  document.documentElement.dir = ext.i18n.getMessage("@@bidi_dir");
 }
 else
 {
   // Using Firefox' approach on i18n instead
 
   // Randomize URI to work around bug 719376
   var pageName = location.pathname.replace(/.*\//, '').replace(/\..*?$/, '');
   var stringBundle = Services.strings.createBundle("chrome://adblockplus/locale/" + pageName +
     ".properties?" + Math.random());
 
@@ skipping 42 matching lines @@
         }
         catch(e)
         {
           Cu.reportError(e);
           return "Missing translation: " + key;
         }
       }
     };
   })();
 
-  locale = require("utils").Utils.appLocale;
+  var Utils = require("utils").Utils;
+  document.documentElement.lang = Utils.appLocale;
+  document.documentElement.dir = Utils.chromeRegistry.isLocaleRTL("adblockplus") ? "rtl" : "ltr";
 }
 
 // Inserts i18n strings into matching elements. Any inner HTML already in the element is
 // parsed as JSON and used as parameters to substitute into placeholders in the i18n
 // message.
 i18n.setElementText = function(element, stringName, arguments)
 {
   function processString(str, element)
   {
     var match = /^(.*?)<(a|strong)>(.*?)<\/\2>(.*)$/.exec(str);
@@ skipping 42 matching lines @@
   var d = new Date(when);
   var timeString = d.toLocaleTimeString();
 
   var now = new Date();
   if (d.toDateString() == now.toDateString())
     return [timeString];
   else
     return [timeString, d.toLocaleDateString()];
 }
 
-function onDOMLoaded()
-{
-  document.documentElement.lang = locale;
-
-  if (locale == "ar" || locale == "he")

[Thomas Greiner, 2014/12/09 10:29:04]

Similarly to above we could use `ext.i18n.getMessage("@@bidi_dir")` to get the
text direction. See
https://developer.chrome.com/extensions/i18n#overview-predefined

[Sebastian Noack, 2014/12/09 10:41:13]

Is there a way to get the direction on Firefox? Otherwise I'd prefer to keep the
check here, instead duplicating it for Firefox and Safari, in the receptive
abstraction code.

[Thomas Greiner, 2014/12/09 16:51:56]

It could be handled the same way as "@@ui_locale" but I guess for now this
should do.

BTW in Firefox there are preferences of the form `intl.uidirection.<locale>` (as
used in https://developer.mozilla.org/en-US/docs/Web/CSS/:-moz-locale-dir(rtl)).
They are only set for the locales "ar", "fa", "he", "ug" and "ur".

A Firefox-specific version would then look like this:

var dir = "ltr";
if (Services.prefs.getPrefType("intl.uidirection." + locale))
  dir = Services.prefs.getCharPref("intl.uidirection." + locale;

[Wladimir Palant, 2014/12/09 16:59:08]

Utils.chromeRegistry.isLocaleRTL("adblockplus") should be better. Internally it
will do exactly the same thing but we don't get to rely on Firefox
implementation details.

[Sebastian Noack, 2014/12/09 17:40:19]

Done. I'm going to implement @@bidi_dir for Safari.

-    document.documentElement.dir = "rtl";
-
-  loadI18nStrings();
-}
-
-window.addEventListener("DOMContentLoaded", onDOMLoaded, true);
+// Fill in the strings as soon as possible
+window.addEventListener("DOMContentLoaded", loadI18nStrings, true);