From 4c8f66db981f6a59a7c21dcb4f57157f7e9ed052 Mon Sep 17 00:00:00 2001
From: irrlicht <david@bernet.it>
Date: Mon, 15 Dec 2025 16:12:46 +0100
Subject: [PATCH] Added infinite scroll

---
 entry.py                  | 7 ++++++-
 static/css/main.css       | 3 +++
 static/css/main.scss      | 4 ++++
 templates/entry/feed.html | 8 ++++++++
 templates/index.html      | 2 +-
 5 files changed, 22 insertions(+), 2 deletions(-)

diff --git a/entry.py b/entry.py
index 8956475..9f4058b 100644
--- a/entry.py
+++ b/entry.py
@@ -16,12 +16,17 @@ def feed(page):
 
     posts = database.fetch("SELECT * FROM entry ORDER BY created_at DESC LIMIT ? OFFSET ?", [count, offset])
 
+    if len(posts) <= 0:
+        return """<div id="infinite-scroll-indicator">
+        <h2>YOU REACHED THE END!</h2>
+        </div>"""
+
     posts_with_usernames = []
     for post in posts:
         username = database.fetch("SELECT username FROM user WHERE uid = ?", [post[2]])
         posts_with_usernames.append(post + username[0])
 
-    return render_template("entry/feed.html", posts=posts_with_usernames)
+    return render_template("entry/feed.html", posts=posts_with_usernames, page=page)
 
 @app.route("/entry/create", methods=['GET', 'POST'])
 def newentry():
diff --git a/static/css/main.css b/static/css/main.css
index 852391b..9c9897d 100644
--- a/static/css/main.css
+++ b/static/css/main.css
@@ -48,6 +48,9 @@ hr {
   transition: background-color 5s;
   transition-timing-function: ease-in; }
 
+#infinite-scroll-indicator {
+  text-align: center; }
+
 form {
   display: flex;
   flex-direction: column; }
diff --git a/static/css/main.scss b/static/css/main.scss
index 9aeb489..e3de7ea 100644
--- a/static/css/main.scss
+++ b/static/css/main.scss
@@ -64,6 +64,10 @@ hr {
     transition-timing-function: ease-in;
 }
 
+#infinite-scroll-indicator {
+    text-align: center;
+}
+
 
 // // @font-face {
 // //     font-family: 'avenir';
diff --git a/templates/entry/feed.html b/templates/entry/feed.html
index f1a84e2..bb15d3a 100644
--- a/templates/entry/feed.html
+++ b/templates/entry/feed.html
@@ -1,3 +1,4 @@
+Page No.: {{ page }}
 {% for p in posts %}
 
 <div class="entry">
@@ -14,3 +15,10 @@
 <hr>
 
 {% endfor %}
+
+<div id="infinite-scroll-indicator"
+    hx-get="/entry/feed/{{page+1}}"
+    hx-trigger="revealed"
+    hx-swap="outerHTML">
+    <h2>Loading more...</h2>
+</div>
diff --git a/templates/index.html b/templates/index.html
index 69f8797..51e6c90 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -12,6 +12,6 @@
 
 <hr>
 
-<div hx-get="/entry/feed/0" hx-trigger="load, every 5s"></div>
+<div hx-get="/entry/feed/0" hx-trigger="load" hx-indicator="none"></div>
 
 {% endblock %}