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

[SSE] Left menu refactoring

Browse source
This commit is contained in:
Julia Radzhabova 2019-08-27 17:26:14 +03:00
parent 36e83f7cb3
commit abe915fca3
5 changed files with 185 additions and 155 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

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

@ -240,7 +240,7 @@ define([
if ( !!this.api ) { if ( !!this.api ) {
this.panels['info'].setApi(this.api); this.panels['info'].setApi(this.api);
if ( this.panels['protect'] ) if ( this.panels['protect'] )
this.panels['protect'].setApi(api); this.panels['protect'].setApi(this.api);
} }
return this; return this;

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

@ -224,7 +224,7 @@ define([
if ( !!this.api ) { if ( !!this.api ) {
this.panels['info'].setApi(this.api); this.panels['info'].setApi(this.api);
if ( this.panels['protect'] ) if ( this.panels['protect'] )
this.panels['protect'].setApi(api); this.panels['protect'].setApi(this.api);
} }
return this; return this;
@ -297,7 +297,7 @@ define([
if ( this.mode.canCreateNew ) { if ( this.mode.canCreateNew ) {
if (this.mode.templates && this.mode.templates.length) { if (this.mode.templates && this.mode.templates.length) {
$('a',this.miNew.$el).text(this.btnCreateNewCaption + '...'); $('a',this.miNew.$el).text(this.btnCreateNewCaption + '...');
!this.panels['new'] && (this.panels['new'] = ((new PE.Views.FileMenuPanels.CreateNew({menu: this, docs: this.mode.templates})).render())); !this.panels['new'] && (this.panels['new'] = (new PE.Views.FileMenuPanels.CreateNew({menu: this, docs: this.mode.templates})).render());
} }
} }

114
apps/spreadsheeteditor/main/app/view/FileMenu.js
View file

@ -39,6 +39,7 @@ define([
SSE.Views.FileMenu = Common.UI.BaseView.extend(_.extend({ SSE.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),
@ -71,96 +72,99 @@ define([
}, },
render: function () { render: function () {
this.$el = $(this.el); var $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,
disabled: true disabled: true
}); });
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
}); });
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.miSettings = new Common.UI.MenuItem({ this.miSettings = 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 = 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
@ -169,7 +173,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
@ -185,7 +189,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
@ -194,21 +198,25 @@ define([
this.miSettings, this.miSettings,
this.miHelp, this.miHelp,
new Common.UI.MenuItem({ new Common.UI.MenuItem({
el : $('#fm-btn-back',this.el), el : $markup.elementById('#fm-btn-back'),
action : 'exit', action : 'exit',
caption : this.btnBackCaption, caption : this.btnBackCaption,
canFocused: false canFocused: false
}) })
); );
var me = this; this.rendered = true;
me.panels = { this.$el.html($markup);
'opts' : (new SSE.Views.FileMenuPanels.Settings({menu:me})).render(), this.$el.find('.content-box').hide();
'info' : (new SSE.Views.FileMenuPanels.DocumentInfo({menu:me})).render(), this.applyMode();
'rights' : (new SSE.Views.FileMenuPanels.DocumentRights({menu:me})).render()
};
me.$el.find('.content-box').hide(); if ( !!this.api ) {
this.panels['info'].setApi(this.api);
if ( this.panels['protect'] )
this.panels['protect'].setApi(this.api);
if (this.panels['opts'])
this.panels['opts'].setApi(this.api);
}
return this; return this;
}, },
@ -216,6 +224,9 @@ define([
show: function(panel) { show: function(panel) {
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;
@ -234,6 +245,16 @@ define([
}, },
applyMode: function() { applyMode: function() {
if (!this.panels) {
this.panels = {
'opts' : (new SSE.Views.FileMenuPanels.Settings({menu:this})).render(this.$el.find('#panel-settings')),
'info' : (new SSE.Views.FileMenuPanels.DocumentInfo({menu:this})).render(this.$el.find('#panel-info')),
'rights' : (new SSE.Views.FileMenuPanels.DocumentRights({menu:this})).render(this.$el.find('#panel-rights'))
};
}
if (!this.mode) return;
this.miDownload[(this.mode.canDownload && (!this.mode.isDesktopApp || !this.mode.isOffline))?'show':'hide'](); this.miDownload[(this.mode.canDownload && (!this.mode.isDesktopApp || !this.mode.isOffline))?'show':'hide']();
this.miSaveCopyAs[(this.mode.canDownload && (!this.mode.isDesktopApp || !this.mode.isOffline)) && (this.mode.canRequestSaveAs || this.mode.saveAsUrl) ?'show':'hide'](); this.miSaveCopyAs[(this.mode.canDownload && (!this.mode.isDesktopApp || !this.mode.isOffline)) && (this.mode.canRequestSaveAs || this.mode.saveAsUrl) ?'show':'hide']();
this.miSaveAs[(this.mode.canDownload && this.mode.isDesktopApp && this.mode.isOffline)?'show':'hide'](); this.miSaveAs[(this.mode.canDownload && this.mode.isDesktopApp && this.mode.isOffline)?'show':'hide']();
@ -252,9 +273,6 @@ define([
this.miAccess[(!this.mode.isOffline && this.document&&this.document.info&&(this.document.info.sharingSettings&&this.document.info.sharingSettings.length>0 || 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))?'show':'hide'](); this.mode.sharingSettingsUrl&&this.mode.sharingSettingsUrl.length))?'show':'hide']();
// this.miSettings[(this.mode.isEdit || this.mode.canViewComments)?'show':'hide']();
// this.miSettings.$el.prev()[(this.mode.isEdit || this.mode.canViewComments)?'show':'hide']();
this.mode.canBack ? this.$el.find('#fm-btn-back').show().prev().show() : this.mode.canBack ? this.$el.find('#fm-btn-back').show().prev().show() :
this.$el.find('#fm-btn-back').hide().prev().hide(); this.$el.find('#fm-btn-back').hide().prev().hide();
@ -270,30 +288,28 @@ define([
if ( this.mode.canCreateNew ) { if ( this.mode.canCreateNew ) {
if (this.mode.templates && this.mode.templates.length) { if (this.mode.templates && this.mode.templates.length) {
$('a',this.miNew.$el).text(this.btnCreateNewCaption + '...'); $('a',this.miNew.$el).text(this.btnCreateNewCaption + '...');
this.panels['new'] = ((new SSE.Views.FileMenuPanels.CreateNew({menu: this, docs: this.mode.templates})).render()); !this.panels['new'] && (this.panels['new'] = (new SSE.Views.FileMenuPanels.CreateNew({menu: this, docs: this.mode.templates})).render());
} }
} }
if ( this.mode.canOpenRecent ) { if ( this.mode.canOpenRecent && this.mode.recent) {
if (this.mode.recent){ !this.panels['recent'] && (this.panels['recent'] = (new SSE.Views.FileMenuPanels.RecentFiles({menu:this, recent: this.mode.recent})).render());
this.panels['recent'] = (new SSE.Views.FileMenuPanels.RecentFiles({menu:this, recent: this.mode.recent})).render();
}
} }
if (this.mode.canProtect) { if (this.mode.canProtect) {
this.panels['protect'] = (new SSE.Views.FileMenuPanels.ProtectDoc({menu:this})).render(); !this.panels['protect'] && (this.panels['protect'] = (new SSE.Views.FileMenuPanels.ProtectDoc({menu:this})).render());
this.panels['protect'].setMode(this.mode); this.panels['protect'].setMode(this.mode);
} }
if (this.mode.canDownload) { if (this.mode.canDownload) {
this.panels['saveas'] = ((new SSE.Views.FileMenuPanels.ViewSaveAs({menu: this})).render()); !this.panels['saveas'] && (this.panels['saveas'] = (new SSE.Views.FileMenuPanels.ViewSaveAs({menu: this})).render());
} }
if (this.mode.canDownload && (this.mode.canRequestSaveAs || this.mode.saveAsUrl)) { if (this.mode.canDownload && (this.mode.canRequestSaveAs || this.mode.saveAsUrl)) {
this.panels['save-copy'] = ((new SSE.Views.FileMenuPanels.ViewSaveCopy({menu: this})).render()); !this.panels['save-copy'] && (this.panels['save-copy'] = (new SSE.Views.FileMenuPanels.ViewSaveCopy({menu: this})).render());
} }
if (this.mode.canHelp) { if (this.mode.canHelp && !this.panels['help']) {
this.panels['help'] = ((new SSE.Views.FileMenuPanels.Help({menu: this})).render()); this.panels['help'] = ((new SSE.Views.FileMenuPanels.Help({menu: this})).render());
this.panels['help'].setLangConfig(this.mode.lang); this.panels['help'].setLangConfig(this.mode.lang);
} }
@ -311,14 +327,19 @@ define([
this.mode = mode; this.mode = mode;
} }
if (!delay) this.applyMode(); if (!delay) {
if ( this.rendered )
this.applyMode();
}
}, },
setApi: function(api) { setApi: function(api) {
this.api = api; this.api = api;
this.panels['info'].setApi(api); if ( this.rendered ) {
if (this.panels['opts']) this.panels['opts'].setApi(api); this.panels['info'].setApi(api);
if (this.panels['protect']) this.panels['protect'].setApi(api); if (this.panels['opts']) this.panels['opts'].setApi(api);
if (this.panels['protect']) this.panels['protect'].setApi(api);
}
this.api.asc_registerCallback('asc_onDocumentName', _.bind(this.onDocumentName, this)); this.api.asc_registerCallback('asc_onDocumentName', _.bind(this.onDocumentName, this));
}, },
@ -354,7 +375,8 @@ define([
onDocumentName: function(name) { onDocumentName: function(name) {
this.document.title = name; this.document.title = name;
this.panels['info'].updateInfo(this.document); if (this.rendered)
this.panels['info'].updateInfo(this.document);
}, },
isVisible: function () { isVisible: function () {
@ -362,8 +384,12 @@ define([
}, },
getButton: function(type) { getButton: function(type) {
if (type == 'save') if (type == 'save') {
return this.miSave; if (this.rendered)
return this.miSave;
else
return this.options.miSave ? this.options.miSave : (this.options.miSave = new Common.UI.MenuItem({}));
}
}, },
btnSaveCaption : 'Save', btnSaveCaption : 'Save',

192
apps/spreadsheeteditor/main/app/view/FileMenuPanels.js
View file

@ -78,12 +78,12 @@ define([
}, },
render: function() { render: function() {
$(this.el).html(this.template({rows:this.formats})); this.$el.html(this.template({rows:this.formats}));
$('.btn-doc-format',this.el).on('click', _.bind(this.onFormatClick,this)); $('.btn-doc-format',this.el).on('click', _.bind(this.onFormatClick,this));
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
}); });
} }
@ -139,12 +139,12 @@ define([
}, },
render: function() { render: function() {
$(this.el).html(this.template({rows:this.formats})); this.$el.html(this.template({rows:this.formats}));
$('.btn-doc-format',this.el).on('click', _.bind(this.onFormatClick,this)); $('.btn-doc-format',this.el).on('click', _.bind(this.onFormatClick,this));
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
}); });
} }
@ -181,19 +181,19 @@ define([
this.menu = options.menu; this.menu = options.menu;
}, },
render: function() { render: function(node) {
$(this.el).html(this.template()); var $markup = $(this.template({scope: this}));
this.generalSettings = new SSE.Views.FileMenuPanels.MainSettingsGeneral({menu: this.menu}); this.generalSettings = new SSE.Views.FileMenuPanels.MainSettingsGeneral({menu: this.menu});
this.generalSettings.options = {alias:'MainSettingsGeneral'}; this.generalSettings.options = {alias:'MainSettingsGeneral'};
this.generalSettings.render(); this.generalSettings.render($markup.findById('#panel-settings-general'));
this.printSettings = SSE.getController('Print').getView('MainSettingsPrint'); this.printSettings = SSE.getController('Print').getView('MainSettingsPrint');
this.printSettings.menu = this.menu; this.printSettings.menu = this.menu;
this.printSettings.render($('#panel-settings-print')); this.printSettings.render($markup.findById('#panel-settings-print'));
this.viewSettingsPicker = new Common.UI.DataView({ this.viewSettingsPicker = new Common.UI.DataView({
el: $('#id-settings-menu'), el: $markup.findById('#id-settings-menu'),
store: new Common.UI.DataViewStore([ store: new Common.UI.DataViewStore([
{name: this.txtGeneral, panel: this.generalSettings, iconCls:'mnu-settings-general', selected: true}, {name: this.txtGeneral, panel: this.generalSettings, iconCls:'mnu-settings-general', selected: true},
{name: this.txtPageSettings, panel: this.printSettings, iconCls:'mnu-print'} {name: this.txtPageSettings, panel: this.printSettings, iconCls:'mnu-print'}
@ -212,6 +212,7 @@ define([
panel.show(); panel.show();
}, this)); }, this));
this.$el = $(node).html($markup);
return this; return this;
}, },
@ -303,12 +304,10 @@ define([
}, },
render: function(parentEl) { render: function(parentEl) {
if (parentEl) var $markup = $(this.template({scope: this}));
this.setElement(parentEl, false);
$(this.el).html(this.template({scope: this}));
this.cmbSheet = new Common.UI.ComboBox({ this.cmbSheet = new Common.UI.ComboBox({
el : $('#advsettings-print-combo-sheets'), el : $markup.findById('#advsettings-print-combo-sheets'),
style : 'width: 242px;', style : 'width: 242px;',
menuStyle : 'min-width: 242px;max-height: 280px;', menuStyle : 'min-width: 242px;max-height: 280px;',
editable : false, editable : false,
@ -317,7 +316,7 @@ define([
}); });
this.cmbPaperSize = new Common.UI.ComboBox({ this.cmbPaperSize = new Common.UI.ComboBox({
el : $('#advsettings-print-combo-pages'), el : $markup.findById('#advsettings-print-combo-pages'),
style : 'width: 242px;', style : 'width: 242px;',
menuStyle : 'max-height: 280px; min-width: 242px;', menuStyle : 'max-height: 280px; min-width: 242px;',
editable : false, editable : false,
@ -340,7 +339,7 @@ define([
}); });
this.cmbPaperOrientation = new Common.UI.ComboBox({ this.cmbPaperOrientation = new Common.UI.ComboBox({
el : $('#advsettings-print-combo-orient'), el : $markup.findById('#advsettings-print-combo-orient'),
style : 'width: 132px;', style : 'width: 132px;',
menuStyle : 'min-width: 132px;', menuStyle : 'min-width: 132px;',
editable : false, editable : false,
@ -352,7 +351,7 @@ define([
}); });
this.cmbLayout = new Common.UI.ComboBox({ this.cmbLayout = new Common.UI.ComboBox({
el : $('#advsettings-print-combo-layout'), el : $markup.findById('#advsettings-print-combo-layout'),
style : 'width: 242px;', style : 'width: 242px;',
menuStyle : 'min-width: 242px;', menuStyle : 'min-width: 242px;',
editable : false, editable : false,
@ -366,17 +365,17 @@ define([
}); });
this.chPrintGrid = new Common.UI.CheckBox({ this.chPrintGrid = new Common.UI.CheckBox({
el: $('#advsettings-print-chb-grid'), el: $markup.findById('#advsettings-print-chb-grid'),
labelText: this.textPrintGrid labelText: this.textPrintGrid
}); });
this.chPrintRows = new Common.UI.CheckBox({ this.chPrintRows = new Common.UI.CheckBox({
el: $('#advsettings-print-chb-rows'), el: $markup.findById('#advsettings-print-chb-rows'),
labelText: this.textPrintHeadings labelText: this.textPrintHeadings
}); });
this.spnMarginTop = new Common.UI.MetricSpinner({ this.spnMarginTop = new Common.UI.MetricSpinner({
el: $('#advsettings-spin-margin-top'), el: $markup.findById('#advsettings-spin-margin-top'),
step: .1, step: .1,
width: 110, width: 110,
defaultUnit : "cm", defaultUnit : "cm",
@ -387,7 +386,7 @@ define([
this.spinners.push(this.spnMarginTop); this.spinners.push(this.spnMarginTop);
this.spnMarginBottom = new Common.UI.MetricSpinner({ this.spnMarginBottom = new Common.UI.MetricSpinner({
el: $('#advsettings-spin-margin-bottom'), el: $markup.findById('#advsettings-spin-margin-bottom'),
step: .1, step: .1,
width: 110, width: 110,
defaultUnit : "cm", defaultUnit : "cm",
@ -398,7 +397,7 @@ define([
this.spinners.push(this.spnMarginBottom); this.spinners.push(this.spnMarginBottom);
this.spnMarginLeft = new Common.UI.MetricSpinner({ this.spnMarginLeft = new Common.UI.MetricSpinner({
el: $('#advsettings-spin-margin-left'), el: $markup.findById('#advsettings-spin-margin-left'),
step: .1, step: .1,
width: 110, width: 110,
defaultUnit : "cm", defaultUnit : "cm",
@ -409,7 +408,7 @@ define([
this.spinners.push(this.spnMarginLeft); this.spinners.push(this.spnMarginLeft);
this.spnMarginRight = new Common.UI.MetricSpinner({ this.spnMarginRight = new Common.UI.MetricSpinner({
el: $('#advsettings-spin-margin-right'), el: $markup.findById('#advsettings-spin-margin-right'),
step: .1, step: .1,
width: 110, width: 110,
defaultUnit : "cm", defaultUnit : "cm",
@ -420,18 +419,21 @@ define([
this.spinners.push(this.spnMarginRight); this.spinners.push(this.spnMarginRight);
this.btnOk = new Common.UI.Button({ this.btnOk = new Common.UI.Button({
el: '#advsettings-print-button-save' el: $markup.findById('#advsettings-print-button-save')
}); });
// if (parentEl)
// this.setElement(parentEl, false);
this.$el = $(parentEl).html($markup);
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
}); });
} }
this.fireEvent('render:after', this); this.fireEvent('render:after', this);
return this; return this;
}, },
@ -563,29 +565,30 @@ define([
this.menu = options.menu; this.menu = options.menu;
}, },
render: function() { render: function(node) {
$(this.el).html(this.template({scope: this})); var me = this;
var $markup = $(this.template({scope: this}));
/** coauthoring begin **/ /** coauthoring begin **/
this.chLiveComment = new Common.UI.CheckBox({ this.chLiveComment = new Common.UI.CheckBox({
el: $('#fms-chb-live-comment'), el: $markup.findById('#fms-chb-live-comment'),
labelText: this.strLiveComment labelText: this.strLiveComment
}).on('change', _.bind(function(field, newValue, oldValue, eOpts){ }).on('change', function(field, newValue, oldValue, eOpts){
this.chResolvedComment.setDisabled(field.getValue()!=='checked'); me.chResolvedComment.setDisabled(field.getValue()!=='checked');
}, this)); });
this.chResolvedComment = new Common.UI.CheckBox({ this.chResolvedComment = new Common.UI.CheckBox({
el: $('#fms-chb-resolved-comment'), el: $markup.findById('#fms-chb-resolved-comment'),
labelText: this.strResolvedComment labelText: this.strResolvedComment
}); });
this.chR1C1Style = new Common.UI.CheckBox({ this.chR1C1Style = new Common.UI.CheckBox({
el: $('#fms-chb-r1c1-style'), el: $markup.findById('#fms-chb-r1c1-style'),
labelText: this.strR1C1 labelText: this.strR1C1
}); });
this.cmbCoAuthMode = new Common.UI.ComboBox({ this.cmbCoAuthMode = new Common.UI.ComboBox({
el : $('#fms-cmb-coauth-mode'), el : $markup.findById('#fms-cmb-coauth-mode'),
style : 'width: 160px;', style : 'width: 160px;',
editable : false, editable : false,
cls : 'input-group-nr', cls : 'input-group-nr',
@ -593,17 +596,17 @@ define([
{ value: 1, displayValue: this.strFast, descValue: this.strCoAuthModeDescFast}, { value: 1, displayValue: this.strFast, descValue: this.strCoAuthModeDescFast},
{ value: 0, displayValue: this.strStrict, descValue: this.strCoAuthModeDescStrict } { value: 0, displayValue: this.strStrict, descValue: this.strCoAuthModeDescStrict }
] ]
}).on('selected', _.bind(function(combo, record) { }).on('selected', function(combo, record) {
if (record.value == 1 && (this.chAutosave.getValue()!=='checked')) if (record.value == 1 && (me.chAutosave.getValue()!=='checked'))
this.chAutosave.setValue(1); me.chAutosave.setValue(1);
this.lblCoAuthMode.text(record.descValue); me.lblCoAuthMode.text(record.descValue);
}, this)); });
this.lblCoAuthMode = $('#fms-lbl-coauth-mode'); this.lblCoAuthMode = $markup.findById('#fms-lbl-coauth-mode');
/** coauthoring end **/ /** coauthoring end **/
this.cmbZoom = new Common.UI.ComboBox({ this.cmbZoom = new Common.UI.ComboBox({
el : $('#fms-cmb-zoom'), el : $markup.findById('#fms-cmb-zoom'),
style : 'width: 160px;', style : 'width: 160px;',
editable : false, editable : false,
cls : 'input-group-nr', cls : 'input-group-nr',
@ -624,7 +627,7 @@ define([
}); });
this.cmbFontRender = new Common.UI.ComboBox({ this.cmbFontRender = new Common.UI.ComboBox({
el : $('#fms-cmb-font-render'), el : $markup.findById('#fms-cmb-font-render'),
style : 'width: 160px;', style : 'width: 160px;',
editable : false, editable : false,
cls : 'input-group-nr', cls : 'input-group-nr',
@ -636,23 +639,23 @@ define([
}); });
this.chAutosave = new Common.UI.CheckBox({ this.chAutosave = new Common.UI.CheckBox({
el: $('#fms-chb-autosave'), el: $markup.findById('#fms-chb-autosave'),
labelText: this.strAutosave labelText: this.strAutosave
}).on('change', _.bind(function(field, newValue, oldValue, eOpts){ }).on('change', function(field, newValue, oldValue, eOpts){
if (field.getValue()!=='checked' && this.cmbCoAuthMode.getValue()) { if (field.getValue()!=='checked' && me.cmbCoAuthMode.getValue()) {
this.cmbCoAuthMode.setValue(0); me.cmbCoAuthMode.setValue(0);
this.lblCoAuthMode.text(this.strCoAuthModeDescStrict); me.lblCoAuthMode.text(me.strCoAuthModeDescStrict);
} }
}, this)); });
this.lblAutosave = $('#fms-lbl-autosave'); this.lblAutosave = $markup.findById('#fms-lbl-autosave');
this.chForcesave = new Common.UI.CheckBox({ this.chForcesave = new Common.UI.CheckBox({
el: $('#fms-chb-forcesave'), el: $markup.findById('#fms-chb-forcesave'),
labelText: this.strForcesave labelText: this.strForcesave
}); });
this.cmbUnit = new Common.UI.ComboBox({ this.cmbUnit = new Common.UI.ComboBox({
el : $('#fms-cmb-unit'), el : $markup.findById('#fms-cmb-unit'),
style : 'width: 160px;', style : 'width: 160px;',
editable : false, editable : false,
cls : 'input-group-nr', cls : 'input-group-nr',
@ -664,7 +667,7 @@ define([
}); });
this.cmbFuncLocale = new Common.UI.ComboBox({ this.cmbFuncLocale = new Common.UI.ComboBox({
el : $('#fms-cmb-func-locale'), el : $markup.findById('#fms-cmb-func-locale'),
style : 'width: 160px;', style : 'width: 160px;',
editable : false, editable : false,
cls : 'input-group-nr', cls : 'input-group-nr',
@ -677,9 +680,9 @@ define([
{ value: 'ru', displayValue: this.txtRu, exampleValue: this.txtExampleRu }, { value: 'ru', displayValue: this.txtRu, exampleValue: this.txtExampleRu },
{ value: 'pl', displayValue: this.txtPl, exampleValue: this.txtExamplePl } { value: 'pl', displayValue: this.txtPl, exampleValue: this.txtExamplePl }
] ]
}).on('selected', _.bind(function(combo, record) { }).on('selected', function(combo, record) {
this.updateFuncExample(record.exampleValue); me.updateFuncExample(record.exampleValue);
}, this)); });
var regdata = [{ value: 0x042C }, { value: 0x0402 }, { value: 0x0405 }, { value: 0x0407 }, {value: 0x0807}, { value: 0x0408 }, { value: 0x0C09 }, { value: 0x0809 }, { value: 0x0409 }, { value: 0x0C0A }, { value: 0x080A }, var regdata = [{ value: 0x042C }, { value: 0x0402 }, { value: 0x0405 }, { value: 0x0407 }, {value: 0x0807}, { value: 0x0408 }, { value: 0x0C09 }, { value: 0x0809 }, { value: 0x0409 }, { value: 0x0C0A }, { value: 0x080A },
{ value: 0x040B }, { value: 0x040C }, { value: 0x0410 }, { value: 0x0411 }, { value: 0x0412 }, { value: 0x0426 }, { value: 0x0413 }, { value: 0x0415 }, { value: 0x0416 }, { value: 0x040B }, { value: 0x040C }, { value: 0x0410 }, { value: 0x0411 }, { value: 0x0412 }, { value: 0x0426 }, { value: 0x0413 }, { value: 0x0415 }, { value: 0x0416 },
@ -691,7 +694,7 @@ define([
}); });
this.cmbRegSettings = new Common.UI.ComboBox({ this.cmbRegSettings = new Common.UI.ComboBox({
el : $('#fms-cmb-reg-settings'), el : $markup.findById('#fms-cmb-reg-settings'),
style : 'width: 160px;', style : 'width: 160px;',
menuStyle: 'max-height: 185px;', menuStyle: 'max-height: 185px;',
editable : false, editable : false,
@ -713,20 +716,22 @@ define([
'<% }); %>', '<% }); %>',
'</ul>', '</ul>',
'</span>'].join('')) '</span>'].join(''))
}).on('selected', _.bind(function(combo, record) { }).on('selected', function(combo, record) {
this.updateRegionalExample(record.value); me.updateRegionalExample(record.value);
}, this)); });
if (this.cmbRegSettings.scroller) this.cmbRegSettings.scroller.update({alwaysVisibleY: true}); if (this.cmbRegSettings.scroller) this.cmbRegSettings.scroller.update({alwaysVisibleY: true});
this.btnApply = new Common.UI.Button({ this.btnApply = new Common.UI.Button({
el: '#fms-btn-apply' el: $markup.findById('#fms-btn-apply')
}); });
this.btnApply.on('click', _.bind(this.applySettings, this)); this.btnApply.on('click', _.bind(this.applySettings, this));
this.$el = $(node).html($markup);
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
}); });
} }
@ -926,7 +931,7 @@ define([
}, },
render: function() { render: function() {
$(this.el).html(this.template()); this.$el.html(this.template());
this.viewRecentPicker = new Common.UI.DataView({ this.viewRecentPicker = new Common.UI.DataView({
el: $('#id-recent-view'), el: $('#id-recent-view'),
@ -944,7 +949,7 @@ define([
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
}); });
} }
@ -1006,14 +1011,14 @@ define([
}, },
render: function() { render: function() {
$(this.el).html(this.template({ this.$el.html(this.template({
scope: this, scope: this,
docs: this.options[0].docs docs: this.options[0].docs
})); }));
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
}); });
} }
@ -1111,15 +1116,14 @@ define([
this.authors = []; this.authors = [];
}, },
render: function() { render: function(node) {
$(this.el).html(this.template());
var me = this; var me = this;
var $markup = $(me.template());
// server info // server info
this.lblPlacement = $('#id-info-placement'); this.lblPlacement = $markup.findById('#id-info-placement');
this.lblOwner = $('#id-info-owner'); this.lblOwner = $markup.findById('#id-info-owner');
this.lblUploaded = $('#id-info-uploaded'); this.lblUploaded = $markup.findById('#id-info-uploaded');
// edited info // edited info
var keyDownBefore = function(input, e){ var keyDownBefore = function(input, e){
@ -1134,7 +1138,7 @@ define([
}; };
this.inputTitle = new Common.UI.InputField({ this.inputTitle = new Common.UI.InputField({
el : $('#id-info-title'), el : $markup.findById('#id-info-title'),
style : 'width: 200px;', style : 'width: 200px;',
placeHolder : this.txtAddText, placeHolder : this.txtAddText,
validateOnBlur: false validateOnBlur: false
@ -1145,7 +1149,7 @@ define([
} }
}).on('keydown:before', keyDownBefore); }).on('keydown:before', keyDownBefore);
this.inputSubject = new Common.UI.InputField({ this.inputSubject = new Common.UI.InputField({
el : $('#id-info-subject'), el : $markup.findById('#id-info-subject'),
style : 'width: 200px;', style : 'width: 200px;',
placeHolder : this.txtAddText, placeHolder : this.txtAddText,
validateOnBlur: false validateOnBlur: false
@ -1156,7 +1160,7 @@ define([
} }
}).on('keydown:before', keyDownBefore); }).on('keydown:before', keyDownBefore);
this.inputComment = new Common.UI.InputField({ this.inputComment = new Common.UI.InputField({
el : $('#id-info-comment'), el : $markup.findById('#id-info-comment'),
style : 'width: 200px;', style : 'width: 200px;',
placeHolder : this.txtAddText, placeHolder : this.txtAddText,
validateOnBlur: false validateOnBlur: false
@ -1168,18 +1172,18 @@ define([
}).on('keydown:before', keyDownBefore); }).on('keydown:before', keyDownBefore);
// modify info // modify info
this.lblModifyDate = $('#id-info-modify-date'); this.lblModifyDate = $markup.findById('#id-info-modify-date');
this.lblModifyBy = $('#id-info-modify-by'); this.lblModifyBy = $markup.findById('#id-info-modify-by');
// creation info // creation info
this.lblDate = $('#id-info-date'); this.lblDate = $markup.findById('#id-info-date');
this.lblApplication = $('#id-info-appname'); this.lblApplication = $markup.findById('#id-info-appname');
this.tblAuthor = $('#id-info-author table'); this.tblAuthor = $markup.findById('#id-info-author table');
this.trAuthor = $('#id-info-add-author').closest('tr'); this.trAuthor = $markup.findById('#id-info-add-author').closest('tr');
this.authorTpl = '<tr><td><div style="display: inline-block;width: 200px;"><input type="text" spellcheck="false" class="form-control" readonly="true" value="{0}" ></div><div class="close img-commonctrl"></div></td></tr>'; this.authorTpl = '<tr><td><div style="display: inline-block;width: 200px;"><input type="text" spellcheck="false" class="form-control" readonly="true" value="{0}" ></div><div class="close img-commonctrl"></div></td></tr>';
this.tblAuthor.on('click', function(e) { this.tblAuthor.on('click', function(e) {
var btn = $(e.target); var btn = $markup.find(e.target);
if (btn.hasClass('close') && !btn.hasClass('disabled')) { if (btn.hasClass('close') && !btn.hasClass('disabled')) {
var el = btn.closest('tr'), var el = btn.closest('tr'),
idx = me.tblAuthor.find('tr').index(el); idx = me.tblAuthor.find('tr').index(el);
@ -1193,7 +1197,7 @@ define([
}); });
this.inputAuthor = new Common.UI.InputField({ this.inputAuthor = new Common.UI.InputField({
el : $('#id-info-add-author'), el : $markup.findById('#id-info-add-author'),
style : 'width: 200px;', style : 'width: 200px;',
validateOnBlur: false, validateOnBlur: false,
placeHolder: this.txtAddAuthor placeHolder: this.txtAddAuthor
@ -1222,9 +1226,10 @@ define([
this.updateInfo(this.doc); this.updateInfo(this.doc);
this.$el = $(node).html($markup);
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
}); });
} }
@ -1415,12 +1420,12 @@ define([
this.menu = options.menu; this.menu = options.menu;
}, },
render: function() { render: function(node) {
$(this.el).html(this.template()); var $markup = $(this.template());
this.cntRights = $('#id-info-rights'); this.cntRights = $markup.findById('#id-info-rights');
this.btnEditRights = new Common.UI.Button({ this.btnEditRights = new Common.UI.Button({
el: '#id-info-btn-edit' el: $markup.findById('#id-info-btn-edit')
}); });
this.btnEditRights.on('click', _.bind(this.changeAccessRights, this)); this.btnEditRights.on('click', _.bind(this.changeAccessRights, this));
@ -1428,15 +1433,16 @@ define([
this.updateInfo(this.doc); this.updateInfo(this.doc);
this.$el = $(node).html($markup);
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
}); });
} }
Common.NotificationCenter.on('collaboration:sharing', _.bind(this.changeAccessRights, this)); Common.NotificationCenter.on('collaboration:sharing', this.changeAccessRights.bind(this));
Common.NotificationCenter.on('collaboration:sharingdeny', _.bind(this.onLostEditRights, this)); Common.NotificationCenter.on('collaboration:sharingdeny', this.onLostEditRights.bind(this));
return this; return this;
}, },
@ -1581,7 +1587,7 @@ define([
render: function() { render: function() {
var me = this; var me = this;
$(this.el).html(this.template()); this.$el.html(this.template());
this.viewHelpPicker = new Common.UI.DataView({ this.viewHelpPicker = new Common.UI.DataView({
el: $('#id-help-contents'), el: $('#id-help-contents'),
@ -1712,7 +1718,7 @@ define([
}, },
render: function() { render: function() {
$(this.el).html(this.template({scope: this})); this.$el.html(this.template({scope: this}));
var protection = SSE.getController('Common.Controllers.Protection').getView(); var protection = SSE.getController('Common.Controllers.Protection').getView();
@ -1739,7 +1745,7 @@ define([
this.cntSignatureView = $('#id-fms-signature-view'); this.cntSignatureView = $('#id-fms-signature-view');
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
}); });
} }

28
apps/spreadsheeteditor/main/app/view/LeftMenu.js
View file

@ -79,13 +79,11 @@ define([
}, },
render: function () { render: function () {
var el = $(this.el); var $markup = $(this.template({}));
el.html(this.template({
}));
this.btnSearch = new Common.UI.Button({ this.btnSearch = new Common.UI.Button({
action: 'search', action: 'search',
el: $('#left-btn-search', this.el), el: $markup.elementById('#left-btn-search'),
hint: this.tipSearch + Common.Utils.String.platformKey('Ctrl+F'), hint: this.tipSearch + Common.Utils.String.platformKey('Ctrl+F'),
disabled: true, disabled: true,
enableToggle: true enableToggle: true
@ -93,7 +91,7 @@ define([
this.btnAbout = new Common.UI.Button({ this.btnAbout = new Common.UI.Button({
action: 'about', action: 'about',
el: $('#left-btn-about', this.el), el: $markup.elementById('#left-btn-about'),
hint: this.tipAbout, hint: this.tipAbout,
enableToggle: true, enableToggle: true,
disabled: true, disabled: true,
@ -102,14 +100,14 @@ define([
this.btnSupport = new Common.UI.Button({ this.btnSupport = new Common.UI.Button({
action: 'support', action: 'support',
el: $('#left-btn-support', this.el), el: $markup.elementById('#left-btn-support'),
hint: this.tipSupport, hint: this.tipSupport,
disabled: true disabled: true
}); });
/** coauthoring begin **/ /** coauthoring begin **/
this.btnComments = new Common.UI.Button({ this.btnComments = new Common.UI.Button({
el: $('#left-btn-comments', this.el), el: $markup.elementById('#left-btn-comments'),
hint: this.tipComments + Common.Utils.String.platformKey('Ctrl+Shift+H'), hint: this.tipComments + Common.Utils.String.platformKey('Ctrl+Shift+H'),
enableToggle: true, enableToggle: true,
disabled: true, disabled: true,
@ -117,7 +115,7 @@ define([
}); });
this.btnChat = new Common.UI.Button({ this.btnChat = new Common.UI.Button({
el: $('#left-btn-chat', this.el), el: $markup.elementById('#left-btn-chat'),
hint: this.tipChat + Common.Utils.String.platformKey('Alt+Q'), hint: this.tipChat + Common.Utils.String.platformKey('Alt+Q'),
enableToggle: true, enableToggle: true,
disabled: true, disabled: true,
@ -127,13 +125,13 @@ define([
this.btnComments.hide(); this.btnComments.hide();
this.btnChat.hide(); this.btnChat.hide();
this.btnComments.on('click', _.bind(this.onBtnMenuClick, this)); this.btnComments.on('toggle', this.onBtnCommentsToggle.bind(this));
this.btnComments.on('toggle', _.bind(this.onBtnCommentsToggle, this)); this.btnComments.on('click', this.onBtnMenuClick.bind(this));
this.btnChat.on('click', _.bind(this.onBtnMenuClick, this)); this.btnChat.on('click', this.onBtnMenuClick.bind(this));
/** coauthoring end **/ /** coauthoring end **/
this.btnPlugins = new Common.UI.Button({ this.btnPlugins = new Common.UI.Button({
el: $('#left-btn-plugins'), el: $markup.elementById('#left-btn-plugins'),
hint: this.tipPlugins, hint: this.tipPlugins,
enableToggle: true, enableToggle: true,
disabled: true, disabled: true,
@ -143,7 +141,7 @@ define([
this.btnPlugins.on('click', _.bind(this.onBtnMenuClick, this)); this.btnPlugins.on('click', _.bind(this.onBtnMenuClick, this));
this.btnSpellcheck = new Common.UI.Button({ this.btnSpellcheck = new Common.UI.Button({
el: $('#left-btn-spellcheck'), el: $markup.elementById('#left-btn-spellcheck'),
hint: this.tipSpellcheck, hint: this.tipSpellcheck,
enableToggle: true, enableToggle: true,
disabled: true, disabled: true,
@ -156,8 +154,8 @@ define([
this.btnAbout.on('toggle', _.bind(this.onBtnMenuToggle, this)); this.btnAbout.on('toggle', _.bind(this.onBtnMenuToggle, this));
this.menuFile = new SSE.Views.FileMenu({}); this.menuFile = new SSE.Views.FileMenu({});
this.menuFile.render(); this.btnAbout.panel = (new Common.Views.About({el: '#about-menu-panel', appName: 'Spreadsheet Editor'}));
this.btnAbout.panel = (new Common.Views.About({el: $('#about-menu-panel'), appName: 'Spreadsheet Editor'})).render(); this.$el.html($markup);
return this; return this;
}, },