changed html and text view

src/js/app-router.js

@@ -29,11 +29,10 @@
 			this.changePage(loginView);
 		},
 
-		compose: function(to, reSubject, reBody) {
+		compose: function(userId, folder, messageId) {
 			var composeView = new app.view.ComposeView({
-				to: to,
+				folder: folder,
-				reSubject: reSubject,
+				messageId: decodeURIComponent(messageId),
-				reBody: reBody,
 				dao: this.emailDao
 			});
 			this.changePage(composeView);
@@ -64,7 +63,7 @@
 				dao: this.emailDao
 			});
 			this.changePage(readView);
-			readView.renderBody();
+			readView.renderBody(true);
 		},
 
 		changePage: function(page) {

src/js/dao/email-dao.js

@@ -239,12 +239,34 @@ app.dao.EmailDAO = function(_, crypto, devicestorage, cloudstorage, naclCrypto,
 	this.sendEmail = function(email, callback) {
 		var userId = this.account.get('emailAddress');
 
+		// validate email addresses
+		_.each(email.get('to'), function(address) {
+			if (!validateEmail(address)) {
+				callback({
+					errMsg: 'Invalid recipient: ' + address
+				});
+				return;
+			}
+		});
+		if (!validateEmail(email.get('from'))) {
+			callback({
+				errMsg: 'Invalid sender: ' + email.from
+			});
+			return;
+		}
+
 		// generate a new UUID for the new email
 		email.set('id', util.UUID());
 
+		// send email to cloud service
 		cloudstorage.putEncryptedItem(email, 'email', userId, 'outbox', function(err) {
 			callback(err);
 		});
+
+		function validateEmail(email) {
+			var re = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
+			return re.test(email);
+		}
 	};
 
 };

src/js/view/compose-view.js

@@ -6,6 +6,10 @@
 		initialize: function(args) {
 			this.template = _.template(app.util.tpl.get('compose'));
 			this.dao = args.dao;
+			if (args.folder && args.messageId) {
+				// fetch reply-to email model
+				this.replyTo = args.dao.getItem(args.folder, args.messageId);
+			}
 		},
 
 		render: function(eventName) {
@@ -40,7 +44,7 @@
 				return;
 			}
 
-			var signature = '\n\nSent with https://mail.whiteout.io - get your mailbox for end-2-end encrypted messaging!';
+			var signature = '\n\nSent with whiteout.io - get your mailbox for end-2-end encrypted messaging!\nhttps://mail.whiteout.io';
 
 			var email = new app.model.Email({
 				from: self.dao.account.get('emailAddress'),

src/js/view/read-view.js

@@ -10,12 +10,23 @@
 
 		render: function(eventName) {
 			$(this.el).html(this.template(this.model.toJSON()));
+			this.renderBody();
+
 			return this;
 		},
 
-		renderBody: function() {
+		renderBody: function(tryHtml) {
-			var emailBody = this.model.get('body'),
+			var page = $(this.el),
-				iframe = $('#idMailContent'),
+				emailBody = this.model.get('body');
+
+			if (!tryHtml && emailBody.indexOf('</') === -1) {
+				// render text email
+				page.find('#bodyItem').html('<textarea></textarea>');
+				page.find('#bodyItem textarea').text(emailBody);
+
+			} else if (tryHtml && emailBody.indexOf('</') !== -1) {
+				// render html email inside a sandboxed iframe
+				var iframe = page.find('#idMailContent'),
 					iframeDoc = iframe[0].contentDocument || iframe[0].contentWindow.document;
 
 				iframe.load(function() {
@@ -29,6 +40,7 @@
 				iframeDoc.write(emailBody);
 				iframeDoc.close();
 			}
+		}
 
 	});
 

src/tpl/messagelistitem.html

@@ -1,5 +1,5 @@
 <a href="#accounts/<%- account %>/folders/<%- folder %>/read/<%- id %>">
-  <h3><%- from[0].name %></h3>
+  <h3><%- from[0].name || from[0].address %></h3>
   <p><strong><%- subject %></strong></p>
   <!--   <p><%- body %></p> -->
   <p class="ui-li-aside"><strong><%- displayDate %></strong></p>

src/tpl/read.html

@@ -21,8 +21,10 @@
 			<p id="idMailDate"><%- sentDate %></p>
 		</li>
 		
-		<li id="bodyItem" style="font-size: 8pt; font-weight: normal; background-color: #FFFFFF">
+		<li id="bodyItem" style="background-color: #FFFFFF">
+		  <div style="font-size: 8pt; font-weight: normal">
         <iframe id="idMailContent" sandbox="allow-same-origin" width="100%" height="100%" frameborder="0" scrolling="no"></iframe>
+      </div>
 		</li>
 		
 	</ul>