Add weather simulation + debug-panel weather controls
- weatherSim config flag (default false): cycles through ['sunny','cloudy','stormy','night'] every weatherSimInterval ms instead of pulling open-meteo - Debug-panel buttons: Sunny / Cloudy / Stormy / Night for instant manual switch; Auto-Cycle toggle, Stop, 5s/15s cycle - Cleanup: removed duplicate unwrapped tick() in the init block (the wrapped one already starts the rAF chain) The sim keeps the existing 5-minute palette transition between states, so you still see the colour shift rather than a hard cut.
This commit is contained in:
Richard Zink committed
1 parent
1f90276fed
commit
1bf1b708e8
2 files changed
+100
-4
No files matched your search
+92
-4
@@ -107,6 +107,22 @@
|
||||
border: 1px solid var(--stone);
|
||||
border-radius: 2px;
|
||||
}
|
||||
.debug-row-buttons {
|
||||
flex-wrap: wrap;
|
||||
gap: 4px;
|
||||
}
|
||||
.dbg-btn {
|
||||
background: var(--panel);
|
||||
color: var(--icon);
|
||||
border: 1px solid var(--border);
|
||||
border-radius: 2px;
|
||||
padding: 2px 8px;
|
||||
font-size: 11px;
|
||||
font-family: inherit;
|
||||
cursor: pointer;
|
||||
}
|
||||
.dbg-btn:hover { background: var(--raised); }
|
||||
.dbg-btn.dbg-btn-toggle.on { background: var(--ember); color: var(--dark); }
|
||||
.theme-table {
|
||||
font-size: 0.9em;
|
||||
margin-top: 4px;
|
||||
@@ -339,7 +355,23 @@
|
||||
</div>
|
||||
<div class="debug-row"><span class="debug-label">Time:</span> <span id="dbg-time">--</span></div>
|
||||
<div class="debug-row"><span class="debug-label">Day%:</span> <span id="dbg-day">--</span></div>
|
||||
<div class="debug-row"><span class="debug-label">Weather:</span> <span id="dbg-weather">--</span></div>
|
||||
<div class="debug-row">
|
||||
<span class="debug-label">Weather:</span>
|
||||
<span id="dbg-weather">--</span>
|
||||
</div>
|
||||
<div class="debug-row debug-row-buttons">
|
||||
<button class="dbg-btn" onclick="setWeatherTheme('sunny')">Sunny</button>
|
||||
<button class="dbg-btn" onclick="setWeatherTheme('cloudy')">Cloudy</button>
|
||||
<button class="dbg-btn" onclick="setWeatherTheme('stormy')">Stormy</button>
|
||||
<button class="dbg-btn" onclick="setWeatherTheme('night')">Night</button>
|
||||
</div>
|
||||
<div class="debug-row debug-row-buttons">
|
||||
<button class="dbg-btn dbg-btn-toggle" id="dbg-btn-sim"
|
||||
onclick="toggleWeatherSim()">Auto-Cycle: off</button>
|
||||
<button class="dbg-btn" onclick="stopWeatherSim()">Stop</button>
|
||||
<button class="dbg-btn" onclick="startWeatherSim(15000)">15s cycle</button>
|
||||
<button class="dbg-btn" onclick="startWeatherSim(5000)">5s cycle</button>
|
||||
</div>
|
||||
<div class="debug-row"><span class="debug-label">Theme:</span> <span id="dbg-theme">--</span></div>
|
||||
<div class="debug-row"><span class="debug-label">Speed:</span> <span id="dbg-speed">--</span></div>
|
||||
<div class="debug-row"><span class="debug-label">Transition:</span> <span id="dbg-trans">--</span></div>
|
||||
@@ -1414,6 +1446,57 @@ window.weatherThemes = {
|
||||
}
|
||||
}
|
||||
|
||||
// ---- Weather simulation -----------------------------------------
|
||||
// Cycles through a list of weather states automatically. Useful
|
||||
// for A/B testing the renderer against every theme without
|
||||
// waiting on the open-meteo API.
|
||||
var simWeathers = ['sunny', 'cloudy', 'stormy', 'night'];
|
||||
var simIndex = 0;
|
||||
var simTimer = null;
|
||||
var __weatherSimActive = false;
|
||||
|
||||
function startWeatherSim(intervalMs) {
|
||||
stopWeatherSim();
|
||||
var step = intervalMs || (window.CONFIG && window.CONFIG.weatherSimInterval) || 30000;
|
||||
simIndex = 0;
|
||||
setWeatherTheme(simWeathers[simIndex]);
|
||||
simTimer = setInterval(function() {
|
||||
simIndex = (simIndex + 1) % simWeathers.length;
|
||||
setWeatherTheme(simWeathers[simIndex]);
|
||||
}, step);
|
||||
__weatherSimActive = true;
|
||||
}
|
||||
|
||||
function stopWeatherSim() {
|
||||
if (simTimer) {
|
||||
clearInterval(simTimer);
|
||||
simTimer = null;
|
||||
}
|
||||
__weatherSimActive = false;
|
||||
updateSimButton();
|
||||
}
|
||||
|
||||
function updateSimButton() {
|
||||
var btn = document.getElementById('dbg-btn-sim');
|
||||
if (btn) {
|
||||
btn.textContent = 'Auto-Cycle: ' + (__weatherSimActive ? 'on' : 'off');
|
||||
btn.classList.toggle('on', __weatherSimActive);
|
||||
}
|
||||
}
|
||||
|
||||
function toggleWeatherSim() {
|
||||
if (__weatherSimActive) {
|
||||
stopWeatherSim();
|
||||
} else {
|
||||
startWeatherSim();
|
||||
}
|
||||
updateSimButton();
|
||||
}
|
||||
|
||||
// Periodically refresh the toggle state in case another tab
|
||||
// toggled it.
|
||||
setInterval(updateSimButton, 1000);
|
||||
|
||||
function getEffectiveThemeColors() {
|
||||
if (!targetThemeColors) return null;
|
||||
|
||||
@@ -1983,9 +2066,14 @@ window.weatherThemes = {
|
||||
animate();
|
||||
try { tick(); } catch (e) { console.error('Initial tick error:', e); }
|
||||
|
||||
fetchWeather();
|
||||
setInterval(fetchWeather, 15 * 60 * 1000);
|
||||
tick();
|
||||
// Weather source: real open-meteo API or local simulation
|
||||
if (window.CONFIG && window.CONFIG.weatherSim) {
|
||||
startWeatherSim(window.CONFIG.weatherSimInterval);
|
||||
updateSimButton();
|
||||
} else {
|
||||
fetchWeather();
|
||||
setInterval(fetchWeather, 15 * 60 * 1000);
|
||||
}
|
||||
} catch (e) {
|
||||
window.__clouds2dError = e.message || String(e);
|
||||
console.error('Background init error:', e);
|
||||
|
||||
@@ -94,4 +94,12 @@ window.THEMES = {
|
||||
'ash': 'ash.css',
|
||||
'gruvbox': 'gruvbox.css',
|
||||
'nord': 'nord.css'
|
||||
|
||||
// weatherSim - If true, ignore open-meteo and cycle through
|
||||
// ['sunny', 'cloudy', 'stormy', 'night'] automatically
|
||||
// every weatherSimInterval ms. Useful for testing
|
||||
// every theme without waiting on the API.
|
||||
// weatherSimInterval - Sim cycle period in ms (default 30000).
|
||||
weatherSim: false,
|
||||
weatherSimInterval: 30000,
|
||||
};
|
||||
Reference in new issue
Block a user