From c9e61440f4eab964b94734836c96be85fa8f6a74 Mon Sep 17 00:00:00 2001 From: rajat-ht Date: Fri, 2 May 2025 18:18:52 +0530 Subject: [PATCH 1/3] chore: Update announcement bar --- src/lib/util/promos/April2025.svelte | 70 ++++++++++++++++++++-------- 1 file changed, 51 insertions(+), 19 deletions(-) diff --git a/src/lib/util/promos/April2025.svelte b/src/lib/util/promos/April2025.svelte index 3c1e2c72..ebc615e9 100644 --- a/src/lib/util/promos/April2025.svelte +++ b/src/lib/util/promos/April2025.svelte @@ -21,7 +21,38 @@ const commonParams = { utm_source: C.utmSource, utm_medium: 'banner_ad' } as const; - const taglines: Taglines[] = [ + const randomTagLines: Taglines[] = [ + { + label: 'Customize your layout and design in Mermaid Chart’s whiteboard!', + url: { + path: '/whiteboard', + params: { utm_campaign: 'whiteboard' } + } + }, + { + label: 'Customize your layout and design in Mermaid Chart’s visual editor!', + url: { + path: '/whiteboard', + params: { utm_campaign: 'visual_editor' } + } + }, + { + label: 'Customize your layout and design with Mermaid Chart’s GUI!', + url: { + path: '/whiteboard', + params: { utm_campaign: 'GUI' } + } + }, + { + label: 'Customize your layout and design in Mermaid Chart!', + url: { + path: '/whiteboard', + params: { utm_campaign: 'visual_editor_whiteboard_gui' } + } + } + ]; + + let taglines: Taglines[] = [ { label: 'Replace ChatGPT Pro, Mermaid.live, and Lucid Chart with Mermaid Chart', url: { @@ -35,33 +66,34 @@ path: '/landing', params: { utm_campaign: 'team_collaboration' } } - }, - { - label: 'Use the Visual Editor in Mermaid Chart to design and build diagrams', - url: { - path: '/landing', - params: { utm_campaign: 'visual_editor' } - } - }, - { - label: 'Explore the Mermaid Whiteboard from the creators of Mermaid', - url: { - path: '/whiteboard', - params: { utm_campaign: 'whiteboard' } - } } ]; + let selectedHeadlineIndex = getSessionHeadlineIndex(); - let index = Math.floor(Math.random() * taglines.length); - let currentTagline = $state(taglines[index]); + let currentBannerSet = [...taglines, randomTagLines[selectedHeadlineIndex]]; + + let index = Math.floor(Math.random() * currentBannerSet.length); + let currentTagline = $state(currentBannerSet[index]); const interval = setInterval(() => { if (shouldAnimate) { - index = (index + 1) % taglines.length; - currentTagline = taglines[index]; + index = (index + 1) % currentBannerSet.length; + currentTagline = currentBannerSet[index]; } }, 5000); + function getSessionHeadlineIndex(): number { + const storedIndex = sessionStorage.getItem('mermaidBannerIndex'); + + if (storedIndex === null) { + const newIndex = Math.floor(Math.random() * randomTagLines.length); + sessionStorage.setItem('mermaidBannerIndex', newIndex.toString()); + return newIndex; + } + + return Number.parseInt(storedIndex, 10); + } + onDestroy(() => { clearInterval(interval); }); From 0b5a038c9d0d5b9e78e2ea1cb8a5a17b97fea890 Mon Sep 17 00:00:00 2001 From: Sidharth Vinod Date: Mon, 5 May 2025 21:40:43 +0530 Subject: [PATCH 2/3] chore: Cleanup tagline logic --- src/lib/util/promos/April2025.svelte | 38 ++++++++++++++-------------- 1 file changed, 19 insertions(+), 19 deletions(-) diff --git a/src/lib/util/promos/April2025.svelte b/src/lib/util/promos/April2025.svelte index ebc615e9..9a2f4d98 100644 --- a/src/lib/util/promos/April2025.svelte +++ b/src/lib/util/promos/April2025.svelte @@ -68,37 +68,37 @@ } } ]; - let selectedHeadlineIndex = getSessionHeadlineIndex(); - let currentBannerSet = [...taglines, randomTagLines[selectedHeadlineIndex]]; + const getRandomIndex = (array: unknown[]) => Math.floor(Math.random() * array.length); + const getSessionHeadlineIndex = (): number => { + const storageKey = 'mermaidBannerIndex'; + const storedIndex = sessionStorage.getItem(storageKey); - let index = Math.floor(Math.random() * currentBannerSet.length); - let currentTagline = $state(currentBannerSet[index]); + if (storedIndex) { + return Number.parseInt(storedIndex, 10); + } + + const randomIndex = getRandomIndex(randomTagLines); + sessionStorage.setItem(storageKey, randomIndex.toString()); + return randomIndex; + }; + + const selectedHeadlineIndex = getSessionHeadlineIndex(); + const currentBannerSet = [...taglines, randomTagLines[selectedHeadlineIndex]]; + + let index = $state(getRandomIndex(currentBannerSet)); + let currentTagline = $derived(currentBannerSet[index]); + let shouldAnimate = $state(true); const interval = setInterval(() => { if (shouldAnimate) { index = (index + 1) % currentBannerSet.length; - currentTagline = currentBannerSet[index]; } }, 5000); - function getSessionHeadlineIndex(): number { - const storedIndex = sessionStorage.getItem('mermaidBannerIndex'); - - if (storedIndex === null) { - const newIndex = Math.floor(Math.random() * randomTagLines.length); - sessionStorage.setItem('mermaidBannerIndex', newIndex.toString()); - return newIndex; - } - - return Number.parseInt(storedIndex, 10); - } - onDestroy(() => { clearInterval(interval); }); - - let shouldAnimate = $state(true);
Date: Mon, 5 May 2025 23:50:20 +0530 Subject: [PATCH 3/3] Update as per PR suggestion --- src/lib/util/promos/April2025.svelte | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/lib/util/promos/April2025.svelte b/src/lib/util/promos/April2025.svelte index 9a2f4d98..6b57098f 100644 --- a/src/lib/util/promos/April2025.svelte +++ b/src/lib/util/promos/April2025.svelte @@ -40,7 +40,7 @@ label: 'Customize your layout and design with Mermaid Chart’s GUI!', url: { path: '/whiteboard', - params: { utm_campaign: 'GUI' } + params: { utm_campaign: 'gui' } } }, {