special 37c3 update (more firework less bingo)

fireworks.js

@@ -11,12 +11,12 @@ var canvas = null,
     ctx = null,
     cw = window.innerWidth,
     ch = window.innerHeight,
-    fireworksLimit = 10,
+    fireworksLimit = 15,
     fireworksShown = 0,
     fireworks = [],
     particles = [],
-    hue = 120,
-    timerTotal = 25,
+    hue = 180,
+    timerTotal = 10,
     timerTick = 0,
     animationEnd = true;
 

index.html

@@ -54,12 +54,6 @@
     </tr>
 </table>
 <p id="seeed">Seeed: <span id="seeed-value"></span> <span id="copy-permalink">📋</span></p>
-<div id="winner-message">
-    <p>B</p>
-    <p>I</p>
-    <p>N</p>
-    <p>G</p>
-    <p>O</p>
-</div>
+<div id="winner-message"></div>
 </body>
 </html>

script.js

@@ -33,7 +33,6 @@ const bingoFields = document.querySelectorAll('#bingo td.bingo-field');
 const centerFieldImage = document.querySelector('#center-field-image');
 const refreshBingoButton = document.querySelector('#refresh-bingo');
 const copyPermalinkButton = document.querySelector('#copy-permalink');
-const winnerMessage = document.querySelector('#winner-message');
 centerFieldImage.src = "img/logo.svg"
 centerFieldImage.alt = "37C3 Logo";
 centerFieldImage.parentElement.addEventListener('contextmenu', ev => {
@@ -120,9 +119,7 @@ const checkForBingo = (field) => {
     }
 
     if (bingo) {
-        winnerMessage.classList.remove('won');
         window.fireworks.start();
-        winnerMessage.classList.add('won');
     }
 
 };
@@ -206,7 +203,6 @@ drawTable();
 
 
 const redrawTable = function () {
-    winnerMessage.classList.remove('won');
     allFields.forEach(elem => {
         elem.classList.remove('bingo');
     });

style.css

@@ -131,20 +131,6 @@ span#copy-permalink, span#refresh-bingo {
     cursor: pointer;
 }
 
-div#winner-message {
-    display: flex;
-    position: fixed;
-    font-size: xx-large;
-    text-shadow: 0 0 40px white;
-    transition: all ease-out .75s;
-    pointer-events: none;
-}
-
-div#winner-message.won {
-    animation: won 5s;
-    animation-timing-function: ease-in-out;
-}
-
 @keyframes won {
     0% {
         left: 50%;
@@ -191,22 +177,10 @@ div#winner-message.won {
     td {
         font-size: large;
     }
-    div#winner-message.won {
-        animation: unset;
-    }
-    div#winner-message {
-        display: none;
-    }
 }
 
 @media screen and (max-width: 576px) and (orientation: portrait) {
     td {
         font-size: small;
     }
-    div#winner-message.won {
-        animation: unset;
-    }
-    div#winner-message {
-        display: none;
-    }
 }