diff options
| -rw-r--r-- | src/components/settings/settings.js | 4 | ||||
| -rw-r--r-- | src/components/settings/settings.vue | 4 | ||||
| -rw-r--r-- | src/components/status/status.js | 52 | ||||
| -rw-r--r-- | src/components/status/status.vue | 10 | ||||
| -rw-r--r-- | src/i18n/messages.js | 1 | ||||
| -rw-r--r-- | src/modules/config.js | 1 |
6 files changed, 55 insertions, 17 deletions
diff --git a/src/components/settings/settings.js b/src/components/settings/settings.js index 169b9080..89be1624 100644 --- a/src/components/settings/settings.js +++ b/src/components/settings/settings.js @@ -15,6 +15,7 @@ const settings = { streamingLocal: this.$store.state.config.streaming, pauseOnUnfocusedLocal: this.$store.state.config.pauseOnUnfocused, hoverPreviewLocal: this.$store.state.config.hoverPreview, + expandCWLocal: this.$store.state.config.expandCW, stopGifs: this.$store.state.config.stopGifs, loopSilentAvailable: // Firefox @@ -65,6 +66,9 @@ const settings = { value = filter(value.split('\n'), (word) => trim(word).length > 0) this.$store.dispatch('setOption', { name: 'muteWords', value }) }, + expandCWLocal (value) { + this.$store.dispatch('setOption', { name: 'expandCW', value }) + }, stopGifs (value) { this.$store.dispatch('setOption', { name: 'stopGifs', value }) } diff --git a/src/components/settings/settings.vue b/src/components/settings/settings.vue index 6b65b14b..389b2be9 100644 --- a/src/components/settings/settings.vue +++ b/src/components/settings/settings.vue @@ -34,6 +34,10 @@ <input type="checkbox" id="hoverPreview" v-model="hoverPreviewLocal"> <label for="hoverPreview">{{$t('settings.reply_link_preview')}}</label> </li> + <li> + <input type="checkbox" id="expandCW" v-model="expandCWLocal"> + <label for="expandCW">{{$t('settings.expand_cw')}}</label> + </li> </ul> </div> <div class="setting-item"> diff --git a/src/components/status/status.js b/src/components/status/status.js index a2d6f41f..4321803e 100644 --- a/src/components/status/status.js +++ b/src/components/status/status.js @@ -22,15 +22,18 @@ const Status = { 'noHeading', 'inlineExpanded' ], - data: () => ({ - replying: false, - expanded: false, - unmuted: false, - userExpanded: false, - preview: null, - showPreview: false, - showingTall: false - }), + data () { + return { + replying: false, + expanded: false, + unmuted: false, + userExpanded: false, + preview: null, + showPreview: false, + showingTall: false, + expandingCW: this.$store.state.config.expandCW + } + }, computed: { muteWords () { return this.$store.state.config.muteWords @@ -98,12 +101,27 @@ const Status = { // // Using max-height + overflow: auto for status components resulted in false positives // very often with japanese characters, and it was very annoying. + tallStatus () { + const lengthScore = this.status.statusnet_html.split(/<p|<br/).length + this.status.text.length / 80 + return lengthScore > 20 + }, + hideCWStatus () { + if (this.tallStatus && this.$store.state.config.expandCW) { + return false + } + return !this.expandingCW && this.status.summary + }, hideTallStatus () { + if (this.status.summary && !this.$store.state.config.expandCW) { + return false + } if (this.showingTall) { return false } - const lengthScore = this.status.statusnet_html.split(/<p|<br/).length + this.status.text.length / 80 - return lengthScore > 20 + return this.tallStatus + }, + showingMore () { + return this.showingTall || (this.status.summary && this.expandingCW) }, attachmentSize () { if ((this.$store.state.config.hideAttachments && !this.inConversation) || @@ -163,8 +181,16 @@ const Status = { toggleUserExpanded () { this.userExpanded = !this.userExpanded }, - toggleShowTall () { - this.showingTall = !this.showingTall + toggleShowMore () { + if (this.showingTall) { + this.showingTall = false + } else if (this.expandingCW) { + this.expandingCW = false + } else if (this.hideTallStatus) { + this.showingTall = true + } else if (this.hideCWStatus) { + this.expandingCW = true + } }, replyEnter (id, event) { this.showPreview = true diff --git a/src/components/status/status.vue b/src/components/status/status.vue index b8993b0d..ee081671 100644 --- a/src/components/status/status.vue +++ b/src/components/status/status.vue @@ -76,9 +76,11 @@ </div> <div :class="{'tall-status': hideTallStatus}" class="status-content-wrapper"> - <a class="tall-status-hider" :class="{ 'tall-status-hider_focused': isFocused }" v-if="hideTallStatus" href="#" @click.prevent="toggleShowTall">Show more</a> - <div @click.prevent="linkClicked" class="status-content media-body" v-html="status.statusnet_html"></div> - <a v-if="showingTall" href="#" class="tall-status-unhider" @click.prevent="toggleShowTall">Show less</a> + <a class="tall-status-hider" :class="{ 'tall-status-hider_focused': isFocused }" v-if="hideTallStatus" href="#" @click.prevent="toggleShowMore">Show more</a> + <div @click.prevent="linkClicked" class="status-content media-body" v-html="status.statusnet_html" v-if="!hideCWStatus"></div> + <div @click.prevent="linkClicked" class="status-content media-body" v-html="status.summary" v-else></div> + <a v-if="hideCWStatus" href="#" class="cw-status-hider" @click.prevent="toggleShowMore">Show more</a> + <a v-if="showingMore" href="#" class="status-unhider" @click.prevent="toggleShowMore">Show less</a> </div> <div v-if='status.attachments' class='attachments media-body'> @@ -310,7 +312,7 @@ } } - .tall-status-unhider { + .status-unhider, .cw-status-hider { width: 100%; text-align: center; } diff --git a/src/i18n/messages.js b/src/i18n/messages.js index 32d886fa..67ed973d 100644 --- a/src/i18n/messages.js +++ b/src/i18n/messages.js @@ -317,6 +317,7 @@ const en = { hide_attachments_in_tl: 'Hide attachments in timeline', hide_attachments_in_convo: 'Hide attachments in conversations', nsfw_clickthrough: 'Enable clickthrough NSFW attachment hiding', + expand_cw: 'Expand posts with subjects by default', stop_gifs: 'Play-on-hover GIFs', autoload: 'Enable automatic loading when scrolled to the bottom', streaming: 'Enable automatic streaming of new posts when scrolled to the top', diff --git a/src/modules/config.js b/src/modules/config.js index fe31ab01..eafe90ce 100644 --- a/src/modules/config.js +++ b/src/modules/config.js @@ -7,6 +7,7 @@ const defaultState = { hideAttachments: false, hideAttachmentsInConv: false, hideNsfw: true, + expandCW: false, loopVideo: true, loopVideoSilentOnly: true, autoLoad: true, |