QOL: update input texts & enhance GPU saver

UIMod/assets/js/main.js

@@ -1,19 +1,27 @@
 // /static/main.js
 document.addEventListener('DOMContentLoaded', () => {
-    window.GPUSaverEnabled = localStorage.getItem('GPUSaverEnabled') !== 'false';
+
+    animationState = localStorage.getItem('animationState') || 'focus';
+    if (animationState === 'disabled') {
+        resourceSaver(true);
+    } else {
+        resourceSaver(false);
+    }
     typeh1(document.querySelector('h1'), 30);
     if (window.location.pathname == '/') {
         setupTabs();
         fetchDetectionEvents();
         fetchBackups();
         handleConsole();
         pollServerStatus();
+        if (animationState != 'disabled') {
         // Create planets with size, orbit radius, speed, and color
         const planetContainer = document.getElementById('planet-container');
         createPlanet(planetContainer, 80, 650, 34, 'rgba(200, 100, 50, 0.7)');
         createPlanet(planetContainer, 50, 1000, 46, 'rgba(100, 200, 150, 0.5)');
         createPlanet(planetContainer, 30, 1250, 63, 'rgba(50, 150, 250, 0.6)');
         createPlanet(planetContainer, 70, 400, 28, 'rgba(200, 150, 200, 0.7)'); 
+        }
         console.warn("If you see errors for sscm.js or sscm.css, you may want to enable SSCM.");
     }
 });
