OOKNET                             [ /  search the index  ]  
──────────────────────────────────────────────────────────────────────────────────────
[ KB ]    [ GIT ]    [ PROJECTS ]    [ ABOUT ]                                      EN
══════════════════════════════════════════════════════════════════════════════════════
OOKNET   [ /  search  ]  
────────────────────────────────────────────────
[ KB ] [ GIT ] [ PROJECTS ] [ ABOUT ]
════════════════════════════════════════════════
 
 
master @ 88 LINES
 
[ HISTORY ]  [ UP ]
 

---
import "./PlayerRankRow.scss";
import { formatDurationMMSS } from "../../../lib/utils";
import {
  getSpecInfo,
  getSpecIcon,
  getClassTextClass,
} from "../../../lib/wow-constants";
import { buildPlayerProfileURL } from "../../Leaderboard/PlayerLink/PlayerLink.ts"
;

interface Props {
  rank: number;
  bracket?: string;
  name: string;
  realmSlug: string;
  realmName?: string;
  region: string;
  className?: string;
  activeSpecId?: number;
  combinedBestTimeMs: number;
  avatarUrl?: string;
}

const {
  rank,
  bracket,
  name,
  realmSlug,
  realmName,
  region,
  activeSpecId,
  combinedBestTimeMs,
  avatarUrl,
} = Astro.props;

const bracketClass = bracket ? `bracket-${bracket}` : "";
const profileUrl = buildPlayerProfileURL(region, realmSlug, name);
const specInfo = activeSpecId ? getSpecInfo(activeSpecId) : null;
const specIconUrl = specInfo
  ? getSpecIcon(specInfo.class, specInfo.spec)
  : null;
// Reuse the global .text-{class} utility (matches PlayerLink + WoWClassColors)
const classColorClass = specInfo ? getClassTextClass(specInfo.class) : "";
---

<a class="player-rank-row" href={profileUrl}>
  <span class:list={["player-rank-row__rank", "ranking-number", bracketClass]}
    >{rank}</span
  >

  {
    avatarUrl ? (
      <img
        class="player-rank-row__avatar"
        src={avatarUrl}
        alt={`${name} avatar`}
        loading="lazy"
      />
    ) : (
      <div class="player-rank-row__avatar player-rank-row__avatar--placeholder" />
    )
  }

  <div class="player-rank-row__info">
    <span class="player-rank-row__name-line">
      {
        specIconUrl && (
          <img
            class="spec-icon"
            src={specIconUrl}
            alt={specInfo?.spec || ""}
            loading="lazy"
          />
        )
      }
      <span class:list={["player-link-name", classColorClass]}>{name}</span>
    </span>
    <span class="player-rank-row__realm">
      {realmName || realmSlug}
      <span class="player-rank-row__region">{region.toUpperCase()}</span>
    </span>
  </div>

  <span class="player-rank-row__time"
    >{formatDurationMMSS(combinedBestTimeMs)}</span
  >
</a>


---
import "./PlayerRankRow.scss";
import { formatDurationMMSS } from "../../..
/lib/utils";
import {
  getSpecInfo,
  getSpecIcon,
  getClassTextClass,
} from "../../../lib/wow-constants";
import { buildPlayerProfileURL } from "../..
/Leaderboard/PlayerLink/PlayerLink.ts";

interface Props {
  rank: number;
  bracket?: string;
  name: string;
  realmSlug: string;
  realmName?: string;
  region: string;
  className?: string;
  activeSpecId?: number;
  combinedBestTimeMs: number;
  avatarUrl?: string;
}

const {
  rank,
  bracket,
  name,
  realmSlug,
  realmName,
  region,
  activeSpecId,
  combinedBestTimeMs,
  avatarUrl,
} = Astro.props;

const bracketClass = bracket ? `bracket-${br
acket}` : "";
const profileUrl = buildPlayerProfileURL(reg
ion, realmSlug, name);
const specInfo = activeSpecId ? getSpecInfo(
activeSpecId) : null;
const specIconUrl = specInfo
  ? getSpecIcon(specInfo.class, specInfo.spe
c)
  : null;
// Reuse the global .text-{class} utility (m
atches PlayerLink + WoWClassColors)
const classColorClass = specInfo ? getClassT
extClass(specInfo.class) : "";
---

<a class="player-rank-row" href={profileUrl}
>
  <span class:list={["player-rank-row__rank"
, "ranking-number", bracketClass]}
    >{rank}</span
  >

  {
    avatarUrl ? (
      <img
        class="player-rank-row__avatar"
        src={avatarUrl}
        alt={`${name} avatar`}
        loading="lazy"
      />
    ) : (
      <div class="player-rank-row__avatar pl
ayer-rank-row__avatar--placeholder" />
    )
  }

  <div class="player-rank-row__info">
    <span class="player-rank-row__name-line"
>
      {
        specIconUrl && (
          <img
            class="spec-icon"
            src={specIconUrl}
            alt={specInfo?.spec || ""}
            loading="lazy"
          />
        )
      }
      <span class:list={["player-link-name",
 classColorClass]}>{name}</span>
    </span>
    <span class="player-rank-row__realm">
      {realmName || realmSlug}
      <span class="player-rank-row__region">
{region.toUpperCase()}</span>
    </span>
  </div>

  <span class="player-rank-row__time"
    >{formatDurationMMSS(combinedBestTimeMs)
}</span
  >
</a>

 
──────────────────────────────────────────────────────────────────────────────────────
OOKNET
────────────────────────────────────────────────
OOKNET