function sidebarToglle() {
    var sideBar = document.querySelector(".admin-side-bar");
    sideBar.classList.toggle("collapsed");
}

function toggleCol() {
    var col = document.querySelector('.hide-col');
    col.classList.toggle('show');
    
    var inputs = $(col).find('input');
    var select = $(col).find('select');

    inputs.removeClass('hasChanges');
    select.removeClass('hasChanges');
}

function toggleColBySelector(selector) {
    var col = document.querySelector(selector);
    col.classList.toggle('show');
}

function toggleRow() {
    var col = document.querySelector('.table-row-new');
    col.classList.toggle('show');
}

function toggleRowAccordion() {
    var id = this.dataset.row;
    var elemt = document.querySelector(id);
    elemt.classList.toggle('show');
}

$('.row-details').on('click', function () {
    //var id = this.dataset.datails;
    //console.log(id);

    //just template
    // todo use some logic for it
});

function updateQueryStringParameter(uri, key, value) {
    uri = uri.replaceAll('amp;', '');

    if (!value) {
        return uri;
    }

    var re = new RegExp("([?&])" + key + "=.*?(&|$)", "i");
    var separator = uri.indexOf('?') !== -1 ? "&" : "?";

    if (uri.match(re)) {
        return uri.replace(re, '$1' + key + "=" + value + '$2');
    }
    else {
        return (uri + separator + key + "=" + value);
    }
}

var sorTablejs = function (setting) {
    "use strict";

    //default
    var config = {
        targetTable: "table.sortable",
        cssAsc: "order-asc",
        cssDesc: "order-desc",
        cssBg: "sortable",
        selectorHeaders: "thead tr td div span.sortable-td"
    };

    if (setting instanceof String || typeof setting === "string") {
        config.targetTable = setting;
    } else if (typeof setting === "object") {
        Object.keys(setting).forEach(function (key) {
            config[key] = setting[key];
        });
    }

    function setEventToAllObject(elements, event, func) {
        Object.keys(elements).forEach(function (key) {
            elements[key].addEventListener(event, func, false);
        });
    }

    function getTableElement(elem) {
        var closest = function (th) {
            var parent = th.parentNode;
            if (parent.tagName.toUpperCase() === "TABLE") {
                return parent;
            }
            return closest(parent);
        };
        return closest(elem);
    }

    function getTableData(tableElem) {
        var data = [];
        for (var i = 1, l = tableElem.length; i < l; i++) {
            for (var j = 0, m = tableElem[i].cells.length; j < m; j++) {
                if (typeof data[i] === "undefined") {
                    data[i] = {};
                    data[i]["key"] = i;
                }
                data[i][j] = tableElem[i].cells[j].innerText;
            }
        }
        return data;
    }

    function removeTHClass(table, tableData) {
        var tableElem = table.querySelectorAll(config.selectorHeaders);
        Object.keys(tableElem).forEach(function (key) {
            tableElem[key].classList.remove(config.cssDesc);
            tableElem[key].classList.remove(config.cssAsc);
        });
    }

    function setTHClass(elem, sortOrder) {
        if (sortOrder === 1) {
            elem.classList.add(config.cssAsc);
        } else {
            elem.classList.add(config.cssDesc);
        }
    }

    function sortEvent(elem) {
        var table = getTableElement(elem);
        if (!table) {
            return;
        }

        var tableData = getTableData(table.querySelectorAll("tr"));
        var sortOrder = !elem.classList.contains(config.cssAsc) ? 1 : -1;

        var sortUrl = $(elem).data("sorturl");
        document.location.href = sortUrl;

        // use it when we don't use redirect
        //removeTHClass(table, tableData);
        //setTHClass(elem, sortOrder);
    }

    window.addEventListener("load", function () {
        try {
            var elem = document.querySelector(config.targetTable).querySelectorAll(config.selectorHeaders);

            document.querySelector(config.targetTable).classList.add(config.cssBg);
            setEventToAllObject(elem, "click", function (e) { sortEvent(e.target); });
        } catch (e) {
            console.log(e)
        }
    }, false);

    return this;
};
//Provisional
sorTablejs();


