From feb696b8ecbc811ea633e1b8d6537370d2a49bcf Mon Sep 17 00:00:00 2001
From: JuliaSvinareva <Julia.Svinaryova@onlyoffice.com>
Date: Wed, 19 Oct 2022 17:55:12 +0300
Subject: [PATCH] [rtl] fix left and right panels position for PE, SSE

---
 .../main/app/controller/Viewport.js           |  4 +-
 .../main/app/view/Viewport.js                 | 59 ++++++++++--------
 .../main/app/controller/Viewport.js           |  4 +-
 .../main/app/view/Viewport.js                 | 62 +++++++++++--------
 4 files changed, 74 insertions(+), 55 deletions(-)

diff --git a/apps/presentationeditor/main/app/controller/Viewport.js b/apps/presentationeditor/main/app/controller/Viewport.js
index 50500ed56..e4da03c6c 100644
--- a/apps/presentationeditor/main/app/controller/Viewport.js
+++ b/apps/presentationeditor/main/app/controller/Viewport.js
@@ -215,7 +215,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();
@@ -223,7 +223,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', '');
diff --git a/apps/presentationeditor/main/app/view/Viewport.js b/apps/presentationeditor/main/app/view/Viewport.js
index 5593db8bd..96ac31cfb 100644
--- a/apps/presentationeditor/main/app/view/Viewport.js
+++ b/apps/presentationeditor/main/app/view/Viewport.js
@@ -105,33 +105,42 @@ define([
 
             $container = $('#viewport-hbox-layout', el);
             items = $container.find(' > .layout-item');
+
+            let iarray =  [{
+                el: items[0],
+                rely: true,
+                alias: 'left',
+                resize: {
+                    hidden: true,
+                    autohide: false,
+                    min: 300,
+                    max: 600
+                }}, { // history versions
+                el: items[3],
+                rely: true,
+                alias: 'history',
+                resize: {
+                    hidden: true,
+                    autohide: false,
+                    min: 300,
+                    max: 600
+                }
+            }, {
+                el: items[1],
+                stretch: true
+            }, {
+                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: [{
-                    el: items[0],
-                    rely: true,
-                    resize: {
-                        hidden: true,
-                        autohide: false,
-                        min: 300,
-                        max: 600
-                }}, { // history versions
-                    el: items[3],
-                    rely: true,
-                    resize: {
-                        hidden: true,
-                        autohide: false,
-                        min: 300,
-                        max: 600
-                    }
-                }, {
-                    el: items[1],
-                    stretch: true
-                }, {
-                    el: $(items[2]).hide(),
-                    rely: true
-                }
-                ]
+                items: iarray
             });
 
             return this;
diff --git a/apps/spreadsheeteditor/main/app/controller/Viewport.js b/apps/spreadsheeteditor/main/app/controller/Viewport.js
index 90b38270e..391180111 100644
--- a/apps/spreadsheeteditor/main/app/controller/Viewport.js
+++ b/apps/spreadsheeteditor/main/app/controller/Viewport.js
@@ -233,7 +233,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();
@@ -241,7 +241,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', '');
diff --git a/apps/spreadsheeteditor/main/app/view/Viewport.js b/apps/spreadsheeteditor/main/app/view/Viewport.js
index 89b7e2707..f8555d526 100644
--- a/apps/spreadsheeteditor/main/app/view/Viewport.js
+++ b/apps/spreadsheeteditor/main/app/view/Viewport.js
@@ -106,34 +106,44 @@ define([
 
             $container = $('#viewport-hbox-layout', el);
             items = $container.find(' > .layout-item');
+
+            let iarray = [{
+                el: items[0],
+                rely: true,
+                alias: 'left',
+                resize: {
+                    hidden: true,
+                    autohide: false,
+                    min: 300,
+                    max: 600,
+                    offset: 4
+                }
+            }, { // history versions
+                el: items[3],
+                rely: true,
+                alias: 'history',
+                resize: {
+                    hidden: true,
+                    autohide: false,
+                    min: 300,
+                    max: 600
+                }
+            }, {
+                el: items[1],
+                stretch: true
+            }, {
+                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: [{
-                    el: items[0],
-                    rely: true,
-                    resize: {
-                        hidden: true,
-                        autohide: false,
-                        min: 300,
-                        max: 600,
-                        offset: 4
-                    }
-                }, { // history versions
-                    el: items[3],
-                    rely: true,
-                    resize: {
-                        hidden: true,
-                        autohide: false,
-                        min: 300,
-                        max: 600
-                    }
-                }, {
-                    el: items[1],
-                    stretch: true
-                }, {
-                    el: $(items[2]).hide(),
-                    rely: true
-                }]
+                items: iarray
             });
 
             $container = $container.find('.layout-ct.vbox');