[rtl] fix left and right panels position for DE

apps/common/main/resources/less/common.less

@@ -51,6 +51,11 @@ label {
         .tool-menu-btns {
             border-right: @scaled-one-px-value-ie solid @border-toolbar-ie;
             border-right: @scaled-one-px-value solid @border-toolbar;
+
+            .rtl & {
+                border-left: @scaled-one-px-value solid @border-toolbar;
+                border-right: 0 none;
+            }
         }
     }
 
@@ -63,6 +68,14 @@ label {
             background-color: @background-toolbar;
             right: 0;
             overflow: hidden;
+
+            .rtl & {
+                left: 0;
+                right: auto;
+
+                border-right: @scaled-one-px-value solid @border-toolbar;
+                border-left: 0 none;
+            }
         }
     }
 }
@@ -85,6 +98,13 @@ label {
     border-right: @scaled-one-px-value-ie solid @border-toolbar-ie;
     border-right: @scaled-one-px-value solid @border-toolbar;
 
+    .rtl & {
+        padding-right: 40px;
+        padding-left: 0;
+        border-left: @scaled-one-px-value solid @border-toolbar;
+        border-right: 0 none;
+    }
+
     #left-panel-chat {
         height: 100%;
     }
@@ -108,6 +128,11 @@ label {
     border-left: @scaled-one-px-value-ie solid @border-toolbar-ie;
     border-left: @scaled-one-px-value solid @border-toolbar;
     line-height: 15px;
+
+    .rtl & {
+        border-right: @scaled-one-px-value solid @border-toolbar;
+        border-left: 0 none;
+    }
 }
 
 .statusbar {

apps/documenteditor/main/app/controller/Viewport.js

@@ -212,7 +212,7 @@ define([
                 this.viewport.hlayout.doLayout();
                 break;
             case 'history':
-                var panel = this.viewport.hlayout.items[1];
+                var panel = this.viewport.hlayout.getItem('history');
                 if (panel.resize.el) {
                     this.boxSdk.css('border-left', '');
                     panel.resize.el.show();
@@ -220,7 +220,7 @@ define([
                 this.viewport.hlayout.doLayout();
                 break;
             case 'leftmenu':
-                var panel = this.viewport.hlayout.items[0];
+                var panel = this.viewport.hlayout.getItem('left');
                 if (panel.resize.el) {
                     if (panel.el.width() > 40) {
                         this.boxSdk.css('border-left', '');

apps/documenteditor/main/app/view/Viewport.js

@@ -104,11 +104,10 @@ define([
 
             $container = $('#viewport-hbox-layout', this.$el);
             var items = $container.find(' > .layout-item');
-            this.hlayout = new Common.UI.HBoxLayout({
-                box: $container,
-                items: [{ // left menu chat & comment
+            let iarray = [{ // left menu chat & comment
                 el: items[0],
                 rely: true,
+                alias: 'left',
                 resize: {
                     hidden: true,
                     autohide: false,
@@ -117,6 +116,7 @@ define([
                 }}, { // history versions
                 el: items[3],
                 rely: true,
+                alias: 'history',
                 resize: {
                     hidden: true,
                     autohide: false,
@@ -130,7 +130,16 @@ define([
                 el: $(items[2]).hide(),
                 rely: true
             }
-                ]
+            ];
+
+            if ( Common.UI.isRTL() ) {
+                [iarray[0], iarray[3]] = [iarray[3], iarray[0]];
+                [iarray[1], iarray[2]] = [iarray[2], iarray[1]];
+            }
+
+            this.hlayout = new Common.UI.HBoxLayout({
+                box: $container,
+                items: iarray
             });
 
             return this;