var getUrl = window.location;
var baseHost = getUrl.protocol + "//" + getUrl.host + "/";
var baseUrl = baseHost + getUrl.pathname.split('/')[1];
var prefix_folder_admin = '';
let is_online;
const toastLiveExample = document.getElementById('liveToast')
const toast = new bootstrap.Toast(toastLiveExample)
let deg = 0;
let csrfHash = $("meta[name=X-CSRF-TOKEN]").attr('content');
let prodi_use;
const local_date = new Date();

$(document).ready(function () {

    $(".pc-hasmenu.active").children().eq(1).attr('style', 'display: block; box-sizing: border-box;');

    $(".placeholder").removeClass('placeholder');
    $('.horizontal-mainwrapper').show();

    var path_current = getUrl.origin + getUrl.pathname;
    // console.log(path_current);
    $("a[data-url='" + path_current + "']").addClass('active');
    // main-parent-menu
    $("a[data-url='" + path_current + "']").closest('.main-parent-menu').addClass('collapsed');

    $("select.js-select2").each(function (index, element) {
        $(element).select2({
            theme: 'bootstrap-5',
            placeholder: $(element).data("placeholder"),
            dropdownParent: $($(element).parent()),
            width: '100%',
            allowClear: $(element).data("allowclear")
        });

        if ($(element).data('disable')) {
            $(element).prop('disabled', true)
        }
    });

    $('.modal').each(function (index, element) {
        $(element).attr('data-keyboard', false).attr('data-backdrop', 'static');
    });

    $('.trumbowyg-js').each(function () {
        $(this).trumbowyg({
            autogrow: true,
            disabled: $(this).data('trumbowyg-disable') !== undefined ? $(this).data('trumbowyg-disable') : false,
            // btns: ['upload'],
            // plugins: {
            //     upload: {
            //         serverPath: 'https://api.imgur.com/3/image',
            //         fileFieldName: 'image',
            //         headers: {
            //             'Authorization': 'Client-ID xxxxxxxxxxxx'
            //         },
            //         urlPropertyName: 'data.link'
            //     }
            // }
        });
    });

    $(".datepicer-js").datepicker({
        format: "dd/mm/yyyy",
        autoclose: true,
        orientation: "auto",
        todayHighlight: true
    });
    $(".datepicer-js").attr('readonly', true);

    $(".datepicer-year-js").datepicker({
        format: "yyyy",
        autoclose: true,
        minViewMode: 2,
        maxViewMode: 2,
        todayHighlight: true,
        orientation: "bottom auto"
    });
    $(".datepicer-year-js").attr('readonly', true);

    $.ajaxSetup({
        headers: {
            'X-CSRF-TOKEN': csrfHash // Mengirim token CSRF dalam header
        },
    });

    $(document).ajaxSuccess(function (event, xhr, settings) {
        const responseData = JSON.parse(xhr.responseText);
        if (responseData.is_login != undefined && responseData.is_login == false) {
            console.log('Unauthorized');
            toast.hide()
            window.location.reload();
            return;
        }
    });

    $(".select-checkbox-all").change(function (e) {
        e.preventDefault();
        let this_table = $(this).data('table');

        if ($(this).prop('checked') === true) {
            $('.dt-select-checkbox').prop('checked', true);
            $("#" + this_table).DataTable().rows().select();
        } else {
            $('.dt-select-checkbox').prop('checked', false);
            $("#" + this_table).DataTable().rows().deselect();
        }
    });

    tinymce_define();
    datepickera();

    $('.tom-select').each(function (index, element) {
        let settings = {
            plugins: {
                'clear_button': {
                    'title': 'Remove all selected options',
                }
            },
        };
        new TomSelect(element, settings);
    });
});

function get_csrf() {
    return $("meta[name=X-CSRF-TOKEN]").attr('content');
}

function update_csrf(newToken) {
    $("meta[name=X-CSRF-TOKEN]").attr('content', newToken)
}

function datepickera() {
    document.querySelectorAll('.datepickera').forEach((el) => {
        let settings = {
            element: "#datepicker",
            css: [
                "https://cdn.jsdelivr.net/npm/@easepick/bundle@1.2.1/dist/index.css"
            ],
            format: 'YYYY-MM-DD',
            zIndex: 9999,
            AmpPlugin: {
                dropdown: {
                    months: true,
                    years: true
                },
                resetButton: true
            },
            plugins: [
                "AmpPlugin",
                "LockPlugin",
                "TimePlugin"
            ]
        };

        new easepick.create(settings);
    });
}

function easepicker_period(id1, id2, buttonPosition = 'default') {
    const picker = new easepick.create({
        element: document.getElementById(id1),
        css: [
            'https://cdn.jsdelivr.net/npm/@easepick/bundle@1.2.1/dist/index.css',
            `${baseHost}assets/themes/back/libs/easepick/custom.css?v=${Math.random()}`
        ],
        plugins: ['RangePlugin', 'TimePlugin'],
        RangePlugin: {
            elementEnd: document.getElementById(id2),
        },
        zIndex: 9999,
        TimePlugin: {
            format: 'HH:mm',
            showSeconds: false,
            show24hrs: true,
        },
        format: 'DD MMMM YYYY HH:mm',
        lang: 'en-US',
    });

    // Create the clear button
    const clearButton = document.createElement('button');
    clearButton.innerText = 'Clear';
    clearButton.classList.add('btn', 'btn-outline-secondary');

    clearButton.addEventListener('click', (evt) => {
        evt.preventDefault();
        document.getElementById(id1).value = '';
        document.getElementById(id2).value = '';
        picker.clear();
    });

    // Append the clear button to the DOM based on buttonPosition
    if (buttonPosition === 'input-group') {
        const inputGroup = document.createElement('div');
        inputGroup.classList.add('input-group');
        document.getElementById(id2).parentNode.insertBefore(inputGroup, document.getElementById(id2));
        inputGroup.appendChild(document.getElementById(id2));
        inputGroup.appendChild(clearButton);
    } else {
        const div = document.createElement('div');
        div.classList.add('text-end', 'mt-2');
        div.appendChild(clearButton);
        document.getElementById(id2).parentNode.appendChild(div);
    }

    // Optional: listen to custom 'clear' events
    document.getElementById(id1).addEventListener('clear', () => picker.clear());
    document.getElementById(id2).addEventListener('clear', () => picker.clear());
}

