eventHandler.js

import { setRandomParagraph, updateTextDisplay, state as textState } from './textHandler.js';
import { startTimer, endTest, resetTimer } from './timer.js';
import { saveProgress, countCorrectChars, countCorrectWords } from './utils.js';

export const state = {
    isTypingStarted: false,
    isZenMode: false,
    typedWords: [],
    currentWordIndex: 0,
    currentInput: '',
    allTypedText: '',
    currentText: '',
    startTime: null
};

const elements = {
    typingInput: null,
    resetBtn: null,
    zenModeBtn: null,
    timeModeSelect: null,
    textTypeSelect: null,
    difficultySelect: null,
    wpmDisplay: null,
    accuracyDisplay: null,
    timerDisplay: null,
    resultModal: null,
    modalWpm: null,
    modalAccuracy: null,
    modalCorrectWords: null,
    modalIncorrectWords: null,
    modalTimeTaken: null,
    closeModalBtn: null
};

document.addEventListener('DOMContentLoaded', () => {
    console.log('DOM fully loaded for eventHandler.js');
    elements.typingInput = document.getElementById('typing-input');
    elements.resetBtn = document.getElementById('reset-btn');
    elements.zenModeBtn = document.getElementById('zen-mode-btn');
    elements.timeModeSelect = document.getElementById('time-mode');
    elements.textTypeSelect = document.getElementById('symbol-mode');
    elements.difficultySelect = document.getElementById('difficulty');
    elements.wpmDisplay = document.getElementById('wpm');
    elements.accuracyDisplay = document.getElementById('accuracy');
    elements.timerDisplay = document.getElementById('timer');
    elements.resultModal = document.getElementById('result-modal');
    elements.modalWpm = document.getElementById('modal-wpm');
    elements.modalAccuracy = document.getElementById('modal-accuracy');
    elements.modalCorrectWords = document.getElementById('modal-correct-words');
    elements.modalIncorrectWords = document.getElementById('modal-incorrect-words');
    elements.modalTimeTaken = document.getElementById('modal-time-taken');
    elements.closeModalBtn = document.getElementById('close-modal');
    console.log('Elements initialized:', {
        typingInput: !!elements.typingInput,
        resetBtn: !!elements.resetBtn,
        zenModeBtn: !!elements.zenModeBtn,
        timeModeSelect: !!elements.timeModeSelect,
        textTypeSelect: !!elements.textTypeSelect,
        difficultySelect: !!elements.difficultySelect,
        wpmDisplay: !!elements.wpmDisplay,
        accuracyDisplay: !!elements.accuracyDisplay,
        timerDisplay: !!elements.timerDisplay,
        resultModal: !!elements.resultModal,
        modalWpm: !!elements.modalWpm,
        modalAccuracy: !!elements.modalAccuracy,
        modalCorrectWords: !!elements.modalCorrectWords,
        modalIncorrectWords: !!elements.modalIncorrectWords,
        modalTimeTaken: !!elements.modalTimeTaken,
        closeModalBtn: !!elements.closeModalBtn
    });
});

export function resetTest() {
    console.log('resetTest called');
    Object.assign(state, {
        isTypingStarted: false,
        typedWords: [],
        currentWordIndex: 0,
        currentInput: '',
        allTypedText: '',
        currentText: '',
        startTime: null
    });
    Object.assign(textState, { currentWordIndex: 0 });
    resetTimer();
    if (elements.wpmDisplay) elements.wpmDisplay.textContent = '0';
    if (elements.accuracyDisplay) elements.accuracyDisplay.textContent = '0%';
    if (elements.timerDisplay && elements.timeModeSelect) elements.timerDisplay.textContent = elements.timeModeSelect.value;
    if (elements.resultModal) elements.resultModal.classList.add('hidden');
    if (elements.typingInput) elements.typingInput.value = '';
    setRandomParagraph();
}

