/// <reference path="../Edentity.Global.js" />
/// <reference path="../External/jquery-1.4.1-vsdoc.js" />

Agility.RegisterNamespace("SDM.Modules.TierAPromotionalSlider");

(function(TierA, $) {

	var defaults = {
		RotationSpeed: 2000,
		transitionSpeed: 'slow',
		transitionType: 'fade'
	};

	var _currentIndex = 0;
	var _maxItems = 3;
	var _properties = null;
	var _mainImage = null;
	var _pager = null;
	var _dataItems = null;
	var _pagerItems = null;
	var _timerCallback = null;

    TierA.Init = function(p) {

        _properties = $.extend({ }, defaults, p || { });
        _mainImage = _properties.Container.find('.Image');
        _pager = _properties.Container.find('.Pager');
        _dataItems = _properties.ImagesContainer.find('a');
        _pagerItems = _properties.Container.find('.Pager .Item');

        // If the number of items is less than the allowable max
        if (_dataItems.length < 3) {
            _maxItems = _dataItems.length;
        }

        // Hide the item tabs if there are not enough items
        for (var i = 0; i < _pagerItems.length; i++) {
            if (i < _maxItems) {
                _pagerItems.eq(i).show();
            }
        }

        if (_maxItems > 1) {

            // Pause transition when cursor hovers over image
            _mainImage.hover(function() {
                clearInterval(_timerCallback);
            }, function() {
                _timerCallback = setInterval(function() {
                    updateSlide(++_currentIndex % _maxItems);
                }, _properties.RotationSpeed);
            });

            renderSlider();
            startSlides();
        }
        else {

            // No transition if 1 slide
            displaySlide(0);

            // Option #1: Remove tabs and enlarge the image (i.e. remove overflow)
            _pager.hide();
            _mainImage.css('overflow', 'visible');

            // Option #2: Display only one tab
            // var link = _dataItems.eq(0);
            // if (link.length > 0) {
            //		_pagerItems.append($('img', link).attr('alt'));
            // }			
            // updatePagerState(0);
        }
    };

	function startSlides() {

		updateSlide(0);

		_timerCallback = setInterval(function() {
			updateSlide(++_currentIndex % _maxItems);
		}, _properties.RotationSpeed);
	};

	function updateSlide(index) {
		if (isNaN(index)) return;

		_mainImage.fadeOut('slow', function() {

			displaySlide(index);

			$(this).fadeIn();

			updatePagerState(index);
		});
	};

	function renderSlider() {

		_pagerItems.each(function(i) {
			var link = _dataItems.eq(i);
			if (link.length > 0) {
				$(this).append($('img', link).attr('alt'));
			}

			$(this).bind('click', function() {
				_currentIndex = i;
				updateSlide(i);

				clearInterval(_timerCallback);
				_timerCallback = setInterval(function() {
					updateSlide(++_currentIndex % _maxItems);
				}, _properties.RotationSpeed);
			});

		});
	};

	function displaySlide(index) {
		var srcImg = _dataItems.eq(index).find("img");
		if (srcImg.length == 0) return;
		
		var href = _dataItems.eq(index).attr('href');
		var title = _dataItems.eq(index).attr('title') || "";

		var img = $('<img />').css('border', 0).attr('src', srcImg.attr('src')).attr('alt', title).attr('title', title);

		if (href && href != null && href != '') {
			var a = $('<a></a>').attr('href', href);
			_mainImage.html('').append(a.append(img));
		} 
		else {
			_mainImage.html('').append(img);
		}
	};

	function updatePagerState(index) {
		_pagerItems.each(function(i) {
			if (i == index) {
				$(this).addClass('ItemHover');
			} else {
				$(this).removeClass('ItemHover');
			}
		});
	};

})(SDM.Modules.TierAPromotionalSlider, jQuery);