Transfers (and transfer rumors) are the meat and potatoes of the modern-day football journalism industry, and I suppose sites like ours as well. In fact, a simple search for Roma transfer rumors is what brought me to this site nearly 20 years ago. While the Roma sides of the early 2000s certainly weren’t bereft of talent, even the calcio Lord almighty himself, Francesco Totti, couldn’t deliver the Giallorossi to the promised land alone.
And whether it was Adrian Mutu or Lukas Podolski piquing my interest, feasting on transfer rumors drew me deeper into the Romaverse. While the club never landed those white whales, I fell madly in love with players orbiting Totti and Daniele De Rossi: Marco Motta, Mirko Vucinic, Marco Cassetti, Simone Perrotta, John Arne Riise, Cicinho and even Simone Loria.
AdvertisementAdvertisementAdvertisementSo, for today’s Tuesday Trivia, we’re going to test your transfer knowledge on some of our favorite Y2K stars. Each question will show the respective players’ transfer trail to and from Roma. We tried to limit the clues this time, so good luck! (And since this remains a work in progress, feedback is definitely appreciated and welcomed.)
Transfer Trail Challenge: Y2K Edition/* Define custom colors (keeping the original theme) */ :root { --chiesa-red: #8B0000; /* Darker Red/Maroon from logo */ --chiesa-gold: #FFD700; /* Gold/Yellow from logo */ --chiesa-dark: #2C2C2C; /* Dark text/accents from logo */ --chiesa-light-red: #D2B4B4; /* Lighter, thematic red for accents */ } /* Base styling */ body { margin: 0; padding: 0; background-color: #f7f3f3; font-family: 'Lato', Helvetica, Arial, sans-serif; color: var(--chiesa-dark); } /* Quiz Container */ #transfer-quiz { max-width: 900px; margin: 20px auto; padding: 24px; border-radius: 12px; background: #fff; box-shadow: 0 10px 30px rgba(0,0,0,0.05), 0 4px 8px rgba(0,0,0,0.05); min-height: 400px; display: flex; flex-direction: column; } .quiz-header { display: flex; align-items: center; gap: 14px; margin-bottom: 24px; border-bottom: 3px solid var(--chiesa-red); padding-bottom: 15px; } .quiz-header .chiesa-logo { height: 40px; width: auto; } .quiz-header h2 { color: var(--chiesa-red); margin: 0; font-size: 1.6rem; font-weight: 800; font-family: 'Inter', Helvetica, Arial, sans-serif; } /* Progress Text Style */ #quiz-progress { font-size: 0.95rem; font-weight: 900; color: var(--chiesa-red); margin-bottom: 10px; text-align: center; padding: 5px 0; border-radius: 5px; background-color: #fff0f0; } #quiz-instruction { font-weight: 800; font-size: 1.1rem; /* Slightly reduced font size to fit long clues */ color: var(--chiesa-dark); text-align: left; /* Aligned left for better readability of narrative clues */ margin-bottom: 15px; padding: 10px 15px; /* Added internal padding */ border: 1px solid #ddd; border-radius: 8px; background-color: #fcfcfc; } /* Ensures the strong tag (previously the header) is hidden */ #quiz-instruction strong { display: none; } /* ==================================================== PATH STYLES ==================================================== */ #transfer-path { display: flex; align-items: center; justify-content: center; /* Center the path content */ flex-wrap: wrap; /* Allow wrapping onto multiple lines */ gap: 8px; margin: 15px 0 25px 0; min-height: 120px; height: auto; padding: 15px; background: #fcfcfc; border: 2px solid var(--chiesa-light-red); border-radius: 12px; box-shadow: inset 0 1px 5px rgba(0, 0, 0, 0.05); overflow-x: hidden; } /* Logo Containers - Base Style (Gray Circle) */ .path-club { min-width: 45px; height: 45px; border-radius: 50%; border: 3px solid #ccc; /* Standard gray border */ overflow: hidden; display: inline-flex; align-items: center; justify-content: center; box-shadow: 0 1px 3px rgba(0,0,0,0.15); flex-shrink: 0; background-color: #ffffff; margin: 5px 0; } .path-club img { width: 100%; height: 100%; object-fit: contain; display: block; border-radius: 50%; /* Ensure image respects the circular container */ } /* Highlight Roma (Destination) - Maintains 3px border width but changes color to red */ .path-club.destination { border-color: var(--chiesa-red); } /* Arrow */ .path-arrow { font-size: 1.5rem; color: var(--chiesa-red); font-weight: 900; margin: 0 2px; line-height: 45px; flex-shrink: 0; } /* ==================================================== END PATH STYLES ==================================================== */ /* Option Button Container */ .quiz-options { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 12px; margin-top: 20px; } .quiz-options .player-option-button { display: flex; align-items: center; justify-content: center; padding: 12px 10px; border: 2px solid var(--chiesa-light-red); border-radius: 10px; cursor: pointer; transition: all 0.2s; text-align: center; text-decoration: none; color: var(--chiesa-dark); font-size: 0.95rem; font-weight: 700; background: linear-gradient(180deg, rgba(255,255,255,1) 0%, rgba(250,250,250,1) 100%); box-shadow: 0 5px 15px rgba(0,0,0,0.08), 0 2px 4px rgba(0,0,0,0.03); } .quiz-options .player-option-button:hover { border-color: var(--chiesa-gold); background: linear-gradient(180deg, #fffaf5 0%, #fff4e0 100%); transform: translateY(-3px) scale(1.01); box-shadow: 0 10px 20px rgba(0,0,0,0.15), 0 5px 10px rgba(0,0,0,0.1); } /* Next Button Styles */ #quiz-next { margin-top: 30px; padding: 12px 18px; border-radius: 10px; border: none; background: var(--chiesa-red); color: #fff; cursor: pointer; font-weight: 700; text-align: center; text-decoration: none; display: inline-block; box-shadow: 0 4px #7c0000; transition: background-color 0.1s; } #quiz-next:active { box-shadow: 0 1px #7c0000; transform: translateY(3px); } /* Result Text Style */ #quiz-result { margin-top: 20px; padding: 15px; border-radius: 10px; font-weight: 700; } .correct-result { color: #38761d; background-color: #f0fdf4; border: 2px solid #38761d; } .incorrect-result { color: #b91c1c; background-color: #fee2e2; border: 2px solid #b91c1c; } /* Mobile adjustments */ @media (max-width: 600px) { #transfer-quiz { margin: 10px; padding: 15px; } .quiz-options { grid-template-columns: 1fr; gap: 8px; } /* Even smaller logos on mobile */ .path-club { min-width: 40px; height: 40px; } .path-arrow { font-size: 1.3rem; margin: 0 1px; line-height: 40px; } #quiz-instruction { font-size: 0.9rem; } }
Transfer Trail Challenge: Y2K Edition
Select the Player:
AdvertisementAdvertisementAdvertisementNext Player
// Global Constants for frequently used logos const ROMA_LOGO_PATH = "https://upload.wikimedia.org/wikipedia/en/thumb/f/f7/AS_Roma_logo_%282017%29.svg/263px-AS_Roma_logo_%282017%29.svg.png"; // This constant is now set to the specific Wikipedia URL requested by the user. const VISSEL_KOBE_LOGO_PATH = "https://upload.wikimedia.org/wikipedia/commons/thumb/8/8a/Vissel_Kobe_logo.svg/320px-Vissel_Kobe_logo.svg.png"; // Helper function to convert text to Title Case function toTitleCase(str) { if (!str) return ''; return str.toLowerCase().split(' ').map(word => { return (word.charAt(0).toUpperCase() + word.slice(1)); }).join(' '); } // ====================================================================== // TRANSFER TRAIL CHALLENGE QUESTIONS // ====================================================================== const quizData = [ // 1. MARCO CASSETTI (5 clubs) { "p": "Marco Cassetti", "c": "This five-club path outlines a career forged between Northern and Southern Italian leagues, climaxing in the capital before a final journey to England.", "t": [ {"c":"Hellas Verona FC", "u":"https://upload.wikimedia.org/wikipedia/en/thumb/9/92/Hellas_Verona_FC_logo_%282020%29.svg/285px-Hellas_Verona_FC_logo_%282020%29.svg.png"}, {"c":"US Lecce", "u":"https://upload.wikimedia.org/wikipedia/en/thumb/2/23/US_Lecce_crest.svg/320px-US_Lecce_crest.svg.png"}, {"c":"AS Roma", "u":ROMA_LOGO_PATH}, {"c":"Udinese Calcio", "u":"https://upload.wikimedia.org/wikipedia/en/thumb/c/ce/Udinese_Calcio_logo.svg/315px-Udinese_Calcio_logo.svg.png"}, {"c":"Watford FC", "u":"https://upload.wikimedia.org/wikipedia/en/thumb/e/e2/Watford.svg/285px-Watford.svg.png"} ] }, // 2. PHILIPPE MEXES (3 clubs) { "p": "Philippe Mexes", "c": "A direct three-step career, starting in his home country before settling in Serie A's capital and concluding his play with a historic Northern rival.", "t": [ {"c":"AJ Auxerre", "u":"https://upload.wikimedia.org/wikipedia/en/thumb/5/51/AJAuxerreLogo.svg/320px-AJAuxerreLogo.svg.png"}, {"c":"AS Roma", "u":ROMA_LOGO_PATH}, {"c":"AC Milan", "u":"https://upload.wikimedia.org/wikipedia/commons/thumb/d/d0/Logo_of_AC_Milan.svg/330px-Logo_of_AC_Milan.svg.png"} ] }, // 3. MARCO MOTTA (11 clubs) { "p": "Marco Motta", "c": "A sweeping career arc involving eleven distinct club jerseys, charting stops across three major European countries, highlighting a period of intense movement.", "t": [ {"c":"Atalanta BC", "u":"https://upload.wikimedia.org/wikipedia/en/thumb/6/66/AtalantaBC.svg/210px-AtalantaBC.svg.png"}, {"c":"Udinese Calcio", "u":"https://upload.wikimedia.org/wikipedia/en/thumb/c/ce/Udinese_Calcio_logo.svg/315px-Udinese_Calcio_logo.svg.png"}, {"c":"Torino FC", "u":"https://upload.wikimedia.org/wikipedia/en/thumb/2/2e/Torino_FC_Logo.svg/255px-Torino_FC_Logo.svg.png"}, {"c":"AS Roma", "u":ROMA_LOGO_PATH}, {"c":"Juventus FC", "u":"https://upload.wikimedia.org/wikipedia/commons/thumb/e/ed/Juventus_FC_-_logo_black_%28Italy%2C_2020%29.svg/195px-Juventus_FC_-_logo_black_%28Italy%2C_2020%29.svg.png"}, {"c":"Catania FC", "u":"https://upload.wikimedia.org/wikipedia/commons/thumb/1/10/Logo_CATANIA_FC.svg/330px-Logo_CATANIA_FC.svg.png"}, {"c":"Bologna FC 1909", "u":"https://upload.wikimedia.org/wikipedia/commons/thumb/5/5b/Bologna_F.C._1909_logo.svg/210px-Bologna_F.C._1909_logo.svg.png"}, {"c":"Genoa CFC", "u":"https://upload.wikimedia.org/wikipedia/en/thumb/2/2c/Genoa_CFC_crest.svg/218px-Genoa_CFC_crest.svg.png"}, {"c":"Watford FC", "u":"https://upload.wikimedia.org/wikipedia/en/thumb/e/e2/Watford.svg/285px-Watford.svg.png"}, {"c":"Charlton Athletic FC", "u":"https://upload.wikimedia.org/wikipedia/en/thumb/f/f5/Charlton_Athletic_FC_crest.svg/300px-Charlton_Athletic_FC_crest.svg.png"}, {"c":"UD Almería", "u":"https://upload.wikimedia.org/wikipedia/en/thumb/4/4a/UD_Almeria_logo.svg/290px-UD_Almeria_logo.svg.png"} ] }, // 4. FABIO SIMPLICIO (6 clubs) { "p": "Fabio Simplicio", "c": "This six-club trail crosses three continents, including an extensive period of movement across the Italian peninsula before finding a final destination in the Asian league.", "t": [ {"c":"São Paulo FC", "u":"https://upload.wikimedia.org/wikipedia/commons/thumb/6/6f/Brasao_do_Sao_Paulo_Futebol_Clube.svg/330px-Brasao_do_Sao_Paulo_Futebol_Clube.svg.png"}, {"c":"Parma Calcio 1913", "u":"https://upload.wikimedia.org/wikipedia/commons/thumb/9/97/Logo_Parma_Calcio_1913_%28adozione_2016%29.svg/240px-Logo_Parma_Calcio_1913_%28adozione_2016%29.svg.png"}, {"c":"Palermo Calcio", "u":"https://upload.wikimedia.org/wikipedia/en/thumb/d/df/Palermo_Calcio_logo_%282019%29.svg/285px-Palermo_Calcio_logo_%282019%29.svg.png"}, {"c":"AS Roma", "u":ROMA_LOGO_PATH}, {"c":"Cerezo Osaka", "u":"https://upload.wikimedia.org/wikipedia/en/thumb/8/85/Cerezo_Osaka_logo.svg/270px-Cerezo_Osaka_logo.svg.png"}, {"c":"Vissel Kobe", "u":VISSEL_KOBE_LOGO_PATH} ] }, // 5. LUCA TONI (10 clubs/appearances) - Multiple stops added { "p": "Luca Toni", "c": "This player's ten-stop journey included two separate spells at the same Tuscan club, followed by major stops in Germany and the UAE before concluding his career at another Northern Italian side.", "t": [ {"c":"LR Vicenza Virtus", "u":"https://upload.wikimedia.org/wikipedia/commons/thumb/a/a0/LR_Vicenza_Virtus_%28logo%29.svg/500px-LR_Vicenza_Virtus_%28logo%29.svg.png"}, {"c":"Brescia Calcio", "u":"https://upload.wikimedia.org/wikipedia/en/thumb/1/17/Brescia_calcio_badge.svg/270px-Brescia_calcio_badge.svg.png"}, {"c":"Palermo Calcio", "u":"https://upload.wikimedia.org/wikipedia/en/thumb/d/df/Palermo_Calcio_logo_%282019%29.svg/285px-Palermo_Calcio_logo_%282019%29.svg.png"}, {"c":"ACF Fiorentina", "u":"https://upload.wikimedia.org/wikipedia/commons/thumb/8/8c/ACF_Fiorentina_-_logo_%28Italy%2C_2022%29.svg/345px-ACF_Fiorentina_-_logo_%28Italy%2C_2022%29.svg.png"}, // 1st Fiorentina {"c":"FC Bayern Munich", "u":"https://upload.wikimedia.org/wikipedia/commons/thumb/8/8d/FC_Bayern_M%C3%BCnchen_logo_%282024%29.svg/330px-FC_Bayern_M%C3%BCnchen_logo_%282024%29.svg.png"}, {"c":"AS Roma", "u":ROMA_LOGO_PATH}, {"c":"Juventus FC", "u":"https://upload.wikimedia.org/wikipedia/commons/thumb/e/ed/Juventus_FC_-_logo_black_%28Italy%2C_2020%29.svg/195px-Juventus_FC_-_logo_black_%28Italy%2C_2020%29.svg.png"}, {"c":"Al-Nasr SC", "u":"https://upload.wikimedia.org/wikipedia/commons/thumb/a/aa/AL_Nasr_SC_Logo.png/500px-AL_Nasr_SC_Logo.png"}, // FIX: Removed the extra ":" that caused the SyntaxError {"c":"ACF Fiorentina", "u":"https://upload.wikimedia.org/wikipedia/commons/thumb/8/8c/ACF_Fiorentina_-_logo_%28Italy%2C_2022%29.svg/345px-ACF_Fiorentina_-_logo_%28Italy%2C_2022%29.svg.png"}, // 2nd Fiorentina {"c":"Hellas Verona FC", "u":"https://upload.wikimedia.org/wikipedia/en/thumb/9/92/Hellas_Verona_FC_logo_%282020%29.svg/285px-Hellas_Verona_FC_logo_%282020%29.svg.png"} ] }, // 6. MIRKO VUCINIC (4 clubs) { "p": "Mirko Vucinic", "c": "A four-stop progression starting in the lower Italian league, moving to the capital, and achieving success in Turin before a concluding spell in the Middle East.", "t": [ {"c":"US Lecce", "u":"https://upload.wikimedia.org/wikipedia/en/thumb/2/23/US_Lecce_crest.svg/320px-US_Lecce_crest.svg.png"}, {"c":"AS Roma", "u":ROMA_LOGO_PATH}, {"c":"Juventus FC", "u":"https://upload.wikimedia.org/wikipedia/commons/thumb/e/ed/Juventus_FC_-_logo_black_%28Italy%2C_2020%29.svg/195px-Juventus_FC_-_logo_black_%28Italy%2C_2020%29.svg.png"}, {"c":"Al Jazira Club", "u":"https://upload.wikimedia.org/wikipedia/en/thumb/f/ff/Al_Jazira_Club_logo_en_%282021%29.svg/270px-Al_Jazira_Club_logo_en_%282021%29.svg.png"} ] }, // 7. JULIO BAPTISTA (9 clubs) { "p": "Julio Baptista", "c": "A wide-ranging tour across nine teams, tracing a path through Brazil, Spain, England, and Italy, before concluding his career in the American and Romanian leagues.", "t": [ {"c":"São Paulo FC", "u":"https://upload.wikimedia.org/wikipedia/commons/thumb/6/6f/Brasao_do_Sao_Paulo_Futebol_Clube.svg/330px-Brasao_do_Sao_Paulo_Futebol_Clube.svg.png"}, {"c":"Sevilla FC", "u":"https://upload.wikimedia.org/wikipedia/en/thumb/3/3b/Sevilla_FC_logo.svg/255px-Sevilla_FC_logo.svg.png"}, {"c":"Real Madrid CF", "u":"https://upload.wikimedia.org/wikipedia/en/thumb/5/56/Real_Madrid_CF.svg/255px-Real_Madrid_CF.svg.png"}, {"c":"Arsenal FC", "u":"https://upload.wikimedia.org/wikipedia/en/thumb/5/53/Arsenal_FC.svg/285px-Arsenal_FC.svg.png"}, {"c":"AS Roma", "u":ROMA_LOGO_PATH}, {"c":"Málaga CF", "u":"https://upload.wikimedia.org/wikipedia/en/thumb/6/6d/M%C3%A1laga_CF.svg/270px-M%C3%A1laga_CF.svg.png"}, {"c":"Cruzeiro Esporte Clube", "u":"https://upload.wikimedia.org/wikipedia/commons/thumb/9/90/Cruzeiro_Esporte_Clube_%28logo%29.svg/270px-Cruzeiro_Esporte_Clube_%28logo%29.svg.png"}, {"c":"Orlando City SC", "u":"https://upload.wikimedia.org/wikipedia/en/thumb/6/6a/Orlando_City_2014.svg/285px-Orlando_City_2014.svg.png"}, {"c":"CFR Cluj", "u":"https://upload.wikimedia.org/wikipedia/en/thumb/7/7e/CFR_Cluj_badge.svg/240px-CFR_Cluj_badge.svg.png"} ] }, // 8. SIMONE PERROTTA (5 clubs) { "p": "Simone Perrotta", "c": "A measured five-club Italian path, involving a major Northern club, brief spells in the South, and a crucial partnership in Verona before establishing a decade-long legacy in Rome.", "t": [ {"c":"Reggina Calcio", "u":"https://upload.wikimedia.org/wikipedia/en/thumb/c/cd/AS_Reggina_1914_crest.svg/263px-AS_Reggina_1914_crest.svg.png"}, {"c":"Juventus FC", "u":"https://upload.wikimedia.org/wikipedia/commons/thumb/e/ed/Juventus_FC_-_logo_black_%28Italy%2C_2020%29.svg/195px-Juventus_FC_-_logo_black_%28Italy%2C_2020%29.svg.png"}, {"c":"SSC Bari", "u":"https://upload.wikimedia.org/wikipedia/en/thumb/8/85/SSC_Bari_crest.svg/218px-SSC_Bari_crest.svg.png"}, {"c":"A.C. ChievoVerona", "u":"https://upload.wikimedia.org/wikipedia/en/thumb/f/f0/A.C._ChievoVerona_logo.svg/320px-A.C._ChievoVerona_logo.svg.png"}, {"c":"AS Roma", "u":ROMA_LOGO_PATH} ] }, // 9. ALBERTO AQUILANI (11 clubs) - Multiple stops included { "p": "Alberto Aquilani", "c": "This eleven-step career begins and returns to his childhood club, separating a brief loan before a highly publicized move to England, followed by a long series of transfers across Italian, Portuguese, and Spanish sides.", "t": [ {"c":"AS Roma", "u":ROMA_LOGO_PATH}, // Start {"c":"US Triestina Calcio 1918", "u":"https://upload.wikimedia.org/wikipedia/en/thumb/2/28/US_Triestina_Calcio_1918_crest.svg/270px-US_Triestina_Calcio_1918_crest.svg.png"}, {"c":"AS Roma", "u":ROMA_LOGO_PATH}, // Return from loan {"c":"Liverpool FC", "u":"https://upload.wikimedia.org/wikipedia/en/thumb/0/0c/Liverpool_FC.svg/300px-Liverpool_FC.svg.png"}, {"c":"Juventus FC", "u":"https://upload.wikimedia.org/wikipedia/commons/thumb/e/ed/Juventus_FC_-_logo_black_%28Italy%2C_2020%29.svg/195px-Juventus_FC_-_logo_black_%28Italy%2C_2020%29.svg.png"}, {"c":"AC Milan", "u":"https://upload.wikimedia.org/wikipedia/commons/thumb/d/d0/Logo_of_AC_Milan.svg/330px-Logo_of_AC_Milan.svg.png"}, {"c":"ACF Fiorentina", "u":"https://upload.wikimedia.org/wikipedia/commons/thumb/8/8c/ACF_Fiorentina_-_logo_%28Italy%2C_2022%29.svg/345px-ACF_Fiorentina_-_logo_%28Italy%2C_2022%29.svg.png"}, {"c":"Sporting CP", "u":"https://upload.wikimedia.org/wikipedia/en/thumb/9/95/Sporting_CP_crest.svg/270px-Sporting_CP_crest.svg.png"}, {"c":"Delfino Pescara 1936", "u":"https://upload.wikimedia.org/wikipedia/en/thumb/0/06/Delfino_Pescara_logo.svg/210px-Delfino_Pescara_logo.svg.png"}, {"c":"US Sassuolo Calcio", "u":"https://upload.wikimedia.org/wikipedia/en/thumb/1/1c/US_Sassuolo_Calcio_logo.svg/285px-US_Sassuolo_Calcio_logo.svg.png"}, {"c":"UD Las Palmas", "u":"https://upload.wikimedia.org/wikipedia/en/thumb/2/20/UD_Las_Palmas_logo.svg/195px-UD_Las_Palmas_logo.svg.png"} ] }, // 10. ALEANDRO ROSI (11 clubs) { "p": "Aleandro Rosi", "c": "An incredibly long trail for this youth product, tracing eleven distinct clubs across multiple loans and permanent moves throughout the Italian leagues.", "t": [ {"c":"AS Roma", "u":ROMA_LOGO_PATH}, {"c":"AC Chievo Verona", "u":"https://upload.wikimedia.org/wikipedia/en/thumb/f/f0/A.C._ChievoVerona_logo.svg/320px-A.C._ChievoVerona_logo.svg.png"}, {"c":"US Livorno 1915", "u":"https://upload.wikimedia.org/wikipedia/en/thumb/4/44/US_Livorno_1915_crest.svg/320px-US_Livorno_1915_crest.svg.png"}, {"c":"Siena FC SSD", "u":"https://upload.wikimedia.org/wikipedia/en/thumb/6/62/Siena_FC_SSD_crest.svg/270px-Siena_FC_SSD_crest.svg.png"}, {"c":"Parma Calcio 1913", "u":"https://upload.wikimedia.org/wikipedia/commons/thumb/9/97/Logo_Parma_Calcio_1913_%28adozione_2016%29.svg/240px-Logo_Parma_Calcio_1913_%28adozione_2016%29.svg.png"}, {"c":"US Sassuolo Calcio", "u":"https://upload.wikimedia.org/wikipedia/en/thumb/1/1c/US_Sassuolo_Calcio_logo.svg/285px-US_Sassuolo_Calcio_logo.svg.png"}, {"c":"Genoa CFC", "u":"https://upload.wikimedia.org/wikipedia/en/thumb/2/2c/Genoa_CFC_crest.svg/218px-Genoa_CFC_crest.svg.png"}, {"c":"ACF Fiorentina", "u":"https://upload.wikimedia.org/wikipedia/commons/thumb/8/8c/ACF_Fiorentina_-_logo_%28Italy%2C_2022%29.svg/345px-ACF_Fiorentina_-_logo_%28Italy%2C_2022%29.svg.png"}, {"c":"Frosinone Calcio", "u":"https://upload.wikimedia.org/wikipedia/en/thumb/0/0b/Frosinone_Calcio_logo.svg/240px-Frosinone_Calcio_logo.svg.png"}, {"c":"FC Crotone", "u":"https://upload.wikimedia.org/wikipedia/en/thumb/d/db/FC_Crotone_logo.svg/210px-FC_Crotone_logo.svg.png"}, {"c":"AC Perugia Calcio", "u":"https://upload.wikimedia.org/wikipedia/en/thumb/0/08/Ac_Perugia_logo.svg/285px-Ac_Perugia_logo.svg.png"} ] } ]; // ====================================================================== // END OF QUESTIONS // ====================================================================== let currentQuestionIndex = 0; let score = 0; // The global score variable that tracks correct answers let isAnswered = false; /** * FIX for TypeError: undefined is not iterable * Ensures the input is a valid array before attempting to shuffle. * The original issue occurred when destructuring an item that wasn't an array * in the original implementation's Fisher-Yates swap. * The correct Fisher-Yates swap should be: [array[i], array[j]] = [array[j], array[i]]; * The original code had: [array[i], array[j]] = array[j][i]; which is incorrect array access. */ function shuffleArray(array) { if (!Array.isArray(array)) { // If it's not an array, return an empty array or the input directly if null/undefined is the expected outcome. // In this context, we must use a copy of the quizData array, which is done elsewhere. // This check guards against unexpected values being passed. return []; } // Corrected Fisher-Yates swap logic for (let i = array.length - 1; i > 0; i--) { const j = Math.floor(Math.random() * (i + 1)); // Destructuring assignment for swap [array[i], array[j]] = [array[j], array[i]]; } return array; } function getDecoyOptions(correctPlayerName, allPlayers) { const decoys = allPlayers.filter(p => p.p !== correctPlayerName); // Must ensure that decoys is an array before shuffling shuffleArray(decoys); const decoyNames = decoys.map(d => d.p); return Array.from(new Set(decoyNames)).slice(0, 3).map(name => { return allPlayers.find(p => p.p === name); }); } function selectOption(selectedPlayerName, correctPlayerName) { if (isAnswered) return; isAnswered = true; const opts = document.getElementById("quiz-options"); const nextBtn = document.getElementById("quiz-next"); const resultDiv = document.getElementById("quiz-result"); // Disable all buttons Array.from(opts.children).forEach((el) => { el.style.pointerEvents = 'none'; el.style.boxShadow = '0 2px 4px rgba(0,0,0,0.05)'; }); const isCorrect = selectedPlayerName === correctPlayerName; let selectedElement; let correctElement; // Find the selected and correct elements Array.from(opts.children).forEach(el => { const playerName = el.getAttribute('data-player-name'); if (playerName === selectedPlayerName) { selectedElement = el; } if (playerName === correctPlayerName) { correctElement = el; } }); if (isCorrect) { score++; // Correctly increments the global score selectedElement.style.background = "#e5ffe5"; selectedElement.style.borderColor = "#38761d"; resultDiv.textContent = `Correct! The player is ${toTitleCase(correctPlayerName)}.`; resultDiv.className = "correct-result"; } else { selectedElement.style.background = "#fee2e2"; selectedElement.style.borderColor = "#b91c1c"; if (correctElement) { correctElement.style.background = "#f0fdf4"; correctElement.style.borderColor = "#38761d"; } resultDiv.textContent = `Incorrect! The player who followed this path is ${toTitleCase(correctPlayerName)}.`; resultDiv.className = "incorrect-result"; } resultDiv.style.display = "block"; nextBtn.style.display = "inline-block"; } function nextQuestion(event) { event.preventDefault(); isAnswered = false; currentQuestionIndex++; if (currentQuestionIndex { const clubDiv = document.createElement("div"); clubDiv.className = "path-club"; // Highlight AS Roma in Red if (club.c.includes("Roma") || club.c.includes("AS Roma")) { clubDiv.classList.add("destination"); } clubDiv.title = club.c; // Generate a 3-letter fallback text const fallbackText = club.c.split(' ').map(n => n[0]).join('').toUpperCase().substring(0, 3); // Fallback for failed logo loads using a dynamic text placeholder clubDiv.innerHTML = `
`; pathContainer.appendChild(clubDiv); if (index { const link = document.createElement("a"); link.href = "#"; link.className = "player-option-button"; link.title = opt.p; link.setAttribute('data-player-name', opt.p); link.innerHTML = `${toTitleCase(opt.p)}`; link.addEventListener('click', (e) => { e.preventDefault(); selectOption(opt.p, correctPlayer.p); }); opts.appendChild(link); }); } function showResult() { const q = document.getElementById("quiz-instruction"); const opts = document.getElementById("quiz-options"); const nextBtn = document.getElementById("quiz-next"); const resultDiv = document.getElementById("quiz-result"); const pathContainer = document.getElementById('transfer-path'); const progressP = document.getElementById('quiz-progress'); const imagePlaceholder = document.getElementById('image-placeholder'); progressP.textContent = "Quiz Completed!"; // 1. Update instruction text as requested q.innerHTML = "Challenge Complete! Walter loves you just the way you are."; // Hide the transfer path and options pathContainer.style.display = 'none'; opts.style.display = 'none'; nextBtn.style.display = "none"; // Score Calculation const total = quizData.length; const finalScore = score; const scorePct = Math.round((finalScore / total) * 100); let msg = ""; if (scorePct === 100) msg = "🏆 PERFECT SCORE! You traced every single transfer trail flawlessly. Unrivaled knowledge!"; else if (scorePct >= 80) msg = "👏 Excellent Navigator! You know your Giallorossi passports extremely well."; else if (scorePct >= 50) msg = "🤔 Solid Effort! You recognized most of the players from their journeys."; else msg = "💭 Time for a refresh! The transfer market is complicated, but you'll get there."; resultDiv.textContent = `Final Score: ${finalScore}/${total} (${scorePct}%). ${msg}`; resultDiv.className = "correct-result"; resultDiv.style.display = "block"; // 2. Insert the Image as requested const walterImageUrl = "https://statics.cedscdn.it/uploads/ckfile/202408/onecms_19xeh7l1gg15rksa301_28143115.jpg"; imagePlaceholder.innerHTML = `
`; imagePlaceholder.style.display = 'block'; } function initQuiz() { const nextBtn = document.getElementById('quiz-next'); if (!nextBtn) { console.error("Quiz Initialization failed: Required DOM elements not found."); return; } nextBtn.addEventListener('click', nextQuestion); // Must create a shallow copy to shuffle, but the data structure is fine // We shuffle the questions here to randomize the order. // The shuffleArray function is now safe. shuffleArray(quizData); showQuestion(); } window.addEventListener('load', initQuiz);
AdvertisementAdvertisement