Implement support for insertion of multimedia from Nextcloud assets

This change adds ability to insert multimedia files from Nextcloud
to Impress documents. It advertises EnableInsertRemoteFile capability,
so that Office activates the feature (depends on Office including
commit 60d9a9c20bf69b3f1d8591b2d8400c4a453970ab - older builds won't
show the respective button).

Signed-off-by: Mike Kaganski <mike.kaganski@collabora.com>

docs/frontend-integration.md

@@ -100,6 +100,10 @@ The following handlers are currently supported:
 - insertGraphic: will be called when an image from the Nextcloud storage should be inserted
   - Arguments
     - insertFileFromPath(path): Callback to trigger the actual inserting of the graphic from an absolute file path
+- insertFile: will be called when a file (e.g., multimedia) from the Nextcloud storage should be inserted (generalized insertGraphic)
+  - Arguments
+    - mimeTypeFilter: array of MIME types (strings) to filter in the UI
+    - insertFileFromPath(path): Callback to trigger the actual inserting of the file from an absolute file path
 
 In addition, the following handlers can be used to overwrite the handling of file actions that are rendered in the Nextcloud header bar:
 - actionDetails

lib/Controller/WopiController.php

@@ -145,6 +145,7 @@ class WopiController extends Controller {
 			'SupportsRename' => !$isVersion && !$wopi->isRemoteToken(),
 			'UserCanRename' => !$isPublic && !$isVersion && !$wopi->isRemoteToken(),
 			'EnableInsertRemoteImage' => !$isPublic,
+			'EnableInsertRemoteFile' => !$isPublic,
 			'EnableShare' => $file->isShareable() && !$isVersion && !$isPublic,
 			'HideUserList' => '',
 			'EnableOwnerTermination' => $wopi->getCanwrite() && !$isPublic,

src/view/FilesAppIntegration.js

@@ -148,30 +148,33 @@ export default {
 		}
 	},
 
-	insertGraphic(insertFile) {
+	/**
+	 * @private
+	 */
+	insertFile_impl(mimeTypeFilter, insertFileProc, insertHandler) {
 		if (isPublicShare()) {
-			console.error('[FilesAppIntegration] insertGraphic is not supported')
+			console.error('[FilesAppIntegration] insertFile is not supported')
 		}
 
 		const insertFileFromPath = async (path) => {
 			const filename = path.substring(path.lastIndexOf('/') + 1)
 			const { data } = await axios.post(generateUrl('apps/richdocuments/assets'), { path })
-			insertFile(filename, data.url)
+			insertFileProc(filename, data.url)
 		}
 
-		if (this.handlers.insertGraphic && this.handlers.insertGraphic(this, { insertFileFromPath })) {
+		if (insertHandler && insertHandler(this, mimeTypeFilter, { insertFileFromPath })) {
 			return
 		}
 
-		getFilePickerBuilder(t('richdocuments', 'Insert image from {name}', { name: OC.theme.name }))
-			.setMimeTypeFilter(['image/png', 'image/gif', 'image/jpeg', 'image/svg'])
+		getFilePickerBuilder(t('richdocuments', 'Insert file from {name}', { name: OC.theme.name }))
+			.setMimeTypeFilter(mimeTypeFilter)
 			.setFilter((node) => {
 				const downloadShareAttribute = JSON.parse(node.attributes['share-attributes']).find((shareAttribute) => shareAttribute.key === 'download')
 				const downloadPermissions = downloadShareAttribute !== undefined ? (downloadShareAttribute.enabled || downloadShareAttribute.value) : true
 				return (node.permissions & OC.PERMISSION_READ) && downloadPermissions
 			})
 			.addButton({
-				label: t('richdocuments', 'Insert image'),
+				label: t('richdocuments', 'Insert file'),
 				callback: (files) => {
 					if (files && files.length) {
 						insertFileFromPath(files[0].path)
@@ -182,6 +185,16 @@ export default {
 			.pick()
 	},
 
+	insertGraphic(insertFileProc) {
+		this.insertFile_impl(['image/png', 'image/gif', 'image/jpeg', 'image/svg'],
+			insertFileProc,
+			(filesAppIntegration, mimeTypeFilter, { insertFileFromPath }) => { return this.handlers.insertGraphic && this.handlers.insertGraphic(filesAppIntegration, { insertFileFromPath }) })
+	},
+
+	insertFile(mimeTypeFilter, insertFileProc) {
+		this.insertFile_impl(mimeTypeFilter, insertFileProc, this.handlers.insertFile)
+	},
+
 	getFileList() {
 		if (this.fileList) {
 			return this.fileList

src/view/Office.vue

@@ -430,6 +430,14 @@ export default {
 					})
 				})
 				break
+			case 'UI_InsertFile':
+				FilesAppIntegration.insertFile(args.mimeTypeFilter, (filename, url) => {
+					this.postMessage.sendWOPIPostMessage(FRAME_DOCUMENT, args.callback, {
+						filename,
+						url,
+					})
+				})
+				break
 			case 'UI_Mention':
 				this.uiMention(parsed.args)
 				break