From 257d46accebe8bb20996fb2cb12fc6d64fa79b8b Mon Sep 17 00:00:00 2001
From: Kyle Tsuda <ktsuda88@gmail.com>
Date: Fri, 25 Nov 2016 17:24:14 -1000
Subject: [PATCH 1/2] visual list of mail message

---
 css/style.css        |  1 +
 index.html           | 47 ++++++++++++++++++--------------------------
 js/mail-generator.js |  1 +
 3 files changed, 21 insertions(+), 28 deletions(-)
diff --git a/css/style.css b/css/style.css
index 46f84644..73577be5 100644
--- a/css/style.css
+++ b/css/style.css
@@ -23,6 +23,7 @@ header {
 }
 
 #main {
+	font-family: 'Sumana', sans-serif;
 	float: left;
 	width: 1000px;
 	height: 800px;
diff --git a/index.html b/index.html
index e8b56e93..84ea5a09 100644
--- a/index.html
+++ b/index.html
@@ -3,11 +3,14 @@
 		<title>DevLeague GeeMail Challenge</title>
 		<script src="js/mail-generator.js"></script>
 		<link href="css/style.css" rel="stylesheet" media="screen">
+    <link href="https://fonts.googleapis.com/css?family=Sumana" rel="stylesheet">
+
     <script>
       window.onload = function(){
         // ALL OF YOUR JAVASCRIPT CODE SHOULD GO HERE. 
         // We have to use window.onload so your JavaScript doesn't execute until the page has loaded and all HTML has been downloaded to your browser
-    
+
+
         //current Date info 
         document.getElementById("today").innerHTML = Date();
 
@@ -15,15 +18,8 @@
         document.addEventListener("click", function(){
         document.getElementById("menu").innerHTML="You Got Mail Homie!";
         });
-
-        //event handler for body message  
-        document.addEventListener("click", function(){
-        var bodyElement = document.getElementById("row1");  
-        bodyElement.innerHTML = body;
-        element.appendChild(bodyElement);
-
-        });
-
+ 
+      
         //recurring function (need work on this)
         window.setInterval(getNewMessage(), 500);
           function getNewMessage(){
@@ -34,6 +30,8 @@
         //accessing prepopulated data stored in window.geemails variable
         var element = document.getElementById('main');
 
+         console.log("my sender is: " + sender);
+      
         for (var i = 0; i < window.geemails.length; i++){
           var currentMessage = window.geemails[i];
           var sender = currentMessage.sender;
@@ -41,24 +39,18 @@
           var date = currentMessage.date;
           var body = currentMessage.body;
 
+       
+
         //visual list of mail message 
-        var senderElement = document.createElement('row1');
-        senderElement.innerHTML = sender;
+        var senderElement = document.createElement('p');
+        senderElement.setAttribute("id", "row" + i);
+        senderElement.innerHTML = "Sender:" + sender + " Subject" + subject + "Date: " + date;
         element.appendChild(senderElement);
+
+        
        
-        var subjectElement = document.createElement('row1');
-        subjectElement.innerHTML = subject;
-        senderElement.appendChild(subjectElement);
 
-        var dateElement = document.createElement('row1');
-        dateElement.innerHTML = date;
-        subjectElement.appendChild(dateElement);
 
-        //body content after clicking on message
-        var bodyElement = document.getElementById('row2');
-        bodyElement.innerHTML = body;
-        row2.appendChild(bodyElement);
-       
           }
 
        };    
@@ -69,7 +61,7 @@
 	<body>
 		
 		<header>
-			<h1>GeeMail</h1>
+			<h1>GoogleMail</h1>
       <h3>Powered By { }</h3>
 			<p id="today"></p>
 
@@ -77,16 +69,15 @@ <h3>Powered By { }</h3>
 
 		<div id="menu">
 				<table>
-					<tr><td><strong>Inbox {1}</strong></td></tr>
+					<tr><td id="inbox"><strong></strong></td></tr>
 				</table>
 		</div>
     	
     <div id="main"> 
-			    <p id="row1"></p>	  
-          <p id="row2"></p>
+			    
 
     </div> 
-
+    
     <div>
         <table>
           <tr><td><h5><img src="devleague logo.jpeg"></h5></td></tr>
diff --git a/js/mail-generator.js b/js/mail-generator.js
index 73f54922..e8816544 100644
--- a/js/mail-generator.js
+++ b/js/mail-generator.js
@@ -47,3 +47,4 @@ function getRandomDate(){
 	window.geemails = [];
 	loadGeeMails();	
 })();
