One lightbox at a time; proper dismiss of "read more" screen; proper in-progress draft HEIC images
This commit is contained in:
parent
01b015680b
commit
9ca9f743c3
7 changed files with 26 additions and 37 deletions
|
@ -22,6 +22,7 @@ import { IMAGE_PNG, isImage, isVideo } from '../types/MIME';
|
|||
import { LocalizerType } from '../types/Util';
|
||||
import { MediaItemType, MessageAttributesType } from '../types/MediaItem';
|
||||
import { formatDuration } from '../util/formatDuration';
|
||||
import { useRestoreFocus } from '../util/hooks/useRestoreFocus';
|
||||
|
||||
export type PropsType = {
|
||||
children?: ReactNode;
|
||||
|
@ -55,20 +56,13 @@ export function Lightbox({
|
|||
initialSelectedIndex
|
||||
);
|
||||
|
||||
const [previousFocus, setPreviousFocus] = useState<HTMLElement | undefined>();
|
||||
const [videoElement, setVideoElement] = useState<HTMLVideoElement | null>(
|
||||
null
|
||||
);
|
||||
const [videoTime, setVideoTime] = useState<number | undefined>();
|
||||
const [zoomed, setZoomed] = useState(false);
|
||||
const containerRef = useRef<HTMLDivElement | null>(null);
|
||||
const focusRef = useRef<HTMLDivElement | null>(null);
|
||||
|
||||
const restorePreviousFocus = useCallback(() => {
|
||||
if (previousFocus && previousFocus.focus) {
|
||||
previousFocus.focus();
|
||||
}
|
||||
}, [previousFocus]);
|
||||
const [focusRef] = useRestoreFocus();
|
||||
|
||||
const onPrevious = useCallback(() => {
|
||||
setSelectedIndex(prevSelectedIndex => Math.max(prevSelectedIndex - 1, 0));
|
||||
|
@ -167,18 +161,6 @@ export function Lightbox({
|
|||
};
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
if (!previousFocus) {
|
||||
setPreviousFocus(document.activeElement as HTMLElement);
|
||||
}
|
||||
}, [previousFocus]);
|
||||
|
||||
useEffect(() => {
|
||||
return () => {
|
||||
restorePreviousFocus();
|
||||
};
|
||||
}, [restorePreviousFocus]);
|
||||
|
||||
useEffect(() => {
|
||||
const useCapture = true;
|
||||
document.addEventListener('keydown', onKeyDown, useCapture);
|
||||
|
@ -191,10 +173,6 @@ export function Lightbox({
|
|||
useEffect(() => {
|
||||
playVideo();
|
||||
|
||||
if (focusRef && focusRef.current) {
|
||||
focusRef.current.focus();
|
||||
}
|
||||
|
||||
if (videoElement && isViewOnce) {
|
||||
videoElement.addEventListener('timeupdate', onTimeUpdate);
|
||||
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue