diff --git a/data.yml b/data.yml index 0405841..0e3b3aa 100644 --- a/data.yml +++ b/data.yml @@ -1082,4 +1082,124 @@ gliders: antigrav: -0.25 traction: -0.25 miniTurbo: 0.25 - invuln: -0.25 \ No newline at end of file + invuln: -0.25 +rivals: + Mario: + - Peach + - Bowser + Luigi: + - Mario + - Daisy + Peach: + - Toad + - DonkeyKong + Daisy: + - Peach + - Waluigi + Yoshi: + - Toad + - DonkeyKong + Toad: + - KoopaTroopa + - Waluigi + KoopaTroopa: + - Yoshi + - Toad + ShyGuy: + - Yoshi + BabyMario: + - BowserJr + - BabyPeach + BabyLuigi: + - BabyMario + - BabyDaisy + BabyPeach: + - BabyMario + - BabyDaisy + BabyDaisy: + - BabyPeach + - BabyLuigi + Wario: + - Mario + - Daisy + Waluigi: + - Luigi + - Toadette + DonkeyKong: + - Bowser + - Wario + Bowser: + - Mario + - Luigi + Lemmy: + - Larry + Larry: + - Lemmy + Wendy: + - Peach + - Daisy + Ludwig: + - Iggy + InklingGirl: + - InklingBoy + VillagerBoy: + - Isabelle + Isabelle: + - VillagerGirl + Link: [] + Rosalina: + - Toad + TanookiMario: + - CatPeach + CatPeach: + - TanookiMario + Birdo: + - Yoshi + Lakitu: [] + Toadette: + - Yoshi + - Wario + KingBoo: + - PeteyPiranha + PeteyPiranha: + - KingBoo + BabyRosalina: + - Toadette + MetalMario: + - PinkGoldPeach + PinkGoldPeach: + - MetalMario + Wiggler: + - Yoshi + - ShyGuy + DryBones: + - KoopaTroopa + - DryBowser + BowserJr: + - Peach + DryBowser: + - DryBones + Kamek: + - BowserJr + Iggy: + - Ludwig + Roy: + - Morton + Morton: + - Roy + Peachette: + - Yoshi + - Wario + DiddyKong: + - DonkeyKong + FunkyKong: + - DonkeyKong + Pauline: + - DonkeyKong + LightMii: [] + MediumMii: [] + HeavyMii: [] + InklingBoy: + - InklingGirl + VillagerGirl: + - VillagerBoy diff --git a/index.css b/index.css index 5ef8528..2689d13 100644 --- a/index.css +++ b/index.css @@ -26,6 +26,10 @@ menu { } } +.info { + text-decoration: dotted underline; +} + :root { --meter-length: 0; } @@ -77,6 +81,23 @@ menu:empty { margin: 0.25em 0; } +#rivals { + margin-top: 0.5em; + min-height: 2.5em; +} + +@media (min-width: 39em) { + #stats-display { + display: grid; + width: fit-content; + grid-template-columns: auto auto; + } + + #rivals { + margin-left: 1em; + } +} + #output td { padding: 0 0.5em; } diff --git a/src/index.civet b/src/index.civet index dbbd32d..c65b344 100644 --- a/src/index.civet +++ b/src/index.civet @@ -160,6 +160,7 @@ kartPreview.appendChild document.createElement 'br' kartPreview.appendChild document.createElement 'br' statsDisplay := document.createElement 'div' + ||> .id = 'stats-display' ||> kartPreview.appendChild makeMeter := (id: string, value: number) => @@ -169,9 +170,30 @@ makeMeter := (id: string, value: number) => ||> .style = `--meter-length: ${value * 100/6}%;` |> .outerHTML +rivalsDiv := document.createElement 'div' + ||> .id = 'rivals' + ||> .append 'Rivals' + +rivalInfoString := 'When playing as P1 in a Grand Prix, these characters are guaranteed to be COM characters and should be better than other COMs, unless they are chosen by other players. Not all characters have rivals.' + +document.createElement 'sup' + ||> .textContent = '\ufe0f\u2139' + ||> .className = 'info' + ||> .title = rivalInfoString + ||> .addEventListener + 'click' + -> alert rivalInfoString + { +passive } + ||> rivalsDiv.appendChild +rivalsDiv.append ': ' + +rivalImgContainer := document.createElement 'span' + ||> rivalsDiv.appendChild + updatePreview := :void => character := data.characters[characterDropdown.value] - characterImg.src = `./img/${Array::find.call(characterDropdown.options, .selected).textContent.replaceAll ' ', ''}.png` + characterName := Array::find.call(characterDropdown.options, .selected).textContent.replaceAll ' ', '' + characterImg.src = `./img/${characterName}.png` kart := data.karts[kartDropdown.value] kartImg.src = `./img/${Array::find.call(kartDropdown.options, .selected).textContent.replaceAll ' ', ''}.png` wheel := data.wheels[wheelDropdown.value] @@ -196,6 +218,14 @@ updatePreview := :void => ${makeMeter 'invuln-prev', statBlock.invuln}${statBlock.invuln} ``` + statsDisplay.appendChild rivalsDiv + rivalImgContainer.innerHTML = '' + for rival of data.rivals[characterName] + document.createElement 'img' + ||> .alt = rival.replace rgx, ' $&' + ||> .src = `./img/${rival}.png` + ||> rivalImgContainer.appendChild + updatePreview() [characterDropdown, kartDropdown, wheelDropdown, gliderDropdown].forEach .addEventListener 'change', updatePreview, { +passive } diff --git a/src/yamlTypes.civet b/src/yamlTypes.civet index 3626f36..028aba7 100644 --- a/src/yamlTypes.civet +++ b/src/yamlTypes.civet @@ -31,3 +31,4 @@ export interface YamlData karts: KartStatBlock[] wheels: WheelStatBlock[] gliders: GliderStatBlock[] + rivals: Partial>