angular.module("eventTypeFilterGroup", [])
    .directive('eventTypeFilterGroup', function() {
        return {
            restrict: 'E',
            replace: true,
            transclude: true,
            scope: {
                selectedGroupName: '=',
                filterExpressionSet: '='
            },
            template: '<div class="event-type-filter-group">' +
                        '<div class="event-type-filter-group-name text-center">{{groupLabel}}</div>' +
                        '<div class="event-type-filter-group-control text-center">' +
                            '<div class="btn-group" role="group" ng-transclude>' +
                            '</div>' +
                        '</div>' +
                    '</div>',
            link: function(scope, elem, attrs) {
                scope.groupName = attrs['name'];
                scope.groupLabel = attrs['label'];

            }, // end of link
            controller: function ($rootScope, $scope) {
                this.addFilter =function (filter) {
                    if (typeof $scope.filters === 'undefined') {
                        $scope.filters = {};
                    }

                    $scope.filters[filter.expression] = filter;

                }

                this.updateFilterSelection = function(filterExpression) {
                    if ($scope.filters[filterExpression].isExclusive) {
                        $scope.filterExpressionSet = [$scope.filters[filterExpression].expression];
                    } else if ($scope.selectedGroupName != $scope.groupName || ($scope.filterExpressionSet.length == 1 && $scope.filters[$scope.filterExpressionSet[0]] && $scope.filters[$scope.filterExpressionSet[0]].isExclusive)) {
                        $scope.filterExpressionSet = [$scope.filters[filterExpression].expression];
                    } else {
                        var index = $scope.filterExpressionSet.indexOf(filterExpression);

                        if (index == -1) {
                            $scope.filterExpressionSet.push($scope.filters[filterExpression].expression);
                        } else {
                            $scope.filterExpressionSet.splice(index, 1);
                        }
                    }

                    $scope.selectedGroupName = $scope.groupName;
                    $rootScope.$broadcast('eventSelection::Reset');
                };

                this.isFilterActive = function(filterExpression) {
                    var isActive = false;

                    if ($scope.selectedGroupName == $scope.groupName) {
                        for (var i=0;i<$scope.filterExpressionSet.length;i++) {
                            if ($scope.filterExpressionSet[i] == filterExpression) {
                                isActive = true;
                            }
                        }
                    }

                    return isActive;
                };
            } // end of controller
        }; // end of directoive factory
    })
    .directive('eventTypeFilter', function() {
        return {
            restrict: 'E',
            require: '^eventTypeFilterGroup',
            scope: {},
            replace: true,
            template: '<button type="radio" class="btn btn-primary" ng-click="updateFilterSelection(expression);blurMe($event)" ng-class="{active: isFilterActive(expression)}">{{label}}</button>',
            link: function(scope, elem, attrs, parentController) {
                scope.name = attrs['name'];
                scope.label = attrs['label'];
                scope.expression = attrs['filterExpression'];
                scope.isExclusive = typeof attrs['isExclusive'] !== 'undefined' ? true : false;

                parentController.addFilter({
                    name: scope.name,
                    label: scope.label,
                    expression: scope.expression,
                    isExclusive: scope.isExclusive
                });

                scope.updateFilterSelection = function(filterExpression) {
                    parentController.updateFilterSelection(filterExpression);
                };

                scope.isFilterActive = function(filterExpression) {
                    return parentController.isFilterActive(filterExpression);
                };
            }, // end of link
            controller: function ($scope) {
                $scope.blurMe = function ($event) {
                  $event.target.blur();
                }
            } // end of controller
        }; // end of directoive factory
    });