From e1213112967cd43b15f86c56be271b0ef5ed989a Mon Sep 17 00:00:00 2001 From: Julia Radzhabova Date: Wed, 10 Nov 2021 17:41:01 +0300 Subject: [PATCH 1/2] [DE forms] Add context menu. Bug 53476 --- apps/common/forms/resources/less/common.less | 1 + .../common/main/lib/view/CopyWarningDialog.js | 2 +- .../app/controller/ApplicationController.js | 124 ++++++++++++++++++ .../forms/app/view/ApplicationView.js | 18 ++- apps/documenteditor/forms/locale/en.json | 12 +- 5 files changed, 154 insertions(+), 3 deletions(-) diff --git a/apps/common/forms/resources/less/common.less b/apps/common/forms/resources/less/common.less index 58b92d28a8..7ebf0d2c89 100644 --- a/apps/common/forms/resources/less/common.less +++ b/apps/common/forms/resources/less/common.less @@ -77,6 +77,7 @@ @import "../../../../common/main/resources/less/winxp_fix.less"; @import "../../../../common/main/resources/less/calendar.less"; @import "../../../../common/main/resources/less/spinner.less"; +@import "../../../../common/main/resources/less/checkbox.less"; @toolbarBorderColor: @border-toolbar-ie; @toolbarBorderColor: @border-toolbar; diff --git a/apps/common/main/lib/view/CopyWarningDialog.js b/apps/common/main/lib/view/CopyWarningDialog.js index a8b0803565..df44958911 100644 --- a/apps/common/main/lib/view/CopyWarningDialog.js +++ b/apps/common/main/lib/view/CopyWarningDialog.js @@ -126,7 +126,7 @@ define([ }, textTitle : 'Copy, Cut and Paste Actions', - textMsg : 'Copy, cut and paste actions using the editor toolbar buttons and context menu actions will be performed within this editor tab only.

.To copy or paste to or from applications outside the editor tab use the following keyboard combinations:', + textMsg : 'Copy, cut and paste actions using the editor toolbar buttons and context menu actions will be performed within this editor tab only.

To copy or paste to or from applications outside the editor tab use the following keyboard combinations:', textToCopy : 'for Copy', textToPaste : 'for Paste', textToCut: 'for Cut', diff --git a/apps/documenteditor/forms/app/controller/ApplicationController.js b/apps/documenteditor/forms/app/controller/ApplicationController.js index 1692decd0f..7b794bdb90 100644 --- a/apps/documenteditor/forms/app/controller/ApplicationController.js +++ b/apps/documenteditor/forms/app/controller/ApplicationController.js @@ -10,6 +10,7 @@ define([ 'common/main/lib/component/Calendar', 'common/main/lib/util/LocalStorage', 'common/main/lib/util/Shortcuts', + 'common/main/lib/view/CopyWarningDialog', 'common/forms/lib/view/modals', 'documenteditor/forms/app/view/ApplicationView' ], function (Viewport) { @@ -1030,6 +1031,7 @@ define([ this.api.asc_registerCallback('asc_onPrint', _.bind(this.onPrint, this)); this.api.asc_registerCallback('asc_onPrintUrl', _.bind(this.onPrintUrl, this)); this.api.asc_registerCallback('sync_onAllRequiredFormsFilled', _.bind(this.onFillRequiredFields, this)); + this.api.asc_registerCallback('asc_onContextMenu', _.bind(this.onContextMenu, this)); if (this.appOptions.canFillForms) { this.api.asc_registerCallback('asc_onShowContentControlsActions', _.bind(this.onShowContentControlsActions, this)); this.api.asc_registerCallback('asc_onHideContentControlsActions', _.bind(this.onHideContentControlsActions, this)); @@ -1320,6 +1322,128 @@ define([ }); }, + onContextMenu: function(event){ + var me = this; + _.delay(function(){ + if (event.get_Type() == 0) { + me.api && me.appOptions.canFillForms && me.fillMenuProps(me.api.getSelectedElements(), event); + } + },10); + }, + + showPopupMenu: function(menu, value, event){ + if (!_.isUndefined(menu) && menu !== null){ + Common.UI.Menu.Manager.hideAll(); + + var showPoint = [event.get_X(), event.get_Y()], + menuContainer = this.boxSdk.find(Common.Utils.String.format('#menu-container-{0}', menu.id)); + + if (!menu.rendered) { + // Prepare menu container + if (menuContainer.length < 1) { + menuContainer = $(Common.Utils.String.format('', menu.id)); + this.boxSdk.append(menuContainer); + } + + menu.render(menuContainer); + menu.cmpEl.attr({tabindex: "-1"}); + } + + menuContainer.css({ + left: showPoint[0], + top : showPoint[1] + }); + + menu.show(); + + if (_.isFunction(menu.options.initMenu)) { + menu.options.initMenu(value); + menu.alignPosition(); + } + _.delay(function() { + menu.cmpEl.focus(); + }, 10); + + this.currentMenu = menu; + } + }, + + fillMenuProps: function(selectedElements, event) { + if (!selectedElements || !_.isArray(selectedElements)) return; + + if (!this.textMenu) { + this.textMenu = this.view.getContextMenu(); + this.textMenu.on('item:click', _.bind(this.onContextMenuClick, this)); + } + + var menu_props = {}, + noobject = true; + for (var i = 0; i 86); // if isChrome or isSafari or isOpera == true use asc_onPrintUrl event + opts.asc_setAdvancedOptions(printopt); + this.api.asc_Print(opts); + break; + } + }, + errorDefaultMessage : 'Error code: %1', unknownErrorText : 'Unknown error.', convertationTimeoutText : 'Conversion timeout exceeded.', diff --git a/apps/documenteditor/forms/app/view/ApplicationView.js b/apps/documenteditor/forms/app/view/ApplicationView.js index 3d54a99798..b9cbc27aff 100644 --- a/apps/documenteditor/forms/app/view/ApplicationView.js +++ b/apps/documenteditor/forms/app/view/ApplicationView.js @@ -87,6 +87,17 @@ define([ return this; }, + getContextMenu: function() { + return new Common.UI.Menu({ + items: [ + { caption: this.textCut, value: 'cut' }, + { caption: this.textCopy, value: 'copy' }, + { caption: this.textPaste, value: 'paste' }, + { caption: this.textPrintSel, value: 'print' } + ] + }); + }, + txtDownload: 'Download', txtPrint: 'Print', txtShare: 'Share', @@ -98,6 +109,11 @@ define([ textNext: 'Next Field', textClear: 'Clear All Fields', textSubmit: 'Submit', - txtTheme: 'Interface theme' + txtTheme: 'Interface theme', + textCut: 'Cut', + textCopy: 'Copy', + textPaste: 'Paste', + textPrintSel: 'Print Selection' + }, DE.Views.ApplicationView || {})); }); \ No newline at end of file diff --git a/apps/documenteditor/forms/locale/en.json b/apps/documenteditor/forms/locale/en.json index 32300d02c3..353684fcb0 100644 --- a/apps/documenteditor/forms/locale/en.json +++ b/apps/documenteditor/forms/locale/en.json @@ -58,6 +58,12 @@ "Common.Views.ShareDialog.textTitle": "Share Link", "Common.Views.ShareDialog.txtCopy": "Copy to clipboard", "Common.Views.ShareDialog.warnCopy": "Browser's error! Use keyboard shortcut [Ctrl] + [C]", + "Common.Views.CopyWarningDialog.textDontShow": "Don't show this message again", + "Common.Views.CopyWarningDialog.textMsg": "Copy, cut and paste actions using context menu actions will be performed within this editor tab only.

To copy or paste to or from applications outside the editor tab use the following keyboard combinations:", + "Common.Views.CopyWarningDialog.textTitle": "Copy, Cut and Paste Actions", + "Common.Views.CopyWarningDialog.textToCopy": "for Copy", + "Common.Views.CopyWarningDialog.textToCut": "for Cut", + "Common.Views.CopyWarningDialog.textToPaste": "for Paste", "DE.Controllers.ApplicationController.convertationErrorText": "Conversion failed.", "DE.Controllers.ApplicationController.convertationTimeoutText": "Conversion timeout exceeded.", "DE.Controllers.ApplicationController.criticalErrorTitle": "Error", @@ -115,5 +121,9 @@ "DE.Views.ApplicationView.txtFullScreen": "Full Screen", "DE.Views.ApplicationView.txtPrint": "Print", "DE.Views.ApplicationView.txtShare": "Share", - "DE.Views.ApplicationView.txtTheme": "Interface theme" + "DE.Views.ApplicationView.txtTheme": "Interface theme", + "DE.Views.ApplicationView.textCut": "Cut", + "DE.Views.ApplicationView.textCopy": "Copy", + "DE.Views.ApplicationView.textPaste": "Paste", + "DE.Views.ApplicationView.textPrintSel": "Print Selection" } \ No newline at end of file From 7ab6a9c994eae35afd862fc8247820cf4c6b70fd Mon Sep 17 00:00:00 2001 From: Julia Radzhabova Date: Thu, 11 Nov 2021 11:38:34 +0300 Subject: [PATCH 2/2] [DE forms] Add icons. Bug 53476 --- .../forms/resources/img/icon-menu-sprite.svg | 26 ++++++++++++++++++- apps/common/forms/resources/less/common.less | 14 +++++++++- .../forms/app/view/ApplicationView.js | 9 ++++--- 3 files changed, 43 insertions(+), 6 deletions(-) diff --git a/apps/common/forms/resources/img/icon-menu-sprite.svg b/apps/common/forms/resources/img/icon-menu-sprite.svg index 97b51fd3eb..bcb884c105 100644 --- a/apps/common/forms/resources/img/icon-menu-sprite.svg +++ b/apps/common/forms/resources/img/icon-menu-sprite.svg @@ -1,4 +1,4 @@ - + @@ -148,5 +148,29 @@ + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/apps/common/forms/resources/less/common.less b/apps/common/forms/resources/less/common.less index 7ebf0d2c89..b0e148fe19 100644 --- a/apps/common/forms/resources/less/common.less +++ b/apps/common/forms/resources/less/common.less @@ -432,7 +432,7 @@ .svg-icon { background: data-uri('../../../../common/forms/resources/img/icon-menu-sprite.svg') no-repeat; - background-size: @icon-width*19 @icon-height*2; + background-size: @icon-width*22 @icon-height*2; &.download { background-position: -@icon-width 0; @@ -496,6 +496,18 @@ background-position: -@icon-width*14 0; background-position: -@icon-width*14 @icon-normal-top; } + &.cut { + background-position: -@icon-width*19 0; + background-position: -@icon-width*19 @icon-normal-top; + } + &.copy { + background-position: -@icon-width*20 0; + background-position: -@icon-width*20 @icon-normal-top; + } + &.paste { + background-position: -@icon-width*21 0; + background-position: -@icon-width*21 @icon-normal-top; + } } .btn { diff --git a/apps/documenteditor/forms/app/view/ApplicationView.js b/apps/documenteditor/forms/app/view/ApplicationView.js index b9cbc27aff..3f3aa37148 100644 --- a/apps/documenteditor/forms/app/view/ApplicationView.js +++ b/apps/documenteditor/forms/app/view/ApplicationView.js @@ -89,11 +89,12 @@ define([ getContextMenu: function() { return new Common.UI.Menu({ + cls: 'shifted-right', items: [ - { caption: this.textCut, value: 'cut' }, - { caption: this.textCopy, value: 'copy' }, - { caption: this.textPaste, value: 'paste' }, - { caption: this.textPrintSel, value: 'print' } + { caption: this.textCut, value: 'cut', iconCls: 'mi-icon svg-icon cut' }, + { caption: this.textCopy, value: 'copy', iconCls: 'mi-icon svg-icon copy' }, + { caption: this.textPaste, value: 'paste', iconCls: 'mi-icon svg-icon paste' }, + { caption: this.textPrintSel, value: 'print', iconCls: 'mi-icon svg-icon print' } ] }); },