From 855dac7e1ab2f23e4df25df9f3dc3d6de8446ac5 Mon Sep 17 00:00:00 2001
From: Aaron Fischer <mail@aaron-fischer.net>
Date: Tue, 18 Apr 2017 22:21:18 +0200
Subject: [PATCH] Add nice pagination and some code cleanup #20

---
 project.clj                     |  2 +-
 resources/public/js/main.js     |  6 ++++++
 resources/templates/index.html  |  3 ++-
 resources/templates/layout.html |  1 +
 src/clj/yenu/routes/core.clj    | 17 ++++++++++++++---
 5 files changed, 24 insertions(+), 5 deletions(-)
 create mode 100644 resources/public/js/main.js

diff --git a/project.clj b/project.clj
index aad4283..c5aa785 100644
--- a/project.clj
+++ b/project.clj
@@ -1,6 +1,6 @@
 (defproject yenu "0.1.0-SNAPSHOT"
   :description "yenu -- The image sharing tool for friends"
-  :url "https://aaron-fischer.net/"
+  :url "https://yenu.de/"
 
   :dependencies [[bouncer "1.0.1"]
                  [compojure "1.5.2"]
diff --git a/resources/public/js/main.js b/resources/public/js/main.js
new file mode 100644
index 0000000..5800c97
--- /dev/null
+++ b/resources/public/js/main.js
@@ -0,0 +1,6 @@
+$(function () {
+    $('#page-switcher').on('change', function(e) {
+        var page = $(e.target).val();
+        window.location = '/page/' + page;
+    });
+});
diff --git a/resources/templates/index.html b/resources/templates/index.html
index a4880cb..5c36933 100644
--- a/resources/templates/index.html
+++ b/resources/templates/index.html
@@ -2,7 +2,8 @@
 
 {% block content %}
 
-{% safe %}{{ pagination| }}{% endsafe %}
+{% safe %}{{ pagination }}{% endsafe %}
+{% safe %}{{ pagination-mobile }}{% endsafe %}
 
 <div class="clearfix d-flex justify-content-center flex-wrap">
   {% for image in images %}
diff --git a/resources/templates/layout.html b/resources/templates/layout.html
index 63128b8..25f78d2 100644
--- a/resources/templates/layout.html
+++ b/resources/templates/layout.html
@@ -81,6 +81,7 @@
 
     {% script "/assets/jquery/jquery.min.js" %}
     {% script "/assets/bootstrap/js/bootstrap.min.js" %}
+    {% script "/js/main.js" %}
   </body>
 </html>
 
diff --git a/src/clj/yenu/routes/core.clj b/src/clj/yenu/routes/core.clj
index b41dcbd..0fd92cb 100644
--- a/src/clj/yenu/routes/core.clj
+++ b/src/clj/yenu/routes/core.clj
@@ -13,7 +13,7 @@
 
 (defn page [number is-current? additional-class content]
   (h/html
-   [:li (if is-current? {:class (str "page-item " additional-class)} {:class "page-item"})
+   [:li {:class (cond-> ["page-item"] is-current? (conj additional-class))}
     [:a.page-link {:href (str "/page/" number)} content]]))
 
 (defn dots []
@@ -25,7 +25,7 @@
 (defn pagination [num current]
   (h/html
    [:nav.pull-right.clearfix {:aria-label "Page navigation"}
-    [:ul.pagination
+    [:ul.pagination.hidden-sm-down
      (page (dec current) (= current 1) "disabled" (h/html [:span.fa.fa-arrow-left] " Zurück"))
      (cond
        (< num 13) (pagelist 1 num current)
@@ -35,6 +35,16 @@
      (page (inc current) (= current num) "disabled" (h/html "Weiter " [:span.fa.fa-arrow-right]))]]
    [:div.clearfix]))
 
+(defn pagination-mobile [num current]
+  (h/html
+   [:ul.pagination.justify-content-end.hidden-md-up
+    (page (dec current) (= current 1) "disabled" (h/html [:span.fa.fa-arrow-left] " Zurück"))
+    [:form.form-inline
+     [:select#page-switcher.form-control
+      (for [p (range 1 (inc num))]
+        [:option (cond-> {:value p} (= p current) (assoc :selected "selected")) p])]]
+    (page (inc current) (= current num) "disabled" (h/html "Weiter " [:span.fa.fa-arrow-right]))]))
+
 (defn index-page [current request]
   (let [image-count 25
         offset (* (dec current) image-count)
@@ -43,7 +53,8 @@
     (layout/render "index.html"
                    {:images images
                     :flash (:flash request)
-                    :pagination (pagination pages current)})))
+                    :pagination (pagination pages current)
+                    :pagination-mobile (pagination-mobile pages current)})))
 
 (defn detail-page [image-id request]
   (let [image (db/get-image {:id image-id})