103 lines
3.0 KiB
JavaScript
103 lines
3.0 KiB
JavaScript
const selector = document.getElementById("selector");
|
|
const quiz = document.getElementById("quiz");
|
|
const resultado = document.getElementById("resultado");
|
|
|
|
let preguntasCargadas = []; // aquí guardamos el JSON cargado
|
|
|
|
// --- CARGAR EXAMEN ---
|
|
selector.addEventListener("change", async () => {
|
|
const url = selector.value;
|
|
if (!url) return;
|
|
|
|
preguntasCargadas = await fetch(url).then(r => r.json());
|
|
mostrarPreguntas(preguntasCargadas); // modo examen normal
|
|
});
|
|
|
|
// --- MOSTRAR TODAS LAS PREGUNTAS ---
|
|
function mostrarPreguntas(preguntas) {
|
|
quiz.innerHTML = "";
|
|
document.getElementById("pregunta-actual").innerHTML = "";
|
|
document.getElementById("feedback").textContent = "";
|
|
|
|
preguntas.forEach(p => {
|
|
const div = document.createElement("div");
|
|
div.className = "pregunta";
|
|
|
|
div.innerHTML = `
|
|
<p><strong>${p.id}.</strong> ${p.pregunta}</p>
|
|
${Object.entries(p.opciones).map(([letra, texto]) => `
|
|
<label class="opcion">
|
|
<input type="radio" name="p${p.id}" value="${letra}">
|
|
${letra}) ${texto}
|
|
</label>
|
|
`).join("")}
|
|
`;
|
|
|
|
quiz.appendChild(div);
|
|
});
|
|
|
|
document.getElementById("corregir").onclick = () => corregir(preguntas);
|
|
}
|
|
|
|
// --- CORREGIR EXAMEN COMPLETO ---
|
|
function corregir(preguntas) {
|
|
let aciertos = 0;
|
|
|
|
preguntas.forEach(p => {
|
|
const marcada = document.querySelector(`input[name="p${p.id}"]:checked`);
|
|
if (marcada && marcada.value === p.correcta) aciertos++;
|
|
});
|
|
|
|
resultado.textContent = `Has acertado ${aciertos} de ${preguntas.length}.`;
|
|
}
|
|
|
|
// --- MODO PREGUNTA ALEATORIA ---
|
|
document.getElementById("aleatoria").addEventListener("click", () => {
|
|
if (preguntasCargadas.length === 0) {
|
|
alert("Primero selecciona un examen");
|
|
return;
|
|
}
|
|
|
|
const pregunta = preguntasCargadas[Math.floor(Math.random() * preguntasCargadas.length)];
|
|
mostrarPreguntaAleatoria(pregunta);
|
|
});
|
|
|
|
// --- MOSTRAR UNA PREGUNTA ALEATORIA ---
|
|
function mostrarPreguntaAleatoria(p) {
|
|
quiz.innerHTML = ""; // ocultamos el examen completo
|
|
resultado.textContent = "";
|
|
|
|
const cont = document.getElementById("pregunta-actual");
|
|
const feedback = document.getElementById("feedback");
|
|
feedback.textContent = "";
|
|
|
|
cont.innerHTML = `
|
|
<div class="pregunta">
|
|
<p><strong>${p.id}.</strong> ${p.pregunta}</p>
|
|
${Object.entries(p.opciones).map(([letra, texto]) => `
|
|
<label class="opcion">
|
|
<input type="radio" name="respuesta" value="${letra}">
|
|
${letra}) ${texto}
|
|
</label>
|
|
`).join("")}
|
|
<button id="comprobar">Comprobar</button>
|
|
</div>
|
|
`;
|
|
|
|
document.getElementById("comprobar").onclick = () => {
|
|
const marcada = document.querySelector(`input[name="respuesta"]:checked`);
|
|
if (!marcada) {
|
|
feedback.textContent = "Selecciona una respuesta";
|
|
return;
|
|
}
|
|
|
|
if (marcada.value === p.correcta) {
|
|
feedback.textContent = "✔ ¡Correcto!";
|
|
feedback.style.color = "green";
|
|
} else {
|
|
feedback.textContent = `✘ Incorrecto. La correcta era: ${p.correcta}`;
|
|
feedback.style.color = "red";
|
|
}
|
|
};
|
|
}
|