Skip to content

Instantly share code, notes, and snippets.

@BlackScorp

BlackScorp/Gewinnspiel.html

Created September 6, 2020 11:15
Show Gist options
  • Save BlackScorp/2f12b16e234ad9b0cfeb78af774d32ba to your computer and use it in GitHub Desktop.
Save BlackScorp/2f12b16e234ad9b0cfeb78af774d32ba to your computer and use it in GitHub Desktop.
Download ZIP
Raw
Gewinnspiel.html
<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="UTF-8">
<title>Gewinnspiel</title>
<style>
body{
position: absolute;
top:0;
left:0;
width: 100%;
height: 100%;
margin:0;
padding: 0;
}
.box{
position: relative;
width: 300px;
margin: 20% auto;
border: 1px solid black;
padding:1em;
text-align: center;
}
.winner{
border:2px dashed red;
}
</style>
</head>
<body>
<div id="name" class="box">
Winner is?
</div>
<script>
document.addEventListener('DOMContentLoaded', function(){
let participants = [
"Yezz - The gaming show",
"Ortwin Pinke",
"Tu Nixgut",
"TheOriginYT",
"MMNewmedia",
"Kay Rall",
"Bibaltik",
"Bremer Community",
"Anton Schur",
"Ilch 2.0",
"Atze Peng",
"Weblio",
"Philipp Daus",
"Mr. WasGehtSieDasAn",
"Easy Mathematics",
"Dirk Kling",
"Aristor",
"Sven S",
"Jodu 555",
"DerTim",
"DJ-ShadowByte-666"
];
let nameBox = document.getElementById('name');
let start;
let elapsed;
let frameCounter = 0;
let frameSkip = 1;
function update(timestamp){
if(undefined === start){
start = timestamp;
}
elapsed = timestamp - start;
if(frameCounter > frameSkip){
let randomIndex = Math.floor(Math.random()*participants.length);
let winner = participants[randomIndex];
nameBox.innerHTML = winner;
frameSkip *=1.1;
console.log(frameSkip);
}
frameCounter++;
if(elapsed < 5000){
window.requestAnimationFrame(update);
}else{
nameBox.classList.add('winner');
}
}
window.requestAnimationFrame(update);
});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment