BIG heap of bugfixes. Deselecting tools, profile colour picker, player

name colour contrast, mutation pricing (not really a bug, but still an
issue).

Signed-off-by: Sarahtonin <[email protected]>

Scripts/Garden/Economy.js

@@ -1,4 +1,4 @@
-const MutationTimeFeePerHour = 10;
+const MutationTimeFeePerMinute = 15;
 
 const PlantKeysById = new Map();
 const PlantsById = new Map();
@@ -553,8 +553,8 @@ function GetMutationTimeFee(
 
     return Math.ceil(
         MutationTime /
-        3600000 *
-        MutationTimeFeePerHour
+        60000 *
+        MutationTimeFeePerMinute
     );
 }
 

Scripts/Garden/Garden.js

@@ -59,8 +59,16 @@ function BindGardenTools() {
     ShovelButton.addEventListener(
         "click",
         () => {
-            SelectedGardenTool =
-                "Shovel";
+            if (
+                SelectedGardenTool ===
+                "Shovel"
+            ) {
+                SelectedGardenTool =
+                    null;
+            } else {
+                SelectedGardenTool =
+                    "Shovel";
+            }
 
             RenderSeeds();
             RenderTools();
@@ -142,6 +150,15 @@ function EnsureSelectedSeed() {
     if (SeedIds.length > 0) {
         SelectedSeedId =
             SeedIds[0];
+
+        return;
+    }
+
+    if (
+        SelectedGardenTool ===
+        "Seed"
+    ) {
+        SelectedGardenTool = null;
     }
 }
 

Scripts/Garden/Leaderboard.js

@@ -141,14 +141,12 @@ async function RenderLeaderboard() {
             Username.textContent =
                 Player.Username;
 
-            if (
-                Player.Colour !== null
-            ) {
-                Username.style.color =
-                    Player.Colour;
-            }
+            ApplyPlayerColour(
+                Username,
+                Player.Colour
+            );
 
-          Dew.textContent =
+            Dew.textContent =
                 Player.Dew.toLocaleString();
 
 

Scripts/Garden/Profile.js

@@ -56,8 +56,10 @@ async function StartProfile() {
     ColourInput.addEventListener(
         "input",
         () => {
-            ColourPreview.style.color =
-                ColourInput.value;
+            ApplyPlayerColour(
+                ColourPreview,
+                ColourInput.value
+            );
         }
     );
 
@@ -115,15 +117,24 @@ async function RenderProfilePlayer() {
         }
 
 
-        if (
-            Profile.Colour !== null
-        ) {
-            ColourInput.value =
-                Profile.Colour;
+        const ProfileColour =
+            IsValidPlayerColour(
+                Profile.Colour
+            )
+                ? Profile.Colour
+                : DefaultPlayerColour;
 
-            ColourPreview.style.color =
-                Profile.Colour;
-        }
+        ColourInput.value =
+            ProfileColour;
+
+        ApplyPlayerColour(
+            ColourPreview,
+            IsValidPlayerColour(
+                Profile.Colour
+            )
+                ? Profile.Colour
+                : null
+        );
 
 
         UsernameMessage.textContent =
@@ -244,8 +255,14 @@ async function SubmitProfileColour(
         }
 
 
-        Preview.style.color =
-            Result.Colour;
+        ApplyPlayerColour(
+            Preview,
+            IsValidPlayerColour(
+                Result.Colour
+            )
+                ? Result.Colour
+                : Input.value
+        );
 
         Message.textContent =
             "Colour saved.";
@@ -294,10 +311,11 @@ async function ResetProfileColour() {
 
 
         Input.value =
-            "#cdd6f4";
+            DefaultPlayerColour;
 
-        Preview.style.removeProperty(
-            "color"
+        ApplyPlayerColour(
+            Preview,
+            null
         );
 
         Message.textContent =

Scripts/Garden/Users.js

@@ -1,3 +1,89 @@
+const DefaultPlayerColour = "#cdd6f4";
+
+
+function IsValidPlayerColour(
+    Colour
+) {
+    return (
+        typeof Colour === "string" &&
+        /^#[0-9A-Fa-f]{6}$/.test(
+            Colour
+        )
+    );
+}
+
+
+function GetPlayerColourOutline(
+    Colour
+) {
+    const Red = parseInt(
+        Colour.slice(1, 3),
+        16
+    );
+
+    const Green = parseInt(
+        Colour.slice(3, 5),
+        16
+    );
+
+    const Blue = parseInt(
+        Colour.slice(5, 7),
+        16
+    );
+
+    const Brightness =
+        (
+            Red * 299 +
+            Green * 587 +
+            Blue * 114
+        ) / 1000;
+
+    return Brightness < 150
+        ? "var(--Text)"
+        : "var(--Crust)";
+}
+
+
+function ApplyPlayerColour(
+    Element,
+    Colour
+) {
+    Element.style.removeProperty(
+        "color"
+    );
+
+    Element.style.removeProperty(
+        "text-shadow"
+    );
+
+    if (
+        !IsValidPlayerColour(
+            Colour
+        )
+    ) {
+        return;
+    }
+
+    const Outline =
+        GetPlayerColourOutline(
+            Colour
+        );
+
+    Element.style.color =
+        Colour;
+
+    Element.style.textShadow =
+        `-1px -1px 0 ${Outline}, ` +
+        `0 -1px 0 ${Outline}, ` +
+        `1px -1px 0 ${Outline}, ` +
+        `-1px 0 0 ${Outline}, ` +
+        `1px 0 0 ${Outline}, ` +
+        `-1px 1px 0 ${Outline}, ` +
+        `0 1px 0 ${Outline}, ` +
+        `1px 1px 0 ${Outline}`;
+}
+
+
 async function GetProfile() {
     const Response = await fetch(
         ApiUrl + "/Profile.php",
@@ -89,14 +175,12 @@ async function RenderUser() {
         UsernameDisplay.textContent =
             Profile.Username;
 
-        if (
-            Profile.Colour !== null
-        ) {
-            UsernameDisplay.style.color =
-                Profile.Colour;
-        }
+        ApplyPlayerColour(
+            UsernameDisplay,
+            Profile.Colour
+        );
 
-      UsernameForm.hidden = true;
+        UsernameForm.hidden = true;
 
         return;
     }
@@ -104,6 +188,11 @@ async function RenderUser() {
     UsernameDisplay.textContent =
         "Unnamed";
 
+    ApplyPlayerColour(
+        UsernameDisplay,
+        null
+    );
+
     UsernameForm.hidden = false;
 }