From a739e7307df934ddfc8edfe26a6265a299ad063b Mon Sep 17 00:00:00 2001
From: Timothy Farrell <tim@thecookiejar.me>
Date: Sat, 25 Apr 2026 05:47:28 -0500
Subject: [PATCH] Update frontend JavaScript to use query parameters

- Changed getRefreshParams() to parse query params instead of path segments
- Added buildUrl() helper to construct query param URLs
- Updated keyboard shortcuts (j/k for delay, o for order toggle) to use query params
---
 frontend.html | 23 +++++++++++++----------
 1 file changed, 13 insertions(+), 10 deletions(-)

diff --git a/frontend.html b/frontend.html
index 99fe251..f784a7a 100644
--- a/frontend.html
+++ b/frontend.html
@@ -62,20 +62,23 @@
     </div>
     <script>
         function getRefreshParams() {
-            var path = window.location.pathname.slice(1);
-            var parts = path.split('/');
-            if (parts.length < 3) return null;
-            var order = parts[0];
+            var params = new URLSearchParams(window.location.search);
+            var order = params.get('order');
             if (order !== 'next' && order !== 'random') return null;
-            var delay = parseInt(parts[1]);
+            var delay = parseInt(params.get('delay'));
             if (isNaN(delay)) return null;
+            var hash = window.location.pathname.slice(1);
             return {
                 delay: delay,
                 order: order,
-                hash: parts[2]
+                hash: hash
             };
         }
 
+        function buildUrl(hash, order, delay) {
+            return '/' + hash + '?order=' + order + '&delay=' + delay;
+        }
+
         document.addEventListener('keydown', function(e) {
             e.preventDefault();
             if (e.code === 'Space') {
@@ -85,17 +88,17 @@
                 document.getElementById('prev-btn').click();
             } else if (e.code === 'ArrowRight' || e.key.toLowerCase() === 'l') {
                 document.getElementById('next-btn').click();
-    } else if (e.code === 'Equal' || e.key.toLowerCase() === 'j') {
+            } else if (e.code === 'Equal' || e.key.toLowerCase() === 'j') {
                 var params = getRefreshParams();
-                if (params) window.location.href = '/' + params.order + '/' + (params.delay + 1) + '/' + params.hash;
+                if (params) window.location.href = buildUrl(params.hash, params.order, params.delay + 1);
             } else if (e.code === 'Minus' || e.key.toLowerCase() === 'k') {
                 var params = getRefreshParams();
-                if (params && params.delay > 1) window.location.href = '/' + params.order + '/' + (params.delay - 1) + '/' + params.hash;
+                if (params && params.delay > 1) window.location.href = buildUrl(params.hash, params.order, params.delay - 1);
             } else if (e.key.toLowerCase() === 'o') {
                 var params = getRefreshParams();
                 if (params) {
                     var newOrder = params.order === 'next' ? 'random' : 'next';
-                    window.location.href = '/' + newOrder + '/' + params.delay + '/' + params.hash;
+                    window.location.href = buildUrl(params.hash, newOrder, params.delay);
                 }
             }
         });