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

[DE] 'view' mode

Browse source
This commit is contained in:
Maxim Kadushkin 2017-04-10 16:39:03 +03:00
parent 011130b5bd
commit bf95ec509e
9 changed files with 135 additions and 87 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

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

@ -1045,15 +1045,17 @@ define([
this.updatePlugins(this.plugins, true);
this.applyModeCommonElements();
this.applyModeEditorElements();
if ( this.appOptions.isEdit ) {
this.applyModeEditorElements();
} else {
Common.NotificationCenter.trigger('app:face', this.appOptions);
this.api.asc_setViewMode(!this.appOptions.isEdit);
this.api.asc_LoadDocument();
if (!this.appOptions.isEdit) {
this.hidePreloader();
this.onLongActionBegin(Asc.c_oAscAsyncActionType['BlockInteraction'], LoadingDocument);
}
this.api.asc_setViewMode(!this.appOptions.isEdit);
this.api.asc_LoadDocument();
},
applyModeCommonElements: function() {

20
apps/documenteditor/main/app/controller/Statusbar.js
View file

@ -83,24 +83,24 @@ define([
var me = this;
Common.NotificationCenter.on('app:face', function (cfg) {
me.statusbar.render();
me.statusbar.render(cfg);
me.statusbar.$el.css('z-index', 1);
$('.statusbar #label-zoom').css('min-width', 70);
var review = DE.getController('Common.Controllers.ReviewChanges').getView();
if ( cfg.canReview ) {
me.btnTurnReview = review.getButton('turn', 'statusbar');
me.btnTurnReview.render( me.statusbar.$layout.find('#btn-doc-review') );
} else {
me.statusbar.$el.find('.el-review').hide();
}
if ( cfg.isEdit ) {
var review = DE.getController('Common.Controllers.ReviewChanges').getView();
if (cfg.canReview) {
me.btnTurnReview = review.getButton('turn', 'statusbar');
me.btnTurnReview.render(me.statusbar.$layout.find('#btn-doc-review'));
} else {
me.statusbar.$el.find('.el-review').hide();
}
me.btnSpelling = review.getButton('spelling', 'statusbar');
me.btnSpelling.render( me.statusbar.$layout.find('#btn-doc-spell') );
} else {
me.statusbar.$el.find('.el-edit')['hide']();
me.statusbar.$el.find('.el-edit, .el-review').hide();
}
});

21
apps/documenteditor/main/app/controller/Toolbar.js
View file

@ -107,6 +107,11 @@ define([
'Toolbar': {
'view:compact' : this.onChangeCompactView,
'insert:break' : this.onClickPageBreak
},
'FileMenu': {
'filemenu:hide': function () {
this.toolbar.setTab('');
}.bind(this)
}
});
@ -2731,8 +2736,10 @@ define([
onAppShowed: function (config) {
var me = this;
// if ( config.canReview )
{
me.toolbar.render(config);
if ( config.isEdit ) {
var tab = {action: 'review', caption: 'Review'};
var $panel = DE.getController('Common.Controllers.ReviewChanges').createToolbarPanel();
@ -2741,9 +2748,13 @@ define([
}
}
if ( !Common.localStorage.itemExists("de-compact-toolbar") &&
config.customization && config.customization.compactToolbar ) {
me.onChangeCompactView(me.toolbar, true);
if ( !config.isEdit ||
( !Common.localStorage.itemExists("de-compact-toolbar") &&
config.customization && config.customization.compactToolbar )) {
this.toolbar.setFolded(true);
Common.NotificationCenter.trigger('layout:changed', 'toolbar');
Common.NotificationCenter.trigger('edit:complete', this.toolbar);
}
},

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

@ -112,6 +112,18 @@ define([
this.boxSdk = $('#editor_sdk');
this.boxSdk.css('border-left', 'none');
Common.NotificationCenter.on('app:face', this.onAppShowed.bind(this));
},
onAppShowed: function (config) {
var me = this;
if ( !config.isEdit ||
( !Common.localStorage.itemExists("de-compact-toolbar") &&
config.customization && config.customization.compactToolbar )) {
me.viewport.vlayout.panels[0].height = 40;
}
},
onLayoutChanged: function(area) {

4
apps/documenteditor/main/app/view/FileMenu.js
View file

@ -204,9 +204,9 @@ define([
hide: function() {
this.$el.hide();
if (this.mode.isEdit) DE.getController('Toolbar').DisableToolbar(false);
// if (this.mode.isEdit) DE.getController('Toolbar').DisableToolbar(false);
this.fireEvent('filemenu:hide', [this]);
this.api.asc_enableKeyEvents(true);
// this.api.asc_enableKeyEvents(true);
},
applyMode: function() {

55
apps/documenteditor/main/app/view/Statusbar.js
View file

@ -86,25 +86,27 @@ define([
me.btnZoomDown.updateHint(me.tipZoomOut + Common.Utils.String.platformKey('Ctrl+-'));
me.btnZoomUp.updateHint(me.tipZoomIn + Common.Utils.String.platformKey('Ctrl++'));
me.btnLanguage.updateHint(me.tipSetLang);
me.btnLanguage.cmpEl.on({
'show.bs.dropdown': function () {
_.defer(function(){
me.btnLanguage.cmpEl.find('ul').focus();
}, 100);
},
'hide.bs.dropdown': function () {
_.defer(function(){
me.api.asc_enableKeyEvents(true);
}, 100);
},
'click': function (e) {
if (me.btnLanguage.isDisabled()) {
return false;
if ( config.isEdit ) {
me.btnLanguage.updateHint(me.tipSetLang);
me.btnLanguage.cmpEl.on({
'show.bs.dropdown': function () {
_.defer(function () {
me.btnLanguage.cmpEl.find('ul').focus();
}, 100);
},
'hide.bs.dropdown': function () {
_.defer(function () {
me.api.asc_enableKeyEvents(true);
}, 100);
},
'click': function (e) {
if (me.btnLanguage.isDisabled()) {
return false;
}
}
}
});
me.langMenu.on('item:click', _.bind(_clickLanguage,this));
});
me.langMenu.on('item:click', _.bind(_clickLanguage, this));
}
me.cntZoom.updateHint(me.tipZoomFactor);
me.cntZoom.cmpEl.on({
@ -285,7 +287,7 @@ define([
}.bind(this));
},
render: function () {
render: function(config) {
var me = this;
function _btn_render(button, slot) {
@ -302,20 +304,21 @@ define([
_btn_render(me.btnZoomUp, $('#btn-zoom-up', me.$layout));
_btn_render(me.txtGoToPage, $('#status-goto-page', me.$layout));
var panelLang = $('.cnt-lang', me.$layout);
_btn_render(me.btnLanguage, panelLang);
if ( !config || config.isEdit ) {
var panelLang = $('.cnt-lang', me.$layout);
_btn_render(me.btnLanguage, panelLang);
me.langMenu.render(panelLang);
me.langMenu.cmpEl.attr({tabindex: -1});
me.langMenu.prevTip = 'en';
}
me.langMenu.render(panelLang);
me.zoomMenu.render($('.cnt-zoom',me.$layout));
me.langMenu.cmpEl.attr({tabindex: -1});
me.zoomMenu.cmpEl.attr({tabindex: -1});
this.$el.html(me.$layout);
this.fireEvent('render:after', [this]);
this.langMenu.prevTip = 'en';
return this;
},

91
apps/documenteditor/main/app/view/Toolbar.js
View file

@ -127,6 +127,14 @@ define([
optsFold.timer = setTimeout(collapseToolbar, optsFold.timeout);
}
function onShowCoveredPanel(state) {
collapseToolbar();
if ( state )
optsFold.$bar.addClass('cover'); else
optsFold.$bar.removeClass('cover');
}
function setFolded(value) {
isFolded = value;
@ -1316,19 +1324,14 @@ define([
this.fireEvent('render:before', [this]);
var top = Common.localStorage.getItem("de-pgmargins-top"),
left = Common.localStorage.getItem("de-pgmargins-left"),
bottom = Common.localStorage.getItem("de-pgmargins-bottom"),
right = Common.localStorage.getItem("de-pgmargins-right");
// if (top!==null && left!==null && bottom!==null && right!==null) {
// var mnu = this.btnPageMargins.menu.items[0];
// mnu.options.value = mnu.value = [parseFloat(top), parseFloat(left), parseFloat(bottom), parseFloat(right)];
// mnu.setVisible(true);
// $(mnu.el).html(mnu.template({id: Common.UI.getId(), caption : mnu.caption, options : mnu.options}));
// } else
// this.btnPageMargins.menu.items[0].setVisible(false);
if ( mode.isEdit )
me.$el.html( me.rendererComponents(config.$dom) );
else {
config.$dom.find('[data-tab=home],[data-tab=ins],[data-tab=layout]').hide();
config.$dom.addClass('folded');
me.$el.html( me.rendererComponents(config.$dom) );
me.$el.html(config.$dom);
}
this.fireEvent('render:after', [this]);
@ -1361,18 +1364,25 @@ define([
$scrollR.on('click', onScrollTabs.bind(this, 'right'));
Common.NotificationCenter.on({
'window:resize': onResize,
'layout:changed': function (opts) {
if ( opts == 'menufile' ) {
me.setTab(lastPanel);
}
}
'window:resize': onResize
});
if ( me.isCompactView )
me.setFolded(true); else
me.setTab('home');
var top = Common.localStorage.getItem("de-pgmargins-top"),
left = Common.localStorage.getItem("de-pgmargins-left"),
bottom = Common.localStorage.getItem("de-pgmargins-bottom"),
right = Common.localStorage.getItem("de-pgmargins-right");
if ( top!==null && left!==null && bottom!==null && right!==null ) {
var mnu = this.btnPageMargins.menu.items[0];
mnu.options.value = mnu.value = [parseFloat(top), parseFloat(left), parseFloat(bottom), parseFloat(right)];
mnu.setVisible(true);
$(mnu.el).html(mnu.template({id: Common.UI.getId(), caption : mnu.caption, options : mnu.options}));
} else
this.btnPageMargins.menu.items[0].setVisible(false);
return this;
},
@ -1478,6 +1488,8 @@ define([
(new Promise( function(resolve, reject) {
resolve();
})).then(function () {
if ( !config.isEdit ) return;
me.btnsPageBreak.forEach( function(btn) {
btn.updateHint( me.tipPageBreak );
@ -2432,27 +2444,38 @@ define([
},
setTab: function (tab) {
$tabs.removeClass('active');
$panels.removeClass('active');
var panel = $panels.filter('[data-tab=' + tab + ']');
if ( panel.length ) {
lastPanel = tab;
panel.addClass('active');
if ( !tab || !tab.length ) {
if ( isFolded ) onShowCoveredPanel(false);
else tab = lastPanel;
}
var $tp = $tabs.find('> a[data-tab=' + tab + ']').parent();
if ( $tp.length ) {
$tp.addClass('active');
if ( tab ) {
$tabs.removeClass('active');
$panels.removeClass('active');
$marker.width($tp.width());
var panel = $panels.filter('[data-tab=' + tab + ']');
if (panel.length) {
lastPanel = tab;
panel.addClass('active');
}
if ($scrollL.is(':visible'))
$marker.css({left: $tp.position().left + $boxTabs.scrollLeft() - $scrollL.width()});
else $marker.css({left: $tp.position().left});
var $tp = $tabs.find('> a[data-tab=' + tab + ']').parent();
if ($tp.length) {
$tp.addClass('active');
$marker.width($tp.width());
if ($scrollL.is(':visible'))
$marker.css({left: $tp.position().left + $boxTabs.scrollLeft() - $scrollL.width()});
else $marker.css({left: $tp.position().left});
}
if ( isFolded ) {
if ( panel.length )
expandToolbar(); else
onShowCoveredPanel(true);
}
}
if ( isFolded ) expandToolbar();
},
addTab: function (tab, panel, after) {

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

@ -132,11 +132,8 @@ define([
applyEditorMode: function() {
var me = this,
toolbarView = DE.getController('Toolbar').getView('Toolbar'),
rightMenuView = DE.getController('RightMenu').getView('RightMenu'),
statusBarView = DE.getController('Statusbar').getView('Statusbar');
rightMenuView = DE.getController('RightMenu').getView('RightMenu');
me._toolbar = toolbarView.render(this.mode);
me._rightMenu = rightMenuView.render(this.mode);
var value = Common.localStorage.getItem('de-hidden-status');

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

@ -24,7 +24,7 @@
overflow: visible;
}
&:not(.expanded) {
&:not(.expanded):not(.cover){
.marker {
opacity: 0;
}