1077 lines
43 KiB
JavaScript
1077 lines
43 KiB
JavaScript
// Database of 49 collaborations
|
||
const fortniteCollabs = [
|
||
{
|
||
"id": "adidas",
|
||
"name": "Adidas Schuhe",
|
||
"category": "fashion",
|
||
"subcategory": "Schuhe & Mode",
|
||
"release": "Juli 2024",
|
||
"info": "Die weltbekannte Marke mit den drei Streifen kooperiert direkt mit Fortnite. Spieler können stylische Tracksuits und kultige Sneaker wie den Adidas Superstar als Kicks für ihre Charaktere erwerben und ausrüsten.",
|
||
"isInFortnite": true,
|
||
"realImage": "images/adidasreal.jpg.webp",
|
||
"fnImage": "images/adidasfn.jpg"
|
||
},
|
||
{
|
||
"id": "crocs",
|
||
"name": "Crocs",
|
||
"category": "fashion",
|
||
"subcategory": "Schuhe & Mode",
|
||
"release": "Ende 2024",
|
||
"info": "Die legendären und oft kontrovers diskutierten Gummi-Clogs gibt es tatsächlich als kosmetische Kicks im Spiel. Du kannst diesen Skin mit knallig bunten Crocs ausstatten – sogar mit ansteckbaren Jibbitz.",
|
||
"isInFortnite": true,
|
||
"realImage": "images/crocsreal.jpg.webp",
|
||
"fnImage": "images/crocsfn.jpg"
|
||
},
|
||
{
|
||
"id": "nike",
|
||
"name": "Nike Air Max",
|
||
"category": "fashion",
|
||
"subcategory": "Schuhe & Mode",
|
||
"release": "Juni 2023",
|
||
"info": "Ein absolut ikonischer Schuh, den man nach dem Kauf mit jedem beliebigen Skin im Spiel ausrüsten kann.",
|
||
"isInFortnite": true,
|
||
"realImage": "images/nikereal.jpg.webp",
|
||
"fnImage": "images/nikefn.jpg.webp"
|
||
},
|
||
{
|
||
"id": "vans",
|
||
"name": "Vans Schuhe",
|
||
"category": "fashion",
|
||
"subcategory": "Schuhe & Mode",
|
||
"release": "Dezember 2024",
|
||
"info": "Auch die berühmten Skaterschuhe von Vans haben ihren Weg auf das Schlachtfeld gefunden. Die hochgeschnittenen Stoffschuhe besitzen den charakteristischen Seitenstreifen.",
|
||
"isInFortnite": true,
|
||
"realImage": "images/vansreal.jpg",
|
||
"fnImage": "images/vansfn.jpg.webp"
|
||
},
|
||
{
|
||
"id": "bmw",
|
||
"name": "BMW M4 Coupe",
|
||
"category": "car",
|
||
"subcategory": "Autos & Fahrzeuge",
|
||
"release": "Dezember 2023",
|
||
"info": "Deutsche Wertarbeit in Battle Royale! Echte BMW-Modelle wie das M4 Coupe und der M2 wurden als voll fahrbare Karosserien ins Spiel integriert.",
|
||
"isInFortnite": true,
|
||
"realImage": "images/bmwreal.jpeg.webp",
|
||
"fnImage": "images/bmwfn.jpeg"
|
||
},
|
||
{
|
||
"id": "cybertruck",
|
||
"name": "Tesla Cybertruck",
|
||
"category": "car",
|
||
"subcategory": "Autos & Fahrzeuge",
|
||
"release": "Juli 2024",
|
||
"info": "Diese Metallfarbene Mülltonne gibt es tatsächlich auch in Fortnite. Müll-CEO, Müllauto, Müll Collab. War innerhalb der Community auch kontrovers weil fuck musk!",
|
||
"isInFortnite": true,
|
||
"realImage": "images/cybertruckreal.jpg",
|
||
"fnImage": "images/cybertruckfn.webp"
|
||
},
|
||
{
|
||
"id": "landrover",
|
||
"name": "Land Rover Defender",
|
||
"category": "car",
|
||
"subcategory": "Autos & Fahrzeuge",
|
||
"release": "Januar 2026",
|
||
"info": "Der legendäre, extrem robuste Geländewagen Land Rover Defender D7X-R feierte passend zur Rallye Dakar sein Debüt als fahrbare Karosserie im Fortnite-Universum.",
|
||
"isInFortnite": true,
|
||
"realImage": "images/landroverreal.jpeg",
|
||
"fnImage": "images/landroverfn.jpg"
|
||
},
|
||
{
|
||
"id": "mclaren",
|
||
"name": "McLaren 765LT",
|
||
"category": "car",
|
||
"subcategory": "Autos & Fahrzeuge",
|
||
"release": "Dezember 2023",
|
||
"info": "Einer der teuersten und schnellsten realen Supersportwagen der Welt wurde als kosmetisches Auto in Fortnite fahrbar gemacht – komplett lizenziert und detailgetreu nachempfunden.",
|
||
"isInFortnite": true,
|
||
"realImage": "images/mclarenreal.jpg",
|
||
"fnImage": "images/mclarenfn.jpg"
|
||
},
|
||
{
|
||
"id": "mercedes",
|
||
"name": "Mercedes-AMG GT 63 S (4-Türer)",
|
||
"category": "car",
|
||
"subcategory": "Autos & Fahrzeuge",
|
||
"release": "September 2025",
|
||
"info": "Der Mercedes-AMG GT 63 S ist als viertüriges Sportcoupé ein offiziell spielbares Fahrzeug in Fortnite. Er wurde im September 2025 mitsamt detailgetreuem Interieur und Custom-Felgen in das Spiel integriert.",
|
||
"isInFortnite": true,
|
||
"realImage": "images/mercedesreal.jpg",
|
||
"fnImage": "images/mercedesfn.webp"
|
||
},
|
||
{
|
||
"id": "nissan",
|
||
"name": "Nissan Fairlady Z",
|
||
"category": "car",
|
||
"subcategory": "Autos & Fahrzeuge",
|
||
"release": "Dezember 2023",
|
||
"info": "Der Traum aller Drift-Enthusiasten. Der klassische Nissan Fairlady Z wurde als voll anpassbares Auto für die Battle-Royale-Insel ins Spiel gebracht.",
|
||
"isInFortnite": true,
|
||
"realImage": "images/nissanreal.jpg",
|
||
"fnImage": "images/nissanfn.webp"
|
||
},
|
||
{
|
||
"id": "billieeilish",
|
||
"name": "Billie Eilish",
|
||
"category": "celebrity",
|
||
"subcategory": "Promis & Musik",
|
||
"release": "April 2024",
|
||
"info": "Die mehrfache Grammy-Gewinnerin war der Headliner von Fortnite Festival Season 3. Ihr Skin kam mit ihren typischen, übergroßen Outfits und neongrünen Haaren.",
|
||
"isInFortnite": true,
|
||
"realImage": "images/billieeilishreal.jpg",
|
||
"fnImage": "images/billieeilishfn.jpg"
|
||
},
|
||
{
|
||
"id": "hamilton",
|
||
"name": "Lewis Hamilton",
|
||
"category": "celebrity",
|
||
"subcategory": "Promis & Sport",
|
||
"release": "November 2023",
|
||
"info": "Der siebenfache Formel-1-Weltmeister Lewis Hamilton raste als spielbarer Skin in die Icon-Serie, inklusive eines anpassbaren Outfits.",
|
||
"isInFortnite": true,
|
||
"realImage": "images/hamiltonreal.webp",
|
||
"fnImage": "images/hamiltonfn.jpg"
|
||
},
|
||
{
|
||
"id": "kimk",
|
||
"name": "Kim Kardashian",
|
||
"category": "celebrity",
|
||
"subcategory": "Promis & TV",
|
||
"release": "Dezember 2025",
|
||
"info": "Die Queen des Reality-TVs ist tatsächlich in Fortnite! Inklusive diverser berühmter Outfits (wie dem Pelzmantel-Look und einem SKIMS-Bodysuit) sowie einem Emote, das auf ihrem legendären Paper-Magazine-Cover basiert.",
|
||
"isInFortnite": true,
|
||
"realImage": "images/KimKreal.jpeg",
|
||
"fnImage": "images/KimKfn.jpeg"
|
||
},
|
||
{
|
||
"id": "marcoreus",
|
||
"name": "Marco Reus",
|
||
"category": "celebrity",
|
||
"subcategory": "Promis & Sport",
|
||
"release": "Juni 2021",
|
||
"info": "Ja, der ehemalige Kapitän von Borussia Dortmund ist wirklich spielbar! Er kam passend zur Europameisterschaft 2021 als einer der ersten echten Fußballer weltweit in die Icon-Serie.",
|
||
"isInFortnite": true,
|
||
"realImage": "images/marcoreusreal.jpg",
|
||
"fnImage": "images/marcoreusfn.jpg"
|
||
},
|
||
{
|
||
"id": "naomiosaka",
|
||
"name": "Naomi Osaka",
|
||
"category": "celebrity",
|
||
"subcategory": "Promis & Sport",
|
||
"release": "März 2022",
|
||
"info": "Die weltberühmte Tennisspielerin und vierfache Grand-Slam-Siegerin bekam zwei farbenprächtige Skins im Spiel, die stark von Anime- und Modedesigns inspiriert sind.",
|
||
"isInFortnite": true,
|
||
"realImage": "images/naomiosakareal.jpg",
|
||
"fnImage": "images/naomiosakafn.jpg"
|
||
},
|
||
{
|
||
"id": "shaq",
|
||
"name": "Shaquille O'Neal",
|
||
"category": "celebrity",
|
||
"subcategory": "Promis & Sport",
|
||
"release": "Oktober 2024",
|
||
"info": "Der legendäre NBA-Riese 'Shaq' kam mit zwei Skins in den Shop – einer normalen Version und seinem Musik-Alter-Ego 'DJ Diesel'.",
|
||
"isInFortnite": true,
|
||
"realImage": "images/shaqreal.webp",
|
||
"fnImage": "images/shaqfn.webp"
|
||
},
|
||
{
|
||
"id": "snoopdogg",
|
||
"name": "Snoop Dogg",
|
||
"category": "celebrity",
|
||
"subcategory": "Promis & Musik",
|
||
"release": "November 2024",
|
||
"info": "Snoop Dogg ist eine weltweit bekannte und durchaus auch umstrittene Persönlichkeit, die ihren Weg in Fortnite gefunden hat – unter anderem sogar mit einem eigenen Weihnachtsmann-Skin.",
|
||
"isInFortnite": true,
|
||
"realImage": "images/snoodoggreal.jpg",
|
||
"fnImage": "images/snoopdoggfn.jpg"
|
||
},
|
||
{
|
||
"id": "ladygaga",
|
||
"name": "Lady Gaga",
|
||
"category": "celebrity",
|
||
"subcategory": "Promis & Musik",
|
||
"release": "Februar 2024",
|
||
"info": "Nachdem sie 2019 auf Twitter verwirrt fragte 'What's fortnight', wurde Lady Gaga Headliner von Fortnite Festival Season 2 mit markanten Cyberpunk- und Chromatica-Skins.",
|
||
"isInFortnite": true,
|
||
"realImage": "images/ladygagareal.jpg",
|
||
"fnImage": "images/ladygagafn.webp"
|
||
},
|
||
{
|
||
"id": "weeknd",
|
||
"name": "The Weeknd",
|
||
"category": "celebrity",
|
||
"subcategory": "Promis & Musik",
|
||
"release": "Dezember 2023",
|
||
"info": "Der R&B-Superstar war der allererste Headliner des neuen 'Fortnite Festival'-Modus. Sein berühmtes Outfit mit dem roten Sakko war über Monate hinweg ein fester Anblick im Spiel.",
|
||
"isInFortnite": true,
|
||
"realImage": "images/weekndreal.png",
|
||
"fnImage": "images/weekndfn.webp"
|
||
},
|
||
{
|
||
"id": "artclown",
|
||
"name": "Art der Clown (Terrifier)",
|
||
"category": "horror",
|
||
"subcategory": "Horror-Filme",
|
||
"release": "Oktober 2025",
|
||
"info": "Der stumme, psychopathische Mörderclown aus den berüchtigten 'Terrifier'-Slasherfilmen ist tatsächlich ein offizieller Skin. Obwohl die Reihe für ekligen Gore bekannt ist, der mit echter Filmkunst wenig zu tun hat, ist es absolut bizarr, dass dieser Charakter in einem Spiel wie Fortnite spielbar ist.",
|
||
"isInFortnite": true,
|
||
"realImage": "images/artclownreal.jpg",
|
||
"fnImage": "images/artclownfn.jpg"
|
||
},
|
||
|
||
{
|
||
"id": "jason",
|
||
"name": "Jason Voorhees (Freitag der 13.)",
|
||
"category": "horror",
|
||
"subcategory": "Horror-Filme",
|
||
"release": "Oktober 2025",
|
||
"info": "Der unaufhaltsame Killer aus Camp Crystal Lake schlitzte sich pünktlich zu Fortnitemares 2025 ins Spiel. Neben dem Skin gab es ihn auch als gefährlichen Boss auf der Map zu bekämpfen.",
|
||
"isInFortnite": true,
|
||
"realImage": "images/jasonreal.jpg",
|
||
"fnImage": "images/jasonfn.jpg.webp"
|
||
},
|
||
{
|
||
"id": "jigsaw",
|
||
"name": "Billy die Puppe (SAW)",
|
||
"category": "horror",
|
||
"subcategory": "Horror-Filme",
|
||
"release": "Oktober 2024",
|
||
"info": "Die gruselige Puppe auf dem roten Dreirad aus der extrem blutigen SAW-Reihe schaffte es als vollwertiger Charakter-Skin in den Shooter. 'Lass uns ein Spiel spielen' bekommt hier eine ganz neue Bedeutung.",
|
||
"isInFortnite": true,
|
||
"realImage": "images/jigsawreal.jpg",
|
||
"fnImage": "images/jigsawfn.jpg"
|
||
},
|
||
{
|
||
"id": "predator",
|
||
"name": "Predator",
|
||
"category": "horror",
|
||
"subcategory": "Horror-Filme",
|
||
"release": "Januar 2021",
|
||
"info": "Der außerirdische Trophäenjäger war ein geheimer Boss in Chapter 2, Season 5. Spieler mussten ihn in den 'Stealthy Stronghold'-Ruinen besiegen, um seinen legendären Skin freizuschalten.",
|
||
"isInFortnite": true,
|
||
"realImage": "images/predatorreal.webp",
|
||
"fnImage": "images/predatorfn.jpg"
|
||
},
|
||
{
|
||
"id": "xenomorph",
|
||
"name": "Xenomorph (Alien)",
|
||
"category": "horror",
|
||
"subcategory": "Horror-Filme",
|
||
"release": "Februar 2021",
|
||
"info": "Das furchterregende Alien aus den Ridley-Scott-Klassikern kam im Weltraum-Crossover ins Spiel. Im Weltall hört dich niemand schreien, aber auf der Fortnite-Insel hört dich jeder weinen, wenn du von einer tanzenden Banane eliminiert wirst.",
|
||
"isInFortnite": true,
|
||
"realImage": "images/xenomorphreal.webp",
|
||
"fnImage": "images/xenomorphfn.jpg"
|
||
},
|
||
{
|
||
"id": "godzilla",
|
||
"name": "Godzilla",
|
||
"category": "popculture",
|
||
"subcategory": "Kultur & Games",
|
||
"release": "Dezember 2025",
|
||
"info": "Der König der Monster höchstpersönlich! Als Teil des Chapter 6, Season 1 Battle Pass können Spieler als gigantische Echse herumlaufen und Gebäude zerlegen. Nach dem Event wurde er als normal spielbarer Skin freigeschaltet und dafür auf menschengröße heruntergeschrumpft.",
|
||
"isInFortnite": true,
|
||
"realImage": "images/godzillareal.jpg.webp",
|
||
"fnImage": "images/godzillafn.jpeg.webp"
|
||
},
|
||
{
|
||
"id": "johnwick",
|
||
"name": "John Wick",
|
||
"category": "popculture",
|
||
"subcategory": "Kultur & Games",
|
||
"release": "Mai 2019",
|
||
"info": "Keanu Reeves' berühmtester Auftragskiller war eine der allerersten großen Hollywood-Kollaborationen im Spiel. Wer ihm seinen Hund stiehlt, lernt ihn ganz schnell kennen.",
|
||
"isInFortnite": true,
|
||
"realImage": "images/johnwickreal.jpeg",
|
||
"fnImage": "images/johnwickfn.webp"
|
||
},
|
||
{
|
||
"id": "southpark",
|
||
"name": "South Park",
|
||
"category": "popculture",
|
||
"subcategory": "Kultur & Games",
|
||
"release": "Januar 2026",
|
||
"info": "Die chaotische Truppe aus South Park kam als Mini-Pass-Event nach Fortnite! Cartman, Kenny, Kyle und Stan steuern coole Mech-Suits auf dem Schlachtfeld. Auch Towelie das Handtuch ist als Begleiter dabei. Obwohl die Serie politisch teilweise 'inkorrekt' und für Kinder auf gar keinen Fall geeignet ist, erfreut sie sich extrem hoher Beliebtheit.",
|
||
"isInFortnite": true,
|
||
"realImage": "images/southparkreal.jpg",
|
||
"fnImage": "images/soutparkfn.jpg"
|
||
},
|
||
{
|
||
"id": "killbill",
|
||
"name": "Kill Bill (Die Braut)",
|
||
"category": "popculture",
|
||
"subcategory": "Popkultur & Filme",
|
||
"release": "November 2025",
|
||
"info": "Die Braut (The Bride), verkörpert von Uma Thurman in Quentin Tarantinos Kultfilm-Zweiteiler 'Kill Bill', ist als offizieller Skin im legendären gelben Motorrad-Outfit im Spiel verfügbar.",
|
||
"isInFortnite": true,
|
||
"realImage": "images/killbillreal.jpg",
|
||
"fnImage": "images/killbillfn.avif"
|
||
},
|
||
{
|
||
"id": "pulpfiction",
|
||
"name": "Pulp Fiction",
|
||
"category": "popculture",
|
||
"subcategory": "Popkultur & Filme",
|
||
"release": "Dezember 2025",
|
||
"info": "Vincent Vega und Jules Winnfield im legendären schwarzen Anzug aus Quentin Tarantinos Film-Meilenstein wurden als offizielle Skins veröffentlicht. Auch der berühmte Tanz und der Koffer sind im Spiel verewigt.",
|
||
"isInFortnite": true,
|
||
"realImage": "images/pulpfictionreal.jpg",
|
||
"fnImage": "images/pulpfictionfn.webp"
|
||
},
|
||
{
|
||
"id": "dune",
|
||
"name": "Dune",
|
||
"category": "popculture",
|
||
"subcategory": "Popkultur & Filme",
|
||
"release": "Oktober 2021",
|
||
"info": "Paul Atreides (gespielt von Timothée Chalamet) und Chani (gespielt von Zendaya) aus Denis Villeneuves Verfilmung des Sci-Fi-Epos Dune betraten im Oktober 2021 das Fortnite-Schlachtfeld.",
|
||
"isInFortnite": true,
|
||
"realImage": "images/dunereal.jpg",
|
||
"fnImage": "images/dunefn.jpg"
|
||
},
|
||
{
|
||
"id": "metallica",
|
||
"name": "Metallica",
|
||
"category": "popculture",
|
||
"subcategory": "Popkultur & Musik",
|
||
"release": "Juni 2024",
|
||
"info": "Die gesamte legendäre Metal-Band (James Hetfield, Lars Ulrich, Kirk Hammett und Robert Trujillo) stürmte im Juni 2024 Fortnite als spielbare Skins. Zusammen mit ihnen kam ein ganzes virtuelles Konzert auf einer schwebenden Festival-Bühne ins Spiel.",
|
||
"isInFortnite": true,
|
||
"realImage": "images/metallicareal.webp",
|
||
"fnImage": "images/metallicafn.jpg"
|
||
},
|
||
{
|
||
"id": "badboys",
|
||
"name": "Bad Boys (Mike Lowrey)",
|
||
"category": "popculture",
|
||
"subcategory": "Popkultur & Filme",
|
||
"release": "August 2021",
|
||
"info": "Mike Lowrey, gespielt von Will Smith in der Action-Reihe 'Bad Boys', stürmte die Fortnite-Insel als offizieller Charakter-Skin. Der Skin kam passend zum Kinostart des Films 'Bad Boys for Life' heraus, der an den Kinokassen allerdings ziemlich floppte.",
|
||
"isInFortnite": true,
|
||
"realImage": "images/badboysreal.jpeg",
|
||
"fnImage": "images/badboysfn.jpeg.webp"
|
||
},
|
||
{
|
||
"id": "eminem",
|
||
"name": "Eminem",
|
||
"category": "celebrity",
|
||
"subcategory": "Promis & Musik",
|
||
"release": "November 2023",
|
||
"info": "Der 'Rap God' Eminem erhielt im November 2023 zum Finale von Chapter 4 gleich drei verschiedene offizielle Skins (Rap Boy, Slim Shady und Marshall Never More) und trat im spielinternen Big-Bang-Event auf.",
|
||
"isInFortnite": true,
|
||
"realImage": "images/eminemreal.jpg",
|
||
"fnImage": "images/eminemfn.jpeg.webp"
|
||
},
|
||
{
|
||
"id": "travisscott",
|
||
"name": "Travis Scott",
|
||
"category": "celebrity",
|
||
"subcategory": "Promis & Musik",
|
||
"release": "April 2020",
|
||
"info": "Der US-Rapper Travis Scott veranstaltete im April 2020 das legendäre In-Game-Konzert 'Astronomical', das von über 12 Millionen Spielern live im Spiel verfolgt wurde. Seine Skins gehören heute zu den seltensten im Spiel. Erwähnenswert ist auch, dass bei seiner 'Astroworld'-Massenpanik im Jahr 2021 mehrere Menschen starben, wofür er teils mitverantwortlich gemacht und was von ihm PR-mäßig im Nachhinein grandios vertuscht wurde.",
|
||
"isInFortnite": true,
|
||
"realImage": "images/travisscottreal.webp",
|
||
"fnImage": "images/travisscottfn.webp"
|
||
},
|
||
{
|
||
"id": "avatar",
|
||
"name": "Avatar (Jake Sully)",
|
||
"category": "popculture",
|
||
"subcategory": "Popkultur & Filme",
|
||
"release": "Dezember 2023",
|
||
"info": "Die blauen Na'vi aus James Camerons Kino-Hit Avatar, allen voran Jake Sully, betraten im Dezember 2023 als spielbare Charaktere die Fortnite-Welt, wobei auch Neytiri als spielbarer Skin verfügbar ist.",
|
||
"isInFortnite": true,
|
||
"realImage": "images/jakesullyreal.jpg",
|
||
"fnImage": "images/jakesullyfn.jpeg"
|
||
},
|
||
{
|
||
"id": "hercules",
|
||
"name": "Disney's Hercules",
|
||
"category": "popculture",
|
||
"subcategory": "Popkultur & Filme",
|
||
"release": "September 2025",
|
||
"info": "Der Halbgott Hercules aus Disneys Zeichentrick-Klassiker wurde im September 2025 als Teil der fortlaufenden Kooperationen mit Disney im Item Shop als spielbarer Skin veröffentlicht.",
|
||
"isInFortnite": true,
|
||
"realImage": "images/herculesreal.webp",
|
||
"fnImage": "images/herculesfn.jpeg"
|
||
},
|
||
{
|
||
"id": "strangerthings",
|
||
"name": "Stranger Things (Eleven)",
|
||
"category": "popculture",
|
||
"subcategory": "Popkultur & Serien",
|
||
"release": "November 2023",
|
||
"info": "Eleven (Elf) aus der Netflix-Erfolgsserie Stranger Things kam im November 2023 ins Spiel. Mittlerweile sind sehr viele Charaktere aus der Serie spielbar, darunter Eleven, Jim Hopper, Steve Harrington, Nancy Wheeler und sogar der Demogorgon selbst.",
|
||
"isInFortnite": true,
|
||
"realImage": "images/elevenreal.jpeg",
|
||
"fnImage": "images/elevenfn.webp"
|
||
},
|
||
{
|
||
"id": "daftpunk",
|
||
"name": "Daft Punk",
|
||
"category": "celebrity",
|
||
"subcategory": "Promis & Musik",
|
||
"release": "September 2025",
|
||
"info": "Das legendäre französische Electronic-Duo (Thomas Bangalter und Guy-Manuel de Homem-Christo) erschien im September 2025 mit ihren ikonischen Chrom-Helmen im Spiel im Rahmen der 'Daft Punk Experience'.",
|
||
"isInFortnite": true,
|
||
"realImage": "images/daftpunkreal.jpeg",
|
||
"fnImage": "images/daftpunkfn.jpeg"
|
||
},
|
||
{
|
||
"id": "theoffice",
|
||
"name": "The Office (Michael & Dwight)",
|
||
"category": "popculture",
|
||
"subcategory": "Popkultur & Serien",
|
||
"release": "Januar 2026",
|
||
"info": "Michael Scott und Dwight Schrute aus der weltberühmten Comedy-Serie 'The Office' kamen im Januar 2026 ins Spiel.",
|
||
"isInFortnite": true,
|
||
"realImage": "images/theofficereal.jpeg",
|
||
"fnImage": "images/theofficefn.webp"
|
||
},
|
||
{
|
||
"id": "tomlizard",
|
||
"name": "Tom Lizard (Pixar's Hoppers)",
|
||
"category": "popculture",
|
||
"subcategory": "Popkultur & Filme",
|
||
"release": "März 2026",
|
||
"info": "Tom Lizard aus dem Disney-Pixar-Film 'Hoppers' wurde im März 2026 als Teil einer Crossover-Aktion im Item Shop als Skin veröffentlicht.",
|
||
"isInFortnite": true,
|
||
"realImage": "images/tomlizardreal.webp",
|
||
"fnImage": "images/tomlizardfn.jpeg"
|
||
},
|
||
{
|
||
"id": "edward",
|
||
"name": "Edward mit den Scherenhänden",
|
||
"category": "popculture",
|
||
"subcategory": "Popkultur & Filme",
|
||
"release": "Oktober 2024",
|
||
"info": "Edward Scissorhands aus Tim Burtons Meisterwerk schlich sich im Oktober 2024 passend zu Fortnitemares als Skin ins Spiel. Seine Ernte-Werkzeuge sind natürlich die Scherenhände selbst.",
|
||
"isInFortnite": true,
|
||
"realImage": "images/edwardscherereal.jpg",
|
||
"fnImage": "images/edwardscherefn.webp"
|
||
},
|
||
{
|
||
"id": "brunomars",
|
||
"name": "Bruno Mars",
|
||
"category": "celebrity",
|
||
"subcategory": "Promis & Musik",
|
||
"release": "Februar 2022",
|
||
"info": "Bruno Mars und Anderson .Paak kamen als Duo 'Silk Sonic' im Februar 2022 im Rahmen der Icon Series nach Fortnite. Ihre Outfits und Tanz-Emotes versprühen puren 70er-Jahre-Funk.",
|
||
"isInFortnite": true,
|
||
"realImage": "images/brunomarsreal.jpeg",
|
||
"fnImage": "images/brunomarsfn.jpeg.webp"
|
||
},
|
||
{
|
||
"id": "squidgame",
|
||
"name": "Squid Game",
|
||
"category": "popculture",
|
||
"subcategory": "Popkultur & Serien",
|
||
"release": "Juni 2025",
|
||
"info": "Die weltberühmte Netflix-Serie Squid Game kooperierte im Juni 2025 mit Fortnite. Spieler konnten sich die Wärter-Skins mit Kreis, Dreieck und Quadrat sowie später den Front-Man zulegen.",
|
||
"isInFortnite": true,
|
||
"realImage": "images/squidgamereal.jpeg",
|
||
"fnImage": "images/squidgamefn.jpg"
|
||
},
|
||
{
|
||
"id": "wednesday",
|
||
"name": "Wednesday Addams",
|
||
"category": "popculture",
|
||
"subcategory": "Popkultur & Serien",
|
||
"release": "Oktober 2025",
|
||
"info": "Wednesday Addams aus der Netflix-Serie erschien pünktlich zu Fortnitemares im Oktober 2025 im Spiel. Ihr berühmter Tanz auf dem Rave'N-Ball ist als Emote natürlich ebenfalls dabei.",
|
||
"isInFortnite": true,
|
||
"realImage": "images/wednesdayreal.jpeg",
|
||
"fnImage": "images/wednesdayfn.jpg"
|
||
},
|
||
{
|
||
"id": "terminator",
|
||
"name": "Terminator (T-800)",
|
||
"category": "popculture",
|
||
"subcategory": "Popkultur & Filme",
|
||
"release": "Juli 2023",
|
||
"info": "Sowohl das blanke T-800 Endoskelett als auch der von Arnold Schwarzenegger gespielte T-800 Terminator höchstpersönlich sind offizielle Fortnite-Skins. Zudem ist auch die kampferprobte Sarah Connor als spielbarer Skin im Spiel vertreten.",
|
||
"isInFortnite": true,
|
||
"realImage": "images/terminatorreal.jpg",
|
||
"fnImage": "images/terminatorfn.webp"
|
||
},
|
||
{
|
||
"id": "vader",
|
||
"name": "Darth Vader",
|
||
"category": "popculture",
|
||
"subcategory": "Popkultur & Filme",
|
||
"release": "Juni 2022",
|
||
"info": "Der berüchtigtste Sith-Lord der Galaxis ist als spielbarer Skin in Fortnite vertreten. Er war der finale Skin im Battle Pass von Chapter 3, Season 3, komplett mit seinem imperialen Marsch als Emote und einem passenden Gleiter.",
|
||
"isInFortnite": true,
|
||
"realImage": "images/vaderreal.jpg",
|
||
"fnImage": "images/vaderfn.jpg"
|
||
},
|
||
{
|
||
"id": "capamerica",
|
||
"name": "Captain America",
|
||
"category": "popculture",
|
||
"subcategory": "Popkultur & Filme",
|
||
"release": "Juli 2020",
|
||
"info": "Der Anführer der Avengers ist mit seinem legendären Vibranium-Schild in Fortnite spielbar. Er ist bereits in verschiedenen Iterationen im Spiel vorhanden, darunter der klassische Steve Rogers, Sam Wilson als neuer Captain America und sogar eine postapokalyptische Version.",
|
||
"isInFortnite": true,
|
||
"realImage": "images/whats-the-difference-between-steves-captain-america-and-v0-j8k2zzf08m4d1.png.webp",
|
||
"fnImage": "images/capamericafn.jpeg"
|
||
},
|
||
{
|
||
"id": "superman",
|
||
"name": "Superman",
|
||
"category": "popculture",
|
||
"subcategory": "Popkultur & Filme",
|
||
"release": "August 2021",
|
||
"info": "Der Mann aus Stahl flog im Rahmen von Chapter 2, Season 7 als exklusiver Battle-Pass-Skin in die Fortnite-Welt. Spieler können sich im Spiel von Clark Kent in Superman verwandeln – stilecht in einer Telefonzelle.",
|
||
"isInFortnite": true,
|
||
"realImage": "images/supermanreal.jpg",
|
||
"fnImage": "images/supermanfn.jpg.webp"
|
||
},
|
||
{
|
||
"id": "avataraang",
|
||
"name": "Avatar - Herr der Elemente",
|
||
"category": "popculture",
|
||
"subcategory": "Popkultur & Serien",
|
||
"release": "April 2024",
|
||
"info": "Der letzte Luftbändiger Aang kam mit einem eigenen Mini-Event-Pass nach Fortnite. Spieler konnten sowohl seine normale Version als auch den mächtigen Avatar-Zustand freischalten und die Elemente bändigen.",
|
||
"isInFortnite": true,
|
||
"realImage": "images/avataraangreal.avif",
|
||
"fnImage": "images/avataraangfn.png.avif"
|
||
},
|
||
{
|
||
"id": "chappellroan",
|
||
"name": "Chappell Roan",
|
||
"category": "celebrity",
|
||
"subcategory": "Promis & Musik",
|
||
"release": "September 2025",
|
||
"info": "🔥✨💅 SLAY QUEEN SLAY! 💅✨🔥 Die ultimative ✨🏳️🌈 Queer Icon 🏳️🌈✨ stürmt die Fortnite-Bühne mitsamt einer absolut gigantischen ✨🎭 Femininomenon 🎭✨ Festival-Performance! 💖👑🦄",
|
||
"isInFortnite": true,
|
||
"realImage": "images/chappellroanreal.jpg",
|
||
"fnImage": "images/chappellroanfn.avif"
|
||
}
|
||
];
|
||
|
||
// Game State Variables
|
||
let currentQuestions = [];
|
||
let currentIndex = 0;
|
||
let countBelieve = 0; // Correct guesses (Richtig)
|
||
let countDoubt = 0; // Incorrect guesses (Falsch)
|
||
let doubtedItems = []; // List of items the player got wrong
|
||
let currentMode = 'quick';
|
||
|
||
// DOM Selectors - Views
|
||
const gameView = document.getElementById('game-view');
|
||
const resultsView = document.getElementById('results-view');
|
||
const encyclopediaView = document.getElementById('encyclopedia-view');
|
||
|
||
// DOM Selectors - HUD & Gameplay
|
||
const progressText = document.getElementById('question-progress');
|
||
const progressBar = document.getElementById('progress-bar');
|
||
const countBelieveText = document.getElementById('count-believe');
|
||
const countDoubtText = document.getElementById('count-doubt');
|
||
|
||
const cardElement = document.getElementById('game-card');
|
||
const cardCategory = document.getElementById('card-category');
|
||
const cardBrand = document.getElementById('card-brand');
|
||
const cardTitle = document.getElementById('card-title');
|
||
const cardImage = document.getElementById('card-image');
|
||
const cardImageFallback = document.getElementById('card-image-fallback');
|
||
const fallbackIcon = document.getElementById('fallback-icon');
|
||
const fallbackPath = document.getElementById('fallback-path');
|
||
|
||
// DOM Selectors - Choice & Action buttons
|
||
const btnYes = document.getElementById('btn-yes');
|
||
const btnNo = document.getElementById('btn-no');
|
||
|
||
// DOM Selectors - Feedback Overlay
|
||
const feedbackOverlay = document.getElementById('feedback-overlay');
|
||
const feedbackIconBox = document.getElementById('feedback-icon-box');
|
||
const feedbackResultIcon = document.getElementById('feedback-result-icon');
|
||
const feedbackTitle = document.getElementById('feedback-title');
|
||
const feedbackSubtitle = document.getElementById('feedback-subtitle');
|
||
const feedbackRelease = document.getElementById('feedback-release');
|
||
const feedbackDesc = document.getElementById('feedback-desc');
|
||
const btnNext = document.getElementById('btn-next');
|
||
|
||
// DOM Selectors - Feedback Image Elements
|
||
const feedbackImage = document.getElementById('feedback-image');
|
||
const feedbackImageFallback = document.getElementById('feedback-image-fallback');
|
||
const feedbackFallbackIcon = document.getElementById('feedback-fallback-icon');
|
||
const feedbackFallbackPath = document.getElementById('feedback-fallback-path');
|
||
|
||
// DOM Selectors - Results Screen
|
||
const resultBelieve = document.getElementById('result-believe');
|
||
const resultDoubt = document.getElementById('result-doubt');
|
||
const resultRatio = document.getElementById('result-ratio');
|
||
const verdictTitle = document.getElementById('result-verdict-title');
|
||
const verdictDesc = document.getElementById('result-verdict-desc');
|
||
const doubtsListContainer = document.getElementById('doubts-list-container');
|
||
const doubtsList = document.getElementById('doubts-list');
|
||
const btnRestart = document.getElementById('btn-restart');
|
||
const btnResultEncyclopedia = document.getElementById('btn-view-encyclopedia');
|
||
|
||
// DOM Selectors - Encyclopedia Screen
|
||
const filterTabs = document.querySelectorAll('.filter-tab');
|
||
const encyclopediaGrid = document.getElementById('encyclopedia-grid');
|
||
const encTotalCount = document.getElementById('enc-total-count');
|
||
|
||
// DOM Selectors - Detail Modal
|
||
const detailModal = document.getElementById('detail-modal');
|
||
const modalClose = document.querySelector('.close-modal');
|
||
const modalCategory = document.getElementById('modal-category');
|
||
const modalBrand = document.getElementById('modal-brand');
|
||
const modalTitle = document.getElementById('modal-title');
|
||
|
||
// DOM Selectors - Detail Modal Image Elements
|
||
const modalImageReal = document.getElementById('modal-image-real');
|
||
const modalImageRealFallback = document.getElementById('modal-image-real-fallback');
|
||
const modalImageFn = document.getElementById('modal-image-fn');
|
||
const modalImageFnFallback = document.getElementById('modal-image-fn-fallback');
|
||
|
||
const modalRelease = document.getElementById('modal-release');
|
||
const modalDesc = document.getElementById('modal-desc');
|
||
|
||
// Category config mapping
|
||
const categoryConfig = {
|
||
fashion: {
|
||
tag: 'Schuhe & Mode',
|
||
icon: 'fa-shoe-prints',
|
||
color: '#c084fc'
|
||
},
|
||
car: {
|
||
tag: 'Autos & Fahrzeuge',
|
||
icon: 'fa-car',
|
||
color: '#38bdf8'
|
||
},
|
||
celebrity: {
|
||
tag: 'Promis & Sportler',
|
||
icon: 'fa-user',
|
||
color: '#fb7185'
|
||
},
|
||
horror: {
|
||
tag: 'Horror-Filme',
|
||
icon: 'fa-ghost',
|
||
color: '#34d399'
|
||
},
|
||
popculture: {
|
||
tag: 'Kultur & Games',
|
||
icon: 'fa-gamepad',
|
||
color: '#fbbf24'
|
||
}
|
||
};
|
||
|
||
/* ==========================================
|
||
Helper Functions
|
||
========================================== */
|
||
|
||
// Shuffle array utility
|
||
function shuffleArray(array) {
|
||
const arr = [...array];
|
||
for (let i = arr.length - 1; i > 0; i--) {
|
||
const j = Math.floor(Math.random() * (i + 1));
|
||
[arr[i], arr[j]] = [arr[j], arr[i]];
|
||
}
|
||
return arr;
|
||
}
|
||
|
||
// Switch between views smoothly
|
||
function switchView(targetView) {
|
||
const views = [gameView, resultsView, encyclopediaView];
|
||
|
||
// Deactivate all views
|
||
views.forEach(v => {
|
||
if (v.classList.contains('active')) {
|
||
v.classList.remove('active');
|
||
}
|
||
});
|
||
|
||
// Wait a brief moment to allow transition, then show target
|
||
setTimeout(() => {
|
||
targetView.classList.add('active');
|
||
// Scroll to top of view
|
||
window.scrollTo({ top: 0, behavior: 'smooth' });
|
||
}, 100);
|
||
}
|
||
|
||
// Map category to localized text & icon
|
||
function getCategoryInfo(catKey) {
|
||
return categoryConfig[catKey] || { tag: 'Sonstiges', icon: 'fa-circle-question', color: '#94a3b8' };
|
||
}
|
||
|
||
/* ==========================================
|
||
Image Event Handlers (Load & Fallback)
|
||
========================================== */
|
||
|
||
// Setup onload/onerror logic once on gameplay image elements
|
||
cardImage.onload = function() {
|
||
cardImage.style.display = 'block';
|
||
cardImageFallback.style.display = 'none';
|
||
};
|
||
cardImage.onerror = function() {
|
||
cardImage.style.display = 'none';
|
||
cardImageFallback.style.display = 'flex';
|
||
};
|
||
|
||
// Setup onload/onerror logic once on feedback image elements
|
||
feedbackImage.onload = function() {
|
||
feedbackImage.style.display = 'block';
|
||
feedbackImageFallback.style.display = 'none';
|
||
};
|
||
feedbackImage.onerror = function() {
|
||
feedbackImage.style.display = 'none';
|
||
feedbackImageFallback.style.display = 'flex';
|
||
};
|
||
|
||
// Setup onload/onerror logic once on modal image elements
|
||
modalImageReal.onload = function() {
|
||
modalImageReal.style.display = 'block';
|
||
modalImageRealFallback.style.display = 'none';
|
||
};
|
||
modalImageReal.onerror = function() {
|
||
modalImageReal.style.display = 'none';
|
||
modalImageRealFallback.style.display = 'flex';
|
||
};
|
||
|
||
modalImageFn.onload = function() {
|
||
modalImageFn.style.display = 'block';
|
||
modalImageFnFallback.style.display = 'none';
|
||
};
|
||
modalImageFn.onerror = function() {
|
||
modalImageFn.style.display = 'none';
|
||
modalImageFnFallback.style.display = 'flex';
|
||
};
|
||
|
||
/* ==========================================
|
||
Game Operations
|
||
========================================== */
|
||
|
||
// Start a new game round
|
||
function startGame() {
|
||
currentMode = 'full';
|
||
currentIndex = 0;
|
||
countBelieve = 0;
|
||
countDoubt = 0;
|
||
doubtedItems = [];
|
||
|
||
// Reset HUD text
|
||
countBelieveText.textContent = '0';
|
||
countDoubtText.textContent = '0';
|
||
|
||
// Shuffle all items in random order
|
||
const shuffled = shuffleArray(fortniteCollabs);
|
||
currentQuestions = shuffled; // Full list of items in random order
|
||
|
||
// Switch view and render first question
|
||
switchView(gameView);
|
||
showQuestion(0);
|
||
}
|
||
|
||
// Display question card (shows real image)
|
||
function showQuestion(index) {
|
||
if (index >= currentQuestions.length) {
|
||
endGame();
|
||
return;
|
||
}
|
||
|
||
const item = currentQuestions[index];
|
||
const catInfo = getCategoryInfo(item.category);
|
||
|
||
// Update HUD progress
|
||
progressText.textContent = `Kooperation ${index + 1} von ${currentQuestions.length}`;
|
||
const pct = (index / currentQuestions.length) * 100;
|
||
progressBar.style.width = `${pct}%`;
|
||
|
||
// Populate Card details
|
||
cardCategory.innerHTML = `<i class="fa-solid ${catInfo.icon}"></i> ${catInfo.tag}`;
|
||
cardCategory.style.backgroundColor = catInfo.color + '26'; // 15% opacity hex
|
||
cardCategory.style.borderColor = catInfo.color + '4d'; // 30% opacity hex
|
||
cardCategory.style.color = catInfo.color;
|
||
|
||
// Subcategory or Brand label
|
||
cardBrand.textContent = item.subcategory || 'Kooperation';
|
||
cardTitle.textContent = item.name;
|
||
|
||
// Setup Image Loading & Fallback to Real Image
|
||
cardImage.style.display = 'none';
|
||
cardImageFallback.style.display = 'flex';
|
||
fallbackIcon.className = `fa-solid ${catInfo.icon}`;
|
||
fallbackIcon.style.color = catInfo.color;
|
||
fallbackPath.textContent = item.realImage;
|
||
|
||
// Trigger image load check
|
||
cardImage.src = item.realImage;
|
||
}
|
||
|
||
// Handle choice input (Yes / No button clicked)
|
||
function handleAnswer(clickedYes) {
|
||
const item = currentQuestions[currentIndex];
|
||
|
||
// Reset feedback styling classes
|
||
feedbackOverlay.classList.remove('feedback-correct', 'feedback-incorrect');
|
||
|
||
const isCorrect = clickedYes; // YES is always correct because every single item shown is in Fortnite!
|
||
|
||
if (isCorrect) {
|
||
countBelieve++;
|
||
countBelieveText.textContent = countBelieve;
|
||
|
||
feedbackOverlay.classList.add('feedback-correct');
|
||
feedbackResultIcon.className = 'fa-solid fa-circle-check';
|
||
feedbackTitle.textContent = 'Korrekt!';
|
||
feedbackSubtitle.textContent = 'Ja, das ist tatsächlich in Fortnite!';
|
||
} else {
|
||
countDoubt++;
|
||
countDoubtText.textContent = countDoubt;
|
||
doubtedItems.push(item);
|
||
|
||
feedbackOverlay.classList.add('feedback-incorrect');
|
||
feedbackResultIcon.className = 'fa-solid fa-circle-exclamation';
|
||
feedbackTitle.textContent = 'Falsch!';
|
||
feedbackSubtitle.textContent = 'Doch! Das ist wirklich in Fortnite!';
|
||
}
|
||
|
||
// Load Fortnite version image in the feedback overlay
|
||
const catInfo = getCategoryInfo(item.category);
|
||
feedbackImage.style.display = 'none';
|
||
feedbackImageFallback.style.display = 'flex';
|
||
feedbackFallbackIcon.className = `fa-solid fa-gamepad`;
|
||
feedbackFallbackIcon.style.color = catInfo.color;
|
||
feedbackFallbackPath.textContent = item.fnImage;
|
||
feedbackImage.src = item.fnImage;
|
||
|
||
// Populate feedback info sheet
|
||
feedbackRelease.textContent = item.release;
|
||
feedbackDesc.textContent = item.info;
|
||
|
||
// Display overlay
|
||
feedbackOverlay.classList.add('active');
|
||
}
|
||
|
||
// Next question trigger
|
||
function nextQuestion() {
|
||
feedbackOverlay.classList.remove('active');
|
||
currentIndex++;
|
||
|
||
// Quick delay before loading next question card for animation flow
|
||
setTimeout(() => {
|
||
showQuestion(currentIndex);
|
||
}, 200);
|
||
}
|
||
|
||
// End game, calculate scores & show results
|
||
function endGame() {
|
||
progressBar.style.width = '100%';
|
||
|
||
resultBelieve.textContent = countBelieve;
|
||
resultDoubt.textContent = countDoubt;
|
||
|
||
// Compute success ratio
|
||
const total = currentQuestions.length;
|
||
const ratioPct = Math.round((countBelieve / total) * 100);
|
||
resultRatio.textContent = `${ratioPct}%`;
|
||
|
||
// German Verdict generator based on success rate
|
||
let title = '';
|
||
let desc = '';
|
||
|
||
if (ratioPct >= 90) {
|
||
title = 'Fortnite-Prophet 🔮';
|
||
desc = 'Hervorragend! Du kennst den Wahnsinn in- und auswendig. Du hast fast jede Frage richtig beantwortet. Für dich ist das Popkultur-Multiversum bereits vollendete Realität.';
|
||
} else if (ratioPct >= 70) {
|
||
title = 'Popkultur-Kenner 🧐';
|
||
desc = 'Respekt! Du hast die meisten realen Collabs richtig zugeordnet und hast dich auch von den Fakes nicht aufs Glatteis führen lassen. Du kennst Epic Games ziemlich gut.';
|
||
} else if (ratioPct >= 40) {
|
||
title = 'Gesunder Skeptiker 🤨';
|
||
desc = 'Du hast bei einigen Dingen gezweifelt – verständlich, denn wer rechnet schon ernsthaft mit South Park oder Crocs in einem bunten Shooter? Du lagst manchmal daneben, aber das ist okay.';
|
||
} else {
|
||
title = 'In tiefer Verleugnung 🙈';
|
||
desc = 'Du weigerst dich zu glauben, was in Fortnite abgeht! Du konntest dir viele Collabs nicht vorstellen. Wach auf, Epic Games kauft einfach das gesamte Multiversum!';
|
||
}
|
||
|
||
verdictTitle.textContent = title;
|
||
verdictDesc.textContent = desc;
|
||
|
||
// Render doubted/incorrect items list
|
||
if (doubtedItems.length > 0) {
|
||
doubtsList.innerHTML = '';
|
||
doubtedItems.forEach(item => {
|
||
const catInfo = getCategoryInfo(item.category);
|
||
const div = document.createElement('div');
|
||
div.className = 'doubt-item';
|
||
div.innerHTML = `
|
||
<div style="display: flex; align-items: center; gap: 0.75rem;">
|
||
<img src="${item.realImage}" alt="${item.name}" style="width: 40px; height: 40px; object-fit: cover; border-radius: 6px; border: 1px solid var(--border-light);">
|
||
<div>
|
||
<span class="doubt-item-name" style="font-weight: 600; display: block;">${item.name}</span>
|
||
<span class="doubt-item-category" style="font-size: 0.75rem; color: var(--text-secondary);">${item.subcategory}</span>
|
||
</div>
|
||
</div>
|
||
<span class="category-tag" style="background-color: ${catInfo.color}15; border-color: ${catInfo.color}30; color: ${catInfo.color}; font-size:0.7rem; padding:0.2rem 0.5rem; white-space: nowrap;">
|
||
<i class="fa-solid ${catInfo.icon}"></i> ${catInfo.tag}
|
||
</span>
|
||
`;
|
||
// Click on doubted item opens detail modal
|
||
div.addEventListener('click', () => {
|
||
openDetailModal(item);
|
||
});
|
||
doubtsList.appendChild(div);
|
||
});
|
||
doubtsListContainer.style.display = 'block';
|
||
} else {
|
||
doubtsListContainer.style.display = 'none';
|
||
}
|
||
|
||
switchView(resultsView);
|
||
}
|
||
|
||
/* ==========================================
|
||
Encyclopedia Operations
|
||
========================================== */
|
||
|
||
let activeFilter = 'all';
|
||
|
||
function initEncyclopedia() {
|
||
renderEncyclopediaGrid();
|
||
}
|
||
|
||
function renderEncyclopediaGrid() {
|
||
encyclopediaGrid.innerHTML = '';
|
||
|
||
// Filter items based on active tab
|
||
const filtered = fortniteCollabs.filter(item => {
|
||
const matchesCategory = (activeFilter === 'all' || item.category === activeFilter);
|
||
return matchesCategory;
|
||
});
|
||
|
||
// Update count indicator
|
||
encTotalCount.textContent = filtered.length;
|
||
|
||
// Populate Grid
|
||
if (filtered.length === 0) {
|
||
encyclopediaGrid.innerHTML = `
|
||
<div style="grid-column: 1/-1; text-align: center; padding: 3rem; color: var(--text-muted);">
|
||
<i class="fa-solid fa-folder-open" style="font-size: 3rem; margin-bottom: 1rem; color: var(--color-purple); opacity:0.5;"></i>
|
||
<p>Keine Einträge gefunden.</p>
|
||
</div>
|
||
`;
|
||
return;
|
||
}
|
||
|
||
filtered.forEach(item => {
|
||
const catInfo = getCategoryInfo(item.category);
|
||
const card = document.createElement('div');
|
||
card.className = 'enc-card';
|
||
card.innerHTML = `
|
||
<div class="enc-card-image-box">
|
||
<img src="${item.realImage}" alt="${item.name}" loading="lazy">
|
||
</div>
|
||
<div class="enc-card-info">
|
||
<div class="enc-card-header">
|
||
<span class="category-tag" style="background-color: ${catInfo.color}15; border-color: ${catInfo.color}30; color: ${catInfo.color}; font-size: 0.7rem; padding: 0.2rem 0.5rem;">
|
||
<i class="fa-solid ${catInfo.icon}"></i> ${catInfo.tag}
|
||
</span>
|
||
<span class="brand-tag" style="font-size: 0.65rem; padding: 0.2rem 0.5rem;">${item.subcategory || 'Koop'}</span>
|
||
</div>
|
||
<h3>${item.name}</h3>
|
||
<p class="enc-card-snippet">${item.info}</p>
|
||
<div style="margin-top: auto; display: flex; align-items: center; justify-content: space-between;">
|
||
<span class="enc-card-release" style="margin-top: 0;"><i class="fa-regular fa-calendar"></i> ${item.release}</span>
|
||
<span style="font-size: 0.75rem; color: var(--color-purple); font-weight: bold;">Mehr ansehen <i class="fa-solid fa-arrow-right"></i></span>
|
||
</div>
|
||
</div>
|
||
`;
|
||
|
||
// Open details modal on card click
|
||
card.addEventListener('click', () => {
|
||
openDetailModal(item);
|
||
});
|
||
|
||
encyclopediaGrid.appendChild(card);
|
||
});
|
||
}
|
||
|
||
// Open detail modal for specific item (shows side-by-side comparison)
|
||
function openDetailModal(item) {
|
||
const catInfo = getCategoryInfo(item.category);
|
||
|
||
// Set headers
|
||
modalCategory.innerHTML = `<i class="fa-solid ${catInfo.icon}"></i> ${catInfo.tag}`;
|
||
modalCategory.style.backgroundColor = catInfo.color + '26';
|
||
modalCategory.style.borderColor = catInfo.color + '4d';
|
||
modalCategory.style.color = catInfo.color;
|
||
|
||
modalBrand.textContent = item.subcategory || 'Kooperation';
|
||
modalTitle.textContent = item.name;
|
||
|
||
// Set Real Image Loading & Fallback
|
||
modalImageReal.style.display = 'none';
|
||
modalImageRealFallback.style.display = 'flex';
|
||
document.getElementById('modal-fallback-real-icon').className = `fa-solid ${catInfo.icon}`;
|
||
modalImageReal.src = item.realImage;
|
||
|
||
// Set Fortnite Image Loading & Fallback
|
||
modalImageFn.style.display = 'none';
|
||
modalImageFnFallback.style.display = 'flex';
|
||
document.getElementById('modal-fallback-fn-icon').className = `fa-solid fa-gamepad`;
|
||
modalImageFn.src = item.fnImage;
|
||
|
||
// Populate release date and description
|
||
modalRelease.textContent = item.release;
|
||
modalDesc.textContent = item.info;
|
||
|
||
// Display modal
|
||
detailModal.classList.add('active');
|
||
}
|
||
|
||
/* ==========================================
|
||
Event Bindings & Initialization
|
||
========================================== */
|
||
|
||
// Event Listeners for Game Screen Choices
|
||
btnYes.addEventListener('click', () => handleAnswer(true));
|
||
btnNo.addEventListener('click', () => handleAnswer(false));
|
||
btnNext.addEventListener('click', nextQuestion);
|
||
|
||
// View Navigation Actions
|
||
btnRestart.addEventListener('click', () => {
|
||
location.href = 'index.html';
|
||
});
|
||
|
||
btnResultEncyclopedia.addEventListener('click', () => {
|
||
switchView(encyclopediaView);
|
||
});
|
||
|
||
// Modal closing actions
|
||
modalClose.addEventListener('click', () => {
|
||
detailModal.classList.remove('active');
|
||
});
|
||
|
||
window.addEventListener('click', (e) => {
|
||
if (e.target === detailModal) {
|
||
detailModal.classList.remove('active');
|
||
}
|
||
});
|
||
|
||
// Encyclopedia Filter Tabs Actions
|
||
filterTabs.forEach(tab => {
|
||
tab.addEventListener('click', () => {
|
||
filterTabs.forEach(t => t.classList.remove('active'));
|
||
tab.classList.add('active');
|
||
activeFilter = tab.getAttribute('data-filter');
|
||
renderEncyclopediaGrid();
|
||
});
|
||
});
|
||
|
||
// Initialize on load
|
||
initEncyclopedia();
|
||
|
||
// Direct entry: no legacy start screen anymore.
|
||
// #encyclopedia opens encyclopedia directly, otherwise game starts immediately.
|
||
const entryHash = (window.location.hash || '').toLowerCase();
|
||
if (entryHash === '#encyclopedia') {
|
||
switchView(encyclopediaView);
|
||
} else {
|
||
startGame();
|
||
}
|