cmd/pkgserver: add sort orders, change pagination rules

cmd/pkgserver/ui/static/index.ts

@@ -29,8 +29,8 @@ class InfoPayload {
 
 async function infoRequest(): Promise<InfoPayload> {
     const res = await fetch(`${ENDPOINT}/info`)
-    const res_1 = await res.json()
-    return res_1 as InfoPayload
+    const payload = await res.json()
+    return payload as InfoPayload
 }
 class GetPayload {
     count: number
@@ -45,36 +45,28 @@ enum SortOrders {
 }
 async function getRequest(limit: number, index: number, sort: SortOrders): Promise<GetPayload> {
     const res = await fetch(`${ENDPOINT}/get?limit=${limit}&index=${index}&sort=${sort.valueOf()}`)
-    const res_1 = await res.json()
-    return res_1 as GetPayload
+    const payload = await res.json()
+    return payload as GetPayload
 }
 class State {
     entriesPerPage: number = 10
-    currentPage: number = 1
     entryIndex: number = 0
     maxEntries: number = 0
+    sort: SortOrders = SortOrders.DeclarationAscending
+
     getEntriesPerPage(): number {
         return this.entriesPerPage
     }
     setEntriesPerPage(entriesPerPage: number) {
         this.entriesPerPage = entriesPerPage
-        if (this.currentPage > this.getMaxPage()) {
-            this.setCurrentPage(this.getMaxPage())
-        }
-    }
-    getCurrentPage(): number {
-        return this.currentPage
-    }
-    setCurrentPage(page: number) {
-        this.currentPage = page
-        this.setEntryIndex((this.getCurrentPage() - 1) * this.getEntriesPerPage())
-        document.getElementById("page-number").innerText = String(this.getCurrentPage())
+        this.setEntryIndex(Math.floor(this.getEntryIndex() / entriesPerPage) * entriesPerPage)
     }
     getEntryIndex(): number {
         return this.entryIndex
     }
     setEntryIndex(entryIndex: number) {
         this.entryIndex = entryIndex
+        this.updatePage()
         this.updateRange()
         this.updateListings()
     }
@@ -84,15 +76,23 @@ class State {
     setMaxEntries(max: number) {
         this.maxEntries = max
     }
-    getMaxPage(): number {
-        return Math.ceil(this.getMaxEntries() / this.getEntriesPerPage())
+    getSortOrder(): SortOrders {
+        return this.sort
+    }
+    setSortOrder(sortOrder: SortOrders) {
+        this.sort = sortOrder
+        this.setEntryIndex(0)
+    }
+    updatePage() {
+        let page = Math.ceil(((this.getEntryIndex() + this.getEntriesPerPage()) - 1) / this.getEntriesPerPage())
+        document.getElementById("page-number").innerText = String(page)
     }
     updateRange() {
         let max = Math.min(this.getEntryIndex() + this.getEntriesPerPage(), this.getMaxEntries())
         document.getElementById("entry-counter").innerText = `${this.getEntryIndex() + 1}-${max} of ${this.getMaxEntries()}`
     }
     updateListings() {
-        getRequest(this.getEntriesPerPage(), this.entryIndex, 0)
+        getRequest(this.getEntriesPerPage(), this.getEntryIndex(), this.getSortOrder())
             .then(res => {
                 let table = document.getElementById("pkg-list")
                 table.innerHTML = ''
@@ -107,16 +107,12 @@ class State {
 let STATE: State
 
 function prevPage() {
-    let current = STATE.getCurrentPage()
-    if (current > 1) {
-        STATE.setCurrentPage(STATE.getCurrentPage() - 1)
-    }
+    let index = STATE.getEntryIndex()
+    STATE.setEntryIndex(Math.max(0, index - STATE.getEntriesPerPage()))
 }
 function nextPage() {
-    let current = STATE.getCurrentPage()
-    if (current < STATE.getMaxPage()) {
-        STATE.setCurrentPage(STATE.getCurrentPage() + 1)
-    }
+    let index = STATE.getEntryIndex()
+    STATE.setEntryIndex(Math.min((Math.ceil(STATE.getMaxEntries() / STATE.getEntriesPerPage()) * STATE.getEntriesPerPage()) - STATE.getEntriesPerPage(), index + STATE.getEntriesPerPage()))
 }
 
 function escapeHtml(str: string): string {
@@ -141,4 +137,7 @@ document.addEventListener("DOMContentLoaded", () => {
     document.getElementById("count").addEventListener("change", (event) => {
         STATE.setEntriesPerPage(parseInt((event.target as HTMLSelectElement).value))
     })
+    document.getElementById("sort").addEventListener("change", (event) => {
+        STATE.setSortOrder(parseInt((event.target as HTMLSelectElement).value))
+    })
 })