// --- Upload Modal & Functionality ---
const uploadModal = document.getElementById('upload-modal');
const openUploadBtn = document.getElementById('open-upload-modal');
const closeUploadBtn = document.getElementById('close-upload-modal');
const uploadVideoBtn = document.getElementById('upload-video-btn');
const fileInput = document.getElementById('file-input');
const youtubeUrlInput = document.getElementById('youtube-url-input');
const uploadError = document.getElementById('upload-error');
const videoGrid = document.getElementById('video-grid');

openUploadBtn.addEventListener('click', () => {
    uploadModal.classList.remove('hidden');
    fileInput.value = '';
    youtubeUrlInput.value = '';
    uploadError.classList.add('hidden');
});

closeUploadBtn.addEventListener('click', () => {
    uploadModal.classList.add('hidden');
    uploadError.classList.add('hidden');
});

uploadVideoBtn.addEventListener('click', () => {
    uploadError.classList.add('hidden');
    let added = false;

    // 1. Handle File Upload
    if (fileInput.files.length > 0) {
        const file = fileInput.files[0];
        if (!file.type.startsWith('video/')) {
            uploadError.textContent = 'Please select a valid video file.';
            uploadError.classList.remove('hidden');
            return;
        }
        const url = URL.createObjectURL(file);
        addVideoCard({
            type: 'file',
            src: url,
            title: file.name,
            channel: "Local Upload",
            description: ""
        });
        added = true;
    }

    // 2. Handle YouTube URL Embed
    const ytUrl = youtubeUrlInput.value.trim();
    if (ytUrl) {
        const match = ytUrl.match(/(?:youtube\.com.*[?&]v=|youtu\.be\/)([a-zA-Z0-9_-]{11})/);
        if (!match) {
            uploadError.textContent = 'Please enter a valid YouTube video URL.';
            uploadError.classList.remove('hidden');
            return;
        }
        addVideoCard({
            type: 'youtube',
            videoId: match[1],
            title: 'User Video',
            channel: 'YouTube Embed',
            description: ''
        });
        added = true;
    }

    if (added) {
        uploadModal.classList.add('hidden');
        fileInput.value = '';
        youtubeUrlInput.value = '';
        uploadError.classList.add('hidden');
    } else {
        uploadError.textContent = 'Please select a file or enter a YouTube URL.';
        uploadError.classList.remove('hidden');
    }
});

// Helper to add video to grid
function addVideoCard({type, src, videoId, title, channel, description}) {
    const div = document.createElement('div');
    div.className = "video-card bg-white rounded-lg shadow-md overflow-hidden cursor-pointer transform hover:scale-105 transition duration-300 ease-in-out p-4";
    div.dataset.title = title;
    div.dataset.channel = channel;
    div.dataset.description = description;

    let inner = '';
    if (type === 'file') {
        inner = `<div class="video-container mb-4">
                    <video controls width="100%" preload="metadata" style="background:#000;">
                        <source src="${src}">
                        Your browser does not support the video tag.
                    </video>
                </div>`;
    } else if (type === 'youtube') {
        inner = `<div class="video-container mb-4">
                    <img src="https://img.youtube.com/vi/${videoId}/hqdefault.jpg" alt="Video Thumbnail">
                 </div>`;
        div.dataset.videoId = videoId;
    }
    inner += `<h2 class="text-lg font-semibold mb-2">${title}</h2>
              <p class="text-sm text-gray-600">${channel}</p>`;
    div.innerHTML = inner;

    // Click: For file, open video in modal; for YT, open as usual
    div.addEventListener('click', () => {
        if (type === 'file') {
            // Show in detail modal with <video>
            detailVideoPlayer.src = '';
            detailVideoPlayer.outerHTML = `<video id="detail-video-player" controls width="100%" style="background:#000;"><source src="${src}"></video>`;
            detailVideoTitle.textContent = title;
            detailVideoChannel.textContent = channel;
            detailVideoDescription.textContent = description;
            showSection(videoDetailSection);
        } else if (type === 'youtube') {
            showVideoDetail(videoId, title, channel, description);
        }
    });

    videoGrid.prepend(div);
}