(function() {
"use strict";

angular.module('shared')

    .component('popoverTarget', {
            require: {
                popoverCtrl: '^popover'
            },
            controller: 'PopoverTarget',
            templateUrl: '/shared/js/angular/ui/popover-target.html',
            transclude: true,
            bindings: {
                returnFocusClass: '@?',
                buttonClass: '@?',
                hasFocus: '<?',
                buttonRole: '@?',
                labelledBy: '@?',
                describedBy: '@?'
            }
        })
        .controller('PopoverTarget', ['$element', '$scope', function PopoverTargetCtrl($element,$scope) {
            var ctrl = this;

            ctrl.$onInit = function () {
                ctrl.popoverCtrl.addTarget(this);
            };

            ctrl.toggleOpen = function (event) {
                if(!$element.attr("disabled"))
                    ctrl.popoverCtrl.toggleOpen();
                event.stopPropagation();
            };

            ctrl.$postLink = function () {
                registerEvents();
            };

            ctrl.$onDestroy = function () {
                unregisterEvents();
            };

            ctrl.keyDown = function (event) {
                var keycode = event.keyCode;
                if (isEnterOrSpace(keycode)) {
                    event.preventDefault();
                    ctrl.toggleOpen(event);
                }
            };

            ctrl.getButtonClass = function() {
                var buttonClass = '';
                if (ctrl.returnFocusClass) {
                    buttonClass = ctrl.returnFocusClass;
                }
                if (ctrl.buttonClass) {
                    buttonClass += ' ' + ctrl.buttonClass;
                }
                return buttonClass;
            };

            function registerEvents() {
                if (ctrl.popoverCtrl.openOnHover()) {
                    $element.on('mouseenter', ctrl.popoverCtrl.onEnter);
                    registerTouchscreenEvents()
                }
                if(ctrl.popoverCtrl.openOnHover() && !ctrl.popoverCtrl.stayOpenOnHoverOff()) {
                    $element.on('mouseleave', ctrl.popoverCtrl.onLeave)
                }
            }

            function unregisterEvents() {
                $element.off('mouseenter', ctrl.popoverCtrl.onEnter)
                    .off('mouseenter', ctrl.popoverCtrl.onEnter)
            }

            function open() {
                ctrl.popoverCtrl.open()
            }

            ctrl.keyboardKeys = {
                enter:    13,
                space:    32
            };

            function isEnterOrSpace(keycode) {
                var keyboardKeys = ctrl.keyboardKeys;
                return keycode === keyboardKeys.enter
                    || keycode === keyboardKeys.space;
            }

            function registerTouchscreenEvents() {
                $element.on('touchend', function(event) {
                    event.preventDefault();
                    if (!ctrl.popoverCtrl.is_open) {
                        angular.element(event.target).closest('.popover').trigger('mousedown');
                    }
                    $scope.$apply(ctrl.toggleOpen(event));
                });
            }
        }]);
})();