Threaded comments

This commit is contained in:
Eduard Urbach 2018-11-05 19:05:36 +09:00
parent e74253df96
commit 08497f0c37
13 changed files with 109 additions and 217 deletions

View File

@ -5,7 +5,7 @@ component Comments(parent arn.PostParent, user *arn.User)
p.no-data.mountable No comments have been written yet.
else
each post in parent.Posts()
Postable(post, user, "", "")
Postable(post, user, true, "", "")
if user != nil
if arn.IsLocked(parent)

View File

@ -1,6 +1,7 @@
component NewPostArea(user *arn.User, placeholder string)
.post.mountable
.post-author
Avatar(user)
textarea#new-post.post-content(placeholder=placeholder + "...", aria-label=placeholder)
.post-parent
.post-author
Avatar(user)
textarea#new-post.post-content(placeholder=placeholder + "...", aria-label=placeholder)

View File

@ -1,55 +1,64 @@
component Postable(post arn.Postable, user *arn.User, headerContent string, highlightAuthorID string)
.post.mountable(id=strings.ToLower(post.Type()) + "-" + fmt.Sprint(post.GetID()), data-highlight=post.Creator().ID == highlightAuthorID, data-pro=post.Creator().IsPro(), data-api="/api/" + strings.ToLower(post.Type()) + "/" + post.GetID())
.post-author
Avatar(post.Creator())
component Postable(post arn.Postable, user *arn.User, includeReplies bool, headerContent string, highlightAuthorID string)
.post.mountable(id=strings.ToLower(post.Type()) + "-" + fmt.Sprint(post.GetID()), data-pro=post.Creator().IsPro(), data-api="/api/" + strings.ToLower(post.Type()) + "/" + post.GetID())
.post-parent
.post-author
Avatar(post.Creator())
.post-content
if headerContent != ""
div!= headerContent
div(id="render-" + post.GetID())!= post.HTML()
if user != nil && user.ID == post.Creator().ID
.post-edit-interface
if post.Type() == "Thread"
input.post-title-input.hidden(id="title-" + post.GetID(), value=post.TitleByUser(user), type="text", placeholder="Thread title")
textarea.post-text-input.hidden(id="source-" + post.GetID())= post.GetText()
.buttons.hidden(id="edit-toolbar-" + post.GetID())
a.button.post-save.action(data-action="savePost", data-trigger="click", data-id=post.GetID())
Icon("save")
span Save
a.button.post-cancel-edit.action(data-action="editPost", data-trigger="click", data-id=post.GetID())
Icon("close")
span Cancel
.post-date.utc-date.no-tip(data-date=post.GetCreated())
.post-toolbar(id="toolbar-" + post.GetID())
.spacer
.post-likes.tip(id="likes-" + post.GetID(), aria-label=stringutils.Plural(post.CountLikes(), "like"))= "+" + strconv.Itoa(post.CountLikes())
if user != nil
if user.ID != post.Creator().ID
if post.LikedBy(user.ID)
a.post-tool.post-unlike.tip.action(id="unlike-" + post.GetID(), aria-label="Unlike", data-action="unlike", data-trigger="click")
Icon("thumbs-down")
else
a.post-tool.post-like.tip.action(id="like-" + post.GetID(), aria-label="Like", data-action="like", data-trigger="click")
Icon("thumbs-up")
if user.Role == "admin"
a.post-tool.post-edit.tip(href=post.Link() + "/edit", aria-label="Edit")
Icon("edit")
if user.ID == post.Creator().ID
a.post-tool.post-edit.tip.action(data-action="editPost", data-trigger="click", data-id=post.GetID(), aria-label="Edit")
Icon("pencil")
if post.Type() != "Thread"
if user != nil && (user.Role == "admin" || user.Role == "editor")
a.post-tool.post-delete.tip.action(data-action="deletePost", data-trigger="click", data-id=post.GetID(), aria-label="Delete")
Icon("trash")
.post-content(data-highlight=post.Creator().ID == highlightAuthorID)
if headerContent != ""
div!= headerContent
a.post-tool.post-permalink.tip(href=post.Link(), aria-label="Link")
Icon("link")
div(id="render-" + post.GetID())!= post.HTML()
if user != nil && user.ID == post.Creator().ID
.post-edit-interface
if post.Type() == "Thread"
input.post-title-input.hidden(id="title-" + post.GetID(), value=post.TitleByUser(user), type="text", placeholder="Thread title")
textarea.post-text-input.hidden(id="source-" + post.GetID())= post.GetText()
.buttons.hidden(id="edit-toolbar-" + post.GetID())
a.button.post-save.action(data-action="savePost", data-trigger="click", data-id=post.GetID())
Icon("save")
span Save
a.button.post-cancel-edit.action(data-action="editPost", data-trigger="click", data-id=post.GetID())
Icon("close")
span Cancel
.post-date.utc-date.no-tip(data-date=post.GetCreated())
.post-toolbar(id="toolbar-" + post.GetID())
.spacer
.post-likes.tip(id="likes-" + post.GetID(), aria-label=stringutils.Plural(post.CountLikes(), "like"))= "+" + strconv.Itoa(post.CountLikes())
if user != nil
if user.ID != post.Creator().ID
if post.LikedBy(user.ID)
a.post-tool.post-unlike.tip.action(id="unlike-" + post.GetID(), aria-label="Unlike", data-action="unlike", data-trigger="click")
Icon("thumbs-down")
else
a.post-tool.post-like.tip.action(id="like-" + post.GetID(), aria-label="Like", data-action="like", data-trigger="click")
Icon("thumbs-up")
//- if user.Role == "admin"
//- a.post-tool.post-edit.tip(href=post.Link() + "/edit", aria-label="Edit")
//- Icon("edit")
a.post-tool.post-reply.tip.action(id="reply-" + post.GetID(), aria-label="Reply", data-action="reply", data-trigger="click")
Icon("reply")
if user.ID == post.Creator().ID
a.post-tool.post-edit.tip.action(data-action="editPost", data-trigger="click", data-id=post.GetID(), aria-label="Edit")
Icon("pencil")
if post.Type() != "Thread"
if user != nil && (user.Role == "admin" || user.Role == "editor")
a.post-tool.post-delete.tip.action(data-action="deletePost", data-trigger="click", data-id=post.GetID(), aria-label="Delete")
Icon("trash")
a.post-tool.post-permalink.tip(href=post.Link(), aria-label="Link")
Icon("link")
.replies
if includeReplies
each reply in post.Posts()
Postable(reply, user, true, "", highlightAuthorID)

