Fi

Scripts/Garden/Garden.js

@@ -216,109 +216,24 @@ async function SwitchGarden(
 
 
 function RenderGardenSelector() {
-    const PreviousButton =
-        document.getElementById(
-            "PreviousGardenButton"
-        );
-
-    const NextButton =
-        document.getElementById(
-            "NextGardenButton"
-        );
-
-    const NameInput =
-        document.getElementById(
-            "GardenNameInput"
-        );
-
-    if (
-        PreviousButton === null ||
-        NextButton === null ||
-        NameInput === null
-    ) {
-        return;
-    }
-
-    const GardenCount =
-        GameSave.Gardens.length;
-
-    const GardenIndex =
-        GameSave.ActiveGardenIndex;
-
-    const HasPreviousGarden =
-        GardenIndex > 0;
-
-    const HasNextGarden =
-        GardenIndex <
-        GardenCount - 1;
-
-    PreviousButton.disabled =
-        !HasPreviousGarden;
-
-    NextButton.disabled =
-        !HasNextGarden;
-
-
-    PreviousButton.style.setProperty(
-        "--GardenSelectorBorderColour",
-        HasPreviousGarden
-            ? GetGardenBorderColour(
-                GardenIndex - 1
-            )
-            : "var(--Surface2)"
-    );
-
-    NameInput.style.setProperty(
-        "--GardenSelectorBorderColour",
-        GetGardenBorderColour(
-            GardenIndex
-        )
-    );
-
-    NextButton.style.setProperty(
-        "--GardenSelectorBorderColour",
-        HasNextGarden
-            ? GetGardenBorderColour(
-                GardenIndex + 1
-            )
-            : "var(--Surface2)"
-    );
-
-
-    PreviousButton.setAttribute(
-        "aria-label",
-        HasPreviousGarden
-            ? "Previous Garden: " +
-                GameSave.Gardens[
-                    GardenIndex - 1
-                ].Name
-            : "No previous Garden"
-    );
-
-    NextButton.setAttribute(
-        "aria-label",
-        HasNextGarden
-            ? "Next Garden: " +
-                GameSave.Gardens[
-                    GardenIndex + 1
-                ].Name
-            : "No next Garden"
-    );
-
-
-    if (
-        document.activeElement !==
-        NameInput
-    ) {
-        NameInput.value =
-            GameSave.Garden.Name;
-    }
-
-    NameInput.title =
-        "Garden " +
-        (GardenIndex + 1) +
-        " of " +
-        GardenCount;
+    RenderGardenSelectorView({
+        Gardens: GameSave.Gardens,
+        GardenIndex:
+            GameSave.ActiveGardenIndex,
+        PreviousButton:
+            document.getElementById(
+                "PreviousGardenButton"
+            ),
+        NameInput:
+            document.getElementById(
+                "GardenNameInput"
+            ),
+        NextButton:
+            document.getElementById(
+                "NextGardenButton"
+            ),
+        PreserveFocusedName: true
+    });
 }
 
 

Scripts/Garden/GardenView.js

@@ -49,6 +49,117 @@ function GetGardenBorderColour(
 }
 
 
+
+
+function RenderGardenSelectorView(
+    Options
+) {
+    const Gardens =
+        Array.isArray(Options.Gardens)
+            ? Options.Gardens
+            : [];
+
+    const GardenIndex =
+        Number(Options.GardenIndex) || 0;
+
+    const PreviousButton =
+        Options.PreviousButton ?? null;
+
+    const NextButton =
+        Options.NextButton ?? null;
+
+    const NameInput =
+        Options.NameInput ?? null;
+
+    if (
+        PreviousButton === null ||
+        NextButton === null ||
+        NameInput === null ||
+        Gardens.length === 0
+    ) {
+        return;
+    }
+
+    const HasPreviousGarden =
+        GardenIndex > 0;
+
+    const HasNextGarden =
+        GardenIndex <
+        Gardens.length - 1;
+
+    PreviousButton.disabled =
+        !HasPreviousGarden;
+
+    NextButton.disabled =
+        !HasNextGarden;
+
+
+    PreviousButton.style.setProperty(
+        "--GardenSelectorBorderColour",
+        HasPreviousGarden
+            ? GetGardenBorderColour(
+                GardenIndex - 1
+            )
+            : "var(--Surface2)"
+    );
+
+    NameInput.style.setProperty(
+        "--GardenSelectorBorderColour",
+        GetGardenBorderColour(
+            GardenIndex
+        )
+    );
+
+    NextButton.style.setProperty(
+        "--GardenSelectorBorderColour",
+        HasNextGarden
+            ? GetGardenBorderColour(
+                GardenIndex + 1
+            )
+            : "var(--Surface2)"
+    );
+
+
+    PreviousButton.setAttribute(
+        "aria-label",
+        HasPreviousGarden
+            ? "Previous Garden: " +
+                Gardens[
+                    GardenIndex - 1
+                ].Name
+            : "No previous Garden"
+    );
+
+    NextButton.setAttribute(
+        "aria-label",
+        HasNextGarden
+            ? "Next Garden: " +
+                Gardens[
+                    GardenIndex + 1
+                ].Name
+            : "No next Garden"
+    );
+
+
+    if (
+        Options.PreserveFocusedName !==
+            true ||
+        document.activeElement !==
+            NameInput
+    ) {
+        NameInput.value =
+            Gardens[GardenIndex]
+                ?.Name ?? "Garden";
+    }
+
+    NameInput.title =
+        "Garden " +
+        (GardenIndex + 1) +
+        " of " +
+        Gardens.length;
+}
+
+
 function GetGardenPlotRotation(
     Plot
 ) {

Scripts/Garden/Gardener.js

@@ -370,6 +370,10 @@ function RenderGardenerGardens() {
     Section.hidden = false;
 
     if (!Array.isArray(GardenerData.Gardens)) {
+        Section.classList.add(
+            "Panel"
+        );
+
         Section.replaceChildren(
             CreateGardenerPrivateSection(
                 "Gardens",
@@ -380,6 +384,10 @@ function RenderGardenerGardens() {
         return;
     }
 
+    Section.classList.remove(
+        "Panel"
+    );
+
     if (GardenerData.Gardens.length === 0) {
         const Message =
             document.getElementById(
@@ -389,6 +397,7 @@ function RenderGardenerGardens() {
         if (Message !== null) {
             Message.textContent =
                 "This gardener has no Gardens to preview.";
+            Message.hidden = false;
         }
 
         document.getElementById(
@@ -417,17 +426,29 @@ function ChangeGardenerGarden(
         !Array.isArray(
             GardenerData?.Gardens
         ) ||
-        GardenerData.Gardens.length <= 1
+        GardenerData.Gardens.length === 0
+    ) {
+        return;
+    }
+
+    const NextIndex = Math.max(
+        0,
+        Math.min(
+            GardenerData.Gardens.length - 1,
+            GardenerGardenIndex +
+                Difference
+        )
+    );
+
+    if (
+        NextIndex ===
+        GardenerGardenIndex
     ) {
         return;
     }
 
     GardenerGardenIndex =
-        (
-            GardenerGardenIndex +
-            Difference +
-            GardenerData.Gardens.length
-        ) % GardenerData.Gardens.length;
+        NextIndex;
 
     RenderCurrentGardenerGarden();
 }
@@ -447,39 +468,14 @@ function RenderCurrentGardenerGarden() {
     const Garden =
         Gardens[GardenerGardenIndex];
 
-    const Section =
-        document.getElementById(
-            "GardenerGardensSection"
-        );
-
     const Grid =
         document.getElementById(
             "GardenerGardenGrid"
         );
 
-    const Name =
+    const PlotsPanel =
         document.getElementById(
-            "GardenerGardenName"
-        );
-
-    const Size =
-        document.getElementById(
-            "GardenerGardenSize"
-        );
-
-    const Position =
-        document.getElementById(
-            "GardenerGardenPosition"
-        );
-
-    const PreviousButton =
-        document.getElementById(
-            "PreviousGardenerGardenButton"
-        );
-
-    const NextButton =
-        document.getElementById(
-            "NextGardenerGardenButton"
+            "GardenerPlots"
         );
 
     const Message =
@@ -487,11 +483,32 @@ function RenderCurrentGardenerGarden() {
             "GardenerGardensMessage"
         );
 
-    if (Grid === null) {
+    if (
+        Grid === null ||
+        PlotsPanel === null
+    ) {
         return;
     }
 
-    Section?.style.setProperty(
+    RenderGardenSelectorView({
+        Gardens,
+        GardenIndex:
+            GardenerGardenIndex,
+        PreviousButton:
+            document.getElementById(
+                "PreviousGardenerGardenButton"
+            ),
+        NameInput:
+            document.getElementById(
+                "GardenerGardenName"
+            ),
+        NextButton:
+            document.getElementById(
+                "NextGardenerGardenButton"
+            )
+    });
+
+    PlotsPanel.style.setProperty(
         "--GardenBorderColour",
         GetGardenBorderColour(
             GardenerGardenIndex
@@ -521,41 +538,9 @@ function RenderCurrentGardenerGarden() {
         );
     }
 
-    if (Name !== null) {
-        Name.textContent =
-            Garden.Name ?? "Garden";
-    }
-
-    if (Size !== null) {
-        Size.textContent =
-            Number(Garden.Width) +
-            "×" +
-            Number(Garden.Height);
-    }
-
-    if (Position !== null) {
-        Position.textContent =
-            (GardenerGardenIndex + 1) +
-            " / " +
-            Gardens.length;
-    }
-
-    const HasMultiple =
-        Gardens.length > 1;
-
-    if (PreviousButton !== null) {
-        PreviousButton.disabled =
-            !HasMultiple;
-    }
-
-    if (NextButton !== null) {
-        NextButton.disabled =
-            !HasMultiple;
-    }
-
     if (Message !== null) {
-        Message.textContent =
-            "Read-only Garden preview.";
+        Message.textContent = "";
+        Message.hidden = true;
     }
 }
 
@@ -616,7 +601,7 @@ function CreateGardenerGardenPlot(
             BorderProgress: Progress,
             DisplaySettings: {
                 ShowPlantNames: true,
-                ShowGrowthTimers: true,
+                ShowGrowthTimers: false,
                 ShowPlotRotation: false
             },
             ImagePath,