(() => { // webpackBootstrap
    var __webpack_exports__ = {};
    (() => {
        const { pageHelper, EventManager, utils } = ShopbySkin;

        const articleWriteFormLayerModalHelper = pageHelper.articleWriteFormLayerModalHelper();
        articleWriteFormLayerModalHelper.initialize({
            layerModalHelperKey: 'article-write-form',
        });

        const boardNo = '277061';

        const getCapchaKey = () => {
            return (new Date()).getTime().toString();
        };

        const getCapchaImage = async (key) => {
            const res = await fetch(`https://shop-api.shopby.co.kr/captcha/image?key=${key}`, {
                method: 'GET',
                headers: {
                    'Content-Type': 'application/json',
                    Version: '1.0',
                    clientId: '99ZDpWfrizZV8irrjPvB8w==',
                    platform: 'PC',
                    language: 'ko',
                },
            }).then((res) => res.json());

            return res.url;
        };

        const verifyCapcha = async (key, code) => {
            const res = await fetch(`https://shop-api.shopby.co.kr/captcha/verify?key=${key}&code=${code}`, {
                method: 'POST',
                headers: {
                    'Content-Type': 'application/json',
                    Version: '1.0',
                    clientId: '99ZDpWfrizZV8irrjPvB8w==',
                    platform: 'PC',
                    language: 'ko',
                },
            });

            return ( res.status === 204 || res.status === 200 );
        };

        const refreshCapcha = async () => {
            const key = getCapchaKey();
            getCapchaImage(key).then((url) => {
                document.querySelector('.captcha_key').value = key;
                document.querySelector('.captcha_image').src = url;
                document.querySelector('.captcha_image').style.visibility = '';
                document.querySelector('.captcha_code').value = '';
            });
        }

        const getFormData = (formElement) => {
            const formData = new FormData(formElement);

            return {
                inquiryType: formData.get('inquiryType'),
                companyName: formData.get('companyName'),
                managerName: formData.get('managerName'),
                productKind: formData.get('productKind'),
                tel: formData.get('tel') + '-' + formData.getAll('tel[]').join('-').trim(),
                email: formData.getAll('email[]').join('@').trim(),
                title: formData.get('title'),
                content: formData.get('content').replaceAll(/\n/g, '<br>'),
                agreement: formData.get('agreement'),
            }
        }

        const checkInvalidPostForm = async (data) => {
            if (!data.inquiryType) {
                return { message: '문의구분을 선택해주세요.', invalid: true };
            }

            if (!data.companyName) {
                return { message: '업체명을 입력해주세요.', invalid: true };
            }

            if (!data.managerName) {
                return { message: '담당자명을 입력해주세요.', invalid: true };
            }

            if (!data.productKind) {
                return { message: '문의 제품을 입력해주세요.', invalid: true };
            }

            if (!data.tel) {
                return { message: '연락처를 입력해주세요.', invalid: true };
            }

            if (!/^(01[0-9]{1}-?[0-9]{4}-?[0-9]{4})$/.test(data.tel)) {
                return { message: '연락처 형식이 맞지 안습니다.', invalid: true };
            }

            if ('@' == data.email) {
                return { message: '이메일을 입력해주세요.', invalid: true };
            }

            if (!/^[A-Za-z0-9_\.\-]+@[A-Za-z0-9\-]+\.[A-Za-z0-9\-]+/.test(data.email)) {
                return { message: '이메일 형식이 맞지 않습니다.', invalid: true };
            }

            if (!data.title) {
                return { message: '제목을 입력해주세요.', invalid: true };
            }

            if (!data.content) {
                return { message: '내용을 입력해주세요.', invalid: true };
            }

            const captchaKey = document.querySelector('.captcha_key').value;
            const captchaCode = document.querySelector('.captcha_code').value;
            const isCaptchaVerified = await verifyCapcha(captchaKey, captchaCode);

            if (!isCaptchaVerified) {
                return { message: '자동입력 방지 문자를 정확히 입력해주세요.', invalid: true };
            }

            if ('on' != data.agreement) {
                return { message: '개인정보 수집 및 이용에 동의해주세요.', invalid: true };
            }

            return { message: '', invalid: false };
        };

        const filesUpload = async (files) => {
            const result = [];

            try {
                if ( true === files[0].type.startsWith('image') ) {
                    await utils.postImages({
                        files: files,
                    }).then((res)=>{
                        res.data.forEach((file) => {
                            result.push({
                                originalFileName: file.value.originName,
                                uploadedFileName: file.value.imageUrl
                            });
                        });
                    });
                }
                else {
                    await utils.postFiles({
                        files: files,
                    }).then((res)=>{
                        res.data.forEach((file) => {
                            result.push(file.value);
                        });
                    });
                }
            }
            catch(e) {
                console.log(e);
            }

            return result;
        }

        const savePost = async (data) => {
            const combinedContents
                 = '문의구분: ' + data.inquiryType + '<br/>'
                 + '업 체 명: ' + data.companyName + '<br/>'
                 + '담당자명: ' + data.managerName + '<br/>'
                 + '문의제품: ' + data.productKind + '<br/>'
                 + '연 락 처: ' + data.tel         + '<br/>'
                 + '이 메 일: ' + data.email       + '<br/>'
                 + '문의내용: ' + '<br/>'
                 + data.content + '<br/>'
                 ;

            const files = await filesUpload(document.querySelector('.upload_hidden').files);

            const { isSuccess } = await articleWriteFormLayerModalHelper.saveArticle({
                articleNo: null,
                boardNo: boardNo,
                articleTitle: data.title,
                articleContent: combinedContents,
                guestName: data.managerName,
                password: '1111',
                secreted: false,
                images: files,
                isModify: false,
            });

            if (isSuccess) {
                EventManager.fire('MODAL_ALERT_OPEN', {
                    noticeType: 'SUCCESS',
                    message: '<em>문의 접수가 완료 되었습니다.<br/>확인 후 연락 드리겠습니다.</em>',
                    onClose: () => {
                        EventManager.fire('CLOSE_TITLE_MODAL');
                        window.location.href = '/index.html';
                    },
                });
            }
        }

        document.querySelector('.btn_inquiry').addEventListener('click', async (event) => {
            try {
                const formElement = document.forms['formContactUs'];
                const data = getFormData(formElement);
                const { message, invalid } = await checkInvalidPostForm(data);

                if (invalid) {
                    console.log('invalid:', message);
                    EventManager.fire('MODAL_ALERT_OPEN', {
                        noticeType: 'WARNING',
                        message: `<em>${message}</em>`,
                    });

                    return;
                }

                await savePost(data);
            }
            catch (e) {
                console.log(e);
                /*
                EventManager.fire('MODAL_ALERT_OPEN', {
                    message: e.error.description ?? e.description,
                });
                */
            }
        });

        document.querySelectorAll('[name="tel[]"]').forEach((item)=>{
            item.addEventListener('input', (event)=>{
                item.value = item.value.replace(/[^0-9]/g, '');

                if (item.value.length > 4) {
                    item.value = item.value.slice(0, 4);
                }
            });
        });

        document.querySelector('.btn_captcha_refresh').addEventListener('click', async (event) => {
            refreshCapcha();
        });

        EventManager.on('PAGE_LOAD_COMPLETED', (data) => {
            refreshCapcha();
        });
    })();
})();


