adamf/web_server
1
1
Fork 0
Code Issues 5 Pull Requests Actions Packages Projects Releases Wiki Activity

Make images and video smaller in chat
All checks were successful
Deploy with Docker Compose / deploy (push) Successful in 55s
Details

Browse Source
This commit is contained in:
Adam French
2026-03-17 00:53:37 +00:00
parent c1ce3c31ba
commit a0215f7810
1 changed files with 92 additions and 99 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
nginx/vue/src/components/util/Chat.vue
View File

@@ -15,8 +15,7 @@ const fileInput = ref(null);
function scrollToBottom() { function scrollToBottom() {
nextTick(() => { nextTick(() => {
if (messagesContainer.value) { if (messagesContainer.value) {
messagesContainer.value.scrollTop = messagesContainer.value.scrollTop = messagesContainer.value.scrollHeight;
messagesContainer.value.scrollHeight;
} }
}); });
} }
@@ -99,29 +98,23 @@ onUnmounted(() => {
> >
<span v-else>{{ part.value }}</span> <span v-else>{{ part.value }}</span>
</template> </template>
<template <template v-if="message.fileUrl && isSafeFileUrl(message.fileUrl)">
v-if="message.fileUrl && isSafeFileUrl(message.fileUrl)"
>
<img <img
v-if="isImageUrl(message.fileUrl)" v-if="isImageUrl(message.fileUrl)"
:src="message.fileUrl" :src="message.fileUrl"
class="max-w-xs max-h-48 rounded" class="w-full max-h-48 rounded"
@load="scrollToBottom" @load="scrollToBottom"
/> />
<video <video
v-else-if="isVideoUrl(message.fileUrl)" v-else-if="isVideoUrl(message.fileUrl)"
:src="message.fileUrl" :src="message.fileUrl"
controls controls
class="max-w-xs max-h-48 rounded" class="w-full max-h-48 rounded"
@loadedmetadata="scrollToBottom" @loadedmetadata="scrollToBottom"
/> />
<a <a v-else :href="message.fileUrl" target="_blank" class="underline">{{
v-else message.fileUrl.split("/").pop()
:href="message.fileUrl" }}</a>
target="_blank"
class="underline"
>{{ message.fileUrl.split("/").pop() }}</a
>
</template> </template>
</p> </p>
</div> </div>