// HTML 
//
// Scripts in this document are used to add additional HTML tags and classes for styling purposes
// This HTML was not included in the basic page structure since it has no semantic purpose and is purely used as hooks for visual elements

// Loads up the various functions we are going to use
$(function () {

	// Adds a class to the body so I can style differently depending on whether Javascript is enabled.
	$("body").addClass('hasJS');
	$("body").addClass("jsenabled");

	// make checkout buttons nicer
	$(".edsNiceButton").append('<div class="cornerTR"></div><div class="cornerBR"></div><div class="cornerBL"></div>');
	//field wrapping
	$(".field").wrap('<div class="fieldWrap"></div>');
	$("#allProducts .qtyInput").wrap('<div class="fieldWrap"></div>');
	$("#goog-wm-qt").wrap('<div class="textareaWrap"></div>');
	$("textarea").wrap('<div class="textareaWrap"></div>');
	//highlighting
	$("#highlights").wrapInner('<div class="corner"></div>');
	//help header
	$("#helpHeader").wrapInner('<div class="inner1"><div class="inner2"><div class="inner3"></div></div></div>');
	//account header
	$("#myAccountHeader").wrapInner('<div class="inner1"><div class="inner2"><div class="inner3"></div></div></div>');
	//meal header
	$(".mealHeader").wrapInner('<div class="inner1"><div class="inner2"><div class="inner3"></div></div></div>');
	//help boxed
	$(".helpRow .helpBox:not(a)").click(function () {
		window.location = $(this).find("a").attr("href");
		return false;
	});
	$(".helpDetail .helpBox h2 a").parent().parent().parent().hover(
		function () { $(this).addClass('helpBoxActive'); },
		function () { $(this).removeClass('helpBoxActive'); }
	);
	//box-expand
	$(".boxExpand h3 a").live('click', function () { $('.boxExpand .co_inner').toggle(); return false; });
	//brochure box
	$(".brochure").wrapInner('<div class="inner1"><div class="inner2"><div class="inner3"></div></div></div>');
	$(".brochure").live('click', function () { window.location = $(this).find("a").attr("href"); return false; });
	//lists
	$("ul li:first-child").addClass('firstLi');
	$("ul li:last-child").addClass('lastLi');
	$("ol li:first-child").addClass('firstLi');
	$("ol li:last-child").addClass('lastLi');
	//scroll-more
	$("body").prepend('<span id="scrollMore">Scroll for More <em>&darr;</em></span>');
	//fix for ie6, which doesn't support position:fixed
	//-- disabeld for ie6, it was too buggy apparently. it is being blamed for unexplained ie6 crashes.
	if ($('#scrollMore').css('position') == 'absolute') {
		$('#scrollMore').hide();
	}
	else {
		//set opacity dependent on scroll position
		$(window).scroll(function () {
			var opacity = 1.3 - ($(window).scrollTop() / 500);
			if (opacity > 1) opacity = 1;
			if (opacity < 0) opacity = 0;
			$('#scrollMore').fadeTo(50, opacity);
		});
		$('#scrollMore').click(function () {
			$('html,body').animate({ scrollTop: $(window).scrollTop() + 400 + 'px' }, 300);
		}).hover(function () {
			$(this).fadeTo(200, 1);
		});
	}

	// name the five highlights needed for the rotation
	$('#highlights li').prepend('<img class="bkgImg" src="../images/highlightSub.png" />');

	// name the five highlights needed for the rotation
	$('#highlights li').removeClass();
	$('#highlights li:first-child').addClass('hl01');
	$('#highlights li:first-child + li').addClass('hl02');
	$('#highlights li:first-child + li + li').addClass('hl03');
	$('#highlights li:first-child + li + li + li').addClass('hl04');
	$('#highlights li:last-child').addClass('hl00');

	// rotate highlights from left to right eg. no1 becomes no2...
	$('#highlights li:first-child').bind('click', function () {
		$('#highlights li:last-child').remove().prependTo('#highlights');
		$('#highlights li:first-child').css({ top: "400px", left: "0" });
		// zero item - moves from left side to 1st
		$('#highlights li:first-child').animate({
			top: "334px",
			left: "55px",
			width: "191px",
			height: "142px",
			opacity: 1
		}, 1000);
		// 1st item - moves to 2nd
		$('#highlights li:first-child + li').animate({
			top: "317px",
			left: "247px",
			width: "225px",
			fontSize: "1.1em",
			borderWidth: "6px"
		}, 1000);
		// 2nd item - moves to 3rd
		$('#highlights li:first-child + li + li').animate({
			top: "334px",
			left: "473px",
			width: "191px",
			fontSize: "13px",
			borderWidth: "5px"
		}, 1000);
		// 3rd item - moves off the right side
		$('#highlights li:first-child + li + li + li').animate({
			top: "400px",
			left: "717px",
			width: "0px",
			height: "0px",
			fontSize: "0px",
			opacity: 0
		}, 1000, function () {
			nameHLs();
			$('#highlights li').attr({ style: "" });
		});
	});
	//soft brochure title
	$(".softBrochure").each(function () {
		var softBrochure = $(this).text();
		$(this).css({ 'margin-top': '-100px' });
		$("h1").css({ 'width': '80%', 'line-height': '0.7em' });
		$("h2.subheading").css({ 'width': '80%', 'margin-top': '-0.5em' });
	});
	//collapse-box
	$(".collapseBox").addClass('collapseBoxOpen');
	$(".collapseBoxOpen + .collapseBoxOpen").toggleClass("collapseBoxClosed");
	$(".collapseBoxOpen .collapseTitle").nextAll().wrap('<div class="collapseBoxInner"></div>');
	$(".collapseBoxOpen .collapseTitle").click(function () {
		$(this).parent().toggleClass("collapseBoxClosed");
	});
});