El Truco de Kaprekar (6174)

Introduce un número de 4 cifras diferentes y observa cómo converge a 6174.

☆ ☆ ☆

Tiempo: 60s

Paso 1: Ingresa un número de cuatro dígitos

`); const inputDiv = document.createElement('div'); const input = document.createElement('input'); input.type = 'text'; input.id = 'game-input-number'; input.placeholder = 'Ejemplo: 3524'; input.maxLength = 4; const confirmBtn = document.createElement('button'); confirmBtn.textContent = 'Confirmar'; confirmBtn.addEventListener('click', () => { const numStr = document.getElementById('game-input-number').value.trim(); if (!/^\d{4}$/.test(numStr)) { mostrarMensajeError('Por favor, ingresa un número válido de 4 dígitos.'); return; } const digits = numStr.split('').map(Number); if (digits.every(d => d === digits[0])) { mostrarMensajeError('Todos los dígitos son iguales. Por favor, elige un número con dígitos diferentes.'); return; } gameOriginalNumber = numStr.padStart(4, '0'); addGameStep(`

Número ingresado: ${gameOriginalNumber}

`); inputDiv.classList.add('hidden'); mostrarPaso2(); }); inputDiv.appendChild(input); inputDiv.appendChild(confirmBtn); gameSteps.appendChild(inputDiv); } else { // Paso 1: Ingresar el nuevo número obtenido en iteraciones anteriores addGameStep(`

Paso 1: Ingresa el nuevo número obtenido (${initialNumber})

`); const inputDiv = document.createElement('div'); const input = document.createElement('input'); input.type = 'text'; input.id = 'game-input-number'; input.placeholder = `Ejemplo: ${initialNumber}`; input.maxLength = 4; const confirmBtn = document.createElement('button'); confirmBtn.textContent = 'Confirmar'; confirmBtn.addEventListener('click', () => { const numStr = document.getElementById('game-input-number').value.trim(); if (!/^\d{4}$/.test(numStr)) { mostrarMensajeError('Por favor, ingresa un número válido de 4 dígitos.'); return; } const digits = numStr.split('').map(Number); if (digits.every(d => d === digits[0])) { mostrarMensajeError('Todos los dígitos son iguales. Por favor, elige un número con dígitos diferentes.'); return; } gameOriginalNumber = numStr.padStart(4, '0'); addGameStep(`

Número ingresado: ${gameOriginalNumber}

`); inputDiv.classList.add('hidden'); mostrarPaso2(); }); inputDiv.appendChild(input); inputDiv.appendChild(confirmBtn); gameSteps.appendChild(inputDiv); } } // Función para mostrar el Paso 2: Ordenar de menor a mayor function mostrarPaso2() { addGameStep(`

Paso 2: Ordena los dígitos de menor a mayor

`); const inputDiv = document.createElement('div'); const label = document.createElement('label'); label.textContent = `Ingresa el número ordenado de menor a mayor para ${gameOriginalNumber}:`; const input = document.createElement('input'); input.type = 'text'; input.id = 'game-ascending'; input.placeholder = 'Ejemplo: 2345'; input.maxLength = 4; const confirmBtn = document.createElement('button'); confirmBtn.textContent = 'Confirmar'; confirmBtn.addEventListener('click', () => { const userAscendingStr = document.getElementById('game-ascending').value.trim().padStart(4, '0'); if (!/^\d{4}$/.test(userAscendingStr)) { mostrarMensajeError('Por favor, ingresa un número válido de 4 dígitos.'); return; } const { ascendente } = ordenarNumeros(gameOriginalNumber); if (userAscendingStr !== ascendente) { mostrarMensajeError('Ordenamiento incorrecto. Por favor, intenta de nuevo.'); } else { gameAscending = ascendente; addGameStep(`

Ordenamiento correcto (menor a mayor): ${gameAscending}

`); inputDiv.classList.add('hidden'); mostrarPaso3(); } }); inputDiv.appendChild(label); inputDiv.appendChild(input); inputDiv.appendChild(confirmBtn); // Mensaje de error const errorMsg = document.createElement('div'); errorMsg.id = 'error-ascending'; errorMsg.className = 'error-message'; inputDiv.appendChild(errorMsg); gameSteps.appendChild(inputDiv); } // Función para mostrar el Paso 3: Ordenar de mayor a menor function mostrarPaso3() { addGameStep(`

Paso 3: Ordena los dígitos de mayor a menor

`); const inputDiv = document.createElement('div'); const label = document.createElement('label'); label.textContent = `Ingresa el número ordenado de mayor a menor para ${gameOriginalNumber}:`; const input = document.createElement('input'); input.type = 'text'; input.id = 'game-descending'; input.placeholder = 'Ejemplo: 5432'; input.maxLength = 4; const confirmBtn = document.createElement('button'); confirmBtn.textContent = 'Confirmar'; confirmBtn.addEventListener('click', () => { const userDescendingStr = document.getElementById('game-descending').value.trim().padStart(4, '0'); if (!/^\d{4}$/.test(userDescendingStr)) { mostrarMensajeError('Por favor, ingresa un número válido de 4 dígitos.'); return; } const { descendente } = ordenarNumeros(gameOriginalNumber); if (userDescendingStr !== descendente) { mostrarMensajeError('Ordenamiento incorrecto. Por favor, intenta de nuevo.'); } else { gameDescending = descendente; addGameStep(`

