marky

commit 6b348de7805aa2ddd6a1a5d579fe53d6a36aec74
parent 6f2218192780b014092ca0bdb62aee53247f5607
Author: David Eisinger <[email protected]>
Date:   Tue, 30 Dec 2025 22:17:40 -0500

Don't show links for every page

Diffstat:
M
internal/web/app.js
 | 
36
++++++++++++++++++++++++++++++++++++
M
internal/web/user.html
 | 
26
++++++++++++++++++--------

2 files changed, 54 insertions(+), 8 deletions(-)
diff --git a/internal/web/app.js b/internal/web/app.js
@@ -22,6 +22,42 @@ createApp({
   mounted() {
     this.initView();
   },
+  computed: {
+    pagerPages() {
+      const pager = this.pager;
+      if (!pager || !pager.total || pager.total <= 1) return [];
+      const total = Number(pager.total) || 0;
+      const current = Number(pager.page) || 1;
+      if (total <= 1) return [];
+      const pages = new Set();
+      const add = (n) => {
+        if (n >= 1 && n <= total) pages.add(n);
+      };
+      add(1);
+      add(2);
+      add(total - 1);
+      add(total);
+      add(current - 1);
+      add(current);
+      add(current + 1);
+      const sorted = Array.from(pages).sort((a, b) => a - b);
+      const items = [];
+      let prev = null;
+      for (const n of sorted) {
+        if (prev !== null) {
+          const gap = n - prev;
+          if (gap === 2) {
+            items.push({ type: 'page', n: prev + 1, key: `p${prev + 1}` });
+          } else if (gap > 2) {
+            items.push({ type: 'ellipsis', key: `g${prev}-${n}` });
+          }
+        }
+        items.push({ type: 'page', n, key: `p${n}` });
+        prev = n;
+      }
+      return items;
+    },
+  },
   methods: {
     normalizeResults(arr) {
       return arr.map((x) => ({
diff --git a/internal/web/user.html b/internal/web/user.html
@@ -99,12 +99,17 @@
                 <span class="muted">Prev</span>
               </template>
               <span class="sep">|</span>
-              <template v-for="n in pager.total" :key="n">
-                <template v-if="n === pager.page">
-                  <span class="muted">{{ n }}</span>
+              <template v-for="item in pagerPages" :key="item.key">
+                <template v-if="item.type === 'page'">
+                  <template v-if="item.n === pager.page">
+                    <span class="muted">{{ item.n }}</span>
+                  </template>
+                  <template v-else>
+                    <a :href="pager && pager.query ? `/u:${me.username}?page=${item.n}&size=${pager.size}&q=${pager.queryEncoded}&vis=${pager.vis||'all'}#bookmarks` : `/u:${me.username}?page=${item.n}&size=${pager.size}&vis=${pager.vis||'all'}#bookmarks`">{{ item.n }}</a>
+                  </template>
                 </template>
                 <template v-else>
-                  <a :href="pager && pager.query ? `/u:${me.username}?page=${n}&size=${pager.size}&q=${pager.queryEncoded}&vis=${pager.vis||'all'}#bookmarks` : `/u:${me.username}?page=${n}&size=${pager.size}&vis=${pager.vis||'all'}#bookmarks`">{{ n }}</a>
+                  <span class="muted">…</span>
                 </template>
               </template>
               <span class="sep">|</span>
@@ -177,12 +182,17 @@
                 <span class="muted">Prev</span>
               </template>
               <span class="sep">|</span>
-              <template v-for="n in pager.total" :key="n">
-                <template v-if="n === pager.page">
-                  <span class="muted">{{ n }}</span>
+              <template v-for="item in pagerPages" :key="item.key">
+                <template v-if="item.type === 'page'">
+                  <template v-if="item.n === pager.page">
+                    <span class="muted">{{ item.n }}</span>
+                  </template>
+                  <template v-else>
+                    <a :href="pager && pager.query ? `/u:${viewUser}?page=${item.n}&size=${pager.size}&q=${pager.queryEncoded}` : `/u:${viewUser}?page=${item.n}&size=${pager.size}`">{{ item.n }}</a>
+                  </template>
                 </template>
                 <template v-else>
-                  <a :href="pager && pager.query ? `/u:${viewUser}?page=${n}&size=${pager.size}&q=${pager.queryEncoded}` : `/u:${viewUser}?page=${n}&size=${pager.size}`">{{ n }}</a>
+                  <span class="muted">…</span>
                 </template>
               </template>
               <span class="sep">|</span>