From 56c8ad9df37d6c1a697fb6cdbe7ccf56752b14c6 Mon Sep 17 00:00:00 2001 From: Satsuki Yanagi <17376330+u1-liquid@users.noreply.github.com> Date: Sat, 20 Jul 2019 03:23:16 +0900 Subject: [PATCH] Improve usability of quote note by pasting url (#5196) --- src/client/app/common/scripts/post-form.ts | 3 +- .../desktop/views/components/post-form.vue | 34 +++++++++++-------- .../app/mobile/views/components/post-form.vue | 13 +++++-- 3 files changed, 32 insertions(+), 18 deletions(-) diff --git a/src/client/app/common/scripts/post-form.ts b/src/client/app/common/scripts/post-form.ts index 7cf26f65b..ff3fd0792 100644 --- a/src/client/app/common/scripts/post-form.ts +++ b/src/client/app/common/scripts/post-form.ts @@ -328,6 +328,7 @@ export default (opts) => ({ this.text = ''; this.files = []; this.poll = false; + this.quoteId = null; this.$emit('change-attached-files', this.files); }, @@ -357,7 +358,7 @@ export default (opts) => ({ const paste = e.clipboardData.getData('text'); - if (paste.startsWith(url + '/notes/')) { + if (!this.renote && !this.quoteId && paste.startsWith(url + '/notes/')) { e.preventDefault(); this.$root.dialog({ diff --git a/src/client/app/desktop/views/components/post-form.vue b/src/client/app/desktop/views/components/post-form.vue index 39b7781a1..5ce5eba73 100644 --- a/src/client/app/desktop/views/components/post-form.vue +++ b/src/client/app/desktop/views/components/post-form.vue @@ -6,18 +6,18 @@ @drop.stop="onDrop" > <div class="content"> - <div v-if="visibility == 'specified'" class="visibleUsers"> + <div class="hashtags" v-if="recentHashtags.length > 0 && $store.state.settings.suggestRecentHashtags"> + <b>{{ $t('@.post-form.recent-tags') }}:</b> + <a v-for="tag in recentHashtags.slice(0, 5)" @click="addTag(tag)" :title="$t('@.post-form.click-to-tagging')">#{{ tag }}</a> + </div> + <div class="with-quote" v-if="quoteId">{{ $t('@.post-form.quote-attached') }} <a @click="quoteId = null">[x]</a></div> + <div v-if="visibility === 'specified'" class="visibleUsers"> <span v-for="u in visibleUsers"> <mk-user-name :user="u"/><a @click="removeVisibleUser(u)">[x]</a> </span> <a @click="addVisibleUser">{{ $t('@.post-form.add-visible-user') }}</a> </div> - <div class="hashtags" v-if="recentHashtags.length > 0 && $store.state.settings.suggestRecentHashtags"> - <b>{{ $t('@.post-form.recent-tags') }}:</b> - <a v-for="tag in recentHashtags.slice(0, 5)" @click="addTag(tag)" :title="$t('@.post-form.click-to-tagging')">#{{ tag }}</a> - </div> - <div class="with-quote" v-if="quoteId">{{ $t('@.post-form.quote-attached') }}</div> - <div class="local-only" v-if="localOnly == true">{{ $t('@.post-form.local-only-message') }}</div> + <div class="local-only" v-if="localOnly === true">{{ $t('@.post-form.local-only-message') }}</div> <input v-show="useCw" ref="cw" v-model="cw" :placeholder="$t('@.post-form.cw-placeholder')" v-autocomplete="{ model: 'cw' }"> <div class="textarea"> <textarea :class="{ with: (files.length != 0 || poll) }" @@ -190,14 +190,6 @@ export default Vue.extend({ border-radius 0 0 4px 4px transition border-color .3s ease - > .visibleUsers - margin-bottom 8px - font-size 14px - - > span - margin-right 16px - color var(--primary) - > .hashtags margin 0 0 8px 0 overflow hidden @@ -211,6 +203,18 @@ export default Vue.extend({ margin-right 8px white-space nowrap + > .with-quote + margin 0 0 8px 0 + color var(--primary) + + > .visibleUsers + margin-bottom 8px + font-size 14px + + > span + margin-right 16px + color var(--primary) + > .local-only margin 0 0 8px 0 color var(--primary) diff --git a/src/client/app/mobile/views/components/post-form.vue b/src/client/app/mobile/views/components/post-form.vue index 495fa0cf2..982843044 100644 --- a/src/client/app/mobile/views/components/post-form.vue +++ b/src/client/app/mobile/views/components/post-form.vue @@ -17,16 +17,17 @@ <div class="form"> <mk-note-preview class="preview" v-if="reply" :note="reply"/> <mk-note-preview class="preview" v-if="renote" :note="renote"/> - <div v-if="visibility == 'specified'" class="visibleUsers"> + <div class="with-quote" v-if="quoteId">{{ $t('@.post-form.quote-attached') }} <a @click="quoteId = null">[x]</a></div> + <div v-if="visibility === 'specified'" class="visibleUsers"> <span v-for="u in visibleUsers"> <mk-user-name :user="u"/> <a @click="removeVisibleUser(u)">[x]</a> </span> <a @click="addVisibleUser">+{{ $t('@.post-form.add-visible-user') }}</a> </div> + <div class="local-only" v-if="localOnly === true">{{ $t('@.post-form.local-only-message') }}</div> <input v-show="useCw" ref="cw" v-model="cw" :placeholder="$t('@.post-form.cw-placeholder')" v-autocomplete="{ model: 'cw' }"> <textarea v-model="text" ref="text" :disabled="posting" :placeholder="placeholder" v-autocomplete="{ model: 'text' }" @paste="onPaste"></textarea> - <div class="with-quote" v-if="quoteId">{{ $t('@.post-form.quote-attached') }}</div> <x-post-form-attaches class="attaches" :files="files"/> <x-poll-editor v-if="poll" ref="poll" @destroyed="poll = false" @updated="onPollUpdate()"/> <mk-uploader ref="uploader" @uploaded="attachMedia" @change="onChangeUploadings"/> @@ -140,6 +141,10 @@ export default Vue.extend({ > .preview padding 16px + > .with-quote + margin 0 0 8px 0 + color var(--primary) + > .visibleUsers margin 5px font-size 14px @@ -148,6 +153,10 @@ export default Vue.extend({ margin-right 16px color var(--text) + > .local-only + margin 0 0 8px 0 + color var(--primary) + > input z-index 1