Ordenamiento correcto (mayor a menor): ${gameDescending}

`); inputDiv.classList.add('hidden'); mostrarPaso4(); } }); inputDiv.appendChild(label); inputDiv.appendChild(input); inputDiv.appendChild(confirmBtn); // Mensaje de error const errorMsg = document.createElement('div'); errorMsg.id = 'error-descending'; errorMsg.className = 'error-message'; inputDiv.appendChild(errorMsg); gameSteps.appendChild(inputDiv); } // Función para mostrar el Paso 4: Resta (Mayor - Menor) function mostrarPaso4() { addGameStep(`

Paso 4: Realiza la resta (Mayor - Menor)

`); const inputDiv = document.createElement('div'); const label = document.createElement('label'); label.textContent = `Ingresa el resultado de la resta (${gameDescending} - ${gameAscending}):`; const input = document.createElement('input'); input.type = 'text'; input.id = 'game-subtraction'; input.placeholder = 'Ejemplo: 3087'; input.maxLength = 4; const confirmBtn = document.createElement('button'); confirmBtn.textContent = 'Confirmar'; confirmBtn.addEventListener('click', () => { const userSubtractionStr = document.getElementById('game-subtraction').value.trim().padStart(4, '0'); if (!/^\d{4}$/.test(userSubtractionStr)) { mostrarMensajeError('Por favor, ingresa un número válido de 4 dígitos.'); return; } const correctSubtraction = (parseInt(gameDescending, 10) - parseInt(gameAscending, 10)).toString().padStart(4, '0'); if (userSubtractionStr !== correctSubtraction) { mostrarMensajeError('Resultado de la resta incorrecto. Por favor, intenta de nuevo.'); } else { gameSubtraction = correctSubtraction; addGameStep(`

Resta correcta: ${gameSubtraction}

`); inputDiv.classList.add('hidden'); verificarResultado(); } }); inputDiv.appendChild(label); inputDiv.appendChild(input); inputDiv.appendChild(confirmBtn); // Mensaje de error const errorMsg = document.createElement('div'); errorMsg.id = 'error-subtraction'; errorMsg.className = 'error-message'; inputDiv.appendChild(errorMsg); gameSteps.appendChild(inputDiv); } // Función para verificar si el resultado es 6174 function verificarResultado() { if (gameSubtraction === '6174') { addGameStep(`

¡FELICIDADES! Has comprobado que el resultado es siempre 6174.

`); addGameStep(`

¡Has completado el truco de Kaprekar, ahora puedes avanzar al nivel 7!

`); // Mostrar opciones para reiniciar o finalizar const promptDiv = document.createElement('div'); promptDiv.style.marginTop = '20px'; const message = document.createElement('p'); message.textContent = '¿Deseas intentar de nuevo?'; const tryAgainBtn = document.createElement('button'); tryAgainBtn.textContent = 'Otro Intento'; tryAgainBtn.style.backgroundColor = '#43a047'; tryAgainBtn.style.color = 'white'; tryAgainBtn.addEventListener('click', () => { initiateGame(); }); const noBtn = document.createElement('button'); noBtn.textContent = 'No, Gracias'; noBtn.style.backgroundColor = '#c62828'; noBtn.style.color = 'white'; noBtn.addEventListener('click', () => { window.location.href = 'https://www.gamificate.aprendizajeactivo.cl/'; }); promptDiv.appendChild(message); promptDiv.appendChild(tryAgainBtn); promptDiv.appendChild(noBtn); gameSteps.appendChild(promptDiv); } else { addGameStep(`

El resultado no es 6174. Vamos a repetir el proceso con el nuevo número.

`); // Preparar para la siguiente iteración setTimeout(() => { initiateGame(gameSubtraction); }, 3000); } } // Función para reiniciar el juego function resetGame() { gameSteps.innerHTML = ''; resetGameBtn.classList.add('hidden'); initiateGame(); } // Función para mostrar mensajes de error function mostrarMensajeError(mensaje) { // Identificar el paso actual const currentStep = gameSteps.lastElementChild; if (currentStep) { let errorDiv; if (currentStep.querySelector('#game-ascending')) { errorDiv = document.getElementById('error-ascending'); } else if (currentStep.querySelector('#game-descending')) { errorDiv = document.getElementById('error-descending'); } else if (currentStep.querySelector('#game-subtraction')) { errorDiv = document.getElementById('error-subtraction'); } if (errorDiv) { errorDiv.textContent = mensaje; } } } // Asignar eventos a los botones startDemoBtn.addEventListener('click', startDemonstration); skipExplanationBtn.addEventListener('click', skipExplanation); skipDemoBtn.addEventListener('click', skipDemo); startGameBtn.addEventListener('click', () => { introduction.classList.add('hidden'); demoArea.classList.add('hidden'); gameArea.classList.remove('hidden'); initiateGame(); }); resetGameBtn.addEventListener('click', resetGame); // Inicializar la fase de juego al finalizar la demostración // Esta parte ya está manejada en la función 'startGameBtn' listener