View File

@ -2,4 +2,4 @@ component PostableList(postables []arn.Postable, user *arn.User)
.thread
.posts
each post in postables
Postable(post, user, "", "")
Postable(post, user, false, "", "")

View File

@ -8,6 +8,6 @@ component ActivityFeed(entries []*arn.EditLogEntry, user *arn.User)
component ActivityPost(post arn.Postable, user *arn.User)
if post.Parent() != nil
Postable(post, user, fmt.Sprintf(`<p class="activity-header"><a href="%s">%s</a></p>`, post.Parent().Link(), html.EscapeString(post.Parent().TitleByUser(user))), "")
Postable(post, user, false, fmt.Sprintf(`<p class="activity-header"><a href="%s">%s</a></p>`, post.Parent().Link(), html.EscapeString(post.Parent().TitleByUser(user))), "")
else
Postable(post, user, fmt.Sprintf(`<p class="activity-header"><a href="%s">%s</a></p>`, post.Link(), html.EscapeString(post.TitleByUser(user))), "")
Postable(post, user, false, fmt.Sprintf(`<p class="activity-header"><a href="%s">%s</a></p>`, post.Link(), html.EscapeString(post.TitleByUser(user))), "")

13
pages/post/newpostarea.go Normal file
View File

@ -0,0 +1,13 @@
package post
import (
"github.com/aerogo/aero"
"github.com/animenotifier/notify.moe/components"
"github.com/animenotifier/notify.moe/utils"
)
// NewPostArea renders a new post area.
func NewPostArea(ctx *aero.Context) string {
user := utils.GetUser(ctx)
return ctx.HTML(components.NewPostArea(user, "Reply"))
}

View File

