/**
 * 媒体查看器模块（支持图片和视频）
 */

function openMediaViewer(url, type) {
    const overlay = document.getElementById('mediaViewerOverlay');
    const img = document.getElementById('viewerImage');
    const video = document.getElementById('viewerVideo');
    const indicator = document.getElementById('mediaIndicator');
    
    // 隐藏所有内容
    img.style.display = 'none';
    video.style.display = 'none';
    
    if (type === 'video') {
        video.src = url;
        video.style.display = 'block';
        video.load();
        indicator.textContent = '点击任意位置关闭';
    } else {
        img.src = url;
        img.style.display = 'block';
        indicator.textContent = '点击任意位置关闭';
    }
    
    overlay.classList.add('show');
    document.body.style.overflow = 'hidden';
}

function closeMediaViewer() {
    const overlay = document.getElementById('mediaViewerOverlay');
    const video = document.getElementById('viewerVideo');
    
    overlay.classList.remove('show');
    document.body.style.overflow = '';
    
    // 停止视频播放
    video.pause();
    video.src = '';
}

// 为聊天消息中的图片和视频添加点击事件
document.addEventListener('DOMContentLoaded', function() {
    const container = document.getElementById('messagesContainer');
    
    const observer = new MutationObserver(function(mutations) {
        mutations.forEach(function(mutation) {
            mutation.addedNodes.forEach(function(node) {
                if (node.nodeType === Node.ELEMENT_NODE) {
                    // 绑定图片点击事件
                    const images = node.querySelectorAll('.chat-image');
                    images.forEach(function(img) {
                        img.addEventListener('click', function() {
                            openMediaViewer(this.src, 'image');
                        });
                    });
                    
                    // 绑定视频点击事件
                    const videos = node.querySelectorAll('.chat-video-wrapper');
                    videos.forEach(function(video) {
                        video.addEventListener('click', function(e) {
                            e.stopPropagation();
                            const videoUrl = this.getAttribute('data-video');
                            if (videoUrl) {
                                openMediaViewer(videoUrl, 'video');
                            }
                        });
                    });
                }
            });
        });
    });
    
    observer.observe(container, { childList: true, subtree: true });
    
    // 为已有媒体绑定点击事件
    const existingImages = container.querySelectorAll('.chat-image');
    existingImages.forEach(function(img) {
        img.addEventListener('click', function() {
            openMediaViewer(this.src, 'image');
        });
    });
    
    const existingVideos = container.querySelectorAll('.chat-video-wrapper');
    existingVideos.forEach(function(video) {
        video.addEventListener('click', function(e) {
            e.stopPropagation();
            const videoUrl = this.getAttribute('data-video');
            if (videoUrl) {
                openMediaViewer(videoUrl, 'video');
            }
        });
    });
});