Add keyboard shortcuts to the lightbox.

Also catch errors when trying to loadImage.

web/js/common/lightbox.js

@@ -80,6 +80,12 @@ export class Lightbox {
 	}
 
 	async update(shift) {
+		if (shift < 0 && this.index <= 0) {
+			return;
+		}
+		if (shift > 0 && this.index >= this.images.length - 1) {
+			return;
+		}
 		this.index += shift;
 
 		this.prev.style.visibility = this.index ? "unset" : "hidden";
@@ -91,7 +97,11 @@ export class Lightbox {
 		this.el.style.opacity = 1;
 		this.img.style.opacity = 0;
 		this.spinner.style.display = "inline-block";
-		await loadImage(img);
+		try {
+			await loadImage(img);
+		} catch (err) {
+			console.error('failed to load image', img, err);
+		}
 		this.spinner.style.display = "none";
 		this.link.href = img;
 		this.img.src = img;
@@ -100,3 +110,23 @@ export class Lightbox {
 }
 
 export const lightbox = new Lightbox();
+
+addEventListener('keydown', (event) => {
+	if (lightbox.el.style.display === 'none') {
+		return;
+	}
+	const { key } = event;
+	switch (key) {
+		case 'ArrowLeft':
+		case 'a':
+			lightbox.update(-1);
+			break;
+		case 'ArrowRight':
+		case 'd':
+			lightbox.update(1);
+			break;
+		case 'Escape':
+			lightbox.close();
+			break;
+	}
+});