devol
/
teddit-reddit-frontend-alternativa
mirror of https://codeberg.org/teddit/teddit
1
0
Fork 0
Code Issues Releases Wiki Activity

add a feature to the preferences where users can choose to collapse child comments automatically

This commit is contained in:
teddit 2021-03-16 18:07:27 +01:00
parent f33f0f9ffa
commit bd4bc75298
5 changed files with 50 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
app.js
View File

@ -131,6 +131,12 @@ const preferencesMiddleware = (req, res, next) => {
} }
} }
let collapseChildComments = req.query.collapse_child_comments
if(collapseChildComments) {
req.cookies.collapse_child_comments = collapseChildComments
res.cookie('collapse_child_comments', collapseChildComments, { maxAge: 31536000, httpOnly: true })
}
next() next()
} }

11
inc/compilePostComments.js
View File

@ -1,5 +1,5 @@
module.exports = function() { module.exports = function() {
this.compilePostCommentsHtml = (comments, next_comment, post_id, post_url, morechildren_ids, post_author, viewing_comment) => { this.compilePostCommentsHtml = (comments, next_comment, post_id, post_url, morechildren_ids, post_author, viewing_comment, user_preferences) => {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
(async () => { (async () => {
let comments_html let comments_html
@ -10,6 +10,9 @@ module.exports = function() {
else else
return `<a href="/u/${comment.author}" class="${classes}">${comment.author}</a>${submitter || ''}${moderator || ''}` return `<a href="/u/${comment.author}" class="${classes}">${comment.author}</a>${submitter || ''}${moderator || ''}`
} }
if(!user_preferences)
user_preferences = {}
if(comments.author !== undefined && comments.body_html !== undefined) { if(comments.author !== undefined && comments.body_html !== undefined) {
let classlist = [] let classlist = []
@ -42,7 +45,7 @@ module.exports = function() {
} }
comments_html = ` comments_html = `
<div class="comment ${comments.depth % 2 === 0 ? 'even-depth' : 'odd-depth'}" id="${comments.id}"> <div class="comment ${comments.depth % 2 === 0 ? 'even-depth' : 'odd-depth'}" id="${comments.id}">
<details open> <details ${user_preferences.collapse_child_comments === 'true' && comments.depth > 0 ? '' : 'open'}>
<summary> <summary>
<p class="author">${commentAuthor(comments, classlist, submitter && submitter_link, moderator && moderator_badge)}</p> <p class="author">${commentAuthor(comments, classlist, submitter && submitter_link, moderator && moderator_badge)}</p>
<p class="ups">${ups}</p> <p class="ups">${ups}</p>
@ -138,7 +141,7 @@ module.exports = function() {
} }
comments_html += ` comments_html += `
<div class="comment ${comment.depth % 2 === 0 ? 'even-depth' : 'odd-depth'}" id="${comment.id}"> <div class="comment ${comment.depth % 2 === 0 ? 'even-depth' : 'odd-depth'}" id="${comment.id}">
<details open> <details ${user_preferences.collapse_child_comments === 'true' && comments.depth === 0 ? '' : 'open'}>
<summary> <summary>
<p class="author">${commentAuthor(comment, classlist, submitter && submitter_link, moderator && moderator_badge)}</p> <p class="author">${commentAuthor(comment, classlist, submitter && submitter_link, moderator && moderator_badge)}</p>
<p class="ups">${ups}</p> <p class="ups">${ups}</p>
@ -164,7 +167,7 @@ module.exports = function() {
if(comment.replies[j+1]) { if(comment.replies[j+1]) {
next_reply = comment.replies[j+1] next_reply = comment.replies[j+1]
} }
replies_html += await compilePostCommentsHtml(comment.replies[j], next_reply, post_id, post_url, null, post_author, viewing_comment) replies_html += await compilePostCommentsHtml(comment.replies[j], next_reply, post_id, post_url, null, post_author, viewing_comment, user_preferences)
} }
} }
} }

4
inc/processJsonPost.js
View File

@ -198,7 +198,7 @@ module.exports = function(fetch) {
}) })
} }
this.finalizeJsonPost = async (processed_json, post_id, post_url, morechildren_ids, viewing_comment) => { this.finalizeJsonPost = async (processed_json, post_id, post_url, morechildren_ids, viewing_comment, user_preferences) => {
let comments_html = `<div class="comments">` let comments_html = `<div class="comments">`
let comments = processed_json.comments let comments = processed_json.comments
for(var i = 0; i < comments.length; i++) { for(var i = 0; i < comments.length; i++) {
@ -206,7 +206,7 @@ module.exports = function(fetch) {
if(comments[i+1]) { if(comments[i+1]) {
next_comment = comments[i+1] next_comment = comments[i+1]
} }
comments_html += await compilePostCommentsHtml(comments[i], next_comment, post_id, post_url, morechildren_ids, processed_json.author, viewing_comment) comments_html += await compilePostCommentsHtml(comments[i], next_comment, post_id, post_url, morechildren_ids, processed_json.author, viewing_comment, user_preferences)
} }
comments_html += `</div>` comments_html += `</div>`

50
routes.js
View File

@ -133,7 +133,7 @@ module.exports = (app, redis, fetch, RedditAPI) => {
} }
if(json) { if(json) {
json = JSON.parse(json) json = JSON.parse(json)
if(fetched === 'true' || redis_key.includes('/comments/')) if(fetched === 'true' || redis_key.includes('/comments/'))
json = json[0] json = json[0]
let post_to_save = false let post_to_save = false
@ -235,7 +235,7 @@ module.exports = (app, redis, fetch, RedditAPI) => {
return res.redirect(back) return res.redirect(back)
} }
}) })
} else { } else {
return res.redirect(`/saved`) return res.redirect(`/saved`)
} }
} else { } else {
@ -264,7 +264,7 @@ module.exports = (app, redis, fetch, RedditAPI) => {
d = `&before=${before}` d = `&before=${before}`
} }
if(nsfw !== 'on') { if(nsfw !== 'on') {
nsfw = 'off' nsfw = 'off'
} }
@ -361,7 +361,7 @@ module.exports = (app, redis, fetch, RedditAPI) => {
}) })
} else { } else {
if(result.status === 404) { if(result.status === 404) {
console.log('404 – Subreddits not found') console.log('404 – Subreddits not found')
} else { } else {
console.error(`Something went wrong while fetching data from Reddit. ${result.status} – ${result.statusText}`) console.error(`Something went wrong while fetching data from Reddit. ${result.status} – ${result.statusText}`)
console.error(config.reddit_api_error_text) console.error(config.reddit_api_error_text)
@ -486,11 +486,11 @@ module.exports = (app, redis, fetch, RedditAPI) => {
if(!before) { if(!before) {
before = '' before = ''
} }
if(restrict_sr !== 'on') { if(restrict_sr !== 'on') {
restrict_sr = 'off' restrict_sr = 'off'
} }
if(nsfw !== 'on') { if(nsfw !== 'on') {
nsfw = 'off' nsfw = 'off'
} }
let d = `&after=${after}` let d = `&after=${after}`
@ -561,7 +561,7 @@ module.exports = (app, redis, fetch, RedditAPI) => {
if(json) { if(json) {
console.log('Got frontpage key from redis.'); console.log('Got frontpage key from redis.');
(async () => { (async () => {
if(api_req) { if(api_req) {
return handleTedditApiSubreddit(json, req, res, 'redis', api_type, api_target, '/') return handleTedditApiSubreddit(json, req, res, 'redis', api_type, api_target, '/')
} else { } else {
let processed_json = await processJsonSubreddit(json, 'redis', null, req.cookies) let processed_json = await processJsonSubreddit(json, 'redis', null, req.cookies)
@ -599,7 +599,7 @@ module.exports = (app, redis, fetch, RedditAPI) => {
} else { } else {
console.log('Fetched the frontpage from Reddit.'); console.log('Fetched the frontpage from Reddit.');
(async () => { (async () => {
if(api_req) { if(api_req) {
return handleTedditApiSubreddit(json, req, res, 'from_online', api_type, api_target, '/') return handleTedditApiSubreddit(json, req, res, 'from_online', api_type, api_target, '/')
} else { } else {
let processed_json = await processJsonSubreddit(json, 'from_online', null, req.cookies) let processed_json = await processJsonSubreddit(json, 'from_online', null, req.cookies)
@ -736,11 +736,11 @@ module.exports = (app, redis, fetch, RedditAPI) => {
d = `&before=${before}` d = `&before=${before}`
} }
if(restrict_sr !== 'on') { if(restrict_sr !== 'on') {
restrict_sr = 'off' restrict_sr = 'off'
} }
if(nsfw !== 'on') { if(nsfw !== 'on') {
nsfw = 'off' nsfw = 'off'
} }
@ -864,7 +864,7 @@ module.exports = (app, redis, fetch, RedditAPI) => {
}) })
} else { } else {
if(result.status === 404) { if(result.status === 404) {
console.log('404 – Subreddit wiki not found') console.log('404 – Subreddit wiki not found')
} else { } else {
console.error(`Something went wrong while fetching data from Reddit. ${result.status} – ${result.statusText}`) console.error(`Something went wrong while fetching data from Reddit. ${result.status} – ${result.statusText}`)
console.error(config.reddit_api_error_text) console.error(config.reddit_api_error_text)
@ -922,7 +922,7 @@ module.exports = (app, redis, fetch, RedditAPI) => {
}) })
} else { } else {
if(result.status === 404) { if(result.status === 404) {
console.log('404 – Subreddit not found') console.log('404 – Subreddit not found')
} else { } else {
console.error(`Something went wrong while fetching data from Reddit. ${result.status} – ${result.statusText}`) console.error(`Something went wrong while fetching data from Reddit. ${result.status} – ${result.statusText}`)
console.error(config.reddit_api_error_text) console.error(config.reddit_api_error_text)
@ -991,7 +991,7 @@ module.exports = (app, redis, fetch, RedditAPI) => {
if(json) { if(json) {
console.log(`Got /r/${subreddit} key from redis.`); console.log(`Got /r/${subreddit} key from redis.`);
(async () => { (async () => {
if(api_req) { if(api_req) {
return handleTedditApiSubreddit(json, req, res, 'redis', api_type, api_target, subreddit) return handleTedditApiSubreddit(json, req, res, 'redis', api_type, api_target, subreddit)
} else { } else {
let processed_json = await processJsonSubreddit(json, 'redis', null, req.cookies) let processed_json = await processJsonSubreddit(json, 'redis', null, req.cookies)
@ -1038,7 +1038,7 @@ module.exports = (app, redis, fetch, RedditAPI) => {
} else { } else {
console.log(`Fetched the JSON from reddit.com/r/${subreddit}.`); console.log(`Fetched the JSON from reddit.com/r/${subreddit}.`);
(async () => { (async () => {
if(api_req) { if(api_req) {
return handleTedditApiSubreddit(json, req, res, 'from_online', api_type, api_target, subreddit) return handleTedditApiSubreddit(json, req, res, 'from_online', api_type, api_target, subreddit)
} else { } else {
let processed_json = await processJsonSubreddit(json, 'from_online', null, req.cookies) let processed_json = await processJsonSubreddit(json, 'from_online', null, req.cookies)
@ -1063,7 +1063,7 @@ module.exports = (app, redis, fetch, RedditAPI) => {
}) })
} else { } else {
if(result.status === 404) { if(result.status === 404) {
console.log('404 – Subreddit not found') console.log('404 – Subreddit not found')
} else { } else {
console.error(`Something went wrong while fetching data from Reddit. ${result.status} – ${result.statusText}`) console.error(`Something went wrong while fetching data from Reddit. ${result.status} – ${result.statusText}`)
console.error(config.reddit_api_error_text) console.error(config.reddit_api_error_text)
@ -1119,7 +1119,7 @@ module.exports = (app, redis, fetch, RedditAPI) => {
(async () => { (async () => {
if(!more_comments_cursor) { if(!more_comments_cursor) {
let processed_json = await processJsonPost(json, false, req.cookies) let processed_json = await processJsonPost(json, false, req.cookies)
let finalized_json = await finalizeJsonPost(processed_json, id, post_url, null, viewing_comment) let finalized_json = await finalizeJsonPost(processed_json, id, post_url, null, viewing_comment, req.cookies)
return res.render('post', { return res.render('post', {
post: finalized_json.post_data, post: finalized_json.post_data,
comments: finalized_json.comments, comments: finalized_json.comments,
@ -1215,7 +1215,7 @@ module.exports = (app, redis, fetch, RedditAPI) => {
}) })
} else { } else {
if(result.status === 404) { if(result.status === 404) {
console.log('404 – Post not found') console.log('404 – Post not found')
} else { } else {
console.error(`Something went wrong while fetching data from Reddit. ${result.status} – ${result.statusText}`) console.error(`Something went wrong while fetching data from Reddit. ${result.status} – ${result.statusText}`)
console.error(config.reddit_api_error_text) console.error(config.reddit_api_error_text)
@ -1483,7 +1483,7 @@ module.exports = (app, redis, fetch, RedditAPI) => {
if(json) { if(json) {
console.log(`Got /u/${user} custom_feed key from redis.`); console.log(`Got /u/${user} custom_feed key from redis.`);
(async () => { (async () => {
if(api_req) { if(api_req) {
return handleTedditApiSubreddit(json, req, res, 'redis', api_type, api_target, subreddit) return handleTedditApiSubreddit(json, req, res, 'redis', api_type, api_target, subreddit)
} else { } else {
let processed_json = await processJsonSubreddit(json, 'redis', null, req.cookies) let processed_json = await processJsonSubreddit(json, 'redis', null, req.cookies)
@ -1529,7 +1529,7 @@ module.exports = (app, redis, fetch, RedditAPI) => {
} else { } else {
console.log(`Fetched the JSON from reddit.com/r/${subreddit}.`); console.log(`Fetched the JSON from reddit.com/r/${subreddit}.`);
(async () => { (async () => {
if(api_req) { if(api_req) {
return handleTedditApiSubreddit(json, req, res, 'from_online', api_type, api_target, subreddit) return handleTedditApiSubreddit(json, req, res, 'from_online', api_type, api_target, subreddit)
} else { } else {
let processed_json = await processJsonSubreddit(json, 'from_online', null, req.cookies) let processed_json = await processJsonSubreddit(json, 'from_online', null, req.cookies)
@ -1553,7 +1553,7 @@ module.exports = (app, redis, fetch, RedditAPI) => {
}) })
} else { } else {
if(result.status === 404) { if(result.status === 404) {
console.log('404 – Subreddit not found') console.log('404 – Subreddit not found')
} else { } else {
console.error(`Something went wrong while fetching data from Reddit. ${result.status} – ${result.statusText}`) console.error(`Something went wrong while fetching data from Reddit. ${result.status} – ${result.statusText}`)
console.error(config.reddit_api_error_text) console.error(config.reddit_api_error_text)
@ -1581,6 +1581,7 @@ module.exports = (app, redis, fetch, RedditAPI) => {
let nsfw_enabled = req.body.nsfw_enabled let nsfw_enabled = req.body.nsfw_enabled
let highlight_controversial = req.body.highlight_controversial let highlight_controversial = req.body.highlight_controversial
let post_media_max_height = req.body.post_media_max_height let post_media_max_height = req.body.post_media_max_height
let collapse_child_comments = req.body.collapse_child_comments
res.cookie('theme', theme, { maxAge: 365 * 24 * 60 * 60 * 1000, httpOnly: true }) res.cookie('theme', theme, { maxAge: 365 * 24 * 60 * 60 * 1000, httpOnly: true })
@ -1604,7 +1605,13 @@ module.exports = (app, redis, fetch, RedditAPI) => {
if(config.post_media_max_heights.hasOwnProperty(post_media_max_height) || !isNaN(post_media_max_height)) if(config.post_media_max_heights.hasOwnProperty(post_media_max_height) || !isNaN(post_media_max_height))
res.cookie('post_media_max_height', post_media_max_height, { maxAge: 365 * 24 * 60 * 60 * 1000, httpOnly: true }) res.cookie('post_media_max_height', post_media_max_height, { maxAge: 365 * 24 * 60 * 60 * 1000, httpOnly: true })
if(collapse_child_comments === 'on')
collapse_child_comments = 'true'
else
collapse_child_comments = 'false'
res.cookie('collapse_child_comments', collapse_child_comments, { maxAge: 365 * 24 * 60 * 60 * 1000, httpOnly: true })
return res.redirect('/preferences') return res.redirect('/preferences')
}) })
@ -1708,3 +1715,4 @@ module.exports = (app, redis, fetch, RedditAPI) => {
} }
}) })
} }

6
views/preferences.pug
View File

@ -65,6 +65,12 @@ html
max_heights_html += `<option value="${key}" ${(user_key == key ? "selected" : "")}>${key}</option>` max_heights_html += `<option value="${key}" ${(user_key == key ? "selected" : "")}>${key}</option>`
} }
!= max_heights_html != max_heights_html
.setting
label(for="collapse_child_comments") Collapse child comments automatically:
if(user_preferences.collapse_child_comments == 'true')
input(type="checkbox", name="collapse_child_comments", id="collapse_child_comments", checked="checked")
else
input(type="checkbox", name="collapse_child_comments", id="collapse_child_comments")
legend Subscribed subreddits legend Subscribed subreddits
.setting .setting
details details