butter/keanu-weblite
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages 1 Wiki Activity Actions

Export chat (from room info page)

Browse source
This commit is contained in:
N Pex 2022-05-23 15:19:55 +00:00
parent dd48bedfb5
commit 95555a23e4
16 changed files with 18905 additions and 657 deletions
Download patch file Download diff file Expand all files Collapse all files

21
src/components/messages/export/MessageIncomingAudioExport.vue Normal file
View file

@ -0,0 +1,21 @@
<template>
<message-incoming v-bind="{ ...$props, ...$attrs }" v-on="$listeners">
<audio controls :src="src">{{ $t("fallbacks.audio_file") }}</audio>
</message-incoming>
</template>
<script>
import attachmentMixin from "../attachmentMixin";
import MessageIncoming from "../MessageIncoming.vue";
export default {
name: "MessageIncomingAudioExport",
extends: MessageIncoming,
mixins: [attachmentMixin],
components: { MessageIncoming },
};
</script>
<style lang="scss">
@import "@/assets/css/chat.scss";
</style>

47
src/components/messages/export/MessageIncomingImageExport.vue Normal file
View file

@ -0,0 +1,47 @@
<template>
<message-incoming v-bind="{ ...$props, ...$attrs }" v-on="$listeners">
<div class="bubble image-bubble">
<v-img :aspect-ratio="16 / 9" ref="image" :src="src" :cover="cover" :contain="contain" />
</div>
</message-incoming>
</template>
<script>
import MessageIncoming from "../MessageIncoming.vue";
export default {
name: "MessageIncomingImageExport",
extends: MessageIncoming,
components: { MessageIncoming },
data() {
return {
src: null,
cover: true,
contain: false,
};
},
mounted() {
const info = this.event.getContent().info;
// JPEGs use cover, PNG and GIF ect contain. This is because PNG and GIF are expected to
// be stickers and small emoji type things.
if (info && info.mimetype && info.mimetype.startsWith("image/jp")) {
this.cover = true;
this.contain = false;
} else {
this.cover = false;
this.contain = true;
}
},
beforeDestroy() {
if (this.src) {
const objectUrl = this.src;
this.src = null;
URL.revokeObjectURL(objectUrl);
}
},
};
</script>
<style lang="scss">
@import "@/assets/css/chat.scss";
</style>

27
src/components/messages/export/MessageIncomingVideoExport.vue Normal file
View file

@ -0,0 +1,27 @@
<template>
<message-incoming v-bind="{ ...$props, ...$attrs }" v-on="$listeners">
<div class="bubble image-bubble">
<v-responsive :aspect-ratio="16 / 9" :src="src">
<video :src="src" controls class="w-100 h-100">
{{ $t("fallbacks.video_file") }}
</video>
</v-responsive>
</div>
</message-incoming>
</template>
<script>
import attachmentMixin from "../attachmentMixin";
import MessageIncoming from "../MessageIncoming.vue";
export default {
name: "MessageIncomingVideoExport",
extends: MessageIncoming,
components: { MessageIncoming },
mixins: [attachmentMixin],
};
</script>
<style lang="scss">
@import "@/assets/css/chat.scss";
</style>

21
src/components/messages/export/MessageOutgoingAudioExport.vue Normal file
View file

@ -0,0 +1,21 @@
<template>
<message-outgoing v-bind="{ ...$props, ...$attrs }" v-on="$listeners">
<audio controls :src="src">{{ $t("fallbacks.audio_file") }}</audio>
</message-outgoing>
</template>
<script>
import attachmentMixin from "../attachmentMixin";
import MessageOutgoing from "../MessageOutgoing.vue";
export default {
name: "MessageOutgoingAudioExport",
extends: MessageOutgoing,
components: { MessageOutgoing },
mixins: [attachmentMixin],
};
</script>
<style lang="scss">
@import "@/assets/css/chat.scss";
</style>

47
src/components/messages/export/MessageOutgoingImageExport.vue Normal file
View file

@ -0,0 +1,47 @@
<template>
<message-outgoing v-bind="{ ...$props, ...$attrs }" v-on="$listeners">
<div class="bubble image-bubble">
<v-img :aspect-ratio="16 / 9" ref="image" :src="src" :cover="cover" :contain="contain" />
</div>
</message-outgoing>
</template>
<script>
import MessageOutgoing from "../MessageOutgoing.vue";
export default {
name: "MessageOutgoingImageExport",
extends: MessageOutgoing,
components: { MessageOutgoing },
data() {
return {
src: null,
cover: true,
contain: false,
};
},
mounted() {
const info = this.event.getContent().info;
// JPEGs use cover, PNG and GIF ect contain. This is because PNG and GIF are expected to
// be stickers and small emoji type things.
if (info && info.mimetype && info.mimetype.startsWith("image/jp")) {
this.cover = true;
this.contain = false;
} else {
this.cover = false;
this.contain = true;
}
},
beforeDestroy() {
if (this.src) {
const objectUrl = this.src;
this.src = null;
URL.revokeObjectURL(objectUrl);
}
},
};
</script>
<style lang="scss">
@import "@/assets/css/chat.scss";
</style>

27
src/components/messages/export/MessageOutgoingVideoExport.vue Normal file
View file

@ -0,0 +1,27 @@
<template>
<message-outgoing v-bind="{ ...$props, ...$attrs }" v-on="$listeners">
<div class="bubble image-bubble">
<v-responsive :aspect-ratio="16 / 9" class="ma-0 pa-0">
<video :src="src" controls class="w-100 h-100">
{{ $t("fallbacks.video_file") }}
</video>
</v-responsive>
</div>
</message-outgoing>
</template>
<script>
import attachmentMixin from "../attachmentMixin";
import MessageOutgoing from "../MessageOutgoing.vue";
export default {
name: "MessageOutgoingVideoExport",
extends: MessageOutgoing,
components: { MessageOutgoing },
mixins: [attachmentMixin],
};
</script>
<style lang="scss">
@import "@/assets/css/chat.scss";
</style>