From 63c1129aee832c049cb4d7f1bf47f6ba7c29f90f Mon Sep 17 00:00:00 2001 From: Flemmli97 Date: Fri, 20 Dec 2024 17:57:42 +0100 Subject: [PATCH 1/4] fix typing indicator --- src/lib/state/ui/index.ts | 4 +--- src/lib/types/index.ts | 3 ++- 2 files changed, 3 insertions(+), 4 deletions(-) diff --git a/src/lib/state/ui/index.ts b/src/lib/state/ui/index.ts index aaf0b463e..f739a271a 100644 --- a/src/lib/state/ui/index.ts +++ b/src/lib/state/ui/index.ts @@ -171,8 +171,7 @@ class Store { } updateTypingIndicators(chat: Chat) { - let update = chat.typing_indicator.size !== 0 - chat.typing_indicator.update() + let update = chat.typing_indicator.update() if (update) { this.state.chats.update(chats => chats.map(c => (c.id === chat.id ? { ...c, typing_indicator: chat.typing_indicator } : c))) @@ -185,7 +184,6 @@ class Store { } return c }) - chat.typing_indicator.update() } } diff --git a/src/lib/types/index.ts b/src/lib/types/index.ts index 59a3de59c..124db3472 100644 --- a/src/lib/types/index.ts +++ b/src/lib/types/index.ts @@ -233,6 +233,7 @@ export class TypingIndicator { * @returns True if something changed */ update(): boolean { + if (this.size === 0) return false let time = new Date() time.setSeconds(time.getSeconds() - 5) let it = Object.entries(this.typingIndicator) @@ -242,7 +243,7 @@ export class TypingIndicator { obj[id] = date return obj }, {}) - this._size = updated.length > 0 ? 1 : 0 + this._size = updated.length return old_len != this._size } From 827252a2703606d284c3e6789f9c58d70a939483 Mon Sep 17 00:00:00 2001 From: Flemmli97 Date: Mon, 30 Dec 2024 15:19:01 +0100 Subject: [PATCH 2/4] fix multi typing indicator --- src/lib/components/Polling.svelte | 3 +-- src/lib/state/ui/index.ts | 24 ++++++++++-------------- 2 files changed, 11 insertions(+), 16 deletions(-) diff --git a/src/lib/components/Polling.svelte b/src/lib/components/Polling.svelte index 3aed5d4d3..09066f821 100644 --- a/src/lib/components/Polling.svelte +++ b/src/lib/components/Polling.svelte @@ -9,7 +9,6 @@ export let rate: number = 5000 let currentInterval = 100 - let activeChat = get(Store.state.activeChat) async function poll() { // add processes here. updateTypingIndicators() @@ -24,7 +23,7 @@ } async function updateTypingIndicators() { - UIStore.updateTypingIndicators(activeChat) + UIStore.updateTypingIndicators() } onMount(() => { diff --git a/src/lib/state/ui/index.ts b/src/lib/state/ui/index.ts index f739a271a..8f7ca8370 100644 --- a/src/lib/state/ui/index.ts +++ b/src/lib/state/ui/index.ts @@ -170,21 +170,17 @@ class Store { }, 0) } - updateTypingIndicators(chat: Chat) { - let update = chat.typing_indicator.update() - if (update) { - this.state.chats.update(chats => chats.map(c => (c.id === chat.id ? { ...c, typing_indicator: chat.typing_indicator } : c))) - - MainStore.state.activeChat.update(c => { - if (c.id === chat.id) { - return { - ...c, - typing_indicator: chat.typing_indicator, - } - } - return c - }) + updateTypingIndicators() { + let chats = get(this.state.chats) + let updated = false + for (let chat of chats) { + if (chat.typing_indicator.update()) updated = true + } + if (updated) { + this.state.chats.set(chats) } + let active = get(MainStore.state.activeChat) + if (active.typing_indicator.update()) MainStore.state.activeChat.set(active) } useEmoji(emoji: string) { From 8fe85e65a43f48932e35e854b9aadc9c4661fbef Mon Sep 17 00:00:00 2001 From: Flemmli97 Date: Mon, 30 Dec 2024 15:19:14 +0100 Subject: [PATCH 3/4] add typing indicator to multi pics --- .../profile/ProfilePictureMany.svelte | 37 +++++++++++++++++++ src/lib/components/ui/ChatIcon.svelte | 2 +- 2 files changed, 38 insertions(+), 1 deletion(-) diff --git a/src/lib/components/profile/ProfilePictureMany.svelte b/src/lib/components/profile/ProfilePictureMany.svelte index 60649064b..9be5f3ee5 100644 --- a/src/lib/components/profile/ProfilePictureMany.svelte +++ b/src/lib/components/profile/ProfilePictureMany.svelte @@ -9,6 +9,7 @@ export let users: User[] export let size: Size = Size.Medium export let forceSize: boolean = false + export let typing = false const dispatch = createEventDispatcher() @@ -38,6 +39,9 @@ {/if} {/each} + {#if typing} +
+ {/if}
@@ -88,5 +92,38 @@ z-index: 1; } } + + .typing-indicator { + position: absolute; + z-index: 1; + top: 0; + left: 0; + width: 100%; + min-width: 100%; + height: 100%; + min-height: 100%; + display: flex; + align-items: center; + justify-content: center; + border-radius: 50%; + border-top: var(--border-width-more) solid var(--alt-color); + border-right: var(--border-width-more) solid var(--alt-color); + border-bottom: var(--border-width-more) solid var(--alt-color); + border-left: var(--border-width-more) solid var(--color); + transform: translateZ(0); + animation: circle-loader-spin 1s infinite; + + @keyframes circle-loader-spin { + 0% { + transform: rotate(-70deg); + } + 50% { + transform: rotate(170deg); + } + 100% { + transform: rotate(-70deg); + } + } + } } diff --git a/src/lib/components/ui/ChatIcon.svelte b/src/lib/components/ui/ChatIcon.svelte index dc89537ad..22b7bed1c 100644 --- a/src/lib/components/ui/ChatIcon.svelte +++ b/src/lib/components/ui/ChatIcon.svelte @@ -28,5 +28,5 @@ noIndicator={noIndicator} loading={loading} /> {:else} - + 0} size={size} forceSize={forceSize} on:click /> {/if} From 9dfc55b396877b85c1497d65e4ff5a3e21ef31c0 Mon Sep 17 00:00:00 2001 From: Flemmli97 Date: Tue, 31 Dec 2024 12:27:19 +0100 Subject: [PATCH 4/4] disable typing for group --- src/lib/components/ui/ChatIcon.svelte | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/lib/components/ui/ChatIcon.svelte b/src/lib/components/ui/ChatIcon.svelte index 22b7bed1c..dc89537ad 100644 --- a/src/lib/components/ui/ChatIcon.svelte +++ b/src/lib/components/ui/ChatIcon.svelte @@ -28,5 +28,5 @@ noIndicator={noIndicator} loading={loading} /> {:else} - 0} size={size} forceSize={forceSize} on:click /> + {/if}