projects/hypixel-stats
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Updated bedears stats

Browse Source
This commit is contained in:
Taken
2025-08-19 19:39:36 +02:00
parent ecc0098fb8
commit f8a54dc4b6
13 changed files with 276 additions and 187 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
src/app/(stats)/player/[ign]/_stats/bedwars/bedwars-components.tsx Normal file
View File

@@ -0,0 +1,24 @@
import { getBedwarsStar, getTextColor } from "@/lib/hypixel/bedwars"
import { getBWLevelForExp } from "@/lib/hypixel/bedwarsLevel"
import { bedwarsLevelColors } from "@/lib/hypixelFormatters"
import Multicolored from "../../_components/Multicolored"
export function BedwarsLevel({ xp }: { xp: number }) {
const level = getBWLevelForExp(xp)
const color = bedwarsLevelColors(level)
const star = getBedwarsStar(level)
const val = `[${level}${star}]`
return <Multicolored val={val} color={color} />
}
export function BedwarsProgress({ level, percent }: { level: number, percent: number }) {
return (
<div className="flex items-center mb-10">
<div className={`mr-2 text-mc-${getTextColor(level)}`}>{level}</div>
<div className={`h-5 bg-mc-${getTextColor(level)} rounded-l-md`} style={{ width: `${percent}%` }}></div>
<div className="flex-1 h-5 rounded-r-md bg-background"></div>
<div className={`ml-2 text-mc-${getTextColor(level)}`}>{level + 1}</div>
</div>
)
}

49
src/app/(stats)/player/[ign]/_components/stats/bedewars.tsx → src/app/(stats)/player/[ign]/_stats/bedwars/bedwars.tsx
View File