function setNotificationYet(container) {
    let notifyYetBell = $('<div class="notifyYetBell">');

    let bell = $('<span style="position: absolute; top: 25px; left: 25px;">');
    bell.html('<svg width="44" height="44" viewBox="0 0 44 44" fill="none" xmlns="http://www.w3.org/2000/svg">'
        + '<path fill-rule="evenodd" fill="#109CF1" clip-rule="evenodd" d="M22 2.76882C18.9787 2.76882 16.5 5.24754 16.5 8.26882C16.5 8.27156 16.5 8.27431 16.5 8.27706C16.5028 8.68644 16.5535 9.09223 16.645 9.48824C12.4969 11.4898 9.625 15.742 9.625 20.6438V28.8938C7.36354 28.8938 5.5 30.7574 5.5 33.0188C5.5 35.2803 7.36354 37.1438 9.625 37.1438H34.375C36.6365 37.1438 38.5 35.2803 38.5 33.0188C38.5 30.7574 36.6365 28.8938 34.375 28.8938V20.6438C34.375 15.742 31.5031 11.4898 27.355 9.48805C27.4472 9.09193 27.4975 8.68669 27.5 8.27687C27.5 8.27412 27.5 8.27137 27.5 8.26862C27.5 5.24734 25.0213 2.76882 22 2.76882ZM22 5.51882C23.5342 5.51882 24.7486 6.73234 24.75 8.26613C24.7491 8.36967 24.7404 8.47276 24.7286 8.57497C23.8501 8.37613 22.9373 8.26882 22 8.26882C21.0628 8.26882 20.1499 8.37606 19.2715 8.57497C19.2591 8.47267 19.2509 8.36983 19.25 8.26613C19.2514 6.73234 20.4658 5.51882 22 5.51882ZM22 11.0188C27.332 11.0188 31.625 15.3118 31.625 20.6438V30.2688C31.625 30.6335 31.7699 30.9832 32.0278 31.241C32.2856 31.4989 32.6353 31.6438 33 31.6438H34.375C35.1605 31.6438 35.75 32.2333 35.75 33.0188C35.75 33.8043 35.1605 34.3938 34.375 34.3938H9.625C8.8395 34.3938 8.25 33.8043 8.25 33.0188C8.25 32.2333 8.8395 31.6438 9.625 31.6438H11C11.3647 31.6438 11.7144 31.4989 11.9722 31.241C12.2301 30.9832 12.375 30.6335 12.375 30.2688V20.6438C12.375 15.3118 16.668 11.0188 22 11.0188Z" />'
        + '<path fill-rule="evenodd" fill="#90A0B7" clip-rule="evenodd" d="M15.125 38.5188C14.7603 38.5188 14.4106 38.6637 14.1527 38.9215C13.8949 39.1794 13.75 39.5291 13.75 39.8938C13.75 40.2585 13.8949 40.6082 14.1527 40.8661C14.4106 41.1239 14.7603 41.2688 15.125 41.2688H28.875C29.2397 41.2688 29.5894 41.1239 29.8473 40.8661C30.1051 40.6082 30.25 40.2585 30.25 39.8938C30.25 39.5291 30.1051 39.1794 29.8473 38.9215C29.5894 38.6637 29.2397 38.5188 28.875 38.5188H15.125Z" />'
        + '<path fill-rule="evenodd" fill="#90A0B7" clip-rule="evenodd" d="M33.7867 7.25367C33.6514 7.13404 33.4937 7.04227 33.3229 6.98359C33.152 6.92492 32.9712 6.90049 32.7909 6.91171C32.6105 6.92294 32.4342 6.96959 32.2719 7.049C32.1096 7.12841 31.9646 7.23903 31.8451 7.37453C31.7255 7.50992 31.6337 7.66756 31.575 7.83844C31.5164 8.00931 31.4919 8.19008 31.5031 8.37041C31.5144 8.55073 31.561 8.72706 31.6404 8.88935C31.7199 9.05163 31.8304 9.19667 31.9659 9.31618C34.5213 11.5704 36.3206 14.66 36.9127 18.1302C36.9744 18.4894 37.1763 18.8095 37.4739 19.02C37.7715 19.2305 38.1406 19.3142 38.4999 19.2527C38.8586 19.191 39.1782 18.9895 39.3887 18.6925C39.5991 18.3955 39.6832 18.0271 39.6224 17.6682C38.9207 13.5557 36.7971 9.90932 33.7867 7.25367Z" />'
        + '<path fill-rule="evenodd" fill="#90A0B7" clip-rule="evenodd" d="M11.2228 6.90188C11.0425 6.89048 10.8617 6.91472 10.6907 6.97325C10.5197 7.03177 10.362 7.12342 10.2265 7.24295C7.20872 9.89979 5.07686 13.5516 4.37467 17.6709C4.314 18.0302 4.39842 18.3989 4.6094 18.696C4.82039 18.9931 5.14068 19.1943 5.49991 19.2554C5.85923 19.3169 6.22829 19.2332 6.52592 19.0227C6.82355 18.8122 7.02537 18.4921 7.08707 18.1328C7.67959 14.6569 9.48043 11.5606 12.0419 9.30545C12.3151 9.06455 12.4816 8.72507 12.5048 8.36154C12.528 7.99801 12.406 7.64013 12.1655 7.36648C11.9252 7.09291 11.5861 6.92583 11.2228 6.90188Z" />'
        + '</svg>');

    notifyYetBell.append(bell);

    let notifyYetMessage = $('<div>');
    notifyYetMessage.addClass('colum-center');
    notifyYetMessage.append('<span class="bold-text">No notifications yet</span>');
    notifyYetMessage.append('<p style="text-align: center; margin-top: 4px;">When you get notificatios, they`ll shown up here</p>');

    container.addClass('colum-center');
    container.append(notifyYetBell);
    container.append(notifyYetMessage);
}

//$(document).ready(function () {
//    if ($('.notification-container').length > 0) {
//        //var notification = new GDDNotification('/notification', '.notification-container');

//        //notification.init();

//        var connection = new signalR.HubConnectionBuilder()
//            .withUrl('/notification')
//            .build();

