fix: now display images in /public + Dockerfile

.dockerignore

@@ -0,0 +1,2 @@
+node_modules/
+pnpm-lock.yaml

.gitignore

@@ -23,4 +23,4 @@ pnpm-debug.log*
 # jetbrains setting folder
 .idea/
 
-src/assets/IMG/
+public/IMG/

Dockerfile

@@ -0,0 +1,18 @@
+FROM node:lts AS runtime
+WORKDIR /app
+
+COPY . .
+
+RUN mkdir -p /app/public/IMG
+
+RUN npm install
+
+RUN npm run build
+
+ENV HOST=0.0.0.0
+ENV PORT=4321
+EXPOSE 4321
+
+ENV PHOTO_DIR_ABSOLUTE_PATH=/app/public/IMG
+
+CMD ["node", "./dist/server/entry.mjs"]

docker-compose.yml

@@ -0,0 +1,9 @@
+version: "3.8"
+
+services:
+  my-album:
+    build: .
+    ports:
+      - "4321:4321"
+    volumes:
+      - ./photos:/app/public/IMG

src/misc.ts

@@ -1,33 +1,30 @@
 import { Photo } from "./models/photo";
 
 export function initPhoto(
-  image: any,
+  filename: string,
   description: string,
   model: string,
-  filename: string,
+  width: number = 0,
+  height: number = 0,
 ): Photo {
   return {
-    src: image.default.src,
+    src: `/IMG/${filename}`,
     filename: filename,
-    format: image.default.format,
-    height: image.default.height,
-    width: image.default.width,
+    format: filename.split(".").pop()?.toUpperCase() || "JPG",
+    height: height,
+    width: width,
     description: description,
     model: model,
   } as Photo;
 }
 
-export function initPhotos(images: any): Photo[] {
-  return Object.values(images)
-    .map((img: any) => {
-      const splited = img.default.src.split("/");
-      const filename: string = splited[splited.length - 1].split("?")[0];
-
+export function initPhotos(filenames: string[]): Photo[] {
+  return filenames
+    .map((filename: string) => {
       return initPhoto(
-        img,
-        "Aucune description disponible",
-        "Aucun model d'appareil photo disponible",
         filename,
+        "Aucune description disponible",
+        "Aucun modèle d'appareil photo disponible",
       );
     })
     .reverse();

src/pages/index.astro

@@ -1,10 +1,20 @@
 ---
+import fs from "fs";
+import path from "path";
 import "../styles/index.css";
 import Layout from "../components/Layout.astro";
 import Image from "../components/Image.astro";
 import { initPhotos } from "../misc";
-const imagesObj: any = import.meta.glob("../assets/IMG/*.JPG", { eager: true });
-const images = initPhotos(imagesObj);
+import { PHOTO_DIR_ABSOLUTE_PATH } from "astro:env/server";
+
+const imageFilenames = fs
+  .readdirSync(PHOTO_DIR_ABSOLUTE_PATH)
+  .filter((file) => {
+    const extension = path.extname(file).toLowerCase();
+    return extension === ".jpg" || extension === ".jpeg";
+  });
+
+const images = initPhotos(imageFilenames);
 ---
 
 <Layout>

src/pages/photos/[filename].astro

@@ -1,37 +1,45 @@
 ---
 export const prerender = false;
 import "../../styles/detail.css";
+import fs from "fs";
 import ExifReader from "exifreader";
 import Layout from "../../components/Layout.astro";
-import { Photo } from "../../models/photo";
-const { filename } = Astro.params;
 import { PHOTO_DIR_ABSOLUTE_PATH } from "astro:env/server";
 import { initPhoto } from "../../misc";
 
-const relativePath = `../../assets/IMG/${filename}`;
-const allImages: any = import.meta.glob("../../assets/IMG/*.JPG", {
-  eager: true,
-});
-const imageImport = allImages[relativePath];
-let p: Photo = new Photo();
+const { filename } = Astro.params;
 
-if (imageImport && filename) {
-  const absolutePath = `${PHOTO_DIR_ABSOLUTE_PATH}/${filename}`;
-  const tags = await ExifReader.load(absolutePath);
-
-  p = initPhoto(
-    imageImport,
-    (p.description = tags.title
-      ? tags.title.description
-      : "Aucune description disponible"),
-    (p.model = tags.Model
-      ? tags.Model.description
-      : "Aucun model d'appareil photo disponible"),
-    filename,
-  );
-} else {
+if (!filename) {
   return Astro.redirect("/");
 }
+
+const absolutePath = `${PHOTO_DIR_ABSOLUTE_PATH}/${filename}`;
+
+if (!fs.existsSync(absolutePath)) {
+  return Astro.redirect("/");
+}
+
+const tags = await ExifReader.load(absolutePath);
+
+const description = tags.title
+  ? tags.title.description
+  : "Aucune description disponible";
+const model = tags.Model
+  ? tags.Model.description
+  : "Aucun modèle d'appareil photo disponible";
+
+const width = tags["Image Width"] ? tags["Image Width"].value : 0;
+const height = tags["Image Height"] ? tags["Image Height"].value : 0;
+
+const p = initPhoto(
+  filename,
+  description,
+  model,
+  Number(width),
+  Number(height),
+);
+
+console.log(tags);
 ---
 
 <Layout>