//섬네일이미지 파일 변경 상태
let isFileModified = false;  // 파일이 수정되었는지 여부
let isFileDeleted = false;   // 파일이 삭제되었는지 여부
let isFileModified2 = false;  // 파일이 수정되었는지 여부
let isFileDeleted2 = false;   // 파일이 삭제되었는지 여부

/****************************************************************************
 * 메인 배너 조회
 ****************************************************************************/
function fn_selectWebMainBanner(){
    if(true != fn_emptyCheck(muWebMainBannerId)) {
        modalEvent.warning("수정", "메인 배너 정보가 없습니다.");
        return;
    }
    let formData = new FormData();
    formData.append("menuClass", menuClass);
    formData.append("muWebMainBannerId", muWebMainBannerId);

    $.ajax({
        url: encodeURI('/webmainbanner/selectWebMainBanner.do'),
        data: formData,
        dataType: "json",
        processData: false,
        contentType: false,
        type: 'POST',
        async: true,
        success: function(data){
            if('0'==data.msgCode){
                let contentData = data.rows[0];
                let url = contentData.filePath.replace("C:", "");
                let url2 = contentData.filePath2.replace("C:", "");

                $("#bannerType").val(contentData.bannerType);
                $("#bannerType").siblings("button").text(contentData.bannerTypeName);
                $("#title").val(contentData.title);
                $("#url").val(contentData.url);
                $('.img_box').eq(0).append(`<img width="170px" height="100px" src="` + CDN_URL + `${decodeURI(url)}">`)
                $('.img_box').eq(1).append(`<img width="170px" height="170px" src="` + CDN_URL + `${decodeURI(url2)}">`)
            }
            else{
                modalEvent.danger("수정 오류", data.msgDesc);
            }
        },
        error : function(xhr, status, error) {
            modalEvent.danger("수정 오류", "수정 중 오류가 발생하였습니다. 잠시후 다시시도하십시오.");
        },
        beforeSend:function(){

        },
        complete:function(){

        }
    });
}

/****************************************************************************
 * 메인 배너 수정
 ****************************************************************************/
function fn_updateWebMainBanner(){
    if("Y"!=updateUseYn){
        modalEvent.warning("", "수정 권한이 없습니다.");
        return false;
    }

    let bannerType     = $("#bannerType").val();
    let title          = $("#title").val();
    let url            = $("#url").val();
    let file           = $("#file")[0].files[0];
    let file2          = $("#file2")[0].files[0];

    if(true != fn_emptyCheck(bannerType)) {
        modalEvent.warning("등록", "구분 정보를  입력하세요.");
        return;
    }

    if(true != fn_emptyCheck(title)) {
        modalEvent.warning("등록", "제목을 입력하세요.");
        return;
    }

    if(true != fn_emptyCheck(url)) {
        modalEvent.warning("등록", "url을 입력하세요.");
        return;
    }

    if(isFileDeleted||isFileModified){
        if(true != fn_emptyCheck(file)) {
            modalEvent.warning("등록", "모바일용 배너 정보가 없습니다.");
            return;
        }else{
            for(let i=0; i<file.length; i++){
                let fileSize = file[i].size;
                if(fileSize > fn_maxFileSize()){
                    modalEvent.warning("", "파일정보 용량이 50MB를 넘습니다. 업로드가 불가능합니다.");

                    return;
                }
            }
        }
    }

    if(isFileDeleted2||isFileModified2){
        if(true != fn_emptyCheck(file2)) {
            modalEvent.warning("등록", "웹용 배너 정보가 없습니다.");
            return;
        }else{
            for(let i=0; i<file2.length; i++){
                let fileSize = file2[i].size;
                if(fileSize > fn_maxFileSize()){
                    modalEvent.warning("", "파일정보 용량이 50MB를 넘습니다. 업로드가 불가능합니다.");

                    return;
                }
            }
        }
    }
    modalEvent.info("수정", "메인 배너 정보를 수정하시겠습니까?", function(){
        let formData = new FormData();
        formData.append("menuClass", menuClass);
        formData.append("muWebMainBannerId", muWebMainBannerId);
        formData.append("bannerType", bannerType);
        formData.append("title", title);
        formData.append("url", url);
        if(file){
            formData.append("file", file);
        }

        if(file2){
            formData.append("file2", file2);
        }

        $.ajax({
            url: encodeURI('/webmainbanner/updateWebMainBanner.do'),
            data: formData,
            dataType: "json",
            processData: false,
            contentType: false,
            type: 'POST',
            async: true,
            success: function(data){
                if('0'==data.msgCode){
                    modalEvent.success("수정 성공", data.msgDesc, function(){
                        fn_selectListWebMainBannerIntro();
                    });
                }
                else{
                    modalEvent.danger("수정 오류", data.msgDesc);
                }
            },
            error : function(xhr, status, error) {
                modalEvent.danger("수정 오류", "수정 중 오류가 발생하였습니다. 잠시후 다시시도하십시오.");
            },
            beforeSend:function(){

            },
            complete:function(){

            }
        });
    });
}

