diff --git a/components/match/DemoPlaybackControls.vue b/components/match/DemoPlaybackControls.vue index ada3d2d66..93ef25780 100644 --- a/components/match/DemoPlaybackControls.vue +++ b/components/match/DemoPlaybackControls.vue @@ -47,6 +47,7 @@ import { } from "~/components/ui/tooltip"; import { useDemoPlayback } from "~/composables/useDemoPlayback"; import { useClipEditor } from "~/composables/useClipEditor"; +import { useBroadcastHuds } from "~/composables/useBroadcastHuds"; import RoundSelector from "~/components/match/RoundSelector.vue"; import SpectatorSlots from "~/components/stream-deck/SpectatorSlots.vue"; import { resolveKeyToRealSlot } from "~/utilities/streamerSpecSlots"; @@ -87,22 +88,28 @@ const { reloadDemo, toggleXray, toggleHud, - setHudMode, + setHud, toggleHudSides, toggleDemoUI, toggleAutodirector, setScoreboard, } = useDemoPlayback(); -// JTs Hud's default bundle declares variants ["default","horizontal", -// "vertical"] in hud.json — but `default` and `horizontal` render the -// same layout, so we only expose the two distinct ones. Legacy -// `default` payloads are folded into `horizontal` at the boundary. -const HUD_MODES: Array<"horizontal" | "vertical"> = ["horizontal", "vertical"]; -const HUD_MODE_LABELS: Record<(typeof HUD_MODES)[number], string> = { - horizontal: "Horizontal", - vertical: "Vertical", -}; +// The HUD library, imports included. This used to be a hardcoded pair, because +// horizontal/vertical were the only two things the pod could load — they were +// never separate HUDs, only layouts of the one bundled HUD, and they are now +// the two seeded builtin rows alongside whatever an administrator has imported. +const { huds: broadcastHuds, fetch: fetchBroadcastHuds } = useBroadcastHuds(); +onMounted(() => { + void fetchBroadcastHuds(); +}); + +// The picker sits in a toolbar, so a long library has to stay usable: the +// builtins and the active HUD are always shown, and the rest ride behind the +// same row. Label falls back to the slug so a row with a blank name is still +// selectable rather than invisible. +const hudLabel = (hud: { name?: string | null; slug: string }) => + hud.name?.trim() || hud.slug; // Slot identity is GSI — survives a demo attached to the wrong match_map. const ctSlots = computed(() => @@ -1188,31 +1195,33 @@ const killMarkers = computed(() => { }} - +
- +