

(function() {
    var Y = NB.Lib;
    
    var CACHE_LIFETIME = 1000 * 15;

    NB.MarsPress.ImageNavigator = function(config) {
        NB.MarsPress.ImageNavigator.superclass.constructor.apply(this, arguments);

        // Arrows
        this._arrowLeft = this.get('arrowLeft');
        this._arrowRight = this.get('arrowRight');
        if(!this._arrowLeft || !this._arrowRight)
        {
            throw new Error('Arrow elements are not specified');
        }

        this._imageEl = this.get('element');
        if(this._imageEl == null)
        {
            throw new Error('Element is not specified');
        }

        this._arrowLeft.on('mouseenter', this._onMouseEnter, this);
        this._arrowRight.on('mouseenter', this._onMouseEnter, this);
        this._imageEl.on('mousemove', this._onMouseMove, this);
        this._imageEl.on('mouseenter', this._onMouseEnter, this);
        this._imageEl.on('mouseleave', this._onMouseLeave, this);
        this._imageEl.on('click', this._onMouseClick, this);

        this.publish('navigateLeft', {emitFacade : true});
        this.publish('navigateRight', {emitFacade : true});
    };

    NB.MarsPress.ImageNavigator.NAME = "imageNavigator";
    NB.MarsPress.ImageNavigator.ATTRS = {
        arrowLeft : {
            value : null
        },
        arrowRight : {
            value : null
        },
        element : {
            value : null
        },
        leftArrowEnabled : {
            value : true,
            setter : function(value) {
                if(!value)
                {
                    this._arrowLeft.setStyle('visibility', 'hidden');
                }
                return value;
            }
        },
        rightArrowEnabled : {
            value : true,
            setter : function(value) {
                if(!value)
                {
                    this._arrowRight.setStyle('visibility', 'hidden');
                }
                return value;
            }
        }
    };

    Y.extend(NB.MarsPress.ImageNavigator, Y.Base, {
        _createCache : function() {
            var xy = this._imageEl.getXY();
            var width = this._imageEl.get('offsetWidth');
            this._cache = {
                xy : xy,
                middleX : Math.round(xy[0] + width / 2),
                date : new Date().getTime()
            };
        },
        _displayArrows : function(mouseX, mouseY) {
            this._arrowRight.setStyle('visibility', 'hidden');
            this._arrowLeft.setStyle('visibility', 'hidden');
            
            var isLeft = this._isLeft(mouseX);

            if(isLeft && this.get('leftArrowEnabled'))
            {
                this._arrowLeft.setStyle('visibility', 'visible');                
            }
            else if(!isLeft && this.get('rightArrowEnabled'))
            {
                this._arrowRight.setStyle('visibility', 'visible');
            }
        },
        _getPositionData : function() {
            var time = new Date();
            
            if(!this._cache || time.getTime() - this._cache.date > CACHE_LIFETIME)
            {
                this._createCache();
            }

            return this._cache;
        },
        _isLeft : function(mouseX) {
            var positionData = this._getPositionData();
            return (mouseX < positionData.middleX);
        },
        _onMouseClick : function(e) {
            e.preventDefault();

            var isLeft = this._isLeft(e.pageX);
            if(isLeft && this.get('leftArrowEnabled'))
            {
                this.fire('navigateLeft', {offset : -1});
            }
            else if(!isLeft && this.get('rightArrowEnabled'))
            {
                this.fire('navigateRight', {offset : 1});
            }

        },
        _onMouseMove : function(e) {
            this._displayArrows(e.pageX, e.pageY);
        },
        _onMouseEnter : function(e) {
            this._displayArrows(e.pageX, e.pageY);            
        },
        _onMouseLeave : function(e) {
            this._arrowLeft.setStyle('visibility', 'hidden');
            this._arrowRight.setStyle('visibility', 'hidden');
        }
    });

})();



