// JavaScript Document
$(document).ready(function () {

    var portfolioWidth;
    var currLeft;
	var imageIs;
    var animation = 0;

    $('#race-moving-slider').each(function () {
        var count = $(this).children('div.race-product').length;
        $(this).css({
            'width': (count * 292) + 'px'
        });
    });

    $('#move-right').click(function () {
        portfolioWidth = $('#race-moving-slider').width();
        currLeft = $('#race-moving-slider').css('left').replace('px', '');
        if (currLeft <= 0 && currLeft > -(portfolioWidth - 876) && animation == 0) {
            animation = 1;
            $('#race-moving-slider').animate({
                'left': '-=' + '292px'
            },function () {
                animation = 0;
            });
        } else {
            if (currLeft == -(portfolioWidth - 876) && animation == 0) {
                animation = 1;
                $('#race-moving-slider').animate({
                    'left': '0px'},function () {
                    animation = 0;
                });
            }
        };
    });

    $('#move-left').click(function () {
        portfolioWidth = $('#race-moving-slider').width();
        currLeft = $('#race-moving-slider').css('left').replace('px', '');
        if (currLeft < 0 && currLeft >= -(portfolioWidth - 876) && animation == 0) {
            animation = 1;
            $('#race-moving-slider').animate({
                'left': '+=' + '292px'
            },


            function () {
                animation = 0;
            });
        } else {
            if (currLeft == 0 && animation == 0) {
                animation = 1;
                $('#race-moving-slider').animate({
                    'left': -(portfolioWidth - 876) + 'px'
                },function () {
                    animation = 0;
                });
            }
        };
    });
	
	$('.race-image').mouseenter(function(){
		$(this).addClass('over');
		$('.race-image:not(.over)').stop().animate({
			'opacity':'0.5'
		});
	}).mouseleave(function(){
		$('.race-image').stop().animate({
			'opacity':'1'
		});
		$(this).removeClass('over');
	});
	
	$('#race-moving-slider:not(.xmas) a').click(function(){
		var id = $(this).attr('id');
		var data = id.split('-');
		var productId = data[1];
		buildOverlay();
		loadContent(productId);
		return false
	});
	
	function buildOverlay() {
		$('body').append('<div id="race-overlay">&nbsp;</div>');
		$('body').append('<div id="overlay"><div class="container"></div></div>');
		$('#race-overlay').css({
			'width':$(window).width()+'px',
			'height':$(document).height()+'px',
			'opacity':'0.7'
		});
		$('#race-overlay').fadeIn();
		$('#overlay').fadeIn();
	}
	
	function loadContent(productId) {
		/*
		$('#overlay .container').append('<div id="race-collection-logo"><img src="/images/race-collection/race-collection-logo.gif" alt="Race Collection" width="208" height="69" /></div>');
		$('#overlay .container').append('<div id="race-product-image"><img src="/images/race-collection/large-product/large-product-1.png" alt="Long Sleeve Tee" width="319" height="314" /></div>');
		$('#overlay .container').append('<div id="race-product-information"><div id="race-product-text"></div></div>');
		$('#race-product-text').prepend('<a href="#" class="close-btn"><img src="/images/lime-green-close.gif" alt="Close" /></a><h2>long sleeve tee</h2>');
		$('#race-product-text').append('<p>The Gill Race Collection has been designed, tested and race proven for use in warmer conditions where weight, performance and protection can be the key to sucess.</p>');
		$('#race-product-text').append('<ul><li><span class="grey">waterproof</span></li><li><span class="grey">Light weight material</span></li><li><span class="grey">Breathable technology</span></li></ul>');
		$('#race-product-text').append('<p class="textAlignRight"><a href="#" class="find-out-more">FIND OUT MORE</a></p>');
		*/
		var html = $('#product-contents-'+productId).clone();
		$('#overlay .container').html(html);
		
		$('#move-left').children('img').animate({'opacity':'0.1'});
		$('#move-right').children('img').animate({'opacity':'0.1'});
		
		$('.close-btn').click(function(){
			$('#race-overlay').fadeOut(function(){
				$(this).remove();
			});
			$('#overlay').fadeOut(function(){
				$(this).remove();
			});
			$('#move-left').children('img').animate({'opacity':'1'});
			$('#move-right').children('img').animate({'opacity':'1'});
			return false;
		});
		if ($.browser.msie && $.browser.version.substr(0,1)<7) {
        	$(document).pngFix(); 
		}
		
	}
	
	
	$(document).keyup(function(event){
		if (event.keyCode == 27) {
			$('.close-btn').trigger('click');
		}
		if (event.keyCode == 37) {
			$('#move-left').trigger('click');
		}
		if (event.keyCode == 39) {
			$('#move-right').trigger('click');
		}
	});


});