// 240610 서주원 - 이메일
const emailSelect = document.querySelector('.email_select');
const emailDomainInput = document.querySelector('.e-domain');

emailSelect.addEventListener('change', function () {
    if (this.value === '') {
        emailDomainInput.value = '';
        emailDomainInput.removeAttribute('readonly');
    } else {
        emailDomainInput.value = this.value;
        emailDomainInput.setAttribute('readonly', true);
    }
});

// 240610 서주원 - 파일업로드
var fileTargets = document.querySelectorAll('.area_filebox .upload_hidden');

fileTargets.forEach(function(fileTarget) {
    fileTarget.addEventListener('change', function() {
        let maxSize  = 5 * 1024 * 1024; //* 5MB 사이즈 제한
        let fileSize = this.files[0].size; //업로드한 파일용량
    
        if(fileSize > maxSize){
            openAlertModal("파일첨부 사이즈는 5MB 이내로 가능합니다.");
            this.value = ''; //업로드한 파일 제거
            return; 
        }

        var filename;
        if (window.FileReader) {
            filename = this.files[0].name;
        } else {
            filename = this.value.split('/').pop().split('\\').pop();
        }

        var sibling = this.parentElement.querySelector('.upload_name');
        if (sibling) {
            sibling.value = filename;
        }
    });
});