var table;
$(document).ready(function () {
    setTimeout(() => {
        checkPosition();
    }, 50);
    table = $("#example").DataTable({
        dom: "<flB<t>p>",
        scrollX: true,
        lengthMenu: [
            [10, 25, 50, -1],
            [10, 25, 50, "All"],
        ],
        ajax: {
            ajax: "data/objects.txt",
            url: "https://rms.rmto.ir/api/public/accident-251-points",
            type: "GET",
        },
        language: {
            sEmptyTable: "هیچ داده‌ای در جدول وجود ندارد",
            sInfo: "نمایش _START_ تا _END_ از _TOTAL_ ردیف",
            sInfoEmpty: "نمایش 0 تا 0 از 0 ردیف",
            sInfoFiltered: "(فیلتر شده از _MAX_ ردیف)",
            sInfoPostFix: "",
            sInfoThousands: ",",
            sLengthMenu: "نمایش _MENU_ ردیف",
            sLoadingRecords: "در حال بارگذاری...",
            sProcessing: "در حال پردازش...",
            sSearch: "جستجو:",
            sZeroRecords: "رکوردی با این مشخصات پیدا نشد",
            oPaginate: {
                sFirst: "برگه‌ی نخست",
                sLast: "برگه‌ی آخر",
                sPrevious: "قبلی",
                sNext: "بعدی",
            },
            oAria: {
                sSortAscending: ": فعال سازی نمایش به صورت صعودی",
                sSortDescending: ": فعال سازی نمایش به صورت نزولی",
            },
        },
        columns: [
            { data: "id" },
            { data: "province" },
            { data: "axis_name" },
            { data: "target" },
            { data: "operation" },
            { data: "actions" },
            { data: "cost" },
            { data: "progress" },
            { data: "end_date" },
            { data: "updated_at" },
            {
                className: "text-center",
                data: null,
                render: function (data) {
                    return `<div class="d-flex justify-content-center parent-btn">
          <button class="btn-dataTable edit_btn" title="بروزرسانی"><i class="fa fa-tasks icon-btnTable"></i></button>
          <div class="line-btn-table"></div>
          <button class="btn-dataTable location-button" title="مشاهده مکانی پروژه" ><i class="fa fa-eye icon-btnTable"></i></button>
          <div class="line-btn-table"></div>
          <button class="btn-dataTable image-show" title="مشاهده عکس ها"  ><i class="fa fa-image icon-btnTable"></i></button>
          </div>`;
                },
            },
        ],
        buttons: [
            {
                extend: "excelHtml5",
                title: "Excel",
                text:
                    '<div class="d-flex flex-column"><i class="fa mb-2 fa-book icon-color"></i>خروجی به اکسل</div>',
                messageTop: "251 نقطه پر تصادف مصوب سال 1395",
                exportOptions: {
                    columns: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10],
                },
                customize: function (xlsx) {
                    var sheet = xlsx.xl.worksheets["sheet1.xml"];

                    // Loop over the cells in column `C`
                    $('row c[r^="M"]', sheet).each(function () {
                        // Get the value

                        $(this).attr("s", "52");
                    });
                    $('row c[r^="N"]', sheet).each(function () {
                        // Get the value

                        $(this).attr("s", "52");
                    });
                },
            },
        ]
    });
    $("#example").on("click", "button.edit_btn", function () {



        $("#pointedit").modal("show");




        tr = $(this).closest("tr");
        row = table.row(tr);
        operationKol = row.data().operation;
        target = row.data().target;

        end_dateKol = row.data().end_date;

        costKol = row.data().cost;

        latKol = row.data().lat;

        lngKol = row.data().lng;

        actionsKol = row.data().actions;

        progressKol = row.data().progress;
        // $(".pishraft-input").val(progressKol);
        // $(".pishraft-input").html(progressKol);



        // $("[data-mask]").inputmask();
        //console.log(this.options.content)
        // let valueprogress = "";
        // let contentData = this.options.content;

        $("#pointid").val(row.data().id);

        $("#end-date").persianDatepicker({
            format: "MMMM YY",
            autoClose: true,
            viewMode: "month",
            dayPicker: {
                enabled: false,
            },
        });

        // if (contentData.accident251_point) {
        $("#operation").val(
            operationKol
        );
        $("#target").val(target);
        $("#action").val(actionsKol);
        $("#cost").val(costKol);
        //$("#allcost").attr('min', contentData.accident251_point.cost);
        $("#end-date").val(end_dateKol);
        // valueprogress = contentData.accident251_point.progress;


        $("#ac-point-lat").val(latKol);
        $("#ac-point-lng").val(lngKol);

        let test =
            '<div class="project-slider status-slider-body pr-2 pl-2 mb-5 mt-1">\
<input class="ex2" type="text" data-slider-step="1"  data-slider-value="' +
            progressKol +
            '"/></div> ';

        $("#sliderphysici").empty();

        $("#sliderphysici").append(
            '<label class="allslider-label" for="inputAddress2"> پیشرفت فیزیکی</label>'
        );
        $("#sliderphysici").append(test);

        $(".ex2").slider({
            min: 0,
            max: 100,
            formatter: function (value) {
                return value + "٪";
            },
            tooltip: "always",
            tooltip_position: "bottom",
        });




    });
    datePicker = $("#dateGiving").persianDatepicker({
        observer: true,
        format: "YYYY/MM/DD",
        altField: ".observer-example-alt",
    });
    // Editing Start

    // Editing End
    $(document).ready(function () {
        const $valueSpan = $(".valueSpan");
        const $value = $("#slider11");
        $valueSpan.html($value.val());
        $value.on("input change", () => {
            $valueSpan.html($value.val());
        });
    });
    $("#editor").on("click", function () {
        var formData = new FormData();
        formData.append("mohammad", $(".amaliat-input").val());
        for (var value of formData.values()) {
            console.log(value);
        }
    });
});

