From 4cac9f554461ae07defc23c5420bec687d4d078a Mon Sep 17 00:00:00 2001
From: Eduard Urbach <e.urbach@gmail.com>
Date: Thu, 6 Jul 2017 19:33:58 +0200
Subject: [PATCH] Added thread title editing

---
 mixins/Postable.pixy | 19 +++++++++++--------
 scripts/Actions.ts   | 26 +++++++++++++++-----------
 styles/forum.scarlet |  9 ++++++++-
 styles/input.scarlet |  6 +++++-
 4 files changed, 39 insertions(+), 21 deletions(-)

diff --git a/mixins/Postable.pixy b/mixins/Postable.pixy
index 4ed21abe..65da2aab 100644
--- a/mixins/Postable.pixy
+++ b/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()
-				.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
+				.post-edit-interface
+					if post.Type() == "Thread"
+						input.post-title-input.hidden(id="title-" + post.ID(), value=post.Title(), type="text", placeholder="Thread title")
+					textarea.post-text-input.hidden(id="source-" + post.ID())= post.Text()
+					.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())
-						Icon("close")
-						span Cancel
+						a.button.post-cancel-edit.action(data-action="editPost", data-trigger="click", data-id=post.ID())
+							Icon("close")
+							span Cancel
 
 			.post-toolbar(id="toolbar-" + post.ID())
 				.spacer
diff --git a/scripts/Actions.ts b/scripts/Actions.ts
index 65cb5d43..6e437977 100644
--- a/scripts/Actions.ts
+++ b/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.add("hidden")
-		toolbar.classList.add("hidden")
-		source.classList.remove("hidden")
-		edit.classList.remove("hidden")
-	} else {
-		render.classList.remove("hidden")
-		toolbar.classList.remove("hidden")
-		source.classList.add("hidden")
-		edit.classList.add("hidden")
+	render.classList.toggle("hidden")
+	toolbar.classList.toggle("hidden")
+	source.classList.toggle("hidden")
+	edit.classList.toggle("hidden")
+
+	if(title) {
+		title.classList.toggle("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)
diff --git a/styles/forum.scarlet b/styles/forum.scarlet
index 17c2d107..4107476e 100644
--- a/styles/forum.scarlet
+++ b/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
diff --git a/styles/input.scarlet b/styles/input.scarlet
index 8356881d..e4cff2b0 100644
--- a/styles/input.scarlet
+++ b/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
\ No newline at end of file