From b570e2af7cdaff9d682d33e57488f7a8e1bf2e93 Mon Sep 17 00:00:00 2001 From: Aaron Fischer Date: Fri, 17 Mar 2017 00:23:13 +0100 Subject: [PATCH] Add navigation and pagination --- resources/public/css/screen.css | 9 --------- resources/scss/screen.scss | 5 ----- resources/sql/queries.sql | 4 ++++ resources/templates/admin/upload.html | 2 +- resources/templates/index.html | 26 ++++++++++++++++++++++---- resources/templates/layout.html | 24 +++++++++++++++++++----- src/clj/yenu/layout.clj | 3 +++ src/clj/yenu/routes/core.clj | 20 ++++++++++++++++---- 8 files changed, 65 insertions(+), 28 deletions(-) diff --git a/resources/public/css/screen.css b/resources/public/css/screen.css index 26b3d46..e69de29 100644 --- a/resources/public/css/screen.css +++ b/resources/public/css/screen.css @@ -1,9 +0,0 @@ -#images { - margin: auto; -} - -.thumbnail-image { - margin: 2px; - padding: 1px; - border: 1px solid #ddd; -} diff --git a/resources/scss/screen.scss b/resources/scss/screen.scss index 7f38ace..e69de29 100644 --- a/resources/scss/screen.scss +++ b/resources/scss/screen.scss @@ -1,5 +0,0 @@ -html, body { - font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; - height: 100%; - padding-top: 40px; -} diff --git a/resources/sql/queries.sql b/resources/sql/queries.sql index 76fe1ae..64ba0d8 100644 --- a/resources/sql/queries.sql +++ b/resources/sql/queries.sql @@ -16,8 +16,12 @@ WHERE id = :id -- :name get-all-images :? :* SELECT * FROM images +ORDER BY created_at DESC LIMIT :count OFFSET :offset +-- :name get-image-count :? :1 +SELECT COUNT(id) as count FROM images + -- :name create-tag! :i! INSERT OR IGNORE INTO tags (tagname) diff --git a/resources/templates/admin/upload.html b/resources/templates/admin/upload.html index c414f85..25becfe 100644 --- a/resources/templates/admin/upload.html +++ b/resources/templates/admin/upload.html @@ -1,7 +1,7 @@ {% extends "layout.html" %} {% block content %} -

Upload a new image

+

Upload a new image

Here you can upload a new image to the gallery. This image is then saved in three different formats. The raw image, a scaled down version and a scoped thumbnail image for the overview. You can upload all sorts of images.

diff --git a/resources/templates/index.html b/resources/templates/index.html index cf6176d..22bd3a8 100644 --- a/resources/templates/index.html +++ b/resources/templates/index.html @@ -1,16 +1,34 @@ {% extends "layout.html" %} {% block content %} + +{% if pages|count > 1 %} + +
+{% endif %} +
{% for image in images %} -
{{ image.title }} -

{{ image.title }} -

{% endfor %}
{% endblock %} - diff --git a/resources/templates/layout.html b/resources/templates/layout.html index 88114fc..122fe1f 100644 --- a/resources/templates/layout.html +++ b/resources/templates/layout.html @@ -6,12 +6,26 @@ yenu -- the image sharing tool for friends -
-

yenu

- Images, - Upload a new image -
+ + +
{% block content %} {% endblock %}
diff --git a/src/clj/yenu/layout.clj b/src/clj/yenu/layout.clj index 457e3b1..a822654 100644 --- a/src/clj/yenu/layout.clj +++ b/src/clj/yenu/layout.clj @@ -1,5 +1,6 @@ (ns yenu.layout (:require [selmer.parser :as parser] + [selmer.filters :as filter] [ring.util.http-response :refer [content-type ok]] [ring.util.anti-forgery :refer [anti-forgery-field]] [yenu.helpers.images :as image-helper] @@ -8,6 +9,8 @@ (declare ^:dynamic *app-context*) (parser/set-resource-path! (clojure.java.io/resource "templates")) (parser/add-tag! :csrf-field (fn [_ _] (anti-forgery-field))) +(filter/add-filter! :inc inc) +(filter/add-filter! :dec dec) (defn render "renders the HTML template located relative to resources/templates" diff --git a/src/clj/yenu/routes/core.clj b/src/clj/yenu/routes/core.clj index d6fa7c4..1af5d8e 100644 --- a/src/clj/yenu/routes/core.clj +++ b/src/clj/yenu/routes/core.clj @@ -6,9 +6,19 @@ [yenu.helpers.images :as images] [yenu.db.core :as db])) -(defn index-page [] - (layout/render "index.html" - {:images (db/get-all-images {:offset 0 :count 10})})) +(defn number-of-pages [images-on-page] + (int (Math/ceil + (/ (:count (db/get-image-count)) images-on-page)))) + +(defn index-page [current-page] + (let [image-count 5 + offset (* (dec current-page) image-count) + pages (number-of-pages image-count) + images (db/get-all-images {:offset offset :count image-count})] + (layout/render "index.html" + {:images images + :current-page current-page + :pages (range 1 (inc pages))}))) (defn image-file [type hash ext] (let [filename (str hash "." ext)] @@ -16,7 +26,9 @@ (defroutes core-routes (GET "/" [] - (index-page)) + (redirect "/page/1")) + (GET "/page/:page-number" [page-number] + (index-page (Integer. page-number))) (GET ["/images/:type/:hash.:ext" ;;:type #"(normal|raw|thumbnails)" ;;:hash #"[0-9]+-[^.]+"