From b75c2a061d9502e04e8ae29f80615cd59ef57e1d Mon Sep 17 00:00:00 2001 From: Julia Radzhabova Date: Tue, 1 Nov 2022 01:23:02 +0300 Subject: [PATCH] [SSE] Show equation bar --- .../main/app/controller/DocumentHolder.js | 133 ++++++++++++++++++ .../main/app/controller/Toolbar.js | 39 ++--- apps/spreadsheeteditor/main/index.html | 1 + apps/spreadsheeteditor/main/index.html.deploy | 1 + apps/spreadsheeteditor/main/index_loader.html | 1 + .../main/index_loader.html.deploy | 1 + .../main/resources/less/toolbar.less | 10 +- 7 files changed, 169 insertions(+), 17 deletions(-) diff --git a/apps/spreadsheeteditor/main/app/controller/DocumentHolder.js b/apps/spreadsheeteditor/main/app/controller/DocumentHolder.js index a2c425f69d..1519d49036 100644 --- a/apps/spreadsheeteditor/main/app/controller/DocumentHolder.js +++ b/apps/spreadsheeteditor/main/app/controller/DocumentHolder.js @@ -1855,6 +1855,7 @@ define([ me.documentHolder.cmpEl.offset().top - $(window).scrollTop() ]; me.tooltips.coauth.apiHeight = me.documentHolder.cmpEl.height(); + me.tooltips.coauth.apiWidth = me.documentHolder.cmpEl.width(); var rightMenu = $('#right-menu'); me.tooltips.coauth.rightMenuWidth = rightMenu.is(':visible') ? rightMenu.width() : 0; me.tooltips.coauth.bodyWidth = $(window).width(); @@ -1984,6 +1985,23 @@ define([ this.currentMenu && this.currentMenu.isVisible()){ (this.permissions.isEdit && !this._isDisabled) ? this.fillMenuProps(info, true) : this.fillViewMenuProps(info, true); } + + if (!this.mouse.isLeftButtonDown) return; + + var selectedObjects = this.api.asc_getGraphicObjectProps(), + i = -1, + in_equation = false, + locked = false; + while (++i < selectedObjects.length) { + var type = selectedObjects[i].asc_getObjectType(); + if (type === Asc.c_oAscTypeSelectElement.Math) { + in_equation = true; + } else if (type === Asc.c_oAscTypeSelectElement.Paragraph) { + var value = selectedObjects[i].asc_getObjectValue(); + value && (locked = locked || value.asc_getLocked()); + } + } + in_equation && this.permissions.isEdit && !this._isDisabled ? this.onEquationPanelShow(locked) : this.onEquationPanelHide(); }, fillMenuProps: function(cellinfo, showMenu, event){ @@ -4276,6 +4294,121 @@ define([ } }, + onEquationPanelShow: function(disabled) { + 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('Toolbar').onMathTypes(); + + me.equationBtns = []; + for (var i = 0; i < equationsStore.length; ++i) { + var style = 'margin-right: 8px;' + (i==0 ? 'margin-left: 5px;' : ''); + 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: group.get('groupHeight') ? parseInt(group.get('groupHeight')) : true, + 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); + }; + 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, + // restoreHeight: equationGroup.get('groupHeight') ? parseInt(equationGroup.get('groupHeight')) : true, + items: [ + { template: _.template('
') } + ] + }) + }); + btn.menu.on('show:before', onShowBefore); + 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 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(); + var menu = me.equationSettingsBtn.menu; + menu.items[0].setChecked(eq===Asc.c_oAscMathInputType.Unicode); + menu.items[1].setChecked(eq===Asc.c_oAscMathInputType.LaTeX); + menu.items[8].setChecked(me.api.asc_IsInlineMath()); + }; + me.equationSettingsBtn.menu.on('item:click', _.bind(me.convertEquation, me)); + me.equationSettingsBtn.menu.on('show:before', function(menu) { + menu.options.initMenu(); + }); + */ + } + + if (!me.tooltips.coauth.XY) + me.onDocumentResize(); + + var showPoint = [(me.tooltips.coauth.apiWidth - eqContainer.outerWidth())/2, 0]; + eqContainer.css({left: showPoint[0], top : showPoint[1]}); + if (eqContainer.is(':visible')) { + // if (me.equationSettingsBtn.menu.isVisible()) { + // me.equationSettingsBtn.menu.options.initMenu(); + // me.equationSettingsBtn.menu.alignPosition(); + // } + } else { + eqContainer.show(); + } + me.equationBtns.forEach(function(item){ + item && item.setDisabled(!!disabled); + }); + // me.equationSettingsBtn.setDisabled(!!disabled); + }, + + onEquationPanelHide: function() { + var eqContainer = this.documentHolder.cmpEl.find('#equation-container'); + if (eqContainer.is(':visible')) { + eqContainer.hide(); + } + }, + getUserName: function(id){ var usersStore = SSE.getCollection('Common.Collections.Users'); if (usersStore){ diff --git a/apps/spreadsheeteditor/main/app/controller/Toolbar.js b/apps/spreadsheeteditor/main/app/controller/Toolbar.js index a0bf42e0a8..640241c43c 100644 --- a/apps/spreadsheeteditor/main/app/controller/Toolbar.js +++ b/apps/spreadsheeteditor/main/app/controller/Toolbar.js @@ -3984,7 +3984,7 @@ define([ items: [ { template: _.template('
') } + equationGroup.get('groupHeightStr') + 'margin-left:5px;">') } ] }) }); @@ -4051,16 +4051,21 @@ define([ var me = this; var onShowBefore = function(menu) { me.onMathTypes(me._equationTemp); + if (me._equationTemp && me._equationTemp.get_Data().length>0) + me.fillEquations(); me.toolbar.btnInsertEquation.menu.off('show:before', onShowBefore); }; me.toolbar.btnInsertEquation.menu.on('show:before', onShowBefore); }, onMathTypes: function(equation) { + equation = equation || this._equationTemp; + var equationgrouparray = [], equationsStore = this.getCollection('EquationGroups'); - equationsStore.reset(); + if (equationsStore.length>0) + return; // equations groups @@ -4068,18 +4073,18 @@ define([ // [translate, count cells, scroll] - c_oAscMathMainTypeStrings[Common.define.c_oAscMathMainType.Symbol ] = [this.textSymbols, 11]; - c_oAscMathMainTypeStrings[Common.define.c_oAscMathMainType.Fraction ] = [this.textFraction, 4]; - c_oAscMathMainTypeStrings[Common.define.c_oAscMathMainType.Script ] = [this.textScript, 4]; - c_oAscMathMainTypeStrings[Common.define.c_oAscMathMainType.Radical ] = [this.textRadical, 4]; - c_oAscMathMainTypeStrings[Common.define.c_oAscMathMainType.Integral ] = [this.textIntegral, 3, true]; - c_oAscMathMainTypeStrings[Common.define.c_oAscMathMainType.LargeOperator] = [this.textLargeOperator, 5, true]; - c_oAscMathMainTypeStrings[Common.define.c_oAscMathMainType.Bracket ] = [this.textBracket, 4, true]; - c_oAscMathMainTypeStrings[Common.define.c_oAscMathMainType.Function ] = [this.textFunction, 3, true]; - c_oAscMathMainTypeStrings[Common.define.c_oAscMathMainType.Accent ] = [this.textAccent, 4]; - c_oAscMathMainTypeStrings[Common.define.c_oAscMathMainType.LimitLog ] = [this.textLimitAndLog, 3]; - c_oAscMathMainTypeStrings[Common.define.c_oAscMathMainType.Operator ] = [this.textOperator, 4]; - c_oAscMathMainTypeStrings[Common.define.c_oAscMathMainType.Matrix ] = [this.textMatrix, 4, true]; + c_oAscMathMainTypeStrings[Common.define.c_oAscMathMainType.Symbol ] = [this.textSymbols, 11, false, 'svg-icon-symbols']; + c_oAscMathMainTypeStrings[Common.define.c_oAscMathMainType.Fraction ] = [this.textFraction, 4, false, 'svg-icon-fraction']; + c_oAscMathMainTypeStrings[Common.define.c_oAscMathMainType.Script ] = [this.textScript, 4, false, 'svg-icon-script']; + c_oAscMathMainTypeStrings[Common.define.c_oAscMathMainType.Radical ] = [this.textRadical, 4, false, 'svg-icon-radical']; + c_oAscMathMainTypeStrings[Common.define.c_oAscMathMainType.Integral ] = [this.textIntegral, 3, true, 'svg-icon-integral']; + c_oAscMathMainTypeStrings[Common.define.c_oAscMathMainType.LargeOperator] = [this.textLargeOperator, 5, true, 'svg-icon-largeOperator']; + c_oAscMathMainTypeStrings[Common.define.c_oAscMathMainType.Bracket ] = [this.textBracket, 4, true, 'svg-icon-bracket']; + c_oAscMathMainTypeStrings[Common.define.c_oAscMathMainType.Function ] = [this.textFunction, 3, true, 'svg-icon-function']; + c_oAscMathMainTypeStrings[Common.define.c_oAscMathMainType.Accent ] = [this.textAccent, 4, false, 'svg-icon-accent']; + c_oAscMathMainTypeStrings[Common.define.c_oAscMathMainType.LimitLog ] = [this.textLimitAndLog, 3, false, 'svg-icon-limAndLog']; + c_oAscMathMainTypeStrings[Common.define.c_oAscMathMainType.Operator ] = [this.textOperator, 4, false, 'svg-icon-operator']; + c_oAscMathMainTypeStrings[Common.define.c_oAscMathMainType.Matrix ] = [this.textMatrix, 4, true, 'svg-icon-matrix']; // equations sub groups @@ -4149,12 +4154,14 @@ define([ groupName : c_oAscMathMainTypeStrings[id][0], groupStore : store, groupWidth : width, - groupHeight : c_oAscMathMainTypeStrings[id][2] ? ' height:'+ normHeight +'px!important; ' : '' + groupHeight : normHeight, + groupHeightStr : c_oAscMathMainTypeStrings[id][2] ? ' height:'+ normHeight +'px!important; ' : '', + groupIcon: c_oAscMathMainTypeStrings[id][3] }); } } equationsStore.add(equationgrouparray); - this.fillEquations(); + // this.fillEquations(); } } }, diff --git a/apps/spreadsheeteditor/main/index.html b/apps/spreadsheeteditor/main/index.html index 6e5f3f13c1..746eaa2a69 100644 --- a/apps/spreadsheeteditor/main/index.html +++ b/apps/spreadsheeteditor/main/index.html @@ -368,6 +368,7 @@ + diff --git a/apps/spreadsheeteditor/main/index_loader.html b/apps/spreadsheeteditor/main/index_loader.html index f7403d86e5..fb64a5780b 100644 --- a/apps/spreadsheeteditor/main/index_loader.html +++ b/apps/spreadsheeteditor/main/index_loader.html @@ -262,6 +262,7 @@ +