var active_filter = "all"; //or "male" or "female"

//------------------------------------------------------------------------------
//--- Overlay functions

var active_item;
var timeout_out;
var timeout_in;
var active_item_select = false;

function overlay_show(obj){
	clearTimeout(timeout_in);
	if(active_item && obj){
		if(obj != active_item) overlay_hide_final();
	}
	if(obj){
		active_item = obj;
	}
	if(obj == active_item) clearTimeout(timeout_out);
	timeout_in = setTimeout(function(){overlay_show_final(obj)},750);
}

function overlay_show_final(obj){
	/*
	 * Local function to set the background of the overlay
	 * Note that we shadow the variables, instead of creating a closure.
	 * This way we avoid any potnetial IE 6 memory leaks, and don't have to deal with the overhead
	 */
	var displayArrowOverlay = function(item_pos, edge_left, edge_right) {
		var leftImage, rightImage;

		if(item_pos < 550){
			overlay.style.marginLeft = "170px";
			leftImage = "images/carousel/overlay-lt-on.png";
			rightImage = "images/carousel/overlay-rt.png";
		}else{
			overlay.style.marginLeft = "-318px";
			leftImage = "images/carousel/overlay-lt.png";
			rightImage  = "images/carousel/overlay-rt-on.png";
		}

		if ((navigator.userAgent).indexOf("MSIE 6") == -1) {
			edge_left.style.backgroundImage = "url('" + leftImage + "')";
			edge_right.style.backgroundImage = "url('" + rightImage + "')";
		} else {
			edge_left.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + leftImage + "', sizingMethod='crop');";
			edge_right.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + rightImage + "', sizingMethod='crop');";
		}
	};


	//extend viewing area if there are fewer items than would fill it - hack to get overlay to show up in this scenario
	if(document.getElementById("mycarousel").offsetWidth < 935) document.getElementById("mycarousel").style.width = "935px";

	clearTimeout(timeout_out);
	var overlay;
	var divs = active_item.parentNode.parentNode.getElementsByTagName("div");
	for(i=0;i<divs.length;i++){
		if(divs[i].className == "overlay") overlay = divs[i];
	}

	//position the overlay
	var neg_offset = active_item.parentNode.parentNode.parentNode.offsetLeft;
	var item_pos = active_item.parentNode.parentNode.offsetLeft + neg_offset;

	var temp = overlay.getElementsByTagName("div");
	var edge_top;
	var edge_left;
	var edge_right;
	var edge_bot;
	var main;
	var body;

	// FIXME: this code seems REALLY sketch
	for(i=0;i<temp.length;i++){
		if(temp[i].className == "edge-top") edge_top = temp[i];
		if(temp[i].className == "edge-left") edge_left = temp[i];
		if(temp[i].className == "edge-right") edge_right = temp[i];
		if(temp[i].className == "edge-bot") edge_bot = temp[i];
		if(temp[i].className == "body") body = temp[i];
		if(temp[i].className == "main") main = temp[i];
	}

	displayArrowOverlay(item_pos, edge_left, edge_right);

	//IE 6/7 hack
	if((navigator.userAgent).indexOf("MSIE") != -1){
		overlay.style.display = "block";
		$(body).fadeIn(250);
		edge_top.style.display = "block";
		edge_left.style.display = "block";
		edge_right.style.display = "block";
		edge_bot.style.display = "block";
	//all other browsers
	}else{
		//Safari 2.x hack
		if((navigator.userAgent).indexOf("Safari") != -1){
			body.style.display = "block";
			edge_left.style.display = "block";
			edge_right.style.display = "block";
		}
		$(overlay).fadeIn(250);
		$(body).fadeIn(250);
		$(edge_top).fadeIn(250);
		$(edge_left).fadeIn(250);
		$(edge_right).fadeIn(250);
		$(edge_bot).fadeIn(250);
	}

}

function select_open(state){
	active_item_select = state;
}

function overlay_hide(){
	clearTimeout(timeout_in);
	if(!active_item_select) timeout_out = setTimeout(function(){overlay_hide_final()},500);
}

