From df03ec3cb464f94092e2b12715c8ad32e7686f0f Mon Sep 17 00:00:00 2001
From: Louis Lam <louislam@users.noreply.github.com>
Date: Wed, 7 May 2025 13:56:27 +0800
Subject: [PATCH 1/3] Fix: Generate thumbnails with SAR correctly

---
 backend/util.ts | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/backend/util.ts b/backend/util.ts
index 3e715e7..2c3387d 100644
--- a/backend/util.ts
+++ b/backend/util.ts
@@ -247,6 +247,8 @@ export async function generateThumbnail(videoPath: string, thumbnailPath: string
     // The 20% of the video duration
     const target = Math.floor(duration * 0.2);
 
+    const targetWidth = 512;
+
     command = new Deno.Command(ffmpeg, {
         args: [
             "-ss",
@@ -254,7 +256,11 @@ export async function generateThumbnail(videoPath: string, thumbnailPath: string
             "-i",
             videoPath,
             "-vf",
-            "scale=512:-1",
+            // Generate thumbnail's width is always fixed
+            // SAR = Storage Aspect Ratio, some videos let's say original resolution is 1440x1080, but the video is 16:9, so the SAR is 1.3333
+            // Width: 512px
+            // Height Formula = Height * (512 / Width) * (1 / SAR)
+            `scale=${targetWidth}:ih*(1/sar)*(${targetWidth}/iw)`,
             "-vframes",
             "1",
             thumbnailPath,

From 25980a308277b11b25c79de13231260a3aae9966 Mon Sep 17 00:00:00 2001
From: Louis Lam <louislam@users.noreply.github.com>
Date: Wed, 7 May 2025 14:10:36 +0800
Subject: [PATCH 2/3] Upper also keep the scroll position

---
 frontend/src/pages/List.vue | 43 ++++++++++++++++++++-----------------
 1 file changed, 23 insertions(+), 20 deletions(-)

diff --git a/frontend/src/pages/List.vue b/frontend/src/pages/List.vue
index 3faefad..7bb8907 100644
--- a/frontend/src/pages/List.vue
+++ b/frontend/src/pages/List.vue
@@ -276,37 +276,40 @@ async function updateDirConfig() {
 
 // history api previous page
 function previous() {
-    // Check if previous page is our website
-    if (historyLength.value > 0) {
-        const previousUrl = window.history.state?.url;
-        if (previousUrl && previousUrl.startsWith(baseURL)) {
-            // Go back to the previous page
-            router.back();
-            return;
-        }
-    }
-
     router.back();
 }
 
 function forward() {
+    console.log(window.history.state?.back);
+
     router.forward();
 }
 
 function upper() {
+    const historyBackPath = window.history.state?.back;
+
+    console.log(historyBackPath);
+
     // vue router go to previousDir
     if (previousDir.value) {
-        router.push({
-            name: "list",
-            params: {
-                requestPath: encodeRequestPath(previousDir.value),
-            },
-        });
+        const targetPath = "/list/" + encodeRequestPath(previousDir.value);
+
+        // Since we want to keep the scroll position, if they are same, use history.back().
+        if (historyBackPath === targetPath) {
+            router.back();
+        } else {
+            router.push(targetPath);
+        }
     } else {
-        // go to home
-        router.push({
-            name: "home",
-        });
+        // Since we want to keep the scroll position, if they are same, use history.back().
+        if (historyBackPath === "/") {
+            router.back();
+        } else {
+            // go to home
+            router.push({
+                name: "home",
+            });
+        }
     }
 }
 

From e13149b4d07be7d9cd1b0ba8bc57f6796d869f09 Mon Sep 17 00:00:00 2001
From: Louis Lam <louislam@users.noreply.github.com>
Date: Wed, 7 May 2025 14:12:37 +0800
Subject: [PATCH 3/3] Clear up

---
 frontend/src/pages/List.vue | 4 ----
 1 file changed, 4 deletions(-)

diff --git a/frontend/src/pages/List.vue b/frontend/src/pages/List.vue
index 7bb8907..5fc96dd 100644
--- a/frontend/src/pages/List.vue
+++ b/frontend/src/pages/List.vue
@@ -280,16 +280,12 @@ function previous() {
 }
 
 function forward() {
-    console.log(window.history.state?.back);
-
     router.forward();
 }
 
 function upper() {
     const historyBackPath = window.history.state?.back;
 
-    console.log(historyBackPath);
-
     // vue router go to previousDir
     if (previousDir.value) {
         const targetPath = "/list/" + encodeRequestPath(previousDir.value);