From c511a8e6cf08cb31c8c5d586c8137b31301f0f98 Mon Sep 17 00:00:00 2001
From: JuliaSvinareva <Julia.Svinaryova@onlyoffice.com>
Date: Tue, 27 Oct 2020 14:30:06 +0300
Subject: [PATCH] [DE][PE][SSE] Fix position of zoom, lang, preview dropdowns

---
 apps/common/main/lib/component/Menu.js             | 8 ++++++++
 apps/documenteditor/main/app/view/Statusbar.js     | 6 ++++--
 apps/presentationeditor/main/app/view/Statusbar.js | 9 ++++++---
 apps/spreadsheeteditor/main/app/view/Statusbar.js  | 1 +
 4 files changed, 19 insertions(+), 5 deletions(-)

diff --git a/apps/common/main/lib/component/Menu.js b/apps/common/main/lib/component/Menu.js
index 5c7aeeb8a..82aea3018 100644
--- a/apps/common/main/lib/component/Menu.js
+++ b/apps/common/main/lib/component/Menu.js
@@ -167,6 +167,7 @@ define([
                 this.rendered       = false;
                 this.items          = [];
                 this.offset         = [0, 0];
+                this.popperOffset   = this.options.popperOffset || '';
                 this.menuAlign      = this.options.menuAlign;
                 this.menuAlignEl    = this.options.menuAlignEl;
                 this.scrollAlwaysVisible = this.options.scrollAlwaysVisible;
@@ -261,6 +262,9 @@ define([
                     this.parentEl.on('hidden.bs.dropdown',  _.bind(me.onAfterHideMenu, me));
                     this.parentEl.on('keydown.after.bs.dropdown', _.bind(me.onAfterKeydownMenu, me));
 
+                    this.parentEl.find('[data-toggle="dropdown"]').data('boundary', $('#viewport')[0]);
+                    this.popperOffset && this.parentEl.find('[data-toggle="dropdown"]').data('offset', this.popperOffset);
+
                     menuRoot.hover(
                         function(e) { me.isOver = true;},
                         function(e) { me.isOver = false; }
@@ -654,6 +658,7 @@ define([
             this.rendered       = false;
             this.items          = this.options.items || [];
             this.offset         = [0, 0];
+            this.popperOffset   = this.options.popperOffset || '';
             this.menuAlign      = this.options.menuAlign;
             this.menuAlignEl    = this.options.menuAlignEl;
             this.scrollAlwaysVisible = this.options.scrollAlwaysVisible;
@@ -724,6 +729,9 @@ define([
                 this.parentEl.on('hidden.bs.dropdown',  _.bind(me.onAfterHideMenu, me));
                 this.parentEl.on('keydown.after.bs.dropdown', _.bind(me.onAfterKeydownMenu, me));
 
+                this.parentEl.find('[data-toggle="dropdown"]').data('boundary', $('#viewport')[0]);
+                this.popperOffset && this.parentEl.find('[data-toggle="dropdown"]').data('offset', this.popperOffset);
+
                 menuRoot.hover(
                     function(e) { me.isOver = true;},
                     function(e) { me.isOver = false; }
diff --git a/apps/documenteditor/main/app/view/Statusbar.js b/apps/documenteditor/main/app/view/Statusbar.js
index 7cb2000f4..ea3d7f8b6 100644
--- a/apps/documenteditor/main/app/view/Statusbar.js
+++ b/apps/documenteditor/main/app/view/Statusbar.js
@@ -230,8 +230,9 @@ define([
 
                 this.langMenu = new Common.UI.MenuSimple({
                     cls: 'lang-menu',
-                    style: 'margin-top:-5px;',
                     restoreHeight: 285,
+                    popperOffset: '0,-2',
+                    style: 'margin-top: -5px;',
                     itemTemplate: _.template([
                         '<a id="<%= id %>" class="dropdown-item" tabindex="-1" type="menuitem" style="padding-left: 28px !important;" langval="<%= value.value %>" class="<% if (checked) { %> checked <% } %>">',
                             '<i class="icon <% if (spellcheck) { %> toolbar__icon btn-ic-docspell spellcheck-lang <% } %>"></i>',
@@ -243,8 +244,9 @@ define([
                 });
 
                 this.zoomMenu = new Common.UI.Menu({
-                    style: 'margin-top:-5px;',
                     menuAlign: 'bl-tl',
+                    popperOffset: '0,-2',
+                    style: 'margin-top: -5px;',
                     items: [
                         { caption: "50%", value: 50 },
                         { caption: "75%", value: 75 },
diff --git a/apps/presentationeditor/main/app/view/Statusbar.js b/apps/presentationeditor/main/app/view/Statusbar.js
index f4e16c6f7..04aa07c5c 100644
--- a/apps/presentationeditor/main/app/view/Statusbar.js
+++ b/apps/presentationeditor/main/app/view/Statusbar.js
@@ -146,8 +146,9 @@ define([
                 );
 
                 this.zoomMenu = new Common.UI.Menu({
-                    style: 'margin-top:-5px;',
+                    popperOffset: '0,-2',
                     menuAlign: 'bl-tl',
+                    style: 'margin-top: -5px;margin-bottom: 6px;',
                     items: [
                         { caption: "50%", value: 50 },
                         { caption: "75%", value: 75 },
@@ -238,7 +239,8 @@ define([
                     split: true,
                     menu: new Common.UI.Menu({
                         menuAlign: 'bl-tl',
-                        style: 'margin-top:-5px;',
+                        style: 'margin-top:-5px;margin-bottom:5px;',
+                        popperOffset: '0,-2',
                         items: [
                             {caption: this.textShowBegin, value: 0},
                             {caption: this.textShowCurrent, value: 1},
@@ -250,7 +252,8 @@ define([
                 var panelLang = $('.cnt-lang',this.el);
                 this.langMenu = new Common.UI.MenuSimple({
                     cls: 'lang-menu',
-                    style: 'margin-top:-5px;',
+                    popperOffset: '0,-2',
+                    style: 'margin-top: -5px;margin-bottom: 6px;',
                     restoreHeight: 285,
                     itemTemplate: _.template([
                         '<a id="<%= id %>" tabindex="-1" type="menuitem" style="padding-left: 28px !important;" langval="<%= value.value %>" class="<% if (checked) { %> checked <% } %>">',
diff --git a/apps/spreadsheeteditor/main/app/view/Statusbar.js b/apps/spreadsheeteditor/main/app/view/Statusbar.js
index 36ce28f51..0a36d42b1 100644
--- a/apps/spreadsheeteditor/main/app/view/Statusbar.js
+++ b/apps/spreadsheeteditor/main/app/view/Statusbar.js
@@ -149,6 +149,7 @@ define([
 
                 this.zoomMenu = new Common.UI.Menu({
                     style: 'margin-top:-5px;',
+                    popperOffset: '0,-2',
                     menuAlign: 'bl-tl',
                     items: [
                         { caption: "50%", value: 50 },