From 15c50ef0df972b7899e975dc49e4cb9c08cebba0 Mon Sep 17 00:00:00 2001 From: Akshay Date: Wed, 6 Nov 2024 12:27:46 +0000 Subject: add support for 'more comments' --- src/geddit.js | 12 ++++++++++++ src/mixins/comment.pug | 7 ++++--- src/mixins/post.pug | 4 ++-- src/public/styles.css | 17 ++++++++++++++++- src/routes/index.js | 14 ++++++++++++++ src/views/comments.pug | 9 ++++----- src/views/single_comment_thread.pug | 21 +++++++++++++++++++++ 7 files changed, 73 insertions(+), 11 deletions(-) create mode 100644 src/views/single_comment_thread.pug (limited to 'src') diff --git a/src/geddit.js b/src/geddit.js index 3b090c6..3231b5e 100644 --- a/src/geddit.js +++ b/src/geddit.js @@ -347,6 +347,18 @@ class Geddit { .catch((err) => null); } + async getSingleCommentThread(parent_id, child_id, options = this.parameters) { + return await fetch( + `${this.host}/comments/${parent_id}/comment/${child_id}.json?${new URLSearchParams(options)}`, + ) + .then((res) => res.json()) + .then((json) => ({ + submission: json[0].data.children[0], + comments: json[1].data.children, + })) + .catch((err) => null); + } + async getSubredditComments(subreddit, options = this.parameters) { return await fetch( `${this.host}/r/${subreddit}/comments.json?${new URLSearchParams(options)}`, diff --git a/src/mixins/comment.pug b/src/mixins/comment.pug index 99231d8..f6d7b5e 100644 --- a/src/mixins/comment.pug +++ b/src/mixins/comment.pug @@ -17,13 +17,14 @@ mixin infoContainer(data) return data.replies && data.replies.data && data.replies.data.children && data.replies.data.children.length > 0; } -mixin comment(com, isfirst) +mixin comment(com, isfirst, parent_id) - var data = com.data - var hasReplyData = hasReplies(data) if com.kind == "more" div(class=`more ${isfirst ? 'first' : ''}`) - | #{data.count} more #{fmttxt(data.count, 'comment')} + a(href=`/comments/${parent_id}/comment/${data.id}`) + | #{data.count} more #{fmttxt(data.count, 'comment')} else div(class=`comment ${isfirst ? 'first' : ''}`) details(id=`${data.id}` open="") @@ -34,4 +35,4 @@ mixin comment(com, isfirst) if hasReplyData div.replies each reply in data.replies.data.children - +comment(reply, false) + +comment(reply, false, parent_id) diff --git a/src/mixins/post.pug b/src/mixins/post.pug index 43a3eb8..172da32 100644 --- a/src/mixins/post.pug +++ b/src/mixins/post.pug @@ -31,7 +31,7 @@ mixin post(p) else if p.post_hint == "hosted:video" - var url = p.secure_media.reddit_video.scrubber_media_url video(src=url data-dashjs-player width='100px' height='100px' onclick=`toggleDetails('${p.id}')`) - else if !p.selftext + else if p.post_hint == "link" a(href=p.url) | ↗ @@ -75,7 +75,7 @@ mixin post(p) - var url = p.secure_media.reddit_video.dash_url video(src=url controls data-dashjs-player loading="lazy").post-media button(onclick=`toggleDetails('${p.id}')`) close - else if !p.selftext + else if p.post_hint == "link" details(id=`${p.id}`) summary.expand-post expand link a(href=`${p.url}`) diff --git a/src/public/styles.css b/src/public/styles.css index 14f093b..ab33161 100644 --- a/src/public/styles.css +++ b/src/public/styles.css @@ -47,7 +47,8 @@ main { .sub-title a, .info-container a, .comment-info-container a, -.sort-opts a { +.sort-opts a, +.more a { text-decoration: none; } @@ -334,6 +335,10 @@ summary::before { color: var(--text-color); } +.more a { + color: var(--text-color-muted); +} + hr { border: none; border-top: 1px dashed var(--text-color-muted); @@ -366,12 +371,22 @@ p { margin-bottom: 0px; } +.self-text p { + margin-top: 10px; + margin-bottom: 10px; +} + .comment-body { text-align: left; display: block; padding-bottom: 8px; } +.comment-body img { + height: 200px; + width: auto; +} + summary.expand-post { display: none; } diff --git a/src/routes/index.js b/src/routes/index.js index 7fe9e2a..77ddd78 100644 --- a/src/routes/index.js +++ b/src/routes/index.js @@ -38,6 +38,20 @@ router.get("/comments/:id", async (req, res) => { res.render("comments", unescape_submission(response)); }); +// GET /comments/:parent_id/comment/:child_id +router.get("/comments/:parent_id/comment/:child_id", async (req, res) => { + const parent_id = req.params.parent_id; + const child_id = req.params.child_id; + + const params = { + limit: 50, + }; + response = await G.getSingleCommentThread(parent_id, child_id, params); + const comments = response.comments; + comments.forEach(unescape_comment); + res.render("single_comment_thread", { comments, parent_id }); +}); + // GET /subs router.get("/subs", async (req, res) => { res.render("subs"); diff --git a/src/views/comments.pug b/src/views/comments.pug index bfb0e35..a7dd396 100644 --- a/src/views/comments.pug +++ b/src/views/comments.pug @@ -49,17 +49,16 @@ html else if post.post_hint == 'hosted:video' - var url = post.secure_media.reddit_video.dash_url video(controls data-dashjs-player src=`${url}`).post-media - else if !post.selftext + else if post.post_hint == "link" a(href=post.url) | #{post.url} if post.selftext_html - p.self-text !{post.selftext_html} + div.self-text + != post.selftext_html hr div.comments-container each child in comments - +comment(child, true) - - script(src='https://unpkg.com/htmx.org@1.9.10') + +comment(child, true, post.id) diff --git a/src/views/single_comment_thread.pug b/src/views/single_comment_thread.pug new file mode 100644 index 0000000..cd652e6 --- /dev/null +++ b/src/views/single_comment_thread.pug @@ -0,0 +1,21 @@ +include ../mixins/comment +include ../mixins/header +include ../mixins/head +include ../utils + +doctype html +html + +head() + body + main#content + +header() + div.comments-container + a(href=`/comments/${parent_id}`) + | ← back to parent thread + if comments.length == 0 + div + p nothing to see here, this thread was shadow-banned? + else + each comment in comments + +comment(comment, true, parent_id) + -- cgit v1.2.3