Test De Que Personaje De Fnaf Sister Location Eres Apr 2026

// Mapeo de respuestas a personajes (cada opción suma puntos a un personaje) // Orden de personajes: [Baby, Ballora, FuntimeFreddy, FuntimeFoxy, Ennard, Michael] const POINTS_MATRIX = [ // Pregunta 0 [ baby:2, ennard:1, michael:1 , // analizo fríamente baby:1, funtime_foxy:2 , // manipulo michael:2, funtime_freddy:1 , // ayudar arriesgándome ennard:2, ballora:1 ], // oculto errores // Pregunta 1 - roles [ funtime_freddy:2, baby:1 , // líder rudo ballora:2, ennard:1 , // observa sombras funtime_foxy:2, baby:1 , // entretener michael:2, ennard:1 ], // técnico meticuloso // Pregunta 2 - defectos [ funtime_freddy:2, ennard:1 , // controlador baby:2, funtime_foxy:1 , // orgulloso aprobación ennard:2, funtime_foxy:1 , // mentiroso michael:2, ballora:1 ], // inocente confiado // Pregunta 3 - herramienta [ funtime_freddy:2, michael:1 , // garra fuerza baby:2, funtime_foxy:1 , // voz persuasiva funtime_foxy:2, ennard:1 , // gancho desaparecer ennard:2, michael:1 ], // diseño modular // Pregunta 4 - valores [ michael:2, ballora:1 , // lealtad familia baby:2, ennard:2 , // inteligencia y supervivencia funtime_freddy:2, funtime_foxy:1 , // espectáculo ennard:2, ballora:1 ], // control y secretos // Pregunta 5 - final favorito SL [ ballora:1, ennard:2 , // final privado (observar) funtime_freddy:1, michael:1 , // electrocutado ennard:2, baby:1 , // scooping room baby:2, funtime_foxy:1 ] // helado para Elizabeth ];

.question-text font-size: 1.7rem; font-weight: bold; color: #f2f4fc; margin-bottom: 30px; line-height: 1.3; text-shadow: 0 1px 2px black;

// ----- ESTADO DE LA APP ----- let currentQuestion = 0; let userAnswers = new Array(QUESTIONS.length).fill(-1); // -1 = no respondida

text: "En una situación de emergencia en Circus Baby's, tú...", options: [ "Analizo el problema fríamente y busco la salida lógica.", "Intento manipular a otros para que resuelvan el problema por mí.", "Me lanzo a ayudar aunque me ponga en riesgo.", "Oculto mis errores y finjo que todo está bien." ] , test de que personaje de fnaf sister location eres

// Renderizado según estado function render() // Verificar si todas las preguntas tienen respuesta const allAnswered = userAnswers.every(idx => idx !== -1); if (allAnswered && currentQuestion === QUESTIONS.length) // Mostrar resultado final const resultChar = computeResult(userAnswers); dynamicDiv.innerHTML = ` <div class="result-container"> <div class="character-card"> <div class="character-name">$resultChar.name</div> <div class="character-desc">$resultChar.desc</div> </div> <button class="restart-btn" id="restartTestBtn">🔄 Volver a empezar 🔄</button> </div> `; const restartBtn = document.getElementById("restartTestBtn"); if (restartBtn) restartBtn.addEventListener("click", () => resetQuiz()); return; // Si no estamos en resultados, mostrar pregunta actual if (currentQuestion < QUESTIONS.length) const qData = QUESTIONS[currentQuestion]; const selectedIdx = userAnswers[currentQuestion]; let optionsHtml = ""; const letters = ["A", "B", "C", "D"]; qData.options.forEach((opt, idx) => const isSelected = (selectedIdx === idx); const selectedClass = isSelected ? 'style="background:#2a4c6e; border-color:#8ac4ff; color:white;"' : ''; optionsHtml += ` <div class="option-btn" data-opt-index="$idx" $selectedClass> <span class="option-prefix">$letters[idx]</span> <span>$opt</span> </div> `; ); const progressPercent = ((currentQuestion + 1) / QUESTIONS.length) * 100; const isFirst = currentQuestion === 0; const isLast = currentQuestion === QUESTIONS.length - 1; const nextDisabled = userAnswers[currentQuestion] === -1; dynamicDiv.innerHTML = ` <div class="question-panel"> <div class="progress"><div class="progress-fill" style="width: $progressPercent%;"></div></div> <div class="question-text">❓ $qData.text</div> <div class="options" id="optionsList"> $optionsHtml </div> <div class="nav-buttons"> <button class="nav-btn" id="prevBtn" $isFirst ? 'disabled' : ''>◀ Anterior</button> <button class="nav-btn primary" id="nextBtn" $nextDisabled ? 'disabled' : ''>$isLast ? 'Ver resultado' : 'Siguiente ▶'</button> </div> </div> `; // Eventos de opciones const optButtons = document.querySelectorAll('.option-btn'); optButtons.forEach(btn => btn.addEventListener('click', (e) => const idx = parseInt(btn.dataset.optIndex); if (!isNaN(idx)) // Guardar respuesta userAnswers[currentQuestion] = idx; // Re-renderizar para actualizar estilo y habilitar botón siguiente render(); ); ); // Botón anterior const prevBtn = document.getElementById('prevBtn'); if (prevBtn) prevBtn.addEventListener('click', () => if (currentQuestion > 0) currentQuestion--; render(); ); // Botón siguiente / finalizar const nextBtn = document.getElementById('nextBtn'); if (nextBtn) nextBtn.addEventListener('click', () => if (userAnswers[currentQuestion] !== -1) if (isLast) // vamos a resultado final currentQuestion = QUESTIONS.length; render(); else currentQuestion++; render(); ); else // fallback por si acaso render();

.progress background: #11161f; border-radius: 40px; height: 10px; margin-bottom: 25px; overflow: hidden;

.character-desc font-size: 1.1rem; line-height: 1.5; color: #cbdbe6; // Mapeo de respuestas a personajes (cada opción

<!DOCTYPE html> <html lang="es"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes"> <title>Test: ¿Qué personaje de FNaF Sister Location eres?</title> <style> * box-sizing: border-box; font-family: 'Segoe UI', 'Courier New', monospace; body background: linear-gradient(145deg, #0a0f1e 0%, #0c1222 100%); min-height: 100vh; display: flex; justify-content: center; align-items: center; padding: 20px; margin: 0;

footer font-size: 0.7rem; text-align: center; padding: 15px; color: #4a5b74; border-top: 1px solid #19212e; </style> </head> <body> <div class="quiz-container" id="quizApp"> <div class="header"> <h1>⚙️ SISTER LOCATION ⚙️</h1> <p>🔧 ¿Qué animatrónico / personaje eres? 🔧</p> </div> 'disabled' : ''>$isLast

.options display: flex; flex-direction: column; gap: 14px;

// Elementos del DOM const appContainer = document.getElementById("quizApp"); const dynamicDiv = document.getElementById("dynamicContent");

.restart-btn:hover background: #6f4588; transform: scale(1.02);

.nav-btn:disabled opacity: 0.4; cursor: not-allowed;