Remove unused properties and improved message view header

dev/Model/Message.js

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

dev/Styles/MessageView.less

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

dev/View/User/MailBox/FolderList.js

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

dev/View/User/MailBox/MessageList.js

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

dev/View/User/MailBox/MessageView.js

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

snappymail/v/0.0.0/app/templates/Views/User/MailMessageView.html

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