function litepicker_period(id1, id2, buttonPosition = 'default') {
    const picker = new Litepicker({
        element: document.getElementById(id1),
        elementEnd: document.getElementById(id2),
        singleMode: false,
        highlightedDays: [local_date.getFullYear() + '-'
            + String(local_date.getMonth() + 1).padStart(2, '0') + '-'
            + String(local_date.getDate()).padStart(2, '0')],
        allowRepick: true,
        format: 'DD MMMM YYYY',
    });

    // Create the clear button
    const clearButton = document.createElement('button');
    clearButton.innerText = 'Clear';
    clearButton.classList.add('btn', 'btn-outline-secondary');

    // Add event listener to clear the Litepicker selection
    clearButton.addEventListener('click', (evt) => {
        evt.preventDefault();
        document.getElementById(id1).value = '';
        document.getElementById(id2).value = '';
        picker.clearSelection();
    });

    // Append the clear button to the DOM based on buttonPosition
    if (buttonPosition === 'input-group') {
        const inputGroup = document.createElement('div');
        inputGroup.classList.add('input-group');
        document.getElementById(id2).parentNode.insertBefore(inputGroup, document.getElementById(id2));
        inputGroup.appendChild(document.getElementById(id2));
        inputGroup.appendChild(clearButton);
    } else {
        const div = document.createElement('div');
        div.classList.add('text-end', 'mt-2');
        div.appendChild(clearButton);
        document.getElementById(id2).parentNode.appendChild(div);
    }

    document.getElementById(id1).addEventListener('clear', () => {
        picker.clearSelection();
    });

    document.getElementById(id2).addEventListener('clear', () => {
        picker.clearSelection();
    });
}

// Prevent Bootstrap dialog from blocking focusin
document.addEventListener('focusin', (e) => {
    if (e.target.closest(".tox-tinymce-aux, .moxman-window, .tam-assetmanager-root") !== null) {
        e.stopImmediatePropagation();
    }
});

function tinymce_define(
    selector = '.tinymce-custom',
    front_cms = false,
    // maxheight = 0,
    plugins = [
        'advlist', 'autolink', 'lists', 'link', 'image', 'charmap', 'preview',
        'anchor', 'searchreplace', 'visualblocks', 'code', 'fullscreen',
        'insertdatetime', 'media', 'table', 'help', 'wordcount', 'code',
        'autoresize', 'textcolor', 'link'
    ],
    toolbar = 'undo redo | blocks | image ' +
        'bold italic backcolor forecolor link | alignleft aligncenter ' +
        'alignright alignjustify | bullist numlist outdent indent | ' +
        'table tabledelete | tableprops tablerowprops tablecellprops | tableinsertrowbefore tableinsertrowafter tabledeleterow | tableinsertcolbefore tableinsertcolafter tabledeletecol' +
        'removeformat | code | help'
) {
    let options = {
        selector: selector,
        // height: height,
        menubar: false,
        plugins: 'table',
        statusbar: false,
        plugins: plugins,
        toolbar: toolbar,
        valid_elements: '*[*]',
        content_style:
            'body { font-family: -apple-system, BlinkMacSystemFont, San Francisco, Segoe UI, Roboto, Helvetica Neue, sans-serif; font-size: 14px; -webkit-font-smoothing: antialiased; }'
        ,
        /* enable title field in the Image dialog*/
        image_title: true,
        /* enable automatic uploads of images represented by blob or data URIs*/
        automatic_uploads: true,
        /*
          URL of our upload handler (for more details check: https://www.tiny.cloud/docs/configure/file-image-upload/#images_upload_url)
          images_upload_url: 'postAcceptor.php',
          here we add custom filepicker only to Image dialog
        */
        file_picker_types: 'image',
        images_upload_url: baseUrl + '/template/tinymce',
        /* and here's our custom image picker*/
        file_picker_callback: (cb, value, meta) => {
            const input = document.createElement('input');
            input.setAttribute('type', 'file');
            input.setAttribute('accept', 'image/*');

            input.addEventListener('change', (e) => {
                const file = e.target.files[0];

                const formData = new FormData();
                formData.append('file', file);

                fetch(baseUrl + '/template/tinymce', {
                    method: 'POST',
                    body: formData,
                })
                    .then(response => response.json())
                    .then(data => {
                        if (data && data.location) {
                            cb(data.location, { title: file.name });
                        } else {
                            failure('Invalid JSON: ' + JSON.stringify(data));
                        }
                    })
                    .catch(error => {
                        failure('Image upload failed: ' + error.message);
                    });

                const reader = new FileReader();
                reader.addEventListener('load', (d) => {

                    /*
                      Note: Now we need to register the blob in TinyMCEs image blob
                      registry. In the next release this part hopefully won't be
                      necessary, as we are looking to handle it internally.
                    */
                    const id = 'blobid' + (new Date()).getTime();
                    const blobCache = tinymce.activeEditor.editorUpload.blobCache;
                    const base64 = reader.result.split(',')[1];
                    const blobInfo = blobCache.create(id, file, reader.result);
                    const base64str =
                        "data:" +
                        blobInfo.blob().type +
                        ";base64," +
                        blobInfo.base64();
                    blobCache.add(blobInfo);
                    console.log(blobInfo.base64());
                    /* call the callback and populate the Title field with the file name */
                    cb(blobInfo.base64(), { title: file.name });
                });
                reader.readAsDataURL(file);
            });

            input.click();
        },
        front_cms: front_cms,
        setup: (editor) => {
            if (options.front_cms) {
                editor.on('init', () => {
                    const fontAwesomeUrl = 'https://use.fontawesome.com/releases/v5.15.4/css/all.css';
                    const bootstrapIconsUrl = 'https://cdn.jsdelivr.net/npm/bootstrap-icons@1.4.1/font/bootstrap-icons.css';
                    const bootstrapMinUrl = baseHost + 'assets/themes/acuas/css/bootstrap.min.css?v=' + Math.random();
                    const styleUrl = baseHost + 'assets/themes/acuas/css/style.css?v=' + Math.random();
                    const bootstrapGridUrl = baseHost + 'assets/themes/acuas/css/bootstrap-grid.css?v=' + Math.random();
                    const bootstrapRebootUrl = baseHost + 'assets/themes/acuas/css/bootstrap-reboot.css?v=' + Math.random();
                    const bootstrapUrl = baseHost + 'assets/themes/acuas/css/bootstrap.css?v=' + Math.random();
                    const dataTablesUrl = baseHost + 'assets/themes/back/css/plugins/DataTables/datatables.min.css?v=' + Math.random();

                    const isFontAwesomeLoaded = Array.from(editor.contentDocument.styleSheets).some(styleSheet => styleSheet.href === fontAwesomeUrl);
                    const isBootstrapIconsLoaded = Array.from(editor.contentDocument.styleSheets).some(styleSheet => styleSheet.href === bootstrapIconsUrl);
                    const isBootstrapMinLoaded = Array.from(editor.contentDocument.styleSheets).some(styleSheet => styleSheet.href === bootstrapMinUrl);
                    const isStyleLoaded = Array.from(editor.contentDocument.styleSheets).some(styleSheet => styleSheet.href === styleUrl);
                    const isBootstrapGridLoaded = Array.from(editor.contentDocument.styleSheets).some(styleSheet => styleSheet.href === bootstrapGridUrl);
                    const isBootstrapRebootLoaded = Array.from(editor.contentDocument.styleSheets).some(styleSheet => styleSheet.href === bootstrapRebootUrl);
                    const isBootstrapLoaded = Array.from(editor.contentDocument.styleSheets).some(styleSheet => styleSheet.href === bootstrapUrl);
                    const isDataTablesLoaded = Array.from(editor.contentDocument.styleSheets).some(styleSheet => styleSheet.href === dataTablesUrl);

                    if (!isDataTablesLoaded) {
                        const dataTablesLink = editor.contentDocument.createElement('link');
                        dataTablesLink.rel = 'stylesheet';
                        dataTablesLink.href = dataTablesUrl;
                        editor.contentDocument.head.appendChild(dataTablesLink);
                    }

                    if (!isFontAwesomeLoaded) {
                        const fontAwesomeLink = editor.contentDocument.createElement('link');
                        fontAwesomeLink.rel = 'stylesheet';
                        fontAwesomeLink.href = fontAwesomeUrl;
                        editor.contentDocument.head.appendChild(fontAwesomeLink);
                    }

                    if (!isBootstrapIconsLoaded) {
                        const bootstrapIconsLink = editor.contentDocument.createElement('link');
                        bootstrapIconsLink.rel = 'stylesheet';
                        bootstrapIconsLink.href = bootstrapIconsUrl;
                        editor.contentDocument.head.appendChild(bootstrapIconsLink);
                    }

                    if (!isBootstrapMinLoaded) {
                        const bootstrapMinLink = editor.contentDocument.createElement('link');
                        bootstrapMinLink.rel = 'stylesheet';
                        bootstrapMinLink.href = bootstrapMinUrl;
                        editor.contentDocument.head.appendChild(bootstrapMinLink);
                    }

                    if (!isStyleLoaded) {
                        const styleLink = editor.contentDocument.createElement('link');
                        styleLink.rel = 'stylesheet';
                        styleLink.href = styleUrl;
                        editor.contentDocument.head.appendChild(styleLink);
                    }

                    if (!isBootstrapGridLoaded) {
                        const bootstrapGridLink = editor.contentDocument.createElement('link');
                        bootstrapGridLink.rel = 'stylesheet';
                        bootstrapGridLink.href = bootstrapGridUrl;
                        editor.contentDocument.head.appendChild(bootstrapGridLink);
                    }

                    if (!isBootstrapRebootLoaded) {
                        const bootstrapRebootLink = editor.contentDocument.createElement('link');
                        bootstrapRebootLink.rel = 'stylesheet';
                        bootstrapRebootLink.href = bootstrapRebootUrl;
                        editor.contentDocument.head.appendChild(bootstrapRebootLink);
                    }

                    if (!isBootstrapLoaded) {
                        const bootstrapLink = editor.contentDocument.createElement('link');
                        bootstrapLink.rel = 'stylesheet';
                        bootstrapLink.href = bootstrapUrl;
                        editor.contentDocument.head.appendChild(bootstrapLink);
                    }

                    // Add d-block class if the first element has class carousel-item
                    const firstElement = editor.contentDocument.body.firstElementChild;
                    if (firstElement && firstElement.classList.contains('carousel-item')) {
                        firstElement.classList.add('d-block');
                    }
                });
            }
        }
    }
    if (localStorage.getItem("tablerTheme") === 'dark') {
        options.skin = 'oxide-dark';
        options.content_css = 'dark';
    }
    if (typeof tinymce === 'undefined') {
        // console.error('TinyMCE is not loaded');
        return;
    }
    tinyMCE.init(options);
}

