Applications/comfychan
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases 3 Activity

Implement reply rich rendering. Add jump to and highlight/hovering functionality for them

Browse Source
This commit is contained in:
Dominic Ferrando
2025-04-19 01:49:43 -04:00
parent f881d7df0a
commit 39c5b41657
6 changed files with 151 additions and 54 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/views/shared/layout.templ
+1
View File
@@ -8,6 +8,7 @@ templ Layout() {
<title>Comfychan</title>
<script src="https://unpkg.com/htmx.org@2.0.4"></script>
<script src="https://unpkg.com/hyperscript.org@0.9.14"></script>
<script src="/static/index.js" defer></script>
<link rel="stylesheet" href="/static/reset.css"/>
<link rel="stylesheet" href="/static/index.css"/>
</head>
web/views/thread.templ
+37 -33
View File
@@ -8,24 +8,44 @@ import (
"strconv"
)
func getPostClass(isOp bool) string {
if isOp {
return "post-op"
}
return "post"
}
templ ThreadPost(post database.Post, thread *database.Thread) {
{{ isOp := thread != nil }}
<article id={ fmt.Sprintf("post-%d", post.Id) } class={ getPostClass(isOp) }>
if post.MediaPath != "" {
<div class="post-img-container">
<img src={ fmt.Sprintf("/static/img/posts/%s", post.MediaPath) } class="post-img"/>
</div>
}
<header class="post-header">
if isOp && thread.Subject != "" {
<h1 class="thread-subject">{ thread.Subject } -</h1>
}
<span class="post-author">{ post.Author }</span>
<span class="post-date">{ post.CreatedAt.Format("01/02/2006") }</span>
<span class="post-time">{ post.CreatedAt.Format("15:04") }</span>
<span
_={ fmt.Sprintf("on click set #newPostBody.value to #newPostBody.value + '>>%d\n'", post.Id) }
class=" post-num"
>
No. { strconv.Itoa(post.Id) }
</span>
</header>
<p>
@templ.Raw(util.EnrichPost(post.Body))
</p>
</article>
}
templ ThreadPosts(posts []database.Post) {
for _, post := range (posts) {
<article class="post">
if post.MediaPath != "" {
<div class="post-img-container">
<img src={ fmt.Sprintf("/static/img/posts/%s", post.MediaPath) } class="post-img"/>
</div>
}
<header class="post-header">
<span class="post-author">{ post.Author }</span>
<span class="post-date">{ post.CreatedAt.Format("01/02/2006") }</span>
<span class="post-time">{ post.CreatedAt.Format("15:04") }</span>
<span class="post-num">No. { strconv.Itoa(post.Id) }</span>
</header>
<p>
@templ.Raw(util.EnrichPost(post.Body))
</p>
</article>
@ThreadPost(post, nil)
<br/>
}
}
@@ -61,23 +81,7 @@ templ Thread(board database.Board, thread database.Thread, posts []database.Post
</form>
</div>
<div class="thread">
<article class="op-post">
if posts[0].MediaPath != "" {
<div class="post-img-container">
<img src={ fmt.Sprintf("/static/img/posts/%s", posts[0].MediaPath) } class="post-img"/>
</div>
}
<header class="post-header">
<h1 class="thread-subject">{ thread.Subject } -</h1>
<span class="post-author">{ posts[0].Author }</span>
<span class="post-date">{ posts[0].CreatedAt.Format("01/02/2006") }</span>
<span class="post-time">{ posts[0].CreatedAt.Format("15:04") }</span>
<span class="post-num">No. { strconv.Itoa(posts[0].Id) }</span>
</header>
<p class="post-body">
@templ.Raw(util.EnrichPost(posts[0].Body))
</p>
</article>
@ThreadPost(posts[0], &thread)
<div hx-get={ fmt.Sprintf("/hx/%s/threads/%d/posts", board.Slug, thread.Id) } hx-trigger="refreshPosts from:body">
@ThreadPosts(posts[1:])
</div>
web/views/threads.templ
+2 -2
View File
@@ -14,10 +14,10 @@ templ ThreadsCatalog(previews []CatalogThreadPreview) {
<div id="catalog">
for _, preview := range previews {
<div class="catalog-preview">
<a href={ templ.SafeURL(preview.ThreadURL) }>
<a href={ templ.URL(preview.ThreadURL) }>
<img class="catalog-preview-img" src={ fmt.Sprintf("/static/img/posts/%s", preview.MediaPath) }/>
</a>
<h1><a href={ templ.SafeURL(preview.ThreadURL) } class="catalog-preview-link">{ preview.Subject }</a></h1>
<h1><a href={ templ.URL(preview.ThreadURL) } class="catalog-preview-link">{ preview.Subject }</a></h1>
<p>
@templ.Raw(util.EnrichPost(preview.Body))
</p>