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

new design changes

Browse source
This commit is contained in:
Maxim Kadushkin 2018-01-23 20:35:16 +03:00
parent 106afacb6e
commit 826ac6aef1
12 changed files with 104 additions and 23 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
apps/common/main/lib/view/Header.js
View file

@ -414,6 +414,14 @@ define([
$html.find('#slot-btn-back').hide();
this.labelDocName.hide();
//TODO: for new design representation only
this.labelDocName = $('#box-document-title > #title-doc-name');
this.labelDocName.text = function (str) {this.val(str);};
this.labelDocName.text( this.documentCaption );
$('.toolbar-fullview-panel').addClass('new-doctitle-offset');
/***********/
if ( config.isOffline )
$saveStatus = false;
} else {

25
apps/common/main/resources/less/header.less
View file

@ -239,4 +239,27 @@
width: 20px;
height: 20px;
}
}
}
#box-document-title {
background-color: @tabs-bg-color;
#title-doc-name {
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
text-align: center;
font-size: 12px;
width: 100%;
height: 100%;
color: #d3d9e3;
background-color: transparent;
border: 0 none;
cursor: default;
}
}
.toolbar-fullview-panel.new-doctitle-offset {
top: @height-tabs + 26;
}

12
apps/documenteditor/main/app/controller/Viewport.js
View file

