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

[DE embedded] Change embedded layout

Browse source
This commit is contained in:
Julia Radzhabova 2021-05-17 23:55:33 +03:00
parent 60c43641a3
commit 6d9d599ade
4 changed files with 69 additions and 64 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

84
apps/common/embed/resources/less/common.less
View file

@ -110,11 +110,15 @@
z-index: 100;
background-color: @toolbarTopColor;
display: flex;
align-items: center;
white-space: nowrap;
&.top {
top: 0;
left: 0;
width: 100%;
height: 32px;
height: 48px;
-webkit-box-shadow: inset 0 -1px 0 @toolbarBorderColor, inset 0 1px 0 @toolbarBorderShadowColor;
//-moz-box-shadow: inset 0 -1px 0 @toolbarBorderColor, inset 0 1px 0 @toolbarBorderShadowColor;
@ -133,11 +137,6 @@
}
.group {
position: absolute;
top: 50%;
transform: translateY(-50%);
list-style-type: none;
margin: 0;
padding: 0;
@ -161,6 +160,11 @@
.item {
float: left;
}
& > div {
display: inline-block;
vertical-align: middle;
}
}
&.right {
@ -168,13 +172,21 @@
padding-right: 10px;
.item {
float: left;
display: inline-block;
}
}
&.center {
left: 50%;
transform: translate(-50%, -50%);
display: flex;
justify-content: center;
flex-grow: 1;
overflow: hidden;
padding: 0 20px;
#title-doc-name {
overflow: hidden;
text-overflow: ellipsis;
}
}
.separator {
@ -199,6 +211,12 @@
}
}
.margin-right-small {
margin-right: 8px;
}
.margin-right-large {
margin-right: 12px;
}
}
// Logo
@ -219,6 +237,16 @@
background-color: transparent;
border: 1px solid transparent;
border-radius: 2px;
width: 24px;
height: 22px;
background-origin: content-box;
padding: 0 1px;
&:active {
background-position-y: -@icon-height !important;
}
//margin: 0;
&.no-caption {
@ -473,34 +501,20 @@
&.print {
background-position: -@icon-width*11 0;
}
}
.png-icon {
display: inline-block;
vertical-align: middle;
cursor: pointer;
background-color: transparent;
border: 1px solid transparent;
border-radius: 2px;
width: 24px;
height: 22px;
&.prev {
background: data-uri('../../../../common/embed/resources/img/previous-field.png') no-repeat;
background-size: cover;
&.form-prev {
background-position: -@icon-width*7 0;
}
&.next {
background: data-uri('../../../../common/embed/resources/img/next-field.png') no-repeat;
background-size: cover;
&.form-next {
background-position: -@icon-width*8 0;
}
}
.mi-icon {
width: @icon-width;
height: @icon-height;
//display: inline-block;
float: left;
margin: 0 15px 0 -15px;
margin: 0 15px 0 -35px;
}
.btn, button {
@ -567,7 +581,7 @@
.dropdown-menu {
> li > a {
padding: 8px 20px 8px 31px;
padding: 8px 20px 8px 50px;
&:hover, &:focus {
background-color: @btnColor;
outline: 0 none;
@ -585,18 +599,6 @@
}
#box-tools {
display: inline-block;
button {
width: 24px;
height: 22px;
background-origin: content-box;
padding: 0 1px;
&:active {
background-position: 0 -@icon-height;
}
}
a {
cursor: pointer;
}

19
apps/documenteditor/embed/index.html
View file

@ -184,19 +184,18 @@
<div class="toolbar" id="toolbar">
<div class="group left">
<div class="margin-right-large"><a id="header-logo" class="brand-logo" href="http://www.onlyoffice.com/" target="_blank"></a></div>
<button id="id-btn-prev-field" class="control-btn svg-icon form-prev margin-right-small"></button>
<button id="id-btn-next-field" class="control-btn svg-icon form-next"></button>
</div>
<div class="group center">
<span id="title-doc-name">ffffffffffffffffffffffffffffffffffffff ffffffffffffffffffffffffffffffffffffffffffffff</span>
</div>
<div class="group right">
<div class="item margin-right-small"><input id="page-number" class="form-control input-xs masked" type="text" value="0"><span class="text" id="pages" tabindex="-1">of 0</span></div>
<div id="box-tools" class="dropdown">
<button class="control-btn svg-icon tools"></button>
</div>
<button id="id-btn-prev-field" class="png-icon prev"></button>
<button id="id-btn-next-field" class="png-icon next"></button>
</div>
<div class="group center">
<span><a id="header-logo" class="brand-logo" href="http://www.onlyoffice.com/" target="_blank"></a></span>
</div>
<div class="group right">
<div class="item"><input id="page-number" class="form-control input-xs masked" type="text" value="0"><span class="text" id="pages" tabindex="-1">of 0</span></div>
<div class="item separator"></div>
<div class="item"><button id="id-btn-close" class="control-btn close"><span aria-hidden="true">&times;</span></button></div>
</div>
</div>

23
apps/documenteditor/embed/js/ApplicationController.js
View file

@ -75,13 +75,8 @@ DE.ApplicationController = new(function(){
$('#editor_sdk').addClass('top');
}
if (config.canBackToFolder === false || !(config.customization && config.customization.goback && (config.customization.goback.url || config.customization.goback.requestClose && config.canRequestClose))) {
$('#id-btn-close').hide();
// Hide last separator
$('#toolbar .right .separator').hide();
$('#pages').css('margin-right', '12px');
}
config.canBackToFolder = (config.canBackToFolder!==false) && config.customization && config.customization.goback &&
(config.customization.goback.url || config.customization.goback.requestClose && config.canRequestClose);
}
function loadDocument(data) {
@ -126,6 +121,7 @@ DE.ApplicationController = new(function(){
}
embedConfig.docTitle = docConfig.title;
$('#title-doc-name').text(embedConfig.docTitle || '');
}
}
@ -239,14 +235,19 @@ DE.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',
@ -290,7 +291,8 @@ DE.ApplicationController = new(function(){
Common.Analytics.trackEvent('Print');
});
$('#id-btn-close').on('click', function(){
DE.ApplicationView.tools.get('#idt-close')
.on('click', function(){
if (config.customization && config.customization.goback) {
if (config.customization.goback.requestClose && config.canRequestClose)
Common.Gateway.requestClose();
@ -366,8 +368,7 @@ DE.ApplicationController = new(function(){
}
}
var licType = params.asc_getLicenseType();
// var canFillForms = (licType === Asc.c_oLicenseResult.Success || licType === Asc.c_oLicenseResult.SuccessLimit) && (permissions.fillForms===true) && (config.mode !== 'view');
var canFillForms = true;
var canFillForms = (licType === Asc.c_oLicenseResult.Success || licType === Asc.c_oLicenseResult.SuccessLimit) && (permissions.fillForms===true) && (config.mode !== 'view');
if (!canFillForms) {
$('#id-btn-prev-field').hide();
$('#id-btn-next-field').hide();

7
apps/documenteditor/embed/js/ApplicationView.js
View file

@ -44,10 +44,12 @@ DE.ApplicationView = new(function(){
$btnTools.addClass('dropdown-toggle').attr('data-toggle', 'dropdown').attr('aria-expanded', 'true');
$btnTools.parent().append(
'<ul class="dropdown-menu">' +
'<ul class="dropdown-menu pull-right">' +
'<li><a id="idt-download"><span class="mi-icon svg-icon download"></span>' + this.txtDownload + '</a></li>' +
'<li><a id="idt-print"><span class="mi-icon svg-icon print"></span>' + this.txtPrint + '</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 close"></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>');
@ -67,6 +69,7 @@ DE.ApplicationView = new(function(){
txtPrint: 'Print',
txtShare: 'Share',
txtEmbed: 'Embed',
txtFullScreen: 'Full Screen'
txtFullScreen: 'Full Screen',
txtFileLocation: 'Open file location'
}
})();