[DE] 'left' menu + 'file' menu + about refactoring

This commit is contained in:
Maxim Kadushkin 2019-07-29 17:00:21 +03:00
parent 56201f99c5
commit ae617b0736
3 changed files with 141 additions and 79 deletions

View file

@ -45,6 +45,7 @@ define([
Common.Views.About = Common.UI.BaseView.extend(_.extend({ Common.Views.About = Common.UI.BaseView.extend(_.extend({
menu: undefined, menu: undefined,
rendered: false,
options: { options: {
alias: 'Common.Views.About' alias: 'Common.Views.About'
}, },
@ -152,8 +153,10 @@ define([
}, },
render: function() { render: function() {
var el = $(this.el); if ( !this.rendered ) {
el.html(this.template({ this.rendered = true;
var _$l = $(this.template({
publishername: '{{PUBLISHER_NAME}}', publishername: '{{PUBLISHER_NAME}}',
publisheraddr: '{{PUBLISHER_ADDRESS}}', publisheraddr: '{{PUBLISHER_ADDRESS}}',
publisherurl: '{{PUBLISHER_URL}}', publisherurl: '{{PUBLISHER_URL}}',
@ -162,27 +165,36 @@ define([
scope: this scope: this
})); }));
el.addClass('about-dlg'); this.cntLicenseeInfo = _$l.findById('#id-about-licensee-info');
this.cntLicenseeInfo = $('#id-about-licensee-info'); this.cntLicensorInfo = _$l.findById('#id-about-licensor-info');
this.cntLicensorInfo = $('#id-about-licensor-info'); this.divCompanyLogo = _$l.findById('#id-about-company-logo');
this.divCompanyLogo = $('#id-about-company-logo'); this.lblCompanyName = _$l.findById('#id-about-company-name');
this.lblCompanyName = $('#id-about-company-name'); this.lblCompanyAddress = _$l.findById('#id-about-company-address');
this.lblCompanyAddress = $('#id-about-company-address'); this.lblCompanyMail = _$l.findById('#id-about-company-mail');
this.lblCompanyMail = $('#id-about-company-mail'); this.lblCompanyUrl = _$l.findById('#id-about-company-url');
this.lblCompanyUrl = $('#id-about-company-url'); this.lblCompanyLic = _$l.findById('#id-about-company-lic');
this.lblCompanyLic = $('#id-about-company-lic');
if ( this.licData )
this.setLicInfo(this.licData);
this.$el.html(_$l);
this.$el.addClass('about-dlg');
if (_.isUndefined(this.scroller)) { if (_.isUndefined(this.scroller)) {
this.scroller = new Common.UI.Scroller({ this.scroller = new Common.UI.Scroller({
el: $(this.el), el: this.$el,
suppressScrollX: true suppressScrollX: true
}); });
} }
}
return this; return this;
}, },
setLicInfo: function(data){ setLicInfo: function(data){
if ( !this.rendered ) {
this.licData = data || true;
} else {
if (data && typeof data == 'object' && typeof(data.customer)=='object') { if (data && typeof data == 'object' && typeof(data.customer)=='object') {
var customer = data.customer; var customer = data.customer;
@ -224,9 +236,12 @@ define([
this.cntLicenseeInfo.addClass('hidden'); this.cntLicenseeInfo.addClass('hidden');
this.cntLicensorInfo.addClass('margin-bottom'); this.cntLicensorInfo.addClass('margin-bottom');
} }
}
}, },
show: function () { show: function () {
if ( !this.rendered ) this.render();
Common.UI.BaseView.prototype.show.call(this,arguments); Common.UI.BaseView.prototype.show.call(this,arguments);
this.fireEvent('show', this ); this.fireEvent('show', this );
}, },

View file

@ -49,6 +49,7 @@ define([
DE.Views.FileMenu = Common.UI.BaseView.extend(_.extend({ DE.Views.FileMenu = Common.UI.BaseView.extend(_.extend({
el: '#file-menu-panel', el: '#file-menu-panel',
rendered: false,
options: {alias:'FileMenu'}, options: {alias:'FileMenu'},
template: _.template(tpl), template: _.template(tpl),
@ -81,95 +82,104 @@ define([
}, },
render: function () { render: function () {
this.$el = $(this.el); let $markup = $(this.template());
this.$el.html(this.template());
this.miSave = new Common.UI.MenuItem({ this.miSave = new Common.UI.MenuItem({
el : $('#fm-btn-save',this.el), el : $markup.elementById('#fm-btn-save'),
action : 'save', action : 'save',
caption : this.btnSaveCaption, caption : this.btnSaveCaption,
canFocused: false canFocused: false
}); });
if ( !!this.options.miSave ) {
this.miSave.setDisabled(this.options.miSave.isDisabled());
delete this.options.miSave;
}
this.miEdit = new Common.UI.MenuItem({ this.miEdit = new Common.UI.MenuItem({
el : $('#fm-btn-edit',this.el), el : $markup.elementById('#fm-btn-edit'),
action : 'edit', action : 'edit',
caption : this.btnToEditCaption, caption : this.btnToEditCaption,
canFocused: false canFocused: false
}); });
this.miDownload = new Common.UI.MenuItem({ this.miDownload = new Common.UI.MenuItem({
el : $('#fm-btn-download',this.el), el : $markup.elementById('#fm-btn-download'),
action : 'saveas', action : 'saveas',
caption : this.btnDownloadCaption, caption : this.btnDownloadCaption,
canFocused: false canFocused: false
}); });
this.miSaveCopyAs = new Common.UI.MenuItem({ this.miSaveCopyAs = new Common.UI.MenuItem({
el : $('#fm-btn-save-copy',this.el), el : $markup.elementById('#fm-btn-save-copy'),
action : 'save-copy', action : 'save-copy',
caption : this.btnSaveCopyAsCaption, caption : this.btnSaveCopyAsCaption,
canFocused: false canFocused: false
}); });
this.miSaveAs = new Common.UI.MenuItem({ this.miSaveAs = new Common.UI.MenuItem({
el : $('#fm-btn-save-desktop',this.el), el : $markup.elementById('#fm-btn-save-desktop'),
action : 'save-desktop', action : 'save-desktop',
caption : this.btnSaveAsCaption, caption : this.btnSaveAsCaption,
canFocused: false canFocused: false
}); });
this.miPrint = new Common.UI.MenuItem({ this.miPrint = new Common.UI.MenuItem({
el : $('#fm-btn-print',this.el), el : $markup.elementById('#fm-btn-print'),
action : 'print', action : 'print',
caption : this.btnPrintCaption, caption : this.btnPrintCaption,
canFocused: false canFocused: false
}); });
this.miRename = new Common.UI.MenuItem({ this.miRename = new Common.UI.MenuItem({
el : $('#fm-btn-rename',this.el), el : $markup.elementById('#fm-btn-rename'),
action : 'rename', action : 'rename',
caption : this.btnRenameCaption, caption : this.btnRenameCaption,
canFocused: false canFocused: false
}); });
if ( !!this.options.miRename ) {
this.miRename.setDisabled(this.options.miRename.isDisabled());
delete this.options.miRename;
}
this.miProtect = new Common.UI.MenuItem({ this.miProtect = new Common.UI.MenuItem({
el : $('#fm-btn-protect',this.el), el : $markup.elementById('#fm-btn-protect'),
action : 'protect', action : 'protect',
caption : this.btnProtectCaption, caption : this.btnProtectCaption,
canFocused: false canFocused: false
}); });
this.miRecent = new Common.UI.MenuItem({ this.miRecent = new Common.UI.MenuItem({
el : $('#fm-btn-recent',this.el), el : $markup.elementById('#fm-btn-recent'),
action : 'recent', action : 'recent',
caption : this.btnRecentFilesCaption, caption : this.btnRecentFilesCaption,
canFocused: false canFocused: false
}); });
this.miNew = new Common.UI.MenuItem({ this.miNew = new Common.UI.MenuItem({
el : $('#fm-btn-create',this.el), el : $markup.elementById('#fm-btn-create'),
action : 'new', action : 'new',
caption : this.btnCreateNewCaption, caption : this.btnCreateNewCaption,
canFocused: false canFocused: false
}); });
this.miAccess = new Common.UI.MenuItem({ this.miAccess = new Common.UI.MenuItem({
el : $('#fm-btn-rights',this.el), el : $markup.elementById('#fm-btn-rights'),
action : 'rights', action : 'rights',
caption : this.btnRightsCaption, caption : this.btnRightsCaption,
canFocused: false canFocused: false
}); });
this.miHistory = new Common.UI.MenuItem({ this.miHistory = new Common.UI.MenuItem({
el : $('#fm-btn-history',this.el), el : $markup.elementById('#fm-btn-history'),
action : 'history', action : 'history',
caption : this.btnHistoryCaption, caption : this.btnHistoryCaption,
canFocused: false canFocused: false
}); });
this.miHelp = new Common.UI.MenuItem({ this.miHelp = new Common.UI.MenuItem({
el : $('#fm-btn-help',this.el), el : $markup.elementById('#fm-btn-help'),
action : 'help', action : 'help',
caption : this.btnHelpCaption, caption : this.btnHelpCaption,
canFocused: false canFocused: false
@ -178,7 +188,7 @@ define([
this.items = []; this.items = [];
this.items.push( this.items.push(
new Common.UI.MenuItem({ new Common.UI.MenuItem({
el : $('#fm-btn-return',this.el), el : $markup.elementById('#fm-btn-return'),
action : 'back', action : 'back',
caption : this.btnCloseMenuCaption, caption : this.btnCloseMenuCaption,
canFocused: false canFocused: false
@ -194,7 +204,7 @@ define([
this.miRecent, this.miRecent,
this.miNew, this.miNew,
new Common.UI.MenuItem({ new Common.UI.MenuItem({
el : $('#fm-btn-info',this.el), el : $markup.elementById('#fm-btn-info'),
action : 'info', action : 'info',
caption : this.btnInfoCaption, caption : this.btnInfoCaption,
canFocused: false canFocused: false
@ -202,14 +212,15 @@ define([
this.miAccess, this.miAccess,
this.miHistory, this.miHistory,
new Common.UI.MenuItem({ new Common.UI.MenuItem({
el : $('#fm-btn-settings',this.el), el : $markup.elementById('#fm-btn-settings'),
action : 'opts', action : 'opts',
caption : this.btnSettingsCaption, caption : this.btnSettingsCaption,
canFocused: false canFocused: false
}), }),
this.miHelp, this.miHelp,
new Common.UI.MenuItem({ new Common.UI.MenuItem({
el : $('#fm-btn-back',this.el), el : $markup.elementById('#fm-btn-back'),
// el : _get_el('fm-btn-back'),
action : 'exit', action : 'exit',
caption : this.btnBackCaption, caption : this.btnBackCaption,
canFocused: false canFocused: false
@ -219,19 +230,34 @@ define([
var me = this; var me = this;
me.panels = { me.panels = {
// 'saveas' : (new DE.Views.FileMenuPanels.ViewSaveAs({menu:me})).render(), // 'saveas' : (new DE.Views.FileMenuPanels.ViewSaveAs({menu:me})).render(),
'opts' : (new DE.Views.FileMenuPanels.Settings({menu:me})).render(), 'opts' : (new DE.Views.FileMenuPanels.Settings({menu:me})).render($markup.find('#panel-settings')),
'info' : (new DE.Views.FileMenuPanels.DocumentInfo({menu:me})).render(), 'info' : (new DE.Views.FileMenuPanels.DocumentInfo({menu:me})).render($markup.find('#panel-info')),
'rights' : (new DE.Views.FileMenuPanels.DocumentRights({menu:me})).render() 'rights' : (new DE.Views.FileMenuPanels.DocumentRights({menu:me})).render($markup.find('#panel-rights'))
}; };
me.rendered = true;
me.$el.html($markup);
me.$el.find('.content-box').hide(); me.$el.find('.content-box').hide();
if ( !!me.mode ) {
me.applyMode();
}
if ( !!me.api ) {
me.panels['info'].setApi(me.api);
if ( me.panels['protect'] )
me.panels['protect'].setApi(api);
}
return this; return this;
}, },
show: function(panel, opts) { show: function(panel, opts) {
if (this.isVisible() && panel===undefined || !this.mode) return; if (this.isVisible() && panel===undefined || !this.mode) return;
if ( !this.rendered )
this.render();
var defPanel = (this.mode.canDownload && (!this.mode.isDesktopApp || !this.mode.isOffline)) ? 'saveas' : 'info'; var defPanel = (this.mode.canDownload && (!this.mode.isDesktopApp || !this.mode.isOffline)) ? 'saveas' : 'info';
if (!panel) if (!panel)
panel = this.active || defPanel; panel = this.active || defPanel;
@ -330,13 +356,22 @@ define([
this.mode = mode; this.mode = mode;
} }
if (!delay) this.applyMode(); if (!delay) {
if ( this.rendered )
this.applyMode();
}
return this;
}, },
setApi: function(api) { setApi: function(api) {
this.api = api; this.api = api;
if ( this.rendered ) {
this.panels['info'].setApi(api); this.panels['info'].setApi(api);
if (this.panels['protect']) this.panels['protect'].setApi(api); if (this.panels['protect']) this.panels['protect'].setApi(api);
}
return this;
}, },
loadDocument: function(data) { loadDocument: function(data) {
@ -370,8 +405,11 @@ define([
}, },
SetDisabled: function(disable) { SetDisabled: function(disable) {
this.miSave[(disable || !this.mode.isEdit)?'hide':'show'](); var _btn_save = this.getButton('save'),
this.miRename[(disable || !this.mode.canRename || this.mode.isDesktopApp) ?'hide':'show'](); _btn_rename = this.getButton('rename');
_btn_save[(disable || !this.mode.isEdit)?'hide':'show']();
_btn_rename[(disable || !this.mode.canRename || this.mode.isDesktopApp) ?'hide':'show']();
}, },
isVisible: function () { isVisible: function () {
@ -379,8 +417,18 @@ define([
}, },
getButton: function(type) { getButton: function(type) {
if (type == 'save') if ( !this.rendered ) {
if (type == 'save') {
return this.options.miSave ? this.options.miSave : (this.options.miSave = new Common.UI.MenuItem({}));
} else
if (type == 'rename') {
return this.options.miRename ? this.options.miRename : (this.options.miRename = new Common.UI.MenuItem({}));
}
} else {
if (type == 'save') {
return this.miSave; return this.miSave;
}
}
}, },
btnSaveCaption : 'Save', btnSaveCaption : 'Save',

View file

@ -163,11 +163,10 @@ define([
this.btnSearch.on('click', this.onBtnMenuClick.bind(this)); this.btnSearch.on('click', this.onBtnMenuClick.bind(this));
this.btnAbout.on('toggle', this.onBtnMenuToggle.bind(this)); this.btnAbout.on('toggle', this.onBtnMenuToggle.bind(this));
this.$el.html($markup);
this.menuFile = new DE.Views.FileMenu(); this.menuFile = new DE.Views.FileMenu();
this.menuFile.render(); this.btnAbout.panel = new Common.Views.About({el: '#about-menu-panel', appName: 'Document Editor'});
this.btnAbout.panel = (new Common.Views.About({el: $('#about-menu-panel'), appName: 'Document Editor'})).render();
this.$el.html($markup);
return this; return this;
}, },