const DragComponent = {
    templateUrl: "/app/activity/drag.component.html",
    bindings: {
        activity: '<'
    },
    controller: function ($activity, $http) {
        let $ctrl = this;
        $ctrl.map = null;
        $ctrl.story = null;
        $ctrl.selected = null;
        $ctrl.showStory = false;
        $ctrl.changeImage = true;
        $ctrl.isComplete = false;
        $ctrl.$onInit = function () {

            //Get the story activity that belongs to this character activity
            $activity.getActivity($ctrl.activity.storyId).then(function (response) {
                $ctrl.story = response;
            });

            $http.get($ctrl.activity.mapUrl).then(function (response) {
                $ctrl.map = response.data;

                angular.forEach($ctrl.map.prompts, function (item, key) {
                    item.answer = []; //adds a place to put the actual answer
                });
            });
        }

        $ctrl.moveWordToPrompt = function (prompt, word) {
            //if prompt has the answer in the answerIDs list
            if (!prompt.answerIds.includes(word.id)) {
                prompt.invalid = true;
                return false;
            }

            prompt.invalid = false;
            if (prompt.answer.length + 1 >= prompt.required) //+1 because word hasnt been added yet
                prompt.complete = true; //to show prompt is complete

            //Check for full completion here and signal it somehow
            $ctrl.isComplete = checkIsComplete();

            return word;
        };

        $ctrl.canDragToPrompt = function (prompt) {
            //Wont allow a word to be dragged if theres already a word inside
            if (prompt.answer.length >= prompt.answerIds.length)
                return false;
            //else if 

            return true;
        }

        $ctrl.toggleStory = function () {
            $ctrl.showStory = !$ctrl.showStory;
        }

        function checkIsComplete() {
            var complete = true;

            $ctrl.map.prompts.forEach(function (prompt) {
                if (!prompt.complete)
                    complete = false;
            });

            return complete;
        }

        $ctrl.next = function () {
            //$activity.completeCurrentActivity(); //this action was moved to the goNextActivity in Sprint 2
            $activity.gotoNextActivity();
        }

    }
};