From 7fa0084bc738d5156903aafbb4b6f50d4dd4972b Mon Sep 17 00:00:00 2001
From: monthrie <110186937+monthrie@users.noreply.github.com>
Date: Fri, 24 Jan 2025 15:53:34 +0000
Subject: [PATCH 1/2] home always displays name of interlocutor

---
 mds/code/chainmail/index.html | 333 +++++++++++++++++++---------------
 1 file changed, 185 insertions(+), 148 deletions(-)
diff --git a/mds/code/chainmail/index.html b/mds/code/chainmail/index.html
index 33a38478a..3cfdc5b2c 100644
--- a/mds/code/chainmail/index.html
+++ b/mds/code/chainmail/index.html
@@ -1,149 +1,186 @@
-<html>
-
-<head>
-	<title>ChainMail</title>
-	
-	<meta name="viewport" content="width=device-width, initial-scale=1.0">
-	
-	<!-- Load the main MDS JS lib -->
-	<script type="text/javascript" src="mds.js"></script>
-	
-	<!-- Load the CSS Style sheet -->
-	<link rel="stylesheet" href="style.css">
-	
-	<!-- And the ICON for the page -->
-	<link rel="icon" type="image/x-icon" href="favicon.ico">
-	
-	<!-- Load the local JS lib -->
-	<script type="text/javascript" src="jslib.js"></script>
-	<script type="text/javascript" src="./js/sql.js"></script>
-	<script type="text/javascript" src="./js/txns.js"></script>
-	<script type="text/javascript" src="./js/purify.min.js"></script>
-	
-</head>
-
-<body>
-
-<center>
-
-	<div class="titlebar" onclick="showTitleOnAndroid();">
-		<table width=100% border=0>
-			<tr>
-				<td><img height=45 src="./images/webmail.png"></td>
-				<td style="text-align:left;font-size:26px;width:100%">&nbsp;<b>ChainMail</b></td>
-				<td class='topicdate' nowrap>
-					<img style="cursor:pointer;" onclick="event.stopPropagation(); jumpToNewMessage();" height=30 src="./images/newmail.png">&nbsp;&nbsp;
-					<img style="cursor:pointer;" onclick="event.stopPropagation(); jumpToContacts();" height=30 src="./images/contacts.png">&nbsp;&nbsp;					
-					<img style="cursor:pointer;" onclick="event.stopPropagation(); jumpToHome();" height=30 src="./images/home.png">&nbsp;&nbsp;
-				</td>
-			</tr>
-		</table>
-	</div>
-	
-	<br>
-	<table class=maintable id=messagetable></table>
-	<br>
-	
-	<div id=youraddress class=contacts style="word-wrap:break-word;text-align:center;"></div>
-	<br>
-	
-	<div class=contacts style="text-align:center;">
-		<br>All messages are signed and end to end encrypted so the sender, recipient and message are completely hidden<br><br>
-	</div>
-	
-</center>
-
-<script type="text/javascript">
-	
-	function createMessageRow(mail){
-		
-		var messagerow = messagetable.insertRow();
-		messagerow.onclick = function(){
-			location.href="mailview.html?uid="+MDS.minidappuid+"&hashref="+mail.HASHREF+"&subject="+mail.SUBJECT;	
-		};
-		messagerow.className+=" mytr";
-		
-		var from 		 = messagerow.insertCell();
-		from.style.width = "150";
-		from.className+=" mylefttd";
-		
-		var subject = messagerow.insertCell();
-		subject.className+=" mylefttd";
-		
-		var date	= messagerow.insertCell();
-		date.className+=" myrighttd";
-		date.style.width = "180";
-		
-		if(mail.READ == 0){
-			from.innerHTML 		= "<b>"+safeDecodeString(mail.FROMNAME)+"</b>";
-			subject.innerHTML 	= "<b>"+safeDecodeString(mail.SUBJECT)+"</b>"
-						+"<br><span style='font-size:14;'><b>"+safeDecodeString(mail.MESSAGE)+"</b></span>";
-			
-		}else{
-			from.innerHTML 		= safeDecodeString(mail.FROMNAME);
-			subject.innerHTML 	= safeDecodeString(mail.SUBJECT)
-						+"<br><span style='font-size:12;color:#888888'>"+safeDecodeString(mail.MESSAGE)+"</span>";
-				
-		}
-		
-					
-		date.innerHTML 		= new Date(+mail.DATE).toLocaleTimeString()+" "+new Date(+mail.DATE).toLocaleDateString();
-		
-	}
-	
-	function loadMail(){
-		
-		//Clear table
-		messagetable.innerHTML = "";
-		
-		//Add the messages
-		loadTopMessages(function(msg){
-			for(var i=0;i<msg.count;i++){
-				createMessageRow(msg.rows[i]);	
-			}
-			
-			//Are we blank
-			if(msg.count == 0){
-				var messagerow 	= messagetable.insertRow();
-				var from 		= messagerow.insertCell();
-				from.innerHTML 	= "No messages yet..";
-			}
-		});
-	}
-	
-	//Main message handler..
-	MDS.init(function(msg){
-		
-		//Do initialisation
-		if(msg.event == "inited"){
-			
-			//Do stuff.. from now..		
-			var wipedb = false;
-			if(wipedb){
-				wipeDB(function(){});
-			}else{
-				
-				//Get your details
-				MDS.cmd("maxima",function(maxresp){
-					
-					youraddress.innerHTML = "<br>Your ChainMail Address : <br><br>"
-								+"<div style='margin:auto;max-width:90%;font-size:10;'>"
-								+maxresp.response.mxpublickey+"</div><br>";
-					
-					loadMail();
-				});
-				
-				
-			}
-		}else if(msg.event == "NOTIFYCOIN"){
-			if(msg.data.address == CHAINMAIL_ADDRESS){
-				loadMail();
-			}	
-		}
-	});
-
-</script>
-
-</body>
-
+<html>
+
+<head>
+	<title>ChainMail</title>
+	
+	<meta name="viewport" content="width=device-width, initial-scale=1.0">
+	
+	<!-- Load the main MDS JS lib -->
+	<script type="text/javascript" src="mds.js"></script>
+	
+	<!-- Load the CSS Style sheet -->
+	<link rel="stylesheet" href="style.css">
+	
+	<!-- And the ICON for the page -->
+	<link rel="icon" type="image/x-icon" href="favicon.ico">
+	
+	<!-- Load the local JS lib -->
+	<script type="text/javascript" src="jslib.js"></script>
+	<script type="text/javascript" src="./js/sql.js"></script>
+	<script type="text/javascript" src="./js/txns.js"></script>
+	<script type="text/javascript" src="./js/purify.min.js"></script>
+	
+</head>
+
+<body>
+
+<center>
+
+	<div class="titlebar" onclick="showTitleOnAndroid();">
+		<table width=100% border=0>
+			<tr>
+				<td><img height=45 src="./images/webmail.png"></td>
+				<td style="text-align:left;font-size:26px;width:100%">&nbsp;<b>ChainMail</b></td>
+				<td class='topicdate' nowrap>
+					<img style="cursor:pointer;" onclick="event.stopPropagation(); jumpToNewMessage();" height=30 src="./images/newmail.png">&nbsp;&nbsp;
+					<img style="cursor:pointer;" onclick="event.stopPropagation(); jumpToContacts();" height=30 src="./images/contacts.png">&nbsp;&nbsp;					
+					<img style="cursor:pointer;" onclick="event.stopPropagation(); jumpToHome();" height=30 src="./images/home.png">&nbsp;&nbsp;
+				</td>
+			</tr>
+		</table>
+	</div>
+	
+	<br>
+	<table class=maintable id=messagetable></table>
+	<br>
+	
+	<div id=youraddress class=contacts style="word-wrap:break-word;text-align:center;"></div>
+	<br>
+	
+	<div class=contacts style="text-align:center;">
+		<br>All messages are signed and end to end encrypted so the sender, recipient and message are completely hidden<br><br>
+	</div>
+	
+</center>
+
+<script type="text/javascript">
+	
+	//Store our public key globally when we get it
+	var MY_PUBLIC_KEY = "";
+	
+	function createMessageRow(mail){
+		//Debug logging
+		console.log("Message From: ", mail.FROMPUBLICKEY);
+		console.log("My Key: ", MY_PUBLIC_KEY);
+		console.log("Is my message?: ", mail.FROMPUBLICKEY === MY_PUBLIC_KEY);
+		
+		// First determine who we want to display
+		var displayName = safeDecodeString(mail.FROMNAME);
+		
+		// If it's our message, look up the recipient's name first
+		if(mail.FROMPUBLICKEY === MY_PUBLIC_KEY) {
+			console.log("This is my message, looking up recipient name...");
+			loadContacts(function(contacts) {
+				console.log("Loaded contacts: ", contacts);
+				if(contacts && contacts.rows) {
+					for(var i=0; i<contacts.count; i++) {
+						if(contacts.rows[i].PUBLICKEY === mail.TOPUBLICKEY) {
+							displayName = safeDecodeString(contacts.rows[i].USERNAME);
+							console.log("Found recipient name: ", displayName);
+							createMessageRowHTML(displayName);
+							break;
+						}
+					}
+				}
+			});
+		} else {
+			// Not our message, use the sender's name
+			createMessageRowHTML(displayName);
+		}
+		
+		function createMessageRowHTML(name) {
+			var messagerow = messagetable.insertRow();
+			messagerow.onclick = function(){
+				location.href="mailview.html?uid="+MDS.minidappuid+"&hashref="+mail.HASHREF+"&subject="+mail.SUBJECT;	
+			};
+			messagerow.className+=" mytr";
+			
+			// Add unread indicator class if message is unread
+			if(mail.READ == 0) {
+				messagerow.className += " unread";
+			}
+			
+			var from = messagerow.insertCell();
+			from.style.width = "150";
+			from.className+=" mylefttd";
+			
+			var subject = messagerow.insertCell();
+			subject.className+=" mylefttd";
+			
+			var date = messagerow.insertCell();
+			date.className+=" myrighttd";
+			date.style.width = "180";
+			
+			console.log("Creating row with name: ", name);
+			if(mail.READ == 0){
+				from.innerHTML = "<b>"+name+"</b> <span class='unread-label'>NEW</span>";
+				subject.innerHTML = "<b>"+safeDecodeString(mail.SUBJECT)+"</b>"
+							+"<br><span style='font-size:14;'><b>"+safeDecodeString(mail.MESSAGE)+"</b></span>";
+			}else{
+				from.innerHTML = name;
+				subject.innerHTML = safeDecodeString(mail.SUBJECT)
+							+"<br><span style='font-size:12;color:#888888'>"+safeDecodeString(mail.MESSAGE)+"</span>";
+			}
+			
+			date.innerHTML = new Date(+mail.DATE).toLocaleTimeString()+" "+new Date(+mail.DATE).toLocaleDateString();
+		}
+	}
+	
+	function loadMail(){
+		//Clear table
+		messagetable.innerHTML = "";
+		
+		//Add the messages
+		loadTopMessages(function(msg){
+			for(var i=0;i<msg.count;i++){
+				createMessageRow(msg.rows[i]);	
+			}
+			
+			//Are we blank
+			if(msg.count == 0){
+				var messagerow 	= messagetable.insertRow();
+				var from 		= messagerow.insertCell();
+				from.innerHTML 	= "No messages yet..";
+			}
+		});
+	}
+	
+	//Main message handler..
+	MDS.init(function(msg){
+		
+		//Do initialisation
+		if(msg.event == "inited"){
+			
+			//Do stuff.. from now..		
+			var wipedb = false;
+			if(wipedb){
+				wipeDB(function(){});
+			}else{
+				
+				//Get your details
+				MDS.cmd("maxima",function(maxresp){
+					
+					//Store our public key globally
+					MY_PUBLIC_KEY = maxresp.response.mxpublickey;
+					
+					youraddress.innerHTML = "<br>Your ChainMail Address : <br><br>"
+								+"<div style='margin:auto;max-width:90%;font-size:10;'>"
+								+maxresp.response.mxpublickey+"</div><br>";
+					
+					loadMail();
+				});
+				
+				
+			}
+		}else if(msg.event == "NOTIFYCOIN"){
+			if(msg.data.address == CHAINMAIL_ADDRESS){
+				loadMail();
+			}	
+		}
+	});
+
+</script>
+
+</body>
+
 </html>
\ No newline at end of file

From abf5e521d08b66e0aa7d660c131519e79ea07807 Mon Sep 17 00:00:00 2001
From: monthrie <110186937+monthrie@users.noreply.github.com>
Date: Fri, 24 Jan 2025 16:05:52 +0000
Subject: [PATCH 2/2] ChainMail: Add unread message indicators and fix contact
 name display

---
 mds/code/chainmail/style.css | 13 +++++++++++++
 1 file changed, 13 insertions(+)

diff --git a/mds/code/chainmail/style.css b/mds/code/chainmail/style.css
index 356979914..0266e3218 100644
--- a/mds/code/chainmail/style.css
+++ b/mds/code/chainmail/style.css
@@ -206,3 +206,16 @@ body {
 	font-style: italic;
 }
 
+.unread {
+    background-color: #f0f7ff;
+}
+
+.unread-label {
+    background-color: #007bff;
+    color: white;
+    padding: 2px 6px;
+    border-radius: 10px;
+    font-size: 12px;
+    margin-left: 8px;
+}
+
