Why tf
This commit is contained in:
236
đ
236
đ
@@ -1,236 +0,0 @@
|
|||||||
import { formatNumber } from "@/lib/formatters"
|
|
||||||
import { getSkywarsLevel } from "@/lib/hypixel/skywars/level"
|
|
||||||
import { getPrestige, getSkyWarsIcon } from "@/lib/hypixel/skywars/skywars"
|
|
||||||
import { cn } from "@/lib/utils"
|
|
||||||
import GenericProgress from "../../_components/GenericProgress"
|
|
||||||
import { HeadsBar, PresigeousHeads } from "./client"
|
|
||||||
|
|
||||||
type SkywarsHeadsProps = {
|
|
||||||
heads: number
|
|
||||||
heads_special: {
|
|
||||||
eww: number
|
|
||||||
yucky: number
|
|
||||||
meh: number
|
|
||||||
decent: number
|
|
||||||
salty: number
|
|
||||||
tasty: number
|
|
||||||
succulent: number
|
|
||||||
sweet: number
|
|
||||||
divine: number
|
|
||||||
heavenly: number
|
|
||||||
}
|
|
||||||
prestigeous: { username: string, timestamp: number, sacrifice: string }[]
|
|
||||||
}
|
|
||||||
|
|
||||||
export function SkywarsHeads({
|
|
||||||
heads,
|
|
||||||
heads_special,
|
|
||||||
prestigeous
|
|
||||||
}: SkywarsHeadsProps) {
|
|
||||||
const total_special = Object.values(heads_special).reduce((a, b) => a + b)
|
|
||||||
const percentages = {
|
|
||||||
heavenly: heads_special.heavenly,
|
|
||||||
divine: heads_special.divine,
|
|
||||||
sweet: heads_special.sweet,
|
|
||||||
succulent: heads_special.succulent,
|
|
||||||
tasty: heads_special.tasty,
|
|
||||||
salty: heads_special.salty,
|
|
||||||
decent: heads_special.decent,
|
|
||||||
meh: heads_special.meh,
|
|
||||||
yucky: heads_special.yucky,
|
|
||||||
eww: heads_special.eww,
|
|
||||||
rest: (heads - total_special)
|
|
||||||
}
|
|
||||||
|
|
||||||
const headsArray = Object.entries(percentages)
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div>
|
|
||||||
<p>
|
|
||||||
<span className="font-bold">{"Total Heads Gathered: "}</span>
|
|
||||||
<span className="text-mc-gray">{formatNumber(heads)}</span>
|
|
||||||
</p>
|
|
||||||
{total_special > 0 ? <HeadsBar heads={headsArray} heads_total={heads} /> : <p>This person has no heads collected.</p>}
|
|
||||||
<p className="font-bold">Prestigious Head Collection</p>
|
|
||||||
{prestigeous.length > 0 ? <PresigeousHeads heads={prestigeous} /> : <p>No prestigeous heads. Now what a skill issue.</p>}
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
export function AngelOfDeath(
|
|
||||||
{ shards, lifetime_shards, opals, lifetime_opals }: { shards: number, lifetime_shards: number, opals: number, lifetime_opals: number }
|
|
||||||
) {
|
|
||||||
return (
|
|
||||||
<div className="grid grid-cols-2 grid-rows-2">
|
|
||||||
<p>
|
|
||||||
<span className="font-bold">{"Shards: "}</span>
|
|
||||||
<span className="text-mc-aqua">{shards}</span>
|
|
||||||
</p>
|
|
||||||
<p>
|
|
||||||
<span className="font-bold">{"Opals: "}</span>
|
|
||||||
<span className="text-mc-blue">{opals}</span>
|
|
||||||
</p>
|
|
||||||
<p>
|
|
||||||
<span className="font-bold">{"Lifetime Shards: "}</span>
|
|
||||||
<span className="text-mc-aqua">{formatNumber(lifetime_shards)}</span>
|
|
||||||
</p>
|
|
||||||
<p>
|
|
||||||
<span className="font-bold">{"Lifetime Opals: "}</span>
|
|
||||||
<span className="text-mc-blue">{lifetime_opals}</span>
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
export function ShardProgress({ percent, shards }: { percent: number, shards: number }) {
|
|
||||||
return (
|
|
||||||
<div>
|
|
||||||
<h1 className="font-bold">Shard Progress</h1>
|
|
||||||
<div className="flex">
|
|
||||||
<GenericProgress percent={percent} className="bg-mc-aqua" tooltipId="shards-progress" tooltipContent={`${shards}/20000 Shards`} />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
export function SkywarsLevel({ xp, icon }: { xp: number, icon: string | undefined }) {
|
|
||||||
const level = getSkywarsLevel(xp)
|
|
||||||
const pres = getPrestige(Math.floor(level))
|
|
||||||
const swIcon = getSkyWarsIcon(icon)
|
|
||||||
const val = `${Math.floor(level)}${swIcon}`
|
|
||||||
|
|
||||||
// if (level > 150) {
|
|
||||||
// return (
|
|
||||||
// <p className="font-bold">
|
|
||||||
// <span className={`text-mc-${pres.leftBracket}`}>[</span>
|
|
||||||
// <span
|
|
||||||
// style={{
|
|
||||||
// backgroundImage: "linear-gradient(to left,#a0a,#f5f,#5ff,#5f5,#ff5,#fa0,#f55)",
|
|
||||||
// WebkitBackgroundClip: "text",
|
|
||||||
// color: "transparent"
|
|
||||||
// }}
|
|
||||||
// >
|
|
||||||
// {`${val}`}
|
|
||||||
// </span>
|
|
||||||
// <span className={`text-mc-${pres.rightBracket}`}>]</span>
|
|
||||||
// </p>
|
|
||||||
// )
|
|
||||||
// }
|
|
||||||
//
|
|
||||||
// if (level === 50) {
|
|
||||||
// <p>
|
|
||||||
// <span className={`text-mc-${pres.brackets}`}>[</span>
|
|
||||||
// <span
|
|
||||||
// style={{
|
|
||||||
// backgroundImage: "linear-gradient(to left,#a0a,#f5f,#5ff,#5f5,#ff5,#fa0,#f55)",
|
|
||||||
// WebkitBackgroundClip: "text",
|
|
||||||
// color: "transparent"
|
|
||||||
// }}
|
|
||||||
// >
|
|
||||||
// {`${val}`}
|
|
||||||
// </span>
|
|
||||||
// <span className={`text-mc-${pres.brackets}`}>]</span>
|
|
||||||
// </p>
|
|
||||||
// }
|
|
||||||
|
|
||||||
function MapSkywarsPrestigeColors() {
|
|
||||||
if (typeof pres.colormap_2 === "string") {
|
|
||||||
return <span className={`text-mc-${pres.colormap_2}`}>{val}</span>
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
{val.split("").map((c, i) => {
|
|
||||||
if (level.toString().length === 2) {
|
|
||||||
return <span className={`text-mc-${pres.colormap_2}`} key={i}>{c}</span>
|
|
||||||
} else {
|
|
||||||
}
|
|
||||||
})}
|
|
||||||
</>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<p>
|
|
||||||
<span className={`text-mc-${pres.leftBracket}`}>[</span>
|
|
||||||
<MapSkywarsPrestigeColors />
|
|
||||||
<span className={`text-mc-${pres.rightBracket}`}>]</span>
|
|
||||||
</p>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
export function SkywarsProgress({ level, percent, currentXp, ceilingXp }: { level: number, percent: number, currentXp: number, ceilingXp: number }) {
|
|
||||||
return (
|
|
||||||
<div className="flex items-center mb-10">
|
|
||||||
<LevelNumber level={level} className="mr-2" />
|
|
||||||
<Progress
|
|
||||||
level={level}
|
|
||||||
percent={percent}
|
|
||||||
tooltipId="skywars-progress"
|
|
||||||
tooltipContent={`${formatNumber(currentXp)}/${formatNumber(ceilingXp)} XP`}
|
|
||||||
/>
|
|
||||||
<LevelNumber level={level + 1} className="ml-2" />
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
function LevelNumber({ level, className }: { level: number, className?: string }) {
|
|
||||||
if (level > 150 || level === 50) {
|
|
||||||
return (
|
|
||||||
<div
|
|
||||||
className={cn(level > 150 ? "font-bold" : undefined, className)}
|
|
||||||
style={{
|
|
||||||
backgroundImage: "linear-gradient(to left,#a0a,#f5f,#5ff,#5f5,#ff5,#fa0,#f55)",
|
|
||||||
WebkitBackgroundClip: "text",
|
|
||||||
color: "transparent"
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
{level}
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
return <div className={cn(`text-mc-${getPrestige(level).leftBracket}`, className)}>{level}</div>
|
|
||||||
}
|
|
||||||
|
|
||||||
function Progress({ level, percent, tooltipId, tooltipContent }: { level: number, percent: number, tooltipId: string, tooltipContent: string }) {
|
|
||||||
if (level > 150 || level === 50) {
|
|
||||||
return <GenericProgress percent={percent} rainbow={true} tooltipId={tooltipId} tooltipContent={tooltipContent} />
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<GenericProgress
|
|
||||||
percent={percent}
|
|
||||||
className={`bg-mc-${getPrestige(level).leftBracket}`}
|
|
||||||
tooltipId={tooltipId}
|
|
||||||
tooltipContent={tooltipContent}
|
|
||||||
/>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
export function SkywarsPrestige({ level, icon }: { level: number, icon?: string }) {
|
|
||||||
const swIcon = getSkyWarsIcon(icon)
|
|
||||||
const pres = getPrestige(level)
|
|
||||||
const val = `${pres} ${swIcon}`
|
|
||||||
|
|
||||||
// if (level > 150 || level === 50) {
|
|
||||||
// return (
|
|
||||||
// <span
|
|
||||||
// style={{
|
|
||||||
// backgroundImage: "linear-gradient(to left,#a0a,#f5f,#5ff,#5f5,#ff5,#fa0,#f55)",
|
|
||||||
// WebkitBackgroundClip: "text",
|
|
||||||
// color: "transparent"
|
|
||||||
// }}
|
|
||||||
// className={level > 150 ? "font-bold" : undefined}
|
|
||||||
// >
|
|
||||||
// {val}
|
|
||||||
// </span>
|
|
||||||
// )
|
|
||||||
// }
|
|
||||||
|
|
||||||
return (
|
|
||||||
<span className={`text-mc-${pres.leftBracket}`}>
|
|
||||||
{val}
|
|
||||||
</span>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
Reference in New Issue
Block a user