Miroirs/noc-book-2
1
0
Fork 0
mirror of https://github.com/nature-of-code/noc-book-2 synced 2024-11-17 07:49:05 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

update isRunning state when necessary

Browse source
This commit is contained in:
Jason Gao 2023-10-20 23:11:32 +08:00
parent 2f079aa068
commit 1b2b31e05f
1 changed files with 25 additions and 26 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

51
src/components/Example.js
View file

@ -38,6 +38,7 @@ const Example = (data) => {
const nextFrameCallback = () => {
if (p5Window.frameRate?.() > 0) {
pause();
setIsRunning(false);
} else {
window.requestAnimationFrame(nextFrameCallback);
}
@ -68,36 +69,34 @@ const Example = (data) => {
};
const toggleRunning = () => {
isRunning ? pause() : resume();
if (isRunning) {
pause();
setIsRunning(false);
} else {
resume();
setIsRunning(true);
}
};
const pause = React.useCallback(
(updateIsRunning = true) => {
if (!ref.current) return;
const p5Window = ref.current.contentWindow;
const pause = React.useCallback(() => {
if (!ref.current) return;
const p5Window = ref.current.contentWindow;
const targetFrameRate = p5Window.getTargetFrameRate?.();
if (targetFrameRate > 0) {
p5Window.frameRate(0);
setPausedFrameRate(targetFrameRate);
if (updateIsRunning) setIsRunning(false);
}
},
[ref],
);
const targetFrameRate = p5Window.getTargetFrameRate?.();
if (targetFrameRate > 0 && p5Window.frameRate) {
p5Window.frameRate(0);
setPausedFrameRate(targetFrameRate);
}
}, [ref]);
const resume = React.useCallback(
(updateIsRunning = true) => {
if (!ref.current) return;
const p5Window = ref.current.contentWindow;
const resume = React.useCallback(() => {
if (!ref.current) return;
const p5Window = ref.current.contentWindow;
if (pausedFrameRate > 0 && p5Window.frameRate) {
p5Window.frameRate(pausedFrameRate);
if (updateIsRunning) setIsRunning(true);
}
},
[ref, pausedFrameRate],
);
if (pausedFrameRate > 0 && p5Window.frameRate) {
p5Window.frameRate(pausedFrameRate);
}
}, [ref, pausedFrameRate]);
// Fix for: iframe's load event triggered before component being mounted
// reference: https://github.com/facebook/react/issues/6541
@ -133,7 +132,7 @@ const Example = (data) => {
if (entries.length % 2 === 0) return;
const entry = entries.at(-1);
entry.isIntersecting ? resume(false) : pause(false);
entry.isIntersecting ? resume() : pause();
};
const observer = new IntersectionObserver(intersectionCallback, {