From 0582f19e7c2c6f916b427d5ecfbbb571178ce841 Mon Sep 17 00:00:00 2001 From: Tusooa Zhu Date: Fri, 6 Aug 2021 20:18:27 -0400 Subject: Add tree-style thread display --- src/modules/config.js | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) (limited to 'src/modules/config.js') diff --git a/src/modules/config.js b/src/modules/config.js index 20979174..ec75dbfb 100644 --- a/src/modules/config.js +++ b/src/modules/config.js @@ -12,6 +12,7 @@ const browserLocale = (window.navigator.language || 'en').split('-')[0] export const multiChoiceProperties = [ 'postContentType', 'subjectLineBehavior', + 'conversationDisplay', // tree | linear 'mentionLinkDisplay' // short | full_for_remote | full ] @@ -81,7 +82,8 @@ export const defaultState = { hidePostStats: undefined, // instance default hideUserStats: undefined, // instance default virtualScrolling: undefined, // instance default - sensitiveByDefault: undefined // instance default + sensitiveByDefault: undefined, // instance default + conversationDisplay: undefined // instance default } // caching the instance default properties -- cgit v1.2.3-70-g09d2 From 2e54cf12c76e94f980fbe49f58c080a4a3d17ca4 Mon Sep 17 00:00:00 2001 From: Tusooa Zhu Date: Sat, 7 Aug 2021 20:14:14 -0400 Subject: Add settings for max depth in thread --- src/components/conversation/conversation.js | 15 ++++++++++----- src/components/settings_modal/tabs/general_tab.vue | 13 +++++++++++++ src/modules/config.js | 3 ++- src/modules/instance.js | 1 + 4 files changed, 26 insertions(+), 6 deletions(-) (limited to 'src/modules/config.js') diff --git a/src/components/conversation/conversation.js b/src/components/conversation/conversation.js index 8e4eda51..853161df 100644 --- a/src/components/conversation/conversation.js +++ b/src/components/conversation/conversation.js @@ -74,7 +74,11 @@ const conversation = { }, computed: { maxDepthToShowByDefault () { - return 4 + // maxDepthInThread = max number of depths that is *visible* + // since our depth starts with 0 and "showing" means "showing children" + // there is a -2 here + const maxDepth = this.$store.getters.mergedConfig.maxDepthInThread - 2 + return maxDepth >= 1 ? maxDepth : 1 }, displayStyle () { return this.$store.getters.mergedConfig.conversationDisplay @@ -351,7 +355,8 @@ const conversation = { } this._diven = true const parentOrSelf = this.parentOrSelf(this.originalStatusId) - if (this.threadDisplayStatus[this.statusId] === 'hidden') { + // If current status is not visible + if (this.threadDisplayStatus[parentOrSelf] === 'hidden') { this.diveIntoStatus(parentOrSelf, /* preventScroll */ true) this.tryScrollTo(this.statusId) } @@ -429,7 +434,7 @@ const conversation = { toggleStatusContentProperty (id, name) { this.setStatusContentProperty(id, name, !this.statusContentProperties[id][name]) }, - leastShowingAncestor (id) { + leastVisibleAncestor (id) { let cur = id let parent = this.parentOf(cur) while (cur) { @@ -453,14 +458,14 @@ const conversation = { const oldHighlight = this.highlight this.diveHistory = [...this.diveHistory.slice(0, this.diveHistory.length - 1)] if (oldHighlight) { - this.tryScrollTo(this.leastShowingAncestor(oldHighlight)) + this.tryScrollTo(this.leastVisibleAncestor(oldHighlight)) } }, undive () { const oldHighlight = this.highlight this.diveHistory = [] if (oldHighlight) { - this.tryScrollTo(this.leastShowingAncestor(oldHighlight)) + this.tryScrollTo(this.leastVisibleAncestor(oldHighlight)) } else { this.goToCurrent() } diff --git a/src/components/settings_modal/tabs/general_tab.vue b/src/components/settings_modal/tabs/general_tab.vue index 8951c021..f97d92c3 100644 --- a/src/components/settings_modal/tabs/general_tab.vue +++ b/src/components/settings_modal/tabs/general_tab.vue @@ -161,6 +161,19 @@ {{ $t('settings.conversation_display') }} +
  • + + +
  • Date: Sun, 5 Sep 2021 16:35:47 -0400 Subject: Make position of other replies button a pref --- src/components/conversation/conversation.js | 9 +++++ src/components/conversation/conversation.vue | 7 ++-- src/components/settings_modal/tabs/general_tab.js | 5 +++ src/components/settings_modal/tabs/general_tab.vue | 40 +++++++++++++++------- src/components/status/status.js | 1 + src/components/status/status.vue | 15 +++++++- src/modules/config.js | 2 ++ src/modules/instance.js | 1 + 8 files changed, 63 insertions(+), 17 deletions(-) (limited to 'src/modules/config.js') diff --git a/src/components/conversation/conversation.js b/src/components/conversation/conversation.js index 423930af..d4972fbc 100644 --- a/src/components/conversation/conversation.js +++ b/src/components/conversation/conversation.js @@ -92,6 +92,15 @@ const conversation = { isLinearView () { return this.displayStyle === 'linear' }, + otherRepliesButtonPosition () { + return this.$store.getters.mergedConfig.conversationOtherRepliesButton + }, + showOtherRepliesButtonBelowStatus () { + return this.otherRepliesButtonPosition === 'below' + }, + showOtherRepliesButtonInsideStatus () { + return this.otherRepliesButtonPosition === 'inside' + }, hideStatus () { if (this.$refs.statusComponent && this.$refs.statusComponent[0]) { return this.virtualHidden && this.$refs.statusComponent[0].suspendable diff --git a/src/components/conversation/conversation.vue b/src/components/conversation/conversation.vue index f0eb88c1..b3d97075 100644 --- a/src/components/conversation/conversation.vue +++ b/src/components/conversation/conversation.vue @@ -66,13 +66,14 @@ :profile-user-id="profileUserId" class="conversation-status status-fadein panel-body" - :simple="treeViewIsSimple" + :simple-tree="treeViewIsSimple" :toggle-thread-display="toggleThreadDisplay" :thread-display-status="threadDisplayStatus" :show-thread-recursively="showThreadRecursively" :total-reply-count="totalReplyCount" :total-reply-depth="totalReplyDepth" - :dive="(!treeViewIsSimple) ? () => diveIntoStatus(status.id) : null" + :show-other-replies-as-button="showOtherRepliesButtonInsideStatus" + :dive="() => diveIntoStatus(status.id)" :controlled-showing-tall="statusContentProperties[status.id].showingTall" :controlled-expanding-subject="statusContentProperties[status.id].expandingSubject" @@ -85,7 +86,7 @@ @toggleExpanded="toggleExpanded" />
    ({ + key: mode, + value: mode, + label: this.$t(`settings.conversation_other_replies_button_${mode}`) + })), mentionLinkDisplayOptions: ['short', 'full_for_remote', 'full'].map(mode => ({ key: mode, value: mode, diff --git a/src/components/settings_modal/tabs/general_tab.vue b/src/components/settings_modal/tabs/general_tab.vue index f97d92c3..d5ae7810 100644 --- a/src/components/settings_modal/tabs/general_tab.vue +++ b/src/components/settings_modal/tabs/general_tab.vue @@ -161,19 +161,33 @@ {{ $t('settings.conversation_display') }}
    • -
  • - - -
    • +
  • - {{ $t('status.replies_list') }} + + + {{ $t('status.replies_list') }} + Date: Sun, 6 Mar 2022 13:57:48 -0500 Subject: Split conversation display style into two different settings linear => linear (now default) simple_tree => tree / conversationTreeAdvanced=false tree => tree / conversationTreeAdvanced=true --- src/components/conversation/conversation.js | 4 ++-- src/components/settings_modal/tabs/general_tab.js | 2 +- src/components/settings_modal/tabs/general_tab.vue | 5 +++++ src/modules/config.js | 1 + src/modules/instance.js | 3 ++- 5 files changed, 11 insertions(+), 4 deletions(-) (limited to 'src/modules/config.js') diff --git a/src/components/conversation/conversation.js b/src/components/conversation/conversation.js index b9ebe7eb..46228e37 100644 --- a/src/components/conversation/conversation.js +++ b/src/components/conversation/conversation.js @@ -81,10 +81,10 @@ const conversation = { return this.$store.getters.mergedConfig.conversationDisplay }, isTreeView () { - return this.displayStyle === 'tree' || this.displayStyle === 'simple_tree' + return !this.isLinearView }, treeViewIsSimple () { - return this.displayStyle === 'simple_tree' + return !this.$store.getters.mergedConfig.conversationTreeAdvanced }, isLinearView () { return this.displayStyle === 'linear' diff --git a/src/components/settings_modal/tabs/general_tab.js b/src/components/settings_modal/tabs/general_tab.js index a963d204..8ae0021c 100644 --- a/src/components/settings_modal/tabs/general_tab.js +++ b/src/components/settings_modal/tabs/general_tab.js @@ -20,7 +20,7 @@ const GeneralTab = { value: mode, label: this.$t(`settings.subject_line_${mode === 'masto' ? 'mastodon' : mode}`) })), - conversationDisplayOptions: ['tree', 'simple_tree', 'linear'].map(mode => ({ + conversationDisplayOptions: ['tree', 'linear'].map(mode => ({ key: mode, value: mode, label: this.$t(`settings.conversation_display_${mode}`) diff --git a/src/components/settings_modal/tabs/general_tab.vue b/src/components/settings_modal/tabs/general_tab.vue index d5ae7810..28b39d7b 100644 --- a/src/components/settings_modal/tabs/general_tab.vue +++ b/src/components/settings_modal/tabs/general_tab.vue @@ -165,6 +165,11 @@ v-if="conversationDisplay !== 'linear'" class="setting-list suboptions" > +
  • + + {{ $t('settings.tree_advanced') }} + +
    • +
  • + + {{ $t('settings.tree_fade_ancestors') }} + +