Added thread title editing

mixins/Postable.pixy

@@ -10,15 +10,18 @@ component Postable(post arn.Postable, user *arn.User, highlightAuthorID string)
 			div(id="render-" + post.ID())!= post.HTML()
 
 			if user != nil && user.ID == post.Author().ID
-				textarea.post-input.hidden(id="source-" + post.ID())= post.Text()
+				.post-edit-interface
-				.buttons.hidden(id="edit-toolbar-" + post.ID())
+					if post.Type() == "Thread"
-					a.button.post-save.action(data-action="savePost", data-trigger="click", data-id=post.ID())
+						input.post-title-input.hidden(id="title-" + post.ID(), value=post.Title(), type="text", placeholder="Thread title")
-						Icon("save")
+					textarea.post-text-input.hidden(id="source-" + post.ID())= post.Text()
-						span Save
+					.buttons.hidden(id="edit-toolbar-" + post.ID())
+						a.button.post-save.action(data-action="savePost", data-trigger="click", data-id=post.ID())
+							Icon("save")
+							span Save
 
-					a.button.post-cancel-edit.action(data-action="editPost", data-trigger="click", data-id=post.ID())
+						a.button.post-cancel-edit.action(data-action="editPost", data-trigger="click", data-id=post.ID())
-						Icon("close")
+							Icon("close")
-						span Cancel
+							span Cancel
 
 			.post-toolbar(id="toolbar-" + post.ID())
 				.spacer

scripts/Actions.ts

@@ -78,19 +78,17 @@ export function editPost(arn: AnimeNotifier, element: HTMLElement) {
 
 	let render = arn.app.find("render-" + postId)
 	let toolbar = arn.app.find("toolbar-" + postId)
+	let title = arn.app.find("title-" + postId)
 	let source = arn.app.find("source-" + postId)
 	let edit = arn.app.find("edit-toolbar-" + postId)
 
-	if(!render.classList.contains("hidden")) {
+	render.classList.toggle("hidden")
-		render.classList.add("hidden")
+	toolbar.classList.toggle("hidden")
-		toolbar.classList.add("hidden")
+	source.classList.toggle("hidden")
-		source.classList.remove("hidden")
+	edit.classList.toggle("hidden")
-		edit.classList.remove("hidden")
+
-	} else {
+	if(title) {
-		render.classList.remove("hidden")
+		title.classList.toggle("hidden")
-		toolbar.classList.remove("hidden")
-		source.classList.add("hidden")
-		edit.classList.add("hidden")
 	}
 }
 
@@ -98,12 +96,18 @@ export function editPost(arn: AnimeNotifier, element: HTMLElement) {
 export function savePost(arn: AnimeNotifier, element: HTMLElement) {
 	let postId = element.dataset.id
 	let source = arn.app.find("source-" + postId) as HTMLTextAreaElement
+	let title = arn.app.find("title-" + postId) as HTMLInputElement
 	let text = source.value
 
-	let updates = {
+	let updates: any = {
 		Text: text,
 	}
 
+	// Add title for threads only
+	if(title) {
+		updates.Title = title.value
+	}
+
 	let apiEndpoint = arn.findAPIEndpoint(element)
 
 	arn.post(apiEndpoint, updates)

styles/forum.scarlet

@@ -1,6 +1,7 @@
 // .forum-header
 // 	text-align left
 // 	margin-bottom 1rem
+post-content-padding-y = 0.75rem
 
 .thread-link
 	vertical
@@ -108,7 +109,13 @@
 .post-save
 	//
 
-.post-input
+.post-edit-interface
+	vertical
+
+.post-title-input
+	margin-bottom post-content-padding-y
+
+.post-text-input
 	min-height 200px
 
 // Old

styles/input.scarlet

@@ -13,10 +13,15 @@ input, textarea, button, .button, select
 
 input, textarea, select
 	input-focus
+	width 100%
 
 	:disabled
 		ui-disabled
 
+input, select
+	width 100%
+	padding 0.5rem 1rem
+
 input
 	:active
 		transform translateY(3px)
@@ -49,7 +54,6 @@ label
 
 textarea
 	padding 0.4em 0.8em
-	width 100%
 	line-height 1.5em
 	height 10rem
 	transition none