var t;
var currentcolor = 'brilliantwhite';
var currenteffect = 'goldpearl';
var currentfinger = '502-562';
var ft;
var current = 0;
function showBottle(container, id) {
    if (currentcolor !== id && currenteffect !== id) {
        var currentbottle;
        if (container === "colours") {
            currentbottle = currentcolor;
        } else {
            currentbottle = currenteffect;
        }
        if (!$("#bottle-" + id).length) {
            $("#" + container + "-bottles").append('<img src="/Products/images/colours/bottles/co9' + id + '3fs.jpg" id="bottle-' + id + '" style="z-index:1;" />');
        } else {
            $("#bottle-" + id).css("z-index", "1");
            $("#bottle-" + id).css("display", "block");
        }
        $("#" + container + "-name").html($("#" + id + " img").attr("alt").replace(/ \- /g, "<br />"));
        $("#" + container + "-name").css("top", ((37 - $("#" + container + "-name").height()) / 2) + "px");
        $("#bottle-" + currentbottle).fadeOut(function() {
            $("#bottle-" + id).css("z-index", "100");

        });
		if (id === "raspbrryprft") {
			$("#allure-label").fadeIn();	
			$("#allure-text-mask").fadeOut();
		} else if (id !== "raspbrryprft" && currentbottle === "raspbrryprft") {
			$("#allure-label").fadeOut();	
			$("#allure-text-mask").fadeIn();
		}

        if (container === "colours") {
            currentcolor = id;
        } else {
            currenteffect = id;
        }
    }
}
function showFingerNail(id) {
    if (currentfinger !== id) {
        if (!$("#fingernail-" + id).length) {
            $("#fingernail").append('<img src="/Products/images/colours/fingernails/' + id + '.jpg" id="fingernail-' + id + '" style="z-index:1;" />');
			mt = setTimeout("showFingerLoader()", 500);
			$("#fingernail-" + id).load(function() {
				clearTimeout(mt);
				$("#fingerloader").css("display", "none");	
				$("#fingernail-" + currentfinger).fadeOut(function() {
					if (id === "519-559") {
						$("#allure-label2").fadeIn();	
						$("#allure-text2").fadeIn();
					}

					$("#fingernail-" + id).css("z-index", "100");
					currentfinger = id;
				});
			});
        } else {
            $("#fingernail-" + id).css("z-index", "1");
            $("#fingernail-" + id).css("display", "block");
			$("#fingernail-" + currentfinger).fadeOut(function() {
					if (id === "519-559") {
						$("#allure-label2").fadeIn();	
						$("#allure-text2").fadeIn();
					}
				$("#fingernail-" + id).css("z-index", "100");
				currentfinger = id;
			});
        }
					if (id !== "519-559" && currentfinger === "519-559") {
						$("#allure-label2").fadeOut();	
						$("#allure-text2").fadeOut();
					}
        $("#color-name").html($("#color-" + id + " img").attr("alt").replace(/ \- /g, "<br />"));
        $("#color-name").css("top", ((37 - $("#color-name").height()) / 2) + "px");
        $("#effect-name").html($("#effect-" + id + " img").attr("alt").replace(/ \- /g, "<br />"));
        $("#effect-name").css("top", ((37 - $("#effect-name").height()) / 2) + "px");
	}
}
function showFingerLoader() {
	$("#fingerloader").css("display", "block");	
}
$(document).ready(function() {
	$("#loader div").css("display", "block");
    $("#colours li").hover(
				function() {
				    $("#" + this.id + " img").animate({ top: "0px" }, 250);
				    t = setTimeout("showBottle('colours', '" + this.id + "')", 250);
				    return false;
				},
				function() {
				    clearTimeout(t);
				    $("#" + this.id + " img").animate({ top: "2px" }, 250);
				}
			);
    $("#effects li").hover(
				function() {
				    $("#" + this.id + " img").animate({ top: "0px" }, 250);
				    t = setTimeout("showBottle('effects', '" + this.id + "')", 250);
				    return false;
				},
				function() {
				    clearTimeout(t);
				    $("#" + this.id + " img").animate({ top: "2px" }, 250);
				}
			);
    $(".swatches li")
		.hover(
				function() {
				    $("#" + this.id + " img").animate({ top: "1px" }, 250);
				    return false;
				},
				function() {
				    $("#" + this.id + " img").animate({ top: "3px" }, 250);
				}
		)
		.click(function() {
			var ids = this.id.replace("color-", "").replace("effect-", "");
			showFingerNail(ids);
			$(".swatches li img:not(.swatches li#color-" + ids + " img, .swatches li#effect-" + ids + " img)").fadeTo(250, 0.4);
			$("#color-" + ids + " img, #effect-" + ids + " img").fadeTo(250, 1);
		}
	);
	$(".swatches li img:not(.swatches li#color-" + currentfinger + " img, .swatches li#effect-" + currentfinger + " img)").fadeTo(0, 0.4);
	
	switch(document.location.pathname) {
		case "/Products/Color/Colour-Effect.aspx":
			current = 0;
			break;
		case "/Products/Color/Default.aspx":
			current = 1;
			break;
		case "/Products/Color/Nail-Treatments.aspx":
			current = 2;
			break;
		case "/Products/Essentials/Nail-Treatments/Consumer.aspx":
			current = 2;
			break;
		case "/Products/Essentials/Nail-Treatments/Pro.aspx":
			current = 2;
			break;
		case "/Products/Color/colour-fashion.aspx":
			current = 3;
			break;
		case "/Products/Color/get-the-look.aspx":
			current = 3;
			break;
		case "/Products/Color/Nailstyle-Competition.aspx":
			current = 4;
			break;
		case "/Products/Color/Quiz.aspx":
			current = 5;
			break;
		case "/Products/Color/Colour-Video.aspx":
			current = 6;
			break;
		default:
			current = 0;
	}
	
	
	// Show Raspberry Parfait by default
	//
	if ($("#colour-column").length) {
		showFingerNail("519-559");
		$(".swatches li img:not(.swatches li#color-519-559 img, .swatches li#effect-519-559 img)").fadeTo(250, 0.4);
		$("#color-519-559 img, #effect-519-559 img").fadeTo(250, 1);
	}
	if ($("#colours").length) {
		showBottle("colours", "raspbrryprft");
	}
	// 
	
	if ($("#magazines").length) {
		magazines.initialize();
	}

});


