mirror of
https://github.com/the-djmaze/snappymail.git
synced 2026-08-29 20:19:22 +03:00
Cleanup and improve HTML/CSS and it's JavaScript handling
This commit is contained in:
parent
6273869b32
commit
2e34f98c80
26 changed files with 516 additions and 598 deletions
|
|
@ -10,7 +10,6 @@ import { AppUserStore } from 'Stores/User/App';
|
|||
import { SettingsUserStore } from 'Stores/User/Settings';
|
||||
import { FolderUserStore } from 'Stores/User/Folder';
|
||||
import { MessageUserStore } from 'Stores/User/Message';
|
||||
import { ThemeStore } from 'Stores/Theme';
|
||||
|
||||
import { showScreenPopup } from 'Knoin/Knoin';
|
||||
import { AbstractViewLeft } from 'Knoin/AbstractViews';
|
||||
|
|
@ -40,8 +39,6 @@ export class MailFolderList extends AbstractViewLeft {
|
|||
this.allowContacts = AppUserStore.allowContacts();
|
||||
|
||||
addComputablesTo(this, {
|
||||
folderListFocused: () => Scope.FolderList === AppUserStore.focusedState(),
|
||||
|
||||
folderListVisible: () => {
|
||||
let multiple = false,
|
||||
inbox, visible,
|
||||
|
|
@ -85,7 +82,6 @@ export class MailFolderList extends AbstractViewLeft {
|
|||
|
||||
el = eqs(event, 'a');
|
||||
if (el && el.matches('.selectable')) {
|
||||
ThemeStore.isMobile() && leftPanelDisabled(true);
|
||||
event.preventDefault();
|
||||
const folder = ko.dataFor(el);
|
||||
if (folder) {
|
||||
|
|
@ -120,7 +116,7 @@ export class MailFolderList extends AbstractViewLeft {
|
|||
|
||||
shortcuts.add('arrowup,arrowdown', '', Scope.FolderList, event => {
|
||||
let items = [], index = 0;
|
||||
dom.querySelectorAll('.b-folders li a:not(.hidden)').forEach(node => {
|
||||
dom.querySelectorAll('li a:not(.hidden)').forEach(node => {
|
||||
if (node.offsetHeight || node.getClientRects().length) {
|
||||
items.push(node);
|
||||
if (node.matches('.focused')) {
|
||||
|
|
@ -143,7 +139,7 @@ export class MailFolderList extends AbstractViewLeft {
|
|||
});
|
||||
|
||||
shortcuts.add('enter,open', '', Scope.FolderList, () => {
|
||||
const item = qs('.b-folders li a:not(.hidden).focused');
|
||||
const item = qs('li a:not(.hidden).focused');
|
||||
if (item) {
|
||||
AppUserStore.focusedState(Scope.MessageList);
|
||||
item.click();
|
||||
|
|
@ -153,7 +149,7 @@ export class MailFolderList extends AbstractViewLeft {
|
|||
});
|
||||
|
||||
shortcuts.add('space', '', Scope.FolderList, () => {
|
||||
const item = qs('.b-folders li a:not(.hidden).focused'),
|
||||
const item = qs('li a:not(.hidden).focused'),
|
||||
folder = item && ko.dataFor(item);
|
||||
if (folder) {
|
||||
const collapsed = folder.collapsed();
|
||||
|
|
@ -172,10 +168,10 @@ export class MailFolderList extends AbstractViewLeft {
|
|||
});
|
||||
|
||||
AppUserStore.focusedState.subscribe(value => {
|
||||
let el = qs('.b-folders li a.focused');
|
||||
let el = qs('li a.focused');
|
||||
el && el.classList.remove('focused');
|
||||
if (Scope.FolderList === value) {
|
||||
el = qs('.b-folders li a.selected');
|
||||
el = qs('li a.selected');
|
||||
el && el.classList.add('focused');
|
||||
}
|
||||
});
|
||||
|
|
|
|||
|
|
@ -69,9 +69,10 @@ export class MailMessageList extends AbstractViewRight {
|
|||
);
|
||||
|
||||
this.composeInEdit = AppUserStore.composeInEdit;
|
||||
|
||||
this.isMobile = ThemeStore.isMobile;
|
||||
this.leftPanelDisabled = leftPanelDisabled;
|
||||
|
||||
this.isMessageSelected = MessageUserStore.isMessageSelected;
|
||||
this.messageListSearch = MessageUserStore.listSearch;
|
||||
this.messageListError = MessageUserStore.listError;
|
||||
|
||||
|
|
@ -167,8 +168,6 @@ export class MailMessageList extends AbstractViewRight {
|
|||
|
||||
mobileCheckedStateHide: () => ThemeStore.isMobile() ? !MessageUserStore.listChecked().length : true,
|
||||
|
||||
messageListFocused: () => Scope.MessageList === AppUserStore.focusedState(),
|
||||
|
||||
sortText: () => {
|
||||
let mode = FolderUserStore.sortMode(),
|
||||
desc = '' === mode || mode.includes('REVERSE');
|
||||
|
|
@ -338,20 +337,6 @@ export class MailMessageList extends AbstractViewRight {
|
|||
}
|
||||
}
|
||||
|
||||
hideLeft(item, event) {
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
|
||||
leftPanelDisabled(true);
|
||||
}
|
||||
|
||||
showLeft(item, event) {
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
|
||||
leftPanelDisabled(false);
|
||||
}
|
||||
|
||||
composeClick() {
|
||||
showMessageComposer();
|
||||
}
|
||||
|
|
@ -683,14 +668,14 @@ export class MailMessageList extends AbstractViewRight {
|
|||
}
|
||||
|
||||
onBuild(dom) {
|
||||
const eqs = (ev, s) => ev.target.closestWithin('.messageList '+s, dom);
|
||||
const eqs = (ev, s) => ev.target.closestWithin(s, dom);
|
||||
|
||||
this.selector.init(dom.querySelector('.b-content'), Scope.MessageList);
|
||||
|
||||
dom.addEventListener('click', event => {
|
||||
ThemeStore.isMobile() && leftPanelDisabled(true);
|
||||
ThemeStore.isMobile() && !eqs(event, '.toggleLeft') && leftPanelDisabled(true);
|
||||
|
||||
if (eqs(event, '.b-message-list-wrapper') && Scope.MessageView === AppUserStore.focusedState()) {
|
||||
if (eqs(event, '.messageList') && Scope.MessageView === AppUserStore.focusedState()) {
|
||||
AppUserStore.focusedState(Scope.MessageList);
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -81,7 +81,6 @@ export class MailMessageView extends AbstractViewRight {
|
|||
this.hasCheckedMessages = MessageUserStore.hasCheckedMessages;
|
||||
this.messageLoadingThrottle = MessageUserStore.messageLoading;
|
||||
this.messagesBodiesDom = MessageUserStore.messagesBodiesDom;
|
||||
this.isMessageSelected = MessageUserStore.isMessageSelected;
|
||||
this.messageActiveDom = MessageUserStore.messageActiveDom;
|
||||
this.messageError = MessageUserStore.messageError;
|
||||
|
||||
|
|
@ -177,8 +176,6 @@ export class MailMessageView extends AbstractViewRight {
|
|||
return '';
|
||||
},
|
||||
|
||||
messageFocused: () => Scope.MessageView === AppUserStore.focusedState(),
|
||||
|
||||
messageListAndMessageViewLoading:
|
||||
() => MessageUserStore.listCompleteLoading() || MessageUserStore.messageLoading()
|
||||
});
|
||||
|
|
|
|||
|
|
@ -4,8 +4,6 @@ import { getFolderInboxName } from 'Common/Cache';
|
|||
|
||||
import { AbstractViewLeft } from 'Knoin/AbstractViews';
|
||||
|
||||
import { ThemeStore } from 'Stores/Theme';
|
||||
|
||||
export class MenuSettingsUserView extends AbstractViewLeft {
|
||||
/**
|
||||
* @param {Object} screen
|
||||
|
|
@ -18,14 +16,6 @@ export class MenuSettingsUserView extends AbstractViewLeft {
|
|||
this.menu = screen.menu;
|
||||
}
|
||||
|
||||
onBuild(dom) {
|
||||
dom.addEventListener('click', event =>
|
||||
ThemeStore.isMobile()
|
||||
&& event.target.closestWithin('.b-settins-left nav a', dom)
|
||||
&& leftPanelDisabled(true)
|
||||
);
|
||||
}
|
||||
|
||||
link(route) {
|
||||
return settings(route);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -11,6 +11,7 @@ export class PaneSettingsUserView extends AbstractViewRight {
|
|||
constructor() {
|
||||
super('SettingsPane');
|
||||
|
||||
this.isMobile = ThemeStore.isMobile;
|
||||
this.leftPanelDisabled = leftPanelDisabled;
|
||||
}
|
||||
|
||||
|
|
@ -18,22 +19,10 @@ export class PaneSettingsUserView extends AbstractViewRight {
|
|||
MessageUserStore.message(null);
|
||||
}
|
||||
|
||||
hideLeft(item, event) {
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
|
||||
leftPanelDisabled(true);
|
||||
}
|
||||
|
||||
showLeft(item, event) {
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
|
||||
leftPanelDisabled(false);
|
||||
}
|
||||
|
||||
onBuild(dom) {
|
||||
dom.addEventListener('click', () => ThemeStore.isMobile() && leftPanelDisabled(true));
|
||||
dom.addEventListener('click', () =>
|
||||
ThemeStore.isMobile() && !event.target.closestWithin('.toggleLeft', dom) && leftPanelDisabled(true)
|
||||
);
|
||||
}
|
||||
|
||||
backToMailBoxClick() {
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue