diff --git a/src/components/molecules/ProcessStep.svelte b/src/components/molecules/ProcessStep.svelte index 27bc1a0..19af9d3 100644 --- a/src/components/molecules/ProcessStep.svelte +++ b/src/components/molecules/ProcessStep.svelte @@ -13,19 +13,10 @@ export let text: string export let image: any = undefined export let video: any = undefined - export let visible: boolean = false - - let videoEl: HTMLVideoElement const imageRatio = image ? image.width / image.height : undefined - - // Toggle video playback if step is visible - $: if (videoEl) { - visible ? videoEl.play() : videoEl.pause() - } -{#if visible}
- {:else if video} -
-{/if} \ No newline at end of file + \ No newline at end of file diff --git a/src/routes/about/+page.svelte b/src/routes/about/+page.svelte index 8ab49d3..7ef6ce9 100644 --- a/src/routes/about/+page.svelte +++ b/src/routes/about/+page.svelte @@ -21,18 +21,18 @@ import AboutGridPhoto from '$components/atoms/AboutGridPhoto.svelte' import ProcessStep from '$components/molecules/ProcessStep.svelte' import Banner from '$components/organisms/Banner.svelte' + import { sendEvent } from '$utils/analytics'; export let data: PageData const { about, photos } = data let scrollY: number, innerWidth: number, innerHeight: number let photosGridEl: HTMLElement - let currentStep: number = 0 let photosGridOffset: number = photosGridEl && photosGridEl.offsetTop + let currentStep: number = 0 let emailCopied: string = null let emailCopiedTimeout: ReturnType | number - $: currentStep = $page.url.hash ? Number($page.url.hash.split('#step-')[1]) - 1 : 0 $: parallaxPhotos = photosGridEl && map(scrollY, photosGridOffset - innerHeight, photosGridOffset + innerHeight / 1.5, 0, innerHeight * 0.15, true) $: fadedPhotosIndexes = innerWidth > 768 ? [0, 2, 5, 7, 9, 12, 17, 20, 22, 26, 30, 32, 34] @@ -315,7 +315,12 @@
    {#each about.process_steps as { title }, index}
  1. - + { + currentStep = index + sendEvent({ action: 'aboutStepSwitch' }) + }} + > {title}
  2. @@ -325,15 +330,16 @@
    {#each about.process_steps as { text, image, video_mp4, video_webm }, index} - + {#if index === currentStep} + + {/if} {/each}