Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
93 changes: 93 additions & 0 deletions css/style.css

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

141 changes: 132 additions & 9 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -2,17 +2,140 @@
<head>
<script src="js/mail-generator.js"></script>
<link href="css/style.css" rel="stylesheet" media="screen">
<script>
<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

};
</script>
var inbox = window.geemails;

function showHide2(){
var newContentMessage = this.querySelectorAll('.newMessageContent')[0];
if (newContentMessage.style.display === 'block'){
newContentMessage.style.display = 'none';
} else {
newContentMessage.style.display = 'block';
}
}

var intervalID = setInterval(newMessage, 3000);

function newMessage(){
var incoming = getNewMessage();
newCount++
newSub = incoming.subject
newSend = incoming.sender
newBod = incoming.body;
newDate = incoming.date

var newMessageHeader = document.createElement('div');
newMessageHeader.className = 'newHead';
document.body.appendChild(newMessageHeader)

var newDateElem = document.createElement('div');
newDateElem.className = 'newDate';
newDateElem.innerHTML = 'Date: ' + newDate;
newMessageHeader.appendChild(newDateElem);

var newSendElem = document.createElement('div');
newSendElem.className = 'newSend';
newSendElem.innerHTML = 'From: ' + newSend;
newMessageHeader.appendChild(newSendElem);

var newSubElem = document.createElement('div');
newSubElem.className = 'newSub';
newSubElem.innerHTML = 'Subject: ' + newSub;
newMessageHeader.appendChild(newSubElem);

var newContentButton = document.createElement('div');
newContentButton.className = 'newContent';
newContentButton.innerHTML = 'Show';
newContentButton.addEventListener('click', showHide2)
document.body.appendChild(newContentButton);

var newMessageElem = document.createElement('div');
newMessageElem.className = 'newMessageContent';
newContentButton.appendChild(newMessageElem);

var newBodyElem = document.createElement('div');
newBodyElem.className = 'newBody';
newBodyElem.innerHTML = 'Body: ' + newBod;
newMessageElem.appendChild(newBodyElem);

inboxCounter.innerHTML = 'Inbox: ' + newCount;
console.log(newCount)
stop();
}

var pageTitle = document.createElement('title');
pageTitle.innerHTML = 'Gee-Mail';
document.body.appendChild(pageTitle)

var headerBox = document.createElement('h1');
headerBox.id = 'header';
headerBox.innerHTML = 'Gee-Mail';
document.body.appendChild(headerBox);

for (i=0;i<inbox.length;i++){
var message = inbox[i];
var messageSubj = message.subject;
var messageSender = message.sender;
var messageBody = message.body;
var messageDate = message.date;

var messageHeader = document.createElement('div');
messageHeader.className = 'messageHeader';
document.body.appendChild(messageHeader)

var dateElem = document.createElement('div');
dateElem.className = 'date';
dateElem.innerHTML = 'Date: ' + messageDate;
messageHeader.appendChild(dateElem);

var senderElem = document.createElement('div');
senderElem.className = 'sender';
senderElem.innerHTML = 'From: ' + messageSender;
messageHeader.appendChild(senderElem)

var subjectElem = document.createElement('div');
subjectElem.className = 'subject';
subjectElem.innerHTML = 'Subject: ' + messageSubj;
messageHeader.appendChild(subjectElem)

var contentButton = document.createElement('div');
contentButton.className = 'content';
contentButton.innerHTML = 'Show';
document.body.appendChild(contentButton);

var messageElem = document.createElement('div');
messageElem.className = 'messageContent';
contentButton.appendChild(messageElem);

var bodyElem = document.createElement('div');
bodyElem.className = 'body';
bodyElem.innerHTML = 'Body: ' + messageBody;
messageElem.appendChild(bodyElem);
}

var contentButton = document.getElementsByClassName('content')
for(i=0;i<inbox.length;i++){
contentButton[i].addEventListener('click', showHide);
}

function showHide(){
var contentMessage = this.querySelectorAll('.messageContent')[0];
if (contentMessage.style.display === 'block'){
contentMessage.style.display = 'none';
} else {
contentMessage.style.display = 'block';
}
}

var newCount = inbox.length;
var inboxCounter = document.createElement('h4');
inboxCounter.innerHTML = 'inbox: ' + newCount;
headerBox.appendChild(inboxCounter)

}
</script>
</head>
<body>
<div class="container" id="main">
Build Me!
</div>
</body>
</html>