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

Merge branch 'feature/new-toolbar'

Browse source
This commit is contained in:
Maxim Kadushkin 2017-05-01 14:31:22 +03:00
parent 75100b9a37 dead0af353
commit e440e7d5af
4 changed files with 51 additions and 38 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
apps/spreadsheeteditor/main/app/controller/Main.js
View file

@ -1298,7 +1298,7 @@ define([
Common.Gateway.setDocumentModified(change); Common.Gateway.setDocumentModified(change);
if (this.toolbarView && this.toolbarView.btnSave && this.api) { if (this.toolbarView && this.toolbarView.btnSave && this.api) {
var isSyncButton = $('.btn-icon', this.toolbarView.btnSave.cmpEl).hasClass('btn-synch'), var isSyncButton = $('.icon', this.toolbarView.btnSave.cmpEl).hasClass('btn-synch'),
forcesave = this.appOptions.forcesave; forcesave = this.appOptions.forcesave;
var cansave = this.api.asc_isDocumentCanSave(); var cansave = this.api.asc_isDocumentCanSave();
if (this.toolbarView.btnSave.isDisabled() !== (!cansave && !isSyncButton && !forcesave || this._state.isDisconnected || this._state.fastCoauth && this._state.usersCount>1 && !forcesave)) if (this.toolbarView.btnSave.isDisabled() !== (!cansave && !isSyncButton && !forcesave || this._state.isDisconnected || this._state.fastCoauth && this._state.usersCount>1 && !forcesave))
@ -1308,7 +1308,7 @@ define([
onDocumentCanSaveChanged: function (isCanSave) { onDocumentCanSaveChanged: function (isCanSave) {
if (this.toolbarView && this.toolbarView.btnSave) { if (this.toolbarView && this.toolbarView.btnSave) {
var isSyncButton = $('.btn-icon', this.toolbarView.btnSave.cmpEl).hasClass('btn-synch'), var isSyncButton = $('.icon', this.toolbarView.btnSave.cmpEl).hasClass('btn-synch'),
forcesave = this.appOptions.forcesave; forcesave = this.appOptions.forcesave;
if (this.toolbarView.btnSave.isDisabled() !== (!isCanSave && !isSyncButton && !forcesave || this._state.isDisconnected || this._state.fastCoauth && this._state.usersCount>1 && !forcesave)) if (this.toolbarView.btnSave.isDisabled() !== (!isCanSave && !isSyncButton && !forcesave || this._state.isDisconnected || this._state.fastCoauth && this._state.usersCount>1 && !forcesave))
this.toolbarView.btnSave.setDisabled(!isCanSave && !isSyncButton && !forcesave || this._state.isDisconnected || this._state.fastCoauth && this._state.usersCount>1 && !forcesave); this.toolbarView.btnSave.setDisabled(!isCanSave && !isSyncButton && !forcesave || this._state.isDisconnected || this._state.fastCoauth && this._state.usersCount>1 && !forcesave);

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

@ -176,7 +176,7 @@ define([
Common.NotificationCenter.on('app:face', this.onAppShowed.bind(this)); Common.NotificationCenter.on('app:face', this.onAppShowed.bind(this));
}, },
onToolbarAfterRender: function(toolbar) { attachUIEvents: function(toolbar) {
var me = this; var me = this;
/** /**
@ -301,6 +301,7 @@ define([
if ( !config.isEditDiagram && !config.isEditMailMerge ) { if ( !config.isEditDiagram && !config.isEditMailMerge ) {
this.api.asc_registerCallback('asc_onSendThemeColors', _.bind(this.onSendThemeColors, this)); this.api.asc_registerCallback('asc_onSendThemeColors', _.bind(this.onSendThemeColors, this));
this.api.asc_registerCallback('asc_onMathTypes', _.bind(this.onMathTypes, this)); this.api.asc_registerCallback('asc_onMathTypes', _.bind(this.onMathTypes, this));
this.api.asc_registerCallback('asc_onContextMenu', _.bind(this.onContextMenu, this));
} }
this.api.asc_registerCallback('asc_onInitEditorStyles', _.bind(this.onApiInitEditorStyles, this)); this.api.asc_registerCallback('asc_onInitEditorStyles', _.bind(this.onApiInitEditorStyles, this));
@ -324,6 +325,10 @@ define([
// Common.component.Analytics.trackEvent('ToolBar', 'Open Document'); // Common.component.Analytics.trackEvent('ToolBar', 'Open Document');
// }, // },
onContextMenu: function() {
this.toolbar.collapseToolbar();
},
onPrint: function(e) { onPrint: function(e) {
Common.NotificationCenter.trigger('print', this.toolbar); Common.NotificationCenter.trigger('print', this.toolbar);
}, },
@ -331,7 +336,7 @@ define([
onSave: function(e) { onSave: function(e) {
if (this.api) { if (this.api) {
var isModified = this.api.asc_isDocumentCanSave(); var isModified = this.api.asc_isDocumentCanSave();
var isSyncButton = $('.btn-icon', this.toolbar.btnSave.cmpEl).hasClass('btn-synch'); var isSyncButton = $('.icon', this.toolbar.btnSave.cmpEl).hasClass('btn-synch');
if (!isModified && !isSyncButton && !this.toolbar.mode.forcesave) if (!isModified && !isSyncButton && !this.toolbar.mode.forcesave)
return; return;
@ -506,7 +511,7 @@ define([
bordersColor = btnBorders.options.borderscolor; bordersColor = btnBorders.options.borderscolor;
if (btnBorders.rendered) { if (btnBorders.rendered) {
var iconEl = $('.btn-icon', btnBorders.cmpEl); var iconEl = $('.icon', btnBorders.cmpEl);
if (iconEl) { if (iconEl) {
iconEl.removeClass(btnBorders.options.icls); iconEl.removeClass(btnBorders.options.icls);
@ -575,7 +580,7 @@ define([
onHorizontalAlignMenu: function(menu, item) { onHorizontalAlignMenu: function(menu, item) {
var btnHorizontalAlign = this.toolbar.btnHorizontalAlign, var btnHorizontalAlign = this.toolbar.btnHorizontalAlign,
iconEl = $('.btn-icon', btnHorizontalAlign.cmpEl); iconEl = $('.icon', btnHorizontalAlign.cmpEl);
if (iconEl) { if (iconEl) {
iconEl.removeClass(btnHorizontalAlign.options.icls); iconEl.removeClass(btnHorizontalAlign.options.icls);
@ -595,7 +600,7 @@ define([
onVerticalAlignMenu: function(menu, item) { onVerticalAlignMenu: function(menu, item) {
var btnVerticalAlign = this.toolbar.btnVerticalAlign, var btnVerticalAlign = this.toolbar.btnVerticalAlign,
iconEl = $('.btn-icon', btnVerticalAlign.cmpEl); iconEl = $('.icon', btnVerticalAlign.cmpEl);
if (iconEl) { if (iconEl) {
iconEl.removeClass(btnVerticalAlign.options.icls); iconEl.removeClass(btnVerticalAlign.options.icls);
@ -1331,7 +1336,7 @@ define([
var me = this; var me = this;
this.toolbar.createDelayedElements(); this.toolbar.createDelayedElements();
this.onToolbarAfterRender(this.toolbar); this.attachUIEvents(this.toolbar);
if ( !this.appConfig.isEditDiagram && !this.appConfig.isEditMailMerge ) { if ( !this.appConfig.isEditDiagram && !this.appConfig.isEditMailMerge ) {
this.api.asc_registerCallback('asc_onSheetsChanged', _.bind(this.onApiSheetChanged, this)); this.api.asc_registerCallback('asc_onSheetsChanged', _.bind(this.onApiSheetChanged, this));
@ -1891,7 +1896,7 @@ define([
var btnHorizontalAlign = this.toolbar.btnHorizontalAlign; var btnHorizontalAlign = this.toolbar.btnHorizontalAlign;
if (btnHorizontalAlign.rendered) { if (btnHorizontalAlign.rendered) {
var hIconEl = $('.btn-icon', btnHorizontalAlign.cmpEl); var hIconEl = $('.icon', btnHorizontalAlign.cmpEl);
if (hIconEl) { if (hIconEl) {
hIconEl.removeClass(btnHorizontalAlign.options.icls); hIconEl.removeClass(btnHorizontalAlign.options.icls);
@ -1925,7 +1930,7 @@ define([
var btnVerticalAlign = this.toolbar.btnVerticalAlign; var btnVerticalAlign = this.toolbar.btnVerticalAlign;
if (btnVerticalAlign.rendered) { if (btnVerticalAlign.rendered) {
var vIconEl = $('.btn-icon', btnVerticalAlign.cmpEl); var vIconEl = $('.icon', btnVerticalAlign.cmpEl);
if (vIconEl) { if (vIconEl) {
vIconEl.removeClass(btnVerticalAlign.options.icls); vIconEl.removeClass(btnVerticalAlign.options.icls);

12
apps/spreadsheeteditor/main/app/view/RightMenu.js
View file

@ -145,12 +145,12 @@ define([
el.html(this.template({})); el.html(this.template({}));
this.btnText.el = $('#id-right-menu-text'); this.btnText.render(); this.btnText.setElement($('#id-right-menu-text'), false); this.btnText.render();
this.btnImage.el = $('#id-right-menu-image'); this.btnImage.render(); this.btnImage.setElement($('#id-right-menu-image'), false); this.btnImage.render();
this.btnChart.el = $('#id-right-menu-chart'); this.btnChart.render(); this.btnChart.setElement($('#id-right-menu-chart'), false); this.btnChart.render();
this.btnShape.el = $('#id-right-menu-shape'); this.btnShape.render(); this.btnShape.setElement($('#id-right-menu-shape'), false); this.btnShape.render();
this.btnTextArt.el = $('#id-right-menu-textart'); this.btnTextArt.render(); this.btnTextArt.setElement($('#id-right-menu-textart'), false); this.btnTextArt.render();
this.btnTable.el = $('#id-right-menu-table'); this.btnTable.render(); this.btnTable.setElement($('#id-right-menu-table'), false); this.btnTable.render();
this.btnText.on('click', _.bind(this.onBtnMenuClick, this)); this.btnText.on('click', _.bind(this.onBtnMenuClick, this));
this.btnImage.on('click', _.bind(this.onBtnMenuClick, this)); this.btnImage.on('click', _.bind(this.onBtnMenuClick, this));

52
apps/spreadsheeteditor/main/app/view/Toolbar.js
View file

@ -421,14 +421,6 @@ define([
{ template: _.template('<a id="id-toolbar-menu-new-fontcolor" style="padding-left:12px;">' + me.textNewColor + '</a>') } { template: _.template('<a id="id-toolbar-menu-new-fontcolor" style="padding-left:12px;">' + me.textNewColor + '</a>') }
] ]
}) })
}).on('render:after', function(btn) {
var colorVal = $('<div class="btn-color-value-line"></div>');
$('button:first-child', btn.cmpEl).append(colorVal);
colorVal.css('background-color', btn.currentColor || 'transparent');
me.mnuTextColorPicker = new Common.UI.ThemeColorPalette({
el: $('#id-toolbar-menu-fontcolor')
});
}); });
me.mnuBackColorPicker = dummyCmp(); me.mnuBackColorPicker = dummyCmp();
@ -444,15 +436,6 @@ define([
{ template: _.template('<a id="id-toolbar-menu-new-paracolor" style="padding-left:12px;">' + me.textNewColor + '</a>') } { template: _.template('<a id="id-toolbar-menu-new-paracolor" style="padding-left:12px;">' + me.textNewColor + '</a>') }
] ]
}) })
}).on('render:after', function(btn) {
var colorVal = $('<div class="btn-color-value-line"></div>');
$('button:first-child', btn.cmpEl).append(colorVal);
colorVal.css('background-color', btn.currentColor || 'transparent');
me.mnuBackColorPicker = new Common.UI.ThemeColorPalette({
el: $('#id-toolbar-menu-paracolor'),
transparent: true
});
}); });
me.btnBorders = new Common.UI.Button({ me.btnBorders = new Common.UI.Button({
@ -1244,6 +1227,8 @@ define([
if (cmp && _.isFunction(cmp.setDisabled)) if (cmp && _.isFunction(cmp.setDisabled))
cmp.setDisabled(true); cmp.setDisabled(true);
}); });
this.on('render:after', _.bind(this.onToolbarAfterRender, this));
}, },
render: function (mode) { render: function (mode) {
@ -1478,9 +1463,9 @@ define([
'data-stopPropagation="true"', 'data-stopPropagation="true"',
'<% } %>', '>', '<% } %>', '>',
'<label class="title">' + this.textZoom + '</label>', '<label class="title">' + this.textZoom + '</label>',
'<button id="id-menu-zoom-in" type="button" style="float:right; margin: 2px 5px 0 0;" class="btn small btn-toolbar"><span class="btn-icon btn-zoomin">&nbsp;</span></button>', '<button id="id-menu-zoom-in" type="button" style="float:right; margin: 2px 5px 0 0;" class="btn small btn-toolbar"><span class="icon btn-zoomin">&nbsp;</span></button>',
'<label class="zoom"><%= options.value %>%</label>', '<label class="zoom"><%= options.value %>%</label>',
'<button id="id-menu-zoom-out" type="button" style="float:right; margin-top: 2px;" class="btn small btn-toolbar"><span class="btn-icon btn-zoomout">&nbsp;</span></button>', '<button id="id-menu-zoom-out" type="button" style="float:right; margin-top: 2px;" class="btn small btn-toolbar"><span class="icon btn-zoomout">&nbsp;</span></button>',
'</div>' '</div>'
].join('')), ].join('')),
stopPropagation: true, stopPropagation: true,
@ -1684,6 +1669,29 @@ define([
} }
}, },
onToolbarAfterRender: function(toolbar) {
// DataView and pickers
//
if (this.btnTextColor && this.btnTextColor.cmpEl) {
var colorVal = $('<div class="btn-color-value-line"></div>');
$('button:first-child', this.btnTextColor.cmpEl).append(colorVal);
colorVal.css('background-color', this.btnTextColor.currentColor || 'transparent');
this.mnuTextColorPicker = new Common.UI.ThemeColorPalette({
el: $('#id-toolbar-menu-fontcolor')
});
}
if (this.btnBackColor && this.btnBackColor.cmpEl) {
var colorVal = $('<div class="btn-color-value-line"></div>');
$('button:first-child', this.btnBackColor.cmpEl).append(colorVal);
colorVal.css('background-color', this.btnBackColor.currentColor || 'transparent');
this.mnuBackColorPicker = new Common.UI.ThemeColorPalette({
el: $('#id-toolbar-menu-paracolor'),
transparent: true
});
}
},
setApi: function(api) { setApi: function(api) {
this.api = api; this.api = api;
@ -1779,7 +1787,7 @@ define([
} }
this._state.hasCollaborativeChanges = true; this._state.hasCollaborativeChanges = true;
var iconEl = $('.btn-icon', this.btnSave.cmpEl); var iconEl = $('.icon', this.btnSave.cmpEl);
iconEl.removeClass(this.btnSaveCls); iconEl.removeClass(this.btnSaveCls);
iconEl.addClass('btn-synch'); iconEl.addClass('btn-synch');
@ -1815,7 +1823,7 @@ define([
synchronizeChanges: function() { synchronizeChanges: function() {
if (this.btnSave.rendered) { if (this.btnSave.rendered) {
var iconEl = $('.btn-icon', this.btnSave.cmpEl); var iconEl = $('.icon', this.btnSave.cmpEl);
if (iconEl.hasClass('btn-synch')) { if (iconEl.hasClass('btn-synch')) {
iconEl.removeClass('btn-synch'); iconEl.removeClass('btn-synch');
@ -1841,7 +1849,7 @@ define([
if (cls !== this.btnSaveCls && this.btnSave.rendered) { if (cls !== this.btnSaveCls && this.btnSave.rendered) {
this.btnSaveTip = ((length>1) ? this.tipSaveCoauth : this.tipSave )+ Common.Utils.String.platformKey('Ctrl+S'); this.btnSaveTip = ((length>1) ? this.tipSaveCoauth : this.tipSave )+ Common.Utils.String.platformKey('Ctrl+S');
var iconEl = $('.btn-icon', this.btnSave.cmpEl); var iconEl = $('.icon', this.btnSave.cmpEl);
if (!iconEl.hasClass('btn-synch')) { if (!iconEl.hasClass('btn-synch')) {
iconEl.removeClass(this.btnSaveCls); iconEl.removeClass(this.btnSaveCls);
iconEl.addClass(cls); iconEl.addClass(cls);