function handleKeydown(e) {
    console.log('Keydown:', e.key);
    if (!elements.typingInput || !elements.wpmDisplay || !elements.accuracyDisplay || !elements.timerDisplay) {
        console.error('Required elements not found for keydown');
        return;
    }

    const words = textState.currentText.split(/\s+/).filter(word => word);
    state.currentText = textState.currentText; // Sync with textHandler.js

    if (!state.isTypingStarted && !state.isZenMode) {
        console.log('Starting timer');
        state.startTime = new Date();
        startTimer();
        state.isTypingStarted = true;
    }

    if (e.key === ' ') {
        e.preventDefault();
        if (state.currentInput.trim()) {
            state.typedWords[state.currentWordIndex] = state.currentInput.trim();
            state.allTypedText += state.currentInput + ' ';
            state.currentWordIndex++;
            state.currentInput = '';
            console.log('Space pressed, word saved:', state.typedWords[state.currentWordIndex - 1]);
            if (elements.typingInput) elements.typingInput.value = '';
        }
    } else if (e.key === 'Backspace') {
        state.currentInput = state.currentInput.slice(0, -1);
        console.log('Backspace pressed, current input:', state.currentInput);
    } else if (e.key.length === 1) {
        state.currentInput += e.key;
        console.log('Key pressed, current input:', state.currentInput);
    }

    updateTextDisplay(state.typedWords, state.currentWordIndex);
    elements.resetBtn.disabled = false;

    // Live WPM and Accuracy calculation
    if (state.isTypingStarted && state.startTime) {
        const currentTime = new Date();
        const timeTaken = (currentTime - state.startTime) / 60000; // Time in minutes
        const typedWords = state.typedWords.filter(word => word);
        const correctWords = countCorrectWords(typedWords, words);
        const wpm = timeTaken > 0 ? Math.round(correctWords / timeTaken) : 0;
        const correctChars = countCorrectChars(typedWords, words);
        const totalTypedChars = state.allTypedText.length || 1; // Avoid division by zero
        const accuracy = Math.round((correctChars / totalTypedChars) * 100);

        if (elements.wpmDisplay) elements.wpmDisplay.textContent = wpm;
        if (elements.accuracyDisplay) elements.accuracyDisplay.textContent = `${accuracy}%`;
        console.log('Live stats updated:', { wpm, accuracy });
    }

    if (state.currentWordIndex >= words.length || (state.isZenMode && state.currentInput.trim() && e.key === ' ')) {
        console.log('Test completed');
        if (state.currentInput.trim()) {
            state.typedWords[state.currentWordIndex] = state.currentInput.trim();
            state.allTypedText += state.currentInput;
        }
        endTest();
    }
}

export function initEventListeners() {
    console.log('initEventListeners called');
    if (!elements.zenModeBtn || !elements.resetBtn || !elements.textTypeSelect || !elements.difficultySelect || !elements.timeModeSelect || !elements.closeModalBtn || !elements.typingInput) {
        console.error('One or more elements not found for event listeners');
        return;
    }

    elements.zenModeBtn.addEventListener('click', () => {
        console.log('Zen Mode toggled');
        state.isZenMode = !state.isZenMode;
        elements.zenModeBtn.textContent = `Zen Mode: ${state.isZenMode ? 'ON' : 'OFF'}`;
        elements.zenModeBtn.classList.toggle('active');
        elements.timeModeSelect.disabled = state.isZenMode;
        resetTest();
    });

    elements.resetBtn.addEventListener('click', () => {
        console.log('Reset button clicked');
        resetTest();
    });

    elements.textTypeSelect.addEventListener('change', () => {
        console.log('Text type changed:', elements.textTypeSelect.value);
        resetTest();
    });

    elements.difficultySelect.addEventListener('change', () => {
        console.log('Difficulty changed:', elements.difficultySelect.value);
        resetTest();
    });

    elements.timeModeSelect.addEventListener('change', () => {
        console.log('Time mode changed:', elements.timeModeSelect.value);
        resetTimer();
    });

    elements.closeModalBtn.addEventListener('click', () => {
        console.log('Close modal button clicked');
        elements.resultModal.classList.add('hidden');
        resetTest();
    });

    elements.typingInput.addEventListener('keydown', handleKeydown);
}