CraftAttack/varo-website
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

show death message on dead user hover

Browse Source
This commit is contained in:
bytedream
2025-06-23 20:27:49 +02:00
parent 03ee87d7cf
commit 55f5f25e5a
1 changed files with 13 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

33
src/app/website/index/Teams.svelte
View File

@ -1,5 +1,4 @@
<script lang="ts">
import Skeleton from '@assets/img/steve.png';
import type { GetDeathsRes } from '@db/schema/death.ts';
import { type ActionReturnType, actions } from 'astro:actions';
@ -13,16 +12,18 @@
const entries = teams.map((team) => ({
...team,
memberOne: Object.assign(team.memberOne, {
dead: team.memberOne.id != null ? deaths.findIndex((d) => d.deadUserId === team.memberOne.id) !== -1 : null
deathMessage: deaths.find((d) => d.deadUserId === team.memberOne.id)?.message ?? null
}),
memberTwo: Object.assign(team.memberTwo, {
dead: team.memberTwo.id != null ? deaths.findIndex((d) => d.deadUserId === team.memberTwo.id) !== -1 : null
deathMessage: deaths.find((d) => d.deadUserId === team.memberTwo.id)?.message ?? null
}),
kills: deaths.filter((d) => d.killerUserId === team.memberOne.id || d.killerUserId === team.memberTwo.id).length
}));
entries.sort((a, b) => {
const aAllowed = !!a.memberOne.id && !!a.memberTwo.id && !(a.memberOne.dead && a.memberTwo.dead);
const bAllowed = !!b.memberOne.id && !!b.memberTwo.id && !(b.memberOne.dead && b.memberTwo.dead);
const aAllowed =
!!a.memberOne.id && !!a.memberTwo.id && !(a.memberOne.deathMessage !== null && a.memberTwo.deathMessage !== null);
const bAllowed =
!!b.memberOne.id && !!b.memberTwo.id && !(b.memberOne.deathMessage !== null && b.memberTwo.deathMessage !== null);
if (!aAllowed && !bAllowed) {
return 0;
} else if (!aAllowed || !bAllowed) {
@ -51,7 +52,7 @@
<div class="rounded-sm min-w-3 w-3 min-h-3 h-3" style="background-color: {team.color}"></div>
<h3
class="text-xs sm:text-xl break-all"
class:line-through={team.memberOne.dead && team.memberTwo.dead}
class:line-through={team.memberOne.deathMessage !== null && team.memberTwo.deathMessage !== null}
class:text-red-200={!team.memberOne}
>
{team.name}
@ -62,33 +63,25 @@
{/if}
</td>
<td class="max-w-9 overflow-ellipsis">
<div class="flex items-center gap-x-2">
<div class="flex items-center gap-x-2 w-max tooltip" data-tip={team.memberOne.deathMessage}>
{#if team.memberOne.id != null}
<img
class="h-4 pixelated"
src={team.memberOne.dead ? Skeleton.src : `https://mc-heads.net/head/${team.memberOne.username}/8`}
alt="head"
/>
<img class="h-4 pixelated" src="https://mc-heads.net/head/{team.memberOne.username}/8" alt="head" />
{/if}
<span
class="text-xs sm:text-md break-all"
class:line-through={team.memberOne.dead}
class:line-through={team.memberOne.deathMessage !== null}
class:text-gray-500={team.memberOne.id == null}>{team.memberOne.username}</span
>
</div>
</td>
<td>
<div class="flex items-center gap-x-2">
<div class="flex items-center gap-x-2 w-max tooltip" data-tip={team.memberTwo.deathMessage}>
{#if team.memberTwo.id != null}
<img
class="h-4 pixelated"
src={team.memberTwo.dead ? Skeleton.src : `https://mc-heads.net/head/${team.memberTwo.username}/8`}
alt="head"
/>
<img class="h-4 pixelated" src="https://mc-heads.net/head/{team.memberTwo.username}/8" alt="head" />
{/if}
<span
class="text-xs sm:text-md break-all"
class:line-through={team.memberTwo.dead}
class:line-through={team.memberTwo.deathMessage !== null}
class:text-gray-500={team.memberTwo.id == null}>{team.memberTwo.username}</span
>
</div>