/**
* A directive that will execute a function when user clicks out of the current
* element. By specifying filter, one can also extend this functionality to other
* elements, meaning that when user clicks on that element it will not count as
* an out click. By specifying include you can tell which elements will count as
* an out click. Include is useful only when you want to trigger an out click on
* of the children of the element itself.
*
* Example
*
* ```html
* <div fr-click-out="close()" fr-click-out-filter="#openBtn, .header-nav" fr-click-out-include=".close-btn">
* 	...
* </div>
* ```
*/
angular.module('fr.clickOut', [])

.directive('frClickOut', ['$document', '$parse', function ($document, $parse) {
    // Checks if any of elements defined by selectors in filter contain target.
    // In other words checks if one of the filtered elements has been clicked.
    function targetInFilter(target, filter) {
        var filteredElements = angular.element($document[0].querySelectorAll(filter));
        var totalElements = filteredElements.length;

        for (var i = 0; i < totalElements; ++i) {
            if (filteredElements[i].contains(target)) {
                return true;
            }
        }

        return false;
    }

    // Run the checks to see if we need to run click out handler or not.
    function isClickOut(element, event, filter, include) {
        // 	Make sure clicked element is not one of the included elements.
        if (include && targetInFilter(event.target, include)) {
            return true;
        }

        // Make sure clicked element is not inside our element.
        if (element[0].contains(event.target)) {
            return;
        }

        // Make sure clicked element is not one of filtered elements.
        if (filter && targetInFilter(event.target, filter)) {
            return;
        }

        return true;
    }

    return {
        restrict: 'A',
        link: function (scope, element, attrs) {
            var clickOutHandler = $parse(attrs.frClickOut)(scope);
            var filter			= attrs.frClickOutFilter;
            var include			= attrs.frClickOutInclude;

            // Listen for clicks on the whole document.
            $document.bind('click', handle);

            scope.$on('$destroy', function () {
                $document.off('click', handle);
            });

            function handle(event) {
                if (isClickOut(element, event, filter, include)) {
                    clickOutHandler(event);
                    scope.$apply();
                }
            }
        },
    };
}]);