From a9c2e25d11034e824ede22ddf8567e65e4aa68da Mon Sep 17 00:00:00 2001 From: syuilo <syuilotan@yahoo.co.jp> Date: Sat, 11 Mar 2017 19:32:49 +0900 Subject: [PATCH] :v: --- src/web/app/desktop/tags/post-form.tag | 52 ++++++++++++++---- src/web/app/desktop/tags/repost-form.tag | 62 +++++++--------------- src/web/app/desktop/tags/timeline-post.tag | 4 +- 3 files changed, 64 insertions(+), 54 deletions(-) diff --git a/src/web/app/desktop/tags/post-form.tag b/src/web/app/desktop/tags/post-form.tag index bd7a3b94a..cbd0dc891 100644 --- a/src/web/app/desktop/tags/post-form.tag +++ b/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 ? '返信' : '投稿' } - <mk-ellipsis if={ wait }></mk-ellipsis> + <button class={ wait: wait } ref="submit" disabled={ wait || (refs.text.value.length == 0 && files.length == 0 && !poll) } onclick={ post }> + { 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'); - this.notify(this.inReplyToPost ? '返信しました!' : '投稿しました!'); + localStorage.removeItem(this.draftId); + 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> diff --git a/src/web/app/desktop/tags/repost-form.tag b/src/web/app/desktop/tags/repost-form.tag index e5101d9f2..2bbed8aca 100644 --- a/src/web/app/desktop/tags/repost-form.tag +++ b/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 }> - <textarea ref="text" disabled={ wait } placeholder="この投稿を引用..."></textarea> - </div> - <footer><a class="quote" if={ !quote } onclick={ onquote }>引用する...</a> - <button class="cancel" onclick={ cancel }>キャンセル</button> - <button class="ok" onclick={ ok }>Repost</button> - </footer> + <virtual if={ !quote }> + <footer> + <a class="quote" if={ !quote } onclick={ onquote }>引用する...</a> + <button class="cancel" onclick={ cancel }>キャンセル</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, - text: this.quote ? this.refs.text.value : undefined + repost_id: this.opts.post.id }).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> diff --git a/src/web/app/desktop/tags/timeline-post.tag b/src/web/app/desktop/tags/timeline-post.tag index cbd13aa59..9a1dede2d 100644 --- a/src/web/app/desktop/tags/timeline-post.tag +++ b/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); @@ -418,7 +418,7 @@ case e.which == 82: // [r] this.reply(); break; - + default: shouldBeCancel = false; }