diff --git a/apps/pdfeditor/main/app/controller/DocumentHolder.js b/apps/pdfeditor/main/app/controller/DocumentHolder.js index cd95a93638..d19c44fb9f 100644 --- a/apps/pdfeditor/main/app/controller/DocumentHolder.js +++ b/apps/pdfeditor/main/app/controller/DocumentHolder.js @@ -333,8 +333,11 @@ define([ }, applyEditorMode: function() { - if (this.mode && this.mode.isPDFEdit && !this.documentHolder.editPDFModeMenu) + if (this.mode && this.mode.isPDFEdit && !this.documentHolder.editPDFModeMenu) { this.documentHolder.createDelayedElementsPDFEditor(); + this.api.asc_registerCallback('asc_onShowMathTrack', _.bind(this.onShowMathTrack, this)); + this.api.asc_registerCallback('asc_onHideMathTrack', _.bind(this.onHideMathTrack, this)); + } }, fillFormsMenuProps: function(selectedElements) { @@ -1451,6 +1454,187 @@ define([ this._preventClick = true; }, + onShowMathTrack: function(bounds) { + if (this.mode && !this.mode.isPDFEdit) return; + + this.lastMathTrackBounds = bounds; + if (bounds[3] < 0 || Common.Utils.InternalSettings.get('pdfe-equation-toolbar-hide')) { + this.onHideMathTrack(); + return; + } + var me = this, + documentHolder = me.documentHolder, + eqContainer = documentHolder.cmpEl.find('#equation-container'); + + // Prepare menu container + if (eqContainer.length < 1) { + var equationsStore = me.getApplication().getCollection('EquationGroups'), + eqStr = '
'; + + me.getApplication().getController('InsTab').onMathTypes(me.getApplication().getController('Toolbar')._equationTemp); + + me.equationBtns = []; + for (var i = 0; i < equationsStore.length; ++i) { + eqStr += ''; + } + eqStr += '
'; + eqStr += ''; + eqStr += '
'; + eqContainer = $(eqStr); + documentHolder.cmpEl.append(eqContainer); + var onShowBefore = function (menu) { + var index = menu.options.value, + group = equationsStore.at(index); + var equationPicker = new Common.UI.DataViewSimple({ + el: $('#id-document-holder-btn-equation-menu-' + index, menu.cmpEl), + parentMenu: menu, + store: group.get('groupStore'), + scrollAlwaysVisible: true, + showLast: false, + restoreHeight: 450, + itemTemplate: _.template( + '
' + + '
' + + '
') + }); + equationPicker.on('item:click', function(picker, item, record, e) { + if (me.api) { + if (record) + me.api.asc_AddMath(record.get('data').equationType); + } + }); + menu.off('show:before', onShowBefore); + }; + var bringForward = function (menu) { + eqContainer.addClass('has-open-menu'); + }; + var sendBackward = function (menu) { + eqContainer.removeClass('has-open-menu'); + }; + for (var i = 0; i < equationsStore.length; ++i) { + var equationGroup = equationsStore.at(i); + var btn = new Common.UI.Button({ + parentEl: $('#id-document-holder-btn-equation-' + i, documentHolder.cmpEl), + cls : 'btn-toolbar no-caret', + iconCls : 'svgicon ' + equationGroup.get('groupIcon'), + hint : equationGroup.get('groupName'), + menu : new Common.UI.Menu({ + cls: 'menu-shapes', + value: i, + items: [ + { template: _.template('') } + ] + }) + }); + btn.menu.on('show:before', onShowBefore); + btn.menu.on('show:before', bringForward); + btn.menu.on('hide:after', sendBackward); + me.equationBtns.push(btn); + } + + me.equationSettingsBtn = new Common.UI.Button({ + parentEl: $('#id-document-holder-btn-equation-settings', documentHolder.cmpEl), + cls : 'btn-toolbar no-caret', + iconCls : 'toolbar__icon btn-more-vertical', + hint : me.documentHolder.advancedEquationText, + menu : me.documentHolder.createEquationMenu('popuptbeqinput', 'tl-bl') + }); + me.equationSettingsBtn.menu.options.initMenu = function() { + var eq = me.api.asc_GetMathInputType(), + menu = me.equationSettingsBtn.menu, + isEqToolbarHide = Common.Utils.InternalSettings.get('pdfe-equation-toolbar-hide'); + + menu.items[5].setChecked(eq===Asc.c_oAscMathInputType.Unicode); + menu.items[6].setChecked(eq===Asc.c_oAscMathInputType.LaTeX); + menu.items[8].options.isToolbarHide = isEqToolbarHide; + menu.items[8].setCaption(isEqToolbarHide ? me.documentHolder.showEqToolbar : me.documentHolder.hideEqToolbar, true); + }; + me.equationSettingsBtn.menu.on('item:click', _.bind(me.convertEquation, me)); + me.equationSettingsBtn.menu.on('show:before', function(menu) { + bringForward(); + menu.options.initMenu(); + }); + me.equationSettingsBtn.menu.on('hide:after', sendBackward); + } + + var showPoint = [(bounds[0] + bounds[2])/2 - eqContainer.outerWidth()/2, bounds[1] - eqContainer.outerHeight() - 10]; + (showPoint[0]<0) && (showPoint[0] = 0); + if (showPoint[1]<0) { + showPoint[1] = bounds[3] + 10; + } + showPoint[1] = Math.min(me._Height - eqContainer.outerHeight(), Math.max(0, showPoint[1])); + eqContainer.css({left: showPoint[0], top : showPoint[1]}); + + if (_.isUndefined(me._XY)) { + me._XY = [ + documentHolder.cmpEl.offset().left - $(window).scrollLeft(), + documentHolder.cmpEl.offset().top - $(window).scrollTop() + ]; + me._Width = documentHolder.cmpEl.width(); + me._Height = documentHolder.cmpEl.height(); + me._BodyWidth = $('body').width(); + } + + var diffDown = me._Height - showPoint[1] - eqContainer.outerHeight(), + diffUp = me._XY[1] + showPoint[1], + menuAlign = (diffDown < 220 && diffDown < diffUp*0.9) ? 'bl-tl' : 'tl-bl'; + if (Common.UI.isRTL()) { + menuAlign = menuAlign === 'bl-tl' ? 'br-tr' : 'tr-br'; + } + me.equationBtns.forEach(function(item){ + item && (item.menu.menuAlign = menuAlign); + }); + me.equationSettingsBtn.menu.menuAlign = menuAlign; + if (eqContainer.is(':visible')) { + if (me.equationSettingsBtn.menu.isVisible()) { + me.equationSettingsBtn.menu.options.initMenu(); + me.equationSettingsBtn.menu.alignPosition(); + } + } else { + eqContainer.show(); + } + me.disableEquationBar(); + }, + + onHideMathTrack: function() { + if (!this.documentHolder || !this.documentHolder.cmpEl) return; + var eqContainer = this.documentHolder.cmpEl.find('#equation-container'); + if (eqContainer.is(':visible')) { + eqContainer.hide(); + } + }, + + disableEquationBar: function() { + var eqContainer = this.documentHolder.cmpEl.find('#equation-container'), + disabled = this._isDisabled || this._state.equationLocked; + + if (eqContainer.length>0 && eqContainer.is(':visible')) { + this.equationBtns.forEach(function(item){ + item && item.setDisabled(!!disabled); + }); + this.equationSettingsBtn.setDisabled(!!disabled); + } + }, + + convertEquation: function(menu, item, e) { + if (this.api) { + if (item.options.type=='input') { + this.api.asc_SetMathInputType(item.value); + Common.localStorage.setBool("pdfe-equation-input-latex", item.value === Asc.c_oAscMathInputType.LaTeX) + } else if (item.options.type=='view') + this.api.asc_ConvertMathView(item.value.linear, item.value.all); + else if(item.options.type=='hide') { + item.options.isToolbarHide = !item.options.isToolbarHide; + Common.Utils.InternalSettings.set('pdfe-equation-toolbar-hide', item.options.isToolbarHide); + Common.localStorage.setBool('pdfe-equation-toolbar-hide', item.options.isToolbarHide); + if(item.options.isToolbarHide) this.onHideMathTrack(); + else this.onShowMathTrack(this.lastMathTrackBounds); + } + } + }, + editComplete: function() { this.documentHolder && this.documentHolder.fireEvent('editcomplete', this.documentHolder); } diff --git a/apps/pdfeditor/main/app/view/DocumentHolder.js b/apps/pdfeditor/main/app/view/DocumentHolder.js index 289429f9c3..d44ac08a76 100644 --- a/apps/pdfeditor/main/app/view/DocumentHolder.js +++ b/apps/pdfeditor/main/app/view/DocumentHolder.js @@ -236,6 +236,62 @@ define([ this.fireEvent('createdelayedelements', [this, 'forms']); }, + createEquationMenu: function(toggleGroup, menuAlign) { + return new Common.UI.Menu({ + cls: 'ppm-toolbar shifted-right', + menuAlign: menuAlign, + items : [ + new Common.UI.MenuItem({ + caption : this.currProfText, + iconCls : 'menu__icon btn-professional-equation', + type : 'view', + value : {all: false, linear: false} + }), + new Common.UI.MenuItem({ + caption : this.currLinearText, + iconCls : 'menu__icon btn-linear-equation', + type : 'view', + value : {all: false, linear: true} + }), + new Common.UI.MenuItem({ + caption : this.allProfText, + iconCls : 'menu__icon btn-professional-equation', + type : 'view', + value : {all: true, linear: false} + }), + new Common.UI.MenuItem({ + caption : this.allLinearText, + iconCls : 'menu__icon btn-linear-equation', + type : 'view', + value : {all: true, linear: true} + }), + { caption : '--' }, + new Common.UI.MenuItem({ + caption : this.unicodeText, + checkable : true, + checked : false, + toggleGroup : toggleGroup, + type : 'input', + value : Asc.c_oAscMathInputType.Unicode + }), + new Common.UI.MenuItem({ + caption : this.latexText, + checkable : true, + checked : false, + toggleGroup : toggleGroup, + type : 'input', + value : Asc.c_oAscMathInputType.LaTeX + }), + { caption : '--' }, + new Common.UI.MenuItem({ + caption : this.hideEqToolbar, + isToolbarHide: false, + type : 'hide', + }) + ] + }); + }, + updateCustomItems: function(menu, data) { if (!menu || !data || data.length<1) return; @@ -386,7 +442,17 @@ define([ textRedo: 'Redo', textCut: 'Cut', textPaste: 'Paste', - textClearField: 'Clear field' + textClearField: 'Clear field', + advancedEquationText: 'Equation Settings', + unicodeText: 'Unicode', + latexText: 'LaTeX', + currProfText: 'Current - Professional', + currLinearText: 'Current - Linear', + allProfText: 'All - Professional', + allLinearText: 'All - Linear', + hideEqToolbar: 'Hide Equation Toolbar', + showEqToolbar: 'Show Equation Toolbar', + }, PDFE.Views.DocumentHolder || {})); }); \ No newline at end of file diff --git a/apps/pdfeditor/main/resources/less/toolbar.less b/apps/pdfeditor/main/resources/less/toolbar.less index 27fd06dc70..2290167e45 100644 --- a/apps/pdfeditor/main/resources/less/toolbar.less +++ b/apps/pdfeditor/main/resources/less/toolbar.less @@ -117,4 +117,38 @@ vertical-align: middle; } -} \ No newline at end of file +} + +#equation-container { + position: absolute; + z-index: @zindex-dropdown - 20; + background-color: @background-toolbar-ie; + background-color: @background-toolbar; + border: @scaled-one-px-value-ie solid @border-regular-control-ie; + border: @scaled-one-px-value solid @border-regular-control; + + border-radius: 3px; + overflow: hidden; + box-shadow: 0 5px 15px -5px rgba(0, 0, 0, 0.2); + .ie &, + .winxp & { + overflow: visible; + } +} + +#equation-container { + .separator { + height: 30px; + } + &.has-open-menu { + z-index: @zindex-navbar + 1; + } + .btn-toolbar { + display: flex; + justify-content: center; + align-items: center; + width: 30px; + height: 30px; + border-radius: 0px; + } +}