[PE] Add handler to zoom buttons in view tab

This commit is contained in:
JuliaSvinareva 2021-12-09 17:31:12 +03:00
parent cd1f2105f2
commit 66f0444bd0
2 changed files with 65 additions and 8 deletions

View file

@ -57,13 +57,17 @@ define([
initialize: function () {
},
onLaunch: function () {
this._state = {};
this._state = {
zoom_type: undefined,
zoom_percent: undefined
};
Common.NotificationCenter.on('app:ready', this.onAppReady.bind(this));
},
setApi: function (api) {
if (api) {
this.api = api;
this.api.asc_registerCallback('asc_onZoomChange', _.bind(this.onZoomChange, this));
}
return this;
},
@ -76,7 +80,9 @@ define([
});
this.addListeners({
'ViewTab': {
'zoom:value': _.bind(this.onChangeZoomValue, this),
'zoom:toslide': _.bind(this.onBtnZoomTo, this, 'toslide'),
'zoom:towidth': _.bind(this.onBtnZoomTo, this, 'towidth')
},
'Statusbar': {
@ -97,5 +103,43 @@ define([
this.SetDisabled(true);
},
onZoomChange: function (percent, type) {
if (this._state.zoom_type !== type) {
this.view.btnFitToSlide.toggle(type == 2, true);
this.view.btnFitToWidth.toggle(type == 1, true);
this._state.zoom_type = type;
}
if (this._state.zoom_percent !== percent) {
this.view.cmbZoom.setValue(percent, percent + '%');
this._state.zoom_percent = percent;
}
},
onAppReady: function (config) {
var me = this;
(new Promise(function (accept, reject) {
accept();
})).then(function(){
me.view.setEvents();
});
},
onChangeZoomValue: function (value) {
this._state.zoom_type = undefined;
this._state.zoom_percent = undefined;
this.api.zoom(value);
Common.NotificationCenter.trigger('edit:complete', this.view);
},
onBtnZoomTo: function (type, btn) {
this._state.zoom_type = undefined;
this._state.zoom_percent = undefined;
if (!btn.pressed)
this.api.zoomCustomMode();
else
this.api[type === 'toslide' ? 'zoomFitToPage' : 'zoomFitToWidth']();
Common.NotificationCenter.trigger('edit:complete', this.view);
}
}, PE.Controllers.ViewTab || {}));
});

View file

@ -46,13 +46,22 @@ define([
'use strict';
PE.Views.ViewTab = Common.UI.BaseView.extend(_.extend((function(){
function setEvents() {
var me = this;
}
return {
options: {},
setEvents: function () {
var me = this;
me.cmbZoom && me.cmbZoom.on('selected', function (combo, record) {
me.fireEvent('zoom:value', [record.value]);
});
me.btnFitToSlide && me.btnFitToSlide.on('click', function () {
me.fireEvent('zoom:toslide', [me.btnFitToSlide]);
});
me.btnFitToWidth && me.btnFitToWidth.on('click', function () {
me.fireEvent('zoom:towidth', [me.btnFitToWidth]);
});
},
initialize: function (options) {
Common.UI.BaseView.prototype.initialize.call(this);
this.toolbar = options.toolbar;
@ -92,17 +101,21 @@ define([
cls: 'btn-toolbar',
iconCls: 'toolbar__icon btn-ic-zoomtoslide',
caption: this.textFitToSlide,
toggleGroup: 'view-zoom',
enableToggle: true,
dataHint: '1',
dataHintDirection: 'left',
dataHintOffset: 'medium'
});
this.lockedControls.push(this.btnFitToPage);
this.lockedControls.push(this.btnFitToSlide);
this.btnFitToWidth = new Common.UI.Button({
parentEl: $host.find('#slot-btn-ftw'),
cls: 'btn-toolbar',
iconCls: 'toolbar__icon btn-ic-zoomtowidth',
caption: this.textFitToWidth,
toggleGroup: 'view-zoom',
enableToggle: true,
dataHint: '1',
dataHintDirection: 'left',
dataHintOffset: 'medium'