From 6b58820098a3d24cc716242abc77444b57cfc4ff Mon Sep 17 00:00:00 2001
From: Julia Radzhabova <Julia.Radzhabova@onlyoffice.com>
Date: Wed, 15 Jan 2020 16:12:53 +0300
Subject: [PATCH] Feature/bugfix (#300)

* [PE] Bug 42759

* Fux Bug 44131

* [SSE] Update skeleton
---
 apps/api/documents/api.js                       |  3 +++
 apps/documenteditor/main/index.html             | 17 +++++++++++++----
 apps/documenteditor/main/index.html.deploy      | 16 ++++++++++++----
 apps/presentationeditor/main/index.html         | 17 +++++++++++++----
 apps/presentationeditor/main/index.html.deploy  | 16 ++++++++++++----
 .../mobile/app/controller/edit/EditSlide.js     | 12 ++++++++++--
 .../mobile/app/view/edit/EditSlide.js           |  2 +-
 .../mobile/resources/css/app-ios.css            |  3 +++
 .../mobile/resources/css/app-material.css       |  3 +++
 .../mobile/resources/less/app-ios.less          |  4 ++++
 .../mobile/resources/less/app-material.less     |  3 +++
 apps/spreadsheeteditor/embed/index.html         |  3 ++-
 apps/spreadsheeteditor/embed/index.html.deploy  |  3 ++-
 apps/spreadsheeteditor/main/index.html          | 17 +++++++++++++----
 apps/spreadsheeteditor/main/index.html.deploy   | 16 ++++++++++++----
 .../main/resources/less/app.less                |  3 ++-
 apps/spreadsheeteditor/mobile/index.html        |  3 ++-
 apps/spreadsheeteditor/mobile/index.html.deploy |  3 ++-
 .../mobile/resources/css/app-ios.css            |  3 ++-
 .../mobile/resources/css/app-material.css       |  3 ++-
 .../mobile/resources/less/app-ios.less          |  3 ++-
 .../mobile/resources/less/app-material.less     |  3 ++-
 22 files changed, 120 insertions(+), 36 deletions(-)

diff --git a/apps/api/documents/api.js b/apps/api/documents/api.js
index 5c113bf44..7c6983646 100644
--- a/apps/api/documents/api.js
+++ b/apps/api/documents/api.js
@@ -803,6 +803,9 @@
         if (config.editorConfig && config.editorConfig.customization && !!config.editorConfig.customization.compactHeader)
             params += "&compact=true";
 
+        if (config.editorConfig && config.editorConfig.customization && (config.editorConfig.customization.toolbar===false))
+            params += "&toolbar=false";
+
         return params;
     }
 
diff --git a/apps/documenteditor/main/index.html b/apps/documenteditor/main/index.html
index b5d3c4ecb..fdd2df9c0 100644
--- a/apps/documenteditor/main/index.html
+++ b/apps/documenteditor/main/index.html
@@ -24,7 +24,7 @@
 
         .loadmask > .brendpanel {
             width: 100%;
-            min-height: 32px;
+            min-height: 28px;
             background: #446995;
         }
 
@@ -223,14 +223,23 @@
 
     <script>
         var params = getUrlParams(),
+            notoolbar = params["toolbar"] == 'false',
             compact = params["compact"] == 'true',
             view = params["mode"] == 'view';
 
+        (compact || view || notoolbar) && document.querySelector('.brendpanel > :nth-child(2)').remove();
+
         if (compact || view) {
-            document.querySelector('.brendpanel > :nth-child(2)').remove();
-            document.querySelector('.brendpanel > :nth-child(1)').style.height = '32px';
+            if (notoolbar) {
+                document.querySelector('.brendpanel > :nth-child(1)').remove();
+                document.querySelector('.brendpanel').remove();
+            } else
+                document.querySelector('.brendpanel > :nth-child(1)').style.height = '32px';
+        } else if (notoolbar) {
+            document.querySelector('.brendpanel > :nth-child(1)').style.height = '28px';
         }
