✌️

src/web/app/desktop/tags/post-form.tag

@@ -1,6 +1,6 @@
 <mk-post-form ondragover={ ondragover } ondragenter={ ondragenter } ondragleave={ ondragleave } ondrop={ ondrop }>
 	<div class="content">
-		<textarea class={ with: (files.length != 0 || poll) } ref="text" disabled={ wait } oninput={ update } onkeydown={ onkeydown } onpaste={ onpaste } placeholder={ opts.reply ? 'この投稿への返信...' : 'いまどうしてる？' }></textarea>
+		<textarea class={ with: (files.length != 0 || poll) } ref="text" disabled={ wait } oninput={ update } onkeydown={ onkeydown } onpaste={ onpaste } placeholder={ placeholder="" }></textarea>
 		<div class="medias { with: poll }" if={ files.length != 0 }>
 			<ul>
 				<li each={ files }>
@@ -19,8 +19,8 @@
 	<button class="cat" title="Insert The Cat" onclick={ cat }><i class="fa fa-smile-o"></i></button>
 	<button class="poll" title="投票を作成" onclick={ addPoll }><i class="fa fa-pie-chart"></i></button>
 	<p class="text-count { over: refs.text.value.length > 1000 }">のこり{ 1000 - refs.text.value.length }文字</p>
-	<button class={ wait: wait } ref="submit" disabled={ wait || (refs.text.value.length == 0 && files.length == 0 && !poll) } onclick={ post }>{ wait ? '投稿中' : opts.reply ? '返信' : '投稿' }
+	<button class={ wait: wait } ref="submit" disabled={ wait || (refs.text.value.length == 0 && files.length == 0 && !poll) } onclick={ post }>
-		<mk-ellipsis if={ wait }></mk-ellipsis>
+		{ wait ? '投稿中' : submitText }<mk-ellipsis if={ wait }></mk-ellipsis>
 	</button>
 	<input ref="file" type="file" accept="image/*" multiple="multiple" tabindex="-1" onchange={ changeFile }/>
 	<div class="dropzone" if={ draghover }></div>
@@ -323,6 +323,29 @@
 		// https://github.com/riot/riot/issues/2080
 		if (this.inReplyToPost == '') this.inReplyToPost = null;
 
