Mirror/intercept
1
0
Fork 0
mirror of https://github.com/smittix/intercept.git synced 2026-04-24 06:40:00 -07:00
Code Issues Packages Projects Releases Wiki Activity

Lazy-load satellite iframe on main dashboard

Browse Source
This commit is contained in:
James Smith
2026-03-19 09:05:48 +00:00
parent 007a8d50c6
commit aaed831420
1 changed files with 16 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

43
templates/index.html
View File

@@ -20,7 +20,6 @@
<link rel="preconnect" href="https://fonts.googleapis.com" crossorigin> <link rel="preconnect" href="https://fonts.googleapis.com" crossorigin>
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
{% endif %} {% endif %}
<link rel="preconnect" href="https://cartodb-basemaps-a.global.ssl.fastly.net" crossorigin>
<!-- Disclaimer gate - must accept before seeing welcome page --> <!-- Disclaimer gate - must accept before seeing welcome page -->
<script> <script>
// Check BEFORE page renders - if disclaimer not accepted, hide welcome page // Check BEFORE page renders - if disclaimer not accepted, hide welcome page
@@ -162,28 +161,9 @@
if (!mode) return; if (!mode) return;
window.ensureModeStyles(mode).catch(() => {}); window.ensureModeStyles(mode).catch(() => {});
})(); })();
// Warm remaining lazy mode styles in the background to avoid first-switch FOUC. // Do not warm every mode stylesheet on the welcome page. The eager
(function warmModeStylesInBackground() { // background fetch storm was adding substantial cross-mode load and
const modeMap = window.INTERCEPT_MODE_STYLE_MAP || {}; // delaying dedicated dashboards like ADS-B.
const queryMode = new URLSearchParams(window.location.search).get('mode');
const selectedMode = queryMode === 'listening' ? 'waterfall' : queryMode;
const modes = Object.keys(modeMap).filter((mode) => mode !== selectedMode);
if (!modes.length) return;
const warm = function () {
modes.forEach(function (mode, index) {
setTimeout(function () {
window.ensureModeStyles(mode).catch(() => {});
}, index * 40);
});
};
if (typeof window.requestIdleCallback === 'function') {
window.requestIdleCallback(warm, { timeout: 2000 });
} else {
setTimeout(warm, 600);
}
})();
</script> </script>
<script> <script>
window.INTERCEPT_MODE_SCRIPT_MAP = { window.INTERCEPT_MODE_SCRIPT_MAP = {
@@ -1416,8 +1396,9 @@
<!-- Satellite Dashboard (Embedded) --> <!-- Satellite Dashboard (Embedded) -->
<div id="satelliteVisuals" class="satellite-dashboard-embed" style="display: none;"> <div id="satelliteVisuals" class="satellite-dashboard-embed" style="display: none;">
<iframe id="satelliteDashboardFrame" src="/satellite/dashboard?embedded=true&v={{ version }}" frameborder="0" <iframe id="satelliteDashboardFrame" data-src="/satellite/dashboard?embedded=true&v={{ version }}" frameborder="0"
style="width: 100%; height: 100%; min-height: 700px; border: none; border-radius: 8px;" style="width: 100%; height: 100%; min-height: 700px; border: none; border-radius: 8px;"
loading="lazy"
allowfullscreen> allowfullscreen>
</iframe> </iframe>
</div> </div>
@@ -4596,10 +4577,18 @@
if (satelliteVisuals) satelliteVisuals.style.display = mode === 'satellite' ? 'block' : 'none'; if (satelliteVisuals) satelliteVisuals.style.display = mode === 'satellite' ? 'block' : 'none';
const satFrame = document.getElementById('satelliteDashboardFrame'); const satFrame = document.getElementById('satelliteDashboardFrame');
if (satFrame && mode === 'satellite') { if (satFrame && mode === 'satellite') {
const baseSrc = '/satellite/dashboard?embedded=true&v={{ version }}'; const baseSrc = satFrame.dataset.src || '/satellite/dashboard?embedded=true&v={{ version }}';
satFrame.src = `${baseSrc}&ts=${Date.now()}`; const currentSrc = satFrame.getAttribute('src') || '';
if (!currentSrc || currentSrc === 'about:blank') {
satFrame.src = `${baseSrc}&ts=${Date.now()}`;
}
} else if (satFrame) {
const currentSrc = satFrame.getAttribute('src') || '';
if (currentSrc && currentSrc !== 'about:blank') {
satFrame.src = 'about:blank';
}
} }
if (satFrame && satFrame.contentWindow) { if (satFrame && satFrame.contentWindow && satFrame.getAttribute('src') && satFrame.getAttribute('src') !== 'about:blank') {
satFrame.contentWindow.postMessage({type: 'satellite-visibility', visible: mode === 'satellite'}, '*'); satFrame.contentWindow.postMessage({type: 'satellite-visibility', visible: mode === 'satellite'}, '*');
} }