scripts/video.js

// scripts/video.js

async function startRecording() {
    if (navigator.mediaDevices && navigator.mediaDevices.getDisplayMedia) {
        try {
            const stream = await navigator.mediaDevices.getDisplayMedia({ video: true });
            alert("Screen access granted! Recording can now begin.");
        } catch (error) {
            alert(`Could not start recording. Error: ${error.message}`);
        }
    } else {
        alert("Sorry, your browser or current viewing environment does not support screen recording.");
    }
}

export function initVideo() {
    const productionButton = document.getElementById('production-button');
    const productionPanel = document.getElementById('production-panel');
    const startBtn = document.getElementById('start-recording');
    const tabs = document.querySelectorAll('.tab');
    const sections = document.querySelectorAll('.production-panel > div[id$="-section"]');

    if (productionButton) {
        productionButton.addEventListener('click', () => {
            productionPanel.classList.toggle('open');
        });
    }

    if (startBtn) {
        startBtn.addEventListener('click', startRecording);
    }

    tabs.forEach(tab => {
        tab.addEventListener('click', () => {
            tabs.forEach(t => t.classList.replace('active', 'inactive'));
            tab.classList.replace('inactive', 'active');

            const targetSectionId = tab.dataset.tab;
            sections.forEach(section => {
                if (section.id === targetSectionId) {
                    section.classList.remove('hidden');
                } else {
                    section.classList.add('hidden');
                }
            });
        });
    });
}