function overlay_hide_final(){
	clearTimeout(timeout_out);
	var overlay;
	var divs = active_item.parentNode.parentNode.getElementsByTagName("div");
	for(i=0;i<divs.length;i++){
		if(divs[i].className == "overlay") overlay = divs[i];
	}

	var temp = overlay.getElementsByTagName("div");
	var edge_top;
	var edge_left;
	var edge_right;
	var edge_bot;
	var body;
	for(i=0;i<temp.length;i++){
		if(temp[i].className == "edge-top") edge_top = temp[i];
		if(temp[i].className == "edge-left") edge_left = temp[i];
		if(temp[i].className == "edge-right") edge_right = temp[i];
		if(temp[i].className == "edge-bot") edge_bot = temp[i];
		if(temp[i].className == "body") body = temp[i];
	}

	if((navigator.userAgent).indexOf("MSIE") != -1){
		edge_top.style.visibility = "hidden";
		edge_left.style.visibility = "hidden";
		edge_right.style.visibility = "hidden";
		edge_bot.style.visibility = "hidden";
		$(body).fadeOut(100, function(){
			overlay.style.display = "none";
			edge_top.style.display = "none";
			edge_left.style.display = "none";
			edge_right.style.display = "none";
			edge_bot.style.display = "none";
			edge_top.style.visibility = "visible";
			edge_left.style.visibility = "visible";
			edge_right.style.visibility = "visible";
			edge_bot.style.visibility = "visible";
		});
	}else{
		$(overlay).fadeOut(100);
		$(body).fadeOut(100);
		$(edge_top).fadeOut(100);
		$(edge_left).fadeOut(100);
		$(edge_right).fadeOut(100);
		$(edge_bot).fadeOut(100);
	}
}

//------------------------------------------------------------------------------
//--- Capture product data from inline HTML

var arr_items = new Array();
var items_count = 0;

var arr_items_active = new Array();
var items_active_count = 0;

var arr_pngs = new Array();

function capture_items(carousel){

	//put all product data from each <li> into an array of objects
	var items = $("#"+carousel+" li");
	
	for(i=0;i<items.length;i++){
		//create item object
		arr_items[items_count] = new Object;

		//item index
		arr_items[items_count].index = (i + 1);

		//item prodid
		arr_items[items_count].prodid = $(".carousel-product",items[i])[0].id;
		
		var arr_temp = items[i].getElementsByTagName("*");
				
		for(j=0;j<arr_temp.length;j++){
			
			//item name
			if(arr_temp[j].className == "item-name") arr_items[items_count].name = arr_temp[j].innerHTML;

			//item price
			if(arr_temp[j].className == "item-price") arr_items[items_count].price = arr_temp[j].innerHTML;

			//item size
			if(arr_temp[j].className == "item-size") arr_items[items_count].size = arr_temp[j].innerHTML;

			//item description
			if(arr_temp[j].className == "item-desc") arr_items[items_count].desc = arr_temp[j].innerHTML;

    		//item buy form
			if(arr_temp[j].className == "item-addtocartform") arr_items[items_count].addtocartform = arr_temp[j].innerHTML;
		
			//item url
			if(arr_temp[j].className == "item-url") arr_items[items_count].url = arr_temp[j].href;

			//item photo path
			if(arr_temp[j].className == "item-photo") arr_items[items_count].photo = arr_temp[j].value;
			
			//Alt images for gift bags
			if(arr_temp[j].className == "item-photo-male") arr_items[items_count].photoMale = arr_temp[j].value;
			if(arr_temp[j].className == "item-photo-female") arr_items[items_count].photoFemale = arr_temp[j].value;

			//item related thumb path
			if (arr_temp[j].className == "item-related-thumb") arr_items[items_count].related_thumb = arr_temp[j].src;
			
			//item related description
			if(arr_temp[j].className == "item-related-desc") arr_items[items_count].related_desc = arr_temp[j].innerHTML;

			//item related url
			if(arr_temp[j].className == "item-related-url") arr_items[items_count].related_url = arr_temp[j].href;

			//item gender
			if(arr_temp[j].className == "item-gender") arr_items[items_count].gender = arr_temp[j].value;

			//item type (temporary workaround for gift bag)
			if(arr_temp[j].className == "gift-bag hotspot-container") arr_items[items_count].type = "gift bag";

		}

		items_count += 1;
	}
}


//------------------------------------------------------------------------------
//--- jCarousel functions

var arr_images = new Array();

function carousel_start(){
	//Starts Carousel - Is this needed? Make into objects?

	//preload the filter-specific background images
	arr_images[0] = new Image();
	arr_images[0].src = "images/carousel/bg-female.jpg";
	arr_images[1] = new Image();
	arr_images[1].src = "images/carousel/bg-male.jpg";

	//turn on filtering menu
	document.getElementById("prod-filter").style.visibility = "visible";

	//set active item list
	arr_items_active = arr_items;

	//initialize the carousel
    jQuery('#mycarousel').jcarousel({
        itemLoadCallback: {
			onBeforeAnimation: mycarousel_itemLoadCallback,
			onAfterAnimation: tooltip
		},
		easing: "swing",
		animation: 1000
    });
}

