|
@@ -192,6 +192,12 @@ function PhotoViewer(props: Iprops) {
|
|
case 'L':
|
|
case 'L':
|
|
onFavClick(photoSwipe?.currItem as EnteFile);
|
|
onFavClick(photoSwipe?.currItem as EnteFile);
|
|
break;
|
|
break;
|
|
|
|
+ case 'ArrowLeft':
|
|
|
|
+ handleArrowClick(event, 'left');
|
|
|
|
+ break;
|
|
|
|
+ case 'ArrowRight':
|
|
|
|
+ handleArrowClick(event, 'right');
|
|
|
|
+ break;
|
|
default:
|
|
default:
|
|
break;
|
|
break;
|
|
}
|
|
}
|
|
@@ -352,6 +358,7 @@ function PhotoViewer(props: Iprops) {
|
|
maxSpreadZoom: 5,
|
|
maxSpreadZoom: 5,
|
|
index: currentIndex,
|
|
index: currentIndex,
|
|
showHideOpacity: true,
|
|
showHideOpacity: true,
|
|
|
|
+ arrowKeys: false,
|
|
getDoubleTapZoom(isMouseClick, item) {
|
|
getDoubleTapZoom(isMouseClick, item) {
|
|
if (isMouseClick) {
|
|
if (isMouseClick) {
|
|
return 2.5;
|
|
return 2.5;
|
|
@@ -505,6 +512,24 @@ function PhotoViewer(props: Iprops) {
|
|
appContext.setDialogMessage(getTrashFileMessage(() => trashFile(file)));
|
|
appContext.setDialogMessage(getTrashFileMessage(() => trashFile(file)));
|
|
};
|
|
};
|
|
|
|
|
|
|
|
+ const handleArrowClick = (
|
|
|
|
+ e: KeyboardEvent,
|
|
|
|
+ direction: 'left' | 'right'
|
|
|
|
+ ) => {
|
|
|
|
+ // ignore arrow clicks if the user is typing in a text field
|
|
|
|
+ if (
|
|
|
|
+ e.target instanceof HTMLInputElement ||
|
|
|
|
+ e.target instanceof HTMLTextAreaElement
|
|
|
|
+ ) {
|
|
|
|
+ return;
|
|
|
|
+ }
|
|
|
|
+ if (direction === 'left') {
|
|
|
|
+ photoSwipe.prev();
|
|
|
|
+ } else {
|
|
|
|
+ photoSwipe.next();
|
|
|
|
+ }
|
|
|
|
+ };
|
|
|
|
+
|
|
const updateItems = (items: EnteFile[]) => {
|
|
const updateItems = (items: EnteFile[]) => {
|
|
try {
|
|
try {
|
|
if (photoSwipe) {
|
|
if (photoSwipe) {
|