Remove unused properties and improved message view header

This commit is contained in:
djmaze 2021-04-07 16:35:46 +02:00
parent 8620df907e
commit 89cbcf6f63
6 changed files with 59 additions and 71 deletions

View file

@ -211,10 +211,10 @@ export class MessageModel extends AbstractModel {
/** /**
* @param {boolean} friendlyView * @param {boolean} friendlyView
* @param {boolean=} wrapWithLink = false * @param {boolean=} wrapWithLink
* @returns {string} * @returns {string}
*/ */
fromToLine(friendlyView, wrapWithLink = false) { fromToLine(friendlyView, wrapWithLink) {
return this.from.toString(friendlyView, wrapWithLink); return this.from.toString(friendlyView, wrapWithLink);
} }
@ -232,37 +232,37 @@ export class MessageModel extends AbstractModel {
/** /**
* @param {boolean} friendlyView * @param {boolean} friendlyView
* @param {boolean=} wrapWithLink = false * @param {boolean=} wrapWithLink
* @returns {string} * @returns {string}
*/ */
toToLine(friendlyView, wrapWithLink = false) { toToLine(friendlyView, wrapWithLink) {
return this.to.toString(friendlyView, wrapWithLink); return this.to.toString(friendlyView, wrapWithLink);
} }
/** /**
* @param {boolean} friendlyView * @param {boolean} friendlyView
* @param {boolean=} wrapWithLink = false * @param {boolean=} wrapWithLink
* @returns {string} * @returns {string}
*/ */
ccToLine(friendlyView, wrapWithLink = false) { ccToLine(friendlyView, wrapWithLink) {
return this.cc.toString(friendlyView, wrapWithLink); return this.cc.toString(friendlyView, wrapWithLink);
} }
/** /**
* @param {boolean} friendlyView * @param {boolean} friendlyView
* @param {boolean=} wrapWithLink = false * @param {boolean=} wrapWithLink
* @returns {string} * @returns {string}
*/ */
bccToLine(friendlyView, wrapWithLink = false) { bccToLine(friendlyView, wrapWithLink) {
return this.bcc.toString(friendlyView, wrapWithLink); return this.bcc.toString(friendlyView, wrapWithLink);
} }
/** /**
* @param {boolean} friendlyView * @param {boolean} friendlyView
* @param {boolean=} wrapWithLink = false * @param {boolean=} wrapWithLink
* @returns {string} * @returns {string}
*/ */
replyToToLine(friendlyView, wrapWithLink = false) { replyToToLine(friendlyView, wrapWithLink) {
return this.replyTo.toString(friendlyView, wrapWithLink); return this.replyTo.toString(friendlyView, wrapWithLink);
} }
@ -318,7 +318,7 @@ export class MessageModel extends AbstractModel {
* @param {boolean=} last = false * @param {boolean=} last = false
* @returns {Array} * @returns {Array}
*/ */
replyEmails(excludeEmails, last = false) { replyEmails(excludeEmails, last) {
const result = [], const result = [],
unic = undefined === excludeEmails ? {} : excludeEmails; unic = undefined === excludeEmails ? {} : excludeEmails;
@ -339,7 +339,7 @@ export class MessageModel extends AbstractModel {
* @param {boolean=} last = false * @param {boolean=} last = false
* @returns {Array.<Array>} * @returns {Array.<Array>}
*/ */
replyAllEmails(excludeEmails, last = false) { replyAllEmails(excludeEmails, last) {
let data = []; let data = [];
const toResult = [], const toResult = [],
ccResult = [], ccResult = [],
@ -364,7 +364,7 @@ export class MessageModel extends AbstractModel {
/** /**
* @param {boolean=} print = false * @param {boolean=} print = false
*/ */
viewPopupMessage(print = false) { viewPopupMessage(print) {
const timeStampInUTC = this.dateTimeStampInUTC() || 0, const timeStampInUTC = this.dateTimeStampInUTC() || 0,
ccLine = this.ccToLine(false), ccLine = this.ccToLine(false),
m = 0 < timeStampInUTC ? new Date(timeStampInUTC * 1000) : null, m = 0 < timeStampInUTC ? new Date(timeStampInUTC * 1000) : null,

View file

@ -136,15 +136,8 @@
} }
.informationFull { .informationFull {
margin-top: 10px; margin-top: 30px;
border: 1px solid #999;
border-radius: 5px;
padding: 8px 0;
overflow: hidden;
.size {
margin-left: 4px;
}
table { table {
width: 100%; width: 100%;
@ -155,7 +148,7 @@
} }
td { td {
padding: 0 10px; padding: 4px;
vertical-align: top; vertical-align: top;
min-width: 43px; min-width: 43px;
} }
@ -163,17 +156,15 @@
td:first-child { td:first-child {
border-right: 1px solid #999; border-right: 1px solid #999;
text-align: right; text-align: right;
white-space: nowrap;
width: 1%; width: 1%;
} }
.uiLine { .labelTo {
}
.uiLabel {
white-space: nowrap; white-space: nowrap;
} }
.uiLabelValue { td + td {
word-break: break-all; word-break: break-all;
} }
} }

View file

@ -26,7 +26,6 @@ export class FolderListMailBoxUserView extends AbstractViewLeft {
this.composeInEdit = AppUserStore.composeInEdit; this.composeInEdit = AppUserStore.composeInEdit;
this.messageList = MessageUserStore.list;
this.folderList = FolderUserStore.folderList; this.folderList = FolderUserStore.folderList;
this.folderListSystem = FolderUserStore.folderListSystem; this.folderListSystem = FolderUserStore.folderListSystem;
this.foldersChanging = FolderUserStore.foldersChanging; this.foldersChanging = FolderUserStore.foldersChanging;

View file

@ -52,7 +52,6 @@ export class MessageListMailBoxUserView extends AbstractViewRight {
constructor() { constructor() {
super('User/MailBox/MessageList', 'MailMessageList'); super('User/MailBox/MessageList', 'MailMessageList');
this.sLastUid = null;
this.bPrefetch = false; this.bPrefetch = false;
this.emptySubjectValue = ''; this.emptySubjectValue = '';
@ -69,10 +68,8 @@ export class MessageListMailBoxUserView extends AbstractViewRight {
this.popupVisibility = ko.computed(() => 0 < popupVisibilityNames().length); this.popupVisibility = ko.computed(() => 0 < popupVisibilityNames().length);
this.message = MessageUserStore.message;
this.messageList = MessageUserStore.list; this.messageList = MessageUserStore.list;
this.folderList = FolderUserStore.folderList;
this.sortSupported = FolderUserStore.sortSupported; this.sortSupported = FolderUserStore.sortSupported;
this.composeInEdit = AppUserStore.composeInEdit; this.composeInEdit = AppUserStore.composeInEdit;
@ -93,8 +90,6 @@ export class MessageListMailBoxUserView extends AbstractViewRight {
initOnStartOrLangChange(() => this.emptySubjectValue = i18n('MESSAGE_LIST/EMPTY_SUBJECT_TEXT')); initOnStartOrLangChange(() => this.emptySubjectValue = i18n('MESSAGE_LIST/EMPTY_SUBJECT_TEXT'));
this.userQuota = QuotaUserStore.quota;
this.userUsageSize = QuotaUserStore.usage;
this.userUsageProc = QuotaUserStore.percentage; this.userUsageProc = QuotaUserStore.percentage;
this.addObservables({ this.addObservables({
@ -386,7 +381,7 @@ export class MessageListMailBoxUserView extends AbstractViewRight {
return false; return false;
}); });
if (!SettingsUserStore.usePreviewPane() && !this.message()) { if (!SettingsUserStore.usePreviewPane() && !MessageUserStore.message()) {
this.selector.iFocusedNextHelper = up ? -1 : 1; this.selector.iFocusedNextHelper = up ? -1 : 1;
} else { } else {
this.selector.iSelectNextHelper = up ? -1 : 1; this.selector.iSelectNextHelper = up ? -1 : 1;
@ -582,7 +577,7 @@ export class MessageListMailBoxUserView extends AbstractViewRight {
} }
flagMessages(currentMessage) { flagMessages(currentMessage) {
const checked = this.messageListCheckedOrSelected(); const checked = MessageUserStore.listCheckedOrSelected();
if (currentMessage) { if (currentMessage) {
const checkedUids = checked.map(message => message.uid); const checkedUids = checked.map(message => message.uid);
if (checkedUids.includes(currentMessage.uid)) { if (checkedUids.includes(currentMessage.uid)) {
@ -602,7 +597,7 @@ export class MessageListMailBoxUserView extends AbstractViewRight {
} }
flagMessagesFast(bFlag) { flagMessagesFast(bFlag) {
const checked = this.messageListCheckedOrSelected(); const checked = MessageUserStore.listCheckedOrSelected();
if (checked.length) { if (checked.length) {
if (undefined === bFlag) { if (undefined === bFlag) {
const flagged = checked.filter(message => message.isFlagged()); const flagged = checked.filter(message => message.isFlagged());
@ -622,7 +617,7 @@ export class MessageListMailBoxUserView extends AbstractViewRight {
} }
seenMessagesFast(seen) { seenMessagesFast(seen) {
const checked = this.messageListCheckedOrSelected(); const checked = MessageUserStore.listCheckedOrSelected();
if (checked.length) { if (checked.length) {
if (undefined === seen) { if (undefined === seen) {
const unseen = checked.filter(message => message.isUnseen()); const unseen = checked.filter(message => message.isUnseen());
@ -711,7 +706,7 @@ export class MessageListMailBoxUserView extends AbstractViewRight {
initShortcuts() { initShortcuts() {
shortcuts.add('enter,open', '', Scope.MessageList, () => { shortcuts.add('enter,open', '', Scope.MessageList, () => {
if (this.message() && this.useAutoSelect()) { if (MessageUserStore.message() && this.useAutoSelect()) {
dispatchEvent(new CustomEvent('mailbox.message-view.toggle-full-screen')); dispatchEvent(new CustomEvent('mailbox.message-view.toggle-full-screen'));
return false; return false;
} }
@ -842,7 +837,7 @@ export class MessageListMailBoxUserView extends AbstractViewRight {
return false; return false;
}); });
shortcuts.add('tab,arrowright', '', Scope.MessageList, () => { shortcuts.add('tab,arrowright', '', Scope.MessageList, () => {
this.message() && AppUserStore.focusedState(Scope.MessageView); MessageUserStore.message() && AppUserStore.focusedState(Scope.MessageView);
return false; return false;
}); });
@ -882,9 +877,9 @@ export class MessageListMailBoxUserView extends AbstractViewRight {
quotaTooltip() { quotaTooltip() {
return i18n('MESSAGE_LIST/QUOTA_SIZE', { return i18n('MESSAGE_LIST/QUOTA_SIZE', {
SIZE: FileInfo.friendlySize(this.userUsageSize()), SIZE: FileInfo.friendlySize(QuotaUserStore.usage()),
PROC: this.userUsageProc(), PROC: QuotaUserStore.percentage(),
LIMIT: FileInfo.friendlySize(this.userQuota()) LIMIT: FileInfo.friendlySize(QuotaUserStore.quota())
}).replace(/<[^>]+>/g, ''); }).replace(/<[^>]+>/g, '');
} }

View file

@ -217,11 +217,11 @@ class MessageViewMailBoxUserView extends AbstractViewRight {
this.viewFromShort(message.fromToLine(true, true)); this.viewFromShort(message.fromToLine(true, true));
this.viewFromDkimData(message.fromDkimData()); this.viewFromDkimData(message.fromDkimData());
this.viewToShort(message.toToLine(true, true)); this.viewToShort(message.toToLine(true, true));
this.viewFrom(message.fromToLine(false)); this.viewFrom(message.fromToLine());
this.viewTo(message.toToLine(false)); this.viewTo(message.toToLine());
this.viewCc(message.ccToLine(false)); this.viewCc(message.ccToLine());
this.viewBcc(message.bccToLine(false)); this.viewBcc(message.bccToLine());
this.viewReplyTo(message.replyToToLine(false)); this.viewReplyTo(message.replyToToLine());
this.viewTimeStamp(message.dateTimeStampInUTC()); this.viewTimeStamp(message.dateTimeStampInUTC());
this.viewSize(message.friendlySize()); this.viewSize(message.friendlySize());
this.viewLineAsCss(message.lineAsCss()); this.viewLineAsCss(message.lineAsCss());

View file

@ -173,65 +173,68 @@
<span class="emptySubjectText" data-i18n="MESSAGE/EMPTY_SUBJECT_TEXT" data-bind="event: { 'dblclick': toggleFullScreen }"></span> <span class="emptySubjectText" data-i18n="MESSAGE/EMPTY_SUBJECT_TEXT" data-bind="event: { 'dblclick': toggleFullScreen }"></span>
</div> </div>
<div> <div>
<div style="overflow: hidden;"> <div style="overflow: hidden;" data-bind="hidden: showFullInfo()">
<div class="informationShort" data-bind="event: { 'dblclick': toggleFullScreen }"> <div class="informationShort" data-bind="event: { 'dblclick': toggleFullScreen }">
<span class="from" data-bind="html: viewFromShort, title: viewFrom"></span> <span class="from" data-bind="html: viewFromShort, title: viewFrom"></span>
<span data-bind="visible: viewFromDkimVisibility"> <span data-bind="visible: viewFromDkimVisibility">
&nbsp; &nbsp;
<i data-bind="css: viewFromDkimStatusIconClass, title: viewFromDkimStatusTitle"></i> <i data-bind="css: viewFromDkimStatusIconClass, title: viewFromDkimStatusTitle"></i>
</span> </span>
<br/>
<span data-bind="visible: 0 < viewTimeStamp()"> <span data-bind="visible: 0 < viewTimeStamp()">
(<time class="date" data-moment-format="FULL" data-bind="moment: viewTimeStamp"></time>) (<time class="date" data-moment-format="FULL" data-bind="moment: viewTimeStamp"></time>)
</span> </span>
</div> </div>
<div class="informationShortWrp"> <div class="informationShortWrp">
<div class="informationShort" data-bind="visible: viewTo, event: { 'dblclick': toggleFullScreen }"> <div class="informationShort" data-bind="visible: viewTo, event: { 'dblclick': toggleFullScreen }">
<span> <span class="labelTo" data-i18n="GLOBAL/TO"></span>:&nbsp;
<span class="uiLabel labelTo" data-i18n="GLOBAL/TO" <span class="to" data-bind="text: viewTo"></span>
></span>:&nbsp;<span class="to" data-bind="text: viewTo"></span>
</span>
</div> </div>
<div class="informationShort" data-bind="visible: viewCc, event: { 'dblclick': toggleFullScreen }"> <div class="informationShort" data-bind="visible: viewCc, event: { 'dblclick': toggleFullScreen }">
<span> <span class="labelTo" data-i18n="GLOBAL/CC"></span>:&nbsp;
<span class="uiLabel labelTo" data-i18n="GLOBAL/CC" <span class="to" data-bind="text: viewCc"></span>
></span>:&nbsp;<span class="to" data-bind="text: viewCc"></span>
</span>
</div> </div>
</div> </div>
</div> </div>
<div class="informationFull" data-bind="visible: showFullInfo()"> <div class="informationFull" data-bind="visible: showFullInfo()">
<table> <table>
<tr data-bind="visible: '' !== viewFrom()"> <tr data-bind="visible: '' !== viewFrom()">
<td><span class="uiLabel" data-i18n="GLOBAL/FROM"></span></td> <td data-i18n="GLOBAL/FROM"></td>
<td> <td><span data-bind="text: viewFrom, title: viewFrom"></span>
<span class="pull-right size" data-bind="text: viewSize"></span> <span data-bind="visible: viewFromDkimVisibility">
<span class="from uiLabelValue" data-bind="text: viewFrom, title: viewFrom"></span> &nbsp;
<i data-bind="css: viewFromDkimStatusIconClass, title: viewFromDkimStatusTitle"></i>
</span>
</td> </td>
</tr> </tr>
<tr data-bind="visible: '' !== viewTo()"> <tr data-bind="visible: '' !== viewTo()">
<td><span class="uiLabel" data-i18n="GLOBAL/TO"></span></td> <td data-i18n="GLOBAL/TO"></td>
<td><span class="to uiLabelValue" data-bind="text: viewTo, title: viewTo"></span></td> <td data-bind="text: viewTo, title: viewTo"></td>
</tr> </tr>
<tr data-bind="visible: '' !== viewCc()"> <tr data-bind="visible: '' !== viewCc()">
<td><span class="uiLabel" data-i18n="GLOBAL/CC"></span></td> <td data-i18n="GLOBAL/CC"></td>
<td><span class="cc uiLabelValue" data-bind="text: viewCc, title: viewCc"></span></td> <td data-bind="text: viewCc, title: viewCc"></td>
</tr> </tr>
<tr data-bind="visible: '' !== viewBcc()"> <tr data-bind="visible: '' !== viewBcc()">
<td><span class="uiLabel" data-i18n="GLOBAL/BCC"></span></td> <td data-i18n="GLOBAL/BCC"></td>
<td><span class="bcc uiLabelValue" data-bind="text: viewBcc, title: viewBcc"></span></td> <td data-bind="text: viewBcc, title: viewBcc"></td>
</tr> </tr>
<tr data-bind="visible: '' !== viewReplyTo()"> <tr data-bind="visible: '' !== viewReplyTo()">
<td><span class="uiLabel" data-i18n="GLOBAL/REPLY_TO"></span></td> <td data-i18n="GLOBAL/REPLY_TO"></td>
<td><span class="replyTo uiLabelValue" data-bind="text: viewReplyTo, title: viewReplyTo"></span></td> <td data-bind="text: viewReplyTo, title: viewReplyTo"></td>
</tr> </tr>
<tr data-bind="visible: 0 < viewTimeStamp()"> <tr data-bind="visible: 0 < viewTimeStamp()">
<td><span class="uiLabel" data-i18n="MESSAGE/LABEL_DATE"></span></td> <td data-i18n="MESSAGE/LABEL_DATE"></td>
<td> <td>
<time class="date uiLabelValue" data-moment-format="FULL" data-bind="moment: viewTimeStamp"></time> <time data-moment-format="FULL" data-bind="moment: viewTimeStamp"></time>
&nbsp; &nbsp;
(<time class="date uiLabelValue" data-moment-format="FROMNOW" data-bind="moment: viewTimeStamp"></time>) (<time data-moment-format="FROMNOW" data-bind="moment: viewTimeStamp"></time>)
</td> </td>
</tr> </tr>
<tr data-bind="visible: '' !== viewFrom()">
<td data-i18n="POPUPS_FILTER/SELECT_FIELD_SIZE"></td>
<td class="size" data-bind="text: viewSize"></td>
</tr>
</table> </table>
</div> </div>
</div> </div>