$("#editpoints").on("click", function () {
    saveEditedPoint();
    console.log("hayam");
});


function saveEditedPoint() {
    if (accident251EditedPointValidate()) {
        formData = new FormData();

        formData.append("actions", $("#action").val());
        formData.append("progress", $(".ex2").slider("getValue"));
        formData.append("cost", $("#cost").val());
        formData.append("end_date", $("#end-date").val());

        let lat = $("#ac-point-lat").val().slice(1, -1);
        let lng = $("#ac-point-lng").val().slice(1, -1);
        lat = lat.replace(/_/g, "");
        lng = lng.replace(/_/g, "");
        formData.append("lat", lat);
        formData.append("lng", lng);

        for (let i = 0; i < $("input[name=modalUpFile]")[0].files.length; i++) {
            formData.append(
                "point_files_" + i,
                $("input[name=modalUpFile]")[0].files[i]
            );
        }

        //if ($('.ex2').slider('getValue') >= $('.ex2').attr('data-slider-value')) {
        $("#pointedit").modal("hide");
        showLoaderScreen();
        $.ajax({
            url: "/accident-251-points/" + $("#pointid").val(),
            type: "POST",
            headers: {
                "X-CSRF-TOKEN": $('meta[name="csrf-token"]').attr("content"),
            },
            data: formData,
            cache: false,
            contentType: false,
            processData: false,
            success: function (result) {
                //console.log(result);
                console.log("movafagh");
                ajaxcalltable()
                // showAccident251Points();
            },
            error: function (error) {
                //console.log(error);
                hideLoaderScreen();
            },
        });
        /*} else {
          $('#sliderphysici').find('.slider-label').text('Ł¾ŪŒŲ´Ų±ŁŲŖ ŁŪŒŲ²ŪŒŚ©ŪŒ (Ł…Ł‚ŲÆŲ§Ų± Ų¬ŲÆŪŒŲÆ Ł†ŲØŲ§ŪŒŲÆ Ų§Ų² ŲÆŲ±ŲµŲÆ Ł‚ŲØŁ„ŪŒ Ś©Ł…ŲŖŲ± ŲØŲ§Ų´ŲÆ)');
          $('#sliderphysici').find('.slider-label').css('color', 'red');
        }*/
    }
}

function accident251EditedPointValidate() {
    let isValidate = true;

    if (!$("#action").val() || !checkPersianWordValidation($("#action").val())) {
        $("#action").addClass("is-invalid");
        isValidate = false;
    } else {
        $("#action").removeClass("is-invalid");
    }

    if (!$("#cost").val()) {
        $("#cost").addClass("is-invalid");
        isValidate = false;
    } else {
        $("#cost").removeClass("is-invalid");
    }

    if (!$("#end-date").val()) {
        $("#end-date").addClass("is-invalid");
        isValidate = false;
    } else {
        $("#end-date").removeClass("is-invalid");
    }

    if (!$("#ac-point-lat").val()) {
        $("#ac-point-lat").addClass("is-invalid");
        isValidate = false;
    } else {
        $("#ac-point-lat").removeClass("is-invalid");
    }

    if (!$("#ac-point-lng").val()) {
        $("#ac-point-lng").addClass("is-invalid");
        isValidate = false;
    } else {
        $("#ac-point-lng").removeClass("is-invalid");
    }

    return isValidate;
}

function checkPersianWordValidation(str) {
    let reg = /^[\u0600-\u06FF\s\.]+$/;

    if (!reg.test(str)) {
        return false;
    }
    return true;
}

function showLoaderScreen() {
    $(".starter-loader-container").css("display", "flex").hide().fadeIn();
}

function hideLoaderScreen() {
    $(".starter-loader-container").fadeOut();
}


function ajaxcalltable() {
    $.ajax({
        url: "https://rms.rmto.ir/api/public/accident-251-points",
        type: "GET",
        success: function (result) {
            // console.log(result.data[0]);
            $("#example").dataTable().fnClearTable();
            $("#example").dataTable().fnAddData(result.data);

            hideLoaderScreen();

            // Swal.fire({
            //   icon: "success",
            //   title: "ثبت موفقیت آمیز",
            //   text: "اطلاعات اولیه با موفقیت ثبت گردید!",
            //   confirmButtonText: "بستن",
            // });

            // $("#stepModalmaintenance").modal("hide");
        },
    });
}
$(document).on("load", function () {
    $(window).bind("resize", checkPosition);
});

function checkPosition() {
    if ($(window).width() < 1100) {
        $("#example_wrapper").css("margin-top", "50px");
    } else {
        $("#example_wrapper").css("margin-top", "");
    }
    if ($(window).width() < 555) {
        $(".content-center-dataTable").css("width", "260px");
        console.log("working");
    } else {
        $(".content-center-dataTable").css("width", "");
    }
    if ($(window).width() < 440) {
        $(".dataTables_filter input").css("width", "94px");
        $(".dataTables_filter").css("margin-bottom", "10px");
        $(".dt-buttons").addClass("d-flex");
        $(".dt-buttons").addClass("justify-content-center");
        $(".dt-buttons button").css("font-size", "10px");
    } else {
        $(".dataTables_filter input").css("width", "");
        $(".dataTables_filter").css("margin-bottom", "");
        $(".dt-buttons").removeClass("d-flex");
        $(".dt-buttons button").css("font-size", "");
        $(".dt-buttons").removeClass("justify-content-center");
        // pooria
    }
}