@@ -2,15 +2,15 @@
import { Card, CardContent } from "@/components/ui/card"
import { Collapsible, CollapsibleContent, CollapsibleTrigger } from "@/components/ui/collapsible"
import { getBedwarsStar } from "@/lib/hypixel/bedwars"
import { getBWLevelForExp } from "@/lib/hypixel/bedwarsLevel"
import { bedwarsLevelColors } from "@/lib/hypixelFormatters"
import { getBedwarsStar, getPrestigeName, getTextColor } from "@/lib/hypixel/bedwars"
import { getBWLevelForExp, getTotalExpForLevel } from "@/lib/hypixel/bedwarsLevel"
import { getProgress } from "@/lib/hypixel/general"
import { Player } from "@/lib/schema/player"
import { Separator } from "@radix-ui/react-separator"
import { ChevronDown, ChevronUp, Menu } from "lucide-react"
import { useEffect, useRef, useState } from "react"
import CollapsedStats from "../CollapsedStats"
import Multicolored from "../Multicolored"
import CollapsedStats from "../../_components/CollapsedStats"
import { BedwarsLevel, BedwarsProgress } from "./bedwars-components"
export default function BedwarsStats({ stats }: { stats: Player["player"]["stats"]["Bedwars"] }) {
const ref = useRef<HTMLDivElement>(null)
@@ -42,6 +42,13 @@ export default function BedwarsStats({ stats }: { stats: Player["player"]["stats
const fkd = (stats.final_kills_bedwars / stats.final_deaths_bedwars).toFixed(2)
const wl = (stats.wins_bedwars / stats.losses_bedwars).toFixed(2)
const bbl = (stats.beds_broken_bedwars / stats.beds_lost_bedwars).toFixed(2)
const level = getBWLevelForExp(stats.Experience)
const percent = getProgress(
getTotalExpForLevel(level),
stats.Experience,
getTotalExpForLevel(level + 1)
)
return (
<Card>
@@ -88,18 +95,32 @@ export default function BedwarsStats({ stats }: { stats: Player["player"]["stats
</div>
<CollapsibleContent>
<Separator className="my-4" />
<BedwarsProgress level={level} percent={percent} />
<div>
<div>
<div>
<p>
<span className="font-bold">{"Level: "}</span>
<span>{`${level}.${percent.toFixed(0)}`}</span>
</p>
<p>
<span className="font-bold">{"Prestige: "}</span>
<span className={`text-mc-${getTextColor(level)}`}>
{`${getPrestigeName(level)} ${getBedwarsStar(level)}`}
</span>
</p>
<p>
<span className="font-bold">{"Tokens: "}</span>
<span className="text-mc-dark-green">{}</span>
</p>
</div>
</div>
<div></div>
<div></div>
</div>
</CollapsibleContent>
</Collapsible>
</CardContent>
</Card>
)
}
function BedwarsLevel({ xp }: { xp: number }) {
const level = getBWLevelForExp(xp)
const color = bedwarsLevelColors(level)
const star = getBedwarsStar(level)
const val = `[${level}${star}]`
return <Multicolored val={val} color={color} />
}

2
src/app/(stats)/player/[ign]/page.tsx
View File

@@ -4,7 +4,7 @@ import { getUuid } from "@/lib/hypixel/api/mojang"
import { getPlayer } from "@/lib/hypixel/api/player"
import { getExactLevel } from "@/lib/hypixel/level"
import Sidebar from "./_components/Sidebar"
import BedwarsStats from "./_components/stats/bedewars"
import BedwarsStats from "./_stats/bedwars/bedwars"
export default async function PlayerPage({
params

243
src/app/globals.css
View File

@@ -4,138 +4,137 @@
@custom-variant dark (&:is(.dark *));
@theme inline {
--color-mc-black: #000000;
--color-mc-dark-blue: #0000AA;
--color-mc-dark-green: #00AA00;
--color-mc-dark-aqua: #00AAAA;
--color-mc-dark-red: #AA0000;
--color-mc-dark-purple: #AA00AA;
--color-mc-gold: #FFAA00;
--color-mc-gray: #AAAAAA;
--color-mc-light-gray: #C6C6C6;
--color-mc-dark-gray: #555555;
--color-mc-blue: #5555FF;
--color-mc-green: #55FF55;
--color-mc-aqua: #55FFFF;
--color-mc-red: #FF5555;
--color-mc-light-purple: #FF55FF;
--color-mc-yellow: #FFFF55;
--color-mc-white: #FFFFFF;
--color-mc-black: #000000;
--color-mc-dark-blue: #0000AA;
--color-mc-dark-green: #00AA00;
--color-mc-dark-aqua: #00AAAA;
--color-mc-dark-red: #AA0000;
--color-mc-dark-purple: #AA00AA;
--color-mc-gold: #FFAA00;
--color-mc-gray: #AAAAAA;
--color-mc-dark-gray: #555555;
--color-mc-blue: #5555FF;
--color-mc-green: #55FF55;
--color-mc-aqua: #55FFFF;
--color-mc-red: #FF5555;
--color-mc-light-purple: #FF55FF;
--color-mc-yellow: #FFFF55;
--color-mc-white: #FFFFFF;
}
@theme inline {
--radius-sm: calc(var(--radius) - 4px);
--radius-md: calc(var(--radius) - 2px);
--radius-lg: var(--radius);
--radius-xl: calc(var(--radius) + 4px);
--color-background: var(--background);
--color-foreground: var(--foreground);
--color-card: var(--card);
--color-card-foreground: var(--card-foreground);
--color-popover: var(--popover);
--color-popover-foreground: var(--popover-foreground);
--color-primary: var(--primary);
--color-primary-foreground: var(--primary-foreground);
--color-secondary: var(--secondary);
--color-secondary-foreground: var(--secondary-foreground);
--color-muted: var(--muted);
--color-muted-foreground: var(--muted-foreground);
--color-accent: var(--accent);
--color-accent-foreground: var(--accent-foreground);
--color-destructive: var(--destructive);
--color-border: var(--border);
--color-input: var(--input);
--color-ring: var(--ring);
--color-chart-1: var(--chart-1);
--color-chart-2: var(--chart-2);
--color-chart-3: var(--chart-3);
--color-chart-4: var(--chart-4);
--color-chart-5: var(--chart-5);
--color-sidebar: var(--sidebar);
--color-sidebar-foreground: var(--sidebar-foreground);
--color-sidebar-primary: var(--sidebar-primary);
--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
--color-sidebar-accent: var(--sidebar-accent);
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
--color-sidebar-border: var(--sidebar-border);
--color-sidebar-ring: var(--sidebar-ring);
--radius-sm: calc(var(--radius) - 4px);
--radius-md: calc(var(--radius) - 2px);
--radius-lg: var(--radius);
--radius-xl: calc(var(--radius) + 4px);
--color-background: var(--background);
--color-foreground: var(--foreground);
--color-card: var(--card);
--color-card-foreground: var(--card-foreground);
--color-popover: var(--popover);
--color-popover-foreground: var(--popover-foreground);
--color-primary: var(--primary);
--color-primary-foreground: var(--primary-foreground);
--color-secondary: var(--secondary);
--color-secondary-foreground: var(--secondary-foreground);
--color-muted: var(--muted);
--color-muted-foreground: var(--muted-foreground);
--color-accent: var(--accent);
--color-accent-foreground: var(--accent-foreground);
--color-destructive: var(--destructive);
--color-border: var(--border);
--color-input: var(--input);
--color-ring: var(--ring);
--color-chart-1: var(--chart-1);
--color-chart-2: var(--chart-2);
--color-chart-3: var(--chart-3);
--color-chart-4: var(--chart-4);
--color-chart-5: var(--chart-5);
--color-sidebar: var(--sidebar);
--color-sidebar-foreground: var(--sidebar-foreground);
--color-sidebar-primary: var(--sidebar-primary);
--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
--color-sidebar-accent: var(--sidebar-accent);
--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
--color-sidebar-border: var(--sidebar-border);
--color-sidebar-ring: var(--sidebar-ring);
}
:root {
--radius: 0.625rem;
--background: oklch(1 0 0);
--foreground: oklch(0.145 0 0);
--card: oklch(1 0 0);
--card-foreground: oklch(0.145 0 0);
--popover: oklch(1 0 0);
--popover-foreground: oklch(0.145 0 0);
--primary: oklch(0.205 0 0);
--primary-foreground: oklch(0.985 0 0);
--secondary: oklch(0.97 0 0);
--secondary-foreground: oklch(0.205 0 0);
--muted: oklch(0.97 0 0);
--muted-foreground: oklch(0.556 0 0);
--accent: oklch(0.97 0 0);
--accent-foreground: oklch(0.205 0 0);
--destructive: oklch(0.577 0.245 27.325);
--border: oklch(0.922 0 0);
--input: oklch(0.922 0 0);
--ring: oklch(0.708 0 0);
--chart-1: oklch(0.646 0.222 41.116);
--chart-2: oklch(0.6 0.118 184.704);
--chart-3: oklch(0.398 0.07 227.392);
--chart-4: oklch(0.828 0.189 84.429);
--chart-5: oklch(0.769 0.188 70.08);
--sidebar: oklch(0.985 0 0);
--sidebar-foreground: oklch(0.145 0 0);
--sidebar-primary: oklch(0.205 0 0);
--sidebar-primary-foreground: oklch(0.985 0 0);
--sidebar-accent: oklch(0.97 0 0);
--sidebar-accent-foreground: oklch(0.205 0 0);
--sidebar-border: oklch(0.922 0 0);
--sidebar-ring: oklch(0.708 0 0);
--radius: 0.625rem;
--background: oklch(1 0 0);
--foreground: oklch(0.145 0 0);
--card: oklch(1 0 0);
--card-foreground: oklch(0.145 0 0);
--popover: oklch(1 0 0);
--popover-foreground: oklch(0.145 0 0);
--primary: oklch(0.205 0 0);
--primary-foreground: oklch(0.985 0 0);
--secondary: oklch(0.97 0 0);
--secondary-foreground: oklch(0.205 0 0);
--muted: oklch(0.97 0 0);
--muted-foreground: oklch(0.556 0 0);
--accent: oklch(0.97 0 0);
--accent-foreground: oklch(0.205 0 0);
--destructive: oklch(0.577 0.245 27.325);
--border: oklch(0.922 0 0);
--input: oklch(0.922 0 0);
--ring: oklch(0.708 0 0);
--chart-1: oklch(0.646 0.222 41.116);
--chart-2: oklch(0.6 0.118 184.704);
--chart-3: oklch(0.398 0.07 227.392);
--chart-4: oklch(0.828 0.189 84.429);
--chart-5: oklch(0.769 0.188 70.08);
--sidebar: oklch(0.985 0 0);
--sidebar-foreground: oklch(0.145 0 0);
--sidebar-primary: oklch(0.205 0 0);
--sidebar-primary-foreground: oklch(0.985 0 0);
--sidebar-accent: oklch(0.97 0 0);
--sidebar-accent-foreground: oklch(0.205 0 0);
--sidebar-border: oklch(0.922 0 0);
--sidebar-ring: oklch(0.708 0 0);
}
.dark {
--background: oklch(0.145 0 0);
--foreground: oklch(0.985 0 0);
--card: oklch(0.205 0 0);
--card-foreground: oklch(0.985 0 0);
--popover: oklch(0.205 0 0);
--popover-foreground: oklch(0.985 0 0);
--primary: oklch(0.922 0 0);
--primary-foreground: oklch(0.205 0 0);
--secondary: oklch(0.269 0 0);
--secondary-foreground: oklch(0.985 0 0);
--muted: oklch(0.269 0 0);
--muted-foreground: oklch(0.708 0 0);
--accent: oklch(0.269 0 0);
--accent-foreground: oklch(0.985 0 0);
--destructive: oklch(0.704 0.191 22.216);
--border: oklch(1 0 0 / 10%);
--input: oklch(1 0 0 / 15%);
--ring: oklch(0.556 0 0);
--chart-1: oklch(0.488 0.243 264.376);
--chart-2: oklch(0.696 0.17 162.48);
--chart-3: oklch(0.769 0.188 70.08);
--chart-4: oklch(0.627 0.265 303.9);
--chart-5: oklch(0.645 0.246 16.439);
--sidebar: oklch(0.205 0 0);
--sidebar-foreground: oklch(0.985 0 0);
--sidebar-primary: oklch(0.488 0.243 264.376);
--sidebar-primary-foreground: oklch(0.985 0 0);
--sidebar-accent: oklch(0.269 0 0);
--sidebar-accent-foreground: oklch(0.985 0 0);
--sidebar-border: oklch(1 0 0 / 10%);
--sidebar-ring: oklch(0.556 0 0);
--background: oklch(0.145 0 0);
--foreground: oklch(0.985 0 0);
--card: oklch(0.205 0 0);
--card-foreground: oklch(0.985 0 0);
--popover: oklch(0.205 0 0);
--popover-foreground: oklch(0.985 0 0);
--primary: oklch(0.922 0 0);
--primary-foreground: oklch(0.205 0 0);
--secondary: oklch(0.269 0 0);
--secondary-foreground: oklch(0.985 0 0);
--muted: oklch(0.269 0 0);
--muted-foreground: oklch(0.708 0 0);
--accent: oklch(0.269 0 0);
--accent-foreground: oklch(0.985 0 0);
--destructive: oklch(0.704 0.191 22.216);
--border: oklch(1 0 0 / 10%);
--input: oklch(1 0 0 / 15%);
--ring: oklch(0.556 0 0);
--chart-1: oklch(0.488 0.243 264.376);
--chart-2: oklch(0.696 0.17 162.48);
--chart-3: oklch(0.769 0.188 70.08);
--chart-4: oklch(0.627 0.265 303.9);
--chart-5: oklch(0.645 0.246 16.439);
--sidebar: oklch(0.205 0 0);
--sidebar-foreground: oklch(0.985 0 0);
--sidebar-primary: oklch(0.488 0.243 264.376);
--sidebar-primary-foreground: oklch(0.985 0 0);
--sidebar-accent: oklch(0.269 0 0);
--sidebar-accent-foreground: oklch(0.985 0 0);
--sidebar-border: oklch(1 0 0 / 10%);
--sidebar-ring: oklch(0.556 0 0);
}
@layer base {
* {
@apply border-border outline-ring/50;
}
* {
@apply border-border outline-ring/50;
}
body {
@apply bg-background text-foreground;
}
}
body {
@apply bg-background text-foreground;
}
}