diff options
author | niu tech <jerzyglowacki@gmail.com> | 2021-09-15 10:39:27 +0200 |
---|---|---|
committer | GitHub <noreply@github.com> | 2021-09-15 10:39:27 +0200 |
commit | e2f440ff2dd5179e2d9bc8dea119fc4fe7c562a1 (patch) | |
tree | 2f8a1e012c4c13b2c3e7eb243277bef951b67378 /src/stores | |
parent | docs: fix link in bug_report template [skip ci] (diff) | |
download | ferdium-app-e2f440ff2dd5179e2d9bc8dea119fc4fe7c562a1.tar.gz ferdium-app-e2f440ff2dd5179e2d9bc8dea119fc4fe7c562a1.tar.zst ferdium-app-e2f440ff2dd5179e2d9bc8dea119fc4fe7c562a1.zip |
Enable Split View Mode (#1926)
Diffstat (limited to 'src/stores')
-rw-r--r-- | src/stores/ServicesStore.js | 18 | ||||
-rw-r--r-- | src/stores/UIStore.ts | 21 |
2 files changed, 38 insertions, 1 deletions
diff --git a/src/stores/ServicesStore.js b/src/stores/ServicesStore.js index 67fd4103f..16defb327 100644 --- a/src/stores/ServicesStore.js +++ b/src/stores/ServicesStore.js | |||
@@ -163,6 +163,13 @@ export default class ServicesStore extends Store { | |||
163 | ); | 163 | ); |
164 | 164 | ||
165 | reaction( | 165 | reaction( |
166 | () => this.stores.settings.app.splitMode, | ||
167 | () => { | ||
168 | this._shareSettingsWithServiceProcess(); | ||
169 | }, | ||
170 | ); | ||
171 | |||
172 | reaction( | ||
166 | () => this.stores.settings.app.searchEngine, | 173 | () => this.stores.settings.app.searchEngine, |
167 | () => { | 174 | () => { |
168 | this._shareSettingsWithServiceProcess(); | 175 | this._shareSettingsWithServiceProcess(); |
@@ -667,12 +674,21 @@ export default class ServicesStore extends Store { | |||
667 | } | 674 | } |
668 | } | 675 | } |
669 | 676 | ||
670 | @action _focusActiveService() { | 677 | @action _focusActiveService(focusEvent = null) { |
671 | if (this.stores.user.isLoggedIn) { | 678 | if (this.stores.user.isLoggedIn) { |
672 | // TODO: add checks to not focus service when router path is /settings or /auth | 679 | // TODO: add checks to not focus service when router path is /settings or /auth |
673 | const service = this.active; | 680 | const service = this.active; |
674 | if (service) { | 681 | if (service) { |
675 | this._focusService({ serviceId: service.id }); | 682 | this._focusService({ serviceId: service.id }); |
683 | if (this.stores.settings.app.splitMode && !focusEvent) { | ||
684 | setTimeout(() => { | ||
685 | document.querySelector('.services__webview-wrapper.is-active').scrollIntoView({ | ||
686 | behavior: 'smooth', | ||
687 | block: 'end', | ||
688 | inline: 'nearest', | ||
689 | }); | ||
690 | }, 10); | ||
691 | } | ||
676 | } else { | 692 | } else { |
677 | debug('No service is active'); | 693 | debug('No service is active'); |
678 | } | 694 | } |
diff --git a/src/stores/UIStore.ts b/src/stores/UIStore.ts index ec48eeb40..6ab63c2ee 100644 --- a/src/stores/UIStore.ts +++ b/src/stores/UIStore.ts | |||
@@ -51,6 +51,13 @@ export default class UIStore extends Store { | |||
51 | }, | 51 | }, |
52 | { fireImmediately: true }, | 52 | { fireImmediately: true }, |
53 | ); | 53 | ); |
54 | reaction( | ||
55 | () => this.isSplitModeActive, | ||
56 | () => { | ||
57 | this._setupModeInDOM(); | ||
58 | }, | ||
59 | { fireImmediately: true }, | ||
60 | ); | ||
54 | } | 61 | } |
55 | 62 | ||
56 | @computed get showMessageBadgesEvenWhenMuted() { | 63 | @computed get showMessageBadgesEvenWhenMuted() { |
@@ -77,6 +84,10 @@ export default class UIStore extends Store { | |||
77 | ); | 84 | ); |
78 | } | 85 | } |
79 | 86 | ||
87 | @computed get isSplitModeActive() { | ||
88 | return this.stores.settings.app.splitMode; | ||
89 | } | ||
90 | |||
80 | @computed get theme() { | 91 | @computed get theme() { |
81 | const themeId = | 92 | const themeId = |
82 | this.isDarkThemeActive || this.stores.settings.app.darkMode | 93 | this.isDarkThemeActive || this.stores.settings.app.darkMode |
@@ -114,4 +125,14 @@ export default class UIStore extends Store { | |||
114 | body?.classList.add('theme__dark'); | 125 | body?.classList.add('theme__dark'); |
115 | } | 126 | } |
116 | } | 127 | } |
128 | |||
129 | _setupModeInDOM() { | ||
130 | const body = document.querySelector('body'); | ||
131 | |||
132 | if (!this.isSplitModeActive) { | ||
133 | body?.classList.remove('mode__split'); | ||
134 | } else { | ||
135 | body?.classList.add('mode__split'); | ||
136 | } | ||
137 | } | ||
117 | } | 138 | } |