// JavaScript Document

/* CLASSES */

/* VARIABLES */
var activeOption;
var active_overlay;

/**
 * @param name class name of the overlay you want to trigger.
 * @param bool false will hide the overlay, true will show it.
 * @return void
 */
function triggerOverlay(name, bool) {
	if(bool == undefined) bool = true;
	
	if((name != active_overlay) && active_overlay) {
		triggerOverlay(active_overlay, false);
	}
	if(bool) {
		active_overlay = name;
		jQuery("#" + name).fadeIn("slow");
		jQuery("#" + name).css("visibility", "visible")
	} else {
		jQuery("#" + name).fadeOut("slow");
	}
}

function getLipstickId(element) {
  var id = String(jQuery(element).attr('id')).substr(6);
  return id;
}

/* JQUERY DOC READY */
jQuery(document).ready(function() {
	
	// store the active carousel item. This will be used with the offical shopping cart.
	activeOption = jQuery(".carousel-item:first");
	
	/**
	 * functinality for the carousel items.
	 */
	jQuery(".carousel-item").mouseover(function() {
		var active_lipstick_id = String(jQuery(this).attr('id')).substr(6);
		jQuery("#color-title").text(ChooseColorLabel + " - " + options[getLipstickId(this)].name);
		jQuery(this).addClass("hot");
		jQuery(this).children(".option").addClass("big");
	}).click(function() {
		if(activeOption) activeOption.removeClass("active");
		activeOption = jQuery(this);
		activeOption.addClass("active");
		jQuery("#info-color-title").attr('value', options[getLipstickId(this)].name);
		jQuery("#info-color-upc").attr('value', options[getLipstickId(this)].upc);
		jQuery("#info-color-quantity").attr('value', '1');
	}).mouseout(function() {
	jQuery("#color-title").text(ChooseColorLabel);
		jQuery(this).removeClass("hot");
		jQuery(this).children(".option").removeClass("big");
	});
	
	activeOption.trigger("click");
	
	/**
	 * functionality for the caruousel menu
	 */
	jQuery(".carousel").mousemove(function(e) {
		var width = jQuery(".carousel").children().length * jQuery(".carousel-item").width();
		//trace(jQuery(this).x);
		//jQuery(".carousel-items").css("left", px(jQuery(".carousel-items").css("left")) - 1);
	});
	
	/**
	 * functionality for the "We Recommend" slide out.
	 */
	jQuery("#slide-out").bind("mouseenter", function() {
		jQuery(this).stop().animate({right:"0px"});
	}).bind("mouseleave", function() {
		jQuery(this).stop().animate({right:(0 - jQuery(this).width()) + "px"});
	}).children(".items").bind("mouseleave", function() {
		//jQuery(this).children(".ul").children(".li").stop().fadeTo("fast", "1.0").children(".tool-tip").stop().fadeOut(0);
		jQuery(this).children(".ul").children(".li").children(".tool-tip").stop(null, true).fadeOut("fast");
	}).children(".ul").children(".li").bind("mouseenter", function() {
		//jQuery(this).stop().fadeTo("fast", "1.0").siblings().stop().fadeTo("fast", "0.5").children(".tool-tip").stop().fadeOut(0);
		//jQuery(this).stop().fadeTo("fast", "1.0").siblings().stop().fadeTo("fast", "0.5").children(".tool-tip").css("display","none");
		jQuery(this).siblings().children(".tool-tip").stop(null, true).fadeOut("fast");
		
		//jQuery(this).children(".tool-tip").stop().css("display","block").fadeIn(0);
		jQuery(this).children(".tool-tip").stop(null, true).fadeIn("fast");
	}).children(".tool-tip").mousemove(function(e) {
		//jQuery(this).stop().fadeOut(0);
	});
});