function formated_date(date_src) {
    if (date_src) {
        var date = new Date(date_src);
    } else {
        var date = new Date();
    }
    var day = date.getDate();
    var month = date.getMonth() + 1;
    var year = date.getFullYear();
    return day + '/' + month + '/' + year;
}

function windowResize() {
    let window_width = window.innerWidth;

    if (window_width <= 756) {
        $(".mobile-menu-nav .devider").removeClass('ml-2');
        $(".logo-pro .main-logo").removeClass('d-none');
        $(".nav-mobile-view .row").removeClass('d-none');
        $(".nav-mobile-view").removeClass('d-none');

        $("#v-pills-tab").removeClass('position-fixed pr-4');
        $("#v-pills-tab").parent().removeClass('border-left order-2').addClass('border-bottom pb-2 order-1');
        $("#v-pills-tab").parent().prev().removeClass('order-1').addClass('pt-2 order-2');
    } else {
        $(".mobile-menu-nav .devider").addClass('ml-2');
        $(".logo-pro .main-logo").removeClass('d-none');
        $(".nav-mobile-view .row").addClass('d-none');
        $(".nav-mobile-view").addClass('d-none');

        $("#v-pills-tab").addClass('position-fixed pr-4');
        $("#v-pills-tab").parent().removeClass('border-bottom pb-2 order-1').addClass('border-left order-2');
        $("#v-pills-tab").parent().prev().removeClass('pt-2 order-2').addClass('order-1');
    }
}

$(window).resize(function (e) {
    windowResize();
});

function showGlobalLoading(element = 'global-loading') {
    $('body').css({
        'overflow': 'hidden'
    });
    $(`#${element}`).removeClass('d-none');
}

function hideGlobalLoading(element = 'global-loading') {
    $('body').css({
        'overflow': 'auto'
    });
    $(`#${element}`).addClass('d-none');
}

// Loading
function showLoading() {
    $('#js-preloader').removeClass('loaded');
}
function hideLoading() {
    $("#js-preloader").addClass("loaded");
}

function alert_success(msg) {
    Swal.fire({
        icon: 'success',
        title: msg,
        showConfirmButton: false,
        timer: 1500
    });
}

function alert_error(msg) {
    Swal.fire({
        icon: 'error',
        title: msg,
        showConfirmButton: false,
        timer: 1500
    });
}

function notif_success(message = 'Aksi berhasil dilakukan') {
    $("#liveToast").removeClass('bg-danger').addClass('bg-success');
    $(".toast-header .me-auto").html(message);
    toast.show()
}

function notif_error(message = 'Aksi gagal dilakukan') {
    $("#liveToast").removeClass('bg-success').addClass('bg-danger');
    $(".toast-header .me-auto").html(message);
    toast.show()
}

function notif_warning(message = 'Aksi gagal dilakukan') {
    $("#liveToast").removeClass('bg-warning').addClass('bg-warning');
    $(".toast-header .me-auto").html(message);
    toast.show()
}

function remove_invalid() {
    $('.invalid-feedback').empty();
    $('.invalid-feedback').removeClass('d-block');
    $('input').removeClass('is-invalid');
    $('select').removeClass('is-invalid');
    $('textarea').removeClass('is-invalid');
}

function empty_input() {
    remove_invalid();

    $('.form-group > input').removeClass('is-invalid');
    $('.form-group > select').removeClass('is-invalid');
    $('.form-group > textarea').removeClass('is-invalid');
    let form_element = $('form');
    form_element.find('select').not('.form-select-sm').val('').trigger('change');
    form_element.find('input').val('');
    form_element.find('textarea').text('');
    form_element.find('textarea').val('');
    if (form_element.find('.trumbowyg-js')) {
        $('.trumbowyg-js').each(function () {
            $(this).trumbowyg('html', '');
        });
    }
    if (form_element.find('[type=file]')) {
        $.each(form_element.find('[type=file]'), function (indexInArray, valueOfElement) {
            let this_target = $(valueOfElement).data('target');
            let target_show = this_target;
            if (this_target) {
                if (!this_target.includes('#') && !this_target.includes('.')) {
                    target_show = '#' + this_target;
                    if ($(target_show).length == 0) {
                        target_show = '.' + this_target;
                    }
                }

                if ($(target_show).length > 0) {
                    $(target_show).empty();
                }
            }
        });
    }
}

/**
 * 
 * @param {object} data 
 */
function input_error(data) {
    // check data input error exist
    if (data.inputerror == undefined) {
        notif_error('Terjadi kesalahan, silahkan coba lagi');
        return;
    }
    for (var i = 0; i < data.inputerror.length; i++) {
        let split_inputerror = data.inputerror[i].split('.');

        if ($('[name="' + data.inputerror[i] + '"]').parent().hasClass('input-group')) {
            $('[name="' + data.inputerror[i] + '"]').addClass('is-invalid').parent().parent().find('.invalid-feedback').addClass('d-block').text(data.error_string[i]);
        } else if ($('[name="' + data.inputerror[i] + '"]').hasClass('trumbowyg-js')) {
            $('[name="' + data.inputerror[i] + '"]').parent().parent().find('.invalid-feedback').addClass('d-block').text(data.error_string[i]);
        } else if ($('[name="' + data.inputerror[i] + '"]').parents('.filepond--root').length) {
            $('[name="' + data.inputerror[i] + '"]').parent().addClass('is-invalid');
            $('[name="' + data.inputerror[i] + '"]').parent().siblings(':last').text(data.error_string[i]);
            $('[name="' + data.inputerror[i] + '"]').parent().siblings(':last').addClass('d-block');
        } else if ($('[name="' + data.inputerror[i] + '"]').siblings('.tox').length || $('#' + data.inputerror[i]).siblings('.tox').length) {
            $('[name="' + data.inputerror[i] + '"]').siblings('.tox').addClass('form-control is-invalid');
            $('[name="' + data.inputerror[i] + '"]').siblings(':last').text(data.error_string[i]);
            $('[name="' + data.inputerror[i] + '"]').siblings(':last').addClass('d-block');

            $('#' + data.inputerror[i]).siblings('.tox').addClass('form-control is-invalid');
            $('#' + data.inputerror[i]).siblings(':last').text(data.error_string[i]);
            $('#' + data.inputerror[i]).siblings(':last').addClass('d-block');
        } else if ($('[name="' + data.inputerror[i] + '"]').siblings(':last').hasClass('litepicker-backdrop')) {
            $('[name="' + data.inputerror[i] + '"]').addClass('is-invalid');
            $('[name="' + data.inputerror[i] + '"]').siblings(':last').prev().text(data.error_string[i]);
            $('[name="' + data.inputerror[i] + '"]').siblings(':last').prev().addClass('d-block');
        } else {
            let selector = $('[name="' + data.inputerror[i] + '"]');
            if (selector.length === 0) {
                selector = $('#' + data.inputerror[i]);
            }
            if (split_inputerror.length > 1) {
                selector = $('[name="' + split_inputerror[0] + '[]"]').eq(parseInt(split_inputerror[1]));
            }
            selector.addClass('is-invalid');
            let feedbackElement = selector.siblings(':last');
            if (!feedbackElement.hasClass('invalid-feedback')) {
                feedbackElement = selector.siblings(':nth-last-child(2)');
            }
            feedbackElement.text(data.error_string[i]);
            feedbackElement.addClass('d-block');
        }

        // Focus on the first invalid element
        if (i === 0) {
            if ($('[name="' + data.inputerror[i] + '"]').length) {
                $('[name="' + data.inputerror[i] + '"]').focus();
            } else if ($('#' + data.inputerror[i]).length) {
                $('#' + data.inputerror[i]).focus();
            }
        }
    }
}

function isGuest() {
    if (localStorage.getItem('guest') == 'true') {
        $("#modalGuest").modal('show');

        return true;
    }

    return false;
}

let modalHandler = function (e) {
    if (isGuest()) {
        e.preventDefault();

        return;
    };
};

$(document).on('show.bs.modal', '#modal_form', modalHandler);
$(document).on('hidden.bs.modal', '#modalGuest', function () {
    $(document).off('show.bs.modal', '#modal_form', modalHandler);
    $(document).on('show.bs.modal', '#modal_form', modalHandler);
});

$(document).on('click', '.btn-sign-guest', function () {
    let username = $("#username").val();
    let password = $("#password").val();
    $('.text-message').html('');

    $.ajax({
        url: baseUrl + '/' + prefix_folder_admin + '/login/do_login',
        type: "POST",
        data: {
            username: username,
            password: password,
        },
        dataType: "JSON",
        success: function (data) {
            if (data.status) {
                window.location.reload();
            } else {
                console.log(data.inputerror);
                if (data.error_login != '') {
                    $('.text-message').html(data.error_login);
                }
                var label = '';
                for (var i = 0; i < data.inputerror.length; i++) {
                    $('[name="' + data.inputerror[i] + '"]').parent().addClass('is-invalid');
                    $('[name="' + data.inputerror[i] + '"]').next().next().text(data.error_string[i]);
                }
            }
        },
        error: function (jqXHR, textStatus, errorThrown) {
            $('.btn_save_group').button('reset');
        }
    });//end ajax
});

$(document).on("click", ".show_password", function () {
    $(this).addClass('hide_password').removeClass('show_password').parent().children().eq(1).children().removeClass("bx bxs-low-vision").addClass("bx bx-show-alt");
    $(this).parent().children().eq(0).attr('type', 'text');
});

$(document).on("click", ".hide_password", function () {
    $(this).addClass('show_password').removeClass('hide_password').parent().children().eq(1).children().removeClass("bx bx-bullseye").addClass("bx bxs-low-vision");
    $(this).parent().children().eq(0).attr('type', 'password');
});

$(document).on('click', '.btn_custom_minus', function () {
    selector_val = $(this).closest('.group-plus-minus').find('.value');
    if (parseInt(selector_val.val()) > 1) {
        value_int = parseInt(selector_val.val()) - 1;
        selector_val.val(value_int);
    }
});

$(document).on('click', '.btn_custom_plus', function () {
    selector_val = $(this).closest('.group-plus-minus').find('.value');
    value_int = parseInt(selector_val.val()) + 1;
    // console.log(value_int); 
    selector_val.val(value_int);
});

if ($('.ckeditor_form').length) {
    $('.ckeditor_form').ckeditor({
        filebrowserBrowseUrl: '' //url
    });
}

//=========================================== module function ====================================================
function show_image(inputFile, target_display) {
    const fileReader = new FileReader();

    fileReader.onload = function (event) {
        $(target_display).attr('src', event.target.result);
    };

    fileReader.onerror = function (error) {
        console.error('Terjadi kesalahan:', error);
    };

    fileReader.readAsDataURL(inputFile);
}

function show_count_confirm() {

    $.ajax({
        url: baseUrl + '/admin/booking/count_booking_confirm',
        type: "POST",
        dataType: "JSON",
        success: function (data) {
            // $('.count_confirm_booking').css('position', 'relative');
            if (data.count > 0) {
                $('.count_confirm_booking > a').prepend(`
<span class="badge badge-primary span-counter">` + data.count + `</span>
`);
            }
        },
        error: function (jqXHR, textStatus, errorThrown) {
            hideLoading();
        }
    }); //end ajax

    $.ajax({
        url: baseUrl + '/admin/transaction/count_transaction',
        type: "POST",
        dataType: "JSON",
        success: function (data) {
            if (data.status) {
                if (data.count_proceed_voyage > 0) {
                    $('.count_transaction_voyage > a').prepend(`
<span class="badge badge-primary span-counter">` + data.count_proceed_voyage + `</span>
`);
                }

                if (data.count_return_countainer > 0) {
                    $('.count_return_countainer > a').prepend(`
<span class="badge badge-primary span-counter">` + data.count_return_countainer + `</span>
`);
                }

                if (data.count_unloading_countainer > 0) {
                    $('.count_unloading_countainer > a').prepend(`
<span class="badge badge-primary span-counter">` + data.count_unloading_countainer + `</span>
`);
                }
            }
        },
        error: function (jqXHR, textStatus, errorThrown) {
            hideLoading();
        }
    }); //end ajax
}

/* Fungsi formatRupiah */
function formatRupiah(angka) {
    var reverse = angka.toString().split('').reverse().join(''),
        ribuan = reverse.match(/\d{1,3}/g);
    ribuan = ribuan.join('.').split('').reverse().join('');
    return 'Rp. ' + ribuan;
}

/* Fungsi formatNumber */
function formatNumber(angka) {
    var reverse = angka.toString().split('').reverse().join(''),
        ribuan = reverse.match(/\d{1,3}/g);
    ribuan = ribuan.join('.').split('').reverse().join('');
    return ribuan;
}

function formatDateIndo(date) {
    var dateObj = new Date(date);

    var day = dateObj.getDate();
    var month = dateObj.getMonth() + 1;
    var year = dateObj.getFullYear();

    var formattedDate = day + '-' + month + '-' + year;

    return formattedDate;
}

function formatDateIso(date) {
    if (date == null || date == "" || date == undefined) {
        return "";
    }
    var dateParts = date.split('-');
    var day = dateParts[0];
    var month = dateParts[1];
    var year = dateParts[2];

    var formattedDate = year + '-' + month + '-' + day;
    return formattedDate;
}

var data_search_select2_default = {
    data: function (params) {
        var query = {
            search: params.term,
        }

        return query;
    },
}

function select2_define(selector, url, custom_search_properties = data_search_select2_default, option_clear = false,
    dropdown_parent = $(selector).parent().parent(), method = 'GET') {
    var ajax_settings = {
        url: baseUrl + url,
        dataType: 'json',
        method: method,
        delay: 300,
        processResults: function (data) {
            return {
                results: data.data.map(function (item) {
                    return {
                        id: item.code,
                        text: item.content,
                    }
                })
            }
        }
    }

    $(selector).select2({
        dropdownParent: dropdown_parent,
        allowClear: option_clear,
        width: '100%',
        ajax: {
            ...ajax_settings,
            ...custom_search_properties
        },
        theme: 'bootstrap-5', // Add this line to style with Bootstrap 5
        placeholder: 'Select an option', // Add a placeholder
        // minimumInputLength: 0, // Minimum characters to start searching
        // templateResult: formatResult, // Custom result formatting
        // templateSelection: formatSelection // Custom selection formatting
    });
}

function custom_select2_define(selector, url, custom_search_properties = data_search_select2_default, option_clear = false,
    dropdown_parent = $(selector).parent().parent(), formatResult, formatSelection) {
    var ajax_settings = {
        url: baseUrl + url,
        dataType: 'json',
        delay: 300,
        processResults: function (data) {
            return {
                results: data.data.map(function (item) {
                    return {
                        id: item.code,
                        text: item.content,
                        desc: item.description,
                        extra: item.extra
                    }
                })
            }
        }
    }

    $(selector).select2({
        dropdownParent: dropdown_parent,
        allowClear: option_clear,
        width: '100%',
        ajax: {
            ...ajax_settings,
            ...custom_search_properties
        },
        theme: 'bootstrap-5', // Add this line to style with Bootstrap 5
        placeholder: 'Select an option', // Add a placeholder
        // minimumInputLength: 0, // Minimum characters to start searching
        templateResult: formatResult, // Custom result formatting
        templateSelection: formatSelection // Custom selection formatting
    });
}

// function formatResult(result, icon = '') {
//     if (!result.id) {
//         return result.text;
//     }
//     var $result = $(
//         '<span>' + icon + result.text + '</span>'
//     );
//     return $result;
// }

// function formatSelection(selection) {
//     return selection.text || selection.id;
// }

function flatpicker_define(selector, add_on_proporties = {}, is_custom_properties = 0) {
    var default_config = {
        dateFormat: "d-m-Y",
    };

    if (is_custom_properties == 0) {
        var new_config = {
            ...default_config,
            ...add_on_proporties
        }
    } else {
        var new_config = add_on_proporties;
    }

    var flatpickr_var = $(selector).flatpickr(new_config);
    return flatpickr_var;
}

function ckeditor_define(id, placeholder = 'Isikan detail') {
    let editor;

    CKEDITOR.ClassicEditor.create(document.getElementById(id), {
        // https://ckeditor.com/docs/ckeditor5/latest/features/toolbar/toolbar.html#extended-toolbar-configuration-format
        toolbar: {
            items: [
                'findAndReplace', 'selectAll', '|',
                'heading', '|',
                'bold', 'italic', 'strikethrough', 'underline', 'code', 'subscript', 'superscript', 'removeFormat', '|',
                'bulletedList', 'numberedList', 'todoList', '|',
                'outdent', 'indent', '|',
                'undo', 'redo',
                '-',
                'fontSize', 'fontFamily', 'fontColor', 'fontBackgroundColor', 'highlight', '|',
                'alignment', '|', 'uploadImage', '|', 'blockQuote', 'insertTable', '|',
                'specialCharacters', 'horizontalLine', 'pageBreak', '|',
            ],
            shouldNotGroupWhenFull: true
        },
        // Changing the language of the interface requires loading the language file using the <script> tag.
        // language: 'es',
        table: {
            contentToolbar: [
                'tableColumn', 'tableRow', 'mergeTableCells',
                'tableProperties', 'tableCellProperties'
            ]
        },
        list: {
            properties: {
                styles: true,
                startIndex: true,
                reversed: true
            }
        },
        // https://ckeditor.com/docs/ckeditor5/latest/features/headings.html#configuration
        heading: {
            options: [{
                model: 'paragraph',
                title: 'Paragraph',
                class: 'ck-heading_paragraph'
            },
            {
                model: 'heading1',
                view: 'h1',
                title: 'Heading 1',
                class: 'ck-heading_heading1'
            },
            {
                model: 'heading2',
                view: 'h2',
                title: 'Heading 2',
                class: 'ck-heading_heading2'
            },
            {
                model: 'heading3',
                view: 'h3',
                title: 'Heading 3',
                class: 'ck-heading_heading3'
            },
            {
                model: 'heading4',
                view: 'h4',
                title: 'Heading 4',
                class: 'ck-heading_heading4'
            },
            {
                model: 'heading5',
                view: 'h5',
                title: 'Heading 5',
                class: 'ck-heading_heading5'
            },
            {
                model: 'heading6',
                view: 'h6',
                title: 'Heading 6',
                class: 'ck-heading_heading6'
            }
            ]
        },
        // https://ckeditor.com/docs/ckeditor5/latest/features/editor-placeholder.html#using-the-editor-configuration
        placeholder: placeholder,
        // https://ckeditor.com/docs/ckeditor5/latest/features/font.html#configuring-the-font-family-feature
        fontFamily: {
            options: [
                'default',
                'Arial, Helvetica, sans-serif',
                'Courier New, Courier, monospace',
                'Georgia, serif',
                'Lucida Sans Unicode, Lucida Grande, sans-serif',
                'Tahoma, Geneva, sans-serif',
                'Times New Roman, Times, serif',
                'Trebuchet MS, Helvetica, sans-serif',
                'Verdana, Geneva, sans-serif'
            ],
            supportAllValues: true
        },
        // https://ckeditor.com/docs/ckeditor5/latest/features/font.html#configuring-the-font-size-feature
        fontSize: {
            options: [10, 12, 14, 'default', 18, 20, 22],
            supportAllValues: true
        },
        // Be careful with the setting below. It instructs CKEditor to accept ALL HTML markup.
        // https://ckeditor.com/docs/ckeditor5/latest/features/general-html-support.html#enabling-all-html-features
        htmlSupport: {
            allow: [{
                name: /.*/,
                attributes: true,
                classes: true,
                styles: true
            }]
        },
        // Be careful with enabling previews
        // https://ckeditor.com/docs/ckeditor5/latest/features/html-embed.html#content-previews
        htmlEmbed: {
            showPreviews: true
        },
        // https://ckeditor.com/docs/ckeditor5/latest/features/link.html#custom-link-attributes-decorators
        link: {
            decorators: {
                addTargetToExternalLinks: true,
                defaultProtocol: 'https://',
                toggleDownloadable: {
                    mode: 'manual',
                    label: 'Downloadable',
                    attributes: {
                        download: 'file'
                    }
                }
            }
        },
        // https://ckeditor.com/docs/ckeditor5/latest/features/mentions.html#configuration
        mention: {
            feeds: [{
                marker: '@',
                feed: [
                    '@apple', '@bears', '@brownie', '@cake', '@cake', '@candy', '@canes', '@chocolate', '@cookie', '@cotton', '@cream',
                    '@cupcake', '@danish', '@donut', '@dragée', '@fruitcake', '@gingerbread', '@gummi', '@ice', '@jelly-o',
                    '@liquorice', '@macaroon', '@marzipan', '@oat', '@pie', '@plum', '@pudding', '@sesame', '@snaps', '@soufflé',
                    '@sugar', '@sweet', '@topping', '@wafer'
                ],
                minimumCharacters: 1
            }]
        },
        // The "super-build" contains more premium features that require additional configuration, disable them below.
        // Do not turn them on unless you read the documentation and know how to configure them and setup the editor.
        removePlugins: [
            // These two are commercial, but you can try them out without registering to a trial.
            // 'ExportPdf',
            // 'ExportWord',
            'CKBox',
            'CKFinder',
            'EasyImage',
            // This sample uses the Base64UploadAdapter to handle image uploads as it requires no configuration.
            // https://ckeditor.com/docs/ckeditor5/latest/features/images/image-upload/base64-upload-adapter.html
            // Storing images as Base64 is usually a very bad idea.
            // Replace it on production website with other solutions:
            // https://ckeditor.com/docs/ckeditor5/latest/features/images/image-upload/image-upload.html
            // 'Base64UploadAdapter',
            'RealTimeCollaborativeComments',
            'RealTimeCollaborativeTrackChanges',
            'RealTimeCollaborativeRevisionHistory',
            'PresenceList',
            'Comments',
            'TrackChanges',
            'TrackChangesData',
            'RevisionHistory',
            'Pagination',
            'WProofreader',
            // Careful, with the Mathtype plugin CKEditor will not load when loading this sample
            // from a local file system (file://) - load this site via HTTP server if you enable MathType.
            'MathType',
            // The following features are part of the Productivity Pack and require additional license.
            'SlashCommand',
            'Template',
            'DocumentOutline',
            'FormatPainter',
            'TableOfContents'
        ]
    }).then(newEditor => {
        editor = newEditor;
    });
}

function getExtension(filename) {
    var parts = filename.split('.');
    return parts[parts.length - 1].toLowerCase();
}

/**
 * 
 * @param {*} inputFile 
 * @param {*} target_display 
 * @param {*} filename
 * @param {any} width_image
 * @param {any} height_image
 * @param {any} width_frame
 * @param {any} height_frame
 */
function show_file(inputFile, target_display, filename, width_image = '80%', height_image = '80%', width_frame = '400px', height_frame = '400px') {
    if (inputFile) {
        const fileReader = new FileReader();
        const extension_file = getExtension(filename);
        let split = target_display.split('.');

        if (extension_file == 'jpg' || extension_file == 'jpeg' || extension_file == 'png' || extension_file == 'webp') {
            var target_display_show = 'this_img_' + split[1]
            $(target_display).html('<img src="" class="' + target_display_show + ' preview_image" width="' + width_image + '" height="' + height_image + '">');
        } else {
            var target_display_show = 'this_frame_' + split[1]
            $(target_display).html('<iframe src="" class="' + target_display_show + '" frameborder="0" width="' + width_frame + '" height="' + height_frame + '"></iframe>');
        }

        fileReader.onload = function (event) {
            $('.' + target_display_show).attr("src", event.target.result);
        };

        fileReader.onerror = function (error) {
            console.error("Terjadi kesalahan:", error);
        };

        fileReader.readAsDataURL(inputFile);
    } else {
        $(target_display).empty();
    }
}

function show_file_from_url(url_image, target_display, width_image = '80%', height_image = '80%', width_frame = '400px', height_frame = '400px') {
    if (url_image) {
        let split_url = url_image.split('.');
        let extension_file = split_url[split_url.length - 1];

        if (extension_file == 'jpg' || extension_file == 'jpeg' || extension_file == 'png' || extension_file == 'webp') {
            var target_display_show = 'this_img'
            $(target_display).html('<img src="' + url_image + '" class="' + target_display_show + ' preview_image" width="' + width_image + '" height="' + height_image + '">');
        } else {
            var target_display_show = 'this_frame'
            $(target_display).html('<iframe src="' + url_image + '" class="' + target_display_show + '" frameborder="0" width="' + width_frame + '" height="' + height_frame + '"></iframe>');
        }
    } else {
        $(target_display).empty();
    }
}

/**
 * 
 * @param {*} selector 
 * @param {phone, currency, bank} type_cleave 
 * @returns 
 */
function cleave_define(selector, type_cleave) {
    var settings = {};

    if (type_cleave == 'phoneId') {
        settings = {
            phone: true,
            phoneRegionCode: 'ID',
            delimiter: '-',
        }
    } else if (type_cleave == 'phone') {
        settings = {
            phone: true,
            delimiter: '-',
        }
    } else if (type_cleave == 'currency') {
        settings = {
            numeral: true,
            prefix: 'Rp. ',
            delimiter: '.',
            numeralDecimalMark: ',',
        }
    } else if (type_cleave == 'number') {
        settings = {
            numeral: true,
            numeralDecimalMark: ',',
            delimiter: '.'
        }
    } else if (type_cleave == 'bank') {
        settings = {
            creditCard: true
        }
    } else if (type_cleave == 'ktp') {
        settings = {
            blocks: [6, 4, 4, 2],
            numericOnly: true
        }
    }

    const cleave = new Cleave(selector, settings);

    return cleave;
}

function datatable_define(selector, url) {
    var datatable = $(selector).DataTable({
        ajax: {
            url: url_controller + url + '',
            type: 'POST',
            data: function (d) {
                d.id = id_use
            },
            beforeSend: function () {
                Swal.fire({
                    allowOutsideClick: false,
                    showConfirmButton: false,
                    willOpen: () => {
                        Swal.showLoading();
                    }
                });
            },
            complete: function (data) {
                Swal.close();
            },
        },
    });

    return datatable;
}

function add_option_select2(id, label) {
    let newOption = new Option(label, id, true, true);
    return newOption;
}

function add_option_null_select2(name = []) {
    let options = name;
    $.each(options, function (index, value) {
        let options_null = add_option_select2("", "");
        $('[name="' + value + '"]').append(options_null).trigger("change");
    });
}

$('.modal').on('hidden.bs.modal', function () {
    $('body').css('padding-right', '');
    $('body').removeAttr('data-bs-padding-right');
});

$(".file_input").change(function (e) {
    e.preventDefault();
    const file = e.target.files[0];
    const filename = $(this).val();
    let this_target = $(this).data('target');
    let this_allowFiles = $(this).attr('accept');

    let target_show = this_target;
    if (!this_target.includes('#') && !this_target.includes('.')) {
        target_show = '#' + this_target;
        if ($(target_show).length == 0) {
            target_show = '.' + this_target;
            if ($(target_show).length == 0) {
                alert_error('Target untuk menampilkan file tidak ada');
            }
        }
    }

    show_file(file, target_show, filename);
});

$(document).on('click', ".change_access", function () {
    $("#modal_change_access").modal('show');
});

$(document).on('click', '.btn_save_change_access', function (e) {
    e.preventDefault();

    $.ajax({
        type: "post",
        url: baseUrl + '/' + prefix_folder_admin + '/login/change_access',
        data: {
            access: $("#access").val()
        },
        dataType: "json",
        success: function (response) {
            window.location.href = baseUrl + '/' + prefix_folder_admin + '/home'
        }
    });
});

$(document).on('click', '.pc-head-link', function (e) {
    e.preventDefault();
    if ($(".pc-sidebar").hasClass('pc-sidebar-hide')) {
        $(".pc-header").attr('style', 'left: 0 !important;');
    } else {
        $(".pc-header").removeAttr('style');
    }
});

$(document).on('click', '.preview_image', function (e) {
    e.preventDefault()
    modal_image($(this).attr('src'))
})

$(document).on('click', '.glightbox', function (e) {
    e.preventDefault()
    GLightbox({
        selector: '.glightbox',
        loop: false,
        title: false,
    });
})


function rotate_right() {
    deg += 90;
    var modalImg = document.getElementById("img01");
    modalImg.style.transform = `rotate(${deg}deg)`;
}

function rotate_left() {
    deg -= 90;
    var modalImg = document.getElementById("img01");
    modalImg.style.transform = `rotate(${deg}deg)`;
}

function modal_image(src) {
    var modal = document.getElementById("previewImage");
    var modalImg = document.getElementById("img01");
    modal.style.display = "block";
    modalImg.src = src;
    document.body.style.overflow = "hidden";
}

function modal_image_close() {
    var modal = document.getElementById("previewImage");
    modal.style.display = "none";
    document.body.style.overflow = "auto";
    deg = 0;
}

function get_promise(url_sending, data_post = {}, use_loading = 1) {
    return new Promise(function (resolve, reject) {
        $.ajax({
            url: url_controller + url_sending + '',
            type: "POST",
            dataType: "JSON",
            data: data_post,
            beforeSend: function () {
                if (use_loading == 1) {
                    Swal.fire({
                        allowOutsideClick: false,
                        showConfirmButton: false,
                        willOpen: () => {
                            Swal.showLoading();
                        }
                    });
                }
            },
            success: function (data) {
                if (data.status) {
                    if (use_loading == 1) {
                        Swal.close();
                    }
                    resolve(data);
                } else {
                    if (use_loading == 1) {
                        Swal.close();
                    }
                    reject("Data tidak ditemukan");
                }
            },
            error: function (jqXHR, textStatus, errorThrown) {
                if (use_loading == 1) {
                    Swal.close();
                }
                reject(textStatus);
            }
        });
    });
}

