Improved selector changes of #1248

the-djmaze · Oct 2, 2023 · 6b0e6ec · 6b0e6ec
1 parent 63d0d13
commit 6b0e6ec
Show file tree

Hide file tree

Showing 4 changed files with 37 additions and 40 deletions.
diff --git a/dev/Common/Selector.js b/dev/Common/Selector.js
@@ -7,7 +7,7 @@ import { koComputable } from 'External/ko';
 	oCallbacks:
 		ItemSelect
 		MiddleClick
-		AutoSelect
+		canSelect
 		ItemGetUid
 		UpOrDown
 */
@@ -200,18 +200,11 @@ export class Selector {
 
 			addEventsListeners(contentScrollable, {
 				click: event => {
+					const el = event.target.closestWithin(this.sItemSelector, contentScrollable);
+					let item = el && ko.dataFor(el);
+					el && (this.oCallbacks.click || (()=>1))(event, item) && this.actionClick(item, event);
 
-					const lowerClassName = event.target.className.toLowerCase();
-					if (this.sItemSelector !== '.messageListItem'
-						|| (lowerClassName.indexOf('flagparent') === -1
-							&& lowerClassName.indexOf('checkbox') === -1)) {
-
-						let el = event.target.closestWithin(this.sItemSelector, contentScrollable);
-						el && this.actionClick(ko.dataFor(el), event);
-
-					}
-
-					const item = getItem(this.sItemCheckedSelector);
+					item = getItem(this.sItemCheckedSelector);
 					if (item) {
 						if (event.shiftKey) {
 							this.actionClick(item, event);
@@ -257,7 +250,7 @@ export class Selector {
 	 * @returns {boolean}
 	 */
 	autoSelect(bForce) {
-		(bForce || (this.oCallbacks.AutoSelect || (()=>1))())
+		(bForce || (this.oCallbacks.canSelect || (()=>1))())
 		&& this.focusedItem()
 		&& this.selectedItem(this.focusedItem());
 	}

diff --git a/dev/Stores/User/Messagelist.js b/dev/Stores/User/Messagelist.js
@@ -165,7 +165,7 @@ MessagelistUserStore.notifyNewMessages = (folder, newMessages) => {
 	}
 }
 
-MessagelistUserStore.canAutoSelect = () =>
+MessagelistUserStore.canSelect = () =>
 	!disableAutoSelect()
 	&& SettingsUserStore.usePreviewPane();
 //	&& !SettingsUserStore.showNextMessage();

diff --git a/dev/View/User/MailBox/MessageList.js b/dev/View/User/MailBox/MessageList.js
@@ -237,7 +237,25 @@ export class MailMessageList extends AbstractViewRight {
 
 		this.selector.on('ItemGetUid', message => (message ? message.generateUid() : ''));
 
-		this.selector.on('AutoSelect', () => MessagelistUserStore.canAutoSelect());
+		this.selector.on('canSelect', () => MessagelistUserStore.canSelect());
+
+		this.selector.on('click', (event, currentMessage) => {
+			const el = event.target;
+			if (el.closest('.flagparent')) {
+				if (currentMessage) {
+					const checked = MessagelistUserStore.listCheckedOrSelected();
+					listAction(
+						currentMessage.folder,
+						currentMessage.isFlagged() ? MessageSetAction.UnsetFlag : MessageSetAction.SetFlag,
+						checked.find(message => message.uid == currentMessage.uid) ? checked : [currentMessage]
+					);
+				}
+			} else if (el.closest('.threads-len')) {
+				this.gotoThread(currentMessage);
+			} else {
+				return 1;
+			}
+		});
 
 		this.selector.on('UpOrDown', up => {
 			if (MessagelistUserStore.hasChecked()) {
@@ -594,20 +612,6 @@ export class MailMessageList extends AbstractViewRight {
 				el && this.gotoPage(ko.dataFor(el));
 
 				eqs(event, '.checkboxCheckAll') && this.checkAll(!this.checkAll());
-
-				el = eqs(event, '.flagParent');
-				let currentMessage = el && ko.dataFor(el);
-				if (currentMessage) {
-					const checked = MessagelistUserStore.listCheckedOrSelected();
-					listAction(
-						currentMessage.folder,
-						currentMessage.isFlagged() ? MessageSetAction.UnsetFlag : MessageSetAction.SetFlag,
-						checked.find(message => message.uid == currentMessage.uid) ? checked : [currentMessage]
-					);
-				}
-
-				el = eqs(event, '.threads-len');
-				el && this.gotoThread(ko.dataFor(el));
 			},
 			dblclick: event => {
 				let el = eqs(event, '.actionHandle');
@@ -674,7 +678,7 @@ export class MailMessageList extends AbstractViewRight {
 				MessagelistUserStore.mainSearch(sLastSearchValue);
 				return false;
 			}
-			if (MessageUserStore.message() && MessagelistUserStore.canAutoSelect()) {
+			if (MessageUserStore.message() && MessagelistUserStore.canSelect()) {
 				isFullscreen() || toggleFullscreen();
 				return false;
 			}

diff --git a/snappymail/v/0.0.0/app/templates/Views/User/MailMessageList.html b/snappymail/v/0.0.0/app/templates/Views/User/MailMessageList.html
@@ -137,14 +137,14 @@
 					<div class="checkboxMessage fontastic" data-bind="text: checked() ? '☑' : '☐'"></div>
 				</div><div>
 					<div class="flagParent fontastic"></div>
-					<div class="senderParent actionHandle" data-bind="attr: {'title': senderClearEmailsString}, text: senderEmailsString"></div>
-					<div class="subjectParent actionHandle" data-bind="text: subject"></div>
+					<div class="senderParent" data-bind="attr: {'title': senderClearEmailsString}, text: senderEmailsString"></div>
+					<div class="subjectParent" data-bind="text: subject"></div>
 					<div class="threads-len" data-bind="visible: 1 < threadsLen(), text: threadsLenText(), attr: {'data-unseen': threadUnseenLen() || null}"></div>
-					<div class="attachmentParent actionHandle">
+					<div class="attachmentParent">
 						<i data-bind="css: attachmentIconClass"></i>
 					</div>
-					<div class="sizeParent actionHandle" data-bind="text: friendlySize()"></div>
-					<time class="actionHandle" data-bind="attr:{'data-moment-format':$root.timeFormat()}, moment: dateTimestamp"></time>
+					<div class="sizeParent" data-bind="text: friendlySize()"></div>
+					<time data-bind="attr:{'data-moment-format':$root.timeFormat()}, moment: dateTimestamp"></time>
 				</div>
 			</div>
 			<!-- /ko -->
@@ -157,14 +157,14 @@
 					<div class="checkboxMessage fontastic" data-bind="text: checked() ? '☑' : '☐'"></div>
 				</div><div data-bind="attr:{style:indent()}, css:{reply:indent()}">
 					<div class="flagParent fontastic"></div>
-					<div class="senderParent actionHandle" data-bind="attr: {'title': senderClearEmailsString}, text: senderEmailsString"></div>
-					<div class="subjectParent actionHandle" data-bind="text: subject"></div>
+					<div class="senderParent" data-bind="attr: {'title': senderClearEmailsString}, text: senderEmailsString"></div>
+					<div class="subjectParent" data-bind="text: subject"></div>
 					<div class="threads-len" data-bind="visible: 1 < threadsLen(), text: threadsLenText(), attr: {'data-unseen': threadUnseenLen() || null}"></div>
-					<div class="attachmentParent actionHandle">
+					<div class="attachmentParent">
 						<i data-bind="css: attachmentIconClass"></i>
 					</div>
-					<div class="sizeParent actionHandle" data-bind="text: friendlySize()"></div>
-					<time class="actionHandle" data-moment-format="AUTO" data-bind="moment: dateTimestamp"></time>
+					<div class="sizeParent" data-bind="text: friendlySize()"></div>
+					<time data-moment-format="AUTO" data-bind="moment: dateTimestamp"></time>
 				</div>
 			</div>
 		</div>