From 4a068483ed9b1334780402cbe64dfa3f4a0e8a3a Mon Sep 17 00:00:00 2001 From: Henry Jameson Date: Tue, 5 Apr 2022 18:38:05 +0300 Subject: wide mode initial implementation + cleanup --- src/modules/interface.js | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) (limited to 'src/modules/interface.js') diff --git a/src/modules/interface.js b/src/modules/interface.js index 17277331..9df72b88 100644 --- a/src/modules/interface.js +++ b/src/modules/interface.js @@ -13,7 +13,7 @@ const defaultState = { window.CSS.supports('-webkit-filter', 'drop-shadow(0 0)') ) }, - mobileLayout: false, + layoutType: 'normal', globalNotices: [], layoutHeight: 0, lastTimeline: null @@ -36,8 +36,8 @@ const interfaceMod = { setNotificationPermission (state, permission) { state.notificationPermission = permission }, - setMobileLayout (state, value) { - state.mobileLayout = value + setLayoutType (state, value) { + state.layoutType = value }, closeSettingsModal (state) { state.settingsModalState = 'hidden' @@ -86,8 +86,8 @@ const interfaceMod = { setNotificationPermission ({ commit }, permission) { commit('setNotificationPermission', permission) }, - setMobileLayout ({ commit }, value) { - commit('setMobileLayout', value) + setLayoutType ({ commit }, value) { + commit('setLayoutType', value) }, closeSettingsModal ({ commit }) { commit('closeSettingsModal') -- cgit v1.2.3-70-g09d2 From 3d37b9d8e1cad78fb1f666b3cfb7f28b1fdc1c2d Mon Sep 17 00:00:00 2001 From: Henry Jameson Date: Tue, 12 Apr 2022 21:18:06 +0300 Subject: unified layout-setting code and made an option to control or disable third column behavior --- src/App.js | 20 +++++++++--------- src/boot/after_store.js | 9 +++----- src/components/settings_modal/tabs/general_tab.js | 5 +++++ src/components/settings_modal/tabs/general_tab.vue | 9 ++++++++ src/modules/config.js | 4 ++++ src/modules/interface.js | 24 +++++++++++++++++++--- 6 files changed, 52 insertions(+), 19 deletions(-) (limited to 'src/modules/interface.js') diff --git a/src/App.js b/src/App.js index 9cfaf4fa..19c58595 100644 --- a/src/App.js +++ b/src/App.js @@ -98,22 +98,22 @@ export default { }, layoutType () { return this.$store.state.interface.layoutType }, privateMode () { return this.$store.state.instance.private }, - reverseLayout () { return this.$store.getters.mergedConfig.sidebarRight }, + reverseLayout () { + const { thirdColumnMode, sidebarRight: reverseSetting } = this.$store.getters.mergedConfig + if (this.layoutType !== 'wide') { + return reverseSetting + } else { + return thirdColumnMode === 'notifications' ? reverseSetting : !reverseSetting + } + }, noSticky () { return this.$store.getters.mergedConfig.disableStickyHeaders }, showScrollbars () { return this.$store.getters.mergedConfig.showScrollbars }, ...mapGetters(['mergedConfig']) }, methods: { updateMobileState () { - const mobileLayout = windowWidth() <= 800 - const wideLayout = windowWidth() >= 1300 - const layoutHeight = windowHeight() - const layoutType = wideLayout ? 'wide' : (mobileLayout ? 'mobile' : 'normal') - const changed = layoutType !== this.layoutType - if (changed) { - this.$store.dispatch('setLayoutType', layoutType) - } - this.$store.dispatch('setLayoutHeight', layoutHeight) + this.$store.dispatch('setLayoutWidth', windowWidth()) + this.$store.dispatch('setLayoutHeight', windowHeight()) } } } diff --git a/src/boot/after_store.js b/src/boot/after_store.js index ce96141d..f655c38f 100644 --- a/src/boot/after_store.js +++ b/src/boot/after_store.js @@ -8,7 +8,7 @@ import App from '../App.vue' import routes from './routes' import VBodyScrollLock from 'src/directives/body_scroll_lock' -import { windowWidth } from '../services/window_utils/window_utils' +import { windowWidth, windowHeight } from '../services/window_utils/window_utils' import { getOrCreateApp, getClientToken } from '../services/new_api/oauth.js' import backendInteractorService from '../services/backend_interactor_service/backend_interactor_service.js' import { CURRENT_VERSION } from '../services/theme_data/theme_data.service.js' @@ -332,11 +332,8 @@ const checkOAuthToken = async ({ store }) => { } const afterStoreSetup = async ({ store, i18n }) => { - // TODO cleanup copypasta - const mobileLayout = windowWidth() <= 800 - const wideLayout = windowWidth() >= 1300 - const layoutType = wideLayout ? 'wide' : (mobileLayout ? 'mobile' : 'normal') - store.dispatch('setLayoutType', layoutType) + store.dispatch('setLayoutWidth', windowWidth()) + store.dispatch('setLayoutHeight', windowHeight()) FaviconService.initFaviconService() diff --git a/src/components/settings_modal/tabs/general_tab.js b/src/components/settings_modal/tabs/general_tab.js index 62d86176..89505cb3 100644 --- a/src/components/settings_modal/tabs/general_tab.js +++ b/src/components/settings_modal/tabs/general_tab.js @@ -38,6 +38,11 @@ const GeneralTab = { value: mode, label: this.$t(`settings.mention_link_display_${mode}`) })), + thirdColumnModeOptions: ['none', 'notifications', 'postform'].map(mode => ({ + key: mode, + value: mode, + label: this.$t(`settings.conversation_display_${mode}`) + })), loopSilentAvailable: // Firefox Object.getOwnPropertyDescriptor(HTMLVideoElement.prototype, 'mozHasAudio') || diff --git a/src/components/settings_modal/tabs/general_tab.vue b/src/components/settings_modal/tabs/general_tab.vue index e29bc7cf..db8718cf 100644 --- a/src/components/settings_modal/tabs/general_tab.vue +++ b/src/components/settings_modal/tabs/general_tab.vue @@ -70,6 +70,15 @@ {{ $t('settings.show_scrollbars') }} +
  • + + {{ $t('settings.third_column_mode') }} + +
  • = 1300 + commit('setLayoutType', wideLayout ? 'wide' : normalOrMobile) + } + }, setLastTimeline ({ commit }, value) { commit('setLastTimeline', value) } -- cgit v1.2.3-70-g09d2 From edbbbaad48311d5d791183f724e819926c09e638 Mon Sep 17 00:00:00 2001 From: Henry Jameson Date: Mon, 9 May 2022 23:24:35 +0300 Subject: don't use wide mode for anon viewers --- src/components/settings_modal/tabs/general_tab.vue | 1 + src/modules/interface.js | 4 ++-- 2 files changed, 3 insertions(+), 2 deletions(-) (limited to 'src/modules/interface.js') diff --git a/src/components/settings_modal/tabs/general_tab.vue b/src/components/settings_modal/tabs/general_tab.vue index db8718cf..79c69449 100644 --- a/src/components/settings_modal/tabs/general_tab.vue +++ b/src/components/settings_modal/tabs/general_tab.vue @@ -72,6 +72,7 @@
  • = 1300 -- cgit v1.2.3-70-g09d2