diff options
Diffstat (limited to 'src/components/MessagesList/MessagesGroup/Message/MessagePart')
| -rw-r--r-- | src/components/MessagesList/MessagesGroup/Message/MessagePart/AudioPlayer.vue | 82 | ||||
| -rw-r--r-- | src/components/MessagesList/MessagesGroup/Message/MessagePart/FilePreview.vue | 10 |
2 files changed, 91 insertions, 1 deletions
diff --git a/src/components/MessagesList/MessagesGroup/Message/MessagePart/AudioPlayer.vue b/src/components/MessagesList/MessagesGroup/Message/MessagePart/AudioPlayer.vue new file mode 100644 index 000000000..64540cf1d --- /dev/null +++ b/src/components/MessagesList/MessagesGroup/Message/MessagePart/AudioPlayer.vue @@ -0,0 +1,82 @@ +<!-- + - @copyright Copyright (c) 2021 Marco Ambrosini <marcoambrosini@pm.me> + - + - @author Marco Ambrosini <marcoambrosini@pm.me> + - + - @license GNU AGPL version 3 or any later version + - + - This program is free software: you can redistribute it and/or modify + - it under the terms of the GNU Affero General Public License as + - published by the Free Software Foundation, either version 3 of the + - License, or (at your option) any later version. + - + - This program is distributed in the hope that it will be useful, + - but WITHOUT ANY WARRANTY; without even the implied warranty of + - MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + - GNU Affero General Public License for more details. + - + - You should have received a copy of the GNU Affero General Public License + - along with this program. If not, see <http://www.gnu.org/licenses/>. +--> + +<template> + <div class="wrapper"> + <audio + controls + :src="fileURL"> + {{ t('spreed', 'Your browser does not support playing audio files') }} + </audio> + </div> +</template> + +<script> +import { generateRemoteUrl } from '@nextcloud/router' +import { encodePath } from '@nextcloud/paths' + +export default { + name: 'AudioPlayer', + + props: { + /** + * File name + */ + name: { + type: String, + required: true, + }, + link: { + type: String, + required: true, + }, + /** + * File path relative to the user's home storage, + * or link share root, includes the file name. + */ + path: { + type: String, + required: true, + }, + }, + + computed: { + internalAbsolutePath() { + if (this.path.startsWith('/')) { + return this.path + } + return '/' + this.path + }, + + fileURL() { + const userId = this.$store.getters.getUserId() + if (userId === null) { + // guest mode, use public link download URL + return this.link + '/download/' + encodePath(this.name) + } else { + // use direct DAV URL + return generateRemoteUrl(`dav/files/${userId}`) + encodePath(this.internalAbsolutePath) + } + }, + }, + +} +</script> diff --git a/src/components/MessagesList/MessagesGroup/Message/MessagePart/FilePreview.vue b/src/components/MessagesList/MessagesGroup/Message/MessagePart/FilePreview.vue index b013d62d0..162f1e3b7 100644 --- a/src/components/MessagesList/MessagesGroup/Message/MessagePart/FilePreview.vue +++ b/src/components/MessagesList/MessagesGroup/Message/MessagePart/FilePreview.vue @@ -26,7 +26,7 @@ :tabindex="wrapperTabIndex" class="file-preview" :class="{ 'file-preview--viewer-available': isViewerAvailable, 'file-preview--upload-editor': isUploadEditor }" - @click="handleClick" + @click.exact="handleClick" @keydown.enter="handleClick"> <div v-if="!isLoading" @@ -78,6 +78,7 @@ import Close from 'vue-material-design-icons/Close' import PlayCircleOutline from 'vue-material-design-icons/PlayCircleOutline' import { getCapabilities } from '@nextcloud/capabilities' import { encodePath } from '@nextcloud/paths' +import AudioPlayer from './AudioPlayer' const PREVIEW_TYPE = { TEMPORARY: 0, @@ -236,6 +237,13 @@ export default { is: 'div', tag: 'div', } + } else if (this.mimetype.startsWith('audio')) { + return { + is: AudioPlayer, + name: this.name, + path: this.path, + link: this.link, + } } return { is: 'a', |