Infrastructure/safetwitch
0
Fork 0
mirror of https://codeberg.org/SafeTwitch/safetwitch.git synced 2025-01-03 11:20:07 -05:00
Code Issues Activity

QOL change

Browse source
This commit is contained in:
dragongoose 2023-03-19 19:51:14 -04:00
parent c31def6221
commit a5f40b4e02
1 changed files with 10 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
frontend/src/components/TwitchChat.vue
View file

@ -27,9 +27,12 @@ export default {
}, },
mounted() { mounted() {
const chatList = this.$refs.chatList as Element const chatList = this.$refs.chatList as Element
const chatStatusMessage = this.$refs.initConnectingStatus as Element
this.ws.onmessage = (message) => { this.ws.onmessage = (message) => {
if (message.data !== 'OK') { if (message.data == 'OK') {
chatStatusMessage.textContent = `Connected to ${this.channelName}`
} else {
this.messages.push(JSON.parse(message.data)) this.messages.push(JSON.parse(message.data))
this.scrollToBottom(chatList) this.scrollToBottom(chatList)
} }
@ -37,7 +40,7 @@ export default {
this.ws.onopen = (data) => { this.ws.onopen = (data) => {
console.log(data) console.log(data)
this.ws.send('JOIN ' + this.props.channelName) this.ws.send('JOIN ' + this.props.channelName?.toLowerCase())
} }
}, },
methods: { methods: {
@ -51,8 +54,11 @@ export default {
} }
</script> </script>
<template> <template>
<div v-if="isLive" class="p-3 bg-ctp-crust rounded-lg w-full max-w-xs flex flex-col"> <div v-if="isLive" class="p-3 bg-ctp-crust rounded-lg w-full max-w-[15.625rem] flex flex-col">
<ul class="overflow-y-scroll h-[82vh]" ref="chatList"> <ul class="overflow-y-scroll h-[46.875rem]" ref="chatList">
<li>
<p ref="initConnectingStatus" class="text-gray-500 text-sm italic"> Connecting to {{ channelName }}.</p>
</li>
<li v-for="message in getChat()" :key="messages.indexOf(message)"> <li v-for="message in getChat()" :key="messages.indexOf(message)">
<div class="text-white inline-flex"> <div class="text-white inline-flex">
<p class="text-sm"> <p class="text-sm">