From 9e38502edec81c47a54641186d888f191ed999f0 Mon Sep 17 00:00:00 2001 From: HombreLaser Date: Mon, 26 Feb 2024 15:40:55 -0600 Subject: Add pagination handling --- src/controllers/comments_controller.py | 2 +- src/queries/comments_query.py | 11 +++++++++-- static/js/controllers/base_controller.js | 3 +-- static/js/controllers/comments_controller.js | 8 +++++++- static/js/paginator.js | 15 +++++++++++++++ templates/comments/index.jinja | 2 +- templates/macros/pagination.jinja | 4 ++-- 7 files changed, 36 insertions(+), 9 deletions(-) create mode 100644 static/js/paginator.js diff --git a/src/controllers/comments_controller.py b/src/controllers/comments_controller.py index c9bab0d..61b32c6 100644 --- a/src/controllers/comments_controller.py +++ b/src/controllers/comments_controller.py @@ -30,7 +30,7 @@ def new(): @comments_blueprint.get('/api/comments') def index(): post = request.args.get('path') - page = query.comments_of_post(post) + page = query.comments_of_post(post, page=request.args.get('page')) if page.total == 0: abort(404) diff --git a/src/queries/comments_query.py b/src/queries/comments_query.py index e343667..5312cca 100644 --- a/src/queries/comments_query.py +++ b/src/queries/comments_query.py @@ -10,9 +10,16 @@ class CommentsQuery(BaseQuery): def all_comments(self): return db.paginate(db.select(Comment)) - def comments_of_post(self, post): + def comments_of_post(self, post, page=1): + try: + if page is not None and isinstance(page, str): + page = int(page) + except ValueError: + page = 1 + return db.paginate( - db.select(Comment).where(Comment.post == post).order_by(Comment.created_at.desc()) + db.select(Comment).where(Comment.post == post).order_by(Comment.created_at.desc()), + page=page, max_per_page=5 ) def replies_of(self, comment_id): diff --git a/static/js/controllers/base_controller.js b/static/js/controllers/base_controller.js index 6caa9dd..2ef359c 100644 --- a/static/js/controllers/base_controller.js +++ b/static/js/controllers/base_controller.js @@ -9,9 +9,8 @@ export class BaseController { this.parser = new DOMParser(); } - async submit(event, route) { + async submit(event, route, form = new FormData(event.target)) { event.preventDefault(); - const form = new FormData(event.target); try { const response = await fetch(route, { method: "POST", body: form }); diff --git a/static/js/controllers/comments_controller.js b/static/js/controllers/comments_controller.js index a21bd05..683f5ca 100644 --- a/static/js/controllers/comments_controller.js +++ b/static/js/controllers/comments_controller.js @@ -1,10 +1,12 @@ import { BaseController } from "./base_controller.js"; +import { Paginator } from "../paginator.js"; export class CommentsController extends BaseController { constructor(replies_controller) { super(); this.replies_controller = replies_controller; this.comments_node = document.getElementById("comments-thread"); + this.paginator = new Paginator(this.comments_server_host, "/api/comments", this.post); this.renderForm(); this.renderComments(); } @@ -28,6 +30,7 @@ export class CommentsController extends BaseController { if(comments != null) { this.comments_node.appendChild(comments); this.replies_controller.init(); + this.paginator.populatePageAnchors(); } }); } @@ -39,7 +42,10 @@ export class CommentsController extends BaseController { } async submit(event) { - super.submit(event, `${this.comments_server_host}/api/comments?path=${this.post}`); + var form = new FormData(event.target); + form.append("domain", `${window.location.protocol}//${window.location.host}`); + + super.submit(event, `${this.comments_server_host}/api/comments?path=${this.post}`, form); } } diff --git a/static/js/paginator.js b/static/js/paginator.js new file mode 100644 index 0000000..9a7ed65 --- /dev/null +++ b/static/js/paginator.js @@ -0,0 +1,15 @@ +export class Paginator { + constructor(host, context, path) { + this.endpoint = `${host}${context}?path=${path}`; + } + + populatePageAnchors() { + const pagination_widget = document.querySelector(".pagination"); + var anchors = pagination_widget.querySelectorAll('a'); + + for(let anchor of anchors) { + var page = /\d/.exec(anchor.id)[0]; + anchor.setAttribute("href", `${this.endpoint}&page=${page}`); + } + } +} \ No newline at end of file diff --git a/templates/comments/index.jinja b/templates/comments/index.jinja index 217ddb3..ebf1e4e 100644 --- a/templates/comments/index.jinja +++ b/templates/comments/index.jinja @@ -28,5 +28,5 @@ {% endfor %} - {{ pagination.render_pagination(page, 'comments.index') }} + {{ pagination.render_pagination(page) }} diff --git a/templates/macros/pagination.jinja b/templates/macros/pagination.jinja index fdd8993..b53c0eb 100644 --- a/templates/macros/pagination.jinja +++ b/templates/macros/pagination.jinja @@ -1,4 +1,4 @@ -{% macro render_pagination(pagination, endpoint) %} +{% macro render_pagination(pagination) %}
{{ pagination.first }} - {{ pagination.last }} of {{ pagination.total }}
@@ -6,7 +6,7 @@ {% for page in pagination.iter_pages() %} {% if page %} {% if page != pagination.page %} - {{ page }} + {{ page }} {% else %} {{ page }} {% endif %} -- cgit v1.2.3