var operations = [];
var svgPending =
    `<svg width="22" height="22" viewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg">
                <path d="M11 19.25C15.5563 19.25 19.25 15.5563 19.25 11C19.25 6.44365 15.5563 2.75 11 2.75C6.44365 2.75 2.75 6.44365 2.75 11C2.75 15.5563 6.44365 19.25 11 19.25Z" fill="#FDBA74" />
                <path d="M11.4166 14.6667C11.4166 14.8968 11.2301 15.0833 10.9999 15.0833C10.7698 15.0833 10.5833 14.8968 10.5833 14.6667C10.5833 14.4365 10.7698 14.25 10.9999 14.25C11.2301 14.25 11.4166 14.4365 11.4166 14.6667Z" fill="white" stroke="white" />
                <path d="M11 11.916V6.41602V11.916Z" fill="white" />
                <path d="M11 11.916V6.41602" stroke="white" stroke-width="1.5" stroke-linecap="round" />
        </svg>`;

var svgReject =
    `<svg width="22" height="22" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
            <circle cx="9" cy="9" r="6.75" fill="#F87171"/>
            <path d="M12 6L6 12" stroke="white" stroke-width="1.2" stroke-linecap="round" stroke-linejoin="round"/>
            <path d="M6 6L12 12" stroke="white" stroke-width="1.2" stroke-linecap="round" stroke-linejoin="round"/>
        </svg>
       `;
var svgConfirmed =
    `<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
                <circle cx="12" cy="12" r="8" fill="#A3E635" />
                <path d="M9.5 12L11.3939 13.8939C11.4525 13.9525 11.5475 13.9525 11.6061 13.8939L15.5 10" stroke="white" stroke-width="1.2" stroke-linecap="round" />
         </svg>`;


