From 892fd142ac89515ad068719e6fc8f3d39c9f78bd Mon Sep 17 00:00:00 2001 From: Julia Radzhabova Date: Wed, 19 May 2021 16:35:59 +0300 Subject: [PATCH] [SSE embedded] Change layout --- .../embed/js/ApplicationController.js | 7 ++- apps/spreadsheeteditor/embed/index.html | 21 +++++---- .../spreadsheeteditor/embed/index.html.deploy | 21 +++++---- .../spreadsheeteditor/embed/index_loader.html | 10 ++--- .../embed/index_loader.html.deploy | 10 ++--- .../embed/js/ApplicationController.js | 45 +++++++++++++------ .../embed/js/ApplicationView.js | 9 ++-- 7 files changed, 75 insertions(+), 48 deletions(-) diff --git a/apps/presentationeditor/embed/js/ApplicationController.js b/apps/presentationeditor/embed/js/ApplicationController.js index 77d5b07c5..95b23d420 100644 --- a/apps/presentationeditor/embed/js/ApplicationController.js +++ b/apps/presentationeditor/embed/js/ApplicationController.js @@ -41,8 +41,7 @@ PE.ApplicationController = new(function(){ created = false, currentPage = 0, ttOffset = [0, -10], - labelDocName, - appOptions = {}; + labelDocName; // Initialize analytics // ------------------------- @@ -444,7 +443,6 @@ PE.ApplicationController = new(function(){ logo.attr('href', config.customization.logo.url); } } - api.asc_setViewMode(true); var $parent = labelDocName.parent(); var _left_width = $parent.position().left, @@ -454,7 +452,8 @@ PE.ApplicationController = new(function(){ $parent.css('padding-left', _right_width - _left_width); else $parent.css('padding-right', _left_width - _right_width); - + + api.asc_setViewMode(true); api.asc_LoadDocument(); api.Resize(); } diff --git a/apps/spreadsheeteditor/embed/index.html b/apps/spreadsheeteditor/embed/index.html index 1423d6db2..0f7b732eb 100644 --- a/apps/spreadsheeteditor/embed/index.html +++ b/apps/spreadsheeteditor/embed/index.html @@ -29,7 +29,7 @@ .loadmask > .brendpanel { width: 100%; position: absolute; - height: 32px; + height: 48px; background-color: #e2e2e2; } @@ -42,7 +42,7 @@ .loadmask > .brendpanel .loading-logo { max-width: 200px; height: 24px; - margin: 0 auto; + margin-left: 10px; text-align: center; } @@ -53,6 +53,9 @@ margin-top: 2px; opacity: 0; } + .loadmask > .brendpanel .doc-title { + flex-grow: 1; + } .loadmask > .brendpanel .circle { vertical-align: middle; @@ -70,7 +73,7 @@ font-size: 0; border: 1px solid #dfdfdf; white-space: nowrap; - padding-top: 32px; + padding-top: 48px; } .loadmask > .placeholder > .columns { @@ -126,10 +129,10 @@
-
+
@@ -213,15 +216,15 @@
- +
- +
-
+
diff --git a/apps/spreadsheeteditor/embed/index.html.deploy b/apps/spreadsheeteditor/embed/index.html.deploy index 24b7e6b49..da6dcb307 100644 --- a/apps/spreadsheeteditor/embed/index.html.deploy +++ b/apps/spreadsheeteditor/embed/index.html.deploy @@ -26,7 +26,7 @@ .loadmask > .brendpanel { width: 100%; position: absolute; - height: 32px; + height: 48px; background-color: #e2e2e2; } @@ -39,7 +39,7 @@ .loadmask > .brendpanel .loading-logo { max-width: 200px; height: 24px; - margin: 0 auto; + margin-left: 10px; text-align: center; } @@ -50,6 +50,9 @@ margin-top: 2px; opacity: 0; } + .loadmask > .brendpanel .doc-title { + flex-grow: 1; + } .loadmask > .brendpanel .circle { vertical-align: middle; @@ -67,7 +70,7 @@ font-size: 0; border: 1px solid #dfdfdf; white-space: nowrap; - padding-top: 32px; + padding-top: 48px; } .loadmask > .placeholder > .columns { @@ -123,10 +126,10 @@
-
+
@@ -205,15 +208,15 @@
- +
- +
-
+
diff --git a/apps/spreadsheeteditor/embed/index_loader.html b/apps/spreadsheeteditor/embed/index_loader.html index e341b0700..3d44aeda2 100644 --- a/apps/spreadsheeteditor/embed/index_loader.html +++ b/apps/spreadsheeteditor/embed/index_loader.html @@ -293,15 +293,15 @@
- +
- +
-
+
diff --git a/apps/spreadsheeteditor/embed/index_loader.html.deploy b/apps/spreadsheeteditor/embed/index_loader.html.deploy index c90da3dfd..56166bc85 100644 --- a/apps/spreadsheeteditor/embed/index_loader.html.deploy +++ b/apps/spreadsheeteditor/embed/index_loader.html.deploy @@ -285,15 +285,15 @@
- +
- +
-
+
diff --git a/apps/spreadsheeteditor/embed/js/ApplicationController.js b/apps/spreadsheeteditor/embed/js/ApplicationController.js index fd7407ce2..7c8f3b24b 100644 --- a/apps/spreadsheeteditor/embed/js/ApplicationController.js +++ b/apps/spreadsheeteditor/embed/js/ApplicationController.js @@ -42,7 +42,8 @@ SSE.ApplicationController = new(function(){ iframePrint = null; var $ttEl, $tooltip, - ttOffset = [6, -15]; + ttOffset = [6, -15], + labelDocName; // Initialize analytics // ------------------------- @@ -68,9 +69,6 @@ SSE.ApplicationController = new(function(){ common.controller.modals.init(embedConfig); - if (config.canBackToFolder === false || !(config.customization && config.customization.goback && (config.customization.goback.url || config.customization.goback.requestClose && config.canRequestClose))) - $('#id-btn-close').hide(); - // Docked toolbar if (embedConfig.toolbarDocked === 'bottom') { $('#toolbar').addClass('bottom'); @@ -81,6 +79,9 @@ SSE.ApplicationController = new(function(){ $('#toolbar').addClass('top'); $('.viewer').addClass('top'); } + + config.canBackToFolder = (config.canBackToFolder!==false) && config.customization && config.customization.goback && + (config.customization.goback.url || config.customization.goback.requestClose && config.canRequestClose); } function loadDocument(data) { @@ -120,6 +121,8 @@ SSE.ApplicationController = new(function(){ } embedConfig.docTitle = docConfig.title; + labelDocName = $('#title-doc-name'); + labelDocName.text(embedConfig.docTitle || '') } } @@ -188,14 +191,19 @@ SSE.ApplicationController = new(function(){ if ( !embedConfig.shareUrl ) $('#idt-share').hide(); + if (!config.canBackToFolder) + $('#id-close').hide(); + if ( !embedConfig.embedUrl ) $('#idt-embed').hide(); if ( !embedConfig.fullscreenUrl ) $('#idt-fullscreen').hide(); - if ( !embedConfig.saveUrl && permissions.print === false && !embedConfig.shareUrl && !embedConfig.embedUrl && !embedConfig.fullscreenUrl) + if ( !embedConfig.saveUrl && permissions.print === false && !embedConfig.shareUrl && !embedConfig.embedUrl && !embedConfig.fullscreenUrl && !config.canBackToFolder) $('#box-tools').addClass('hidden'); + else if (!embedConfig.embedUrl && !embedConfig.fullscreenUrl) + $('#box-tools .divider').hide(); common.controller.modals.attach({ share: '#idt-share', @@ -235,14 +243,15 @@ SSE.ApplicationController = new(function(){ Common.Analytics.trackEvent('Print'); }); - $('#id-btn-close').on('click', function(){ - if (config.customization && config.customization.goback) { - if (config.customization.goback.requestClose && config.canRequestClose) - Common.Gateway.requestClose(); - else if (config.customization.goback.url) - window.parent.location.href = config.customization.goback.url; - } - }); + SSE.ApplicationView.tools.get('#idt-close') + .on('click', function(){ + if (config.customization && config.customization.goback) { + if (config.customization.goback.requestClose && config.canRequestClose) + Common.Gateway.requestClose(); + else if (config.customization.goback.url) + window.parent.location.href = config.customization.goback.url; + } + }); $('#id-btn-zoom-in').on('click', function () { if (api){ @@ -337,6 +346,16 @@ SSE.ApplicationController = new(function(){ logo.attr('href', config.customization.logo.url); } } + + var $parent = labelDocName.parent(); + var _left_width = $parent.position().left, + _right_width = $parent.next().outerWidth(); + + if ( _left_width < _right_width ) + $parent.css('padding-left', _right_width - _left_width); + else + $parent.css('padding-right', _left_width - _right_width); + api.asc_setViewMode(true); api.asc_LoadDocument(); } diff --git a/apps/spreadsheeteditor/embed/js/ApplicationView.js b/apps/spreadsheeteditor/embed/js/ApplicationView.js index 5a31642a3..f396aa688 100644 --- a/apps/spreadsheeteditor/embed/js/ApplicationView.js +++ b/apps/spreadsheeteditor/embed/js/ApplicationView.js @@ -45,10 +45,12 @@ SSE.ApplicationView = new(function(){ $btnTools.addClass('dropdown-toggle').attr('data-toggle', 'dropdown').attr('aria-expanded', 'true'); $btnTools.parent().append( - '