diff options
-rw-r--r-- | src/geddit.js | 12 | ||||
-rw-r--r-- | src/mixins/comment.pug | 7 | ||||
-rw-r--r-- | src/mixins/post.pug | 4 | ||||
-rw-r--r-- | src/public/styles.css | 17 | ||||
-rw-r--r-- | src/routes/index.js | 14 | ||||
-rw-r--r-- | src/views/comments.pug | 9 | ||||
-rw-r--r-- | src/views/single_comment_thread.pug | 21 |
7 files changed, 73 insertions, 11 deletions
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 { | |||
347 | .catch((err) => null); | 347 | .catch((err) => null); |
348 | } | 348 | } |
349 | 349 | ||
350 | async getSingleCommentThread(parent_id, child_id, options = this.parameters) { | ||
351 | return await fetch( | ||
352 | `${this.host}/comments/${parent_id}/comment/${child_id}.json?${new URLSearchParams(options)}`, | ||
353 | ) | ||
354 | .then((res) => res.json()) | ||
355 | .then((json) => ({ | ||
356 | submission: json[0].data.children[0], | ||
357 | comments: json[1].data.children, | ||
358 | })) | ||
359 | .catch((err) => null); | ||
360 | } | ||
361 | |||
350 | async getSubredditComments(subreddit, options = this.parameters) { | 362 | async getSubredditComments(subreddit, options = this.parameters) { |
351 | return await fetch( | 363 | return await fetch( |
352 | `${this.host}/r/${subreddit}/comments.json?${new URLSearchParams(options)}`, | 364 | `${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) | |||
17 | return data.replies && data.replies.data && data.replies.data.children && data.replies.data.children.length > 0; | 17 | return data.replies && data.replies.data && data.replies.data.children && data.replies.data.children.length > 0; |
18 | } | 18 | } |
19 | 19 | ||
20 | mixin comment(com, isfirst) | 20 | mixin comment(com, isfirst, parent_id) |
21 | - var data = com.data | 21 | - var data = com.data |
22 | - var hasReplyData = hasReplies(data) | 22 | - var hasReplyData = hasReplies(data) |
23 | 23 | ||
24 | if com.kind == "more" | 24 | if com.kind == "more" |
25 | div(class=`more ${isfirst ? 'first' : ''}`) | 25 | div(class=`more ${isfirst ? 'first' : ''}`) |
26 | | #{data.count} more #{fmttxt(data.count, 'comment')} | 26 | a(href=`/comments/${parent_id}/comment/${data.id}`) |
27 | | #{data.count} more #{fmttxt(data.count, 'comment')} | ||
27 | else | 28 | else |
28 | div(class=`comment ${isfirst ? 'first' : ''}`) | 29 | div(class=`comment ${isfirst ? 'first' : ''}`) |
29 | details(id=`${data.id}` open="") | 30 | details(id=`${data.id}` open="") |
@@ -34,4 +35,4 @@ mixin comment(com, isfirst) | |||
34 | if hasReplyData | 35 | if hasReplyData |
35 | div.replies | 36 | div.replies |
36 | each reply in data.replies.data.children | 37 | each reply in data.replies.data.children |
37 | +comment(reply, false) | 38 | +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) | |||
31 | else if p.post_hint == "hosted:video" | 31 | else if p.post_hint == "hosted:video" |
32 | - var url = p.secure_media.reddit_video.scrubber_media_url | 32 | - var url = p.secure_media.reddit_video.scrubber_media_url |
33 | video(src=url data-dashjs-player width='100px' height='100px' onclick=`toggleDetails('${p.id}')`) | 33 | video(src=url data-dashjs-player width='100px' height='100px' onclick=`toggleDetails('${p.id}')`) |
34 | else if !p.selftext | 34 | else if p.post_hint == "link" |
35 | a(href=p.url) | 35 | a(href=p.url) |
36 | | ↗ | 36 | | ↗ |
37 | 37 | ||
@@ -75,7 +75,7 @@ mixin post(p) | |||
75 | - var url = p.secure_media.reddit_video.dash_url | 75 | - var url = p.secure_media.reddit_video.dash_url |
76 | video(src=url controls data-dashjs-player loading="lazy").post-media | 76 | video(src=url controls data-dashjs-player loading="lazy").post-media |
77 | button(onclick=`toggleDetails('${p.id}')`) close | 77 | button(onclick=`toggleDetails('${p.id}')`) close |
78 | else if !p.selftext | 78 | else if p.post_hint == "link" |
79 | details(id=`${p.id}`) | 79 | details(id=`${p.id}`) |
80 | summary.expand-post expand link | 80 | summary.expand-post expand link |
81 | a(href=`${p.url}`) | 81 | 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 { | |||
47 | .sub-title a, | 47 | .sub-title a, |
48 | .info-container a, | 48 | .info-container a, |
49 | .comment-info-container a, | 49 | .comment-info-container a, |
50 | .sort-opts a { | 50 | .sort-opts a, |
51 | .more a { | ||
51 | text-decoration: none; | 52 | text-decoration: none; |
52 | } | 53 | } |
53 | 54 | ||
@@ -334,6 +335,10 @@ summary::before { | |||
334 | color: var(--text-color); | 335 | color: var(--text-color); |
335 | } | 336 | } |
336 | 337 | ||
338 | .more a { | ||
339 | color: var(--text-color-muted); | ||
340 | } | ||
341 | |||
337 | hr { | 342 | hr { |
338 | border: none; | 343 | border: none; |
339 | border-top: 1px dashed var(--text-color-muted); | 344 | border-top: 1px dashed var(--text-color-muted); |
@@ -366,12 +371,22 @@ p { | |||
366 | margin-bottom: 0px; | 371 | margin-bottom: 0px; |
367 | } | 372 | } |
368 | 373 | ||
374 | .self-text p { | ||
375 | margin-top: 10px; | ||
376 | margin-bottom: 10px; | ||
377 | } | ||
378 | |||
369 | .comment-body { | 379 | .comment-body { |
370 | text-align: left; | 380 | text-align: left; |
371 | display: block; | 381 | display: block; |
372 | padding-bottom: 8px; | 382 | padding-bottom: 8px; |
373 | } | 383 | } |
374 | 384 | ||
385 | .comment-body img { | ||
386 | height: 200px; | ||
387 | width: auto; | ||
388 | } | ||
389 | |||
375 | summary.expand-post { | 390 | summary.expand-post { |
376 | display: none; | 391 | display: none; |
377 | } | 392 | } |
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) => { | |||
38 | res.render("comments", unescape_submission(response)); | 38 | res.render("comments", unescape_submission(response)); |
39 | }); | 39 | }); |
40 | 40 | ||
41 | // GET /comments/:parent_id/comment/:child_id | ||
42 | router.get("/comments/:parent_id/comment/:child_id", async (req, res) => { | ||
43 | const parent_id = req.params.parent_id; | ||
44 | const child_id = req.params.child_id; | ||
45 | |||
46 | const params = { | ||
47 | limit: 50, | ||
48 | }; | ||
49 | response = await G.getSingleCommentThread(parent_id, child_id, params); | ||
50 | const comments = response.comments; | ||
51 | comments.forEach(unescape_comment); | ||
52 | res.render("single_comment_thread", { comments, parent_id }); | ||
53 | }); | ||
54 | |||
41 | // GET /subs | 55 | // GET /subs |
42 | router.get("/subs", async (req, res) => { | 56 | router.get("/subs", async (req, res) => { |
43 | res.render("subs"); | 57 | 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 | |||
49 | else if post.post_hint == 'hosted:video' | 49 | else if post.post_hint == 'hosted:video' |
50 | - var url = post.secure_media.reddit_video.dash_url | 50 | - var url = post.secure_media.reddit_video.dash_url |
51 | video(controls data-dashjs-player src=`${url}`).post-media | 51 | video(controls data-dashjs-player src=`${url}`).post-media |
52 | else if !post.selftext | 52 | else if post.post_hint == "link" |
53 | a(href=post.url) | 53 | a(href=post.url) |
54 | | #{post.url} | 54 | | #{post.url} |
55 | 55 | ||
56 | if post.selftext_html | 56 | if post.selftext_html |
57 | p.self-text !{post.selftext_html} | 57 | div.self-text |
58 | != post.selftext_html | ||
58 | 59 | ||
59 | hr | 60 | hr |
60 | 61 | ||
61 | div.comments-container | 62 | div.comments-container |
62 | each child in comments | 63 | each child in comments |
63 | +comment(child, true) | 64 | +comment(child, true, post.id) |
64 | |||
65 | script(src='https://unpkg.com/[email protected]') | ||
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 @@ | |||
1 | include ../mixins/comment | ||
2 | include ../mixins/header | ||
3 | include ../mixins/head | ||
4 | include ../utils | ||
5 | |||
6 | doctype html | ||
7 | html | ||
8 | +head() | ||
9 | body | ||
10 | main#content | ||
11 | +header() | ||
12 | div.comments-container | ||
13 | a(href=`/comments/${parent_id}`) | ||
14 | | ← back to parent thread | ||
15 | if comments.length == 0 | ||
16 | div | ||
17 | p nothing to see here, this thread was shadow-banned? | ||
18 | else | ||
19 | each comment in comments | ||
20 | +comment(comment, true, parent_id) | ||
21 | |||