From 1121f32c48d06105c976f91545ededca05b283e8 Mon Sep 17 00:00:00 2001 From: ensra Date: Mon, 20 Aug 2018 02:59:06 +0100 Subject: [PATCH 1/3] Add support for configurable CW clickthrough. --- src/components/settings/settings.js | 4 +++ src/components/settings/settings.vue | 4 +++ src/components/status/status.js | 52 +++++++++++++++++++++------- src/components/status/status.vue | 10 +++--- src/i18n/messages.js | 1 + 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 @@ +
  • + + +
    • 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(/ 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(/ 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 @@
    - Show more -
    - Show less + Show more +
    +
    + Show more + Show less
    @@ -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, From 671db023da097c90e7a2cf67b7218bd13be51bb0 Mon Sep 17 00:00:00 2001 From: ensra Date: Mon, 20 Aug 2018 03:08:39 +0100 Subject: [PATCH 2/3] fix indent --- src/components/status/status.js | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/src/components/status/status.js b/src/components/status/status.js index 4321803e..07aae7e8 100644 --- a/src/components/status/status.js +++ b/src/components/status/status.js @@ -106,10 +106,10 @@ const Status = { return lengthScore > 20 }, hideCWStatus () { - if (this.tallStatus && this.$store.state.config.expandCW) { - return false - } - return !this.expandingCW && this.status.summary + 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) { From 3ec8e43a9704b2945d58395dba997adfa2106df5 Mon Sep 17 00:00:00 2001 From: ensra Date: Mon, 20 Aug 2018 03:41:40 +0100 Subject: [PATCH 3/3] Rename expandCW to collapseMessageWithSubject. Add option to config.json, disabled by default. --- src/components/settings/settings.js | 6 +++--- src/components/settings/settings.vue | 8 ++++---- src/components/status/status.js | 20 ++++++++++---------- src/components/status/status.vue | 4 ++-- src/i18n/messages.js | 2 +- src/main.js | 4 +++- src/modules/config.js | 2 +- static/config.json | 3 ++- 8 files changed, 26 insertions(+), 23 deletions(-) diff --git a/src/components/settings/settings.js b/src/components/settings/settings.js index 89be1624..c85ef59f 100644 --- a/src/components/settings/settings.js +++ b/src/components/settings/settings.js @@ -15,7 +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, + collapseMessageWithSubjectLocal: this.$store.state.config.collapseMessageWithSubject, stopGifs: this.$store.state.config.stopGifs, loopSilentAvailable: // Firefox @@ -66,8 +66,8 @@ 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 }) + collapseMessageWithSubjectLocal (value) { + this.$store.dispatch('setOption', { name: 'collapseMessageWithSubject', 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 389b2be9..170f5773 100644 --- a/src/components/settings/settings.vue +++ b/src/components/settings/settings.vue @@ -16,6 +16,10 @@

    {{$t('nav.timeline')}}

      +
    • + + +
    • @@ -34,10 +38,6 @@
      • -
    • - - -
    diff --git a/src/components/status/status.js b/src/components/status/status.js index 07aae7e8..9670f69d 100644 --- a/src/components/status/status.js +++ b/src/components/status/status.js @@ -31,7 +31,7 @@ const Status = { preview: null, showPreview: false, showingTall: false, - expandingCW: this.$store.state.config.expandCW + expandingSubject: !this.$store.state.config.collapseMessageWithSubject } }, computed: { @@ -105,14 +105,14 @@ const Status = { const lengthScore = this.status.statusnet_html.split(/ 20 }, - hideCWStatus () { - if (this.tallStatus && this.$store.state.config.expandCW) { + hideSubjectStatus () { + if (this.tallStatus && !this.$store.state.config.collapseMessageWithSubject) { return false } - return !this.expandingCW && this.status.summary + return !this.expandingSubject && this.status.summary }, hideTallStatus () { - if (this.status.summary && !this.$store.state.config.expandCW) { + if (this.status.summary && this.$store.state.config.collapseMessageWithSubject) { return false } if (this.showingTall) { @@ -121,7 +121,7 @@ const Status = { return this.tallStatus }, showingMore () { - return this.showingTall || (this.status.summary && this.expandingCW) + return this.showingTall || (this.status.summary && this.expandingSubject) }, attachmentSize () { if ((this.$store.state.config.hideAttachments && !this.inConversation) || @@ -184,12 +184,12 @@ const Status = { toggleShowMore () { if (this.showingTall) { this.showingTall = false - } else if (this.expandingCW) { - this.expandingCW = false + } else if (this.expandingSubject) { + this.expandingSubject = false } else if (this.hideTallStatus) { this.showingTall = true - } else if (this.hideCWStatus) { - this.expandingCW = true + } else if (this.hideSubjectStatus) { + this.expandingSubject = true } }, replyEnter (id, event) { diff --git a/src/components/status/status.vue b/src/components/status/status.vue index ee081671..e7d5ed7a 100644 --- a/src/components/status/status.vue +++ b/src/components/status/status.vue @@ -77,9 +77,9 @@
    Show more -
    +
    - Show more + Show more Show less
    diff --git a/src/i18n/messages.js b/src/i18n/messages.js index 67ed973d..2fa0f910 100644 --- a/src/i18n/messages.js +++ b/src/i18n/messages.js @@ -317,7 +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', + collapse_subject: 'Collapse posts with subjects', 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/main.js b/src/main.js index df271ce3..06f8a6ec 100644 --- a/src/main.js +++ b/src/main.js @@ -45,6 +45,7 @@ Vue.use(VueChatScroll) const persistedStateOptions = { paths: [ + 'config.collapseMessageWithSubject', 'config.hideAttachments', 'config.hideAttachmentsInConv', 'config.hideNsfw', @@ -95,7 +96,7 @@ window.fetch('/api/statusnet/config.json') window.fetch('/static/config.json') .then((res) => res.json()) .then((data) => { - const {theme, background, logo, showWhoToFollowPanel, whoToFollowProvider, whoToFollowLink, showInstanceSpecificPanel, scopeOptionsEnabled} = data + const {theme, background, logo, showWhoToFollowPanel, whoToFollowProvider, whoToFollowLink, showInstanceSpecificPanel, scopeOptionsEnabled, collapseMessageWithSubject} = data store.dispatch('setOption', { name: 'theme', value: theme }) store.dispatch('setOption', { name: 'background', value: background }) store.dispatch('setOption', { name: 'logo', value: logo }) @@ -104,6 +105,7 @@ window.fetch('/static/config.json') store.dispatch('setOption', { name: 'whoToFollowLink', value: whoToFollowLink }) store.dispatch('setOption', { name: 'showInstanceSpecificPanel', value: showInstanceSpecificPanel }) store.dispatch('setOption', { name: 'scopeOptionsEnabled', value: scopeOptionsEnabled }) + store.dispatch('setOption', { name: 'collapseMessageWithSubject', value: collapseMessageWithSubject }) if (data['chatDisabled']) { store.dispatch('disableChat') } diff --git a/src/modules/config.js b/src/modules/config.js index eafe90ce..60210a95 100644 --- a/src/modules/config.js +++ b/src/modules/config.js @@ -4,10 +4,10 @@ import StyleSetter from '../services/style_setter/style_setter.js' const defaultState = { name: 'Pleroma FE', colors: {}, + collapseMessageWithSubject: false, hideAttachments: false, hideAttachmentsInConv: false, hideNsfw: true, - expandCW: false, loopVideo: true, loopVideoSilentOnly: true, autoLoad: true, diff --git a/static/config.json b/static/config.json index 4dacfebe..62b85aae 100644 --- a/static/config.json +++ b/static/config.json @@ -11,5 +11,6 @@ "whoToFollowLink": "https://vinayaka.distsn.org/?{{host}}+{{user}}", "whoToFollowLinkDummy2": "https://followlink.osa-p.net/recommend.html", "showInstanceSpecificPanel": false, - "scopeOptionsEnabled": false + "scopeOptionsEnabled": false, + "collapseMessageWithSubject": false }