Add navigation buttons

janfaracik · Apr 8, 2024 · e7432b6 · e7432b6
1 parent 448a094
commit e7432b6
Show file tree

Hide file tree

Showing 3 changed files with 93 additions and 10 deletions.
diff --git a/core/src/main/java/hudson/widgets/HistoryWidget.java b/core/src/main/java/hudson/widgets/HistoryWidget.java
@@ -275,7 +275,7 @@ public void doAjax(StaplerRequest req, StaplerResponse rsp,
         req.getView(page, "ajaxBuildHistory.jelly").forward(req, rsp);
     }
 
-    static final int THRESHOLD = SystemProperties.getInteger(HistoryWidget.class.getName() + ".threshold", 30);
+    static final int THRESHOLD = SystemProperties.getInteger(HistoryWidget.class.getName() + ".threshold", 5);
 
     public String getNextBuildNumberToFetch() {
         return nextBuildNumberToFetch;

diff --git a/core/src/main/resources/hudson/widgets/HistoryWidget/index.jelly b/core/src/main/resources/hudson/widgets/HistoryWidget/index.jelly
@@ -53,6 +53,15 @@ THE SOFTWARE.
 
         <div id="jenkins-build-history" class="app-builds-container__items">
         </div>
+
+        <br/>
+        <br/>
+
+        <div style="display: flex">
+          <button id="top">top</button>
+          <button id="up">up</button>
+          <button id="down">down</button>
+        </div>
       </div>
 
       <!--The value for `page-next-build` is modified inside of `entries.jelly` on render, so set the attribute-->

diff --git a/war/src/main/js/filter-build-history.js b/war/src/main/js/filter-build-history.js
@@ -12,13 +12,88 @@ const contents = card.querySelector("#jenkins-build-history");
 const container = card.querySelector(".app-builds-container");
 const noBuilds = card.querySelector("#no-builds")
 
+const top = document.querySelector("#top");
+const up = document.querySelector("#up");
+const down = document.querySelector("#down");
+
 const updateBuildsRefreshInterval = 5000;
 
-function loadPage() {
+function updatePageParams(dataTable) {
+  const pageHasUp = dataTable.getAttribute("page-has-up");
+  const pageHasDown = dataTable.getAttribute("page-has-down");
+
+  // console.log(pageHasUp == false)
+  // console.log(JSON.stringify(pageHasDown));
+
+  if (pageHasUp === "false") {
+    console.log("Hiding up")
+    top.style.display = "none";
+    up.style.display = "none";
+  } else {
+    console.log("Showing up")
+    top.style.display = "flex";
+    up.style.display = "flex";
+  }
+
+  if (pageHasDown === "false") {
+    console.log("Hiding down")
+    down.style.display = "none";
+  } else {
+    console.log("Showing down")
+    down.style.display = "flex";
+  }
+
+  buildHistoryPage.setAttribute(
+    "page-has-up",
+    pageHasUp
+  );
+  buildHistoryPage.setAttribute(
+    "page-has-down",
+    pageHasDown
+  );
+  buildHistoryPage.setAttribute(
+    "page-entry-newest",
+    dataTable.getAttribute("page-entry-newest"),
+  );
+  buildHistoryPage.setAttribute(
+    "page-entry-oldest",
+    dataTable.getAttribute("page-entry-oldest"),
+  );
+}
+
+function getNewestEntryId() {
+  return buildHistoryPage.getAttribute("page-entry-newest");
+}
+function getOldestEntryId() {
+  return buildHistoryPage.getAttribute("page-entry-oldest");
+}
+
+top.addEventListener('click', () => {
+  loadPage();
+})
+
+up.addEventListener('click', () => {
+  loadPage({ "newer-than": getNewestEntryId() });
+})
+
+down.addEventListener('click', () => {
+  // cancelRefreshTimeout();
+  loadPage({ "older-than": getOldestEntryId() });
+})
+
+function loadPage(options) {
   const params = {
+    ...options,
     search: pageSearchInput.value
   };
 
+  // console.log(getNewestEntryId())
+  // console.log(getOldestEntryId())
+
+  // newerThan
+  // loadPage({ "newer-than": getNewestEntryId() });
+  // loadPage({ "older-than": getOldestEntryId() });
+
   fetch(ajaxUrl + toQueryString(params)).then((rsp) => {
     if (rsp.ok) {
       rsp.text().then((responseText) => {
@@ -42,6 +117,10 @@ function loadPage() {
             Behaviour.applySubtree(contents);
           });
         }
+
+        var div = document.createElement("div");
+        div.innerHTML = responseText;
+        updatePageParams(div.children[0]);
       });
     }
   });
@@ -53,9 +132,9 @@ const handleFilter = function () {
 
 const debouncedFilter = debounce(handleFilter, 300);
 
-setInterval(() => {
-  loadPage()
-}, updateBuildsRefreshInterval)
+// setInterval(() => {
+//   loadPage({})
+// }, updateBuildsRefreshInterval)
 
 document.addEventListener("DOMContentLoaded", function () {
   pageSearchInput.addEventListener("input", function () {
@@ -66,8 +145,3 @@ document.addEventListener("DOMContentLoaded", function () {
 
   loadPage({});
 });
-
-document.querySelectorAll(".task-link").forEach((taskLink) =>
-  taskLink.addEventListener('click', () => {
-    loadPage();
-}))