A Pen by Deepak Surya S on CodePen.
Created
September 4, 2017 13:16
-
-
Save DeepakSuryaS/eba9e808dc612dc2a5bd794bcba5b1a3 to your computer and use it in GitHub Desktop.
quotemachine
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<html> | |
<head> | |
<meta charset="utf-8"> | |
<title>Random quote machine</title> | |
<link rel="stylesheet" href="style.css"> | |
<link href="https://fonts.googleapis.com/css?family=Kaushan+Script" rel="stylesheet"> | |
</head> | |
<body onload="startTime(); startDate()"> | |
<div class="container"> | |
<div id="display"></div> | |
<!--<h4 id="h4">Hit that button below to get a new quote!</h4>--> | |
<div id="quotehere"> | |
<!--quotes appear here--> | |
</div> | |
<a href="https://twitter.com/share" class="twitter-share-button">Tweet</a> <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script> | |
</div> | |
<button type="button" name="button" onclick="newQuote()" id="getquote">Get!</button> | |
</body> | |
<script type="text/javascript" src="functions.js"></script> | |
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
function startTime() { | |
var today=new Date(); | |
var h=today.getHours(); | |
var m=today.getMinutes(); | |
var s=today.getSeconds(); | |
var ampm = ""; | |
m = checkTime(m); | |
if (h > 12) { | |
h = h - 12; | |
ampm = " PM"; | |
} else if (h == 12){ | |
h = 12; | |
ampm = " AM"; | |
} else if (h < 12){ | |
ampm = " AM"; | |
} else { | |
ampm = "PM"; | |
}; | |
if(h==0) { | |
h=12; | |
} | |
document.getElementById('display').innerHTML = h+":"+m+ampm; | |
var t = setTimeout(function(){startTime()},500); | |
} | |
function checkTime(i) { | |
if (i<10) {i = "0" + i}; // add zero in front of numbers < 10 | |
return i; | |
} | |
var quotes = [ | |
'You were born original, don\'t die a copy.', | |
'It\'s not that I\'m so smart, it\'s just that I stay with problems longer.', | |
'Your only limit is you.', | |
'It always seems impossible until it\'s done.', | |
'A little progress each day adds up to great results.', | |
'Stop wishing and start doing.', | |
'Work hard in silence, let success speak for you.', | |
'It comes down to one simple thing: how bad do you want it ?', | |
'Be so good that they can\'t ignore you.', | |
'I am going to make you so proud! - note to self.', | |
'Nothing worth having comes easy.', | |
'Focus on your goal, don\'t look in any direction but ahead.', | |
'Nothing changes if nothing changes.', | |
'Hustle until your haters ask if you are hiring.', | |
'You can not have a better tomorrow if you are still thinking about yesterday.', | |
'One day or day one. You decide.', | |
'No pain, no gain. Shut up and train.', | |
'Purpose is an incredible alarm clock.', | |
'Grow through what you go through.', | |
'The difference between extraordinary and ordinary is that little extra.' | |
]; | |
function newQuote() { | |
var randomNumber = Math.floor(Math.random() * quotes.length); | |
document.getElementById('quotehere').innerHTML = quotes[randomNumber]; | |
var x = document.getElementsById(h4); | |
if (x.style.display === 'block') { | |
x.style.display = 'none'; | |
} | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
body { | |
padding: 0px; | |
margin: 0px; | |
} | |
.container { | |
width: auto; | |
height: 100%; | |
margin: 20px 0px 0px 30px; | |
padding: 120px 0px 0px 170px; | |
font-family: 'Kaushan Script', cursive; | |
} | |
#quotehere { | |
font-size: 26px; | |
color: black; | |
margin-bottom: 60px; | |
} | |
#getquote { | |
width: 100%; | |
height: 365px; | |
margin-top: 80px; | |
padding: 10px; | |
border: 0px; | |
background-color: #ff2020; | |
font-family: cursive; | |
font-style: oblique; | |
font-weight: bolder; | |
color: white; | |
font-size: 48px; | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment