mirror of
https://github.com/Kpa-clawbot/meshcore-analyzer.git
synced 2026-10-23 00:41:42 +00:00
Fix: restore saved colors IMMEDIATELY on script load, not DOMContentLoaded
customize.js loads after roles.js but before app.js triggers navigate(). Restoring colors in the IIFE body (not DOMContentLoaded) ensures ROLE_STYLE/ROLE_COLORS/TYPE_COLORS are updated BEFORE the map or any page creates markers.
This commit is contained in:
1 parent
7f1e6a3959
commit
0f086748f4
2 files changed
+34
-31
No files matched your search
+33
-30
@@ -891,38 +891,41 @@
|
||||
applyThemePreview(); autoSave();
|
||||
}
|
||||
|
||||
// Wire up toggle button
|
||||
// Restore saved user theme IMMEDIATELY (before DOMContentLoaded, before map/app init)
|
||||
// roles.js has already loaded ROLE_COLORS, ROLE_STYLE, TYPE_COLORS at this point
|
||||
try {
|
||||
const saved = localStorage.getItem('meshcore-user-theme');
|
||||
if (saved) {
|
||||
const userTheme = JSON.parse(saved);
|
||||
const dark = document.documentElement.getAttribute('data-theme') === 'dark' ||
|
||||
(document.documentElement.getAttribute('data-theme') !== 'light' && window.matchMedia('(prefers-color-scheme: dark)').matches);
|
||||
const themeData = dark ? (userTheme.themeDark || userTheme.theme) : userTheme.theme;
|
||||
if (themeData) {
|
||||
for (const [key, val] of Object.entries(themeData)) {
|
||||
if (THEME_CSS_MAP[key]) document.documentElement.style.setProperty(THEME_CSS_MAP[key], val);
|
||||
}
|
||||
// Derived vars
|
||||
if (themeData.background) document.documentElement.style.setProperty('--content-bg', themeData.background);
|
||||
if (themeData.surface1) document.documentElement.style.setProperty('--card-bg', themeData.surface1);
|
||||
}
|
||||
if (userTheme.nodeColors) {
|
||||
if (window.ROLE_COLORS) Object.assign(window.ROLE_COLORS, userTheme.nodeColors);
|
||||
if (window.ROLE_STYLE) {
|
||||
for (const [role, color] of Object.entries(userTheme.nodeColors)) {
|
||||
if (window.ROLE_STYLE[role]) window.ROLE_STYLE[role].color = color;
|
||||
}
|
||||
}
|
||||
}
|
||||
if (userTheme.typeColors && window.TYPE_COLORS) {
|
||||
Object.assign(window.TYPE_COLORS, userTheme.typeColors);
|
||||
if (window.syncBadgeColors) window.syncBadgeColors();
|
||||
}
|
||||
}
|
||||
} catch {}
|
||||
|
||||
// Wire up toggle button (needs DOM)
|
||||
document.addEventListener('DOMContentLoaded', () => {
|
||||
const btn = document.getElementById('customizeToggle');
|
||||
if (btn) btn.addEventListener('click', toggle);
|
||||
|
||||
// Auto-apply saved user theme from localStorage
|
||||
try {
|
||||
const saved = localStorage.getItem('meshcore-user-theme');
|
||||
if (saved) {
|
||||
const userTheme = JSON.parse(saved);
|
||||
const dark = document.documentElement.getAttribute('data-theme') === 'dark' ||
|
||||
(document.documentElement.getAttribute('data-theme') !== 'light' && window.matchMedia('(prefers-color-scheme: dark)').matches);
|
||||
const themeData = dark ? (userTheme.themeDark || userTheme.theme) : userTheme.theme;
|
||||
if (themeData) {
|
||||
for (const [key, val] of Object.entries(themeData)) {
|
||||
if (THEME_CSS_MAP[key]) document.documentElement.style.setProperty(THEME_CSS_MAP[key], val);
|
||||
}
|
||||
}
|
||||
if (userTheme.nodeColors) {
|
||||
console.log('[customize] restore nodeColors:', userTheme.nodeColors);
|
||||
if (window.ROLE_COLORS) Object.assign(window.ROLE_COLORS, userTheme.nodeColors);
|
||||
if (window.ROLE_STYLE) {
|
||||
for (const [role, color] of Object.entries(userTheme.nodeColors)) {
|
||||
if (window.ROLE_STYLE[role]) window.ROLE_STYLE[role].color = color;
|
||||
}
|
||||
}
|
||||
}
|
||||
if (userTheme.typeColors && window.TYPE_COLORS) {
|
||||
Object.assign(window.TYPE_COLORS, userTheme.typeColors);
|
||||
if (window.syncBadgeColors) window.syncBadgeColors();
|
||||
}
|
||||
}
|
||||
} catch {}
|
||||
});
|
||||
})();
|
||||
+1
-1
@@ -101,6 +101,6 @@
|
||||
<script src="observer-detail.js?v=1774219440" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="node-analytics.js?v=1774126708" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="perf.js?v=1773985649" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="customize.js?v=1774235201" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
<script src="customize.js?v=1774236352" onerror="console.error('Failed to load:', this.src)"></script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in new issue
Block a user