Add pagination to index page.

diff --git a/src/main/java/net/pterodactylus/sone/web/IndexPage.java b/src/main/java/net/pterodactylus/sone/web/IndexPage.java
index 47f2715..67d11c6 100644 (file)
--- a/src/main/java/net/pterodactylus/sone/web/IndexPage.java
+++ b/src/main/java/net/pterodactylus/sone/web/IndexPage.java
@@ -24,6 +24,7 @@ import java.util.List;
 
 import net.pterodactylus.sone.data.Post;
 import net.pterodactylus.sone.data.Sone;
+import net.pterodactylus.util.collection.Pagination;
 import net.pterodactylus.util.template.Template;
 
 /**
@@ -68,7 +69,11 @@ public class IndexPage extends SoneTemplatePage {
                        }
 
                });
-               template.set("posts", allPosts);
+               int page = request.getHttpRequest().getIntParam("page", 0);
+               Pagination<Post> postPagination = new Pagination<Post>(allPosts, 25).setPage(page);
+               List<Post> postsOnPage = postPagination.getItems();
+               template.set("posts", postsOnPage);
+               template.set("pagination", postPagination);
        }
 
        //

diff --git a/src/main/resources/static/css/sone.css b/src/main/resources/static/css/sone.css
index ea508ea..b2c5ff0 100644 (file)
--- a/src/main/resources/static/css/sone.css
+++ b/src/main/resources/static/css/sone.css
@@ -333,6 +333,36 @@ textarea {
        position: absolute;
 }
 
+#sone .navigation {
+       text-align: center;
+}
+
+#sone .navigation .first a, #sone .navigation .previous a, #sone .navigation .next a, #sone .navigation .last a, #sone .navigation .first span, #sone .navigation .previous span, #sone .navigation .next span, #sone .navigation .last span {
+       display: block;
+       height: 1.5em;
+       padding: 0.5ex;
+       width: 3em;
+       border: solid 1px #ccc;
+       background-color: #f0f0ff;
+}
+
+#sone .navigation .first, #sone .navigation .previous {
+       float: left;
+}
+
+#sone .navigation .current-page, #sone .navigation .total-pages {
+       margin-top: 0.5ex;
+       display: inline;
+}
+
+#sone .navigation .total-pages:before {
+       content: '/ ';
+}
+
+#sone .navigation .next, #sone .navigation .last {
+       float: right;
+}
+
 #sone h1 {
        font-family: inherit;
        font-size: 200%;

diff --git a/src/main/resources/templates/include/pagination.html b/src/main/resources/templates/include/pagination.html
new file mode 100644 (file)
index 0000000..5601d97
--- /dev/null
+++ b/src/main/resources/templates/include/pagination.html
@@ -0,0 +1,10 @@
+<%if pagination.necessary>
+       <div class="navigation">
+               <div class="first"><%if ! pagination.first><a href="<% request|change name=page value=0>">«</a><%else><span>«</span><%/if></div>
+               <div class="previous"><%if ! pagination.first><a href="<% request|change name=page key=pagination.previousPage>">‹</a><%else><span>‹</span><%/if></div>
+               <div class="current-page"><% pagination.pageNumber></div>
+               <div class="total-pages"><% pagination.pageCount></div>
+               <div class="last"><%if ! pagination.last><a href="<% request|change name=page key=pagination.lastPage>">»</a><%else><span>»</span><%/if></div>
+               <div class="next"><%if ! pagination.last><a href="<% request|change name=page key=pagination.nextPage>">›</a><%else><span>›</span><%/if></div>
+       </div>
+<%/if>

diff --git a/src/main/resources/templates/index.html b/src/main/resources/templates/index.html
index 3bd914f..888cdb2 100644 (file)
--- a/src/main/resources/templates/index.html
+++ b/src/main/resources/templates/index.html
@@ -3,11 +3,13 @@
        <h1><%= Page.Index.PostList.Title|l10n|html></h1>
 
        <div id="posts">
+               <%include include/pagination.html>
                <%foreach posts post postLoop>
                        <%include include/viewPost.html>
                <%foreachelse>
                        <div><%= Page.Index.PostList.Text.NoPostYet|l10n|html></div>
                <%/foreach>
+               <%include include/pagination.html>
        </div>
 
 <%include include/tail.html>