Threaded comments

mixins/Comments.pixy

@@ -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)

mixins/NewPostArea.pixy

@@ -1,5 +1,6 @@
 component NewPostArea(user *arn.User, placeholder string)
 	.post.mountable
+		.post-parent
 			.post-author
 				Avatar(user)
 			

mixins/Postable.pixy

@@ -1,9 +1,10 @@
-component Postable(post arn.Postable, user *arn.User, headerContent string, highlightAuthorID string)
+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-highlight=post.Creator().ID == highlightAuthorID, data-pro=post.Creator().IsPro(), data-api="/api/" + strings.ToLower(post.Type()) + "/" + post.GetID())
+	.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
+			.post-content(data-highlight=post.Creator().ID == highlightAuthorID)
 				if headerContent != ""
 					div!= headerContent
 				
@@ -38,9 +39,12 @@ component Postable(post arn.Postable, user *arn.User, headerContent string, high
 								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"
+						//- if user.Role == "admin"
-						a.post-tool.post-edit.tip(href=post.Link() + "/edit", aria-label="Edit")
+						//- 	a.post-tool.post-edit.tip(href=post.Link() + "/edit", aria-label="Edit")
-							Icon("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")
@@ -53,3 +57,8 @@ component Postable(post arn.Postable, user *arn.User, headerContent string, high
 					
 					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)

mixins/PostableList.pixy

@@ -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, "", "")

pages/activity/activity.pixy

@@ -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))), "")

pages/post/newpostarea.go

@@ -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"))
+}

pages/post/post.go

@@ -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)

pages/post/post.pixy

@@ -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)

pages/thread/thread.go

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

pages/thread/thread.pixy

@@ -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)
+			Postable(thread, user, true, "", thread.Creator().ID)
-
-			each post in posts
-				Postable(post, user, "", thread.Creator().ID)
 			
 			//- Reply
 			if user != nil

pages/thread/thread.scarlet

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

scripts/Actions/Forum.ts

@@ -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)

styles/forum.scarlet

@@ -95,7 +95,8 @@ post-content-padding-y = 0.75rem
 
 .post-tool
 	opacity 0.7
-	&:hover
+
+	:hover
 		cursor pointer
 		opacity 1
 
@@ -135,134 +136,3 @@ post-content-padding-y = 0.75rem
 	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
-// 		//