+console.log(window.geemails); //this shows the the mail generated data in console log
\ No newline at end of file

From c7b725d9a276bc946566ebd6779cb1a2f0af39e6 Mon Sep 17 00:00:00 2001
From: Kyle Tsuda <ktsuda88@gmail.com>
Date: Fri, 25 Nov 2016 22:50:05 -1000
Subject: [PATCH 2/2] toggle on and off body

---
 css/style.css |  4 ++++
 index.html    | 44 ++++++++++++++++++++++++++++++++++----------
 2 files changed, 38 insertions(+), 10 deletions(-)

diff --git a/css/style.css b/css/style.css
index 73577be5..2bc81aaf 100644
--- a/css/style.css
+++ b/css/style.css
@@ -32,3 +32,7 @@ header {
 #row2{
 	display: none;
 }
+
+.clicked {
+	display: none;
+}
\ No newline at end of file
diff --git a/index.html b/index.html
index 84ea5a09..6bddd770 100644
--- a/index.html
+++ b/index.html
@@ -19,7 +19,7 @@
         document.getElementById("menu").innerHTML="You Got Mail Homie!";
         });
  
-      
+        
         //recurring function (need work on this)
         window.setInterval(getNewMessage(), 500);
           function getNewMessage(){
@@ -32,6 +32,10 @@
 
          console.log("my sender is: " + sender);
       
+         // function mod(i) {
+         //  var temp = document.getElementById("body" + i);
+         //  temp.classList.toggle(".clicked");         }
+
         for (var i = 0; i < window.geemails.length; i++){
           var currentMessage = window.geemails[i];
           var sender = currentMessage.sender;
@@ -40,21 +44,41 @@
           var body = currentMessage.body;
 
        
-
+          console.log(body);
         //visual list of mail message 
-        var senderElement = document.createElement('p');
-        senderElement.setAttribute("id", "row" + i);
-        senderElement.innerHTML = "Sender:" + sender + " Subject" + subject + "Date: " + date;
+        var senderElement = document.createElement('p'); //create paragraph element
+        senderElement.className = "buyme"; //set ID
+        senderElement.innerHTML = "Sender: " + sender + " Subject: " + subject + " Date: " + date; //pulls vars sender, subject, etc
         element.appendChild(senderElement);
 
+        //appends the paragraph element as a child of the main element
+        var bodyElement = document.createElement('p'); 
+        bodyElement.className = "howmuch"; 
+        bodyElement.style.display = "none";
+        bodyElement.innerHTML = body;
+        senderElement.appendChild(bodyElement);
         
-       
 
+        }
 
-          }
+        var showPrice = document.getElementsByClassName("buyme");
+        for(var j = 0; j < showPrice.length; j++) {
+          showPrice[j].addEventListener("click", secret);
+        }
+              
+        function secret(){
+         var priceShow = this.querySelectorAll('.howmuch')[0];
+          console.log(this);
+          if(priceShow.style.display === 'none'){
+            priceShow.style.display = 'block';
+          }else{
+           priceShow.style.display = 'none';
+        }
+
+    } 
+
+    };     
 
-       };    
-     
     </script>
 	</head>
 	
@@ -80,7 +104,7 @@ <h3>Powered By { }</h3>
     
     <div>
         <table>
-          <tr><td><h5><img src="devleague logo.jpeg"></h5></td></tr>
+          <tr><td><h5><img src="http://www.devleague.com/img/dev_league_emblem.png"></h5></td></tr>
         </table> 
     </div>    
     
