var myDropzone;
var id;
var deletephotosArray = [];
$(document).ready(function () {
    $('.select2').select2();
    if (window.Dropzone) {
        window.Dropzone.autoDiscover = false;
        myDropzone = new Dropzone("#dropzone", {
            autoProcessQueue: false,
            addRemoveLinks: true,
            url: window.location.origin + "/photos/saveImages",
            method: "post",
            maxFilesize: 40, // in MB
            acceptedFiles: ".png, .jpg, .jpeg",
            paramName: "file", // Name of the uploaded file parameter
            dictDefaultMessage: "Drop files here to upload",
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            },
            uploadMultiple: true,
            parallelUploads: 100,
            init: function () {
                let myDropzone = this;
                // Obtiene el valor del input oculto que contiene las URLs
                let urlInput = document.querySelector("input[type='hidden'][name='urls']").value;

                let urls = urlInput.split(',');

                urls.forEach(url => {
                    if (url.trim()) {
                        fetch(url)
                            .then(response => {
                                if (!response.ok) {
                                    throw new Error('Network response was not ok');
                                }
                                return response.blob();
                            })
                            .then(blob => {
                                const blobUrl = URL.createObjectURL(blob);

                                let mockFile = { name: url.split("/").pop(), size: 1000, flags: "server", url: url };

                                myDropzone.displayExistingFile(mockFile, blobUrl);

                                myDropzone.on("success", function (file, response) {
                                });
                            })
                            .catch(error => {
                                console.error('There was a problem with the fetch operation:', error);
                            });
                    }
                });

                this.on("success", function (file, response) {
                });
                this.on("error", function (file, errorMessage, xhr) {
                    // Mostrar mensaje de error al usuario
                    alert("Hubo un error al subir el archivo: " + errorMessage);
                });

            },
            removedfile: function (file) {
                if (file.flags) {
                    let id = document.getElementById("id").value;
                    deletephotosArray.push(file.url);
                }
                if (file.previewElement != null && file.previewElement.parentNode != null) {
                    file.previewElement.parentNode.removeChild(file.previewElement);
                }
                return this._updateMaxFilesReachedClass();
            }
        });
    }
});

function create() {
    createRegister(
        '/photos/create',
        Lang.get("messagesClient.photos.create_question"),
        "/photos",
        null,
        null,
        myDropzone
    );

}

function clickEdit(value) {
    $(location).attr("href", "/photos/edit/" + value);
}

function edit() {
    editRegister(
        '/photos/update/',
        Lang.get("messagesClient.photos.edit_question"),
        "/photos",
        null,
        null,
        myDropzone,
        deletephotosArray
    );
}

function clickDelete(value) {
    deleteRegister(
        "/photos/delete/" + value,
        Lang.get("messagesClient.photos.delete_question"),
        "/photos"
    );
}

function chk(value) {
    activate(value, "/photos/active");
}

function clickDeleteProductImage(value, imageToDelete) {

    swal(Lang.get("messagesClient.product_tag11"), {
        buttons: {
            cancel: "No",
            Ok: true,
        },
    }).then((val) => {
        if (val == "Ok") {
            var info = {
                id: value,
                link: imageToDelete,
            };

            $.ajax({
                url: "photos/deletedImage",
                type: "POST",
                contentType: "application/json",
                headers: {
                    "X-CSRF-TOKEN": $('meta[name="csrf-token"]').attr("content"),
                    "Content-Type": "application/json",
                },
                data: JSON.stringify(info),
                success: function (r) {
                    if (r.r) {
                        swal(r.m, {
                            icon: "success",
                            buttons: {
                                Ok: true,
                            },
                        }).then((val) => {
                            if (val == "Ok") {
                                $(location).attr('href', '/photos');
                            }
                        });
                    } else {
                        swal("Error", r.m, "error");
                    }
                },
                error: function (e) {
                    swal("Error", Lang.get("messagesClient.product_tag12"), "error");
                },
            });
        }
    });
}

function clickCopy(value) {
    $(location).attr("href", "/photos/add/" + value);
}