Skip to content
Source
Sign inSign up
Open History to see the last commit

work-shimmer-steps.ts

21 lines801 Bytes

1export const SHIMMER_SWEEP_MS = 1_350;
2export const SHIMMER_PAUSE_MS = 1_450;
3export const SHIMMER_STEPS = 12;
4const SHIMMER_STEP_MS = SHIMMER_SWEEP_MS / SHIMMER_STEPS;
5​
6// No progress updates run during the pause. Progress 0 and 1 both sit off the
7// content, so the cycle only needs steps 1 through SHIMMER_STEPS.
8export function startShimmerSteps(progress: { setValue(value: number): void }): () => void {
9 let step = 0;
10 let timer: ReturnType<typeof setTimeout>;
11 const advance = () => {
12 step = (step % SHIMMER_STEPS) + 1;
13 progress.setValue(step / SHIMMER_STEPS);
14 timer = setTimeout(
15 advance,
16 step === SHIMMER_STEPS ? SHIMMER_PAUSE_MS + SHIMMER_STEP_MS : SHIMMER_STEP_MS,
17 );
18 };
19 timer = setTimeout(advance, SHIMMER_STEP_MS);
20 return () => clearTimeout(timer);