+		this.repost = this.opts.repost;
+
+		// https://github.com/riot/riot/issues/2080
+		if (this.repost == '') this.repost = null;
+
+		this.placeholder = this.repost
+			? 'この投稿を引用...'
+			: this.inReplyToPost
+				? 'この投稿への返信...'
+				: 'いまどうしてる？';
+
+		this.submitText = this.repost
+			? 'Repost'
+			: this.inReplyToPost
+				? '返信'
+				: '投稿';
+
+		this.draftId = this.repost
+			? 'draft-repost-' + this.repost.id
+			: this.inReplyToPost
+				? 'draft-reply-' + this.inReplyToPost.id
+				: 'draft';
+
 		this.on('mount', () => {
 			this.refs.uploader.on('uploaded', file => {
 				this.addFile(file);
@@ -336,7 +359,7 @@
 			this.autocomplete.attach();
 
 			// 書きかけの投稿を復元
-			let draft = localStorage.getItem('post-draft');
+			let draft = localStorage.getItem(this.draftId);
 			if (draft) {
 				draft = JSON.parse(draft);
 				this.refs.text.value = draft.text;
@@ -457,17 +480,26 @@
 				: undefined;
 
 			this.api('posts/create', {
-				text: this.refs.text.value,
+				text: this.refs.text.value == '' ? undefined : this.refs.text.value,
 				media_ids: files,
 				reply_to_id: this.inReplyToPost ? this.inReplyToPost.id : undefined,
+				repost_id: this.repost ? this.repost.id : undefined,
 				poll: this.poll ? this.refs.poll.get() : undefined
 			}).then(data => {
 				this.clear();
 				this.trigger('post');
-				localStorage.removeItem('post-draft');
+				localStorage.removeItem(this.draftId);
-				this.notify(this.inReplyToPost ? '返信しました！' : '投稿しました！');
+				this.notify(this.repost
+					? 'Repostしました！'
+					: this.inReplyToPost
+						? '返信しました！'
+						: '投稿しました！');
 			}).catch(err => {
-				this.notify('投稿できませんでした');
+				this.notify(this.repost
+					? 'Repostできませんでした'
+					: this.inReplyToPost
+						? '返信できませんでした'
+						: '投稿できませんでした');
 			}).then(() => {
 				this.update({
 					wait: false
@@ -485,12 +517,12 @@
 
 		this.save = () => {
 			const context = {
-				text: this.refs.text.value == '' ? undefined : this.refs.text.value,
+				text: this.refs.text.value,
 				files: this.files,
 				poll: this.poll && this.refs.poll ? this.refs.poll.get() : undefined
 			};
 
-			localStorage.setItem('post-draft', JSON.stringify(context));
+			localStorage.setItem(this.draftId, JSON.stringify(context));
 		};
 	</script>
 </mk-post-form>

src/web/app/desktop/tags/repost-form.tag

@@ -1,50 +1,21 @@
 <mk-repost-form>
 	<mk-post-preview post={ opts.post }></mk-post-preview>
-	<div class="form" if={ quote }>
+	<virtual if={ !quote }>
-		<textarea ref="text" disabled={ wait } placeholder="この投稿を引用..."></textarea>
+		<footer>
-	</div>
+			<a class="quote" if={ !quote } onclick={ onquote }>引用する...</a>
-	<footer><a class="quote" if={ !quote } onclick={ onquote }>引用する...</a>
 			<button class="cancel" onclick={ cancel }>キャンセル</button>
-		<button class="ok" onclick={ ok }>Repost</button>
+			<button class="ok" onclick={ ok } disabled={ wait }>{ wait ? 'しています...' : 'Repost' }</button>
 		</footer>
+	</virtual>
+	<virtual if={ quote }>
+		<mk-post-form ref="form" repost={ opts.post }></mk-post-form>
+	</virtual>
 	<style>
 		:scope
 
 			> mk-post-preview
 				margin 16px 22px
 
-			> .form
-				[ref='text']
-					display block
-					padding 12px
-					margin 0
-					width 100%
-					max-width 100%
-					min-width 100%
-					min-height calc(1em + 12px + 12px)
-					font-size 1em
-					color #333
-					background #fff
-					outline none
-					border solid 1px rgba($theme-color, 0.1)
-					border-radius 4px
-					transition border-color .3s ease
-
-					&:hover
-						border-color rgba($theme-color, 0.2)
-						transition border-color .1s ease
-
-					&:focus
-						color $theme-color
-						border-color rgba($theme-color, 0.5)
-						transition border-color 0s ease
-
-					&:disabled
-						opacity 0.5
-
-					&::-webkit-input-placeholder
-						color rgba($theme-color, 0.3)
-
 			> div
 				padding 16px
 
@@ -127,8 +98,7 @@
 		this.ok = () => {
 			this.wait = true;
 			this.api('posts/create', {
-				repost_id: this.opts.post.id,
+				repost_id: this.opts.post.id
-				text: this.quote ? this.refs.text.value : undefined
 			}).then(data => {
 				this.trigger('posted');
 				this.notify('Repostしました！');
@@ -142,7 +112,15 @@
 		};
 
 		this.onquote = () => {
-			this.quote = true;
+			this.update({
+				quote: true
+			});
+
+			this.refs.form.on('post', () => {
+				this.trigger('posted');
+			});
+
+			this.refs.form.focus();
 		};
 	</script>
 </mk-repost-form>

src/web/app/desktop/tags/timeline-post.tag

@@ -324,7 +324,7 @@
 		this.mixin('NotImplementedException');
 
 		this.post = this.opts.post;
-		this.isRepost = this.post.repost && this.post.text == null;
+		this.isRepost = this.post.repost && this.post.text == null && this.post.media_ids == null && this.post.poll == null;
 		this.p = this.isRepost ? this.post.repost : this.post;
 
 		this.title = this.dateStringify(this.p.created_at);