Skip to content

Commit

Permalink
[JENKINS-70002] Fix the width of the pagination buttons (#255)
Browse files Browse the repository at this point in the history
  • Loading branch information
@janfaracik
janfaracik committed Dec 4, 2022
1 parent d71dd4a commit 168c8c2
Show file tree
Hide file tree
Showing 7 changed files with 110 additions and 251 deletions.
21 changes: 21 additions & 0 deletions src/main/resources/components/entries-per-page.jelly
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,21 @@
<?jelly escape-by-default='true'?>
<j:jelly xmlns:j="jelly:core">
<div>
<j:if test="${!filter.equals(&quot;created&quot;)}">
<h3 class="jenkins-!-margin-bottom-2">${%Entries per page}:</h3>

<div class="jch-entries-per-page">
<j:forEach var="entryPerPageVal" items="${entryPerPageArray}">
<j:choose>
<j:when test="${entriesPerPage.equals(entryPerPageVal)}">
<a class="jenkins-button jenkins-button--primary" href="?filter=${filter}&amp;pageNum=${0}&amp;entriesPerPage=${entryPerPageVal}" rel="noopener noreferrer">${entryPerPageVal}</a>
</j:when>
<j:otherwise>
<a class="jenkins-button jenkins-button--tertiary" href="?filter=${filter}&amp;pageNum=${0}&amp;entriesPerPage=${entryPerPageVal}" rel="noopener noreferrer">${entryPerPageVal}</a>
</j:otherwise>
</j:choose>
</j:forEach>
</div>
</j:if>
</div>
</j:jelly>
57 changes: 57 additions & 0 deletions src/main/resources/components/pagination.jelly
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,57 @@
<?jelly escape-by-default='true'?>
<j:jelly xmlns:j="jelly:core" xmlns:st="jelly:stapler" xmlns:l="/lib/layout">
<div>
<j:if test="${maxPageNum != 0}">
<h3 class="jenkins-!-margin-bottom-2">${%Page}:</h3>

<div class="jch-pagination">
<!--"<" for one step back-->
<j:choose>
<j:when test="${pageNum > 0}">
<a class="jenkins-button jenkins-button--tertiary" href="?filter=${filter}&amp;pageNum=${pageNum-1}&amp;entriesPerPage=${entriesPerPage}" rel="noopener noreferrer">
<l:icon src="symbol-chevron-back-outline plugin-ionicons-api" />
</a>
</j:when>
<j:otherwise>
<a class="jenkins-button jenkins-button--tertiary" rel="noopener noreferrer">
<l:icon src="symbol-chevron-back-outline plugin-ionicons-api" />
</a>
</j:otherwise>
</j:choose>

<!--page navigation: "1 ... 5 6 7 8 9 ... 20"-->
<j:forEach var="currentPageNum" items="${relevantPageNums}">
<j:choose>
<j:when test="${currentPageNum == -1}">
<a class="jenkins-button jenkins-button--tertiary" rel="noopener noreferrer">
<b>&#8230;</b>
</a>
</j:when>
<j:when test="${currentPageNum == pageNum}">
<a class="jenkins-button jenkins-button--primary" rel="noopener noreferrer">
${currentPageNum+1}</a>
</j:when>
<j:otherwise>
<a class="jenkins-button jenkins-button--tertiary" href="?filter=${filter}&amp;pageNum=${currentPageNum}&amp;entriesPerPage=${entriesPerPage}" rel="noopener noreferrer">
${currentPageNum+1}</a>
</j:otherwise>
</j:choose>
</j:forEach>

<!--">" for one step forward-->
<j:choose>
<j:when test="${maxPageNum > pageNum}">
<a class="jenkins-button jenkins-button--tertiary" href="?filter=${filter}&amp;pageNum=${pageNum+1}&amp;entriesPerPage=${entriesPerPage}" rel="noopener noreferrer">
<l:icon src="symbol-chevron-forward-outline plugin-ionicons-api" />
</a>
</j:when>
<j:otherwise>
<a class="jenkins-button jenkins-button--tertiary" rel="noopener noreferrer">
<l:icon src="symbol-chevron-forward-outline plugin-ionicons-api" />
</a>
</j:otherwise>
</j:choose>
</div>
</j:if>
</div>
</j:jelly>
Empty file added src/main/resources/components/taglib
View file
Empty file.
87 changes: 7 additions & 80 deletions src/main/resources/hudson/plugins/jobConfigHistory/JobConfigHistoryProjectAction/index.jelly
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
<?jelly escape-by-default='true'?>
<j:jelly xmlns:j="jelly:core" xmlns:st="jelly:stapler" xmlns:l="/lib/layout" xmlns:f="/lib/form">
<j:jelly xmlns:j="jelly:core" xmlns:st="jelly:stapler" xmlns:c="/components" xmlns:l="/lib/layout" xmlns:f="/lib/form">
<l:layout title="${%Job Configuration History}">

<link rel="stylesheet" type="text/css" href="${rootURL}/plugin/jobConfigHistory/css/style.css" />
Expand Down Expand Up @@ -147,86 +147,13 @@
<j:set var="relevantPageNums" value="${it.getRelevantPageNums(pageNum*1)}" />
<j:set var="entryPerPageArray" value="10, 25, 100, 250, ${%all}" />
<f:bottomButtonBar>
<div style="display: flex; justify-content: space-between; align-items: flex-end" class="jenkins-buttons-row">
<c:entries-per-page />
<c:pagination />

<!-- Page view filter selector -->
<div>
<h3>${%Entries per page}:</h3>
<j:forEach var="entryPerPageVal" items="${entryPerPageArray}">
<j:choose>
<j:when test="${entriesPerPage.equals(entryPerPageVal)}">
<a class="jenkins-button jenkins-button--primary" href="?pageNum=${0}&amp;entriesPerPage=${entryPerPageVal}" rel="noopener noreferrer">${entryPerPageVal}</a>
</j:when>
<j:otherwise>
<a class="jenkins-button" href="?pageNum=${0}&amp;entriesPerPage=${entryPerPageVal}" rel="noopener noreferrer">${entryPerPageVal}</a>
</j:otherwise>
</j:choose>
</j:forEach>
</div>
<div style="display: flex; justify-content: flex-end">
<!--page navigation: "[ < 1 ... 5 6 7 8 9 ... 20 > ]"-->
<div>
<j:if test="${maxPageNum != 0}">
<h3>${%Page}:</h3>

<!--"<" for one step back-->
<j:choose>
<j:when test="${pageNum > 0}">
<a class="jenkins-button" href="?pageNum=${pageNum-1}&amp;entriesPerPage=${entriesPerPage}" rel="noopener noreferrer">
<b>&lt;</b>
</a>
</j:when>
<j:otherwise>
<a class="jenkins-button" rel="noopener noreferrer">
<b>&lt;</b>
</a>
</j:otherwise>
</j:choose>

<!--page navigation: "1 ... 5 6 7 8 9 ... 20"-->
<j:forEach var="currentPageNum" items="${relevantPageNums}">
<j:choose>
<j:when test="${currentPageNum == -1}">
<a class="jenkins-button" rel="noopener noreferrer">
<b>&#8230;</b>
</a>
</j:when>
<j:when test="${currentPageNum == pageNum}">
<a class="jenkins-button jenkins-button--primary" rel="noopener noreferrer">
${currentPageNum+1}</a>
</j:when>
<j:otherwise>
<a class="jenkins-button" href="?filter=${filter}&amp;pageNum=${currentPageNum}&amp;entriesPerPage=${entriesPerPage}" rel="noopener noreferrer">
${currentPageNum+1}</a>
</j:otherwise>
</j:choose>
</j:forEach>

<!--">" for one step forward-->
<j:choose>
<j:when test="${maxPageNum > pageNum}">
<a class="jenkins-button" href="?pageNum=${pageNum+1}&amp;entriesPerPage=${entriesPerPage}" rel="noopener noreferrer">
<b>&gt;</b>
</a>
</j:when>
<j:otherwise>
<a class="jenkins-button" rel="noopener noreferrer">
<b>&gt;</b>
</a>
</j:otherwise>
</j:choose>
</j:if>
</div>

<!-- Show Diff -->
<div style="align-self: flex-end">
<j:if test="${configs.size() > 1}">
<button class="jenkins-button">${%Show Diffs}</button>
</j:if>
</div>
</div>

</div>
<!-- Show Diff -->
<j:if test="${configs.size() > 1}">
<button class="jenkins-button">${%Show Diffs}</button>
</j:if>
</f:bottomButtonBar>
</form>
</div>
Expand Down
100 changes: 4 additions & 96 deletions src/main/resources/hudson/plugins/jobConfigHistory/JobConfigHistoryRootAction/history.jelly
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
<j:jelly xmlns:j="jelly:core"
xmlns:st="jelly:stapler"
xmlns:l="/lib/layout"
xmlns:f="/lib/form">
xmlns:f="/lib/form" xmlns:c="/components">
<l:layout title="${%Job Configuration History}">

<link rel="stylesheet" type="text/css" href="${rootURL}/plugin/jobConfigHistory/css/style.css" />
Expand Down Expand Up @@ -159,103 +159,11 @@

<j:set var="relevantPageNums" value="${it.getRelevantPageNums(pageNum*1)}" />
<j:set var="entryPerPageArray" value="10, 25, 100, 250, ${%all}" />
<f:bottomButtonBar>
<div style="display: flex; justify-content: space-between; flex-flow: row wrap;" class="jenkins-buttons-row">
<div style="flex-direction: column; display: flex; justify-content: space-between">
<!-- Page view filter selector -->
<!-- <j:if test="${!filter.equals(&quot;created&quot;)}"> -->
<div>
<h3>${%Entries per page}:</h3>
</div>
<div>
<j:forEach var="entryPerPageVal" items="${entryPerPageArray}">
<j:choose>
<j:when test="${entriesPerPage.equals(entryPerPageVal)}">
<a class="jenkins-button jenkins-button--primary" href="?name=${name}&amp;pageNum=${0}&amp;entriesPerPage=${entryPerPageVal}" rel="noopener noreferrer">${entryPerPageVal}</a>
</j:when>
<j:otherwise>
<a class="jenkins-button" href="?name=${name}&amp;pageNum=${0}&amp;entriesPerPage=${entryPerPageVal}" rel="noopener noreferrer">${entryPerPageVal}</a>
</j:otherwise>
</j:choose>
</j:forEach>
</div>
</div>
<div style="display: flex; justify-content: space-between; flex-flow: row wrap;">
<div style="flex-flow: column wrap">
<!--page navigation: "[ < 1 ... 5 6 7 8 9 ... 20 > ]"-->
<j:if test="${maxPageNum != 0}">
<h3>${%Page}:</h3>

<!--"<" for one step back-->
<j:choose>
<j:when test="${pageNum > 0}">
<a class="jenkins-button" href="?name=${name}&amp;pageNum=${pageNum-1}&amp;entriesPerPage=${entriesPerPage}" rel="noopener noreferrer">
<b>&lt;</b>
</a>
</j:when>
<j:otherwise>
<a class="jenkins-button" rel="noopener noreferrer">
<b>&lt;</b>
</a>
</j:otherwise>
</j:choose>

<!--page navigation: "1 ... 5 6 7 8 9 ... 20"-->
<j:forEach var="currentPageNum" items="${relevantPageNums}">
<j:choose>
<j:when test="${currentPageNum == -1}">
<a class="jenkins-button" rel="noopener noreferrer">
<b>&#8230;</b>
</a>
</j:when>
<j:when test="${currentPageNum == pageNum}">
<a class="jenkins-button jenkins-button--primary" rel="noopener noreferrer">
${currentPageNum+1}</a>
</j:when>
<j:otherwise>
<a class="jenkins-button" href="?name=${name}&amp;pageNum=${currentPageNum}&amp;entriesPerPage=${entriesPerPage}" rel="noopener noreferrer">
${currentPageNum+1}</a>
</j:otherwise>
</j:choose>
</j:forEach>

<!--">" for one step forward-->
<j:choose>
<j:when test="${maxPageNum > pageNum}">
<a class="jenkins-button" href="?name=${name}&amp;pageNum=${pageNum+1}&amp;entriesPerPage=${entriesPerPage}" rel="noopener noreferrer">
<b>&gt;</b>
</a>
</j:when>
<j:otherwise>
<a class="jenkins-button" rel="noopener noreferrer">
<b>&gt;</b>
</a>
</j:otherwise>
</j:choose>
</j:if>
</div>
<div style="display: flex; justify-content: space-between; align-items: space-between; flex-flow: column-reverse wrap">

<!-- Show Diff -->
<j:if test="${configs.size() > 1}">
<button type="submit" form="rootHistoryDiffForm" style="align-self: stretch" class="jenkins-button">${%Show Diffs}</button>
</j:if>

<!-- Restore Project -->
<!-- this prevents people from destroying their history by trying to restore deleted folder jobs -->
<!-- TODO: Fix that. (see code)-->
<!-- Restore button (visible only after deletion) -->
<j:if test="${isDeleted and (configs.size() > 1) and configs.get(0).job.replace('/jobs', '/job').equals(configs.get(0).job)}">
<form id="rootHistoryRestoreProjectForm" method="post" action="forwardToRestoreQuestion?name=${name}" name="forward">
<button type="submit" form="rootHistoryRestoreProjectForm" style="align-self: stretch" class="jenkins-button">${%Restore project}</button>
</form>
</j:if>
</div>
</div>

</div>
<f:bottomButtonBar>
<c:entries-per-page />
<c:pagination />
</f:bottomButtonBar>

</j:otherwise>
</j:choose>
</div>
Expand Down

0 comments on commit 168c8c2

Please sign in to comment.