"use strict";

angular.module("vocabulary")
    .component("categorySelector", {
        templateUrl: "/js/redesign-angular/categories/category-selector.html",
        controller: "CategorySelector",
        bindings: {
            isOpen: '<'
        }
    })

    .directive('setFocus', function(){
        return{
            scope: {setFocus: '='},
            link: function(scope, element){
                if (scope.setFocus) {
                    element[0].focus();
                }
            }
        }
    })

    .controller("CategorySelector", ["$window", "$scope", "categoryService", "lessonService", "accessRestriction",
        function($window, $scope, categoryService, lessonService, accessRestriction) {
            var ctrl = this;

            ctrl.$onInit = function () {
                ctrl.showCategoryList = ctrl.isOpen;
                categoryService.refreshCategoryList()
                    .then(chooseDefaultCategory);
            };

            function chooseDefaultCategory() {
                if (!lessonService.categoryIsChosen()) {
                    var defaultCategory = categoryService.getCategoryList()[0];
                    lessonService.chooseCategory(defaultCategory);
                }
            };

            ctrl.toggleCategoryList = function (event) {
                if(event) {
                    event.preventDefault();
                    event.stopPropagation();
                }
                accessRestriction.enforceRestriction({'openCategorySelector':true})
                    .then(function () {
                        ctrl.showCategoryList = !ctrl.showCategoryList;
                    }).catch(function(e) {});
            };

            ctrl.ignoreClick = function(event) {
                event.stopPropagation();
            };

            ctrl.doKeyDown = function(event){
              modalKeyDown(event, ctrl.toggleCategoryList, "popover-target");
            };

            $window.onclick = function() {
                if(ctrl.showCategoryList) {
                    ctrl.showCategoryList = !ctrl.showCategoryList;
                    $scope.$apply();
                }
            };

            ctrl.getCategoryList = categoryService.getCategoryList;

            ctrl.chooseCategory = lessonService.chooseCategory;

            ctrl.getChosenCategoryName = function () {
                if (lessonService.categoryIsChosen() && categoryService.getCategoryList().size() > 0) {
                    var id = lessonService.getChosenCategoryId();
                    var chosenCategory = categoryService.getCategory(id);
                    if (chosenCategory) {
                        return chosenCategory.categoryName;
                    }
                }
                return "Uncategorized";
            }
        }]);