starred/reiverr
1
0
Fork 0
mirror of https://github.com/aleksilassila/reiverr.git synced 2026-04-18 05:53:14 +02:00
Code Issues Packages Projects Releases Wiki Activity

fix: Add delay to tv hero carousel initial background load

Browse Source
This commit is contained in:
Aleksi Lassila
2024-04-06 01:37:34 +03:00
parent d71dc3999e
commit db379fd252
1 changed files with 10 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
src/lib/components/HeroCarousel/HeroBackground.svelte
View File

@@ -1,13 +1,11 @@
<script lang="ts">
import { PLATFORM_TV } from '../../constants';
import { fade } from 'svelte/transition';
import { cubicIn, cubicOut } from 'svelte/easing';
import classNames from 'classnames';
import { onDestroy } from 'svelte';
export let urls: Promise<string[]>;
export let index: number;
let visibleIndex = -1;
let visibleIndex = -2;
let visibleIndexTimeout: ReturnType<typeof setTimeout>;
let htmlElements: HTMLDivElement[] = [];
@@ -16,15 +14,20 @@
htmlElements[index]?.scrollIntoView({ behavior: 'smooth', block: 'center' });
}
}
$: {
function updateVisibleIndex(index: number) {
if (visibleIndexTimeout) {
clearTimeout(visibleIndexTimeout);
}
visibleIndexTimeout = setTimeout(
() => {
visibleIndex = index;
},
visibleIndex === -2 ? 1000 : 500
);
visibleIndex = -1;
visibleIndexTimeout = setTimeout(() => {
visibleIndex = index;
}, 500);
}
$: updateVisibleIndex(index);
onDestroy(() => visibleIndexTimeout && clearTimeout(visibleIndexTimeout));
</script>