// 신구대비 버튼 하단영역 노출
window.onload = () => {
    const bottomUpLinks = document.querySelectorAll('.buttom-up');
    const closeBtn = document.querySelector('.win-bottom-body-close');
    const winBodyWps = document.querySelector('.win-body-wp');
    const widBottomBodyWp = document.querySelector('.wid-bottom-body-wp');
    const moveArea = document.querySelector('#moveSc');

    bottomUpLinks.forEach((link) => {
        link.addEventListener("click", (event) => {
            event.preventDefault();

            if (widBottomBodyWp.style.display === 'none' || widBottomBodyWp.style.display === '') {
                widBottomBodyWp.style.display = 'block';
                winBodyWps.style.height = '48%';
            } 
        });
    });

    closeBtn.addEventListener("click", (e) => {
        widBottomBodyWp.style.display = 'none';

        winBodyWps.style.height = '96%';
           
    });
};









// select box 1
$("#select-placeholder").click(function () {
    event.stopPropagation();
    if ($("#select-list").css("opacity") === "1") {
        $("#select-list").css("opacity", "0");
        $("#select-list").css("visibility", "hidden");
    } else {
        $("#select-list").css("opacity", "1");
        $("#select-list").css("visibility", "visible");
    }
    $("#select-item").toggleClass('rotation-active');
    $("#select-placeholder").toggleClass("select-placeholder-active");
})

$('body').click(function () {
    $("#select-list").css("opacity", "0");
    $("#select-list").css("visibility", "hidden");
    $("#select-item").removeClass('rotation-active');
    $("#select-placeholder").removeClass('select-placeholder-active');
})

$(".flag").click(function (event) {
    var selectedLi;
    console.log(event)
    selectedLi = event.target.id;
    var texty = $("#" + selectedLi).text()
    $("#select-item").text(texty);
})


// select box 2
$("#select-placeholder2").click(function () {
    event.stopPropagation();
    if ($("#select-list2").css("opacity") === "1") {
        $("#select-list2").css("opacity", "0");
        $("#select-list2").css("visibility", "hidden");
    } else {
        $("#select-list2").css("opacity", "1");
        $("#select-list2").css("visibility", "visible");
    }
    $("#select-item2").toggleClass('rotation-active');
    $("#select-placeholder2").toggleClass("select-placeholder-active");
})

$('body').click(function () {
    $("#select-list2").css("opacity", "0");
    $("#select-list2").css("visibility", "hidden");
    $("#select-item2").removeClass('rotation-active');
    $("#select-placeholder2").removeClass('select-placeholder-active');
})

$(".flag").click(function (event) {
    var selectedLi;
    console.log(event)
    selectedLi = event.target.id;
    var texty = $("#" + selectedLi).text()
    $("#select-item2").text(texty);
})


// select box 3
$("#select-placeholder3").click(function () {
    event.stopPropagation();
    if ($("#select-list3").css("opacity") === "1") {
        $("#select-list3").css("opacity", "0");
        $("#select-list3").css("visibility", "hidden");
    } else {
        $("#select-list3").css("opacity", "1");
        $("#select-list3").css("visibility", "visible");
    }
    $("#select-item3").toggleClass('rotation-active');
    $("#select-placeholder3").toggleClass("select-placeholder-active");
})

$('body').click(function () {
    $("#select-list3").css("opacity", "0");
    $("#select-list3").css("visibility", "hidden");
    $("#select-item3").removeClass('rotation-active');
    $("#select-placeholder3").removeClass('select-placeholder-active');
})

$(".flag").click(function (event) {
    var selectedLi;
    console.log(event)
    selectedLi = event.target.id;
    var texty = $("#" + selectedLi).text()
    $("#select-item3").text(texty);
})