Lea/web-apps
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

[SSE embedded] Change layout

Browse source
This commit is contained in:
Julia Radzhabova 2021-05-19 16:35:59 +03:00
parent c143e5b811
commit 892fd142ac
7 changed files with 75 additions and 48 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
apps/presentationeditor/embed/js/ApplicationController.js
View file

@ -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();
}

21
apps/spreadsheeteditor/embed/index.html
View file

@ -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 @@
<div id="loading-mask" class="loadmask">
<div class="brendpanel">
<div>
<div class="circle"></div>
<div class="brand-logo loading-logo">
<img src="">
</div>
<div class="doc-title"></div>
<div class="circle"></div>
</div>
</div>
@ -213,15 +216,15 @@
<div class="toolbar" id="toolbar">
<div class="group left">
<div id="box-tools" class="dropdown">
<button class="control-btn svg-icon tools"></button>
</div>
<div class="margin-right-large"><a id="header-logo" class="brand-logo" href="http://www.onlyoffice.com/" target="_blank"></a></div>
</div>
<div class="group center">
<span><a id="header-logo" class="brand-logo" href="http://www.onlyoffice.com/" target="_blank"></a></span>
<span id="title-doc-name"></span>
</div>
<div class="group right">
<div class="item"><button id="id-btn-close" class="control-btn close"><span aria-hidden="true">&times;</span></button></div>
<div id="box-tools" class="dropdown">
<button class="control-btn svg-icon more-vertical"></button>
</div>
</div>
</div>

21
apps/spreadsheeteditor/embed/index.html.deploy
View file

@ -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 @@
<div id="loading-mask" class="loadmask">
<div class="brendpanel">
<div>
<div class="circle"></div>
<div class="brand-logo loading-logo">
<img src="">
</div>
<div class="doc-title"></div>
<div class="circle"></div>
</div>
</div>
@ -205,15 +208,15 @@
<div class="toolbar" id="toolbar">
<div class="group left">
<div id="box-tools" class="dropdown">
<button class="control-btn svg-icon tools"></button>
</div>
<div class="margin-right-large"><a id="header-logo" class="brand-logo" href="http://www.onlyoffice.com/" target="_blank"></a></div>
</div>
<div class="group center">
<span><a id="header-logo" class="brand-logo" href="http://www.onlyoffice.com/" target="_blank"></a></span>
<span id="title-doc-name"></span>
</div>
<div class="group right">
<div class="item"><button id="id-btn-close" class="control-btn close"><span aria-hidden="true">&times;</span></button></div>
<div id="box-tools" class="dropdown">
<button class="control-btn svg-icon more-vertical"></button>
</div>
</div>
</div>

10
apps/spreadsheeteditor/embed/index_loader.html
View file

@ -293,15 +293,15 @@
<div class="toolbar" id="toolbar">
<div class="group left">
<div id="box-tools" class="dropdown">
<button class="control-btn svg-icon tools"></button>
</div>
<div class="margin-right-large"><a id="header-logo" class="brand-logo" href="http://www.onlyoffice.com/" target="_blank"></a></div>
</div>
<div class="group center">
<span><a id="header-logo" class="brand-logo" href="http://www.onlyoffice.com/" target="_blank"></a></span>
<span id="title-doc-name"></span>
</div>
<div class="group right">
<div class="item"><button id="id-btn-close" class="control-btn close"><span aria-hidden="true">&times;</span></button></div>
<div id="box-tools" class="dropdown">
<button class="control-btn svg-icon more-vertical"></button>
</div>
</div>
</div>

10
apps/spreadsheeteditor/embed/index_loader.html.deploy
View file

@ -285,15 +285,15 @@
<div class="toolbar" id="toolbar">
<div class="group left">
<div id="box-tools" class="dropdown">
<button class="control-btn svg-icon tools"></button>
</div>
<div class="margin-right-large"><a id="header-logo" class="brand-logo" href="http://www.onlyoffice.com/" target="_blank"></a></div>
</div>
<div class="group center">
<span><a id="header-logo" class="brand-logo" href="http://www.onlyoffice.com/" target="_blank"></a></span>
<span id="title-doc-name"></span>
</div>
<div class="group right">
<div class="item"><button id="id-btn-close" class="control-btn close"><span aria-hidden="true">&times;</span></button></div>
<div id="box-tools" class="dropdown">
<button class="control-btn svg-icon more-vertical"></button>
</div>
</div>
</div>

45
apps/spreadsheeteditor/embed/js/ApplicationController.js
View file

@ -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();
}

9
apps/spreadsheeteditor/embed/js/ApplicationView.js
View file

@ -45,10 +45,12 @@ SSE.ApplicationView = new(function(){
$btnTools.addClass('dropdown-toggle').attr('data-toggle', 'dropdown').attr('aria-expanded', 'true');
$btnTools.parent().append(
'<ul class="dropdown-menu">' +
'<li><a id="idt-download"><span class="mi-icon svg-icon download"></span>' + this.txtDownload + '</a></li>' +
'<ul class="dropdown-menu pull-right">' +
'<li><a id="idt-print"><span class="mi-icon svg-icon print"></span>' + this.txtPrint + '</a></li>' +
'<li><a id="idt-download"><span class="mi-icon svg-icon download"></span>' + this.txtDownload + '</a></li>' +
'<li><a id="idt-share" data-toggle="modal"><span class="mi-icon svg-icon share"></span>' + this.txtShare + '</a></li>' +
'<li><a id="idt-close" data-toggle="modal"><span class="mi-icon svg-icon go-to-location"></span>' + this.txtFileLocation + '</a></li>' +
'<li class="divider"></li>' +
'<li><a id="idt-embed" data-toggle="modal"><span class="mi-icon svg-icon embed"></span>' + this.txtEmbed + '</a></li>' +
'<li><a id="idt-fullscreen"><span class="mi-icon svg-icon fullscr"></span>' + this.txtFullScreen + '</a></li>' +
'</ul>');
@ -68,6 +70,7 @@ SSE.ApplicationView = new(function(){
txtPrint: 'Print',
txtShare: 'Share',
txtEmbed: 'Embed',
txtFullScreen: 'Full Screen'
txtFullScreen: 'Full Screen',
txtFileLocation: 'Open file location'
}
})();