From b247655a5f9736bd0db0beb43b2737f10b6af2b1 Mon Sep 17 00:00:00 2001
From: ghost <noreply@localhost>
Date: Sun, 9 Jan 2022 19:59:32 +0200
Subject: [PATCH] implement feed pagination

---
 src/application/controller/api/post/get.php   | 14 ++++++++++--
 .../css/template/default/module/feed.css      | 22 +++++++++++++++++++
 src/public/js/home.js                         |  4 ++--
 src/public/js/module/feed.js                  | 12 +++++++++-
 src/public/js/people.js                       |  4 ++--
 5 files changed, 49 insertions(+), 7 deletions(-)

diff --git a/src/application/controller/api/post/get.php b/src/application/controller/api/post/get.php
index f1933d6..956dfe9 100644
--- a/src/application/controller/api/post/get.php
+++ b/src/application/controller/api/post/get.php
@@ -4,10 +4,13 @@ $response = [
   'success' => false,
   'message' => _('Internal server error'),
   'posts'   => [],
+  'page'    => 0,
 ];
 
 if (isset($_SESSION['userName'])) {
 
+  $page = isset($_GET['page']) ? Filter::int($_GET['page']) : 1;
+
   $userNames = [];
 
   if (isset($_GET['userName']) && !empty($_GET['userName'])) {
@@ -22,11 +25,15 @@ if (isset($_SESSION['userName'])) {
     }
   }
 
-  if ($result = $_twister->getPosts($userNames, APPLICATION_MAX_POST_FEED)) {
+  if ($result = $_twister->getPosts($userNames, APPLICATION_MAX_POST_FEED * $page)) {
 
+    $postsTotal = 0;
     $posts = [];
     foreach ($result as $post) {
 
+      // Count posts
+      $postsTotal++;
+
       // Process reTwists
       $reTwist = [];
       if ($post['reTwist']) {
@@ -50,7 +57,8 @@ if (isset($_SESSION['userName'])) {
     $response = [
       'success' => true,
       'message' => _('Posts successfully loaded'),
-      'posts'   => $posts
+      'posts'   => $posts,
+      'page'    => $postsTotal == $page * APPLICATION_MAX_POST_FEED ? $page + 1 : 0
     ];
 
   } else {
@@ -59,6 +67,7 @@ if (isset($_SESSION['userName'])) {
       'success' => false,
       'message' => _('Could not receive post data'),
       'posts'   => [],
+      'page'    => 0
     ];
   }
 
@@ -67,6 +76,7 @@ if (isset($_SESSION['userName'])) {
     'success' => false,
     'message' => _('Session expired'),
     'posts'   => [],
+    'page'    => 0
   ];
 }
 
diff --git a/src/public/css/template/default/module/feed.css b/src/public/css/template/default/module/feed.css
index 71b599b..628cf7b 100644
--- a/src/public/css/template/default/module/feed.css
+++ b/src/public/css/template/default/module/feed.css
@@ -1,3 +1,7 @@
+.moduleFeed {
+  margin-bottom: 36px;
+}
+
 .moduleFeed .item {
   padding: 16px;
   margin-bottom: 2px;
@@ -59,4 +63,22 @@
 .moduleFeed .item .message .info a:hover,
 .moduleFeed .item .message .info a:visited {
   color: #1c1d1e;
+}
+
+.moduleFeed .loadMore {
+  width: 100%;
+  margin: 8px 0;
+  padding: 0 16px;
+  background: rgba(39, 46, 57, 0.28);
+  border-radius: 3px;
+  cursor: pointer;
+  text-align: center;
+  height: 36px;
+  line-height: 36px;
+  text-align: center;
+  box-sizing: border-box;
+}
+
+.moduleFeed .loadMore:hover {
+  background-color: #272E39
 }
\ No newline at end of file
diff --git a/src/public/js/home.js b/src/public/js/home.js
index 8c8be29..704dffc 100644
--- a/src/public/js/home.js
+++ b/src/public/js/home.js
@@ -2,12 +2,12 @@ $(document).ready(function() {
 
   // Init modules
   ModuleMenu.init('/');
-  ModuleFeed.load('#moduleFeed', true);
+  ModuleFeed.load('#moduleFeed', 1, true);
   //ModuleUsers.load('#moduleUsers', true);
 
   // Event listeners
   $(document).on('ModulePost.add:success', function(/*event, response*/) {
-    ModuleFeed.load('#moduleFeed', true);
+    ModuleFeed.load('#moduleFeed', 1, true);
   });
 
 });
\ No newline at end of file
diff --git a/src/public/js/module/feed.js b/src/public/js/module/feed.js
index c3fcb6c..2b84938 100644
--- a/src/public/js/module/feed.js
+++ b/src/public/js/module/feed.js
@@ -97,11 +97,12 @@ var ModuleFeed = {
       }
     });
   },
-  load: function(feed, reFresh) {
+  load: function(feed, page, reFresh) {
     $.ajax({
       url: 'api/post/get',
       type: 'GET',
       data: {
+        page: page,
         userName: $(feed).data('username')
       },
       success: function (response) {
@@ -116,6 +117,15 @@ var ModuleFeed = {
             ModuleFeed.loadAvatar(feed, this.userName);
           });
 
+          if (response.page > 0) {
+            $(feed).append(
+              $('<div/>', {
+                'class': 'loadMore',
+                'onclick': 'ModuleFeed.load(\'' + feed + '\', ' + response.page + ', true)'
+              }).text('More')
+            );
+          }
+
         } else {
 
           console.log(response.message);
diff --git a/src/public/js/people.js b/src/public/js/people.js
index 3a96d5e..247d63b 100644
--- a/src/public/js/people.js
+++ b/src/public/js/people.js
@@ -3,12 +3,12 @@ $(document).ready(function() {
   // Init modules
   ModuleMenu.init('people');
   ModuleFollowing.load('#moduleFollowing', true);
-  ModuleFeed.load('#moduleFeed', true);
+  ModuleFeed.load('#moduleFeed', 1, true);
 
   // Event listeners
   $(document).on('ModuleFollowing.unFollow:success', function(/*event, response*/) {
     ModuleMenu.init('people');
     ModuleFollowing.load('#moduleFollowing', true);
-    ModuleFeed.load('#moduleFeed', true);
+    ModuleFeed.load('#moduleFeed', 1, true);
   });
 });
\ No newline at end of file