diff --git a/src/seqta/ui/ImageBackgrounds.ts b/src/seqta/ui/ImageBackgrounds.ts index 83b630fd..c20e5f11 100644 --- a/src/seqta/ui/ImageBackgrounds.ts +++ b/src/seqta/ui/ImageBackgrounds.ts @@ -20,6 +20,8 @@ export async function appendBackgroundToUI() { return; } +let lastLoadedId: string | null = null; + export async function loadBackground() { if (!isIndexedDBSupported()) { console.error("IndexedDB is not supported. Unable to load background."); @@ -33,12 +35,21 @@ export async function loadBackground() { if (backgroundContainer) { backgroundContainer.remove(); } + lastLoadedId = null; return; } const background = await getDataById(selectedBackgroundId); if (!background) return; + // Skip reload if background hasn't changed and media element already exists + if ( + selectedBackgroundId === lastLoadedId && + document.querySelector("#media-container > .background") + ) { + return; + } + let backgroundContainer = document.querySelector(".imageBackground"); if (!backgroundContainer) { backgroundContainer = document.createElement("div"); @@ -77,6 +88,7 @@ export async function loadBackground() { } mediaContainer.appendChild(mediaElement); + lastLoadedId = selectedBackgroundId; } catch (error) { console.error("Error loading background:", error); }