Get stage images from the dashboard

package.json

@@ -1,7 +1,7 @@
 {
     "name": "sac-overlays",
     "version": "0.0.0",
-    "compatibleDashboardVersion": "^4.0.0",
+    "compatibleDashboardVersion": "^4.4.0",
     "compatibleGameVersions": [
         "SPLATOON_2",
         "SPLATOON_3"

src/graphics/break/scripts/stages.ts

@@ -1,4 +1,4 @@
-import { activeBreakScene, activeRound } from '../../helpers/replicants';
+import { activeBreakScene, activeRound, assetPaths } from '../../helpers/replicants';
 import {
     getUpdatedGames,
     getUpdatedWinners,
@@ -7,27 +7,28 @@ import {
     UpdatedWinner
 } from '../../helpers/stage';
 import gsap from 'gsap';
-import { mapNameToImagePath } from '../../helpers/constants';
 import { loadImage } from '../../helpers/image';
 import { elementById } from '../../helpers/elem';
 import { textOpacitySwap } from '../../helpers/anim';
 import { sceneSwitchTl } from './sceneSwitcher';
 
 const stagesLayout = elementById('stages-layout');
 
-activeRound.on('change', (newValue, oldValue) => {
-    const games = getUpdatedGames(newValue, oldValue);
-    const winners = getUpdatedWinners(newValue, oldValue);
+NodeCG.waitForReplicants(activeRound, assetPaths).then(() => {
+    activeRound.on('change', (newValue, oldValue) => {
+        const games = getUpdatedGames(newValue, oldValue);
+        const winners = getUpdatedWinners(newValue, oldValue);
 
-    updateGames(games, winners);
+        updateGames(games, winners);
 
-    if (!games.isNewMatch) {
-        setWinners(winners);
-    }
+        if (!games.isNewMatch) {
+            setWinners(winners);
+        }
+    });
 });
 
 function getStageUrl(stageName: string): string {
-    return `assets/stages/${mapNameToImagePath[stageName]}`;
+    return assetPaths.value.stageImages[stageName] ?? 'assets/unknown-stage.png';
 }
 
 async function updateGames(games: UpdatedGames, winners: Array<UpdatedWinner>): Promise<void> {

src/graphics/helpers/constants.ts

@@ -1,44 +1,3 @@
 export const APP_WIDTH = 1920;
 export const APP_HEIGHT = 1080;
 export const DASHBOARD_BUNDLE_NAME = 'ipl-overlay-controls';
-
-export const mapNameToImagePath: Record<string, string> = {
-    'Ancho-V Games': 'S2_Stage_Ancho-V_Games.png',
-    'Arowana Mall': 'S2_Stage_Arowana_Mall.png',
-    'Blackbelly Skatepark': 'S2_Stage_Blackbelly_Skatepark.png',
-    'Camp Triggerfish': 'S2_Stage_Camp_Triggerfish.png',
-    'Goby Arena': 'S2_Stage_Goby_Arena.png',
-    'Humpback Pump Track': 'S3_Stage_Humpback_Pump_Track.png',
-    'Inkblot Art Academy': 'S3_Stage_Inkblot_Art_Academy.jpg',
-    'Kelp Dome': 'S2_Stage_Kelp_Dome.png',
-    MakoMart: 'S3_Stage_Mako_Mart.jpg',
-    'Manta Maria': 'S3_Stage_Manta_Maria.png',
-    'Moray Towers': 'S2_Stage_Moray_Towers.png',
-    'Musselforge Fitness': 'S2_Stage_Musselforge_Fitness.png',
-    'New Albacore Hotel': 'S2_Stage_New_Albacore_Hotel.png',
-    'Piranha Pit': 'S2_Stage_Piranha_Pit.png',
-    'Port Mackerel': 'S2_Stage_Port_Mackerel.png',
-    'Shellendorf Institute': 'S2_Stage_Shellendorf_Institute.png',
-    'Shifty Station': 'S2_Stage_Shifty_Station.png',
-    'Snapper Canal': 'S2_Stage_Snapper_Canal.png',
-    'Starfish Mainstage': 'S2_Stage_Starfish_Mainstage.png',
-    'Sturgeon Shipyard': 'S3_Stage_Sturgeon_Shipyard.jpg',
-    'The Reef': 'S2_Stage_The_Reef.png',
-    'Wahoo World': 'S3_Stage_Wahoo_World.jpg',
-    'Walleye Warehouse': 'S2_Stage_Walleye_Warehouse.png',
-    'Skipper Pavilion': 'S2_Stage_Skipper_Pavilion.png',
-    'Eeltail Alley':'S3_Stage_Eeltail_Alley.jpg',
-    'Hagglefish Market':'S3_Stage_Hagglefish_Market.webp',
-    'Hammerhead Bridge':'S3_Stage_Hammerhead_Bridge.jpg',
-    'Mahi-Mahi Resort': 'S3_Stage_Mahi_Mahi_Resort.jpg',
-    'Mincemeat Metalworks': 'S3_Stage_Mincemeat_metalworks.png',
-    'Museum d\'Alfonsino': 'S3_Stage_Museum_dAlfonsino.jpg',
-    'Scorch Gorge':'S3_Stage_Scorch_Gorge.jpg',
-    'Flounder Heights': 'S3_Stage_Flounder_Heights.png',
-    'Brinewater Springs': 'S3_Brinewater_Springs.png',
-    'Undertow Spillway':'S3_Stage_Undertow_Spillway.jpg',
-    'Um\'ami Ruins': 'S3_Stage_Umami_Ruins.png',
-    'Barnacle & Dime': 'S3_Stage_Barnacle_&_Dime.png',
-    'Unknown Stage': 'unknown-stage.png',
-    Counterpick: 'unknown-stage.png'
-};

src/graphics/helpers/replicants.ts

@@ -1,5 +1,5 @@
 import { DASHBOARD_BUNDLE_NAME } from './constants';
-import { MusicShown, NowPlaying, Casters, ActiveRound, PredictionStore, ActiveBreakScene, MainFlavorText, NextRoundStartTime, ScoreboardData, NextRound } from 'schemas';
+import { MusicShown, NowPlaying, Casters, ActiveRound, PredictionStore, ActiveBreakScene, MainFlavorText, NextRoundStartTime, ScoreboardData, NextRound, AssetPaths } from 'schemas';
 
 export const musicShown = nodecg.Replicant<MusicShown>('musicShown', DASHBOARD_BUNDLE_NAME);
 export const nowPlaying = nodecg.Replicant<NowPlaying>('nowPlaying', DASHBOARD_BUNDLE_NAME);
@@ -11,3 +11,4 @@ export const mainFlavorText = nodecg.Replicant<MainFlavorText>('mainFlavorText',
 export const nextRoundTime = nodecg.Replicant<NextRoundStartTime>('nextRoundStartTime', DASHBOARD_BUNDLE_NAME);
 export const scoreboardData = nodecg.Replicant<ScoreboardData>('scoreboardData', DASHBOARD_BUNDLE_NAME);
 export const nextRound = nodecg.Replicant<NextRound>('nextRound', DASHBOARD_BUNDLE_NAME);
+export const assetPaths = nodecg.Replicant<AssetPaths>('assetPaths', DASHBOARD_BUNDLE_NAME);