var magazines = {

    transitionSpeed: 500,

    rotateSlides: function(newslide) {
        $("#magazines a").fadeOut(magazines.transitionSpeed);
        $("#magazines a#img" + newslide).fadeIn(magazines.transitionSpeed);
    },

    initializeNav: function() {
        $("#rotator-nav li").css("visibility", "visible").click(function() {
            if (this.id === "navnext") {
				if (currentslide < slidecount - 1) {
					currentslide += 1;
				} else {
					currentslide = 0;
				}
			} else {
				if (currentslide > 0) {
					currentslide -= 1;
				} else {
					currentslide = slidecount - 1;
				}
			}
            magazines.rotateSlides(currentslide);
        });
    },

    initialize: function() {
        var i = 0;
        var nav = $("<ul/>").attr("id", "rotator-nav").css("visibility", "hidden").appendTo("#magazines-wrapper");
		var prev = $("<li/>").attr("id", "navprev").html("prev").appendTo(nav);
		var next = $("<li/>").attr("id", "navnext").html("next").appendTo(nav);
        $("#magazines a").each(function() {
            var img = $(this);
            if (i > 0) {
                $(this).css("display", "none");
            }
            $(this).attr("id", "img" + i).css("position", "absolute").css("top", "0px");
            i++;
        });

		currentslide = 0;
        slidecount = i;
		if (slidecount > 1) {
			magazines.initializeNav();
		}
    }

}

	var ispro = false;
    function getMovieName(movieName) {
		if (navigator.appName.indexOf("Microsoft") !== -1) {
			return window[movieName];
		}
		else {
			return document[movieName];
		}
    }
	var i = 0;
	$.browser.msie6 = $.browser.msie && /MSIE 6\.0/i.test(window.navigator.userAgent) && !/MSIE 7\.0/i.test(window.navigator.userAgent) && !/MSIE 8\.0/i.test(window.navigator.userAgent);
	function NavigateTo(index) {
		if (index !== current && i > 0) {
			var goto;
			switch(index) {
				case 0:
					goto = "/Products/Color/Colour-Effect.aspx";
					break;
				case 1:
					goto = "/Products/Color/Default.aspx";
					break;
				case 2:
					goto = "/Products/Color/Nail-Treatments.aspx";
					break;
				case 3:
					goto = "/Products/Color/colour-fashion.aspx";
					break;
				case 4:
					goto = "http://www.cndnailstylecompetition.com/";
					break;
				case 5:
					goto = "/Products/Color/Quiz.aspx";
					break;
				case 6:
					goto = "/Products/Color/Colour-Video.aspx";
					break;
				default:
					goto = "/Products/Color/Default.aspx";
			}
			window.location = goto;
		}
		i++;
	}
	function ChangePage(index) {
		var pid;
		switch(index) {
			case 0:
				pid = (ispro) ? 1215 : 1214;
				break;
			case 1:
				pid = (ispro) ? 1208 : 1209;
				break;
			case 2:
				pid = (ispro) ? 1221 : 1220;
				break;
			case 3:
				pid = (ispro) ? 1211 : 1210;
				break;
			case 4:
				pid = (ispro) ? 1217 : 1216;
				break;
			case 5:
				pid = (ispro) ? 1213 : 1212;
				break;
			case 6:
				pid = (ispro) ? 1219 : 1218;
				break;
			default:
				pid = 0;
		}
		window.location = "/Products/Product.aspx/" + pid;
	}
	
	

function showModal() {
    if (!$("#modalbg").length) {
        $("body").append('<div id="modalbg"></div><div id="modal"><div id="modalheader"><h2 style="color:#000; line-height:35px; float:left; padding:0; margin:0;">ALL-ACCESS: Backstage at the Diego Binetti Show</h2><a href="#">Close</a></div><div id="modalcontent"><iframe src="all-access.aspx" height="520" width="640" frameborder="0"></iframe></div></div><div id="modala"></div>')
    }
    //if ($("#modal").height() > (getWindowHeight() - 200)) {
    //    $("#modalcontent").css("height", (getWindowHeight() - 200) + "px").css("overflow", "auto");
    //}
    //$("#modala").css("width", $("#modal").width() + "px");
    //$("#modala").css("height", $("#modal").height() + "px");
    $("#modala").css("width", "100px");
    $("#modala").css("height", "100px");
    $("#modala").css("left", ((getWindowWidth() / 2) - ($("#modala").width() / 2)) + "px");
    //$("#modala").css("top", ((getWindowHeight() / 2) - (($("#modala").height() + 20) / 2)) + "px");
    $("#modal").css("left", ((getWindowWidth() / 2) - ($("#modal").width() / 2)) + "px");
    $("#modal, modala").css("top", ((getWindowHeight() / 2) - (($("#modal").height() + 20) / 2)) + "px");

    if ($.browser.msie6) {
        $("select").css("visibility", "hidden");
        $("#modalbg, #modal, #modala").css("position", "absolute");
        $("#modalbg").css("height", getWindowHeight() + "px");
        $("#modal, #modala").css("top", (((getWindowHeight() / 2) + document.documentElement.scrollTop) - ($("#modal").height() / 2)) + "px");
        $("#modalbg").css("top", document.documentElement.scrollTop + "px");
        $(window).scroll(function() {
            $("#modal, #modala").css("top", (((getWindowHeight() / 2) + document.documentElement.scrollTop) - ($("#modal").height() / 2)) + "px");
            $("#modalbg").css("top", document.documentElement.scrollTop + "px");
        });
    }
    $(window).resize(function() {
        /*if ($("#modalcontent").css("overflow") == "auto") {
            $("#modalcontent").css("overflow", "visible").css("height", "auto");
        }
        if ($("#modal").height() > (getWindowHeight() - 200)) {
            $("#modalcontent").css("height", (getWindowHeight() - 200) + "px").css("overflow", "auto");
            $("#modala").css("height", $("#modal").height() + "px");
        }*/
        $("#modal, #modala").css("left", ((getWindowWidth() / 2) - ($("#modal").width() / 2)) + "px");
        $("#modal, #modala").css("top", ((getWindowHeight() / 2) - ($("#modal").height() / 2)) + "px");
        if ($.browser.msie6) {
            $("#modalbg").css("top", document.documentElement.scrollTop + "px");
        }
    });

    $("#modalbg").fadeTo(0, 0);
    $("#modalbg, #modala").css("display", "block");
    $("#modalbg").fadeTo("fast", 0.45, function() {
		$("#modala").animate({ height: $("#modal").height() + "px", top: $("#modal").css("top"), opacity: 1 }, "normal", function() {
			$("#modala").animate({ width: $("#modal").width() + "px", left: $("#modal").css("left") }, "normal", function() {
				$("#modal").css("display", "block");
				$(this).fadeOut("slow");
			});
		});
/*        $("#modala").fadeIn("slow", function() {
            $("#modal").css("display", "block");
            $(this).fadeOut("slow");
        });
*/    });

    $("#modalbg, #modalheader a").click(function() {
        hideModal();
        return false;
    });
}

function hideModal() {
    $("#modala").fadeIn("fast", function() {
        $("#modal").css("display", "none");
        $("#modala").fadeOut("fast", function() {
            $("#modalbg").fadeOut("fast", function() {
                $("#modalbg").css("display", "none");
				$("#modalbg, #modal").remove();
                if ($.browser.msie6) {
                    $("select").css("visibility", "visible");
                }
            });
        });
    });
    
}

function getWindowHeight() {
    return window.innerHeight ? window.innerHeight : $(window).height();
}

function getWindowWidth() {
    return $(window).width();
}
$(window).load(
		function() {
			$("#loader div").css("display", "none");
			$("#loader").fadeOut("slow");
			$("#magazines-wrapper").fadeIn();
			//console.log(getMovieName("flashObject"));
			getMovieName("flashObject").setSelected(current);
			//alert(getMovieName("flashObject"));
		}
);

