dragongoose/safetwitch
1
0
Fork 0
mirror of https://codeberg.org/dragongoose/safetwitch.git synced 2024-09-30 03:27:55 +00:00
Code Issues Projects Releases Packages Wiki Activity

add padding to chat and refactor badge system

Browse source
This commit is contained in:
dragongoose 2023-04-04 09:01:18 -04:00
parent 0706aaee42
commit e322b2b567
1 changed files with 9 additions and 27 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

36
src/components/TwitchChat.vue
View file

@ -1,14 +1,8 @@
<script lang="ts">
import { ref, type Ref } from 'vue'
import BadgeVue from './ChatBadge.vue'
interface Badge {
id: string,
title: string,
setId: string,
version: string,
images: { [k:string]: string }
}
import { getBadges } from '@/assets/badges'
import type { Badge } from '@/assets/types'
export default {
props: {
@ -52,7 +46,6 @@ export default {
chatStatusMessage.textContent = `Connected to ${this.channelName}`
} else {
this.messages.push(JSON.parse(message.data))
this.getBadges(JSON.parse(message.data))
this.clearMessages()
this.scrollToBottom(chatList)
}
@ -75,26 +68,15 @@ export default {
}
},
getBadges(message: { username: string, channel: string, message: string, messageType: string, tags: Record<string, string> }) {
let badgesString = message.tags.badges
let badgesString = message.tags.badges;
if (!badgesString) return;
let badges = badgesString.split(',')
let badges = badgesString.split(',');
let formatedBadges = badges.map((badgeWithVersion) => {
const [setId, version] = badgeWithVersion.split('/')
return { setId, version }
})
const [setId, version] = badgeWithVersion.split('/');
return { setId, version };
});
const foundBadges = []
for(let badgeToFind of formatedBadges) {
const badge = this.badges
.filter((badge) => badge.setId === badgeToFind.setId)
.find((badge) => badge.version === badgeToFind.version);
if(badge)
foundBadges.push(badge)
}
return foundBadges
return getBadges(this.badges, formatedBadges);
}
},
components: {
@ -107,7 +89,7 @@ export default {
<!-- SYSTEM MESSAGES -->
<ul
class="overflow-y-scroll overflow-x-hidden whitespace-pre-wrap h-[46.875rem]"
class="overflow-y-scroll overflow-x-hidden space-y-1 whitespace-pre-wrap h-[46.875rem]"
ref="chatList"
>
<li>