Skip to content

Instantly share code, notes, and snippets.

@danomanion

danomanion/index.html

Created March 13, 2018 23:43
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save danomanion/8c9620690a9c240710dfd0034f0508d1 to your computer and use it in GitHub Desktop.
Save danomanion/8c9620690a9c240710dfd0034f0508d1 to your computer and use it in GitHub Desktop.
Download ZIP
Random Quote Machine
Raw
index.html
<html lang="en">
<head>
<meta charset="utf-8">
<!-- Bootstrap added via CodePens scripts -->
<title>Random Quote Machine</title>
</head>
<body>
<section>
<div id="quoteDisplay"></div>
<button onclick="return handleClick(event);">More Inspiration Please</button>
</section>
</body>
</html>
Raw
script.js
const quotes = [
{
quote : "example quote",
source : "Test McTesto"
},
{
quote : "example quote 2",
source : "Testy Kanatest"
},
{
quote : "example quote 3",
source : "Testy Kanatest"
},
{
quote : "example quote 4",
source : "Soul Le Test, Jr."
}
];
var randomNumberResult = getRandomInt(quotes.length);
var randomQuoteResult = getQuote(randomNumberResult);
// Add Quote to Interface
document.getElementById('quoteDisplay').innerHTML = randomQuoteResult;
// **********************
// Generate a random number from availble quotes
function getRandomInt(max) {
return Math.floor(Math.random() * Math.floor(max));
}
// Select a Quote from Array from Random Number
// Use a Template Literal for display quote
function getQuote(num) {
return `<blockquote>
<p>${quotes[num].quote}</p>
<em>&mdash; ${quotes[num].source}</em>
</blockquote>`;
}
// Quote Button
function quoteButton() {
}
Raw
styles
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-beta.2/css/bootstrap.css" rel="stylesheet" />
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment