var imageSlider = function(holdingDiv, singleImage, bugMode, dCount){

	this.animating = false;
    this.speed = 200;
    this.itemCount = 0;
    this.currentItem = 1;
    this.holder = holdingDiv;
    if(singleImage === undefined) {
        this.single = false;
    } else {
        this.single = singleImage;
    }

    if(dCount === undefined) {
        this.displayCount = 1;
    } else {
        this.displayCount = dCount - 1;
    }

    if(bugMode === true) {
        this.speed = 1;
    }
    
    this.holderWidth = 0;
    this.itemWidth = [];
    var _this = this;

    this.init = function(){
        $(_this.holder + ' ul li').each(function(i,element){
            _this.itemCount++;
            _this.holderWidth += $(element).outerWidth(true);
            _this.itemWidth.push($(element).outerWidth(true));
        });

        $(_this.holder).css({
            'width' : _this.holderWidth + 'px'
        });
    };

    this.slide = function(direction)
    {
	    if(!_this.animating)
        {
	    	_this.animating = true;
	    	
			this.leftPos = parseInt($(_this.holder).css('left'));

			if(direction === "right")
			{
				if(_this.currentItem < _this.itemCount - _this.displayCount && !singleImage)
				{
					_this.currentItem += 1;
					this.leftPos -= _this.itemWidth[_this.currentItem - 1];
				}
				else if(_this.currentItem <= _this.itemCount - 1 && singleImage)
				{
					_this.currentItem += 1;
					this.leftPos -= _this.itemWidth[_this.currentItem - 1];
				}
			}
			else if(direction === "left")
			{
				if(_this.currentItem > 1)
				{
					_this.currentItem -= 1;
					this.leftPos += _this.itemWidth[_this.currentItem - 1];
				}
			}

            
            $(_this.holder).animate({
                left : this.leftPos
                }, _this.speed, function(){
                _this.animating = false;
            });
        }

    };
	
    this.slideTo = function(itemNumber)
    {

        this.leftPos = 0;

        for(var i=0; i < itemNumber; i++)
        {
            this.leftPos -= _this.itemWidth[i];
        }

        this.leftPos += _this.itemWidth[0];

        _this.currentItem = itemNumber;

        if(!_this.animating)
        {
            _this.animating = true;
            $(_this.holder).animate({
                left : this.leftPos
            }, 200, function(){
                _this.animating = false;
            });
        }

    };

    this.init();

};

var bigImageSlider = function(delay)
{
	var _this = this;
	this.count = $('ul#main-image-holder li').length;
	this.liWidth = $('ul#main-image-holder li#main-image-1').width();
	$('ul#main-image-holder').css('width',this.count * this.liWidth);
	this.sliding = false;
	this.currentItem = -1;
	this.theDelay = delay * 1000;
	this.slideDuration = 700;

	this.doSlide = function()
	{
		if(!_this.sliding)
		{
			_this.currentItem++;
			if(_this.currentItem >= _this.count){_this.currentItem = 0;}
			$('ul#main-image-holder').animate({left: (_this.currentItem * _this.liWidth) * -1}, {duration:_this.slideDuration, easing:'easeOutQuad', complete:function(){
					_this.sliding = false;
					_this.theTimer = setTimeout(_this.doSlide, _this.theDelay + _this.slideDuration);
			}});
			_this.sliding = true;
			clearTimeout(_this.theTimer);
		}
	};
	
	if(this.count < 2){
		$("#main-image-next-button").hide();
	} 

	this.theTimer = setTimeout(this.doSlide, this.theDelay + this.slideDuration);
};

// Tooltip Text Object

var toolTipText = {

    "homepage_help_tyre_size" : "Tyre Size Dummy Text",
    "homepage_help_number_plate" : "Number Plate Dummy Text",
    "homepage_help_car_model" : "Car Model Dummy Text",
    "cant_find_your_tyre" : "Can't find your tyre dummy texy",
    "refine_search_brand" : "Brand Dummy Text",
    "refine_search_tyre_type" : "Tyre Type Dummy Text",
    "refine_search_tyre_rating" : "Tyre Rating Dummy Text",
    "refine_search_driving_style" : "Driving Style Dummy Text",
    "refine_search_price" : "Price Dummy Text",
	
    "runflat" : "Runflat Dummy Text",
    "extraload" : "ExtraLoad Dummy Text",
	
    "refine_search_other_factors" : "Other Factors Dummy Text"
};

// Button Template Objects
// Left / Right: Default - Over State - Down State - Image Width
// Colour: Default - Over State - Down State

var allButtons = {};

allButtons.blackButton = {
    'left' : ['_includes/images/black-button-left.gif', '_includes/images/black-button-left-over.gif', '_includes/images/black-button-left-down.gif', 2],
    'right' : ['_includes/images/black-button-right.gif', '_includes/images/black-button-right-over.gif', '_includes/images/black-button-right-down.gif', 2],
    'middle' : ['_includes/images/black-button-middle.gif', '_includes/images/black-button-middle-over.gif', '_includes/images/black-button-middle-down.gif'],
    'height' : '26px',
    'colour' : ['#000000', '#000000', '#000000']
};

allButtons.smallBlackButton = {
    'left' : ['_includes/images/small-black-button-left.gif', '_includes/images/small-black-button-left-over.gif', '_includes/images/small-black-button-left-down.gif', 2],
    'right' : ['_includes/images/small-black-button-right.gif', '_includes/images/small-black-button-right-over.gif', '_includes/images/small-black-button-right-down.gif', 2],
    'middle' : ['_includes/images/small-black-button-middle.gif', '_includes/images/small-black-button-middle-over.gif', '_includes/images/small-black-button-middle-down.gif'],
    'height' : '23px',
    'colour' : ['#000000', '#000000', '#000000']
};

allButtons.redButton = {
    'left' : ['_includes/images/red-button-left.gif', '_includes/images/red-button-left-over.gif', '_includes/images/red-button-left-down.gif', 2],
    'right' : ['_includes/images/red-button-right.gif', '_includes/images/red-button-right-over.gif', '_includes/images/red-button-right-down.gif', 2],
    'middle' : ['_includes/images/red-button-middle.gif', '_includes/images/red-button-middle-over.gif', '_includes/images/red-button-middle-down.gif'],
    'height' : '26px',
    'colour' : ['#b20d13', '#b20d13', '#b20d13']
};

allButtons.beginCheckout = {
    'left' : ['_includes/images/begincheckout-button-left.gif', '_includes/images/begincheckout-button-left-over.gif', '_includes/images/begincheckout-button-left-down.gif', 3],
    'right' : ['_includes/images/begincheckout-button-right.gif', '_includes/images/begincheckout-button-right-over.gif', '_includes/images/begincheckout-button-right-down.gif', 9],
    'middle' : ['_includes/images/begincheckout-button-middle.gif', '_includes/images/begincheckout-button-middle-over.gif', '_includes/images/begincheckout-button-middle-down.gif'],
    'height' : '29px',
    'colour' : ['#ed1c24', '#ed1c24', '#ed1c24']
};

allButtons.disabled = {
    'left' : ['_includes/images/disabled-left.gif', '_includes/images/disabled-left.gif', '_includes/images/disabled-left.gif', 2],
    'right' : ['_includes/images/disabled-right.gif', '_includes/images/disabled-right.gif', '_includes/images/disabled-right.gif', 2],
    'middle' : ['_includes/images/disabled-middle.gif', '_includes/images/disabled-middle.gif', '_includes/images/disabled-middle.gif'],
    'height' : '26px',
    'colour' : ['#999999', '#999999', '#999999']
};

allButtons.beginCheckoutDisabled = {
    'left' : ['_includes/images/begincheckout-button-disabled-left.gif', '_includes/images/begincheckout-button-disabled-left.gif', '_includes/images/begincheckout-button-disabled-left.gif', 3],
    'right' : ['_includes/images/begincheckout-button-disabled-right.gif', '_includes/images/begincheckout-button-disabled-right.gif', '_includes/images/begincheckout-button-disabled-right.gif', 9],
    'middle' : ['_includes/images/begincheckout-button-disabled-middle.gif', '_includes/images/begincheckout-button-disabled-middle.gif', '_includes/images/begincheckout-button-disabled-middle.gif'],
    'height' : '29px',
    'colour' : ['#999999', '#999999', '#999999']
};

allButtons.smallDisabled = {
    'left' : ['_includes/images/small-disabled-left.gif', '_includes/images/small-disabled-left.gif', '_includes/images/small-disabled-left.gif', 2],
    'right' : ['_includes/images/small-disabled-right.gif', '_includes/images/small-disabled-right.gif', '_includes/images/small-disabled-right.gif', 2],
    'middle' : ['_includes/images/small-disabled-middle.gif', '_includes/images/small-disabled-middle.gif', '_includes/images/small-disabled-middle.gif'],
    'height' : '22px',
    'colour' : ['#999999', '#999999', '#999999']
};

// Preload the button images to avoid odd looking buttons

function preLoadButtons()
{
    var cacheImage;
    var cache = [];

    for(buttonName in allButtons)
    {
        for(var j=0; j<=allButtons[buttonName].left.length-1; j++)
        {
            if(typeof allButtons[buttonName].left[j] === "string")
            {
                cacheImage = document.createElement('img');
                cacheImage.src = allButtons[buttonName].left[j];
                cache.push(cacheImage);
            }
        }

        for(var jj=0; jj<=allButtons[buttonName].right.length-1; jj++)
        {
            if(typeof allButtons[buttonName].right[jj] === "string")
            {
                cacheImage = document.createElement('img');
                cacheImage.src = allButtons[buttonName].right[jj];
                cache.push(cacheImage);
            }
        }

        for(var jjj=0; jjj<=allButtons[buttonName].middle.length-1; jjj++)
        {
                if(typeof allButtons[buttonName].middle[jjj] === "string")
                {
                    cacheImage = document.createElement('img');
                    cacheImage.src = allButtons[buttonName].middle[jjj];
                    cache.push(cacheImage);
                }
            }
    }
}

// Function to deal with display of tooltips

function showPopup(objID,xPos,yPos,orientation)

{

    var text = "<p>" + toolTipText[objID] + "</p>";

    $('#tooltip-help').html(text);

    $('#tooltip-help').css( {
        "left" : xPos + 10,
        "top" : yPos
    } );

    // Use the .gif version if IE6.
    if($.browser.msie && $.browser.version == 6)
    {
        if(orientation == "left")
        {
            $('#tooltip-help').css( {
                "background-image" : "url('_includes/images/tooltip-left.gif')",
                "left" : xPos - 240
            } );
        }
        else if(orientation == "top")
        {
            $('#tooltip-help').css( {
                "background-image" : "url('_includes/images/tooltip-top.gif')",
                "left" : xPos - 115,
                "top" : yPos - 65
            } );
        }
        else
        {
            $('#tooltip-help').css("background-image", "url('_includes/images/tooltip-right.gif')");
        }
    }
    else
    {
        if(orientation == "left")
        {
            $('#tooltip-help').css( {
                "background-image" : "url('_includes/images/tooltip-left.png')",
                "left" : xPos - 240
            } );
        }
        else if(orientation == "top")
        {
            $('#tooltip-help').css( {
                "background-image" : "url('_includes/images/tooltip-top.png')",
                "left" : xPos - 115,
                "top" : yPos - 65
            } );
        }
        else
        {
            $('#tooltip-help').css("background-image", "url('_includes/images/tooltip-right.png')");
        }
    }

    $('#tooltip-help').css("display","block");

}

