From 260b1425bd2b72fcf9e99ddee48c535b9aff3807 Mon Sep 17 00:00:00 2001
From: Andrio Celos <AndrioCelos@users.noreply.github.com>
Date: Sat, 29 Mar 2025 18:52:12 +1100
Subject: [PATCH] Enable non-default costs for custom cards

---
 TableturfBattleClient/index.html              | 10 +++---
 .../src/Pages/DeckListPage.ts                 |  1 -
 .../src/Pages/GalleryPage.ts                  | 32 +++++++++++++++++++
 TableturfBattleClient/tableturf.css           | 18 +++++------
 TableturfBattleServer/Card.cs                 |  1 -
 TableturfBattleServer/DataStructures.cs       |  6 ++--
 6 files changed, 49 insertions(+), 19 deletions(-)

diff --git a/TableturfBattleClient/index.html b/TableturfBattleClient/index.html
index 5f14595..9d03931 100644
--- a/TableturfBattleClient/index.html
+++ b/TableturfBattleClient/index.html
@@ -632,24 +632,24 @@
 				<div id="galleryCardEditor" hidden>
 					<textarea type="text" id="galleryCardEditorName" placeholder="Card name"></textarea>
 					<div id="galleryCardEditorGrid"></div>
-					<div id="galleryCardEditorSpecialCost">
-						<label for="galleryCardEditorSpecialCostDefaultBox"><input type="checkbox" id="galleryCardEditorSpecialCostDefaultBox" checked/> Default</label>
-					</div>
 					<div id="galleryCardEditorImageToolbar" class="galleryCardEditorToolbar">
 						<input type="file" id="galleryCardEditorImageFile" accept="image/*" autocomplete="off"/>
 						<button id="galleryCardEditorImageSelectButton">Choose image</button>
 						<button id="galleryCardEditorImageClearButton">Clear</button>
 						<footer>(The image will not be seen by other players.)</footer>
 					</div>
-					<div id="galleryCardEditorImageToolbar2" class="galleryCardEditorToolbar">
+					<div id="galleryCardEditorColoursToolbar" class="galleryCardEditorToolbar">
 						Colours:
 						<input type="color" id="galleryCardEditorColour1"/>
 						<input type="color" id="galleryCardEditorColour2"/>
 						<select id="galleryCardEditorColourPresetBox"></select>
 					</div>
-					<div id="galleryCardEditorImageToolbar3" class="galleryCardEditorToolbar">
+					<div id="galleryCardEditorRarityToolbar" class="galleryCardEditorToolbar">
 						<label for="galleryCardEditorRarityBox">Rarity: <select id="galleryCardEditorRarityBox"></select></label>
 					</div>
+					<div id="galleryCardEditorSpecialCost">
+						<label for="galleryCardEditorSpecialCostDefaultBox"><input type="checkbox" id="galleryCardEditorSpecialCostDefaultBox" checked/>Default</label>
+					</div>
 				</div>
 				<form method="dialog">
 					<button type="button" id="galleryCardEditorEditButton">Edit</button>
diff --git a/TableturfBattleClient/src/Pages/DeckListPage.ts b/TableturfBattleClient/src/Pages/DeckListPage.ts
index f492b9e..b089951 100644
--- a/TableturfBattleClient/src/Pages/DeckListPage.ts
+++ b/TableturfBattleClient/src/Pages/DeckListPage.ts
@@ -426,7 +426,6 @@ function deckExportJsonReplacer(key: string, value: any) {
 		case 'number':
 		case 'altNumber':
 		case 'artFileName':
-		case 'specialCost':
 		case 'size':
 		case 'textScale':
 		case 'isVariantOf':
diff --git a/TableturfBattleClient/src/Pages/GalleryPage.ts b/TableturfBattleClient/src/Pages/GalleryPage.ts
index e407576..a9f6f66 100644
--- a/TableturfBattleClient/src/Pages/GalleryPage.ts
+++ b/TableturfBattleClient/src/Pages/GalleryPage.ts
@@ -114,11 +114,43 @@ function openGalleryCardView(card: Card) {
 		updateSelectedPreset([card.inkColour1, card.inkColour2]);
 
 		galleryCardEditorName.value = card.line2 == null ? card.name : `${card.line1}\n${card.line2}`;
+
+		let size = 0; let hasSpecialSpace = false;
 		for (let y = 0; y < 8; y++) {
 			for (let x = 0; x < 8; x++) {
 				galleryCardEditorGridButtons[y][x].dataset.state = card.grid[y][x].toString();
+				switch (card.grid[y][x]) {
+					case Space.Ink1:
+						size++;
+						break;
+					case Space.SpecialInactive1:
+						size++;
+						hasSpecialSpace = true;
+						break;
+				}
 			}
 		}
+
+		let defaultSpecialCost =
+			size <= 3 ? 1
+				: size <= 5 ? 2
+					: size <= 8 ? 3
+						: size <= 11 ? 4
+							: size <= 15 ? 5
+								: 6;
+		if (!hasSpecialSpace && defaultSpecialCost > 3)
+			defaultSpecialCost = 3;
+
+		galleryCardEditorSpecialCostDefaultBox.checked = card.specialCost == defaultSpecialCost;
+		customCardSpecialCost = card.specialCost;
+		for (let i = 0; i < galleryCardEditorSpecialCostButtons.length; i++) {
+			const button = galleryCardEditorSpecialCostButtons[i];
+			if (parseInt(button.dataset.value!) <= card.specialCost)
+				button.classList.add('active');
+			else
+				button.classList.remove('active');
+		}
+
 		updateCustomCardSize();
 	}
 
diff --git a/TableturfBattleClient/tableturf.css b/TableturfBattleClient/tableturf.css
index 04e4eaf..a12e3a7 100644
--- a/TableturfBattleClient/tableturf.css
+++ b/TableturfBattleClient/tableturf.css
@@ -1987,13 +1987,13 @@ button.dragging {
 	font-size: 60%;
 }
 
-.galleryCardEditorToolbar:nth-last-child(3) { bottom: 18%; }
-.galleryCardEditorToolbar:nth-last-child(2) { bottom: 12%; }
-.galleryCardEditorToolbar:nth-last-child(1) { bottom: 6%; }
+#galleryCardEditorImageToolbar { bottom: 18%; }
+#galleryCardEditorColoursToolbar { bottom: 12%; }
+#galleryCardEditorRarityToolbar { bottom: 6%; }
 
 #galleryCardEditorImageFile { display: none; }
 
-#galleryCardEditorImageToolbar2 input {
+#galleryCardEditorColoursToolbar input {
 	width: 3em;
 }
 
