From bb1ac78fe95220f0de81403d197bcefed0c2b8dd Mon Sep 17 00:00:00 2001 From: Felix Pankratz Date: Tue, 4 Jul 2023 18:50:07 +0200 Subject: [PATCH] implement groundwork for topic system: new data structure, dynamic content --- index.html | 2 +- script.js | 147 ++++++++++++++++++++++++++++++++++++----------------- 2 files changed, 100 insertions(+), 49 deletions(-) diff --git a/index.html b/index.html index 511bfee..c85b6d0 100644 --- a/index.html +++ b/index.html @@ -13,7 +13,7 @@ -

7 vs. Wild Bingo 🔄

+

Bingo 🔄

diff --git a/script.js b/script.js index 27619bf..8461798 100644 --- a/script.js +++ b/script.js @@ -1,5 +1,4 @@ "use strict" -let fields = [ // 'MARTINAA/JAAAAA??!!', // '"Du bist doch auch so einer, der ..."', // 'Brain-AFK', @@ -24,46 +23,86 @@ let fields = [ // 'Tamme Story', // 'Ich kam heut morgen auf Arbeit...', // 'Crypto / Fiat / Inflation ...' - 'Krokodil', - 'Blut zu sehen', - '"Ich kämpfe"', - '"Ich kann nicht mehr"', - 'Jemand trinkt unsauberes Wasser', - 'Jemand schneidet von einem lebenden Baum was ab', - 'Knossi raucht', - 'Nackt', - 'Jemand isst eine Kokosnuss', - 'Stufenlos verstellbare Knoten', - '"Ich frag mich, wie es den anderen so geht"', - 'Kleidung ist feucht/nass', - 'Joris verwirft seinen Tagesplan', - 'Sascha flext für die Kamera', - '"Bist du deppert?"', - 'Sonnenbrand', - '7 in the wild', - 'Aus Plastik Müll wird was gebaut', - 'Es wird geschrien', - 'Es wird gesungen', - '"Mir ist kalt"', - 'Dinge bekommen Namen', - '"Das ist auf einem anderen Level"', - 'Kleine Krebse', - 'Jemand entschuldigt sich', - 'Challenge wird falsch verstanden', - 'Es ist alles ganz anders als ich es mir vorgestellt habe', - 'Jemand kündigt an aufzuhören, tut es aber nicht', - 'Urin', - 'Jemand spricht durch die Kamera mit Freunden/Familie', - 'Shelter bricht zusammen', - 'Jemand weint', - 'Sonne kommt raus', - 'Medi Kit wird geöffnet', - 'Kriegt kein Feuer an', - 'Joris starrt in die Kamera', - 'Schimmel', - 'Jemand geht früher' -]; + +let topics = { + '7vsWild': { + 'title': '7 vs. Wild', + 'image': 'img/7-vs-wild-logo.svg', + 'fields': [ + 'Krokodil', + 'Blut zu sehen', + '"Ich kämpfe"', + '"Ich kann nicht mehr"', + 'Jemand trinkt unsauberes Wasser', + 'Jemand schneidet von einem lebenden Baum was ab', + 'Knossi raucht', + 'Nackt', + 'Jemand isst eine Kokosnuss', + 'Stufenlos verstellbare Knoten', + '"Ich frag mich, wie es den anderen so geht"', + 'Kleidung ist feucht/nass', + 'Joris verwirft seinen Tagesplan', + 'Sascha flext für die Kamera', + '"Bist du deppert?"', + 'Sonnenbrand', + '7 in the wild', + 'Aus Plastik Müll wird was gebaut', + 'Es wird geschrien', + 'Es wird gesungen', + '"Mir ist kalt"', + 'Dinge bekommen Namen', + '"Das ist auf einem anderen Level"', + 'Kleine Krebse', + 'Jemand entschuldigt sich', + 'Challenge wird falsch verstanden', + 'Es ist alles ganz anders als ich es mir vorgestellt habe', + 'Jemand kündigt an aufzuhören, tut es aber nicht', + 'Urin', + 'Jemand spricht durch die Kamera mit Freunden/Familie', + 'Shelter bricht zusammen', + 'Jemand weint', + 'Sonne kommt raus', + 'Medi Kit wird geöffnet', + 'Kriegt kein Feuer an', + 'Joris starrt in die Kamera', + 'Schimmel', + 'Jemand geht früher' + ] + }, + 'tinder': { + 'title': '🔥 Tinder', + 'image': 'img/Tinder.svg', + 'fields': [ + 'Sternzeichen', + 'Unaufgeräumtes Zimmer', + 'Pferdemädchen', + 'Duckface', + 'Waschmaschine im Hintergrund', + 'Nur schwarze Bilder', + 'Französin', + 'Selfcare', + 'Persönlichkeitstyp', + 'Nur Fotos mit mehreren', + 'Tier das ihr nicht gehört', + 'Nur Emojis', + 'Nur Bilder', + 'Instagram Handle', + 'Spricht kein Deutsch', + 'Nicht aus der Region (nur zu Besuch)', + 'Selfie ohne Kopf', + 'Random Foto', + 'Spotify Song', + 'Name nicht lesbar', + 'Hat bereits Kinder', + 'Bild im Fitnessstudio', + 'Polyamorie', + 'EMF' + ] + } +} + let seed; +let topic; const urlParams = new URLSearchParams(window.location.search); const seed_elem = document.querySelector('#seeed-value'); const allFields = document.querySelectorAll('#bingo td'); @@ -72,12 +111,7 @@ 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/7-vs-wild-logo.svg"; -centerFieldImage.alt = "7 vs. Wild Logo"; -centerFieldImage.parentElement.addEventListener('contextmenu', ev => { - ev.preventDefault(); - centerFieldImage.parentElement.classList.remove('bingo'); -}); +const topicTitle = document.querySelector('#topic'); /** * Reads the seed from URL Parameter or generates new seed @@ -89,6 +123,25 @@ if (urlParams.has('seeed')) { seed = Date.now().toString(); } +if (urlParams.has('topic')) { + topic = urlParams.get('topic'); +} else { + topic = 'tinder'; +} + +/** + * Set fields, headline and center image based on topic + */ + +let fields = topics[topic].fields; + +topicTitle.innerText = topics[topic].title; +centerFieldImage.src = topics[topic].image; +centerFieldImage.alt = topics[topic].title + ' Logo'; +centerFieldImage.parentElement.addEventListener('contextmenu', ev => { + ev.preventDefault(); + centerFieldImage.parentElement.classList.remove('bingo'); +}); const copyPermalinkToClipboard = function () { const permalink = window.location.href; @@ -239,10 +292,8 @@ function mulberry32(a) { } } - drawTable(); - const redrawTable = function () { winnerMessage.classList.remove('won'); allFields.forEach(elem => {