const mobMenuBtn = document.querySelector(".mob-menu");
mobMenuBtn.addEventListener("click", function () {
    document.body.classList.toggle("menuOpen");
});

const moveTop = document.querySelector(".moveTop");
window.addEventListener('scroll', function(){
    if(window.pageYOffset > 30){
        moveTop.classList.add('show');
    } else{
        moveTop.classList.remove('show');
    }
});

//Á¦Ç° À̹ÌÁö Ŭ¸¯Çؼ­ Å©°Ôº¸±â
const prdShow = document.querySelector(".elem-img > img");
const prdImgs = document.querySelector(".elem-imgList");
if (prdImgs) {
    for (let i = 0; i < prdImgs.children.length; i++) {
        prdImgs.children[i].addEventListener("click", function () {
            prdShow.src = this.children[0].src;
            // prdImgSet(prdShow);
        });
    }
}

//µµ¸é Ŭ¸¯Çؼ­ Å©°Ôº¸±â
const blueprint = document.querySelector(".ed-blueprint");
if(blueprint){
    const bpImg = blueprint.children[0].children[0].src;
    blueprint.innerHTML += "<div class='bpPopup'><div class='bpImg'><img src='"+ bpImg +"'/></div></div>";
    blueprint.addEventListener('click', function(){
        document.querySelector(".bpPopup").classList.toggle("bpPopupShow");
    });
}

//Á¦Ç° ¸®½ºÆ® È­¸éÅ©±â¿¡ ¸ÂÃß±â
const listImgs = document.querySelectorAll('#product1 .product1-list .prd-img img');
function listImgSet(){
    for (let i = 0; i < listImgs.length; i++){
        if(listImgs[i].offsetWidth >= listImgs[i].offsetHeight * 1.4){
            listImgs[i].style.width = "100%";
            listImgs[i].style.height = "auto";
        }else{
            listImgs[i].style.width = "auto";
            listImgs[i].style.height = "100%";
        }
    }
}

    listImgSet();


