Add overlay & custom bird color rendering to chatroom & leaderboards
This commit is contained in:
@@ -8,6 +8,7 @@ import { getCookie } from '@/util/cookie'
|
|||||||
import { formatHumanTime } from '@/util/time'
|
import { formatHumanTime } from '@/util/time'
|
||||||
import { faPencil, faTrashCan } from '@fortawesome/free-solid-svg-icons'
|
import { faPencil, faTrashCan } from '@fortawesome/free-solid-svg-icons'
|
||||||
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
|
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
|
||||||
|
import Image from 'next/image'
|
||||||
import { useEffect, useRef, useState } from 'react'
|
import { useEffect, useRef, useState } from 'react'
|
||||||
|
|
||||||
interface WSMessage {
|
interface WSMessage {
|
||||||
@@ -50,8 +51,8 @@ export default function BerryDashChatroom () {
|
|||||||
|
|
||||||
const token = getCookie('accountToken', '-1')
|
const token = getCookie('accountToken', '-1')
|
||||||
if (token !== '-1') {
|
if (token !== '-1') {
|
||||||
setLoggedIn(true)
|
setTimeout(() => setLoggedIn(true), 0)
|
||||||
setToken(token)
|
setTimeout(() => setToken(token), 0)
|
||||||
}
|
}
|
||||||
|
|
||||||
const socket = new WebSocket('/api/ws')
|
const socket = new WebSocket('/api/ws')
|
||||||
@@ -101,7 +102,7 @@ export default function BerryDashChatroom () {
|
|||||||
setMessages([])
|
setMessages([])
|
||||||
}
|
}
|
||||||
|
|
||||||
setWs(socket)
|
setTimeout(() => setWs(socket), 0)
|
||||||
|
|
||||||
return () => {
|
return () => {
|
||||||
socket.close()
|
socket.close()
|
||||||
@@ -130,14 +131,20 @@ export default function BerryDashChatroom () {
|
|||||||
{messages.map(item => {
|
{messages.map(item => {
|
||||||
return (
|
return (
|
||||||
<div key={item.id} className='sub-box2 flex flex-row gap-1'>
|
<div key={item.id} className='sub-box2 flex flex-row gap-1'>
|
||||||
<img
|
<Image
|
||||||
src={
|
src={
|
||||||
!item.customIcon
|
!item.customIcon
|
||||||
? `https://games-r2.lncvrt.xyz/game-assets/berrydash/icons/bird_${
|
? `/api/berrydash/render-icon?icon=${
|
||||||
item.icon == 1
|
item.icon === 1
|
||||||
? GetIconForUser(item.userId)
|
? GetIconForUser(item.userId)
|
||||||
: item.icon
|
: item.icon
|
||||||
}.png`
|
}&overlay=${item.overlay}&birdR=${
|
||||||
|
item.birdColor[0]
|
||||||
|
}&birdG=${item.birdColor[1]}&birdB=${
|
||||||
|
item.birdColor[2]
|
||||||
|
}&overlayR=${item.overlayColor[0]}&overlayG=${
|
||||||
|
item.overlayColor[1]
|
||||||
|
}&overlayB=${item.overlayColor[2]}`
|
||||||
: '/api/berrydash/icon-marketplace/icon?id=' +
|
: '/api/berrydash/icon-marketplace/icon?id=' +
|
||||||
item.customIcon +
|
item.customIcon +
|
||||||
'&raw=true'
|
'&raw=true'
|
||||||
@@ -145,7 +152,9 @@ export default function BerryDashChatroom () {
|
|||||||
className='pointer-events-none'
|
className='pointer-events-none'
|
||||||
width={48}
|
width={48}
|
||||||
height={48}
|
height={48}
|
||||||
></img>
|
alt=''
|
||||||
|
unoptimized={true}
|
||||||
|
/>
|
||||||
<div>
|
<div>
|
||||||
{item.userId == Number(getCookie('accountId', '-1')) && (
|
{item.userId == Number(getCookie('accountId', '-1')) && (
|
||||||
<div className='relative'>
|
<div className='relative'>
|
||||||
|
|||||||
@@ -192,18 +192,24 @@ export default function BerryDashLeaderboards () {
|
|||||||
<Image
|
<Image
|
||||||
src={
|
src={
|
||||||
!item.customIcon
|
!item.customIcon
|
||||||
? `https://games-r2.lncvrt.xyz/game-assets/berrydash/icons/bird_${
|
? `/api/berrydash/render-icon?icon=${
|
||||||
item.icon === 1
|
item.icon === 1
|
||||||
? GetIconForUser(item.id)
|
? GetIconForUser(item.id)
|
||||||
: item.icon
|
: item.icon
|
||||||
}.png`
|
}&overlay=${item.overlay}&birdR=${
|
||||||
|
item.birdColor[0]
|
||||||
|
}&birdG=${item.birdColor[1]}&birdB=${
|
||||||
|
item.birdColor[2]
|
||||||
|
}&overlayR=${item.overlayColor[0]}&overlayG=${
|
||||||
|
item.overlayColor[1]
|
||||||
|
}&overlayB=${item.overlayColor[2]}`
|
||||||
: `/api/berrydash/icon-marketplace/icon?id=${item.customIcon}&raw=true`
|
: `/api/berrydash/icon-marketplace/icon?id=${item.customIcon}&raw=true`
|
||||||
}
|
}
|
||||||
className='pointer-events-none'
|
className='pointer-events-none'
|
||||||
width={48}
|
width={48}
|
||||||
height={48}
|
height={48}
|
||||||
alt=''
|
alt=''
|
||||||
unoptimized
|
unoptimized={true}
|
||||||
/>
|
/>
|
||||||
<p>
|
<p>
|
||||||
{item.username} (#{index + 1})
|
{item.username} (#{index + 1})
|
||||||
|
|||||||
Reference in New Issue
Block a user