Skip to content

Instantly share code, notes, and snippets.

@jeffehobbs

jeffehobbs/index.html

Last active January 4, 2016 15:18
Show Gist options
  • Save jeffehobbs/8639562 to your computer and use it in GitHub Desktop.
Save jeffehobbs/8639562 to your computer and use it in GitHub Desktop.
Download ZIP
Jersey Scandal Generator Version 4
Raw
index.html
<html>
<head>
<title>Jersey Scandal Article Generator</title>
<style>
@font-face {
font-family: 'PreloSlabExtraBoldExtraBold';
src: url('font/preloslab-extrabold-webfont.eot');
src: url('font/preloslab-extrabold-webfont.eot?#iefix') format('embedded-opentype'),
url('font/preloslab-extrabold-webfont.woff') format('woff'),
url('font/preloslab-extrabold-webfont.ttf') format('truetype'),
url('font/preloslab-extrabold-webfont.svg#PreloSlabExtraBoldExtraBold') format('svg');
font-weight: normal;
font-style: normal;
}
body {
padding: 20px;
}
p {
font-family: Georgia, serif;
font-size: 16px;
line-height: 24px;
color: #363636;
}
button {
display: block;
font-family: PreloSlabExtraBoldExtraBold, sans-serif;
font-size: 22px;
margin: 0 auto;
text-align: center;
color: white;
background: #4f90cc;
background-image: -webkit-gradient(linear, left top, left bottom, from(#5091cd), to(#437eb5));
background-image: -webkit-linear-gradient(top, #5091cd, #437eb5);
background-image: -moz-linear-gradient(top, #5091cd, #437eb5);
background-image: -o-linear-gradient(top, #5091cd, #437eb5);
background-image: -ms-linear-gradient(top, #5091cd, #437eb5);
background-image: linear-gradient(top, #5091cd, #437eb5);
filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr='#5091cd', EndColorStr='#437eb5');
padding: 6px 6px 4px 6px;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
text-decoration: none;
white-space: nowrap;
outline: none;
}
.madlib {
color: white;
transition: color 0.2s;
-webkit-transition: color 0.2s;
-moz-transition: color 0.2s;
}
.bold {
font-weight: bold;
}
.fadein {
color: black;
}
</style>
</head>
<body>
<div class="container">
<p>
<span id="rand-town" class="madlib bold">TRENTON</span> &mdash; A New Jersey
<span id="rand-position" class="madlib">politician</span>
<span id="rand-consequence" class="madlib">has melted down</span> after
<span id="rand-authority" class="madlib">authorities</span> discovered
<span id="rand-gender" class="madlib">he</span> had
<span id="rand-scandal" class="madlib">closed down a bridge</span>
<span id="rand-reason" class="madlib">for political retribution</span>.
</p>
<p>
"<span id="rand-quote" class="madlib">It is what it is</span>," the
<span id="rand-modifier" class="madlib">disgraced</span>
<span id="rand-position-two" class="madlib">politician</span> said at a
<span id="rand-event" class="madlib">press conference</span> today.
</p>
<button id="refreshButton" onclick="refreshScandals();">refresh scandals</button>
</div>
<script>
function refreshScandals () {
//reset text
document.getElementById('rand-town').classList.remove('fadein');
document.getElementById('rand-position').classList.remove('fadein');
document.getElementById('rand-consequence').classList.remove('fadein');
document.getElementById('rand-authority').classList.remove('fadein');
document.getElementById('rand-gender').classList.remove('fadein');
document.getElementById('rand-scandal').classList.remove('fadein');
document.getElementById('rand-reason').classList.remove('fadein');
document.getElementById('rand-quote').classList.remove('fadein');
document.getElementById('rand-modifier').classList.remove('fadein');
document.getElementById('rand-position-two').classList.remove('fadein');
document.getElementById('rand-event').classList.remove('fadein');
setTimeout(function(){
//declare arrays
var towns = ['TRENTON', 'JERSEY CITY', 'NEWARK', 'HOBOKEN','SHEBOYGAN'];
var positions = ['politician', 'congressman', 'school administrator', 'doctor'];
var consequences = ['has melted down', 'is raging furiously', 'cannot stop weeping'];
var authorities = ['authorities', 'detectives', 'firefighters'];
var genders = ['he', 'she'];
var scandals = ['closed down a bridge', 'canceled the Superbowl', 'helped out fugitive bankers', 'drained the Meadowlands'];
var reasons = ['for political retribution', 'for payola scheme', 'for campaign contributions', 'for an episode of the Sopranos'];
var quotes = ['It is what it is', 'Whaddagonnado'];
var modifiers = ['disgraced', 'humiliated', 'sweaty'];
var events = ['press conference', 'local Chuck E. Cheese'];
var refreshes = ['Yeah yeah', 'So what', 'Big deal', 'Who cares'];
//shuffle through contents of each array, picking one entry per array
var randTown = towns[Math.floor(Math.random() * towns.length)];
var randPosition = positions[Math.floor(Math.random() * positions.length)];
var randConsequence = consequences[Math.floor(Math.random() * consequences.length)];
var randAuthority = authorities[Math.floor(Math.random() * authorities.length)];
var randGender = genders[Math.floor(Math.random() * genders.length)];
var randScandal = scandals[Math.floor(Math.random() * scandals.length)];
var randReason = reasons[Math.floor(Math.random() * reasons.length)];
var randQuote = quotes[Math.floor(Math.random() * quotes.length)];
var randModifier = modifiers[Math.floor(Math.random() * modifiers.length)];
var randEvent = events[Math.floor(Math.random() * events.length)];
var randRefresh = refreshes[Math.floor(Math.random() * refreshes.length)];
//place the random entry into the appropriate place in the HTML
document.getElementById('rand-town').innerHTML = randTown;
document.getElementById('rand-position').innerHTML = randPosition;
document.getElementById('rand-position-two').innerHTML = randPosition;
document.getElementById('rand-consequence').innerHTML = randConsequence;
document.getElementById('rand-authority').innerHTML = randAuthority;
document.getElementById('rand-gender').innerHTML = randGender;
document.getElementById('rand-scandal').innerHTML = randScandal;
document.getElementById('rand-reason').innerHTML = randReason;
document.getElementById('rand-quote').innerHTML = randQuote;
document.getElementById('rand-modifier').innerHTML = randModifier;
document.getElementById('rand-event').innerHTML = randEvent;
document.getElementById('refreshButton').innerHTML = randRefresh;
//trigger animations
setTimeout(function(){
document.getElementById('rand-town').classList.add('fadein');
}, 200);
setTimeout(function(){
document.getElementById('rand-position').classList.add('fadein');
}, 400);
setTimeout(function(){
document.getElementById('rand-consequence').classList.add('fadein');
}, 600);
setTimeout(function(){
document.getElementById('rand-authority').classList.add('fadein');
}, 800);
setTimeout(function(){
document.getElementById('rand-gender').classList.add('fadein');
}, 1000);
setTimeout(function(){
document.getElementById('rand-scandal').classList.add('fadein');
}, 1200);
setTimeout(function(){
document.getElementById('rand-reason').classList.add('fadein');
}, 1400);
setTimeout(function(){
document.getElementById('rand-quote').classList.add('fadein');
}, 1600);
setTimeout(function(){
document.getElementById('rand-modifier').classList.add('fadein');
}, 1800);
setTimeout(function(){
document.getElementById('rand-position-two').classList.add('fadein');
}, 2000);
setTimeout(function(){
document.getElementById('rand-event').classList.add('fadein');
}, 2200);
}, 200);
};
refreshScandals();
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment