From f513de6819925b5714e270ccdc23f5c01d0410eb Mon Sep 17 00:00:00 2001 From: dragongoose Date: Sun, 30 Jul 2023 19:14:12 -0400 Subject: [PATCH] FIx ban and timeout messages and add chat history --- src/assets/messageParser.ts | 39 ++++++++++++++++++++++++++++++++++- src/components/TwitchChat.vue | 14 ++++++++++++- src/locales | 2 +- src/types/Chat.ts | 12 +++++++++++ 4 files changed, 64 insertions(+), 3 deletions(-) diff --git a/src/assets/messageParser.ts b/src/assets/messageParser.ts index e12eb32..e2f7bba 100644 --- a/src/assets/messageParser.ts +++ b/src/assets/messageParser.ts @@ -1,5 +1,6 @@ import type { Badge, ParsedMessage } from './types' -import { getBadgesFromMessage } from './badges' +import { getBadges, getBadgesFromMessage } from './badges' +import type { StreamMessage } from '@/types' export function parseMessage(messageData: any, allBadges: Badge[]): ParsedMessage { const message = JSON.parse(messageData) @@ -50,6 +51,20 @@ export function parseMessage(messageData: any, allBadges: Badge[]): ParsedMessag } } } + case 'CLEARCHAT': { + let duration = message.tags['@ban-duration'] + if (!message.tags['@ban-duration']) { + duration = 0 + } + + return { + type: 'CLEARCHAT', + data: { + username: message.message.replace(/(\r\n|\n|\r)/gm, ""), + duration + } + } + } // Add more cases for other message types here default: { return { @@ -59,3 +74,25 @@ export function parseMessage(messageData: any, allBadges: Badge[]): ParsedMessag } } } + +export function parseChatHistory(messages: StreamMessage[], badges: Badge[]) { + let parsedMessages = [] + + for (let i = 0; i < messages.length; i++) { + const message = messages[i] + + const data: ParsedMessage = { + type: 'PRIVMSG', + data: { + message: message.message, + username: message.username, + color: message.color, + badges: getBadges(badges, message.badges) + } + } + + parsedMessages.push(data) + } + + return parsedMessages +} diff --git a/src/components/TwitchChat.vue b/src/components/TwitchChat.vue index f0eb8b4..546638d 100644 --- a/src/components/TwitchChat.vue +++ b/src/components/TwitchChat.vue @@ -3,7 +3,7 @@ import { ref, inject } from 'vue' import BadgeVue from './ChatBadge.vue' import { getBadges } from '@/assets/badges' -import { parseMessage } from '@/assets/messageParser' +import { parseMessage, parseChatHistory } from '@/assets/messageParser' import { getEndpoint } from '@/mixins' import type { Badge, ParsedMessage } from '@/assets/types' @@ -42,6 +42,7 @@ export default { } }, async mounted() { + if (!this.$props.isVod) { const chatStatusMessage = this.$refs.initConnectingStatus as Element this.ws!.onmessage = (message) => { @@ -58,6 +59,12 @@ export default { this.ws!.send('JOIN ' + this.$props.channelName?.toLowerCase()) } } + + await getEndpoint(`api/chat/${this.$props.channelName}/history`) + .then((data) => { + this.messages = parseChatHistory(data, this.badges) + }) + }, beforeUnmount() { this.ws?.close() @@ -182,6 +189,11 @@ export default {

{{ $t("chat.resub", { username: message.data.username, duration : message.data.months }) }}

+
+

{{ $t("chat.banned", { username: message.data.username }) }}

+

{{ $t("chat.timeout", { username: message.data.username, duration: message.data.duration }) }}

+
+
{{ message }}
diff --git a/src/locales b/src/locales index 1d5cb5d..10d7cc0 160000 --- a/src/locales +++ b/src/locales @@ -1 +1 @@ -Subproject commit 1d5cb5d2208ad9b9134ab970d68033ccf4e9ef27 +Subproject commit 10d7cc027c65e925ff943c566155496c65789c54 diff --git a/src/types/Chat.ts b/src/types/Chat.ts index b964492..b167226 100644 --- a/src/types/Chat.ts +++ b/src/types/Chat.ts @@ -16,3 +16,15 @@ export interface Metadata { message: string tags: { [k: string]: any } } + +export interface StreamMessageBadge { + version: string + setId: string +} + +export interface StreamMessage { + message: string + username: string + color: string + badges: StreamMessageBadge[] +}