(function () {
    'use strict';

    angular
        .module('contestacaoApp')
        .directive('ferramentaFiltro', ferramentaFiltro);

    ferramentaFiltro.$inject = ['__env', 'ItemFiltro', 'statusContestacao'];

    /* @ngInject */
    function ferramentaFiltro(__env, ItemFiltro, statusContestacao) {
        let directive = {
            restrict: 'E',
            replace: true,
            templateUrl: __env.appPath + 'scripts/components/tools/filtro/ferramenta-filtro.directive.html',
            link: link,
            scope: false
        };

        return directive;

        function link(scope, element) {
            scope.vm.filterTemplatePath = __env.appPath + 'scripts/components/tools/filtro/templates/';

            /////////// BIND DOS PLUGINS  DE JQUERY-UI ///////////
            element.find(".lista-a, .lista-b").sortable({
                connectWith: ".listas",
                tolerance: "pointer",
                start: function () {
                    $('.area-menu-filtro').addClass('active');
                },
                beforeStop: function () {
                    scope.vm.hasFieldRequiredFilter = false;
                    $('.area-menu-filtro').removeClass('active');
                }
            });

            element.find(".lista-b").sortable({
                receive: createArrayFilter,
                stop: reorderArrayFilter,
                remove: destroyArrayFilter
            });

            $('body').on('focus', ".select-day", function () {
                $(this).datepicker({
                    altFormat: "yy-mm-dd",
                    dateFormat: 'dd/mm/yy',
                    altField: $(this).attr('data-altfield'),
                    minDate: $(this).attr('data-mindate'),
                    maxDate: $(this).attr('data-maxdate'),
                    nextText: "",
                    prevText: "",
                    onSelect: getSelectedDate
                });
            });

            //////////// CALLBACKS DE INTERAÇÃO DO JQUERY-UI SORTABLE ////////////
            function createArrayFilter(event, ui) {
                let itemFiltro = new ItemFiltro();
                let filtro = JSON.parse($(ui.item[0]).attr('data-obj'));

                itemFiltro.properties = filtro;
                itemFiltro.properties.Pesquisa = [];
                itemFiltro.name = filtro.Nome;
                itemFiltro.htmlNode = $(ui.item[0]);
                itemFiltro.htmlNode[0].addEventListener('click', scope.vm.changeCurrent, true);

                if (itemFiltro.properties.Template === null) {
                    itemFiltro.properties.Template = 'template-default';
                }

                itemFiltro.template = scope.vm.filterTemplatePath + itemFiltro.properties.Template + '.html';
                scope.vm.listaFiltroAtiva.addItem(itemFiltro);
                reorderArrayFilter(event, ui);
            }

            function reorderArrayFilter(event, ui) {
                scope.vm.listaFiltroAtiva.reorder();
                scope.vm.listaFiltroAtiva.setItemsStatus(ui);
                scope.$apply();
            }

            function destroyArrayFilter(event, ui) {
                let filtro = JSON.parse($(ui.item[0]).attr('data-obj'));

                let itemToRemove = scope.vm.listaFiltroAtiva.find(filtro.Nome);
                scope.vm.listaFiltroAtiva.removeItem(itemToRemove);

                //reorderArrayFilter(event, ui);
            }

            //////////////////////////// Eventos de interação na interface /////////////////////////////////////
            //
            scope.$watch('vm.listaFiltroAtiva.currentItem.properties.searchText', function (newValue, oldValue) {
                if (newValue === undefined) {
                    return;
                }
                if (newValue === oldValue) {
                    return;
                }

                let todosSelecionados = scope.vm.listaFiltroAtiva.currentItem.properties.ItensFiltro.length === scope.vm.listaFiltroAtiva.currentItem.properties.Pesquisa.length;
                if (todosSelecionados) {
                    return;
                }
                scope.vm.listaFiltroAtiva.currentItem.toggleCheck = false;
            });

            //abre a ferramenta de filtro
            scope.vm.toggleTool = function () {
                if (event) {
                    event.stopPropagation();
                }
                element.toggleClass('active');
            };

            // click - nos itens ativados na lista B
            scope.vm.changeCurrent = function () {
                let filtro = JSON.parse($(this).attr('data-obj'));
                let clickedItem = filtro.Nome;
                let currentItem = scope.vm.listaFiltroAtiva.find(clickedItem);

                if (!currentItem.activated) {
                    return;
                }
                scope.vm.listaFiltroAtiva.setCurrentItem(currentItem);
                scope.$apply();
            };

            // blur - inputs dos templates custom
            scope.vm.inputChangeValue = function (filterItem, value) {
                let currentItem = scope.vm.listaFiltroAtiva.find(filterItem.name);
                let nextItem = currentItem.getNext(scope.vm.listaFiltroAtiva);

                if (value === null) {
                    currentItem.clear();
                }

                if (nextItem) {
                    scope.vm.listaFiltroAtiva.validateNextItem();
                }
            };

            scope.vm.validaPercentual = function (filterItem) {
                let currentItem = scope.vm.listaFiltroAtiva.find(filterItem.name);
                if (currentItem.properties.Pesquisa[0] > 100) {
                    currentItem.properties.Pesquisa[0] = 100;
                }
            };

            // change - marcar/desmarcar um checkbox do template default
            scope.vm.check = function (filterItem, check, value) {
                let currentItem = scope.vm.listaFiltroAtiva.find(filterItem.name);
                let nextItem = currentItem.getNext(scope.vm.listaFiltroAtiva);

                if (check) {
                    currentItem.addItem(value);
                } else {
                    filterItem.toggleCheck = false;
                    currentItem.removeItem(value);
                }

                if (nextItem) {
                    scope.vm.listaFiltroAtiva.validateNextItem();
                }
            };

            // change - marcar/desmarcar o checkbox "todos" do template default
            scope.vm.toggleCheckAll = function (filterItem, check) {
                let currentItem = scope.vm.listaFiltroAtiva.find(filterItem.name);
                let nextItem = currentItem.getNext(scope.vm.listaFiltroAtiva);
                let visibleItens = currentItem.properties.ItensFiltro;
                currentItem.clear();

                if (scope.vm.listaFiltroAtiva.currentItem.properties.searchText) {
                    visibleItens = visibleItens.filter(function (item) {
                        if (item === null) {
                            return;
                        }

                        if (item.toLowerCase().indexOf(scope.vm.listaFiltroAtiva.currentItem.properties.searchText.toLowerCase()) !== -1) {
                            return item;
                        }
                    });
                }

                visibleItens.forEach(function (item) {
                    if (!check) {
                        currentItem.addItem(item);
                    } else {
                        currentItem.removeItem(item);
                    }
                });

                if (nextItem) {
                    scope.vm.listaFiltroAtiva.validateNextItem();
                }
            };

            // change = marcar/desmarcar radio do template "multi options"
            scope.vm.multiOptionsClearAll = function (filterItem) {
                $('.select-day').val('');

                filterItem.clear();
                scope.vm.listaFiltroAtiva.setItemsStatus();
                scope.vm.hasFieldRequiredFilter = false;
            };

            scope.vm.formatter = function (item, valor) {
                let template = item.Formatter;
                while (template.indexOf("{value}") > -1) {
                    template = template.replace("{value}", valor);
                }

                if (item.Nome === 'Contestacao') {
                    template = template.replace("{text-value}", statusContestacao.properties[valor].value);
                }

                return template;
            };

            /////////// CALLBACKS DE INTERAÇÃO DO JQUERY-UI DATEPICKER ///////////
            function getSelectedDate(date, datepicker) {
                let model = datepicker.input[0].name;
                let arrPos = $(datepicker.input[0]).data('arrayposition');
                let modelDate = $(this).datepicker('getDate').toJSON();
                let currentItem = scope.vm.listaFiltroAtiva.find(model);
                let nextItem = currentItem.getNext(scope.vm.listaFiltroAtiva);

                currentItem.properties.Pesquisa[arrPos] = modelDate;

                if (currentItem.properties.Tipo === 1) {
                    currentItem.invalid = !currentItem.properties.Pesquisa[0] || currentItem.properties.Pesquisa.length < 2;
                } else {
                    currentItem.invalid = false;
                }

                scope.$apply();

                if (nextItem) {
                    scope.vm.listaFiltroAtiva.validateNextItem();
                }
            }

        }
    }
})();
