diff --git a/package.json b/package.json index b2fa6a14..ab8bf470 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "mage-website", - "version": "0.0.9", + "version": "0.0.10", "license": "GPL-3.0", "private": true, "type": "module", @@ -53,7 +53,7 @@ "@tailwindcss/aspect-ratio": "^0.4.2", "@tailwindcss/typography": "^0.5.9", "animate.css": "^4.1.1", - "daisyui": "^3.1.0", + "daisyui": "^3.2.1", "emoji-picker-element": "^1.18.1", "nprogress": "^0.2.0", "playwright-e2e-coverage-report": "^1.0.28", diff --git a/src/lib/components/Channel/Chat/ChatInput.svelte b/src/lib/components/Channel/Chat/ChatInput.svelte index 127f654f..9545e01e 100644 --- a/src/lib/components/Channel/Chat/ChatInput.svelte +++ b/src/lib/components/Channel/Chat/ChatInput.svelte @@ -8,8 +8,9 @@ import EmojiPicker from '$lib/components/Channel/Chat/EmojiPicker.svelte' import GifPicker from '$lib/components/Channel/Chat/GifPicker.svelte' - export let channel: any - export let users: any + export let channel: any, + viewers: any[] = [] + let selectedCommand = 0 let selectedUser = 0 let inputBox: any = null @@ -19,14 +20,18 @@ $channel_connection === `open-${channel._id}` && $page.data.user?.userId $: isHost = channel.user === $page.data.user?.userId + $: viewersWithOutHost = viewers.filter((viewer) => viewer.userId !== channel.user) + function insert(str: string, index: number, value: string) { return str.substr(0, index) + value + str.substr(index) } const sendMessage = () => { - if (messageIsCommand) { - if (selectedCommand && selectedUser >= 0) { - const user = users[selectedUser] + if (messageIsCommand && !chatMessage.startsWith('/ai ')) { + if (selectedCommand) { + const usernameFromMsg = chatMessage.substring(chatMessage.indexOf('@') + 1) + const user = viewersWithOutHost.find((viewer: any) => viewer.username === usernameFromMsg) + if (!user) return executeCommand(selectedCommand, user.userId) } } else if (!chatMessage.startsWith('/') || chatMessage.startsWith('/ai')) { @@ -55,15 +60,15 @@ } const slectCommandfromKey = (key: string) => { - if (key === 'ArrowDown' && selectedCommand < 3) { + if (key === 'ArrowDown' && selectedCommand < 4) { selectedCommand++ - } else if (key === 'ArrowUp' && selectedCommand >= 1) { + } else if (key === 'ArrowUp' && selectedCommand >= 2) { selectedCommand-- } } const slectUserfromKey = (key: string) => { - if (key === 'ArrowDown' && selectedUser < users.length) { + if (key === 'ArrowDown' && selectedUser < viewers.length) { selectedUser++ } else if (key === 'ArrowUp' && selectedUser >= 0) { selectedUser-- @@ -109,6 +114,7 @@ // toggle commands handlers const toggleBan = (userId: string) => { + if (channel.user === userId) return let isEnabled = false if (!channel.bans.includes(userId)) { channel.bans.push(userId) @@ -126,6 +132,7 @@ } const toggleMod = (userId: string) => { + if (channel.user === userId) return if (!channel.bans.includes(userId)) { let isEnabled = false if (!channel.mods?.includes(userId)) { @@ -143,6 +150,7 @@ } const toggleGuest = (userId: string) => { + if (channel.user === userId) return if (!channel.bans.includes(userId)) { let isEnabled = false if (!channel.guests.includes(userId) && channel.guests.length < 9) { @@ -187,16 +195,14 @@ ] $: messageIsCommand = - chatMessage && - chatMessage.startsWith('/') && - /[a-z] @[a-z]/.test(chatMessage.substr(1)) && - chatMessage.startsWith('/ai ') + chatMessage && chatMessage.startsWith('/') && /[a-z] @[a-z]/.test(chatMessage.substr(1)) $: showUsers = chatMessage && chatMessage.endsWith('@') $: showCommandOptions = chatMessage && chatMessage.startsWith('/') && !chatMessage.startsWith('/ai ') && + !chatMessage.includes('@') && (channel.user === $page.data.user?.userId || channel.mods?.includes($page.data.user?.userId)) && !showUsers @@ -253,12 +259,12 @@ {/if} - {#if users.length > 0 && showUsers} + {#if viewersWithOutHost.length > 0 && showUsers}
diff --git a/src/lib/components/Channel/Stream/DropdownViewers.svelte b/src/lib/components/Channel/Stream/DropdownViewers.svelte
index 53cf13a9..8ebe394f 100644
--- a/src/lib/components/Channel/Stream/DropdownViewers.svelte
+++ b/src/lib/components/Channel/Stream/DropdownViewers.svelte
@@ -40,7 +40,13 @@
user.coloredRole = getColoredRole(role)
return user
})
- viewers = users
+ viewers = users.reduce((acc: any, cur: any) => {
+ let username = cur.username.toLowerCase()
+ if (!acc.find((viewer: any) => viewer.username.toLowerCase() === username)) {
+ acc.push(cur)
+ }
+ return acc
+ }, [])
cursor = parsedMsg.cursor
}
diff --git a/src/lib/components/Channel/Stream/StreamContainer.svelte b/src/lib/components/Channel/Stream/StreamContainer.svelte
index bd9bd039..41bbf900 100644
--- a/src/lib/components/Channel/Stream/StreamContainer.svelte
+++ b/src/lib/components/Channel/Stream/StreamContainer.svelte
@@ -14,7 +14,8 @@
export let userCount: number = 1,
channel: any,
channels: any = [],
- isHostOrGuest: boolean = false
+ isHostOrGuest: boolean = false,
+ viewers: any[] = []
$: isChannelSocketConnected = $channel_connection === `open-${channel._id}`
@@ -63,7 +64,7 @@