seperated comment paging logic. fixes #29 fixes #30

This commit is contained in:
Ryan Stafford 2023-07-11 11:30:20 -04:00
parent 36df7969e6
commit b9cf0c4835
5 changed files with 52 additions and 14 deletions

View file

@ -352,6 +352,9 @@ form.nsfw div {
.gray { .gray {
color: #808080; color: #808080;
} }
.loading {
color: red !important;
}
.error { .error {
color: red; color: red;
font-size: 13px; font-size: 13px;

View file

@ -105,6 +105,28 @@ function commentClick(e) {
return false return false
} }
} }
function loadMoreComments(e) {
e.preventDefault()
page = e.target.getAttribute("data-page")
var urlParams = new URLSearchParams(window.location.search);
urlParams.set("xhr", "1")
urlParams.set("page", page)
e.target.innerHTML = "loading"
e.target.className = "loading"
request(window.location.origin+window.location.pathname+"?"+urlParams.toString(), "",
function(res){
if (res.trim()) {
e.target.parentNode.outerHTML = res + '<div class="morecomments"><a id="lmc" href="" data-page="'+(parseInt(page)+1)+'">load more comments</a></div>'
setup()
} else {
e.target.parentNode.outerHTML = ""
}
}, function() {
e.target.innerHTML = "loading failed"
})
return false;
}
function loadMore(e) { function loadMore(e) {
e.preventDefault() e.preventDefault()
page = e.target.getAttribute("data-page") page = e.target.getAttribute("data-page")
@ -281,6 +303,9 @@ function setup() {
if (hidechildren = document.getElementById("hidechildren")){ if (hidechildren = document.getElementById("hidechildren")){
hidechildren.addEventListener("click", hideAllChildComments) hidechildren.addEventListener("click", hideAllChildComments)
} }
if (lmc = document.getElementById("lmc")){
lmc.addEventListener("click", loadMoreComments)
}
var posts = document.getElementsByClassName("post") var posts = document.getElementsByClassName("post")
for (var i = 0; i < posts.length; i++) { for (var i = 0; i < posts.length; i++) {
posts[i].addEventListener("click", postClick) posts[i].addEventListener("click", postClick)
@ -313,18 +338,21 @@ if (localStorage.getItem("endlessScrolling") == "true") {
loadmore.className = "show" loadmore.className = "show"
loadmore.addEventListener("click", loadMore) loadmore.addEventListener("click", loadMore)
} }
}
if (localStorage.getItem("autoLoad") == "true") { if (localStorage.getItem("autoLoad") == "true") {
window.onscroll = function(e) { window.onscroll = function(e) {
if ((window.innerHeight + Math.round(window.scrollY)) >= document.body.offsetHeight) { if ((window.innerHeight + Math.round(window.scrollY)) >= document.body.offsetHeight) {
var loadmore = document.getElementById("loadmore") if (localStorage.getItem("endlessScrolling") == "true") {
if (loadmore) { if (loadmore = document.getElementById("loadmore")) {
loadmore.click() loadmore.click()
} }
} }
}; if (lmc = document.getElementById("lmc")) {
lmc.click()
} }
} }
};
}
// delete cookies without HTTPOnly // delete cookies without HTTPOnly
var cookies = document.cookie.split(";"); var cookies = document.cookie.split(";");

View file

@ -2,7 +2,7 @@
<head> <head>
<title>{{ if and .Community (ne .Community.CommunityView.Community.Title "")}}{{.Community.CommunityView.Community.Title}}{{else if ne .CommunityName ""}}/c/{{.CommunityName}}{{ else if .User}}overview for {{.User.PersonView.Person.Name}}{{else}}{{ host .Host }}{{end}}</title> <title>{{ if and .Community (ne .Community.CommunityView.Community.Title "")}}{{.Community.CommunityView.Community.Title}}{{else if ne .CommunityName ""}}/c/{{.CommunityName}}{{ else if .User}}overview for {{.User.PersonView.Person.Name}}{{else}}{{ host .Host }}{{end}}</title>
<link rel="shortcut icon" href="/{{.Host}}/icon.jpg"> <link rel="shortcut icon" href="/{{.Host}}/icon.jpg">
<link rel="stylesheet" href="/_/static/style.css?v=18"> <link rel="stylesheet" href="/_/static/style.css?v=20">
<meta name="viewport" content="width=device-width, initial-scale=1" /> <meta name="viewport" content="width=device-width, initial-scale=1" />
</head> </head>
<body {{ if .Dark }}class="dark"{{end}}> <body {{ if .Dark }}class="dark"{{end}}>
@ -56,6 +56,6 @@
{{ template "sidebar.html" . }} {{ template "sidebar.html" . }}
</main> </main>
{{ end }} {{ end }}
<script src="/_/static/utils.js?v=13"></script> <script src="/_/static/utils.js?v=14"></script>
</body> </body>
</html> </html>

View file

@ -3,7 +3,7 @@
<title>{{if and .Posts .PostID }}{{ (index .Posts 0).Post.Name}} : {{.CommunityName}}{{else if and .Community (ne .Community.CommunityView.Community.Title "")}}{{.Community.CommunityView.Community.Title}}{{else if ne .CommunityName ""}}/c/{{.CommunityName}}{{ else if .User}}overview for {{.User.PersonView.Person.Name}}{{else}}{{ host .Host }}{{end}}</title> <title>{{if and .Posts .PostID }}{{ (index .Posts 0).Post.Name}} : {{.CommunityName}}{{else if and .Community (ne .Community.CommunityView.Community.Title "")}}{{.Community.CommunityView.Community.Title}}{{else if ne .CommunityName ""}}/c/{{.CommunityName}}{{ else if .User}}overview for {{.User.PersonView.Person.Name}}{{else}}{{ host .Host }}{{end}}</title>
<meta name="viewport" content="width=device-width, initial-scale=1" /> <meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="shortcut icon" href="/{{.Host}}/icon.jpg"> <link rel="shortcut icon" href="/{{.Host}}/icon.jpg">
<link rel="stylesheet" href="/_/static/style.css?v=19"> <link rel="stylesheet" href="/_/static/style.css?v=20">
</head> </head>
<body{{ if .Dark }} class="dark"{{end}}> <body{{ if .Dark }} class="dark"{{end}}>
<noscript> <noscript>
@ -107,6 +107,12 @@
{{ template "comment.html" $comment }} {{ template "comment.html" $comment }}
{{ end }} {{ end }}
{{ if (and .Comments (gt (index .Posts 0).Counts.Comments .CommentCount)) }}
<div class="morecomments">
<a id="lmc" href="" data-page="2">load more comments</a>
</div>
{{ end }}
{{ if eq .Op "send_message" }} {{ if eq .Op "send_message" }}
{{ template "send_message.html" . }} {{ template "send_message.html" . }}
{{ else }} {{ else }}
@ -117,15 +123,14 @@
<div class="error">there doesn't seem to be anything here</div> <div class="error">there doesn't seem to be anything here</div>
{{ end }} {{ end }}
{{ if or .Query (eq .SearchType "Communities") (eq (len .Posts) 25) (and .User (or (gt .User.PersonView.Counts.CommentCount 10) (gt .User.PersonView.Counts.PostCount 10))) }}
{{ if or .Query (eq .SearchType "Communities") (eq (len .Posts) 25) (and .Comments (gt (index .Posts 0).Counts.Comments .CommentCount) (not .CommentID)) (and .User (or (gt .User.PersonView.Counts.CommentCount 10) (gt .User.PersonView.Counts.PostCount 10))) }}
<div class="pager"> <div class="pager">
view more: {{if gt .Page 1 }}<a href="{{ .PrevPage }}"> prev</a>{{ end }} <a href="{{ .NextPage }}">next </a> view more: {{if gt .Page 1 }}<a href="{{ .PrevPage }}"> prev</a>{{ end }} <a href="{{ .NextPage }}">next </a>
</div> </div>
<input id="loadmore" type="submit" value="load more" data-page="2"> <input id="loadmore" type="submit" value="load more" data-page="2">
{{ end }} {{ end }}
<script src="/_/static/utils.js?v=13"></script> <script src="/_/static/utils.js?v=14"></script>
{{ template "sidebar.html" . }} {{ template "sidebar.html" . }}
</main> </main>
{{ end }} {{ end }}

View file

@ -2,6 +2,8 @@
{{ range $i, $comment := .Comments }} {{ range $i, $comment := .Comments }}
{{ template "comment.html" $comment }} {{ template "comment.html" $comment }}
{{ end }} {{ end }}
{{ else if .Activities }}
{{ template "activities.html" . }}
{{ else }} {{ else }}
{{ range $post := .Posts }} {{ range $post := .Posts }}