function carousel_reset(filter_value){
	//Resets Carousel - Used by filter buttons inline. Make into objects?
	var arr_temp = new Array();
	var arr_temp_count = 0;

	//reset toggle buttons
	document.getElementById("filter-all").getElementsByTagName("a")[0].style.backgroundPosition = "0 3px";
	document.getElementById("filter-male").getElementsByTagName("a")[0].style.backgroundPosition = "0 3px";
	document.getElementById("filter-female").getElementsByTagName("a")[0].style.backgroundPosition = "0 3px";

	if(filter_value){

		//resort and create new source list
		//Why create new source list?? Don't we already have one?
		for(i=0;i<arr_items.length;i++){
			if(arr_items[i].gender == filter_value || arr_items[i].gender == "all"){
				arr_temp[arr_temp_count] = arr_items[i];
				arr_temp_count += 1;
			}
		}

		active_filter = filter_value;
		arr_items_active = arr_temp;
		document.getElementById("content-container").style.backgroundImage = "url(images/carousel/bg-"+filter_value+".jpg)";
		document.getElementById("filter-" + filter_value).getElementsByTagName("a")[0].style.backgroundPosition = "0 -47px";

	}else{ //Error catching, default to ALL if no value has been passed to Functions.
		active_filter = "all";
		arr_items_active = arr_items;
		document.getElementById("filter-all").getElementsByTagName("a")[0].style.backgroundPosition = "0 -47px";
		document.getElementById("content-container").style.backgroundImage = "url(images/carousel/bg-all.jpg)";
	}

	if((navigator.userAgent).indexOf("MSIE 7") == -1){
		$(document.getElementById("mycarousel")).fadeOut(500, function(){

			document.getElementById("mycarousel").style.visibility = "hidden";
			document.getElementById("mycarousel").style.display = "block";

			the_carousel.size(arr_items_active.length);
			the_carousel.reset();
			//the_carousel.reload(); //???

			document.getElementById("mycarousel").style.display = "none";
			document.getElementById("mycarousel").style.visibility = "visible";
			$(document.getElementById("mycarousel")).fadeIn(500);

		});
	}else{
		if(arr_items_active.length < 5) {
			the_carousel.size(5);
		} else {
			the_carousel.size(arr_items_active.length);
		}
		the_carousel.reset();
		//the_carousel.reload(); //???
	}
}

var mycarousel_itemList = arr_items;

function mycarousel_itemLoadCallback(carousel, state)
{
	the_carousel = carousel;
    for (var i = carousel.first; i <= carousel.last; i++) {
        if (carousel.has(i)) {
            continue;
        }

        if (i > arr_items_active.length) {
            break;
        }

        carousel.add(i, mycarousel_getItemHTML(arr_items_active[i-1]));

    }

	
	
	
	/* This hack is needed to add a second gift bag to the female filter  */
	if(active_filter == 'female'){
		var femaleGiftItem = '<div class="gift-bag hotspot-container"><div class="carousel-product dynamic-png" id="gift-bag-all" style="background-image: url('+arr_items[0].photo+');"> </div><a class="item-url hotspot" href="t-lacoste_gifting.aspx?id=0" title="Give it as a gift">Give as a gift</a></div>';
		if ((navigator.userAgent).indexOf("MSIE 7") == -1) {
			carousel.add((carousel.last + 1), femaleGiftItem);
		}
		else {
			carousel.add((carousel.first + 3), femaleGiftItem);
		}
		//addLastGift = false;
	}
	
	// Update the background PNGs by calling the dyanamic_png script again.
	if ((typeof DYNAMIC_PNGS != 'undefined') && DYNAMIC_PNGS) {
		$(document).ready(transformDynamicPngs);
	}
	
};

