From a337bb128c1edec8395f83ce25ed60f520f15a3c Mon Sep 17 00:00:00 2001 From: Alexander Onnikov Date: Tue, 15 Oct 2024 15:36:27 +0700 Subject: [PATCH] UBERF-8477 Allow to download image from text editor (#6929) Signed-off-by: Alexander Onnikov --- models/text-editor/src/index.ts | 9 +++++++++ models/text-editor/src/plugin.ts | 1 + plugins/text-editor-assets/assets/icons.svg | 8 ++++++++ plugins/text-editor-assets/lang/en.json | 1 + plugins/text-editor-assets/lang/es.json | 1 + plugins/text-editor-assets/lang/fr.json | 1 + plugins/text-editor-assets/lang/pt.json | 1 + plugins/text-editor-assets/lang/ru.json | 1 + plugins/text-editor-assets/lang/zh.json | 1 + plugins/text-editor-assets/src/index.ts | 1 + .../src/components/extension/imageExt.ts | 13 +++++++++++++ plugins/text-editor-resources/src/index.ts | 3 ++- plugins/text-editor/src/plugin.ts | 2 ++ 13 files changed, 42 insertions(+), 1 deletion(-) diff --git a/models/text-editor/src/index.ts b/models/text-editor/src/index.ts index ac7802ced6..cbf19db02e 100644 --- a/models/text-editor/src/index.ts +++ b/models/text-editor/src/index.ts @@ -331,6 +331,15 @@ export function createModel (builder: Builder): void { index: 10 }) + builder.createDoc(textEditor.class.TextEditorAction, core.space.Model, { + kind: 'image', + action: textEditor.function.DownloadImage, + icon: textEditor.icon.Download, + label: textEditor.string.Download, + category: 90, + index: 15 + }) + builder.createDoc(textEditor.class.TextEditorAction, core.space.Model, { kind: 'image', action: textEditor.function.MoreImageActions, diff --git a/models/text-editor/src/plugin.ts b/models/text-editor/src/plugin.ts index 19439fe536..ad954bb19f 100644 --- a/models/text-editor/src/plugin.ts +++ b/models/text-editor/src/plugin.ts @@ -29,6 +29,7 @@ export default mergeIds(textEditorId, textEditor, { ExpandImage: '' as Resource, MoreImageActions: '' as Resource, ConfigureNote: '' as Resource, + DownloadImage: '' as Resource, IsEditableTableActive: '' as Resource, IsEditableNote: '' as Resource, diff --git a/plugins/text-editor-assets/assets/icons.svg b/plugins/text-editor-assets/assets/icons.svg index 4b1f71cbdb..d05561e40e 100644 --- a/plugins/text-editor-assets/assets/icons.svg +++ b/plugins/text-editor-assets/assets/icons.svg @@ -183,6 +183,14 @@ d="M18.2927 19.7071C17.9022 19.3166 17.9022 18.6834 18.2927 18.2929C18.6833 17.9024 19.3164 17.9024 19.707 18.2929L26 24.586V20H28V28H20V26H24.586L18.2927 19.7071Z" /> + + + + diff --git a/plugins/text-editor-assets/lang/en.json b/plugins/text-editor-assets/lang/en.json index 5f5280c182..cbc870e082 100644 --- a/plugins/text-editor-assets/lang/en.json +++ b/plugins/text-editor-assets/lang/en.json @@ -32,6 +32,7 @@ "AlignCenter": "Align center", "AlignLeft": "Align left", "AlignRight": "Align right", + "Download": "Download", "ViewImage": "View image", "ViewOriginal": "View original", "MoreActions": "More actions", diff --git a/plugins/text-editor-assets/lang/es.json b/plugins/text-editor-assets/lang/es.json index 1e64d13dba..d10e9c46cb 100644 --- a/plugins/text-editor-assets/lang/es.json +++ b/plugins/text-editor-assets/lang/es.json @@ -32,6 +32,7 @@ "AlignCenter": "Alinear centro", "AlignLeft": "Alinear izquierda", "AlignRight": "Alinear derecha", + "Download": "Descargar", "ViewImage": "Ver imagen", "ViewOriginal": "Ver original", "MoreActions": "Más acciones", diff --git a/plugins/text-editor-assets/lang/fr.json b/plugins/text-editor-assets/lang/fr.json index 6882c9c6ba..7193686f05 100644 --- a/plugins/text-editor-assets/lang/fr.json +++ b/plugins/text-editor-assets/lang/fr.json @@ -32,6 +32,7 @@ "AlignCenter": "Aligner au centre", "AlignLeft": "Aligner à gauche", "AlignRight": "Aligner à droite", + "Download": "Télécharger", "ViewImage": "Voir l'image", "ViewOriginal": "Voir l'original", "MoreActions": "Plus d'actions", diff --git a/plugins/text-editor-assets/lang/pt.json b/plugins/text-editor-assets/lang/pt.json index 5089270bd4..b6f0b47125 100644 --- a/plugins/text-editor-assets/lang/pt.json +++ b/plugins/text-editor-assets/lang/pt.json @@ -32,6 +32,7 @@ "AlignCenter": "Alinhar centro", "AlignLeft": "Alinhar esquerda", "AlignRight": "Alinhar direita", + "Download": "Transferir", "ViewImage": "Ver imagem", "ViewOriginal": "Ver original", "MoreActions": "Mais ações", diff --git a/plugins/text-editor-assets/lang/ru.json b/plugins/text-editor-assets/lang/ru.json index 6ccdc85758..f197e3abe5 100644 --- a/plugins/text-editor-assets/lang/ru.json +++ b/plugins/text-editor-assets/lang/ru.json @@ -32,6 +32,7 @@ "AlignCenter": "По центру", "AlignLeft": "По левому краю", "AlignRight": "По правому краю", + "Download": "Скачать", "ViewImage": "Открыть изображение", "ViewOriginal": "Открыть оригинал", "MoreActions": "Дополнительные действия", diff --git a/plugins/text-editor-assets/lang/zh.json b/plugins/text-editor-assets/lang/zh.json index 3b8959c5e7..c3def4da63 100644 --- a/plugins/text-editor-assets/lang/zh.json +++ b/plugins/text-editor-assets/lang/zh.json @@ -32,6 +32,7 @@ "AlignCenter": "居中对齐", "AlignLeft": "左对齐", "AlignRight": "右对齐", + "Download": "下载", "ViewImage": "查看图片", "ViewOriginal": "查看原图", "MoreActions": "更多操作", diff --git a/plugins/text-editor-assets/src/index.ts b/plugins/text-editor-assets/src/index.ts index 8f82ee0d90..b34b337333 100644 --- a/plugins/text-editor-assets/src/index.ts +++ b/plugins/text-editor-assets/src/index.ts @@ -38,5 +38,6 @@ loadMetadata(textEditor.icon, { MoreH: `${icons}#moreH`, Expand: `${icons}#expand`, ScaleOut: `${icons}#scaleOut`, + Download: `${icons}#download`, Note: `${icons}#note` }) diff --git a/plugins/text-editor-resources/src/components/extension/imageExt.ts b/plugins/text-editor-resources/src/components/extension/imageExt.ts index f000915b34..5e02ee7a85 100644 --- a/plugins/text-editor-resources/src/components/extension/imageExt.ts +++ b/plugins/text-editor-resources/src/components/extension/imageExt.ts @@ -233,6 +233,19 @@ export async function openImage (editor: Editor): Promise { }) } +export async function downloadImage (editor: Editor): Promise { + const attributes = editor.getAttributes('image') + const fileId = attributes['file-id'] ?? attributes.src + const href = getFileUrl(fileId) + + const link = document.createElement('a') + link.style.display = 'none' + link.target = '_blank' + link.href = href + link.download = attributes.title ?? attributes.alt ?? '' + link.click() +} + export async function expandImage (editor: Editor): Promise { const attributes = editor.getAttributes('image') const fileId = attributes['file-id'] ?? attributes.src diff --git a/plugins/text-editor-resources/src/index.ts b/plugins/text-editor-resources/src/index.ts index 8f3b4be10b..056b59ec77 100644 --- a/plugins/text-editor-resources/src/index.ts +++ b/plugins/text-editor-resources/src/index.ts @@ -18,7 +18,7 @@ import { type Resources } from '@hcengineering/platform' import { formatLink } from './kits/default-kit' import { isEditable, isHeadingVisible } from './kits/editor-kit' import { openTableOptions, isEditableTableActive } from './components/extension/table/table' -import { openImage, expandImage, moreImageActions } from './components/extension/imageExt' +import { openImage, downloadImage, expandImage, moreImageActions } from './components/extension/imageExt' import { configureNote, isEditableNote } from './components/extension/note' export * from '@hcengineering/presentation/src/types' @@ -82,6 +82,7 @@ export default async (): Promise => ({ OpenTableOptions: openTableOptions, OpenImage: openImage, ExpandImage: expandImage, + DownloadImage: downloadImage, MoreImageActions: moreImageActions, ConfigureNote: configureNote, IsEditableTableActive: isEditableTableActive, diff --git a/plugins/text-editor/src/plugin.ts b/plugins/text-editor/src/plugin.ts index cb66e0025b..66fc794368 100644 --- a/plugins/text-editor/src/plugin.ts +++ b/plugins/text-editor/src/plugin.ts @@ -72,6 +72,7 @@ export default plugin(textEditorId, { AlignRight: '' as IntlString, ViewImage: '' as IntlString, ViewOriginal: '' as IntlString, + Download: '' as IntlString, MoreActions: '' as IntlString, InsertTable: '' as IntlString, @@ -115,6 +116,7 @@ export default plugin(textEditorId, { MoreH: '' as Asset, Expand: '' as Asset, ScaleOut: '' as Asset, + Download: '' as Asset, Note: '' as Asset } })