document.addEventListener('DOMContentLoaded', function() {
    
    // 1. 탭 메뉴 필터링 기능
    const filterButtons = document.querySelectorAll('.filter-menu .btn');
    const portfolioItems = document.querySelectorAll('.portfolio-container .item');

    filterButtons.forEach(button => {
        button.addEventListener('click', () => {
            filterButtons.forEach(btn => btn.classList.remove('active'));
            button.classList.add('active');

            const filterValue = button.getAttribute('data-filter');

            portfolioItems.forEach(item => {
                if (filterValue === 'all') {
                    item.style.display = 'block';
                } else {
                    if (item.classList.contains(filterValue)) {
                        item.style.display = 'block';
                    } else {
                        item.style.display = 'none';
                    }
                }
            });
        });
    });
});

// 2. 모달 팝업 기능
const modal = document.getElementById("myModal");
const modalImg = document.getElementById("modalImg");
const modalVideoWrap = document.getElementById("modalVideoWrap");
const modalVideoIframe = document.getElementById("modalVideoIframe");

function openModal(element) {
    const dataType = element.getAttribute('data-type');

    modal.style.display = "flex";

    if (dataType === 'video') {
        const videoId = element.getAttribute('data-video-id');
        modalImg.style.display = "none";
        modalVideoWrap.style.display = "block";
        
        // [수정됨] autoplay=0 으로 설정하여 자동 재생 끔
        if (videoId) {
            modalVideoIframe.src = `https://www.youtube.com/embed/${videoId}?autoplay=0&rel=0`;
        }
    } else {
        const imgSrc = element.querySelector('img').src;
        modalVideoWrap.style.display = "none";
        modalImg.style.display = "block";
        modalImg.src = imgSrc;
        
        modalVideoIframe.src = "";
    }
}

function closeModal() {
    modal.style.display = "none";
    // 닫을 때 영상 소스 초기화 (소리 중단)
    modalVideoIframe.src = "";
}

window.onclick = function(event) {
    if (event.target == modal) {
        closeModal();
    }
}