@ -75,7 +75,8 @@ define([
toolbar.setExtra('left', me.header.getPanel('left', config));
},
'view:compact' : function (toolbar, state) {
me.viewport.vlayout.panels[0].height = state ? 32 : 32+67;
me.viewport.vlayout.getItem('toolbar').height = state ?
Common.Utils.InternalSettings.get('toolbar-height-compact') : Common.Utils.InternalSettings.get('toolbar-height-normal');
}
}
});
@ -113,11 +114,18 @@ define([
onAppShowed: function (config) {
var me = this;
me.appConfig = config;
if ( !config.isEdit ||
( !Common.localStorage.itemExists("de-compact-toolbar") &&
config.customization && config.customization.compactToolbar )) {
me.viewport.vlayout.panels[0].height = 32;
var panel = me.viewport.vlayout.getItem('toolbar');
if ( panel ) panel.height = Common.Utils.InternalSettings.get('toolbar-height-compact');
}
if ( config.isDesktopApp ) {
me.viewport.vlayout.getItem('doc-title').el.show();
}
},

3
apps/documenteditor/main/app/template/Viewport.template
View file

@ -1,5 +1,8 @@
<div class="layout-region">
<div id="viewport-vbox-layout" class="layout-ct vbox">
<section id="box-document-title" class="layout-item">
<input type="text" id="title-doc-name" spellcheck="false" data-can-copy="false">
</section>
<section class="layout-ct">
<div id="file-menu-panel" class="toolbar-fullview-panel" style="display:none;"></div>
</section>

12
apps/documenteditor/main/app/view/Viewport.js
View file

@ -82,10 +82,18 @@ define([
var $container = $('#viewport-vbox-layout', this.$el);
this.vlayout = new Common.UI.VBoxLayout({
box: $container,
items: [{
items: [
{
el: $container.find(' > .layout-item#box-document-title').hide(),
alias: 'doc-title',
height: Common.Utils.InternalSettings.get('doc-title-height')
},
{
el: $container.find(' > .layout-item#toolbar'),
alias: 'toolbar',
// rely: true
height: Common.localStorage.getBool('de-compact-toolbar') ? 32 : 32+67
height: Common.localStorage.getBool('de-compact-toolbar') ?
Common.Utils.InternalSettings.get('toolbar-height-compact') : Common.Utils.InternalSettings.get('toolbar-height-normal')
}, {
el: $container.find(' > .layout-item.middle'),
stretch: true

3
apps/documenteditor/main/resources/less/toolbar.less
View file

@ -1,5 +1,6 @@
@tabs-bg-color: #4f6279;
//@tabs-bg-color: #4f6279;
@tabs-bg-color: #446995;
#toolbar {
//z-index: 101;

10
apps/presentationeditor/main/app/controller/Viewport.js
View file

@ -76,7 +76,8 @@ define([
toolbar.setExtra('left', me.header.getPanel('left', config));
},
'view:compact' : function (toolbar, state) {
me.viewport.vlayout.panels[0].height = state ? 32 : 32+67;
me.viewport.vlayout.getItem('toolbar').height = state ?
Common.Utils.InternalSettings.get('toolbar-height-compact') : Common.Utils.InternalSettings.get('toolbar-height-normal');
}
},
// Events generated by main view
@ -116,12 +117,17 @@ define([
onAppShowed: function (config) {
var me = this;
me.appConfig = config;
if ( !config.isEdit ||
( !Common.localStorage.itemExists("pe-compact-toolbar") &&
config.customization && config.customization.compactToolbar ))
{
me.viewport.vlayout.panels[0].height = 32;
me.viewport.vlayout.getItem('toolbar').height = Common.Utils.InternalSettings.get('toolbar-height-compact');
}
if ( config.isDesktopApp ) {
me.viewport.vlayout.getItem('doc-title').el.show();
}
},

3
apps/presentationeditor/main/app/template/Viewport.template
View file

@ -4,6 +4,9 @@
<div id="file-menu-panel" class="toolbar-fullview-panel" style="display:none;"></div>
</section>
<div id="viewport-vbox-layout" class="layout-ct vbox">
<section id="box-document-title" class="layout-item">
<input type="text" id="title-doc-name" spellcheck="false" data-can-copy="false">
</section>
<div id="toolbar" class="layout-item"></div>
<div class="layout-item middle">
<div id="viewport-hbox-layout" class="layout-ct hbox">

18
apps/presentationeditor/main/app/view/Viewport.js
View file

@ -85,14 +85,22 @@ define([
var items = $container.find(' > .layout-item');
this.vlayout = new Common.UI.VBoxLayout({
box: $container,
items: [{
el: items[0],
height: Common.localStorage.getBool('pe-compact-toolbar') ? 32 : 32+67
}, {
items: [
{
el: $container.find(' > .layout-item#box-document-title').hide(),
alias: 'doc-title',
height: Common.Utils.InternalSettings.get('doc-title-height')
},
{
el: items[1],
stretch: true
alias: 'toolbar',
height: Common.localStorage.getBool('pe-compact-toolbar') ?
Common.Utils.InternalSettings.get('toolbar-height-compact') : Common.Utils.InternalSettings.get('toolbar-height-normal')
}, {
el: items[2],
stretch: true
}, {
el: items[3],
height: 25
}]
});

12
apps/spreadsheeteditor/main/app/controller/Viewport.js
View file

@ -74,7 +74,8 @@ define([
toolbar.setExtra('left', me.header.getPanel('left', config));
},
'view:compact' : function (toolbar, state) {
me.viewport.vlayout.panels[0].height = state ? 32 : 32+67;
me.viewport.vlayout.getItem('toolbar').height = state ?
Common.Utils.InternalSettings.get('toolbar-height-compact') : Common.Utils.InternalSettings.get('toolbar-height-normal');
}
}
});
@ -88,15 +89,20 @@ define([
onAppShowed: function (config) {
var me = this;
me.appConfig = config;
if ( !config.isEdit ||
( !Common.localStorage.itemExists("sse-compact-toolbar") &&
config.customization && config.customization.compactToolbar ))
{
me.viewport.vlayout.panels[0].height = 32;
me.viewport.vlayout.getItem('toolbar').height = Common.Utils.InternalSettings.get('toolbar-height-compact');
} else
if ( config.isEditDiagram || config.isEditMailMerge ) {
me.viewport.vlayout.panels[0].height = 41;
me.viewport.vlayout.getItem('toolbar').height = 41;
}
if ( config.isDesktopApp ) {
me.viewport.vlayout.getItem('doc-title').el.show();
}
},

3
apps/spreadsheeteditor/main/app/template/Viewport.template
View file

@ -1,5 +1,8 @@
<div class="layout-region">
<div id="viewport-vbox-layout" class="layout-ct vbox">
<section id="box-document-title" class="layout-item">
<input type="text" id="title-doc-name" spellcheck="false" data-can-copy="false">
</section>
<section class="layout-ct">
<div id="file-menu-panel" class="toolbar-fullview-panel" style="display:none;"></div>
</section>

18
apps/spreadsheeteditor/main/app/view/Viewport.js
View file

@ -87,16 +87,20 @@ define([
box: $container,
items: [
{
// el: items[0], // decorative element for view mode for desktop
// height: 5
// }, {
el: items[0],
height: Common.localStorage.getBool('sse-compact-toolbar') ? 32 : 32+67
}, {
el: $container.find(' > .layout-item#box-document-title').hide(),
alias: 'doc-title',
height: Common.Utils.InternalSettings.get('doc-title-height')
},
{
el: items[1],
stretch: true
alias: 'toolbar',
height: Common.localStorage.getBool('sse-compact-toolbar') ?
Common.Utils.InternalSettings.get('toolbar-height-compact') : Common.Utils.InternalSettings.get('toolbar-height-normal')
}, {
el: items[2],
stretch: true
}, {
el: items[3],
height: 25
}]
});