From 7028a7e19cd52e7a1f14b4eee8d9d94d05f62cba Mon Sep 17 00:00:00 2001 From: unknown Date: Tue, 28 May 2019 20:57:11 -1000 Subject: [PATCH 1/5] Emails loaded, show/hide working --- css/style.css | 3 +++ index.html | 54 ++++++++++++++++++++++++++++++++++++++++---- js/mail-generator.js | 2 +- 3 files changed, 53 insertions(+), 6 deletions(-) diff --git a/css/style.css b/css/style.css index e69de29b..56b58d0c 100644 --- a/css/style.css +++ b/css/style.css @@ -0,0 +1,3 @@ +.msgContainer{ + padding: 10px; +} \ No newline at end of file diff --git a/index.html b/index.html index a8a1aad9..79c4d9ea 100644 --- a/index.html +++ b/index.html @@ -1,18 +1,62 @@ - + + + + Mail Time
- Build Me! +

Mail Time:

+ \ No newline at end of file diff --git a/js/mail-generator.js b/js/mail-generator.js index 52d3ba66..f03d84b1 100644 --- a/js/mail-generator.js +++ b/js/mail-generator.js @@ -46,4 +46,4 @@ window.geemails = []; window.getNewMessage = getNewMessage; loadGeeMails(); -})(); +})(); \ No newline at end of file From f3729257e02a92878ac17fcf6c1ed62b356d1dec Mon Sep 17 00:00:00 2001 From: unknown Date: Wed, 29 May 2019 15:04:59 -1000 Subject: [PATCH 2/5] New messages loaded, working on counter --- index.html | 42 ++++++++++++++++++++++++++++++++++++++---- 1 file changed, 38 insertions(+), 4 deletions(-) diff --git a/index.html b/index.html index 79c4d9ea..0fc6164c 100644 --- a/index.html +++ b/index.html @@ -7,7 +7,7 @@ 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 - console.log(window.geemails); + //console.log(window.geemails); for(var i=0;i Mail Time From 656ae8784bb57d5d65a5798f53c78f8b74e81458 Mon Sep 17 00:00:00 2001 From: unknown Date: Wed, 29 May 2019 15:16:44 -1000 Subject: [PATCH 3/5] Emails, new emails, counter update complete, need CSS --- index.html | 21 +++++++++++---------- 1 file changed, 11 insertions(+), 10 deletions(-) diff --git a/index.html b/index.html index 0fc6164c..6fb4655a 100644 --- a/index.html +++ b/index.html @@ -36,6 +36,7 @@ mailbody.style.display = 'none'; mailsub.appendChild(mailbody); } + //function for show/hide message body in line 25 function showHide(){ var showBody = this.querySelector('.messageBody'); @@ -46,43 +47,43 @@ } } + //message counter, work in progress + var countBox = document.createElement('div'); + countBox.classname = 'counter'; + countBox.innerHTML = 'Inbox: ' + geemails.length; + main.appendChild(countBox); + //function for creating new messages, same as above function createNewMsg(){ var msgTest = getNewMessage(); - //console.log(msgTest); testing function var msgBoxNew = document.createElement('div'); msgBoxNew.className = 'msgContainer'; msgBox.appendChild(msgBoxNew); - //dates adding to msg box var maildateNew = document.createElement('div'); maildateNew.className = 'dates'; maildateNew.innerHTML = 'Date: ' + msgTest.date; msgBox.appendChild(maildateNew); - //subject added to msg box var mailsubNew = document.createElement('div'); mailsubNew.className = 'subject'; mailsubNew.innerHTML = 'Subject: ' + msgTest.subject; mailsubNew.addEventListener('click', showHide) //event listener to show message msgBox.appendChild(mailsubNew); - //sender added to msg box var mailsenderNew = document.createElement('div'); mailsenderNew.className = 'mailSender'; mailsenderNew.innerHTML = 'From: ' + msgTest.sender; msgBox.appendChild(mailsenderNew); - //message body added to msg box var mailbodyNew = document.createElement('div'); mailbodyNew.className = 'messageBody'; mailbodyNew.innerHTML = msgTest.body; mailbodyNew.style.display = 'none'; mailsubNew.appendChild(mailbodyNew); + countBox.innerHTML = 'Inbox: ' + ++geemails.length; //adds 1 to counter each time message is made } + + //interval set for creating new messages setInterval(createNewMsg, 5000); - //message counter, work in progress - var countBox = document.createElement('div'); - countBox.classname = 'counter'; - countBox.innerHTML = 'Inbox: ' + geemails.length; - main.appendChild(countBox); + }; Mail Time From 296da14ce1ebe6def8419feb14a3881768364976 Mon Sep 17 00:00:00 2001 From: unknown Date: Wed, 29 May 2019 20:31:20 -1000 Subject: [PATCH 4/5] Geemail complete --- css/style.css | 57 +++++++++++++++++++++++++++- index.html | 103 ++++++++++++++++++++++++++++++++++++++------------ 2 files changed, 134 insertions(+), 26 deletions(-) diff --git a/css/style.css b/css/style.css index 56b58d0c..3ebd8c26 100644 --- a/css/style.css +++ b/css/style.css @@ -1,3 +1,58 @@ +/* fonts: +font-family: 'Roboto Slab', serif; +font-family: 'Megrim', cursive; */ +#main{ + font-family: 'Roboto Slab', serif; +} .msgContainer{ + font-family: 'Roboto Slab', serif; padding: 10px; -} \ No newline at end of file + border-top: 5px double darkred; + background-color: whitesmoke; +} +body{ + background-color: cornflowerblue; +} +.dates{ + text-align: right; +} +/* CSS for badges */ +.notification { + background-color: #555; + color: white; + text-decoration: none; + padding: 15px 26px; + position: relative; + display: inline-block; + border-radius: 2px; + } + .notification:hover { + background: red; + } + .notification .badge { + position: absolute; + top: 0px; + right: -10px; + padding: 5px 10px; + border-radius: 50%; + background: red; + color: white; + } + .notification .outBadge{ + position: absolute; + top: 0px; + right: -10px; + padding: 5px 10px; + border-radius: 50%; + background: red; + color: white; + } + .notification .trashBadge{ + position: absolute; + top: 0px; + right: -10px; + padding: 5px 10px; + border-radius: 50%; + background: red; + color: white; + } \ No newline at end of file diff --git a/index.html b/index.html index 6fb4655a..fa8e1dd3 100644 --- a/index.html +++ b/index.html @@ -3,6 +3,7 @@ + Mail Time -
-

Mail Time:

+ +
+

Welcome Back!

+ + Inbox + 10 + + + Outbox + 0 + + + Trash + 0 + +
+ sent +
+
+ trash +
- + \ No newline at end of file From b0aeced17c99f312d2479dbf3fb1d39560d287fd Mon Sep 17 00:00:00 2001 From: unknown Date: Wed, 29 May 2019 20:32:33 -1000 Subject: [PATCH 5/5] Geemail done --- index.html | 1 - 1 file changed, 1 deletion(-) diff --git a/index.html b/index.html index fa8e1dd3..66e7b5cd 100644 --- a/index.html +++ b/index.html @@ -93,7 +93,6 @@ // countBox.classname = 'counter'; // countBox.innerHTML = 'Inbox: ' + geemails.length; // main.appendChild(countBox); - var grabBox = document.getElementsByClassName('msgContainer'); //Outbox click function to show/hide var sentPic = document.getElementById('outbox');