skorotkiewicz/rDrama
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Make the new comments counts more locally included instead of being included on all the pages

Browse source
This commit is contained in:
Yo Mama 2021-09-28 01:21:53 +02:00
parent e95bf16130
commit 53abdab5fc
6 changed files with 86 additions and 75 deletions
Download patch file Download diff file Expand all files Collapse all files

31
files/assets/js/default.js
View file

@ -150,34 +150,3 @@ function post_toast2(url, button1, button2) {
document.getElementById(button1).classList.toggle("d-none");
document.getElementById(button2).classList.toggle("d-none");
}
/**
* Cleans the expired entries (5 days). It runs every hour.
*/
function cleanCommentsCache() {
const LAST_CACHE_CLEAN_ID = "last-cache-clean"
const EXPIRE_INTERVAL_MILLIS = 5 * 24 * 60 * 60 * 1000
const CACHE_CLEAN_INTERVAL = 60 * 60 * 1000 // 1 hour
function cleanCache() {
const lastCacheClean = JSON.parse(localStorage.getItem(LAST_CACHE_CLEAN_ID)) || Date.now()
const now = Date.now()
if (now - lastCacheClean > CACHE_CLEAN_INTERVAL) {
const comments = JSON.parse(localStorage.getItem(COMMENT_COUNTS_ID)) || {}
for (let [key, value] of Object.entries(comments)) {
if (now - value.t > EXPIRE_INTERVAL_MILLIS) {
delete comments[key]
}
}
window.localStorage.setItem(COMMENT_COUNTS_ID, JSON.stringify(comments))
}
window.localStorage.setItem(LAST_CACHE_CLEAN_ID, JSON.stringify(now))
}
// So it does not slow the load of the main page with the clean up
setTimeout(cleanCache, 500)
}
cleanCommentsCache()

2
files/templates/comments.html
View file

@ -9,6 +9,8 @@
<script src="/assets/js/comments_admin.js"></script>
{% endif %}
{% include 'embeds/new_comments_count.html' %}
<script>
function collapse_comment(comment_id) {

44
files/templates/default.html
View file

@ -68,50 +68,6 @@
{% if v %}
<script src="https://js.pusher.com/beams/1.0/push-notifications-cdn.js"></script>
<script src="/assets/js/default.js"></script>
<script>
// New comment counts
// localstorage comment counts format: {"<postId>": {c: <totalComments>, t: <timestampUpdated>}}
const COMMENT_COUNTS_ID = "comment-counts"
/**
* Display the number of new comments present since the last time the post was opened
*/
function showNewCommentCounts(postId, newTotal) {
const comments = JSON.parse(localStorage.getItem(COMMENT_COUNTS_ID)) || {}
const lastCount = comments[postId]
if (lastCount) {
const newComments = newTotal - lastCount.c
if (newComments > 0) {
document.querySelectorAll(`#post-${postId} .new-comments`).forEach(elem => {
elem.textContent = ` (+${newComments})`
elem.classList.remove("d-none")
})
}
}
}
function incrementCommentCount(postId) {
saveCommentsCount(postId)
}
/**
* Saves the comment count to the localStorage
*
* @param postId The id of the post associated with the comments
* @param lastTotalComs The new amount, If null it will just increment the previous amount
*/
function saveCommentsCount(postId, lastTotalComs = null) {
const comments = JSON.parse(localStorage.getItem(COMMENT_COUNTS_ID)) || {}
const newTotal = lastTotalComs || ((comments[postId] || { c: 0 }).c + 1)
comments[postId] = { c: newTotal, t: Date.now() }
window.localStorage.setItem(COMMENT_COUNTS_ID, JSON.stringify(comments))
}
</script>
{% endif %}

80
files/templates/embeds/new_comments_count.html Normal file
View file

@ -0,0 +1,80 @@
<script>
// only allows the script to execute once
if (typeof showNewCommentCounts === 'undefined') {
// localstorage comment counts format: {"<postId>": {c: <totalComments>, t: <timestampUpdated>}}
const COMMENT_COUNTS_ID = "comment-counts"
/**
* Display the number of new comments present since the last time the post was opened
*/
function showNewCommentCounts(postId, newTotal) {
const comments = JSON.parse(localStorage.getItem(COMMENT_COUNTS_ID)) || {}
const lastCount = comments[postId]
if (lastCount) {
const newComments = newTotal - lastCount.c
if (newComments > 0) {
document.querySelectorAll(`#post-${postId} .new-comments`).forEach(elem => {
elem.textContent = ` (+${newComments})`
elem.classList.remove("d-none")
})
}
}
}
function incrementCommentCount(postId) {
saveCommentsCount(postId)
}
/**
* Saves the comment count to the localStorage
*
* @param postId The id of the post associated with the comments
* @param lastTotalComs The new amount, If null it will just increment the previous amount
*/
function saveCommentsCount(postId, lastTotalComs = null) {
const comments = JSON.parse(localStorage.getItem(COMMENT_COUNTS_ID)) || {}
const newTotal = lastTotalComs || ((comments[postId] || { c: 0 }).c + 1)
comments[postId] = { c: newTotal, t: Date.now() }
window.localStorage.setItem(COMMENT_COUNTS_ID, JSON.stringify(comments))
}
/**
* Cleans the expired entries (5 days). It runs every hour.
*/
function cleanCommentsCache() {
const LAST_CACHE_CLEAN_ID = "last-cache-clean"
const EXPIRE_INTERVAL_MILLIS = 5 * 24 * 60 * 60 * 1000
const CACHE_CLEAN_INTERVAL = 60 * 60 * 1000 // 1 hour
function cleanCache() {
const lastCacheClean = JSON.parse(localStorage.getItem(LAST_CACHE_CLEAN_ID)) || Date.now()
const now = Date.now()
if (now - lastCacheClean > CACHE_CLEAN_INTERVAL) {
const comments = JSON.parse(localStorage.getItem(COMMENT_COUNTS_ID)) || {}
for (let [key, value] of Object.entries(comments)) {
if (now - value.t > EXPIRE_INTERVAL_MILLIS) {
delete comments[key]
}
}
window.localStorage.setItem(COMMENT_COUNTS_ID, JSON.stringify(comments))
}
window.localStorage.setItem(LAST_CACHE_CLEAN_ID, JSON.stringify(now))
}
// So it does not slow the load of the main page with the clean up
setTimeout(cleanCache, 500)
}
cleanCommentsCache()
}
</script>

2
files/templates/submission.html
View file

@ -64,6 +64,8 @@
</script>
{% endif %}
{% include 'embeds/new_comments_count.html' %}
<meta charset="utf-8" />
<meta property="og:type" content="article" />

2
files/templates/submission_listing.html
View file

@ -15,6 +15,8 @@
});
</script>
{% include 'embeds/new_comments_count.html' %}
{% for p in listing %}
{% set ups=p.upvotes %}