Added RTL Locale support (#472)

os-js · Sep 8, 2016 · f379057 · f379057
1 parent d0528fb
commit f379057
Show file tree

Hide file tree

Showing 5 changed files with 44 additions and 5 deletions.
diff --git a/src/client/javascript/api.js b/src/client/javascript/api.js
@@ -236,16 +236,20 @@
    * @param  {String}   s     Locale name
    */
   API.setLocale = function _apiSetLocale(l) {
+    var RTL = API.getConfig('LocaleOptions.RTL', []);
+
     if ( OSjs.Locales[l] ) {
       CurrentLocale = l;
     } else {
       console.warn('API::setLocale()', 'Invalid locale', l, '(Using default)');
       CurrentLocale = DefaultLocale;
     }
 
+    var major = CurrentLocale.split('_')[0];
     var html = document.querySelector('html');
     if ( html ) {
       html.setAttribute('lang', l);
+      html.setAttribute('dir', RTL.indexOf(major) !== -1 ? 'rtl' : 'ltr');
     }
 
     console.info('API::setLocale()', CurrentLocale);

diff --git a/src/client/javascript/handler.js b/src/client/javascript/handler.js
@@ -776,7 +776,7 @@
       var curLocale = API.getConfig('Locale');
       var detectedLocale = Utils.getUserLocale();
 
-      if ( API.getConfig('LocaleDetect', true) && detectedLocale ) {
+      if ( API.getConfig('LocaleOptions.AutoDetect', true) && detectedLocale ) {
         console.info('Auto-detected user locale via browser', detectedLocale);
         curLocale = detectedLocale;
       }

diff --git a/src/client/stylesheets/gui.css b/src/client/stylesheets/gui.css
@@ -1175,6 +1175,15 @@ gui-menu.gui-root-menu {
     top : 0;
     bottom : 0;
   }
+  html[dir="rtl"] gui-menu > .gui-menu-expand:after {
+    right : auto;
+    left : 0;
+
+    -webkit-transform: rotate(180deg);
+       -moz-transform: rotate(180deg);
+        -ms-transform: rotate(180deg);
+            transform: rotate(180deg);
+  }
 
   /*gui-menu > gui-menu-entry:hover {
   }*/

diff --git a/src/client/stylesheets/theme.less b/src/client/stylesheets/theme.less
@@ -259,6 +259,10 @@ corewm-panel .PanelItemWindowList li.Focused {
 corewm-panel .PanelItemWindowList li img {
   margin-right : @gui_base_padding;
 }
+html[dir="rtl"] corewm-panel .PanelItemWindowList li img {
+  margin-right : 0;
+  margin-left : @gui_base_padding;
+}
 
 /* Notifications */
 application-splash {
@@ -384,9 +388,9 @@ application-window-top {
     width: @window_top_height;
   }
 }
-application-window-content {
-  overflow : hidden;
-}
+
+/* application-window-content {overflow : hidden;}*/
+
 application-window-top:active {
   cursor : move;
   cursor : pointer;
@@ -1078,6 +1082,12 @@ gui-menu {
   gui-menu > gui-menu-entry.gui-menu-expand {
     padding-right : 16px;
   }
+  html[dir="rtl"] gui-menu > gui-menu-entry.gui-menu-expand {
+    padding-right : 0;
+  }
+  html[dir="rtl"] gui-menu > gui-menu-entry[data-icon] {
+    padding-right : 16px;
+  }
   gui-menu > gui-menu-entry.gui-menu-expand:after {
     content : '►';
     font-family : sans-serif;
@@ -1096,6 +1106,9 @@ gui-menu {
     gui-menu > gui-menu-entry {
       background-position : @gui_base_padding center;
     }
+    html[dir="rtl"] gui-menu > gui-menu-entry {
+      background-position : right @gui_base_padding center;
+    }
     gui-menu > gui-menu-entry > label.gui-has-image {
       padding-left : 22px;
     }
@@ -1207,9 +1220,19 @@ gui-list-view {
         padding-left : 24px;
         background-position : @gui_base_padding;
       }
+      html[dir="rtl"] gui-list-view gui-list-view-column.gui-has-image {
+        padding-left : 0;
+        padding-right : 24px;
+        background-position : right @gui_base_padding center;
+      }
+
       gui-list-view[data-icon-size="32"] gui-list-view-column.gui-has-image {
         padding-left : 40px;
       }
+      html[dir="rtl"] gui-list-view[data-icon-size="32"] gui-list-view-column.gui-has-image {
+        padding-left : 0;
+        padding-right : 40px;
+      }
 
     gui-list-view-row.gui-active {
       background-color: @gui_selected_blur_background_color;

diff --git a/src/conf/110-languages.json b/src/conf/110-languages.json
@@ -1,7 +1,10 @@
 {
   "client" : {
     "Locale": "en_EN",
-    "LocaleDetect": true,
+    "LocaleOptions" : {
+      "AutoDetect": true,
+      "RTL": ["az", "he", "uz", "zh"]
+    },
     "Languages": {
       "en_EN": "English",
       "bg_BG": "Bulgarian (Bulgaria)",