$(document).ready(function()
{
        preLoadButtons();

        // Build buttons on all DIVs containing the button class
        makeButton();

        // link:active fix for IE7 and below
        if($.browser.msie && $.browser.version <= "7.0")
        {
            $('a').bind('mouseup', function(){
                this.blur();
            });
        }

        var overlayOpen = false;

        $('#header-middle-links a').click(function(){

            var pElement = $(this).parent().attr('id');
            var p = $(this).position();
            var op;
            var maskWidth = $('#' + pElement).width();
            var xPos = $('#'+pElement).position();
            $('.dd-selected').removeClass('dd-selected');
            $('img.side-image').css('visibility','hidden');
            $('#' + pElement).addClass('dd-selected');
            $('#' + pElement + ' img.side-image').css('visibility','visible');

            $('.header-overlay').css('visibility','hidden');
            overlayOpen = false;

            if(pElement === "basket")
            {
            	if(navigator.appName === "Microsoft Internet Explorer" && parseInt(navigator.appVersion) <= 5){
	                $('#basket-overlay').css(
		                    {
		                        'visibility' : 'visible',
		                        'top' : p.top + 21,
		                       // 'left' : (($(window).width() - 960) / 2 + xPos.left - 4) + "px"
		                        'left' : ($(window).width() / 2) + 281 + "px"
		                    }
		                );
            	} else {
	                $('#basket-overlay').css(
	                    {
	                        'visibility' : 'visible',
	                        'top' : p.top + 21,
	                        //'left' : (($(window).width() - 960) / 2 + xPos.left - 6) + "px"
	                        'left' : ($(window).width() / 2) + 281 + "px"
	                    }
	                );
            	}

                $('#basket-overlay-mask').css(
                    {
                        'width' : maskWidth
                    }
                );

                op = $('#basket-overlay').position();
                $('#basket-overlay').css('left', op.left - 35 );
                overlayOpen = true;
            }
            else if(pElement === "login")
            {
                $('#login-overlay').css(
                    {
                        'visibility' : 'visible',
                        'top' : p.top + 21,
                        'left' : (($(window).width() - 960) / 2 + xPos.left + 20) + "px"
                    }
                );

                $('#login-overlay-mask').css(
                    {
                        'width' : maskWidth,
                        'left' : '2px'
                    }
                );

                overlayOpen = true;
            }
            else if(pElement === "search")
            {
                $('#search-overlay').css(
                    {
                        'visibility' : 'visible',
                        'top' : p.top + 21,
                        'left' : (($(window).width() - 960) / 2 + xPos.left + 20) + "px"
                    }
                );

                $('#search-overlay-mask').css(
                    {
                        'width' : maskWidth,
                        'left' : '2px'
                    }
                );
                overlayOpen = true;
            }
            return false;
        });

        //Language select overlay
        $('#language a').click(function(){
            closeIt();
            var pElement = $(this).parent().attr('id');
            var p = $(this).position();
            var op;
            var maskWidth = $('#language-content').width();
            var xPos = $('#'+pElement).position();
            $('.dd-selected').removeClass('dd-selected');
            $('img.side-image').css('visibility','hidden');
            $('#' + pElement).addClass('dd-selected');
            $('#' + pElement + ' img.side-image').css('visibility','visible');

            $('.language-overlay').css('visibility','hidden');
            overlayOpen = false;

                $('#language-overlay').css(
                    {
                        'visibility' : 'visible',
                        'top' : p.top + 15,
                        'left' : 8 + (($('#language').offset().left + $('#language').width()) - $('#language-overlay').width()) + "px"
                    }
                );
                // 'left' : (xPos.left + $('#'+pElement).width() + 155) + "px"
                //'left' : (($(window).width() - 960) / 2 + xPos.left + 20) + "px"

                $('#language-overlay-mask').css(
                    {
                        'width' : maskWidth,
                        'left' : '2px'
                    }
                );

                overlayOpen = true;

            return false;
        });

$('a#change-language-footer-link').click(function(){
    closeIt();

    var p = $(this).position();

    $('#footer-language-select').css(
        {
            'visibility' : 'visible',
            'top' : p.top + 15,
            'right' : '11px'

        }
    );

    return false;
});

        var closeIt = function()
        {
            $('.header-overlay, #footer-language-select').css('visibility','hidden');
            $('.dd-selected').removeClass('dd-selected');
            $('img.side-image').css('visibility','hidden');
        }
        
        $('p.basket-close').click(function(){ closeIt(); });
        $('body').click(function(){ closeIt(); });

        $('.header-overlay').click(function(){ return false; });

});