//        connection.on('notify', function (response) {
//            processResponse(response,
//                function (data) {
//                    //console.log(data.items);

//                    let container = $('.notification-container');

//                    for (var i = 0; i < data.items.length; i++) {

//                        let url = `/ticketentity?filter.ticketId=${data.items[i].reletedTicket}`;

//                        let row = $('<div>');

//                        row.prop('class', 'notification-item');
//                        row.prop('id', `notify-${data.items[i].id}`);
//                        row.data('id', data.items[i].id);

//                        let notificationText = $('<span>', { text: data.items[i].message });
//                        let notificationLink = $('<a>', { text: 'Ticket', href: url });

//                        row.append(notificationText);
//                        row.append(notificationLink);

//                        row.on('click', function () {
//                            var current = $(this);

//                            connection.invoke('ReadMessage', current.data('id'));
//                        })

//                        container.append(row);
//                    }

//                },
//                function (mes) {
//                    //alert("Couldn't load data");
//                    console.log(mes);
//                });
//        });


//        connection.on('ReadSucces', function (response) {
//            processResponse(response,
//                function (data) {
//                    //console.log(data);

//                    $(`.notification-item#notify-${data}`).remove();

//                },
//                function (mes) {
//                    //alert("Couldn't load data");
//                    console.log(mes);
//                });
//        });


//        connection.start()
//            .then(function () {
//                connection.invoke('GetNotification');
//            })
//            .catch(error => {
//                console.error(error.message);
//            });

//        $('.notification').on('click', function () {

//            if ($('.notification-container').hasClass('show')) {
//                $('.notification-container').fadeOut('show');
//            }
//            else {
//                $('.notification-container').fadeIn('show');
//            }

//            $('.notification-container').toggleClass('show');
//        })

//    }

//});

function removeHasChanges(target) {

    let inputs = $(target).find('input');
    let select = $(target).find('select');

    inputs.removeClass('hasChanges');
    select.removeClass('hasChanges');
}

$(document).ready(function () {
    $('.make-dynamic-tag').select2({
        tags: true,
        placeholder: '...',
    });

    function changedValue() {
        let current = $(this);

        $(current).addClass('hasChanges');
    }

    $('.ticket-page form input').on('change', changedValue);
    $('.ticket-page form textarea').on('change', changedValue);
    $('.ticket-page form select').on('change', changedValue);

    $('form').on('submit', removeHasChanges);

});

function checkChanges(form) {

    return $(form).find('.hasChanges').length > 0 || $(form).find('.new-row').length > 1;
}

function ajaxSendForm(form) {
    let action = $(form).prop('action');
    var data = $(form).serialize();

    $.ajax({
        type: "POST",
        url: action,
        data: data,
        success: function () {
            window.reload();
        }
    });

}

function pageHaveUnsavedChanges(send) {

    let forms = $('.ticket-page form');
    let unsavedForms = [];

    for (let i = 0; i < forms.length; i++) {
        if (checkChanges(forms[i])) {
            unsavedForms.push(forms[i]);
        }
    }

    if (send) {
        for (let i = 0; i < unsavedForms.length; i++) {
            ajaxSendForm(unsavedForms[i]);
        }
    }

    return unsavedForms.length > 0;

}

$(document).ready(() => {
    $('.js-basic-single').select2({
        minimumResultsForSearch: 10
    });
});

$('.js-basic-multiple').select2({
    minimumResultsForSearch: 10
});

$('.js-basic-multiple').each((index, elem) => {
    $(elem).select2({
        placeholder: $(elem).data('placeholder'),
        height: '32px',
        minimumResultsForSearch: 10,
    });
});

$('.js-basic-multiple').on('change.select2', function () {
    customRenderText($(this));
});

$('.js-basic-multiple').on('select2:close', function () {

    customRenderText($(this));
});

$('.js-basic-multiple').on('select2:unselect', function () {

    customRenderText($(this));
});

$('.js-basic-multiple').on('select2:select', function () {

    customRenderText($(this));
});

function customRenderText(select) {
    $(select).next('span.select2').find('ul').html(function () {
        let count = select.select2('data').length;
        if (count > 1) {

            return "<span>" + count + " items selected </span>";
        }
    });
}

//select 2 autoopen while focus element via tab
$(document).on('focus', '.select2-selection.select2-selection--single', function (e) {
    $(this).closest(".select2-container").siblings('select:enabled').select2('open');
});

$('select.select2').on('select2:closing', function (e) {
    $(e.target).data("select2").$selection.one('focus focusin', function (e) {
        e.stopPropagation();
    });
});

function submitNoteForm() {
    var noteTypeId = $('#note-type-id').val();
    var noteText = $('#note-text-id').val();

    if (noteTypeId == -1) {
        alert("You must specify a note type.");
        return;
    }

    if (!noteText || !noteText.replace(/\s/g, '').length) {
        alert("Add note text please.");
        return;
    }

    $('#create-ticket-note-form').submit();
}

(function ($) {
    $.fn.isValid = function () {
        var validate = true;

        this.each(function () {
            if (this.checkValidity() == false) {
                validate = false;
            }
        });

        return validate;
    };
})(jQuery);