(function() {
    "use strict";

    angular.module('shared')
        .component('menuItemPopover', {
            templateUrl: '/shared/js/angular/main-navigation/menu-item-popover.html',
            controller: 'MenuItemPopover',
            transclude: true,
            bindings: {
                buttonClass: '@?',
                itemClass: '@',
                menuItemName: '@',
                parentMenuItemName: '@?',
                headingLevel: '<?'
            }
        })
        .controller('MenuItemPopover', ['$timeout', 'menuItemPopoverAmbassador', '$element', '$scope', 'FeatureCheck',
                                        '$window', 'responsiveSiteService',
            function MenuItemPopover($timeout, menuItemPopoverAmbassador, $element, $scope, FeatureCheck, $window,
                                     responsiveSiteService) {
                var ctrl = this;

                ctrl.responsiveWidthLimit = responsiveSiteService.getResponsiveWidthLimit();

                ctrl.$onInit = function() {
                    ctrl.menuItemNameClass = 'js-' + ctrl.menuItemName.replace(/\W+/g, '-').toLowerCase() + '-' + ctrl.itemClass.replace(/\W+/g, '-').toLowerCase()
                    ctrl.firstItemClass = 'js-first-' + ctrl.itemClass;
                    ctrl.lastItemClass = 'js-last-' + ctrl.itemClass;
                    ctrl.navigationName = ctrl.parentMenuItemName ? ctrl.parentMenuItemName : 'Main Resource';
                    menuItemPopoverAmbassador.registerOnUpdateMenuItem($scope, onUpdateActiveMenuItem);
                    menuItemPopoverAmbassador.registerOnActivatedMenuItem($scope, onActivatedMenuItem);

                    ctrl.isResponsiveMainNavEnabled = responsiveSiteService.isMainNavigationResponsive();
                };

                ctrl.$postLink = function() {
                   $element.on('mousemove', onMouseMove);
                };

                ctrl.$destroy = function() {
                    $element.off('mousemove', onMouseMove);
                };

                ctrl.onOpenChanged = function(open) {
                    if (open) {
                        menuItemPopoverAmbassador.setActivePopoverCtrl(ctrl.popoverCtrl);
                    }
                };

                ctrl.closeSubMenu = function() {
                    ctrl.close();
                    $timeout(function() {
                        angular.element('.' + ctrl.menuItemNameClass).focus();
                    });
                };

                ctrl.setPopover = function(popoverCtrl) {
                    ctrl.popoverCtrl = popoverCtrl;
                    if (shouldInitializeOpen()) {
                        ctrl.popoverCtrl.open(true);
                    }
                };

                ctrl.close = function() {
                    ctrl.popoverCtrl.close();
                };

                ctrl.getButtonClass = function() {
                    if (shouldAddClass()) {
                        return ctrl.menuItemNameClass + ' ' + ctrl.buttonClass;
                    }
                    return ctrl.menuItemNameClass;
                };

                ctrl.contentKeyDown = function(event) {
                    if (typeof modalKeyDown == 'function') {
                        modalKeyDown(
                            event,
                            ctrl.close,
                            ctrl.menuItemNameClass,
                            ctrl.firstItemClass,
                            ctrl.lastItemClass);
                        event.stopPropagation();
                    }
                };

                function shouldInitializeOpen() {
                    var initOpen = ctrl.buttonClass && ctrl.buttonClass.indexOf('js-first') > -1 && menuItemPopoverAmbassador.getInitFirstSubMenuOpen();
                    if (ctrl.isResponsiveMainNavEnabled) {
                        return initOpen && ($window.innerWidth > ctrl.responsiveWidthLimit);
                    }
                    return initOpen;
                }

                function shouldAddClass() {
                    if (ctrl.popoverCtrl.isOpen()) {
                        return ctrl.buttonClass && ctrl.buttonClass.indexOf('js-last') === -1;
                    }
                    return ctrl.buttonClass;
                }

                function onMouseMove(event) {
                    ctrl.popoverCtrl.triangleCoordinates = menuItemPopoverAmbassador.getTriangleCoordinates(event);
                }

                function onUpdateActiveMenuItem(event, eventTarget) {
                    var isChild = $element.find(eventTarget).length > 0;
                    if (isChild && !ctrl.popoverCtrl.isOpen()) {
                        ctrl.popoverCtrl.open(true);
                        menuItemPopoverAmbassador.emitActivatedMenuItem(eventTarget);
                    }
                }

                function onActivatedMenuItem(event, eventTarget) {
                    var isChild = $element.find(eventTarget).length > 0;
                    if (!isChild && ctrl.popoverCtrl.isOpen()) {
                        $scope.$apply(function() {
                            ctrl.close();
                        });
                    }
                }
            }
        ])
})();