function mycarousel_getItemHTML(item){

	var mouseover = '';
	var mouseout = '';
	var item_html = '';
	var photo = item.photo;

	if(item.type != "gift bag"){ //temporary workaround for gift bag
	
		mouseover = 'overlay_show(this);';
		mouseout = 'overlay_hide();';

		item_html += '<div class="overlay" onmouseover="overlay_show_final();" onmouseout="overlay_hide();">';
		item_html += '	<div class="edge-top"></div>';
		item_html += '	<div class="main">';
		item_html += '		<div class="edge-left"></div>';
		item_html += '		<div class="body">';
		item_html += '			<div class="top">';
		item_html += '				<h3 class="item-name">' + item.name + '</h3>';
		item_html += '				<h5 class="item-size">' + item.size + '</h5>';
		item_html += '				<h4 class="item-price">' + item.price + '</h4>';
		item_html += '				<p class="item-desc">' + item.desc + '</p>';
		item_html += '				<fieldset>';
//		item_html += '					<label for="qty' + item.name + '">Quantity: </label>';
//		item_html += '					<select id="qty' + item.name + '" name="qty' + item.name + '" onfocus="select_open(true);" onblur="select_open(false);" onchange="select_open(false);">';
//		item_html += '						<option value="1">1</option>';
//		item_html += '						<option value="2">2</option>';
//		item_html += '						<option value="3">3</option>';
//		item_html += '						<option value="4">4</option>';
//		item_html += '						<option value="5">5</option>';
//		item_html += '					</select>';
//		item_html += '					<button type="submit">+ Buy Now</button>';
		item_html += '				<p class="item-addtocartform">' + item.addtocartform + '</p>';	        
//		item_html += '					</fieldset>';
		item_html += '				</fieldset>';
		item_html += '			</div>';
		item_html += '			<div class="bottom">';
		item_html += '				<a class="item-related-url" href="' + item.related_url + '"><img class="item-related-thumb" width="115" height="120" src="' + item.related_thumb + '" alt="" /></a>';
		item_html += '				<p class="base-link-4">' + item.related_desc + '</p>';
		item_html += '			</div>';
		item_html += '		</div>';
		item_html += '		<div class="edge-right"></div>';
		item_html += '	</div>';
		item_html += '	<div class="edge-bot"></div>';
		item_html += '</div>';

	}

	//Set giftbag variables
	if(item.type == "gift bag"){
		item.prodid = 'gift-bag-'+active_filter;
		if(active_filter == "male") photo = item.photoMale;
		if(active_filter == "female") photo = item.photoFemale;
	}
	
	item_html += '<div class="hotspot-container carousel-container">';
	item_html += '	<div class="carousel-product dynamic-png" id="'+item.prodid+'" style="background-image: url('+photo+');"> </div>';
	item_html += '	<a class="item-url" href="'+item.url+'" title="'+item.name+'" onmouseover="'+mouseover+'" onmouseout="'+mouseout+'"> </a>';
	item_html += '</div>';
	return item_html;

};


//------------------------------------------------------------------------------
//--- Other functions

var tooltip_show = true;
function tooltip(){
	if(tooltip_show && document.getElementById("mycarousel").getElementsByTagName("li").length > 5){
		var tooltip_timeout = setTimeout("tooltip_in()", 1000);
		tooltip_show = false;
	}
}

function tooltip_in(){
	$(document.getElementById("tooltip")).fadeIn(500, function(){
		var tooltip_timeout = setTimeout("tooltip_out()", 3000);

		//Hilite navigation arrows
		var speed = 300;
		var lolite = 0.10;

		var button_prev = get_by_class("content","div","jcarousel-prev");
		$(button_prev).fadeTo(speed,lolite,function(){
			$(button_prev).fadeTo(speed,1, function(){
				$(button_prev).fadeTo(speed,lolite,function(){
					$(button_prev).fadeTo(speed,1, function(){
						$(button_prev).fadeTo(speed,lolite,function(){
							$(button_prev).fadeTo(speed,1);
						});
					});
				});
			});
		});

		var button_next = get_by_class("content","div","jcarousel-next");
		$(button_next).fadeTo(speed,lolite,function(){
			$(button_next).fadeTo(speed,1, function(){
				$(button_next).fadeTo(speed,lolite,function(){
					$(button_next).fadeTo(speed,1, function(){
						$(button_next).fadeTo(speed,lolite,function(){
							$(button_next).fadeTo(speed,1);
						});
					});
				});
			});
		});

	});
}

function tooltip_out(){
	$(document.getElementById("tooltip")).fadeOut(500);
}

//  Home page promo

function home_promo(){
	var bWidth = $('body').width();
	var bHeight = $('body').outerHeight();

	$('#overlay-mask20').width(bWidth);
	$('#overlay-mask20').height(bHeight+60);

	$('#overlay-mask20').fadeTo("fast", 0.60, function(){

		$('#home-promo').css({left:( (bWidth/2) - ( $('#home-promo').width() / 2 ) )}).show();
		$('#home-promo').animate({top:'100px'},{queue:false,duration:500});

		$('#home-promo-close').click(function() {
			$('#overlay-mask20').hide();
			$('#home-promo').fadeOut();
		});

	});

}

$(document).ready(function () {
	$('#overlay-mask20').show();
	$('#overlay-mask20').fadeTo(10, 0.00);

	var t=setTimeout(home_promo,1400);
});