// Valid redemption code (you can change this to any 5-digit code)
const VALID_CODE = '12345';

// Get DOM elements
const codeScreen = document.getElementById('code-screen');
const revealScreen = document.getElementById('reveal-screen');
const finalScreen = document.getElementById('final-screen');
const codeInput = document.getElementById('code-input');
const redeemBtn = document.getElementById('redeem-btn');
const confirmBtn = document.getElementById('confirm-btn');
const errorMessage = document.getElementById('error-message');

// Format input to only accept numbers
codeInput.addEventListener('input', function(e) {
    this.value = this.value.replace(/[^0-9]/g, '');
});

// Handle Enter key in code input
codeInput.addEventListener('keypress', function(e) {
    if (e.key === 'Enter') {
        redeemBtn.click();
    }
});

// Redeem button click
redeemBtn.addEventListener('click', function() {
    const code = codeInput.value.trim();
    
    if (code.length !== 5) {
        errorMessage.textContent = 'Please enter a 5-digit code';
        codeInput.classList.add('shake');
        setTimeout(() => codeInput.classList.remove('shake'), 500);
        return;
    }
    
    if (code === VALID_CODE) {
        errorMessage.textContent = '';
        // Transition to reveal screen
        codeScreen.classList.remove('active');
        revealScreen.classList.add('active');
        // Scroll to top
        window.scrollTo(0, 0);
    } else {
        errorMessage.textContent = 'Invalid code. Please try again.';
        codeInput.value = '';
        codeInput.classList.add('shake');
        setTimeout(() => codeInput.classList.remove('shake'), 500);
    }
});

// Confirm button click (reveal the hoax)
confirmBtn.addEventListener('click', function() {
    // Add some dramatic pause
    confirmBtn.textContent = 'PROCESSING...';
    confirmBtn.disabled = true;
    
    setTimeout(() => {
        revealScreen.classList.remove('active');
        finalScreen.classList.add('active');
        window.scrollTo(0, 0);
    }, 1500);
});

// Add shake animation for invalid codes
const style = document.createElement('style');
style.textContent = `
    @keyframes shake {
        0%, 100% { transform: translateX(0); }
        25% { transform: translateX(-10px); }
        75% { transform: translateX(10px); }
    }
    .shake {
        animation: shake 0.3s ease;
    }
`;
document.head.appendChild(style);