//Á¦Ç° ÇÏÀ§¸Þ´º Ãß°¡
const prdA = document.querySelector(".header-packing");
const prdB = document.querySelector(".header-machine");
const switches = document.querySelector(".switches");
let switchDepth;
function makeDepth(listnum, listname){
    for(let i = 0; i < listname.length; i++){
        if(listname[i].posY){
            switchDepth[listnum].innerHTML += "<li><a href='../prd" + listname[i].url +".php" + listname[i].posY + "'>"+ listname[i].name + "</a></li>"
        } else {
            switchDepth[listnum].innerHTML += "<li><a href='../prd" + listname[i].url +".php'>"+ listname[i].name + "</a></li>"
        }
    }
}
if(prdA || prdB){
    for (let i = 0; i < switches.children.length; i++){
        switches.children[i].innerHTML += "<ul class='switchDepth'></ul>"
        switchDepth = document.querySelectorAll(".switchDepth");
    }
}
if(prdA){
    const prdBand = [
        {
            url: "1_band/prd1_band_a",
            name: "P.P BAND",
        },
        {
            url: "1_band/prd1_band_b",
            name: "PET BAND",
        },
        {
            url: "1_band/prd1_band_d",
            name: "Äڵ彺Ʈ·¦",
        },
        {
            url: "1_band/prd1_band_c",
            name: "STEEL BAND",
        },
        {
            url: "1_band/prd1_band_e",
            name: "Æú¸®¹êµå & ¼ÒÇÁÆ®¹êµå",
        },
    ];
    const prdTape = [
        {
            url: "1_tape/prd1_tape_a",
            name: "OPP TAPE",
        }, 
        {
            url: "1_tape/prd1_tape_b",
            name: "º¸È£¿ë Å×ÀÌÇÁ",
        },
        {
            url: "1_tape/prd1_tape_d",
            name: "¹°Å×ÀÌÇÁ",
            posY: "#prd1",
        },
        {
            url: "1_tape/prd1_tape_d",
            name: "Å©¶óÇÁÆ® Å×ÀÌÇÁ",
            posY: "#prd2",
        },
        {
            url: "1_tape/prd1_tape_c",
            name: "³»¿­ Å×ÀÌÇÁ",
            posY: "#prd1",
        },
        {
            url: "1_tape/prd1_tape_c",
            name: "¾ç¸é Å×ÀÌÇÁ",
            posY: "#prd2",
        },
        {
            url: "1_tape/prd1_tape_c",
            name: "¹Ù´Ú¶óÀÎ Å×ÀÌÇÁ",
            posY: "#prd3",
        },
        {
            url: "1_tape/prd1_tape_c",
            name: "¸¶½ºÅ· Å×ÀÌÇÁ",
            posY: "#prd4",
        },
        {
            url: "1_tape/prd1_tape_c",
            name: "Çʶó¸àÆ® Å×ÀÌÇÁ",
            posY: "#prd5",
        },
    ];
    const prdFilm = [
        {
            url: "1_film/prd1_film_a",
            name: "½ºÆ®·¹Ä¡ ·¦",
        }, 
        {
            url: "1_film/prd1_film_b",
            name: "Çʸ§",
        },
    ];
    const prdBuffer = [
        {
            url: "1_buffer/prd1_buffer_a",
            name: "¿¡¾îĸ",
        }, 
        {
            url: "1_buffer/prd1_buffer_b",
            name: "PEÆû",
        },
        {
            url: "1_buffer/prd1_buffer_c",
            name: "½ºÆùÁö(PUÆû)",
        },
        {
            url: "1_buffer/prd1_buffer_d",
            name: "ÄÁÅ×ÀÌ³Ê ¿¡¾î¹é",
        },
    ];
    const prdMaterial = [
        {
            url: "1_material/prd1_material_a",
            name: "Àå°©",
        }, 
        {
            url: "1_material/prd1_material_b",
            name: "À±È°Á¦",
        },
        {
            url: "1_material/prd1_material_c",
            name: "Á¾À̾ޱÛ",
        },
        {
            url: "1_material/prd1_material_d",
            name: "Äڳʰ¢´ë",
        },
        {
            url: "1_material/prd1_material_e",
            name: "¹æ½ÀÁ¦",
        }, 
        {
            url: "1_material/prd1_material_g",
            name: "ÇÖ¸áÆ®",
        },
        {
            url: "1_material/prd1_material_h",
            name: "À×Å©Á¬ À×Å©",
        },
        {
            url: "1_material/prd1_material_j",
            name: "±âŸ",
        },
    ];
    const prdEtc = [
        {
            url: "1_etc/prd1_etc_a",
            name: "´ÜÇÁ¶ó",
        }, 
        {
            url: "1_etc/prd1_etc_b",
            name: "¸ñÀç·ù",
        },
        {
            url: "1_etc/prd1_etc_c",
            name: "½½¸³½ÃÆ®",
        },
    ];
    makeDepth(0, prdBand);
    makeDepth(1, prdTape);
    makeDepth(2, prdFilm);
    makeDepth(3, prdBuffer);
    makeDepth(4, prdMaterial);
    makeDepth(5, prdEtc);
}
if(prdB){
    const prdBanding = [
        {
            url: "2_banding/prd2_banding_a",
            name: "ÀÚµ¿ ¹êµù±â",
        },
        {
            url: "2_banding/prd2_banding_b",
            name: "¹«ÀÎÀüÀÚµ¿ ¹êµù±â",
        },
        {
            url: "2_banding/prd2_banding_c",
            name: "ÀüÀÚµ¿ ¼öÆò °á¼Ó±â",
        },
        {
            url: "2_banding/prd2_banding_d",
            name: "¾ÆÄ¡ °³ÆóÇü ¼öÁ÷ °á¼Ó±â",
        },
        {
            url: "2_banding/prd2_banding_e",
            name: "¹ÝÀÚµ¿ ¹êµù±â",
        },
        {
            url: "2_banding/prd2_banding_f",
            name: "¿¡¾îÅø",
        },
        {
            url: "2_banding/prd2_banding_g",
            name: "PE°á¼Ó±â",
        },
        {
            url: "2_banding/prd2_banding_h",
            name: "ÆÄ·¿Æ® ¹êµù±â",
        },
    ];
    const prdTaping = [
        {
            url: "2_taping/prd2_taping_a",
            name: "ÀÚµ¿Å×Çαâ(ÀϹÝÇü)",
        }, 
        {
            url: "2_taping/prd2_taping_b",
            name: "ÀÚµ¿Å×Çαâ(Ư¼öÇü)",
        },
        {
            url: "2_taping/prd2_taping_c",
            name: "¹ÝÀÚµ¿Å×Çαâ(ÀϹÝÇü)",
        },
        {
            url: "2_taping/prd2_taping_d",
            name: "¹ÝÀÚµ¿Å×Çαâ(2ÇìµåÇü)",
        },
        {
            url: "2_taping/prd2_taping_e",
            name: "¹ÝÀÚµ¿Å×Çαâ(»óÇϺ§Æ®Çü)",
        },
        {
            url: "2_taping/prd2_taping_f",
            name: "¹ÝÀÚµ¿Å×Çαâ(Á¢ÁöÇü)",
        },
        {
            url: "2_taping/prd2_taping_g",
            name: "ÀÚµ¿Å×Çαâ(ÇϺÎÇìµå¿ÀÇÂÇü)",
        },
        {
            url: "2_taping/prd2_taping_h",
            name: "HÇü Å×Çαâ",
        },
        {
            url: "2_taping/prd2_taping_i",
            name: "Ãø¸é Å×Çαâ",
        },
        {
            url: "2_taping/prd2_taping_j",
            name: "ÀüÀÚµ¿ ·£´ý Å×Çαâ",
        },
        {
            url: "2_taping/prd2_taping_k",
            name: "°í¼Ó ÀüÀÚµ¿ ·£´ý Å×Çαâ",
        },        {
            url: "2_taping/prd2_taping_l",
            name: "·£´ý Ãø¸é Å×Çαâ",
        },
        {
            url: "2_taping/prd2_taping_m",
            name: "¹ÝÀÚµ¿ ·£´ý Å×Çαâ",
        },
        {
            url: "2_taping/prd2_taping_n",
            name: "ÀÚµ¿ Á¦ÇÔ±â",
        },
        {
            url: "2_taping/prd2_taping_o",
            name: "¹ÝÀÚµ¿ ·£´ý Á¦ÇÔ ÀÏüÇü Å×Çαâ",
        },
        {
            url: "2_taping/prd2_taping_p",
            name: "¹ÝÀÚµ¿ Á¦ÇÔ ÀÏüÇü Å×Çαâ",
        },
    ];
    const prdRamming = [
        {
            url: "2_ramming/prd2_ramming_a",
            name: "¹ÝÀÚµ¿ ·¦Çαâ",
        },
        {
            url: "2_ramming/prd2_ramming_b",
            name: "ÀüÀÚµ¿ ·¦Çαâ",
        },
        {
            url: "2_ramming/prd2_ramming_c",
            name: "À̵¿½Ä ·Îº¿ ·¦Çαâ",
        },
        {
            url: "2_ramming/prd2_ramming_d",
            name: "ÈÄµå ·¦Çαâ",
        },
        {
            url: "2_ramming/prd2_ramming_e",
            name: "»ï¸é ½Ç¸µ±â",
        },
    ];
    const prdConveyor = [
        {
            url: "2_conveyor/prd2_conveyor_a",
            name: "ÀÚÀ¯Çü ÈÄ·º½Ãºí ÄÁº£À̾î",
        },
        {
            url: "2_conveyor/prd2_conveyor_b",
            name: "±¸µ¿ ÈÄ·º½Ãºí ÄÁº£À̾î",
        },
        {
            url: "2_conveyor/prd2_conveyor_c",
            name: "Ä«Æê ÄÁº£À̾î",
        },
        {
            url: "2_conveyor/prd2_conveyor_d",
            name: "»ç´Ù¸®Çü ÄÁº£À̾î",
        },
        {
            url: "2_conveyor/prd2_conveyor_e",
            name: "º§Æ® ÄÁº£À̾î",
        },
        {
            url: "2_conveyor/prd2_conveyor_f",
            name: "±¸µ¿·Ñ·¯ ÄÁº£À̾î",
        },
        {
            url: "2_conveyor/prd2_conveyor_i",
            name: "»óÇÏÂ÷ ÄÁº£À̾î",
        },
        {
            url: "2_conveyor/prd2_conveyor_j",
            name: "ÇÁ¸®·Ñ·¯ ÄÁº£À̾î",
        },
    ];
    const prdEtc = [
        {
            url: "2_etc/prd2_etc_a",
            name: "À×Å©Á¬ ¸¶Å·±â",
        },
    ];
    makeDepth(0, prdBanding);
    makeDepth(1, prdTaping);
    makeDepth(2, prdRamming);
    makeDepth(3, prdConveyor);
    makeDepth(4, prdEtc);
}