Dereku/snappymail
1
0
Fork 0
mirror of https://github.com/the-djmaze/snappymail.git synced 2026-07-13 03:27:39 +03:00
Code Issues Projects Releases Packages Wiki Activity Actions

Bugfix and improve layout change handling

Browse source
This commit is contained in:
djmaze 2021-03-19 10:09:30 +01:00
parent 407a69e100
commit 46531c7831
2 changed files with 16 additions and 11 deletions
Download patch file Download diff file Expand all files Collapse all files

17
dev/App/User.js
View file

@ -845,24 +845,25 @@ class AppUser extends AbstractApp {
initHorizontalLayoutResizer() { initHorizontalLayoutResizer() {
const top = doc.querySelector('.b-message-list-wrapper'), const top = doc.querySelector('.b-message-list-wrapper'),
bottom = doc.querySelector('.b-message-view-wrapper'), bottom = doc.querySelector('.b-message-view-wrapper'),
fDisable = bDisable => { fToggle = () => {
this.setLayoutResizer(top, bottom, ClientSideKeyName.MessageListSize, this.setLayoutResizer(top, bottom, ClientSideKeyName.MessageListSize,
(bDisable || !$htmlCL.contains('rl-bottom-preview-pane')) ? null : 'height'); (ThemeStore.isMobile() || Layout.BottomPreview !== SettingsUserStore.layout()) ? null : 'height');
}; };
if (top && bottom) { if (top && bottom) {
fDisable(ThemeStore.isMobile()); fToggle();
addEventListener('rl-layout', e => fDisable(Layout.BottomPreview !== e.detail)); addEventListener('rl-layout', fToggle);
} }
} }
initVerticalLayoutResizer() { initVerticalLayoutResizer() {
const left = elementById('rl-left'), const left = elementById('rl-left'),
right = elementById('rl-right'), right = elementById('rl-right'),
fDisable = bDisable => fToggle = () =>
this.setLayoutResizer(left, right, ClientSideKeyName.FolderListSize, bDisable ? null : 'width'); this.setLayoutResizer(left, right, ClientSideKeyName.FolderListSize,
(ThemeStore.isMobile() || leftPanelDisabled()) ? null : 'width');
if (left && right) { if (left && right) {
fDisable(ThemeStore.isMobile()); fToggle();
leftPanelDisabled.subscribe(value => fDisable(value)); leftPanelDisabled.subscribe(fToggle);
} }
} }

10
dev/Stores/User/Settings.js
View file

@ -10,7 +10,7 @@ export const SettingsUserStore = new class {
constructor() { constructor() {
this.layout = ko this.layout = ko
.observable(pInt(SettingsGet('Layout'))) .observable(pInt(SettingsGet('Layout')))
.extend({ limitedList: [Layout.SidePreview, Layout.BottomPreview, Layout.NoPreview] }); .extend({ limitedList: Object.values(Layout) });
this.editorDefaultType = ko.observable(SettingsGet('EditorDefaultType')).extend({ this.editorDefaultType = ko.observable(SettingsGet('EditorDefaultType')).extend({
limitedList: [ limitedList: [
@ -36,12 +36,16 @@ export const SettingsUserStore = new class {
this.usePreviewPane = ko.computed(() => Layout.NoPreview !== this.layout() && !ThemeStore.isMobile()); this.usePreviewPane = ko.computed(() => Layout.NoPreview !== this.layout() && !ThemeStore.isMobile());
this.layout.subscribe(value => { const toggleLayout = () => {
const value = ThemeStore.isMobile() ? Layout.NoPreview : this.layout();
$htmlCL.toggle('rl-no-preview-pane', Layout.NoPreview === value); $htmlCL.toggle('rl-no-preview-pane', Layout.NoPreview === value);
$htmlCL.toggle('rl-side-preview-pane', Layout.SidePreview === value); $htmlCL.toggle('rl-side-preview-pane', Layout.SidePreview === value);
$htmlCL.toggle('rl-bottom-preview-pane', Layout.BottomPreview === value); $htmlCL.toggle('rl-bottom-preview-pane', Layout.BottomPreview === value);
dispatchEvent(new CustomEvent('rl-layout', {detail:value})); dispatchEvent(new CustomEvent('rl-layout', {detail:value}));
}); };
this.layout.subscribe(toggleLayout);
ThemeStore.isMobile.subscribe(toggleLayout);
toggleLayout();
let iAutoLogoutTimer; let iAutoLogoutTimer;
this.delayLogout = (() => { this.delayLogout = (() => {