$(document).ready(function () {
    checkSubmit();


    $("#militaryStatus").prop("disabled", true);
    $("#operationBtn").click(function() {
        if (window.matchMedia("(max-width: 767px)").matches) {

            $(".responsiveInMobile").css({
                "display": "block",
                "transition": "opacity 0.5s"
            });
            $("#overlayModalUpload").css({
                "display": "block",
                "transition": "opacity 0.5s"
            });

            //$("#confirm , #reject").click(function() {
            //    setTimeout(function() {
            //        $(".responsiveInMobile").css({ "display": "none"});
            //        $("#overlayModalUpload").css({ "display": "none"});
            //    },300);
            //});


            // New changes...
            $('#overlayModalUpload, .closePartition').click(function () {
                $(".responsiveInMobile").css({
                    "display": "none",
                    "opacity": "0"
                });
                $("#overlayModalUpload").css({
                    "display": "none",
                    "opacity": "0"
                });
            });

            // Set the opacity back to 1 after a short delay
            setTimeout(function () {
                $(".responsiveInMobile").css("opacity", "1");
                $("#overlayModalUpload").css("opacity", "1");
            }, 10);
        }

    });

    //giving class to sign holders and adjust classes
    $('.signHolder').each(function() {
        const buttonClass = $(this).find('button').attr('class');
        const spanElement = $(this).find('span.sign');
        if (buttonClass.includes('submittedbyadmin')) {
            $(this).addClass('pending');
            spanElement.html(svgPending);
        } else if (buttonClass.includes('rejected')) {
            $(this).addClass('reject');
            spanElement.html(svgReject);
        } else if (buttonClass.includes('pending')) {
            $(this).addClass('pending');
            spanElement.html(svgPending);
        } else if (buttonClass.includes('confirmed')) {
            $(this).addClass('confirmed');
            spanElement.html(svgConfirmed);
        }
    });

    // Ensure the first carousel item is active by default
    if (!$('.carousel-item').hasClass('active')) {
        $('.carousel-item').first().addClass('active');
    }

    // Ensure the first mg-btn (for "عکس پرسنلی") is active by default
    $('.mg-btn').first().addClass('active');

    var currentSlide = $('.carousel-item.active').data('slide-index') || 0;
    var totalSlides = $('.carousel-item').length;

    // Function to update slide, buttons, and selective slides
    function updateSlide() {
        // Move carousel to the current slide
        $('#carouselExampleIndicators').carousel(currentSlide);

        // Update active button
        $('.mg-btn').removeClass('active');
        $('.mg-btn[data-slide-index="' + currentSlide + '"]').addClass('active');

        // Update selective slides for right-to-left
        $('.slective-slide').removeClass('active-select');
        $('.slective-slide[data-slide-index="' + currentSlide + '"]').addClass('active-select');
    }

    // Initial update
    updateSlide();

    // Event listener for button clicks
    $('.mg-btn').click(function () {
        currentSlide = $(this).data('slide-index');
        updateSlide();
    });

    // Event listener for next and previous arrows
    $('.right-arrow, .left-arrow').click(function () {
        var direction = $(this).hasClass('right-arrow') ? -1 : 1; // Adjust direction for right-to-left slider
        currentSlide = (currentSlide + direction + totalSlides) % totalSlides;
        updateSlide();
    });

    // Event listener for carousel item change
    $('#carouselExampleIndicators').on('slid.bs.carousel', function () {
        currentSlide = $('.carousel-item.active').data('slide-index');
        updateSlide();
    });

    $(".exitModal").click(function () {

        if (operations.length > 0) {
            swal({
                title: "در صورت انصراف عملیات ثبت نخواهد شد!",
                text: "",
                type: "warning",
                showCancelButton: true,
                confirmButtonColor: "#DD6B55",
                confirmButtonText: "بله",
                cancelButtonText: "خیر",
                closeOnConfirm: true,
                closeOnCancel: true
            }, function (isConfirm) {
                if (isConfirm) {
                    $('#MainModal').modal('hide');

                }
            });
        } else {
            $('#MainModal').modal('hide');
        }
    });



    function toggleOperationTab() {
        //debugger;
        let enable = false;
        $(".mg-btn.active").each(function () {
            if ($(this).hasClass("submittedbyadmin")) {
                enable = true;
            }
        });
        if (enable) {
            //$(".operaion-tab").removeClass("disable");
            $("#message").removeClass("disable");
            $("#confirm").removeClass("disable");
            $("#reject").removeClass("disable");
        } else {
            //$(".operaion-tab").addClass("disable");
            $("#message").addClass("disable");
            $("#confirm").addClass("disable");
            $("#reject").addClass("disable");
        }
    }

        // Initial check
        toggleOperationTab();

        // Check when .mg-btn classes change
        $('.mg-btn').on('classChange', function () {
            toggleOperationTab();
        });

        // Trigger classChange event when class is added or removed
        (function () {
            var originalAddClassMethod = $.fn.addClass;
            var originalRemoveClassMethod = $.fn.removeClass;

            $.fn.addClass = function () {
                var result = originalAddClassMethod.apply(this, arguments);
                $(this).trigger('classChange');
                return result;
            };

            $.fn.removeClass = function () {
                var result = originalRemoveClassMethod.apply(this, arguments);
                $(this).trigger('classChange');
                return result;
            };
        })();

    // Check images and update alt attribute
    $('img').each(function () {
        if ($(this).attr('src') === "/AdminNew/Company/EmployeesDocumentsManagement/EmployeesList?handler=ShowPicture") {
            $(this).attr('alt', 'عکسی آپلود نشده');
            $(this).css("color", "black");
        }
    });






    // Lightbox Gallery

    // query selectors
    const lightboxEnabled = document.querySelectorAll('.lightbox-enabled');
    const lightboxArray = Array.from(lightboxEnabled);
    const lastImage = lightboxArray.length - 1;
    const lightboxContainer = document.querySelector('.lightbox-container');
    const lightboxImage = document.querySelector('.lightbox-image');
    const lightboxBtns = document.querySelectorAll('.lightbox-btn');
    const lightboxBtnRight = document.querySelector('#right');
    const lightboxBtnLeft = document.querySelector('#left');
    let activeImage;
    // Functions
    const showLightBox = () => { lightboxContainer.classList.add('active') }

    const hideLightBox = () => { lightboxContainer.classList.remove('active') }

    const setActiveImage = (image) => {
        lightboxImage.src = image.dataset.imgsrc;
        activeImage = lightboxArray.indexOf(image);
    }

    const transitionSlidesLeft = () => {
        lightboxBtnLeft.focus();
        $('.lightbox-image').addClass('slideright');
        setTimeout(function () {
            activeImage === 0 ? setActiveImage(lightboxArray[lastImage]) : setActiveImage(lightboxArray[activeImage - 1]);
        }, 250);


        setTimeout(function () {
            $('.lightbox-image').removeClass('slideright');
        }, 500);
    }

    const transitionSlidesRight = () => {
        lightboxBtnRight.focus();
        $('.lightbox-image').addClass('slideleft');
        setTimeout(function () {
            activeImage === lastImage ? setActiveImage(lightboxArray[0]) : setActiveImage(lightboxArray[activeImage + 1]);
        }, 250);
        setTimeout(function () {
            $('.lightbox-image').removeClass('slideleft');
        }, 500);
    }

    const transitionSlideHandler = (moveItem) => {
        moveItem.includes('left') ? transitionSlidesLeft() : transitionSlidesRight();
    }

    // Event Listeners
    lightboxEnabled.forEach(image => {
        image.addEventListener('click',
            (e) => {
                showLightBox();
                setActiveImage(image);
            });
    });
    lightboxContainer.addEventListener('click', () => { hideLightBox() });
    lightboxBtns.forEach(btn => {
        btn.addEventListener('click',
            (e) => {
                e.stopPropagation();
                transitionSlideHandler(e.currentTarget.id);
            });
    });

    lightboxImage.addEventListener('click',
        (e) => {
            e.stopPropagation();

        });

});


