From 1b5abe0aa9cec85e179ba6645db30b47e25e7c0d Mon Sep 17 00:00:00 2001
From: Julia Radzhabova <julia.radzhabova@onlyoffice.com>
Date: Fri, 7 Aug 2020 13:51:26 +0300
Subject: [PATCH] [DE][PE] File menu refactoring

---
 .../main/app/view/FileMenuPanels.js           |  8 ++---
 .../main/resources/less/filemenu.less         | 36 +++++++------------
 .../main/app/view/FileMenuPanels.js           |  8 ++---
 .../main/resources/less/leftmenu.less         | 36 +++++++------------
 4 files changed, 32 insertions(+), 56 deletions(-)

diff --git a/apps/documenteditor/main/app/view/FileMenuPanels.js b/apps/documenteditor/main/app/view/FileMenuPanels.js
index 192c351e1..7df74a918 100644
--- a/apps/documenteditor/main/app/view/FileMenuPanels.js
+++ b/apps/documenteditor/main/app/view/FileMenuPanels.js
@@ -188,7 +188,7 @@ define([
         menu: undefined,
 
         template: _.template([
-        '<div id="fms-flex-settings">',
+        '<div class="flex-settings">',
             '<table style="margin: 30px 0 0;"><tbody>',
                 /** coauthoring begin **/
                 '<tr class="comments">',
@@ -452,7 +452,7 @@ define([
 
             this.btnApply.on('click', this.applySettings.bind(this));
 
-            this.pnlSettings = $markup.findById('#fms-flex-settings');
+            this.pnlSettings = $markup.find('.flex-settings').addBack().filter('.flex-settings');
 
             this.$el = $(node).html($markup);
 
@@ -846,7 +846,7 @@ define([
             this.rendered = false;
 
             this.template = _.template([
-            '<div id="fms-flex-info">',
+            '<div class="flex-settings">',
                 '<table class="main" style="margin: 30px 0 0;">',
                     '<tr>',
                         '<td class="left"><label>' + this.txtPlacement + '</label></td>',
@@ -1052,7 +1052,7 @@ define([
             });
             this.btnApply.on('click', _.bind(this.applySettings, this));
 
-            this.pnlInfo = $markup.findById('#fms-flex-info');
+            this.pnlInfo = $markup.find('.flex-settings').addBack().filter('.flex-settings');
             this.pnlApply = $markup.findById('#fms-flex-apply');
 
             this.rendered = true;
diff --git a/apps/documenteditor/main/resources/less/filemenu.less b/apps/documenteditor/main/resources/less/filemenu.less
index e80c36846..210380167 100644
--- a/apps/documenteditor/main/resources/less/filemenu.less
+++ b/apps/documenteditor/main/resources/less/filemenu.less
@@ -120,21 +120,26 @@
   }
 }
 
-#panel-settings {
+.flex-settings {
   #file-menu-panel & {
-    padding: 0;
-    display: flex;
-    flex-direction: column;
-  }
-
-  #fms-flex-settings {
     &.bordered {
       border-bottom: 1px solid @gray;
     }
     overflow: hidden;
     position: relative;
   }
+}
 
+#panel-settings,
+#panel-info {
+  #file-menu-panel & {
+    padding: 0;
+    display: flex;
+    flex-direction: column;
+  }
+}
+
+#panel-settings {
   table {
     width: 100%;
 
@@ -315,23 +320,6 @@
   }
 }
 
-#panel-info {
-  #file-menu-panel & {
-    padding: 0;
-    display: flex;
-    flex-direction: column;
-  }
-
-  #fms-flex-info {
-    &.bordered {
-      border-bottom: 1px solid @gray;
-    }
-    overflow: hidden;
-    position: relative;
-  }
-
-}
-
 #panel-rights {
   #file-menu-panel & {
     padding: 0 30px;
diff --git a/apps/presentationeditor/main/app/view/FileMenuPanels.js b/apps/presentationeditor/main/app/view/FileMenuPanels.js
index d4d71d97a..4f96554f3 100644
--- a/apps/presentationeditor/main/app/view/FileMenuPanels.js
+++ b/apps/presentationeditor/main/app/view/FileMenuPanels.js
@@ -180,7 +180,7 @@ define([
         menu: undefined,
 
         template: _.template([
-        '<div id="fms-flex-settings">',
+        '<div class="flex-settings">',
             '<table style="margin: 30px 0 0;"><tbody>',
                 '<tr class="edit">',
                     '<td class="left"><label><%= scope.txtSpellCheck %></label></td>',
@@ -395,7 +395,7 @@ define([
 
             this.btnApply.on('click', _.bind(this.applySettings, this));
 
-            this.pnlSettings = $markup.findById('#fms-flex-settings');
+            this.pnlSettings = $markup.find('.flex-settings').addBack().filter('.flex-settings');
 
             this.$el = $(node).html($markup);
 
@@ -752,7 +752,7 @@ define([
             this.rendered = false;
 
             this.template = _.template([
-            '<div id="fms-flex-info">',
+            '<div class="flex-settings">',
                 '<table class="main" style="margin: 30px 0 0;">',
                     '<tr>',
                         '<td class="left"><label>' + this.txtPlacement + '</label></td>',
@@ -926,7 +926,7 @@ define([
             });
             this.btnApply.on('click', _.bind(this.applySettings, this));
 
-            this.pnlInfo = $markup.findById('#fms-flex-info');
+            this.pnlInfo = $markup.find('.flex-settings').addBack().filter('.flex-settings');
             this.pnlApply = $markup.findById('#fms-flex-apply');
 
             this.rendered = true;
diff --git a/apps/presentationeditor/main/resources/less/leftmenu.less b/apps/presentationeditor/main/resources/less/leftmenu.less
index 7ce578c3e..65099d00f 100644
--- a/apps/presentationeditor/main/resources/less/leftmenu.less
+++ b/apps/presentationeditor/main/resources/less/leftmenu.less
@@ -189,19 +189,22 @@
             }
         }
 
-        #panel-settings {
+        .flex-settings {
+            &.bordered {
+                border-bottom: 1px solid @gray;
+            }
+            overflow: hidden;
+            position: relative;
+        }
+
+        #panel-settings,
+        #panel-info {
             padding: 0;
             display: flex;
             flex-direction: column;
+        }
 
-            #fms-flex-settings {
-                &.bordered {
-                    border-bottom: 1px solid @gray;
-                }
-                overflow: hidden;
-                position: relative;
-            }
-
+        #panel-settings {
             table {
                 width: 100%;
 
@@ -385,21 +388,6 @@
             }
         }
 
-        #panel-info {
-            padding: 0;
-            display: flex;
-            flex-direction: column;
-
-            #fms-flex-info {
-                &.bordered {
-                    border-bottom: 1px solid @gray;
-                }
-                overflow: hidden;
-                position: relative;
-            }
-
-        }
-
         #panel-rights {
             padding: 0 30px;
         }