@@ -33,28 +41,28 @@ function closeEventSources() {
 }
 
 function typeh1(element, speed) {
-  // Check if typing is already in progress
-  if (element.dataset.isTyping === 'true') {
-      // Optionally, clear the previous timeout (requires storing it)
-      clearTimeout(element.dataset.timeoutId);
-  }
+    // Check if typing is already in progress
+    if (element.dataset.isTyping === 'true') {
+        // Optionally, clear the previous timeout (requires storing it)
+        clearTimeout(element.dataset.timeoutId);
+    }
 
-  const fullText = element.textContent;
-  element.textContent = '';
-  element.dataset.isTyping = 'true'; // Mark as typing
-  let i = 0;
-
-  const typeChar = () => {
-      if (i < fullText.length) {
-          element.textContent += fullText.charAt(i++);
-          const timeoutId = setTimeout(typeChar, speed);
-          element.dataset.timeoutId = timeoutId; // Store timeout ID
-      } else {
-          element.dataset.isTyping = 'false'; // Done typing
-          delete element.dataset.timeoutId;
-      }
-  };
-  typeChar();
+    const fullText = element.textContent;
+    element.textContent = '';
+    element.dataset.isTyping = 'true'; // Mark as typing
+    let i = 0;
+    
+    const typeChar = () => {
+        if (i < fullText.length) {
+            element.textContent += fullText.charAt(i++);
+            const timeoutId = setTimeout(typeChar, speed);
+            element.dataset.timeoutId = timeoutId; // Store timeout ID
+        } else {
+            element.dataset.isTyping = 'false'; // Done typing
+            delete element.dataset.timeoutId;
+        }
+    };
+    typeChar();
 }
 
 function navigateTo(url) {
@@ -65,48 +73,63 @@ function navigateTo(url) {
 function resourceSaver(pause) {
     // Get space background once outside the loop
     const spaceBackground = document.getElementById('space-background');
+    const planetContainer = document.getElementById('planet-container');
 
-    // Handle animation states for all elements
-    document.querySelectorAll('*').forEach(element => {
-      element.style.animationPlayState = pause ? 'paused' : 'running';
-    });
+    if (planetContainer != null) {
+        if (pause) {
+        planetContainer.style.display = "none";
+    } else {
+        planetContainer.style.display = "";
+    }
+    }
+
+
 
     // Fade the space background in/out instead of abrupt display change
     if (pause) {
-      // Fade out
-      spaceBackground.style.transition = 'opacity 0.5s ease';
-      spaceBackground.style.opacity = '0';
-      // Only hide it after the fade completes
-      setTimeout(() => {
-        if (document.hasFocus() === false) { // Double-check we're still unfocused
-          spaceBackground.style.display = 'none';
-        }
-      }, 500);
-    } else {
-      // Make it visible first, then fade in
-      spaceBackground.style.display = 'block';
-      // Use setTimeout to ensure the display change is processed before starting the fade
-      setTimeout(() => {
+        // Fade out
         spaceBackground.style.transition = 'opacity 0.5s ease';
-        spaceBackground.style.opacity = '1';
-      }, 10);
+        spaceBackground.style.opacity = '0';
+        // Only hide it after the fade completes
+        setTimeout(() => {
+            if (document.hasFocus() === false || animationState === 'disabled') {
+                spaceBackground.style.display = 'none';
+            }
+        }, 500);
+    } else {
+        // Make it visible first, then fade in
+        spaceBackground.style.display = 'block';
+        // Use setTimeout to ensure the display change is processed before starting the fade
+        setTimeout(() => {
+            spaceBackground.style.transition = 'opacity 0.5s ease';
+            spaceBackground.style.opacity = '1';
+        }, 10);
     }
 }
 
 function toggleGPUSaver() {
-    window.GPUSaverEnabled = !window.GPUSaverEnabled;
-    localStorage.setItem('GPUSaverEnabled', window.GPUSaverEnabled);
+    if (animationState === 'focus') {
+        animationState = 'disabled';
+        resourceSaver(true);
+    } else if (animationState === 'disabled') {
+        animationState = 'always';
+        resourceSaver(false);
+    } else {
+        animationState = 'focus';
+        resourceSaver(false);
+    }
+    localStorage.setItem('animationState', animationState);
 }
 
 // Event listeners for window focus and blur
 window.addEventListener('focus', () => {
-    if (window.GPUSaverEnabled) {
+    if (animationState === 'focus') {
         resourceSaver(false); // Resume animations when page is in focus
     }
 });
 
 window.addEventListener('blur', () => {
-    if (window.GPUSaverEnabled) {
+    if (animationState === 'focus') {
         resourceSaver(true); // Pause animations when page loses focus
     }
 });

UIMod/ui/config.html

@@ -72,7 +72,7 @@ <h3 class="section-title">Basic Server Settings</h3>
                                     <label for="SaveInfo">Save File Name:</label>
                                     <input type="text" id="SaveInfo" name="SaveInfo" value="{{SaveInfo}}"
                                         pattern="^[A-Z].*(\s[A-Z].*)?$" required>
-                                    <div class="input-info">Name of save folder. Must be capitalized. Optionally,
+                                    <div class="input-info">Name of save folder. Must be capitalized. To create a new world,
                                         provide the
                                         World type to generate. (MyMoonMap Moon)</div>
                                 </div>

UIMod/ui/index.html

@@ -111,7 +111,7 @@
         <img src="/static/stationeers.png" alt="Stationeers Banner" id="banner">
         <button onclick="window.location.href = '/auth/logout';" class="logout-icon" title="Logout"></button>
         <button onclick="toggleGPUSaver()" class="gpusaver-icon"
-            title="Save GPU Power by disabling background Animations when navigating away from the UI. Persistent until toggled off."></button>
+            title="Save GPU Power by disabling background Animations. Persistent until toggled off. Options: Focus (Default), Always, Disabled. If unsure, check developer tools -> Application -> Local Storage -> animationState"></button>
     </header>
     <main>
 

src/config/config.go

@@ -11,7 +11,7 @@ import (
 
 var (
 	// All configuration variables can be found in vars.go
-	Version = "5.4.32"
+	Version = "5.4.33"
 	Branch  = "release"
 )
 

src/web/TwoBoxForm.go

@@ -92,7 +92,7 @@ func ServeTwoBoxFormTemplate(w http.ResponseWriter, r *http.Request) {
 			Title:                  "Stationeers Server UI",
 			HeaderTitle:            "Save Identifier Setup",
 			StepMessage:            "Set a save identifier like 'SpaceStation13 Moon'. Capitalize the first letter of each word. Possible World types can be found in the Stationeers Wiki or the Stationeers Server UI GitHub Wiki.",
-			PrimaryPlaceholderText: "Requires a SaveName, accepts optional WorldType",
+			PrimaryPlaceholderText: "Requires a SaveName and WorldType for first start!",
 			PrimaryLabel:           "Save Identifier",
 			SecondaryLabel:         "",
 			SecondaryLabelType:     "hidden",