function checkFields() {
    if ($(".mg-btn").hadClass("active")) {
        var index = $(this).data("slide-index");
        var inputValue = $("#label_" + index).val();

        $("#confirm").click(function () {
            $(this).removeClass('submittedbyadmin').addClass("confirmed");
            $(this).closest('.signHolder').removeClass("pending").addClass("confirmed");
            $(this).siblings("span.sign").html(svgConfirmed);
            //تایید توضیحات نمیخواد
            //inputValue = $("#message").val();
            inputValue=$()
        });

        $("#reject").click(function () {
            $(this).removeClass('submittedbyadmin').addClass("reject");
            $(this).closest('.signHolder').removeClass("pending").addClass("rejected");
            $(this).siblings("span.sign").html(svgReject);
            inputValue = $("#message").val();
        });
    };
}

function rejectAjax() {
    //var carouselDocumentItemId = $('.carousel-item.active').data('document-id');
    var carouselDocumentItemId = $('.mg-btn.active').data('document-btn-id');
    var messageData = $("#message").val();

    if (messageData === "") {
        $('.alert-msg').show();
        $('.alert-msg p').text('فیلد توضیحات را پر نمایید');
        $('.select-alert').addClass('errored');
        setTimeout(function () {
            $('.alert-msg').hide();
            $('.alert-msg p').text('');
            $('.select-alert').removeClass('errored');
        }, 3500);
        return;
    }

    let commandData = {
        EmployeeDocumentItemId: carouselDocumentItemId,
        IsConfirmed: false,
        Message: messageData
    };
    operations.push(commandData);
    $("#message").val("");
    checkSubmit();



    showAlertMessage('.alert-success-msg', 'تصویر موجود رد شد.', 3500);
    $(".mg-btn.active").removeClass('submittedbyadmin').addClass("reject");
    $(".mg-btn.active").closest('.signHolder').removeClass("pending").addClass("rejected");

    $(".mg-btn.active").siblings("span.sign").html(svgReject);

    //$("#confirm , #reject").click(function() {
    //    setTimeout(function() {
    //        $(".responsiveInMobile").css({ "display": "none"});
    //        $("#overlayModalUpload").css({ "display": "none"});
    //    },300);
    //});
}

function confirmAjax() {
    //var carouselDocumentItemId = $('.carousel-item.active').data('document-id');
    var carouselDocumentItemId = $('.mg-btn.active').data('document-btn-id');
    var messageData = $("#message").val();

    let commandData = {
        EmployeeDocumentItemId: carouselDocumentItemId,
        IsConfirmed: true,
        Message: messageData
    };
    operations.push(commandData);
    $("#message").val("");
    checkSubmit();


    showAlertMessage('.alert-success-msg', 'تصویر موجود تایید شد.', 3500);
    $(".mg-btn.active").removeClass('submittedbyadmin').addClass("confirmed");
    $(".mg-btn.active").closest('.signHolder').removeClass("pending").addClass("confirmed");

    $(".mg-btn.active").siblings("span.sign").html(svgConfirmed);
}


