diff --git a/src/App.svelte b/src/App.svelte index 60587ee..db20630 100644 --- a/src/App.svelte +++ b/src/App.svelte @@ -93,6 +93,7 @@ let overlayBusy = false; let overlaySavedSignature = ''; let overlayAutosaveAttemptedSignature = ''; + let pendingOverlayDraft: { overlayName: string; overlaySlug: string; overlayHtml: string; overlayCss: string; overlayJavascript: string; overlayEnabled: boolean; overlayDisabledDesign: string } | null = null; let overlayAutosaveTimer: number | undefined; let oauthScopes: Record<'streamer' | 'bot', { connected: boolean; missing_scopes: string[]; reauthorization_required: boolean }> = { streamer: { connected: false, missing_scopes: [], reauthorization_required: false }, @@ -705,6 +706,7 @@ } function selectOverlay(overlay: (typeof overlays)[number]) { + pendingOverlayDraft = null; selectedOverlayId = overlay.id; overlayName = overlay.name; overlaySlug = overlay.slug; @@ -739,15 +741,16 @@ try { const cached = JSON.parse(localStorage.getItem(overlayDraftCacheKey(id)) || 'null') as Partial<{ overlayName: string; overlaySlug: string; overlayHtml: string; overlayCss: string; overlayJavascript: string; overlayEnabled: boolean; overlayDisabledDesign: string }> | null; if (!cached || typeof cached.overlayName !== 'string') return; - overlayName = cached.overlayName; - overlaySlug = cached.overlaySlug ?? overlaySlug; - overlayHtml = cached.overlayHtml ?? overlayHtml; - overlayCss = cached.overlayCss ?? overlayCss; - overlayJavascript = cached.overlayJavascript ?? overlayJavascript; - overlayEnabled = cached.overlayEnabled ?? overlayEnabled; - overlayDisabledDesign = cached.overlayDisabledDesign ?? overlayDisabledDesign; - overlaySavedSignature = ''; - overlayAutosaveAttemptedSignature = ''; + const cachedSignature = JSON.stringify(cached); + if (cachedSignature !== overlayDraftSignature()) pendingOverlayDraft = { + overlayName: cached.overlayName, + overlaySlug: cached.overlaySlug ?? overlaySlug, + overlayHtml: cached.overlayHtml ?? overlayHtml, + overlayCss: cached.overlayCss ?? overlayCss, + overlayJavascript: cached.overlayJavascript ?? overlayJavascript, + overlayEnabled: cached.overlayEnabled ?? overlayEnabled, + overlayDisabledDesign: cached.overlayDisabledDesign ?? overlayDisabledDesign, + }; } catch { // Ignore malformed or unavailable local cache entries. } @@ -758,6 +761,7 @@ overlayAutosaveTimer = undefined; overlaySavedSignature = ''; overlayAutosaveAttemptedSignature = ''; + pendingOverlayDraft = null; selectedOverlayId = ''; overlayName = 'New Overlay'; overlaySlug = `overlay-${Date.now()}`; @@ -768,6 +772,19 @@ overlayDisabledDesign = 'transparent'; } + function restorePendingOverlayDraft() { + if (!pendingOverlayDraft) return; + ({ overlayName, overlaySlug, overlayHtml, overlayCss, overlayJavascript, overlayEnabled, overlayDisabledDesign } = pendingOverlayDraft); + pendingOverlayDraft = null; + overlaySavedSignature = ''; + overlayAutosaveAttemptedSignature = ''; + } + + function discardPendingOverlayDraft() { + if (selectedOverlayId) localStorage.removeItem(overlayDraftCacheKey(selectedOverlayId)); + pendingOverlayDraft = null; + } + async function saveOverlay() { overlayBusy = true; overlayError = ''; @@ -1002,5 +1019,11 @@ chatThreadRoot && replyToChatMessage(chatThreadRoot)}>REPLY IN THREAD {/if} + {#if pendingOverlayDraft} + + LOCAL OVERLAY DRAFT FOUND + A newer unsaved draft is available for this overlay.RESTORE LOCAL DRAFTDISCARD LOCAL DRAFT + + {/if}