From 7d0294e8089e4dd4ed4bcb8d09edaa5a1aaaf72a Mon Sep 17 00:00:00 2001 From: SauceyRed Date: Tue, 5 Aug 2025 03:35:45 +0200 Subject: [PATCH] wip: start work on members list placeholders --- .../[serverId]/channels/[channelId].vue | 30 +++++++++++++++++-- 1 file changed, 28 insertions(+), 2 deletions(-) diff --git a/pages/servers/[serverId]/channels/[channelId].vue b/pages/servers/[serverId]/channels/[channelId].vue index 07ea532..b2e0782 100644 --- a/pages/servers/[serverId]/channels/[channelId].vue +++ b/pages/servers/[serverId]/channels/[channelId].vue @@ -24,7 +24,8 @@ border-sides="left" local-storage-name="membersListWidth">
- + +
@@ -49,6 +50,7 @@ const channels = ref(); const channel = ref(); const members = ref(); +const totalMemberCount = ref(0); const showInvitePopup = ref(false); const showGuildSettings = ref(false); @@ -65,6 +67,16 @@ onMounted(async () => { console.log("fetched guild"); await setArrayVariables(); console.log("set array variables"); + const membersList = document.getElementById("members-list"); + if (membersList) { + membersList.addEventListener("scroll", (e) => { + if (e.target && e.target instanceof Element) { + if (isVisible(e.target)) { + + } + } + }); + } }); onActivated(async () => { @@ -79,7 +91,7 @@ onActivated(async () => { async function setArrayVariables() { const membersRes = await fetchMembers(route.params.serverId as string); members.value = membersRes.objects; - members.value = await fetchMembers(route.params.serverId as string); + totalMemberCount.value = (membersRes.amount * membersRes.pages) - membersRes.amount; console.log("Placeholder count:", totalMemberCount.value); const guildUrl = `guilds/${route.params.serverId}`; channels.value = await fetchWithApi(`${guildUrl}/channels`); @@ -100,6 +112,20 @@ function toggleInvitePopup(e: Event) { function handleMemberClick(member: GuildMemberResponse) { } + +function isVisible(element: Element) { + const rect = element.getBoundingClientRect(); + return ( + rect.top >= 0 && + rect.left >= 0 && + rect.bottom <= ( + window.innerHeight || + document.documentElement.clientHeight) && + rect.right <= ( + window.innerWidth || + document.documentElement.clientWidth) + ); +}