From 4381d8ffd90e62f35110fe6e852c69c0552cba26 Mon Sep 17 00:00:00 2001
From: Vincent CLAVIEN <v@s427.ch>
Date: Mon, 2 Dec 2024 16:23:42 +0100
Subject: [PATCH] issue #4 : Store paging order as a user preference

---
 index.html |  2 +-
 js/main.js | 29 ++++++++++++++++++++++++++++-
 2 files changed, 29 insertions(+), 2 deletions(-)

diff --git a/index.html b/index.html
index 44ebee5..6444682 100644
--- a/index.html
+++ b/index.html
@@ -1596,6 +1596,6 @@
       </symbol>
     </svg>
 
-    <script src="js/main.js?20241201c"></script>
+    <script src="js/main.js?20241202"></script>
   </body>
 </html>
diff --git a/js/main.js b/js/main.js
index b35ce3d..d89c91e 100644
--- a/js/main.js
+++ b/js/main.js
@@ -1,5 +1,29 @@
 // stores definitions
 
+const userPrefsStore = {
+  prefix: "marl_",
+
+  save(pref, value) {
+    localStorage.setItem(this.prefix + pref, value);
+  },
+  load(pref) {
+    const value = localStorage.getItem(this.prefix + pref);
+    if (value !== null) {
+      this.set(pref, value);
+    }
+  },
+  set(pref, value) {
+    switch (pref) {
+      case "sortAsc":
+        value = +value === 1 ? true : false;
+        if (value !== Alpine.store("files").sortAsc) {
+          Alpine.store("files").toggleTootsOrder();
+        }
+        break;
+    }
+  },
+};
+
 const filesStore = {
   resetState() {
     this.raw = {};
@@ -11,7 +35,7 @@ const filesStore = {
     this.avatar = {};
     this.header = {};
 
-    this.sortAsc = true;
+    this.sortAsc = true; // -> userPrefs
     this.pageSize = 10;
     this.currentPage = 1;
 
@@ -526,6 +550,7 @@ const filesStore = {
     });
     scrollTootsToTop();
     pagingUpdated();
+    Alpine.store("userPrefs").save("sortAsc", this.sortAsc ? 1 : 0);
   },
 
   checkPagingValue() {
@@ -973,6 +998,7 @@ function checkAllLoaded(ok) {
     cleanUpRaw();
     document.getElementById("main-section").focus();
     Alpine.store("ui").checkMenuState();
+    Alpine.store("userPrefs").load("sortAsc");
   }
 }
 
@@ -1223,6 +1249,7 @@ document.addEventListener("alpine:init", () => {
   Alpine.store("files", filesStore);
   Alpine.store("lightbox", lightboxStore);
   Alpine.store("ui", uiStore);
+  Alpine.store("userPrefs", userPrefsStore);
 
   resetStores();
 });