@ -14,8 +14,6 @@ func Get(ctx *aero.Context) string {
id := ctx.Get("id")
user := utils.GetUser(ctx)
post, err := arn.GetPost(id)
// a := 0
// a++
if err != nil {
return ctx.Error(http.StatusNotFound, "Post not found", err)

View File

@ -1,7 +1,7 @@
component Post(post *arn.Post, user *arn.User)
.thread
.posts
Postable(post, user, "", "")
Postable(post, user, true, "", "")
.side-note-container.mountable
a.side-note(href=post.Parent().Link())= post.Parent().TitleByUser(user)

View File

@ -21,11 +21,5 @@ func Get(ctx *aero.Context) string {
return ctx.Error(http.StatusNotFound, "Thread not found", err)
}
// Fetch posts
posts := thread.Posts()
// Sort posts
arn.SortPostsLatestLast(posts)
return ctx.HTML(components.Thread(thread, posts, user))
return ctx.HTML(components.Thread(thread, user))
}

View File

@ -1,12 +1,9 @@
component Thread(thread *arn.Thread, posts []*arn.Post, user *arn.User)
component Thread(thread *arn.Thread, user *arn.User)
h1.thread-title= thread.Title
#thread.thread(data-id=thread.ID)
.posts
Postable(thread, user, "", thread.Creator().ID)
each post in posts
Postable(post, user, "", thread.Creator().ID)
Postable(thread, user, true, "", thread.Creator().ID)
//- Reply
if user != nil

View File

@ -14,18 +14,23 @@
.post-author
margin-bottom 0.25rem
.post-content
[data-highlight="true"]
.post-content
border 2px solid post-highlight-color
border 2px solid post-highlight-color
// [data-pro="true"]
// .post-content
// border 2px solid pro-color
.post-parent
vertical
.replies
margin-top 0.75rem
margin-left content-padding
> 600px
.post
horizontal
margin-bottom 0.75rem
margin-bottom 0
.post-author
margin-bottom 0
margin-bottom 0
.post-parent
horizontal

View File

@ -91,6 +91,11 @@ export function createThread(arn: AnimeNotifier) {
.catch(err => arn.statusMessage.showError(err))
}
// Reply to a post
export function reply(arn: AnimeNotifier, element: HTMLElement) {
}
// Lock thread
export function lockThread(arn: AnimeNotifier, element: HTMLButtonElement) {
setThreadLock(arn, element, true)

View File

@ -95,7 +95,8 @@ post-content-padding-y = 0.75rem
.post-tool
opacity 0.7
&:hover
:hover
cursor pointer
opacity 1
@ -134,135 +135,4 @@ post-content-padding-y = 0.75rem
white-space nowrap
opacity 0
transform translateX(100%)
default-transition
// Old
// #posts
// display flex
// flex-flow column
// flex 1
// max-width 100%
// .post
// display flex
// flex-flow column
// margin 0.5rem 0
// [data-highlight="true"]
// .post-content
// border 2px solid post-highlight-color
// .post-author
// text-align center
// flex-grow 0
// display flex
// flex-flow row
// justify-content center
// margin-bottom -3px
// img
// margin 0 !important
// #post-input,
// .post-input
// width 100%
// min-height 150px
// margin 0.5rem 0
// .post-submit
// margin-top 0.5rem
// max-width 200px
// align-items flex-end
// .post-toolbar
// display flex
// flex-flow row
// opacity 0
// default-transition
// position absolute
// bottom 3px
// right 0
// .post-save
// float right
// :hover
// cursor pointer
// .post-input-toolbar
// display flex
// flex-flow row
// .post-tool
// opacity 0.7
// :hover
// cursor pointer
// opacity 1
// .post-likes
// opacity 0.4
// margin-right 0.4em
// :before
// content "+"
// .post-permalink
// color blue !important
// .post-delete
// color rgb(255, 32, 12) !important
// .post-like
// color green !important
// .post-unlike
// color rgb(255, 32, 12) !important
// .post-content
// ui-element
// text-align left
// flex-grow 1
// padding 0.4rem 1rem
// margin-left 0.3rem
// border-radius ui-element-border-radius
// position relative
// :hover
// .post-toolbar
// opacity 1
// h1
// font-size 1.5rem
// line-height 2em
// h2
// font-size 1.3rem
// line-height 2em
// font-weight normal
// h3
// font-size 1.1rem
// line-height 2em
// font-weight normal
// .hidden
// display none
// .thread
// display flex
// flex-flow column
// align-items center
// .thread-title
// width auto
// .posts
// width 100%
// max-width 830px
// > 500px
// .post
// flex-flow row
// justify-content center
// .post-author
// //
default-transition