(function() {
    'use strict';

    angular.module('shared')

        .component('slidePaneItem', {
            templateUrl: '/shared/js/angular/ui/slide-pane/slide-pane-item.html',
            transclude: true,
            controller: 'SlidePaneItemController',
            bindings: {
                item: '<'
            },
            require: {
                'slidePane': '^slidePane'
            }
        })

        .controller('SlidePaneItemController', ['$element', function($element) {
            var ctrl = this;
            ctrl.visible = true;

            ctrl.$onInit = function() {
                if (ctrl.item) {
                    var displayIndex = ctrl.slidePane.scrollModel.displayList.indexOf(ctrl.item);
                    ctrl.slidePane.addItem(ctrl);
                    ctrl.updateDisplay(displayIndex);
                }
            };

            ctrl.setItemCtrl = function(itemCtrl) {
                ctrl.itemCtrl = itemCtrl;
                if (ctrl.visible) {
                    itemCtrl.onVisible();
                }
            };

            ctrl.updateDisplay = function(displayIndex) {
                if (displayIndex !== -1) {
                    $element.css('position', 'relative');
                    $element.removeClass("visuallyHiddenLeft");
                    $element.css('order', displayIndex.toString());
                    ctrl.visible = true;
                    if (ctrl.itemCtrl) {
                        ctrl.itemCtrl.onVisible();
                    }
                } else {
                    $element.css('position', '');
                    $element.css('left', '');
                    $element.addClass("visuallyHiddenLeft");
                    ctrl.visible = false;
                }
            };

            ctrl.updateDisplayOffset = function(displayOffset) {
                $element.css('left', displayOffset + 'px');
            };

            ctrl.keydown = function(event) {
                if (event.keyCode === 9 && ctrl.item) {
                    var direction = (event.shiftKey) ? -1 : 1;
                    ctrl.slidePane.scrollModel.accessibleScroll(ctrl.item, direction);
                }
            };

            ctrl.keyup = function(event) {
                if (event.keyCode === 9 && ctrl.item) {
                    if (!ctrl.visible) {
                        ctrl.slidePane.scrollModel.accessibleScroll(ctrl.item);
                    }
                }
            }
        }])
})();