[PE][SSE] Use config.customization.layout

This commit is contained in:
Julia Radzhabova 2021-11-02 01:07:29 +03:00
parent 922f0bd3a2
commit b32e012b93
8 changed files with 185 additions and 99 deletions

View file

@ -1699,6 +1699,12 @@ define([
if (this.appOptions.canBrandingExt) {
Common.Utils.applyCustomization(this.appOptions.customization, mapCustomizationExtElements);
Common.UI.LayoutManager.applyCustomization();
if (this.appOptions.customization && (typeof (this.appOptions.customization) == 'object')) {
if (this.appOptions.customization.leftMenu!==undefined)
console.log("Obsolete: The 'leftMenu' parameter of the 'customization' section is deprecated. Please use 'leftMenu' parameter in the 'customization.layout' section instead.");
if (this.appOptions.customization.rightMenu!==undefined)
console.log("Obsolete: The 'rightMenu' parameter of the 'customization' section is deprecated. Please use 'rightMenu' parameter in the 'customization.layout' section instead.");
}
promise = this.getApplication().getController('Common.Controllers.Plugins').applyUICustomization();
}
}

View file

@ -1,6 +1,6 @@
<div class="panel-menu">
<li class="fm-first-item"></li>
<li id="fm-btn-return" class="fm-btn"></li>
<li id="fm-btn-return" class="fm-btn" data-layout-name="toolbar-file-close"></li>
<li class="devider"></li>
<li id="fm-btn-save" class="fm-btn"></li>
<li id="fm-btn-edit" class="fm-btn"></li>
@ -14,11 +14,11 @@
<li id="fm-btn-recent" class="fm-btn"></li>
<li id="fm-btn-create" class="fm-btn"></li>
<li class="devider"></li>
<li id="fm-btn-info" class="fm-btn"></li>
<li id="fm-btn-info" class="fm-btn" data-layout-name="toolbar-file-info"></li>
<li id="fm-btn-rights" class="fm-btn"></li>
<li id="fm-btn-history" class="fm-btn"></li>
<li class="devider" class="fm-btn"></li>
<li id="fm-btn-settings" class="fm-btn"></li>
<li id="fm-btn-settings" class="fm-btn" data-layout-name="toolbar-file-settings"></li>
<li class="devider"></li>
<li id="fm-btn-help" class="fm-btn"></li>
<li class="devider"></li>

View file

@ -8,10 +8,10 @@
<div id="toolbar" class="layout-item hint-section"></div>
<div class="layout-item middle">
<div id="viewport-hbox-layout" class="layout-ct hbox">
<div id="left-menu" class="layout-item hint-section" style="width: 40px;"></div>
<div id="left-menu" class="layout-item hint-section" data-layout-name="leftMenu" style="width: 40px;"></div>
<div id="about-menu-panel" class="left-menu-full-ct" style="display:none;"></div>
<div id="editor-container" class="layout-item"><div id="editor_sdk"></div></div>
<div id="right-menu" class="layout-item hint-section"></div>
<div id="right-menu" class="layout-item hint-section" data-layout-name="rightMenu"></div>
<div id="left-panel-history" class="layout-item"></div>
</div>
</div>

View file

@ -87,6 +87,16 @@ define([
render: function () {
var $markup = $(this.template());
this.miClose = new Common.UI.MenuItem({
el : $markup.elementById('#fm-btn-return'),
action : 'back',
caption : this.btnCloseMenuCaption,
canFocused: false,
dataHint: 1,
dataHintDirection: 'left-top',
dataHintOffset: [2, 14]
});
this.miSave = new Common.UI.MenuItem({
el : $markup.elementById('#fm-btn-save'),
action : 'save',
@ -200,6 +210,16 @@ define([
dataHintOffset: [2, 14]
});
this.miInfo = new Common.UI.MenuItem({
el : $markup.elementById('#fm-btn-info'),
action : 'info',
caption : this.btnInfoCaption,
canFocused: false,
dataHint: 1,
dataHintDirection: 'left-top',
dataHintOffset: [2, 14]
});
this.miAccess = new Common.UI.MenuItem({
el : $markup.elementById('#fm-btn-rights'),
action : 'rights',
@ -220,6 +240,16 @@ define([
dataHintOffset: [2, 14]
});
this.miSettings = new Common.UI.MenuItem({
el : $markup.elementById('#fm-btn-settings'),
action : 'opts',
caption : this.btnSettingsCaption,
canFocused: false,
dataHint: 1,
dataHintDirection: 'left-top',
dataHintOffset: [2, 14]
});
this.miHistory = new Common.UI.MenuItem({
el : $markup.elementById('#fm-btn-history'),
action : 'history',
@ -234,17 +264,19 @@ define([
delete this.options.miHistory;
}
this.miBack = new Common.UI.MenuItem({
el : $markup.elementById('#fm-btn-back'),
action : 'exit',
caption : this.btnBackCaption,
canFocused: false,
dataHint: 1,
dataHintDirection: 'left-top',
dataHintOffset: [2, 14]
});
this.items = [];
this.items.push(
new Common.UI.MenuItem({
el : $markup.elementById('#fm-btn-return'),
action : 'back',
caption : this.btnCloseMenuCaption,
canFocused: false,
dataHint: 1,
dataHintDirection: 'left-top',
dataHintOffset: [2, 14]
}),
this.miClose,
this.miSave,
this.miEdit,
this.miDownload,
@ -255,36 +287,12 @@ define([
this.miProtect,
this.miRecent,
this.miNew,
new Common.UI.MenuItem({
el : $markup.elementById('#fm-btn-info'),
action : 'info',
caption : this.btnInfoCaption,
canFocused: false,
dataHint: 1,
dataHintDirection: 'left-top',
dataHintOffset: [2, 14]
}),
this.miInfo,
this.miAccess,
this.miHistory,
new Common.UI.MenuItem({
el : $markup.elementById('#fm-btn-settings'),
action : 'opts',
caption : this.btnSettingsCaption,
canFocused: false,
dataHint: 1,
dataHintDirection: 'left-top',
dataHintOffset: [2, 14]
}),
this.miSettings,
this.miHelp,
new Common.UI.MenuItem({
el : $markup.elementById('#fm-btn-back'),
action : 'exit',
caption : this.btnBackCaption,
canFocused: false,
dataHint: 1,
dataHintDirection: 'left-top',
dataHintOffset: [2, 14]
})
this.miBack
);
this.rendered = true;
@ -350,6 +358,14 @@ define([
if (!this.mode) return;
var lastSeparator,
separatorVisible = false;
var isVisible = Common.UI.LayoutManager.isElementVisible('toolbar-file-close');
this.miClose[isVisible?'show':'hide']();
this.miClose.$el.find('+.devider')[isVisible?'show':'hide']();
isVisible && (lastSeparator = this.miClose.$el.find('+.devider'));
this.miDownload[(this.mode.canDownload && (!this.mode.isDesktopApp || !this.mode.isOffline))?'show':'hide']();
var isBCSupport = window["AscDesktopEditor"] ? window["AscDesktopEditor"]["isBlockchainSupport"]() : false;
this.miSaveCopyAs[(this.mode.canDownload && (!this.mode.isDesktopApp || !this.mode.isOffline)) && (this.mode.canRequestSaveAs || this.mode.saveAsUrl) && !isBCSupport ?'show':'hide']();
@ -359,26 +375,50 @@ define([
this.miPrint[this.mode.canPrint?'show':'hide']();
this.miRename[(this.mode.canRename && !this.mode.isDesktopApp) ?'show':'hide']();
this.miProtect[this.mode.canProtect ?'show':'hide']();
var isVisible = this.mode.canDownload || this.mode.isEdit || this.mode.canPrint || this.mode.canProtect ||
!this.mode.isEdit && this.mode.canEdit && this.mode.canRequestEditRights || this.mode.canRename && !this.mode.isDesktopApp;
this.miProtect.$el.find('+.devider')[isVisible && !this.mode.isDisconnected?'show':'hide']();
separatorVisible = (this.mode.canDownload || this.mode.isEdit || this.mode.canPrint || this.mode.canProtect ||
!this.mode.isEdit && this.mode.canEdit && this.mode.canRequestEditRights || this.mode.canRename && !this.mode.isDesktopApp) && !this.mode.isDisconnected;
this.miProtect.$el.find('+.devider')[separatorVisible?'show':'hide']();
separatorVisible && (lastSeparator = this.miProtect.$el.find('+.devider'));
this.miRecent[this.mode.canOpenRecent?'show':'hide']();
this.miNew[this.mode.canCreateNew?'show':'hide']();
this.miNew.$el.find('+.devider')[this.mode.canCreateNew?'show':'hide']();
separatorVisible = this.mode.canCreateNew;
this.miNew.$el.find('+.devider')[separatorVisible?'show':'hide']();
separatorVisible && (lastSeparator = this.miNew.$el.find('+.devider'));
this.miAccess[(!this.mode.isOffline && this.document&&this.document.info&&(this.document.info.sharingSettings&&this.document.info.sharingSettings.length>0 ||
(this.mode.sharingSettingsUrl&&this.mode.sharingSettingsUrl.length || this.mode.canRequestSharingSettings)))?'show':'hide']();
isVisible = Common.UI.LayoutManager.isElementVisible('toolbar-file-info');
separatorVisible = isVisible;
this.miInfo[isVisible?'show':'hide']();
isVisible = !this.mode.isOffline && this.document&&this.document.info &&
(this.document.info.sharingSettings&&this.document.info.sharingSettings.length>0 ||
(this.mode.sharingSettingsUrl&&this.mode.sharingSettingsUrl.length || this.mode.canRequestSharingSettings));
separatorVisible = separatorVisible || isVisible;
this.miAccess[isVisible?'show':'hide']();
isVisible = this.mode.canUseHistory&&!this.mode.isDisconnected;
separatorVisible = separatorVisible || isVisible;
this.miHistory[isVisible?'show':'hide']();
this.miHistory.$el.find('+.devider')[separatorVisible?'show':'hide']();
separatorVisible && (lastSeparator = this.miHistory.$el.find('+.devider'));
isVisible = Common.UI.LayoutManager.isElementVisible('toolbar-file-settings');
this.miSettings[isVisible?'show':'hide']();
this.miSettings.$el.find('+.devider')[isVisible?'show':'hide']();
isVisible && (lastSeparator = this.miSettings.$el.find('+.devider'));
isVisible = this.mode.canHelp;
this.miHelp[isVisible ?'show':'hide']();
this.miHelp.$el.find('+.devider')[isVisible?'show':'hide']();
isVisible && (lastSeparator = this.miHelp.$el.find('+.devider'));
isVisible = this.mode.canBack;
this.miBack[isVisible ?'show':'hide']();
lastSeparator && !isVisible && lastSeparator.hide();
this.mode.canBack ? this.$el.find('#fm-btn-back').show().prev().show() :
this.$el.find('#fm-btn-back').hide().prev().hide();
if (!this.customizationDone) {
this.customizationDone = true;
Common.Utils.applyCustomization(this.mode.customization, {goback: '#fm-btn-back > a'});
}
this.miHelp[this.mode.canHelp ?'show':'hide']();
this.miHelp.$el.prev()[this.mode.canHelp ?'show':'hide']();
this.panels['opts'].setMode(this.mode);
this.panels['info'].setMode(this.mode);
!this.mode.isDisconnected && this.panels['info'].updateInfo(this.document);
@ -413,8 +453,6 @@ define([
this.panels['help'] = ((new PE.Views.FileMenuPanels.Help({menu: this})).render());
this.panels['help'].setLangConfig(this.mode.lang);
}
this.miHistory[this.mode.canUseHistory&&!this.mode.isDisconnected?'show':'hide']();
},
setMode: function(mode, delay) {

View file

@ -2054,6 +2054,12 @@ define([
if (this.appOptions.canBrandingExt) {
Common.Utils.applyCustomization(this.appOptions.customization, mapCustomizationExtElements);
Common.UI.LayoutManager.applyCustomization();
if (this.appOptions.customization && (typeof (this.appOptions.customization) == 'object')) {
if (this.appOptions.customization.leftMenu!==undefined)
console.log("Obsolete: The 'leftMenu' parameter of the 'customization' section is deprecated. Please use 'leftMenu' parameter in the 'customization.layout' section instead.");
if (this.appOptions.customization.rightMenu!==undefined)
console.log("Obsolete: The 'rightMenu' parameter of the 'customization' section is deprecated. Please use 'rightMenu' parameter in the 'customization.layout' section instead.");
}
promise = this.getApplication().getController('Common.Controllers.Plugins').applyUICustomization();
}
}

View file

@ -1,6 +1,6 @@
<div class="panel-menu">
<li class="fm-first-item"></li>
<li id="fm-btn-return" class="fm-btn"></li>
<li id="fm-btn-return" class="fm-btn" data-layout-name="toolbar-file-close"></li>
<li class="devider"></li>
<li id="fm-btn-save" class="fm-btn"></li>
<li id="fm-btn-edit" class="fm-btn"></li>
@ -14,11 +14,11 @@
<li id="fm-btn-recent" class="fm-btn"></li>
<li id="fm-btn-create" class="fm-btn"></li>
<li class="devider"></li>
<li id="fm-btn-info" class="fm-btn"></li>
<li id="fm-btn-info" class="fm-btn" data-layout-name="toolbar-file-info"></li>
<li id="fm-btn-rights" class="fm-btn"></li>
<li id="fm-btn-history" class="fm-btn"></li>
<li class="devider" class="fm-btn"></li>
<li id="fm-btn-settings" class="fm-btn"></li>
<li id="fm-btn-settings" class="fm-btn" data-layout-name="toolbar-file-settings"></li>
<li class="devider"></li>
<li id="fm-btn-help" class="fm-btn"></li>
<li class="devider"></li>

View file

@ -7,7 +7,7 @@
<div id="toolbar" class="layout-item hint-section"></div>
<div class="layout-item">
<div id="viewport-hbox-layout" class="layout-ct hbox">
<div id="left-menu" class="layout-item hint-section" style="width: 40px;"></div>
<div id="left-menu" class="layout-item hint-section" data-layout-name="leftMenu" style="width: 40px;"></div>
<div id="about-menu-panel" class="left-menu-full-ct" style="display:none;"></div>
<div class="layout-item">
<div class="layout-ct vbox">
@ -15,7 +15,7 @@
<div id="editor_sdk" class="layout-item" style="min-height: 100px;"></div>
</div>
</div>
<div id="right-menu" class="layout-item hint-section"></div>
<div id="right-menu" class="layout-item hint-section" data-layout-name="rightMenu"></div>
<div id="left-panel-history" class="layout-item hint-section"></div>
</div>
</div>

View file

@ -74,6 +74,16 @@ define([
render: function () {
var $markup = $(this.template());
this.miClose = new Common.UI.MenuItem({
el : $markup.elementById('#fm-btn-return'),
action : 'back',
caption : this.btnCloseMenuCaption,
canFocused: false,
dataHint: 1,
dataHintDirection: 'left-top',
dataHintOffset: [2, 14]
});
this.miSave = new Common.UI.MenuItem({
el : $markup.elementById('#fm-btn-save'),
action : 'save',
@ -187,6 +197,16 @@ define([
dataHintOffset: [2, 14]
});
this.miInfo = new Common.UI.MenuItem({
el : $markup.elementById('#fm-btn-info'),
action : 'info',
caption : this.btnInfoCaption,
canFocused: false,
dataHint: 1,
dataHintDirection: 'left-top',
dataHintOffset: [2, 14]
});
this.miAccess = new Common.UI.MenuItem({
el : $markup.elementById('#fm-btn-rights'),
action : 'rights',
@ -227,17 +247,19 @@ define([
dataHintOffset: [2, 14]
});
this.miBack = new Common.UI.MenuItem({
el : $markup.elementById('#fm-btn-back'),
action : 'exit',
caption : this.btnBackCaption,
canFocused: false,
dataHint: 1,
dataHintDirection: 'left-top',
dataHintOffset: [2, 14]
});
this.items = [];
this.items.push(
new Common.UI.MenuItem({
el : $markup.elementById('#fm-btn-return'),
action : 'back',
caption : this.btnCloseMenuCaption,
canFocused: false,
dataHint: 1,
dataHintDirection: 'left-top',
dataHintOffset: [2, 14]
}),
this.miClose,
this.miSave,
this.miEdit,
this.miDownload,
@ -248,28 +270,12 @@ define([
this.miProtect,
this.miRecent,
this.miNew,
new Common.UI.MenuItem({
el : $markup.elementById('#fm-btn-info'),
action : 'info',
caption : this.btnInfoCaption,
canFocused: false,
dataHint: 1,
dataHintDirection: 'left-top',
dataHintOffset: [2, 14]
}),
this.miInfo,
this.miAccess,
this.miHistory,
this.miSettings,
this.miHelp,
new Common.UI.MenuItem({
el : $markup.elementById('#fm-btn-back'),
action : 'exit',
caption : this.btnBackCaption,
canFocused: false,
dataHint: 1,
dataHintDirection: 'left-top',
dataHintOffset: [2, 14]
})
this.miBack
);
this.rendered = true;
@ -336,6 +342,14 @@ define([
if (!this.mode) return;
var lastSeparator,
separatorVisible = false;
var isVisible = Common.UI.LayoutManager.isElementVisible('toolbar-file-close');
this.miClose[isVisible?'show':'hide']();
this.miClose.$el.find('+.devider')[isVisible?'show':'hide']();
isVisible && (lastSeparator = this.miClose.$el.find('+.devider'));
this.miDownload[(this.mode.canDownload && (!this.mode.isDesktopApp || !this.mode.isOffline))?'show':'hide']();
var isBCSupport = window["AscDesktopEditor"] ? window["AscDesktopEditor"]["isBlockchainSupport"]() : false;
this.miSaveCopyAs[(this.mode.canDownload && (!this.mode.isDesktopApp || !this.mode.isOffline)) && (this.mode.canRequestSaveAs || this.mode.saveAsUrl) && !isBCSupport ?'show':'hide']();
@ -345,26 +359,50 @@ define([
this.miPrint[this.mode.canPrint?'show':'hide']();
this.miRename[(this.mode.canRename && !this.mode.isDesktopApp) ?'show':'hide']();
this.miProtect[this.mode.canProtect ?'show':'hide']();
var isVisible = this.mode.canDownload || this.mode.isEdit || this.mode.canPrint || this.mode.canProtect ||
!this.mode.isEdit && this.mode.canEdit && this.mode.canRequestEditRights || this.mode.canRename && !this.mode.isDesktopApp;
this.miProtect.$el.find('+.devider')[isVisible && !this.mode.isDisconnected?'show':'hide']();
separatorVisible = (this.mode.canDownload || this.mode.isEdit || this.mode.canPrint || this.mode.canProtect ||
!this.mode.isEdit && this.mode.canEdit && this.mode.canRequestEditRights || this.mode.canRename && !this.mode.isDesktopApp) && !this.mode.isDisconnected;
this.miProtect.$el.find('+.devider')[separatorVisible?'show':'hide']();
separatorVisible && (lastSeparator = this.miProtect.$el.find('+.devider'));
this.miRecent[this.mode.canOpenRecent?'show':'hide']();
this.miNew[this.mode.canCreateNew?'show':'hide']();
this.miNew.$el.find('+.devider')[this.mode.canCreateNew?'show':'hide']();
separatorVisible = this.mode.canCreateNew;
this.miNew.$el.find('+.devider')[separatorVisible?'show':'hide']();
separatorVisible && (lastSeparator = this.miNew.$el.find('+.devider'));
this.miAccess[(!this.mode.isOffline && this.document&&this.document.info&&(this.document.info.sharingSettings&&this.document.info.sharingSettings.length>0 ||
(this.mode.sharingSettingsUrl&&this.mode.sharingSettingsUrl.length || this.mode.canRequestSharingSettings)))?'show':'hide']();
isVisible = Common.UI.LayoutManager.isElementVisible('toolbar-file-info');
separatorVisible = isVisible;
this.miInfo[isVisible?'show':'hide']();
isVisible = !this.mode.isOffline && this.document&&this.document.info &&
(this.document.info.sharingSettings&&this.document.info.sharingSettings.length>0 ||
(this.mode.sharingSettingsUrl&&this.mode.sharingSettingsUrl.length || this.mode.canRequestSharingSettings));
separatorVisible = separatorVisible || isVisible;
this.miAccess[isVisible?'show':'hide']();
isVisible = this.mode.canUseHistory&&!this.mode.isDisconnected;
separatorVisible = separatorVisible || isVisible;
this.miHistory[isVisible?'show':'hide']();
this.miHistory.$el.find('+.devider')[separatorVisible?'show':'hide']();
separatorVisible && (lastSeparator = this.miHistory.$el.find('+.devider'));
isVisible = Common.UI.LayoutManager.isElementVisible('toolbar-file-settings');
this.miSettings[isVisible?'show':'hide']();
this.miSettings.$el.find('+.devider')[isVisible?'show':'hide']();
isVisible && (lastSeparator = this.miSettings.$el.find('+.devider'));
isVisible = this.mode.canHelp;
this.miHelp[isVisible ?'show':'hide']();
this.miHelp.$el.find('+.devider')[isVisible?'show':'hide']();
isVisible && (lastSeparator = this.miHelp.$el.find('+.devider'));
isVisible = this.mode.canBack;
this.miBack[isVisible ?'show':'hide']();
lastSeparator && !isVisible && lastSeparator.hide();
this.mode.canBack ? this.$el.find('#fm-btn-back').show().prev().show() :
this.$el.find('#fm-btn-back').hide().prev().hide();
if (!this.customizationDone) {
this.customizationDone = true;
Common.Utils.applyCustomization(this.mode.customization, {goback: '#fm-btn-back > a'});
}
this.miHelp[this.mode.canHelp ?'show':'hide']();
this.miHelp.$el.prev()[this.mode.canHelp ?'show':'hide']();
this.panels['opts'].setMode(this.mode);
this.panels['info'].setMode(this.mode);
!this.mode.isDisconnected && this.panels['info'].updateInfo(this.document);
@ -400,8 +438,6 @@ define([
this.panels['help'].setLangConfig(this.mode.lang);
}
this.miHistory[this.mode.canUseHistory&&!this.mode.isDisconnected?'show':'hide']();
if ( this.mode.disableEditing != undefined ) {
this.panels['opts'].SetDisabled(this.mode.disableEditing);
delete this.mode.disableEditing;