From a7c555c8537decdcba5ae9cd72cf6c2620729ee3 Mon Sep 17 00:00:00 2001
From: cuom1999 <lephuocdinh99@gmail.com>
Date: Wed, 26 Apr 2023 03:38:34 -0500
Subject: [PATCH] Fix feed scroll on mobile

---
 judge/views/feed.py          |  1 +
 resources/base.scss          | 10 +++++++
 templates/feed/feed_js.html  | 54 +++++++++++++++++++++++-------------
 templates/feed/has_next.html |  5 +++-
 4 files changed, 49 insertions(+), 21 deletions(-)

diff --git a/judge/views/feed.py b/judge/views/feed.py
index 89bb882..cd809d5 100644
--- a/judge/views/feed.py
+++ b/judge/views/feed.py
@@ -27,6 +27,7 @@ class FeedView(InfinitePaginationMixin, ListView):
 
     def get_context_data(self, **kwargs):
         context = super().get_context_data(**kwargs)
+        context["has_next_page"] = context["page_obj"].has_next()
         try:
             context["feed_content_url"] = reverse(self.url_name)
         except Exception as e:
diff --git a/resources/base.scss b/resources/base.scss
index 62e204a..48ac6af 100644
--- a/resources/base.scss
+++ b/resources/base.scss
@@ -853,6 +853,13 @@ select {
     color: #808080;
 }
 
+.view-next-page {
+    margin-left: auto;
+    margin-right: auto;
+    margin-top: 1em;
+    margin-bottom: 1em;
+}
+
 @media (max-width: 799px) {
     #user-links, .anon {
         padding-right: 0.5em;
@@ -877,4 +884,7 @@ select {
         padding: 2em;
         border-radius: 1em;
     }
+    .view-next-page {
+        display: none;
+    }
 }
\ No newline at end of file
diff --git a/templates/feed/feed_js.html b/templates/feed/feed_js.html
index 80d878d..d5ca182 100644
--- a/templates/feed/feed_js.html
+++ b/templates/feed/feed_js.html
@@ -1,6 +1,6 @@
 <script>
   window.page = {{page_obj.number}};
-  window.has_next_page = {{1 if page_obj.has_next() else 0}};
+  window.has_next_page = {{1 if has_next_page else 0}};
   window.loading_page = false;
   $(function() {
     function getQueryParams() {
@@ -14,30 +14,44 @@
       return queryParams;
     }
 
+    function loadNextPage() {
+      window.loading_page = true;
+      var params = {
+        "only_content": 1,
+        "page": window.page + 1,
+      };
+
+      params = Object.assign({}, getQueryParams(), params);
+
+      $.get("{{feed_content_url}}", params)
+        .done(function(data) {
+        $(".has_next").remove();
+        $(".middle-content").append(data);
+        window.loading_page = false;
+        window.has_next_page = parseInt($(".has_next").attr("value"));
+        window.page++;
+        MathJax.typeset($('.middle-content')[0]);
+        onWindowReady();
+        activateBlogBoxOnClick();
+      })
+    }
+
     $(window).on("scroll", function() {
       if (window.loading_page || !window.has_next_page) return;
       var distanceFromBottom = $(document).height() - ($(window).scrollTop() + $(window).height());
-      if (distanceFromBottom < 500) {
-        window.loading_page = true;
-        var params = {
-          "only_content": 1,
-          "page": window.page + 1,
-        };
+      var isDesktop = window.matchMedia('(min-width: 800px)').matches;
 
-        params = Object.assign({}, getQueryParams(), params);
-
-        $.get("{{feed_content_url}}", params)
-          .done(function(data) {
-          $(".has_next").remove();
-          $(".middle-content").append(data);
-          window.loading_page = false;
-          window.has_next_page = parseInt($(".has_next").attr("value"));
-          window.page++;
-          MathJax.typeset($('.middle-content')[0]);
-          onWindowReady();
-          activateBlogBoxOnClick();
-        })
+      if (isDesktop && distanceFromBottom < 500) {
+        loadNextPage();
       }
     });
+
+    $(document).on("click", ".view-next-page", () => {
+      if (window.loading_page || !window.has_next_page) return;
+      var isDesktop = window.matchMedia('(min-width: 800px)').matches;
+      if (isDesktop) return;
+      $(".view-next-page").remove();
+      loadNextPage();
+    });
   });
 </script>
\ No newline at end of file
diff --git a/templates/feed/has_next.html b/templates/feed/has_next.html
index 18415b5..9cc45c9 100644
--- a/templates/feed/has_next.html
+++ b/templates/feed/has_next.html
@@ -1 +1,4 @@
-<div class="has_next" style="display: none;" value="{{1 if has_next_page else 0}}"></div>
\ No newline at end of file
+<div class="has_next" style="display: none;" value="{{1 if has_next_page else 0}}"></div>
+{% if has_next_page %}
+  <button class="view-next-page btn-green small">{{_('View more')}}</button>
+{% endif %}
\ No newline at end of file