$("#panel-fullscreen").click(function (e) {
    e.preventDefault();
    var $this = $(this);
    if ($this.children('i').hasClass('bx bx-fullscreen')) {
        $this.children('i').removeClass('bx bx-fullscreen');
        $this.children('i').addClass('bx bx-exit-fullscreen');
    }
    else if ($this.children('i').hasClass('bx bx-exit-fullscreen')) {
        $this.children('i').removeClass('bx bx-exit-fullscreen');
        $this.children('i').addClass('bx bx-fullscreen');
    }
    $(this).closest('.panel').toggleClass('panel-fullscreen');
});

$('.toggle-btn').click(function () {
    const target = $(this).attr('data-bs-target');
    const cardBody = $(target);
    const icon = $(this).find('i');

    setTimeout(function () {
        if (cardBody.hasClass('show')) {
            icon.removeClass('fa-chevron-down').addClass('fa-chevron-up');
        } else {
            icon.removeClass('fa-chevron-up').addClass('fa-chevron-down');
        }
    }, 400);
});

$(document).on('click', 'td', function () {
    if ($(this).parent().hasClass('selected')) {
        $(this).parent().find('.dt-select-checkbox').prop('checked', true);
    } else {
        $(this).parent().find('.dt-select-checkbox').prop('checked', false);
    }
});

function display_pdf(html_data) {
    $('#html-pdf-print').html('<iframe src="data:application/pdf;base64,' + html_data + '" frameBorder="0" width="100%" height="800px" style="border: none;"></iframe>');
    $('#modal-pdf-print').modal('show');
}

$('.copy_text').click(function (e) {
    e.preventDefault();
    var this_target = $(this).data('target');
    let target_show = this_target;
    if (!this_target.includes('#') && !this_target.includes('.')) {
        target_show = '#' + this_target;
        if ($(target_show).length == 0) {
            target_show = '.' + this_target;
            if ($(target_show).length == 0) {
                notif_error('Target untuk menampilkan file tidak ada');
            }
        }
    }
    var copyText = $(target_show);
    copyText.select();
    // copyText.setSelectionRange(0, 99999);
    navigator.clipboard.writeText(copyText.val());
    notif_success("Berhasil dicopy");
})

$('.number-js').on('input', function () {
    var input_val = $(this).val();
    $(this).val(format_numbering(input_val));
});

function format_numbering(value) {
    value = value.replace(/[^0-9]/g, '');
    value = value.replace(/\B(?=(\d{3})+(?!\d))/g, ".");

    return value;
}

$("#modal_detail_cv, #modal_detail_account, #modal_ktp_or_kk, #modal_competency").on('shown.bs.modal', function (e) {
    $('#modal_peserta').modal('hide');
    $('#modal_peserta_recap').modal('hide');
});

$("#modal_detail_cv, #modal_detail_account, #modal_ktp_or_kk, #modal_competency").on('hidden.bs.modal', function (e) {
    $('#modal_peserta').modal('show');
    $('#modal_peserta_recap').modal('show');
});

$(document).on('click', '.btn_kk', function (e) {
    e.preventDefault();
    $("#modal_ktp_or_kk").modal('show');
    let this_url = $(this).data('url');
    $("#ktp_or_kk iframe").attr('src', '');

    $("#ktp_or_kk iframe").attr('src', this_url);
});

// Filepond
FilePond.registerPlugin(
    FilePondPluginFileValidateSize,
    FilePondPluginImageExifOrientation,
    FilePondPluginImagePreview,
    FilePondPluginPdfPreview,
    FilePondPluginFileValidateType,
);

function filepond_define(selector, config = {
    acceptedFileTypes: ['application/pdf', 'application/vnd.openxmlformats-officedocument.wordprocessingml.document', 'image/jpeg', 'image/png', 'application/vnd.ms-excel', 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'],
    allowPdfPreview: true,
    allowImagePreview: true,
    allowMultiple: true,
    maxFileSize: '3MB',
    maxFiles: 12,
    pdfPreviewWidth: 190,
    pdfPreviewHeight: 190,
    imagePreviewHeight: 200,
    imagePreviewHeight: 200,
}) {
    const inputElement = document.querySelector(selector);
    const pond = FilePond.create(inputElement, config);
    pond.on('addfilestart', function (file) {
        var typeFile = file.fileType;
        var typeAccept = config.acceptedFileTypes;
        if (typeAccept.indexOf(typeFile) === -1) {
            notif_error('Ekstensi file tidak didukung');
            pond.removeFile(file.id);
        }
        const max_size_in_bytes = config.maxFileSize ? convert_to_bytes(config.maxFileSize) : 2 * 1024 * 1024;
        if (file.fileSize > max_size_in_bytes) {
            pond.removeFile(file.id);
            notif_error(`Ukuran file makasimal ${config.maxFileSize}.`);
            return;
        }

        generate_image(pond.getFiles());
    });
    return pond;
}

function generate_image(data) {
    data.forEach((val, index) => {
        var value = val.getMetadata().photo;
        value = value === undefined ? URL.createObjectURL(val.file) : value;
        console.log(value);

        if (!($(`#filepond--item-${val.id} > a.btn-view-image`).length)) {
            $(`#filepond--item-${val.id}`).append(`<a href=${value} class="btn-view-image d-none" data-glightbox="type: image">Test</a>`);
            $(document).on('click', `#filepond--item-${val.id} .filepond--image-preview-wrapper`, function (e) {
                lightbox = GLightbox({
                    selector: `#filepond--item-${val.id} > .btn-view-image`,
                    title: !1,
                });
                document.querySelector(`#filepond--item-${val.id} > .btn-view-image`).click();
            })
        }
    })
}

function convert_to_bytes(size) {
    const units = {
        B: 1,
        KB: 1024,
        MB: 1024 * 1024,
        GB: 1024 * 1024 * 1024
    };

    const match = size.match(/^(\d+(?:\.\d+)?)\s*(B|KB|MB|GB)$/i);

    if (match) {
        const value = parseFloat(match[1]);
        const unit = match[2].toUpperCase();
        return value * (units[unit] || 1);
    } else {
        notif_error("Format ukuran file tidak valid");
    }
}

function number_to_letter(num) {
    const letters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ';
    let result = '';
    while (num > 0) {
        num--;
        result = letters[num % 26] + result;
        num = Math.floor(num / 26);
    }
    return result;
}