EPUB resize debounce working perfectly
This commit is contained in:
parent
868bb88988
commit
99868f29b2
3 changed files with 12 additions and 8 deletions
|
|
@ -79,17 +79,17 @@ export function EPUBViewer({ className = '' }: EPUBViewerProps) {
|
||||||
}, [extractPageText]);
|
}, [extractPageText]);
|
||||||
|
|
||||||
const checkResize = useCallback(() => {
|
const checkResize = useCallback(() => {
|
||||||
if (isResizing && bookRef.current?.isOpen && rendition.current && isEPUBSetOnce.current) {
|
if (isResizing && dimensions && bookRef.current?.isOpen && rendition.current && isEPUBSetOnce.current) {
|
||||||
pause();
|
pause();
|
||||||
// Only extract text when we have dimensions, ensuring the resize is complete
|
// Only extract text when we have dimensions, ensuring the resize is complete
|
||||||
if (dimensions) extractPageText(bookRef.current, rendition.current, true);
|
extractPageText(bookRef.current, rendition.current, true);
|
||||||
setIsResizing(false);
|
setIsResizing(false);
|
||||||
|
|
||||||
return true;
|
return true;
|
||||||
} else {
|
} else {
|
||||||
return false;
|
return false;
|
||||||
}
|
}
|
||||||
}, [isResizing, dimensions, pause, extractPageText]);
|
}, [isResizing, setIsResizing, dimensions, pause, extractPageText]);
|
||||||
|
|
||||||
// Check for isResizing to pause TTS and re-extract text
|
// Check for isResizing to pause TTS and re-extract text
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
|
|
|
||||||
|
|
@ -195,7 +195,7 @@ export function TTSProvider({ children }: { children: ReactNode }) {
|
||||||
setSentences([]);
|
setSentences([]);
|
||||||
setCurrDocPage(location);
|
setCurrDocPage(location);
|
||||||
|
|
||||||
}, [abortAudio, isPlaying]);
|
}, [abortAudio]);
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Moves to the next or previous sentence
|
* Moves to the next or previous sentence
|
||||||
|
|
|
||||||
|
|
@ -10,12 +10,16 @@ export function useEPUBResize(containerRef: RefObject<HTMLDivElement | null>) {
|
||||||
const entries = args[0] as ResizeObserverEntry[];
|
const entries = args[0] as ResizeObserverEntry[];
|
||||||
console.log('Debounced resize', entries[0].contentRect);
|
console.log('Debounced resize', entries[0].contentRect);
|
||||||
setDimensions(entries[0].contentRect);
|
setDimensions(entries[0].contentRect);
|
||||||
|
setIsResizing((prev) => {
|
||||||
|
if (!prev) return true;
|
||||||
|
return prev;
|
||||||
|
});
|
||||||
}, 150);
|
}, 150);
|
||||||
|
|
||||||
const resizeObserver = new ResizeObserver((entries) => {
|
const resizeObserver = new ResizeObserver((entries) => {
|
||||||
if (!isResizing) {
|
// if (!isResizing) {
|
||||||
setIsResizing(true);
|
// setIsResizing(true);
|
||||||
}
|
// }
|
||||||
debouncedResize(entries);
|
debouncedResize(entries);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
@ -51,7 +55,7 @@ export function useEPUBResize(containerRef: RefObject<HTMLDivElement | null>) {
|
||||||
mutationObserver.disconnect();
|
mutationObserver.disconnect();
|
||||||
resizeObserver.disconnect();
|
resizeObserver.disconnect();
|
||||||
};
|
};
|
||||||
}, [containerRef]);
|
}, [containerRef]);
|
||||||
|
|
||||||
return { isResizing, setIsResizing, dimensions };
|
return { isResizing, setIsResizing, dimensions };
|
||||||
}
|
}
|
||||||
Loading…
Reference in a new issue