Merge remote-tracking branch 'origin/dev-gui-autoscroll' into dev-gui-autoscroll

This commit is contained in:
DJ2LS 2024-03-07 15:14:49 +01:00
commit 11e51afe07
4 changed files with 15 additions and 28 deletions

View file

@ -2,7 +2,6 @@
// @ts-nocheck // @ts-nocheck
// disable typescript check beacuse of error with beacon histogram options // disable typescript check beacuse of error with beacon histogram options
import chat_conversations from "./chat_conversations.vue"; import chat_conversations from "./chat_conversations.vue";
import chat_messages from "./chat_messages.vue"; import chat_messages from "./chat_messages.vue";
import chat_new_message from "./chat_new_message.vue"; import chat_new_message from "./chat_new_message.vue";
@ -14,8 +13,6 @@ setActivePinia(pinia);
import { useChatStore } from "../store/chatStore.js"; import { useChatStore } from "../store/chatStore.js";
const chat = useChatStore(pinia); const chat = useChatStore(pinia);
import { import {
Chart as ChartJS, Chart as ChartJS,
CategoryScale, CategoryScale,
@ -106,16 +103,18 @@ const beaconHistogramData = computed(() => ({
})); }));
const messagesContainer = ref(null); const messagesContainer = ref(null);
watch(() => chat.scrollTrigger, (newVal, oldVal) => { watch(
//console.log("Trigger changed from", oldVal, "to", newVal); // Debugging line () => chat.scrollTrigger,
nextTick(() => { (newVal, oldVal) => {
if (messagesContainer.value) { //console.log("Trigger changed from", oldVal, "to", newVal); // Debugging line
messagesContainer.value.scrollTop = messagesContainer.value.scrollHeight; nextTick(() => {
} if (messagesContainer.value) {
}); messagesContainer.value.scrollTop =
}); messagesContainer.value.scrollHeight;
}
});
},
);
</script> </script>
<template> <template>
@ -158,7 +157,7 @@ watch(() => chat.scrollTrigger, (newVal, oldVal) => {
</nav> </nav>
<!-- Chat Messages Area --> <!-- Chat Messages Area -->
<div class="flex-grow-1 overflow-auto" ref="messagesContainer"> <div class="flex-grow-1 overflow-auto" ref="messagesContainer">
<chat_messages /> <chat_messages />
</div> </div>

View file

@ -1,6 +1,4 @@
<script setup lang="ts"> <script setup lang="ts">
import { setActivePinia } from "pinia"; import { setActivePinia } from "pinia";
import pinia from "../store/index"; import pinia from "../store/index";
setActivePinia(pinia); setActivePinia(pinia);
@ -26,10 +24,7 @@ function getDateTime(timestampRaw) {
</script> </script>
<template> <template>
<div class="tab-content p-3" id="nav-tabContent-chat-messages">
<div class="tab-content p-3" id="nav-tabContent-chat-messages"
>
<template <template
v-for="(details, callsign, key) in chat.callsign_list" v-for="(details, callsign, key) in chat.callsign_list"
:key="callsign" :key="callsign"

View file

@ -84,9 +84,6 @@ function createSortedMessagesList(data: {
export function newMessage(dxcall, body, attachments) { export function newMessage(dxcall, body, attachments) {
sendFreedataMessage(dxcall, body, attachments); sendFreedataMessage(dxcall, body, attachments);
chatStore.triggerScrollToBottom(); chatStore.triggerScrollToBottom();
} }
/* ------ TEMPORARY DUMMY FUNCTIONS --- */ /* ------ TEMPORARY DUMMY FUNCTIONS --- */

View file

@ -2,23 +2,19 @@ import { defineStore } from "pinia";
import { ref } from "vue"; import { ref } from "vue";
export const useChatStore = defineStore("chatStore", () => { export const useChatStore = defineStore("chatStore", () => {
var callsign_list = ref(); var callsign_list = ref();
var sorted_chat_list = ref(); var sorted_chat_list = ref();
var newChatCallsign = ref(); var newChatCallsign = ref();
var newChatMessage = ref(); var newChatMessage = ref();
/* ------------------------------------------------ */ /* ------------------------------------------------ */
// Scroll to bottom functions // Scroll to bottom functions
const scrollTrigger = ref(0); const scrollTrigger = ref(0);
function triggerScrollToBottom() { function triggerScrollToBottom() {
scrollTrigger.value++; scrollTrigger.value++;
} }
/* ------------------------------------------------ */ /* ------------------------------------------------ */
var chat_filter = ref([ var chat_filter = ref([