| import { useContext, useEffect, useRef, useState } from 'react' |
| import { ClockContext } from '../components/ClockContext.js' |
|
|
| |
| |
| |
| |
| |
| |
| |
| |
| |
| export function useAnimationTimer(intervalMs: number): number { |
| const clock = useContext(ClockContext) |
| const [time, setTime] = useState(() => clock?.now() ?? 0) |
|
|
| useEffect(() => { |
| if (!clock) return |
|
|
| let lastUpdate = clock.now() |
|
|
| const onChange = (): void => { |
| const now = clock.now() |
| if (now - lastUpdate >= intervalMs) { |
| lastUpdate = now |
| setTime(now) |
| } |
| } |
|
|
| return clock.subscribe(onChange, false) |
| }, [clock, intervalMs]) |
|
|
| return time |
| } |
|
|
| |
| |
| |
| |
| |
| |
| |
| export function useInterval( |
| callback: () => void, |
| intervalMs: number | null, |
| ): void { |
| const callbackRef = useRef(callback) |
| callbackRef.current = callback |
|
|
| const clock = useContext(ClockContext) |
|
|
| useEffect(() => { |
| if (!clock || intervalMs === null) return |
|
|
| let lastUpdate = clock.now() |
|
|
| const onChange = (): void => { |
| const now = clock.now() |
| if (now - lastUpdate >= intervalMs) { |
| lastUpdate = now |
| callbackRef.current() |
| } |
| } |
|
|
| return clock.subscribe(onChange, false) |
| }, [clock, intervalMs]) |
| } |
|
|