Kalender mit pagination

src/main/java/de/mbremer/extension/CommonExtensions.java

@@ -12,4 +12,12 @@ public class CommonExtensions {
   public static String formatCommon(LocalDate date) {
     return date == null ? "" : date.atStartOfDay(ZoneId.systemDefault()).format(DateTimeFormatter.ofPattern("EEEE, d.M.yyyy"));
   }
+
+  public static int minus(int a, int b) {
+    return a - b;
+  }
+
+  public static int plus(int a, int b) {
+    return a + b;
+  }
 }

src/main/java/de/mbremer/kalender/KalenderResource.java

@@ -27,26 +27,30 @@ public class KalenderResource {
   @Inject
   SecurityIdentity identity;
   @Inject
-  Template kalender;
+  Template kalenderpage;
 
   @Path("")
   @GET
   @Produces(MediaType.TEXT_HTML)
   public TemplateInstance kalender() {
+    return kalenderWithOffset(0);
+  }
+
+  @Path("offset/{weeks}")
+  @GET
+  @Produces(MediaType.TEXT_HTML)
+  public TemplateInstance kalenderWithOffset(@PathParam("weeks") int offsetInWeeks) {
     User currentUser = User.find("username", identity.getPrincipal().getName()).singleResult();
     LocalDate today = LocalDate.now();
 
-    LocalDate montag = today.minusDays(today.getDayOfWeek().getValue() - 1);
+    LocalDate montag = today.minusDays(today.getDayOfWeek().getValue() - 1).plusDays(7 * offsetInWeeks);
 
-    List<KalenderTag> week0 = getWeek(currentUser, montag);
-    List<KalenderTag> week1 = getWeek(currentUser, montag.plusDays(7));
-    List<KalenderTag> week2 = getWeek(currentUser, montag.plusDays(14));
+    List<KalenderTag> week = getWeek(currentUser, montag);
 
-    return kalender
+    return kalenderpage
         .data("today", today)
-        .data("week0", week0)
-        .data("week1", week1)
-        .data("week2", week2);
+        .data("offset", offsetInWeeks)
+        .data("week", week);
   }
 
   private List<KalenderTag> getWeek(User currentUser, LocalDate start) {
@@ -55,6 +59,7 @@ public class KalenderResource {
           LocalDate day = start.plusDays(d);
           KalenderTag tag = (KalenderTag) KalenderTag.find("day", day).singleResultOptional().orElse(new KalenderTag(day));
           tag.setCurrentUserInOffice(currentUser.equals(tag.getInOffice()));
+          tag.setToday(LocalDate.now().equals(day));
           return tag;
         })
         .collect(Collectors.toList());
@@ -64,7 +69,8 @@ public class KalenderResource {
   @Transactional
   @Consumes(MediaType.MULTIPART_FORM_DATA)
   @Path("/inoffice/{day}")
-  public TemplateInstance update(@PathParam("day") String day, @MultipartForm KalenderTagForm kalenderForm) {
+  public TemplateInstance update(@PathParam("day") String day,
+                                 @QueryParam("offset") int offsetInWeeks, @MultipartForm KalenderTagForm kalenderForm) {
     LocalDate dayParsed = LocalDate.parse(day);
 
     User currentUser = User.find("username", identity.getPrincipal().getName()).singleResult();
@@ -81,6 +87,6 @@ public class KalenderResource {
       tag.persist();
     }
 
-    return kalender();
+    return kalenderWithOffset(offsetInWeeks);
   }
 }

src/main/java/de/mbremer/kalender/KalenderTag.java

@@ -22,6 +22,8 @@ public class KalenderTag extends PanacheEntity {
   private User inOffice;
   @Transient
   private boolean currentUserInOffice;
+  @Transient
+  private boolean today;
 
   public KalenderTag(LocalDate day) {
     this.day = day;

src/main/resources/templates/kalender.html

@@ -1,95 +0,0 @@
-{#include base.html}
-{#kalender_active}active{/}
-{#contents}
-
-<div class="mt-2">
-  Heute ist {today.formatCommon}
-</div>
-<div class="mt-2">
-  <table class="table table-striped table-bordered">
-    <thead>
-    <tr>
-      <th scope="col" class="col-2">Ich will ins Büro</th>
-      <th scope="col" class="col-3">Datum</th>
-      <th scope="col">Im Büro</th>
-    </tr>
-    </thead>
-    <tbody>
-    {#for day in week0}
-    <tr>
-      <td>
-        <form action="/kalender/inoffice/{day.day}" method="POST" name="kalenderForm" enctype="multipart/form-data">
-          <div class="form-check form-switch">
-            <input class="form-check-input" type="checkbox" name="inoffice" onchange="this.form.submit()"
-                   {#if day.isCurrentUserInOffice}checked{/if} >
-          </div>
-        </form>
-      </td>
-      <td>
-        {day.day.formatCommon}
-      </td>
-      <td>
-        {#if day.inOffice}{day.inOffice.username}{/if}
-      </td>
-
-    </tr>
-    {/for}
-    </tbody>
-  </table>
-</div>
-
-<div class="mt-2">
-  <table class="table table-striped table-bordered">
-    <tbody>
-    {#for day in week1}
-    <tr>
-      <td class="col-2">
-        <form action="/kalender/inoffice/{day.day}" method="POST" name="kalenderForm" enctype="multipart/form-data">
-          <div class="form-check form-switch">
-            <input class="form-check-input" type="checkbox" name="inoffice" onchange="this.form.submit()"
-                   {#if day.isCurrentUserInOffice}checked{/if} >
-          </div>
-        </form>
-      </td>
-      <td class="col-3">
-        {day.day.formatCommon}
-      </td>
-      <td>
-        {#if day.inOffice}{day.inOffice.username}{/if}
-      </td>
-
-    </tr>
-
-    {/for}
-    </tbody>
-  </table>
-
-  <div class="mt-2">
-    <table class="table table-striped table-bordered">
-      <tbody>
-      {#for day in week2}
-      <tr>
-        <td class="col-2">
-          <form action="/kalender/inoffice/{day.day}" method="POST" name="kalenderForm" enctype="multipart/form-data">
-            <div class="form-check form-switch">
-              <input class="form-check-input" type="checkbox" name="inoffice" onchange="this.form.submit()"
-                     {#if day.isCurrentUserInOffice}checked{/if} >
-            </div>
-          </form>
-        </td>
-        <td class="col-3">
-          {day.day.formatCommon}
-        </td>
-        <td>
-          {#if day.inOffice}{day.inOffice.username}{/if}
-        </td>
-
-      </tr>
-
-      {/for}
-      </tbody>
-    </table>
-  </div>
-
-  {/contents}
-  {/include}

src/main/resources/templates/kalenderpage.html

@@ -0,0 +1,61 @@
+{#include base.html}
+{#kalender_active}active{/}
+{#contents}
+
+<div class="mt-2">
+  Heute ist {today.formatCommon}
+</div>
+
+<div class="mt-2">
+  <nav aria-label="Page navigation example">
+    <ul class="pagination">
+      <li class="page-item"><a class="page-link" href="/kalender">aktuelle Woche</a></li>
+      <li class="page-item">
+        <a class="page-link" href="/kalender/offset/{offset.minus(1)}" aria-label="Previous">
+          <span aria-hidden="true">&laquo;</span>
+        </a>
+      </li>
+      <li class="page-item">
+        <a class="page-link" href="/kalender/offset/{offset.plus(1)}" aria-label="Next">
+          <span aria-hidden="true">&raquo;</span>
+        </a>
+      </li>
+    </ul>
+  </nav>
+</div>
+
+<div class="mt-2">
+  <table class="table table-striped table-bordered">
+    <thead>
+    <tr>
+      <th scope="col" class="col-2">Ich will ins Büro</th>
+      <th scope="col" class="col-3">Datum</th>
+      <th scope="col">Im Büro</th>
+    </tr>
+    </thead>
+    <tbody>
+    {#for day in week}
+    <tr {#if day.isToday}class="table-primary"{/if}>
+      <td>
+        <form action="/kalender/inoffice/{day.day}?offset={offset}" method="POST" name="kalenderForm" enctype="multipart/form-data">
+          <div class="form-check form-switch">
+            <input class="form-check-input" type="checkbox" name="inoffice" onchange="this.form.submit()"
+                   {#if day.isCurrentUserInOffice}checked{/if} >
+          </div>
+        </form>
+      </td>
+      <td>
+        {day.day.formatCommon}
+      </td>
+      <td>
+        {#if day.inOffice}{day.inOffice.username}{/if}
+      </td>
+
+    </tr>
+    {/for}
+    </tbody>
+  </table>
+</div>
+
+{/contents}
+{/include}