ui: default Background Particles OFF (#935)

the full-page particle canvas runs a continuous requestAnimationFrame loop behind every
page — real GPU cost, and multiple users hit GPU strain until they found the toggle. flip
the default to off; the eye candy is opt-in now.

- init.js: runtime flag defaults false unless localStorage is explicitly 'true'
- settings.js: config read is now '=== true' (default off) instead of '!== false'
- index.html: checkbox no longer 'checked' by default; hint reworded

existing users who explicitly enabled it (localStorage/config 'true') keep it on; the
existing '!== false' runtime guards still work since the flag is now always set explicitly.
This commit is contained in:
BoulderBadgeDad 2026-06-27 10:48:07 -07:00
parent 3a92571c71
commit 28a539a840
3 changed files with 7 additions and 6 deletions

View file

@ -6263,10 +6263,10 @@
</div>
<div class="form-group">
<label class="checkbox-label">
<input type="checkbox" id="particles-enabled" checked>
<input type="checkbox" id="particles-enabled">
Background Particles
</label>
<small class="settings-hint">Animated particle effects behind each page. Disable to reduce GPU usage.</small>
<small class="settings-hint">Animated particle effects behind each page. Off by default — enable for the eye candy (uses GPU).</small>
</div>
<div class="form-group">
<label class="checkbox-label">

View file

@ -260,10 +260,11 @@ function applyReduceEffects(enabled) {
}
const saved = localStorage.getItem('soulsync-accent');
if (saved) applyAccentColor(saved);
// Bootstrap particles setting from localStorage
// Bootstrap particles setting from localStorage — OFF by default (continuous
// full-page canvas = real GPU cost); only on when the user explicitly enabled it.
const particlesSaved = localStorage.getItem('soulsync-particles');
if (particlesSaved === 'false') {
window._particlesEnabled = false;
window._particlesEnabled = (particlesSaved === 'true');
if (!window._particlesEnabled) {
const canvas = document.getElementById('page-particles-canvas');
if (canvas) canvas.style.display = 'none';
}

View file

@ -1387,7 +1387,7 @@ async function loadSettingsData() {
sidebarVisualizerType = vizType;
// Background particles toggle
const particlesEnabled = settings.ui_appearance?.particles_enabled !== false; // default true
const particlesEnabled = settings.ui_appearance?.particles_enabled === true; // default OFF (GPU cost)
const particlesCheckbox = document.getElementById('particles-enabled');
if (particlesCheckbox) particlesCheckbox.checked = particlesEnabled;
applyParticlesSetting(particlesEnabled);