"use strict";

angular.module("vocabulary")
    .component("dropDownFilter", {
        templateUrl: "/js/redesign-angular/premadeLessons/premadeFilters/drop-down-filter.html",
        controller: "DropDownFilterController",
        bindings:{
            filterTitle: "<",
            levels: "<",
            resources: "<",
            filterField: "<",
            categoryId: "<",
            onFilterChanged: "&"
        }
    })
    .controller("DropDownFilterController", [
        function (){
            var ctrl = this;
            this.$onInit = init;

            function init(){
                 var defaultSelectAllLevels = {
                     topicId : ctrl.categoryId,
                     name: 'Show All'
                 };

                 var hasDefault = ctrl.levels.filter(function(level){
                     return level.topicId === ctrl.categoryId;
                 });

                 if (hasDefault.length === 0){
                     ctrl.levels.unshift(defaultSelectAllLevels);
                 }

                 ctrl.selectedLevel = defaultSelectAllLevels.topicId;
                 ctrl.selectedLevelIsSet = true;

                 ctrl.filterSelected();

            }



            ctrl.filterSelected = function(){
                var showAll = ctrl.selectedLevel === ctrl.categoryId;
                var filteredResources = [];
                if(showAll){
                    filteredResources = ctrl.resources;
                }
                else{
                    filteredResources = ctrl.resources.filter(function(resource){
                        return ctrl.selectedLevel === resource[ctrl.filterField];
                    });
                }
                ctrl.onFilterChanged({
                    $event:{
                        filteredResources: filteredResources
                    }
                });
            }
        }
    ]);