//function rejectAjax() {
//    var document_ItemId = $('.carousel-item.active').data('document-id');
//    var messageData = $("#message").val();


//    if (messageData === "") {
//        $('.alert-msg').show();
//        $('.alert-msg p').text('فیلد توضیحات را پر نمایید');
//        $('.select-alert').addClass('errored');
//        setTimeout(function () {
//            $('.alert-msg').hide();
//            $('.alert-msg p').text('');
//            $('.select-alert').removeClass('errored');
//        }, 3500);
//        return;
//    }



//    $.ajax({
//        async: false,
//        dataType: 'json',
//        type: 'POST',
//        url: rejectUrl,
//        headers: { "RequestVerificationToken": antiForgeryToken },
//        data: { documentItemId: Number(document_ItemId), message: messageData },
//        success: function (response) {

//            if (response.success) {
//                showAlertMessage('.alert-success-msg', 'تصویر موجود رد شد.', 3500);
//                $(".mg-btn.active").removeClass('submittedbyadmin').addClass("reject");
//                $(".mg-btn.active").closest('.signHolder').removeClass("pending").addClass("rejected");

//                $(".mg-btn.active").siblings("span.sign").html(svgReject);
//            } else {
//                showAlertMessage('.alert-msg', 'مشکلی پیش آمد.', 3500);
//            }

//            $("#message").val("");

//        },
//        error: function (err) {
//            console.log(err);
//            showAlertMessage('.alert-msg', 'مشکلی پیش آمد.', 3500);

//        }

//    });
//}
//function confirmAjax() {
//    var documentItemId2 = $('.carousel-item.active').data('document-id');
//    $.ajax({
//        async: false,
//        dataType: 'json',
//        type: 'POST',
//        url: confirmUrl,
//        headers: { "RequestVerificationToken": antiForgeryToken },
//        data: { documentItemId: Number(documentItemId2)},
//        success: function (response) {

//            if (response.success) {
//                showAlertMessage('.alert-success-msg', 'تصویر موجود تایید شد.', 3500);
//                $(".mg-btn.active").removeClass('submittedbyadmin').addClass("confirmed");
//                $(".mg-btn.active").closest('.signHolder').removeClass("pending").addClass("confirmed");

//                $(".mg-btn.active").siblings("span.sign").html(svgConfirmed);
//            } else {
//                showAlertMessage('.alert-msg', 'مشکلی پیش آمد.', 3500);
//            }


//        },
//        error: function (err) {
//            console.log(err);
//            showAlertMessage('.alert-msg', 'مشکلی پیش آمد.', 3500);

//        }
//    });

//}


function submitOP() {
    $.ajax({
        async: false,
        type: 'POST',
        url: submitAll,
        headers: { "RequestVerificationToken": antiForgeryToken },
        data: { operations, employeeId: employeeId, workshopId: workshopId },
        success: function (response) {
            if (response.success) {
                showAlertMessage('.alert-success-msg', response.message, 3500);
                _RefreshCheckerCountMenu();
                $('#personnelDocumentsAjax').html('');
                pageIndexJs = 0;
                loadPersonnelDocuments(mode, searchName);
                $('#MainModal').modal('hide');

            } else {
                showAlertMessage('.alert-msg', response.message, 3500);
            }
        },
        error: function (err) {
            console.log(err);
            showAlertMessage('.alert-msg', err.message, 3500);

        }

    });
}

function showAlertMessage(selector, message, timeout) {
    $(selector).show();
    $(selector + ' p').text(message);
    setTimeout(function () {
        $(selector).hide();
        $(selector + ' p').text('');
    }, timeout);
}

function checkSubmit() {
    if (operations.length > 0) {
        $("#submitOP").removeClass("disable");
    } else {
        $("#submitOP").addClass("disable");

    }
}