@@ -2002,17 +2002,17 @@ button.dragging {
 }
 
 #galleryCardEditorSpecialCost {
-	display: none;
+	display: grid;
 	position: absolute;
 	grid-template-columns: repeat(5, 1fr);
 	left: 26.8%;
-	top: 86.8%;
-	gap: 0.072em;
+	top: 86.2%;
+	gap: 0.15em 0.075em;
 }
 
 #galleryCardEditorSpecialCost button {
-	width: 1.7em;
-	height: 1.7em;
+	width: 2.5vh;
+	aspect-ratio: 1;
 	border: none;
 	background: #00000080;
 	position: relative;
diff --git a/TableturfBattleServer/Card.cs b/TableturfBattleServer/Card.cs
index 5cef1e0..b4b67a6 100644
--- a/TableturfBattleServer/Card.cs
+++ b/TableturfBattleServer/Card.cs
@@ -58,7 +58,6 @@ public class Card {
 			}
 		}
 		this.Size = size;
-
 		this.SpecialCost = specialCost ?? size switch { <= 3 => 1, <= 5 => 2, <= 8 => 3, <= 11 => 4, <= 15 => 5, _ => 6 };
 	}
 
diff --git a/TableturfBattleServer/DataStructures.cs b/TableturfBattleServer/DataStructures.cs
index d1e77b8..211eef6 100644
--- a/TableturfBattleServer/DataStructures.cs
+++ b/TableturfBattleServer/DataStructures.cs
@@ -24,7 +24,7 @@ public class PlayerData(int playerIndex, Card[]? hand, Deck? deck, Move? move, L
 	public PlayerData(int playerIndex, Player player) : this(playerIndex, player.Hand, player.CurrentGameData.Deck, player.Move, player.CardsUsed, player.StageSelectionPrompt) { }
 }
 
-public record UserCustomCard(string Name, string? Line1, string? Line2, Colour InkColour1, Colour InkColour2, Rarity Rarity, Space[,] Grid) {
+public record UserCustomCard(string Name, string? Line1, string? Line2, int? SpecialCost, Colour InkColour1, Colour InkColour2, Rarity Rarity, Space[,] Grid) {
 	public bool CheckGrid(out bool hasSpecialSpace, out int size) {
 		size = 0;
 		hasSpecialSpace = false;
@@ -52,7 +52,7 @@ public record UserCustomCard(string Name, string? Line1, string? Line2, Colour I
 	}
 
 	public bool Equals(Card? card) {
-		if (card is null || card.Name != this.Name || card.Rarity != this.Rarity) return false;
+		if (card is null || card.Name != this.Name || card.Rarity != this.Rarity || card.SpecialCost != this.SpecialCost) return false;
 		for (var x = 0; x < 8; x++) {
 			for (var y = 0; y < 8; y++) {
 				if (this.Grid[x, y] != card.GetSpace(x, y, 0)) return false;
@@ -61,5 +61,5 @@ public record UserCustomCard(string Name, string? Line1, string? Line2, Colour I
 		return true;
 	}
 
-	public Card ToCard(int number, int altNumber, int? specialCost) => new(number, altNumber, this.Line2 != null ? $"{this.Line1}\n{this.Line2}" : this.Name, this.Rarity, specialCost, null, this.Grid) { InkColour1 = this.InkColour1, InkColour2 = this.InkColour2 };
+	public Card ToCard(int number, int altNumber, int? defaultSpecialCost) => new(number, altNumber, this.Line2 != null ? $"{this.Line1}\n{this.Line2}" : this.Name, this.Rarity, this.SpecialCost ?? defaultSpecialCost, null, this.Grid) { InkColour1 = this.InkColour1, InkColour2 = this.InkColour2 };
 }