From c7914f554ead34293f2e4d01cf2afe2a9a02c181 Mon Sep 17 00:00:00 2001
From: syuilo <Syuilotan@yahoo.co.jp>
Date: Wed, 5 Feb 2020 08:59:24 +0900
Subject: [PATCH] Fix bug nado

---
 CHANGELOG.md                        |  1 +
 src/client/components/post-form.vue | 33 ++++++++++++++++++-----------
 2 files changed, 22 insertions(+), 12 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index c928f7f93..4cd5f800c 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -104,6 +104,7 @@ v12ではいくつかインスタンスにとって破壊的な変更があり
   * URLまでnyaizeされている問題を修正
   * ハッシュタグまでnyaizeされている問題を修正
 	* 他
+* 投稿フォームでCWが下書きに保存されない問題を修正
 * TypeError: Cannot read property 'stack' of undefined が出ることがある問題を修正
 * AP: カスタム絵文字を連続して書くと他のサービスでカスタム絵文字と認識されない問題を修正
 * AP: audience (visibility) パースの修正
diff --git a/src/client/components/post-form.vue b/src/client/components/post-form.vue
index d6141e210..8c7882614 100644
--- a/src/client/components/post-form.vue
+++ b/src/client/components/post-form.vue
@@ -26,8 +26,8 @@
 				<button @click="addVisibleUser" class="_buttonPrimary"><fa :icon="faPlus" fixed-width/></button>
 			</div>
 		</div>
-		<input v-show="useCw" ref="cw" v-model="cw" :placeholder="$t('annotation')" v-autocomplete="{ model: 'cw' }">
-		<textarea v-model="text" ref="text" :disabled="posting" :placeholder="placeholder" v-autocomplete="{ model: 'text' }" @keydown="onKeydown" @paste="onPaste"></textarea>
+		<input v-show="useCw" ref="cw" class="cw" v-model="cw" :placeholder="$t('annotation')" v-autocomplete="{ model: 'cw' }">
+		<textarea v-model="text" class="text" :class="{ withCw: useCw }" ref="text" :disabled="posting" :placeholder="placeholder" v-autocomplete="{ model: 'text' }" @keydown="onKeydown" @paste="onPaste"></textarea>
 		<x-post-form-attaches class="attaches" :files="files"/>
 		<x-poll-editor v-if="poll" ref="poll" @destroyed="poll = false" @updated="onPollUpdate()"/>
 		<x-uploader ref="uploader" @uploaded="attachMedia" @change="onChangeUploadings"/>
@@ -250,6 +250,8 @@ export default Vue.extend({
 				const draft = JSON.parse(localStorage.getItem('drafts') || '{}')[this.draftId];
 				if (draft) {
 					this.text = draft.data.text;
+					this.useCw = draft.data.useCw;
+					this.cw = draft.data.cw;
 					this.files = (draft.data.files || []).filter(e => e);
 					if (draft.data.poll) {
 						this.poll = true;
@@ -257,7 +259,6 @@ export default Vue.extend({
 							(this.$refs.poll as any).set(draft.data.poll);
 						});
 					}
-					this.$emit('change-attached-files', this.files);
 				}
 			}
 
@@ -288,6 +289,8 @@ export default Vue.extend({
 	methods: {
 		watch() {
 			this.$watch('text', () => this.saveDraft());
+			this.$watch('useCw', () => this.saveDraft());
+			this.$watch('cw', () => this.saveDraft());
 			this.$watch('poll', () => this.saveDraft());
 			this.$watch('files', () => this.saveDraft());
 		},
@@ -400,7 +403,6 @@ export default Vue.extend({
 			this.files = [];
 			this.poll = false;
 			this.quoteId = null;
-			this.$emit('change-attached-files', this.files);
 		},
 
 		onKeydown(e) {
@@ -472,7 +474,6 @@ export default Vue.extend({
 			if (driveFile != null && driveFile != '') {
 				const file = JSON.parse(driveFile);
 				this.files.push(file);
-				this.$emit('change-attached-files', this.files);
 				e.preventDefault();
 			}
 			//#endregion
@@ -487,6 +488,8 @@ export default Vue.extend({
 				updatedAt: new Date(),
 				data: {
 					text: this.text,
+					useCw: this.useCw,
+					cw: this.cw,
 					files: this.files,
 					poll: this.poll && this.$refs.poll ? (this.$refs.poll as any).get() : undefined
 				}
@@ -670,12 +673,8 @@ export default Vue.extend({
 			}
 		}
 
-		> input {
-			z-index: 1;
-		}
-
-		> input,
-		> textarea {
+		> .cw,
+		> .text {
 			display: block;
 			box-sizing: border-box;
 			padding: 0 24px;
@@ -701,7 +700,13 @@ export default Vue.extend({
 			}
 		}
 
-		> textarea {
+		> .cw {
+			z-index: 1;
+			padding-bottom: 8px;
+			border-bottom: solid 1px var(--divider);
+		}
+
+		> .text {
 			max-width: 100%;
 			min-width: 100%;
 			min-height: 90px;
@@ -709,6 +714,10 @@ export default Vue.extend({
 			@media (max-width: 500px) {
 				min-height: 80px;
 			}
+
+			&.withCw {
+				padding-top: 8px;
+			}
 		}
 
 		> .mk-uploader {