-        if (view) {
+
+        if (view || notoolbar) {
             document.querySelector('.sktoolbar').remove();
         }
 
diff --git a/apps/documenteditor/main/index.html.deploy b/apps/documenteditor/main/index.html.deploy
index 8748c4255..5f0fdbec3 100644
--- a/apps/documenteditor/main/index.html.deploy
+++ b/apps/documenteditor/main/index.html.deploy
@@ -25,7 +25,7 @@
 
         .loadmask > .brendpanel {
             width: 100%;
-            min-height: 32px;
+            min-height: 28px;
             background: #446995;
         }
 
@@ -216,14 +216,22 @@
 
     <script>
         var params = getUrlParams(),
+            notoolbar = params["toolbar"] == 'false',
             compact = params["compact"] == 'true',
             view = params["mode"] == 'view';
 
+        (compact || view || notoolbar) && document.querySelector('.brendpanel > :nth-child(2)').remove();
+
         if (compact || view) {
-            document.querySelector('.brendpanel > :nth-child(2)').remove();
-            document.querySelector('.brendpanel > :nth-child(1)').style.height = '32px';
+            if (notoolbar) {
+                document.querySelector('.brendpanel > :nth-child(1)').remove();
+                document.querySelector('.brendpanel').remove();
+            } else
+                document.querySelector('.brendpanel > :nth-child(1)').style.height = '32px';
+        } else if (notoolbar) {
+            document.querySelector('.brendpanel > :nth-child(1)').style.height = '28px';
         }
-        if (view) {
+        if (view || notoolbar) {
             document.querySelector('.sktoolbar').remove();
         }
 
diff --git a/apps/presentationeditor/main/index.html b/apps/presentationeditor/main/index.html
index 56f0d0641..852f76a8b 100644
--- a/apps/presentationeditor/main/index.html
+++ b/apps/presentationeditor/main/index.html
@@ -23,7 +23,7 @@
 
         .loadmask > .brendpanel {
             width: 100%;
-            min-height: 32px;
+            min-height: 28px;
             background: #aa5252;
         }
 
@@ -252,14 +252,23 @@
 
     <script>
         var params = getUrlParams(),
+            notoolbar = params["toolbar"] == 'false',
             compact = params["compact"] == 'true',
             view = params["mode"] == 'view';
 
+        (compact || view || notoolbar) && document.querySelector('.brendpanel > :nth-child(2)').remove();
+
         if (compact || view) {
-            document.querySelector('.brendpanel > :nth-child(2)').remove();
-            document.querySelector('.brendpanel > :nth-child(1)').style.height = '32px';
+            if (notoolbar) {
+                document.querySelector('.brendpanel > :nth-child(1)').remove();
+                document.querySelector('.brendpanel').remove();
+            } else
+                document.querySelector('.brendpanel > :nth-child(1)').style.height = '32px';
+        } else if (notoolbar) {
+            document.querySelector('.brendpanel > :nth-child(1)').style.height = '28px';
         }
-        if (view) {
+
+        if (view || notoolbar) {
             document.querySelector('.sktoolbar').remove();
         }
 
diff --git a/apps/presentationeditor/main/index.html.deploy b/apps/presentationeditor/main/index.html.deploy
index f542da26a..1f4bfd570 100644
--- a/apps/presentationeditor/main/index.html.deploy
+++ b/apps/presentationeditor/main/index.html.deploy
@@ -25,7 +25,7 @@
 
         .loadmask > .brendpanel {
             width: 100%;
-            min-height: 32px;
+            min-height: 28px;
             background: #aa5252;
         }
 
@@ -265,14 +265,22 @@
 
     <script>
         var params = getUrlParams(),
+            notoolbar = params["toolbar"] == 'false',
             compact = params["compact"] == 'true',
             view = params["mode"] == 'view';
 
+        (compact || view || notoolbar) && document.querySelector('.brendpanel > :nth-child(2)').remove();
+
         if (compact || view) {
-            document.querySelector('.brendpanel > :nth-child(2)').remove();
-            document.querySelector('.brendpanel > :nth-child(1)').style.height = '32px';
+            if (notoolbar) {
+                document.querySelector('.brendpanel > :nth-child(1)').remove();
+                document.querySelector('.brendpanel').remove();
+            } else
+                document.querySelector('.brendpanel > :nth-child(1)').style.height = '32px';
+        } else if (notoolbar) {
+            document.querySelector('.brendpanel > :nth-child(1)').style.height = '28px';
         }
-        if (view) {
+        if (view || notoolbar) {
             document.querySelector('.sktoolbar').remove();
         }
 
diff --git a/apps/presentationeditor/mobile/app/controller/edit/EditSlide.js b/apps/presentationeditor/mobile/app/controller/edit/EditSlide.js
index b44e68185..9fa0ba5fc 100644
--- a/apps/presentationeditor/mobile/app/controller/edit/EditSlide.js
+++ b/apps/presentationeditor/mobile/app/controller/edit/EditSlide.js
@@ -396,10 +396,18 @@ define([
 
                     _themes = [];
 
-                    _.each(defaultThemes.concat(docThemes), function(theme) {
+                    _.each(defaultThemes, function(theme, index) {
+                        _themes.push({
+                            themeId : theme.get_Index(),
+                            offsety     : index * 38
+                        });
+                    });
+
+                    _.each(docThemes, function(theme) {
                         _themes.push({
                             imageUrl: theme.get_Image(),
-                            themeId : theme.get_Index()
+                            themeId : theme.get_Index(),
+                            offsety     : 0
                         });
                     });
 
diff --git a/apps/presentationeditor/mobile/app/view/edit/EditSlide.js b/apps/presentationeditor/mobile/app/view/edit/EditSlide.js
index d311e7b91..d521612e6 100644
--- a/apps/presentationeditor/mobile/app/view/edit/EditSlide.js
+++ b/apps/presentationeditor/mobile/app/view/edit/EditSlide.js
@@ -310,7 +310,7 @@ define([
                         '<% _.each(themes, function(row) { %>',
                             '<div class="row">',
                             '<% _.each(row, function(theme) { %>',
-                                '<div data-type="<%= theme.themeId %>"><img src="<%= theme.imageUrl %>"></div>',
+                                '<div class="item-theme" data-type="<%= theme.themeId %>" style="' + '<% if (typeof theme.imageUrl !== "undefined") { %>' + 'background-image: url(<%= theme.imageUrl %>);' + '<% } %> background-position: 0 -<%= theme.offsety %>px;"/>',
                             '<% }); %>',
                             '</div>',
                         '<% }); %>'
diff --git a/apps/presentationeditor/mobile/resources/css/app-ios.css b/apps/presentationeditor/mobile/resources/css/app-ios.css
index 98390a8c0..82e7c93f6 100644
--- a/apps/presentationeditor/mobile/resources/css/app-ios.css
+++ b/apps/presentationeditor/mobile/resources/css/app-ios.css
@@ -7115,6 +7115,9 @@ html.pixel-ratio-3 .numbers li {
   width: 85px;
   height: 38px;
 }
+.slide-theme .item-theme {
+  background-image: url('../../../../../../sdkjs/common/Images/themes_thumbnail.png');
+}
 .chart-types li {
   width: 60px;
   height: 60px;
diff --git a/apps/presentationeditor/mobile/resources/css/app-material.css b/apps/presentationeditor/mobile/resources/css/app-material.css
index ffd9630c7..400f45a56 100644
--- a/apps/presentationeditor/mobile/resources/css/app-material.css
+++ b/apps/presentationeditor/mobile/resources/css/app-material.css
@@ -6944,6 +6944,9 @@ html.pixel-ratio-3 .numbers li {
   width: 85px;
   height: 38px;
 }
+.slide-theme .item-theme {
+  background-image: url('../../../../../../sdkjs/common/Images/themes_thumbnail.png');
+}
 .chart-types li {
   width: 60px;
   height: 60px;
diff --git a/apps/presentationeditor/mobile/resources/less/app-ios.less b/apps/presentationeditor/mobile/resources/less/app-ios.less
index 2b8bcf1fa..5078bd2b1 100644
--- a/apps/presentationeditor/mobile/resources/less/app-ios.less
+++ b/apps/presentationeditor/mobile/resources/less/app-ios.less
@@ -211,6 +211,10 @@ input, textarea {
       height: 38px;
     }
   }
+
+  .item-theme {
+    background-image: url('../../../../../../sdkjs/common/Images/themes_thumbnail.png');
+  }
 }
 
 // Charts
diff --git a/apps/presentationeditor/mobile/resources/less/app-material.less b/apps/presentationeditor/mobile/resources/less/app-material.less
index aa43f3b7d..701eb1682 100644
--- a/apps/presentationeditor/mobile/resources/less/app-material.less
+++ b/apps/presentationeditor/mobile/resources/less/app-material.less
@@ -211,6 +211,9 @@ input, textarea {
       height: 38px;
     }
   }
+  .item-theme {
+    background-image: url('../../../../../../sdkjs/common/Images/themes_thumbnail.png');
+  }
 }
 
 // Charts
diff --git a/apps/spreadsheeteditor/embed/index.html b/apps/spreadsheeteditor/embed/index.html
index 65e1d3a1f..a1044311f 100644
--- a/apps/spreadsheeteditor/embed/index.html
+++ b/apps/spreadsheeteditor/embed/index.html
@@ -67,6 +67,7 @@
             background: #fbfbfb;
             width: 100%;
             height: 100%;
+            font-size: 0;
             border: 1px solid #dfdfdf;
             white-space: nowrap;
             padding-top: 32px;
@@ -91,7 +92,7 @@
             position: absolute;
             background: linear-gradient(#f1f1f1 19px, #d5d5d5 20px) 0 0;
             background-size: 20px 20px;
-            width: 35px;
+            width: 25px;
         }
 
         @keyframes flickerAnimation {
diff --git a/apps/spreadsheeteditor/embed/index.html.deploy b/apps/spreadsheeteditor/embed/index.html.deploy
index a14dbb1b2..5b9ef3084 100644
--- a/apps/spreadsheeteditor/embed/index.html.deploy
+++ b/apps/spreadsheeteditor/embed/index.html.deploy
@@ -64,6 +64,7 @@
             background: #fbfbfb;
             width: 100%;
             height: 100%;
+            font-size: 0;
             border: 1px solid #dfdfdf;
             white-space: nowrap;
             padding-top: 32px;
@@ -88,7 +89,7 @@
             position: absolute;
             background: linear-gradient(#f1f1f1 19px, #d5d5d5 20px) 0 0;
             background-size: 20px 20px;
-            width: 35px;
+            width: 25px;
         }
 
         @keyframes flickerAnimation {
diff --git a/apps/spreadsheeteditor/main/index.html b/apps/spreadsheeteditor/main/index.html
index e35450eca..a2d6ce856 100644
--- a/apps/spreadsheeteditor/main/index.html
+++ b/apps/spreadsheeteditor/main/index.html
@@ -22,7 +22,7 @@
 
         .loadmask > .brendpanel {
             width: 100%;
-            min-height: 32px;
+            min-height: 28px;
             background: #40865c;
         }
 
@@ -259,6 +259,7 @@
 
     <script>
         var params = getUrlParams(),
+            notoolbar = params["toolbar"] == 'false',
             internal = params["internal"] == 'true',
             compact = params["compact"] == 'true',
             view = params["mode"] == 'view';
@@ -268,11 +269,19 @@
             document.querySelector('.sktoolbar').remove();
         }
 
+        (compact || view || notoolbar) && document.querySelector('.brendpanel > :nth-child(2)').remove();
+
         if (compact || view) {
-            document.querySelector('.brendpanel > :nth-child(2)').remove();
-            document.querySelector('.brendpanel > :nth-child(1)').style.height = '32px';
+            if (notoolbar) {
+                document.querySelector('.brendpanel > :nth-child(1)').remove();
+                document.querySelector('.brendpanel').remove();
+            } else
+                document.querySelector('.brendpanel > :nth-child(1)').style.height = '32px';
+        } else if (notoolbar) {
+            document.querySelector('.brendpanel > :nth-child(1)').style.height = '28px';
         }
-        if (view) {
+
+        if (view || notoolbar) {
             document.querySelector('.sktoolbar').remove();
         }
 
diff --git a/apps/spreadsheeteditor/main/index.html.deploy b/apps/spreadsheeteditor/main/index.html.deploy
index b4ed29dc3..a4b2302d5 100644
--- a/apps/spreadsheeteditor/main/index.html.deploy
+++ b/apps/spreadsheeteditor/main/index.html.deploy
@@ -24,7 +24,7 @@
 
         .loadmask > .brendpanel {
             width: 100%;
-            height: 56px;
+            min-height: 28px;
             background: #40865c;
         }
 
@@ -271,6 +271,7 @@
     <script>
         var params = getUrlParams(),
             internal = params["internal"] == 'true',
+            notoolbar = params["toolbar"] == 'false',
             compact = params["compact"] == 'true',
             view = params["mode"] == 'view';
 
@@ -279,11 +280,18 @@
             document.querySelector('.sktoolbar').remove();
         }
 
+        (compact || view || notoolbar) && document.querySelector('.brendpanel > :nth-child(2)').remove();
+
         if (compact || view) {
-            document.querySelector('.brendpanel > :nth-child(2)').remove();
-            document.querySelector('.brendpanel > :nth-child(1)').style.height = '32px';
+            if (notoolbar) {
+                document.querySelector('.brendpanel > :nth-child(1)').remove();
+                document.querySelector('.brendpanel').remove();
+            } else
+                document.querySelector('.brendpanel > :nth-child(1)').style.height = '32px';
+        } else if (notoolbar) {
+            document.querySelector('.brendpanel > :nth-child(1)').style.height = '28px';
         }
-        if (view) {
+        if (view || notoolbar) {
             document.querySelector('.sktoolbar').remove();
         }
 
diff --git a/apps/spreadsheeteditor/main/resources/less/app.less b/apps/spreadsheeteditor/main/resources/less/app.less
index e96f88b7c..3c38ad18c 100644
--- a/apps/spreadsheeteditor/main/resources/less/app.less
+++ b/apps/spreadsheeteditor/main/resources/less/app.less
@@ -156,6 +156,7 @@
     display: flex;
     width: 100%;
     height: 100%;
+    font-size: 0;
     border: 1px solid #dfdfdf;
     white-space: nowrap;
 
@@ -176,7 +177,7 @@
         &:first-child {
             background: linear-gradient(#f1f1f1 19px, #d5d5d5 20px) 0 0;
             background-size: 20px 20px;
-            width: 35px;
+            width: 25px;
         }
     }
 }
\ No newline at end of file
diff --git a/apps/spreadsheeteditor/mobile/index.html b/apps/spreadsheeteditor/mobile/index.html
index 65b79b9b3..471e0e49d 100644
--- a/apps/spreadsheeteditor/mobile/index.html
+++ b/apps/spreadsheeteditor/mobile/index.html
@@ -77,6 +77,7 @@
                 background: #fbfbfb;
                 width: 100%;
                 height: 100%;
+                font-size: 0;
                 border: 1px solid #dfdfdf;
                 white-space: nowrap;
                 padding-top: 43px;
@@ -105,7 +106,7 @@
                 position: absolute;
                 background: linear-gradient(#f1f1f1 19px, #d5d5d5 20px) 0 0;
                 background-size: 20px 20px;
-                width: 35px;
+                width: 25px;
             }
 
             @keyframes flickerAnimation {
diff --git a/apps/spreadsheeteditor/mobile/index.html.deploy b/apps/spreadsheeteditor/mobile/index.html.deploy
index 16aa96b49..e827ec645 100644
--- a/apps/spreadsheeteditor/mobile/index.html.deploy
+++ b/apps/spreadsheeteditor/mobile/index.html.deploy
@@ -73,6 +73,7 @@
                 background: #fbfbfb;
                 width: 100%;
                 height: 100%;
+                font-size: 0;
                 border: 1px solid #dfdfdf;
                 white-space: nowrap;
                 padding-top: 43px;
@@ -101,7 +102,7 @@
                 position: absolute;
                 background: linear-gradient(#f1f1f1 19px, #d5d5d5 20px) 0 0;
                 background-size: 20px 20px;
-                width: 35px;
+                width: 25px;
             }
 
             @keyframes flickerAnimation {
diff --git a/apps/spreadsheeteditor/mobile/resources/css/app-ios.css b/apps/spreadsheeteditor/mobile/resources/css/app-ios.css
index 80813f87d..fdbb61d62 100644
--- a/apps/spreadsheeteditor/mobile/resources/css/app-ios.css
+++ b/apps/spreadsheeteditor/mobile/resources/css/app-ios.css
@@ -7714,6 +7714,7 @@ html.pixel-ratio-3 .cell-styles.dataview .row li {
   left: 0;
   right: 0;
   bottom: 0;
+  font-size: 0;
 }
 .doc-placeholder > .columns {
   width: 100%;
@@ -7729,5 +7730,5 @@ html.pixel-ratio-3 .cell-styles.dataview .row li {
 .doc-placeholder > .columns:first-child {
   background: linear-gradient(#f1f1f1 19px, #d5d5d5 20px) 0 0;
   background-size: 20px 20px;
-  width: 35px;
+  width: 25px;
 }
diff --git a/apps/spreadsheeteditor/mobile/resources/css/app-material.css b/apps/spreadsheeteditor/mobile/resources/css/app-material.css
index f76bbc4f4..376aeb942 100644
--- a/apps/spreadsheeteditor/mobile/resources/css/app-material.css
+++ b/apps/spreadsheeteditor/mobile/resources/css/app-material.css
@@ -7576,6 +7576,7 @@ html.pixel-ratio-3 .cell-styles.dataview .row li {
   left: 0;
   right: 0;
   bottom: 0;
+  font-size: 0;
 }
 .doc-placeholder > .columns {
   width: 100%;
@@ -7591,5 +7592,5 @@ html.pixel-ratio-3 .cell-styles.dataview .row li {
 .doc-placeholder > .columns:first-child {
   background: linear-gradient(#f1f1f1 19px, #d5d5d5 20px) 0 0;
   background-size: 20px 20px;
-  width: 35px;
+  width: 25px;
 }
diff --git a/apps/spreadsheeteditor/mobile/resources/less/app-ios.less b/apps/spreadsheeteditor/mobile/resources/less/app-ios.less
index 6f179bc31..e29a25436 100644
--- a/apps/spreadsheeteditor/mobile/resources/less/app-ios.less
+++ b/apps/spreadsheeteditor/mobile/resources/less/app-ios.less
@@ -305,6 +305,7 @@ input, textarea {
   left: 0;
   right: 0;
   bottom: 0;
+  font-size: 0;
 
   > .columns {
     width: 100%;
@@ -323,7 +324,7 @@ input, textarea {
     &:first-child {
       background: linear-gradient(#f1f1f1 19px, #d5d5d5 20px) 0 0;
       background-size: 20px 20px;
-      width: 35px;
+      width: 25px;
     }
   }
 }
\ No newline at end of file
diff --git a/apps/spreadsheeteditor/mobile/resources/less/app-material.less b/apps/spreadsheeteditor/mobile/resources/less/app-material.less
index 4cc126e86..d4e0c94aa 100644
--- a/apps/spreadsheeteditor/mobile/resources/less/app-material.less
+++ b/apps/spreadsheeteditor/mobile/resources/less/app-material.less
@@ -293,6 +293,7 @@ input, textarea {
   left: 0;
   right: 0;
   bottom: 0;
+  font-size: 0;
 
   > .columns {
     width: 100%;
@@ -311,7 +312,7 @@ input, textarea {
     &:first-child {
       background: linear-gradient(#f1f1f1 19px, #d5d5d5 20px) 0 0;
       background-size: 20px 20px;
-      width: 35px;
+      width: 25px;
     }
   }
 }
\ No newline at end of file