/****************************************************************************
 * html 에디터 이미지 업로드시
 ****************************************************************************/
function uploadSummernoteImageFileNoticeInsert(files, editor){
    Object.values(files).forEach(file => {
        let formData = new FormData();
        formData.append('menuClass', menuClass);
        formData.append('file', file);
        $.ajax({
            url: encodeURI('/webmainbanner/uploadFile.do'),
            data: formData,
            dataType: "json",
            processData: false,
            contentType: false,
            type: 'POST',
            async: true,
            success: function (data) {
                if ('0' == data.msgCode) {
                    $(editor).summernote('insertImage', data.rows.filePath, function ($image) {
                    });
                }
            },
            error: function (xhr, status, error) {
                modalEvent.danger('오류', '이미지 업로드 중 오류가 발생했습니다.');
            },
            beforeSend: function () {
                // 로딩열기
                $(".loading-image-layer").show();
            },
            complete: function () {
                // 로딩닫기
                $(".loading-image-layer").hide();
            }
        });
    })
}

/****************************************************************************
 * 섬네일 이미지 미리보기
 ****************************************************************************/
function fn_filePreview(){
    const file =  $("#file")[0].files[0];
    if(file){
        $('.img_box').eq(0).html('');
        const reader = new FileReader();

        reader.onload = function (e) {
            // 이미지 요소를 생성하고 미리보기 추가
            const img = document.createElement('img');
            img.src = e.target.result;
            img.style.width = '170px'; // 원하는 크기로 조정
            img.style.height = '100px';
            $('.img_box').eq(0).append(img);
        };

        // 파일을 읽기 시작
        reader.readAsDataURL(file);
    }
}

/****************************************************************************
 * 섬네일 이미지 삭제
 ****************************************************************************/
function fn_removePreview(){
    isFileDeleted = true;
    $("#file").val('');
    $('.img_box').eq(0).html('');
}

/****************************************************************************
 * 섬네일 이미지 미리보기2
 ****************************************************************************/
function fn_filePreview2(){
    const file =  $("#file2")[0].files[0];
    if(file){
        $('.img_box').eq(1).html('');
        const reader = new FileReader();

        reader.onload = function (e) {
            // 이미지 요소를 생성하고 미리보기 추가
            const img = document.createElement('img');
            img.src = e.target.result;
            img.style.width = '170px'; // 원하는 크기로 조정
            img.style.height = '100px';
            $('.img_box').eq(1).append(img);
        };

        // 파일을 읽기 시작
        reader.readAsDataURL(file);
    }
}

/****************************************************************************
 * 섬네일 이미지 삭제2
 ****************************************************************************/
function fn_removePreview2(){
    isFileDeleted2 = true;
    $("#file2").val('');
    $('.img_box').eq(1).html('');
}

/****************************************************************************
 * 리스트 화면으로 이동.
 ****************************************************************************/
function fn_selectListWebMainBannerIntro(){
    if("Y"==selectUseYn){
        let pagingParam = "?menuClass="+menuClass;
        fn_leftFormAction("/webmainbanner/selectListWebMainBannerIntro.do"+pagingParam);
    }else{
        modalEvent.warning("", "조회 권한이 없습니다.");
        return false;
    }
}

/****************************************************************************
 * 페이지 init
 ****************************************************************************/
function fn_pageInit(){
    $('#summernote').summernote({
        height: 540,
        callbacks: {	//여기 부분이 이미지를 첨부하는 부분
            onImageUpload : function(files) {
                uploadSummernoteImageFileNoticeInsert(files, this);
            }
        },
    });
    fn_selectWebMainBanner();
}

/****************************************************************************
 * 페이지 event
 ****************************************************************************/
function fn_pageEvent(){
    // 검색 input
    $('.btnCancle').on("click", function(){
        fn_selectListWebMainBannerIntro();
    });

    $('.btnSave').on("click", function(){
        fn_updateWebMainBanner();
    });
    $('#delete_btn').on("click", function(){
        fn_removePreview();
    });
    $('#file').on('change', function(e) {
        isFileModified = true;
        fn_filePreview();
    })
    $('#delete_btn2').on("click", function(){
        fn_removePreview2();
    });
    $('#file2').on('change', function(e) {
        isFileModified2 = true;
        fn_filePreview2();
    })
    const categoryTarget = $("#bannerType").siblings("ul.select_option_list");
    categoryTarget.find("li.option_list_item").click(function () {
        let selectIdArr = $(this).prop("id").split('_');
        let selectId    = selectIdArr[1];
        let selectName  = $(this).text();
        if(selectId.match("ALL")){
            selectId = '';
        }
        $(this).parent().siblings("button").text(selectName);
        $(this).parent().siblings("input").val(selectId);
    });
}

$(function(){
    // 페이지 init
    fn_pageInit();

    // 페이지 event
    fn_pageEvent();
});