script.js

// File switching functionality
document.querySelectorAll('#fileList div').forEach(fileItem => {
    fileItem.addEventListener('click', function() {
        const fileName = this.querySelector('span').textContent;
        switchFile(fileName);
    });
});
let currentFileListener = null;

function switchFile(fileName) {
    currentFile = fileName;
    
    // Clean up previous listener if exists
    if (currentFileListener) {
        currentFileListener(); // Unsubscribes the listener
    }
    
    // Update UI - set active file
document.querySelectorAll('#fileList div').forEach(item => {
        if (item.querySelector('span').textContent === fileName) {
            item.classList.add('bg-[rgba(124,58,237,0.2)]');
            const icon = item.querySelector('i');
            icon.classList.add('glow-effect');
        } else {
            item.classList.remove('bg-[rgba(124,58,237,0.2)]');
            const icon = item.querySelector('i');
            icon.classList.remove('glow-effect');
        }
    });

    // Change language mode based on file extension
    let language;
    if (fileName.endsWith('.js')) language = 'javascript';
    if (fileName.endsWith('.css')) language = 'css';
    
    if (editor && language) {
        monaco.editor.setModelLanguage(editor.getModel(), language);
    }

    // Switch Firebase listener to new file
    const { db, fb } = window;
    const fileRef = fb.ref(db, `rooms/cyber-room/files/${currentFile.replace(/\./g, '_')}/code`);
    
    // Update current file in presence data
    const cursorRef = fb.ref(db, `rooms/cyber-room/cursors/${userId}`);
    fb.set(cursorRef, {
        name: userName,
        color: userColor,
        currentFile: currentFile
    });
    // Update editor content from new file
    currentFileListener = fb.onValue(fileRef, (snapshot) => {
        const data = snapshot.val();
        if (data && data !== editor.getValue()) {
            isRemoteUpdate = true;
            editor.setValue(data || `// ${fileName}\n// Start coding...`);
            isRemoteUpdate = false;
        }
    });
}

// Initialize with first file
document.addEventListener('DOMContentLoaded', () => {
    setTimeout(() => {
        document.querySelector('#fileList div:first-child').click();
    }, 100);
});