diff --git a/js/modal/GridModal.js b/js/modal/GridModal.js index 36d9522..cc5cc3d 100644 --- a/js/modal/GridModal.js +++ b/js/modal/GridModal.js @@ -127,7 +127,7 @@ export class GridModal extends BaseModal { handled = true; this.imageList.toggleSelect(n); } - } else + } else // Cancel the modal with Escape. if ((event.key === 'Escape')) { handled = true; @@ -179,7 +179,7 @@ export class GridModal extends BaseModal { el.addEventListener('image-click', this.handlerImageClick); el.addEventListener('image-mousedown', this.handlerImageMouseDown); el.addEventListener('mouseenter', this.handlerImageMouseEnter); - el.addEventListener('mouseleave', this.handlerImageMouseLeave); + el.addEventListener('mouseleave', this.handlerImageMouseLeave); this.el.imageList.appendChild(el); } } diff --git a/js/modal/ZoomModal.js b/js/modal/ZoomModal.js index 82ffdc5..51a50a6 100644 --- a/js/modal/ZoomModal.js +++ b/js/modal/ZoomModal.js @@ -130,6 +130,8 @@ export class ZoomModal extends BaseModal { onKeyDown(event) { let handled = false; + const letterKey = event.key.toUpperCase(); + // Back to grid view with spacebar. if (event.key === ' ') { handled = true; @@ -145,14 +147,31 @@ export class ZoomModal extends BaseModal { handled = true; this.onSend(); } else - // Move back and forward with arrow keys. - if (event.key === 'Left') { + // Move back and forward with arrow keys or A and D. + if (event.key === 'ArrowLeft' || letterKey === 'A') { handled = true; - this.onPrevious() + this.onPrevious(); } else - if (event.key === 'Right') { + if (event.key === 'ArrowRight' || letterKey === 'D') { handled = true; - this.onCancel(); + this.onNext(); + } else + if (event.key === 'Home') { + handled = true; + thia.onFirst(); + } else + if (event.key === 'End') { + handled = true; + thia.onLast(); + } + // Select an image with E or /. + if (letterKey === 'E' || letterKey === '/') { + handled = true; + + const imageList = this.el.image.imageList, + index = this.el.image.index; + + imageList.toggleSelect(index); } if (handled) {