/*** JavaScript fuer I-wie-Ida **/

// Bugfix fuer IEx bei Hintergrund-Bildern
try {
	document.execCommand('BackgroundImageCache', false, true);
} catch (e) {}

var iex = 0;
var agent = navigator.userAgent.toLowerCase();
if (agent.indexOf("msie") > -1) {
	iex = 1;
}

var navi = ("navi_0", "navi_1", "navi_2", "navi_3", "navi_4", "navi_5");
var current_bg = "bg0";

var default_shirt_type_1 = "longsleeve";
var default_shirt_type_2 = "tshirt";
var default_shirt_color = "rosa";
var default_shirt_collection = "ida deluxe - Kollektion A";
var default_shirt_gender = "B";
// Array fuer den Bestellprozess
// 1. Shirt-Typ: longsleeve, tshirt (Standard: tshirt)
// 2. Farbe: weiss, rosa, hellblau, grau, schwarz (Standard: weiss)
// 3. Groesse
// 4. Motiv
// 5. Text 1: z.B. "I" bei "I wie Ida"
// 6. Text 2: z.B. "Ida" bei "I wie Ida"
// 7. Stoff
// 8. Schnitt / Geschlecht
var order_array = new Array(default_shirt_type_1, default_shirt_color, "", default_shirt_collection, "i", "ida", "", default_shirt_gender);
// Flag fuer Fehler im Bestellprozess (z.B. fehlende Angaben): 1. Angaben zum Shirt; 2. Angaben zum Besteller
var error_order_form;
var error_order_form_2;
// Flag fuer das Sprungziel im Bestellprozess nach unvollstaendigen Daten
var jump_to_step;
// Flag zum Zuruecksetzen des Bestellprozesses (z.B. nach Abschicken des Formulares)
var reset_order_form = 0;
// Hintergrundbild des 1. Navi-Punktes
var bg_image_navi_0 = $("#navi_0").css("background-image");
// Standardtext des 6. Navi-Punktes (Ueberschrift des Kontaktformulars)
var header_contact = $("#navi_5_content h3").html();
// Regulaerer Ausdruck zum Verifizieren von E-Mail-Adressen
var email_regex = /^[a-zA-Z0-9\-\.\_]+\@[a-zA-Z0-9\-\.]+\.([a-zA-Z]{2,6}|[0-9]{1,3})$/;


$("#imprint").click(
	function () {
		resetMetanavi();
		$(this).addClass("hover");
		$("#navi_0_content").fadeOut("slow", function() {
			$("#navi_0").css({
				"background-image": "none"
			})
		});
		$("#imprint_content").fadeIn("slow");
        return false;
	}
);

function resetMetanavi() {
	$("#imprint").removeClass("hover");
	$("#navi_0").css({
		"background-image": bg_image_navi_0
	})
}

$("#washing_notes").click(
	function () {
		resetMetanavi2();
		$(this).addClass("hover");
		$("#navi_2_content").fadeOut("slow");
	}
);
$("#show_washing_notes").click(
	function () {
		$("#navi_2_link").trigger('click');
		$("#washing_notes").trigger('click');
	}
);

function resetMetanavi2() {
	$("#washing_notes").removeClass("hover");
}

// Metanavi unter "Mehr Dinge"
$("#meta_4 a").click(
    function() {
        if ( !$(this).hasClass("hover") ) {
            $("#meta_4 a").removeClass("hover");
            $(this).addClass("hover");
            $("." + $(this).attr("id")).fadeIn().prevAll("div").fadeOut();
        }
        
        return false;
    }
);


function reset_order_form_func(existing_set) {
	// Array der Bestelldaten auf Standard zuruecksetzen
	order_array = new Array(default_shirt_type_1, default_shirt_color, "", default_shirt_collection, "i", "ida", "");
	// Hidden-Fields leeren
	$("#orderform input[type=hidden]").val("");
	// beide Template-Values wieder setzen
	$("#orderform input[name=template]").val("order.txt");
	$("#orderform input[name=template2]").val("order_customer.txt");
	// Radio-Buttons zuruecksetzen
	$("#orderform [type=radio]").removeAttr("checked");
	// Stoffmuster demarkieren
	$("#center2 div").each(
		function () {
			$(this).removeClass("current");
		}
	);
	// Stoff-Nr. bei Check reseten
	$("#order_5").html("");
	// Position des Bestellprozesses auf Seite 1 zuruecksetzen
	$("#breadcrumb li#breadcrumb_1").trigger('click');
	reset_order_form = 0;

	// falls ein Array uebergeben wurde, dann die noetigen Werte alle vorsetzen/-selektieren
	if(existing_set) {
		// Karussell resetten
		reset_caroussell(2, div_width2);
		
		// Bestell-Array setzen
		order_array = existing_set;
		
		// Longsleeve oder T-Shirt setzen
		if (order_array[0] == "tshirt") {
			$("#shirt_short").trigger("click");
		} else {
			$("#shirt_long").trigger("click");
		}
		
		// im Schritt 5 die Werte in die Textfelder einsetzen bzw. Radiobuttons auswaehlen
		var reg = /.$/;
		var collection_letter = reg.exec(order_array[3]);
		// Texte setzen
		$("#" + collection_letter + "_text_1").val(order_array[4]);
		$("#" + collection_letter + "_text_2").val(order_array[5]);
		// Radiobutton setzen bei B/C/D
		if (collection_letter == "B" || collection_letter == "C" || collection_letter == "D") {
			$("." + collection_letter + "_input").each(
				function () {
					if($(this).val() == order_array[5]) {
						$(this).attr("checked", "true");
					}
				}
			);
		}

		// Karussell "Stoffe" positionieren
		var pattern = order_array[6];
		
		if(pattern > 8) {
			var caroussell_id = "carussell2";
			var center_id = "center2";
			var col_num = Math.ceil(pattern/2);
			var move = (col_num - 4) * div_width2;
			var left_max = (count_cols2 - 2) * div_width2;
			var left_min = 0 - div_width2;
			var step = div_width2;
			
			var step_count = 0;
			
			for(var i = 1; i <= count_cols2; i++) {
				var new_left_pos = step_count - move;
				if(new_left_pos < left_min) {
					new_left_pos = left_max - (move - step_count) + (2 * div_width2);
				}
				$("#" + caroussell_id + " #" + center_id + " div#col" + i).css({ "left": new_left_pos + "px" });
				step_count += step;
			}
		}
	}
}

$("#navi_0_link").click(
	function () {
		$("#navi_0").animate({
			top: "0px",
			height: "290px"
		});
		hideOthers(this, 0);

		// Hintergrundbild im body tauschen
		if (current_bg != "bg0" && !iex) {
			$("#bg0").show();
			$("#" + current_bg).fadeOut("slow", function () {
				// z-index fuer das alte und das neue Bild tauschen
				$("#bg2").css({ zIndex: "2" });
				$("#" + current_bg).css({ zIndex: "1" });
				current_bg = "bg0";
				// Verlauf-Bild (Hintergrund) tauschen
				$("body").css({
					backgroundImage: "url(/images/0_home/bg_verlauf_0.jpg)"
				});
			});
		} else if (current_bg != "bg0" && iex) {
			// statischer Bild-Tausch fuer IEx
			$("#bg0").show();
			$("#" + current_bg).hide();
			$("#bg0").css({ zIndex: "2" });
			$("#" + current_bg).css({ zIndex: "1" });
			current_bg = "bg01";
			// Verlauf-Bild (Hintergrund) tauschen
			$("body").css({
				backgroundImage: "url(/images/0_home/bg_verlauf_0.jpg)"
			});
		}
		// Stoff-Bild tauschen
		$("#content_container").css({
			backgroundImage: "url(/images/0_home/stoff0.gif)"
		});
		// Text-Hintergrundbild tauschen
		$("#logo").css({
			backgroundImage: "url(/images/0_home/bg_text0.gif)"
		});
		// Logo-Bild tauschen
		$("#logo a img").attr({
			src: "/images/0_home/label_0.gif"
		});

		// normaler Content-DIV wieder einblenden (kann ja sein, dass derzeit Impressum zu sehen ist)
		$("#navi_0_content").fadeIn("slow");
		// Metanavi zuruecksetzen
		resetMetanavi();
		// Video im 1. Tab einblenden
		$("#video_iwieida").show();
	}
);

$("#navi_1_link").click(
	function () {
		// Verschiebung des 0. Navipunktes (= Startseite)
		moveNavi(0);
		$("#navi_1").animate({
			top: "20px",
			height: "290px"
		});
		hideOthers(this, 1);

		// Hintergrundbild im body tauschen
		if (current_bg != "bg1" && !iex) {
			$("#bg1").show();
			$("#" + current_bg).fadeOut("slow", function () {
				// z-index fuer das alte und das neue Bild tauschen
				$("#bg1").css({ zIndex: "2" });
				$("#" + current_bg).css({ zIndex: "1" });
				current_bg = "bg1";
				// Verlauf-Bild (Hintergrund) tauschen
				$("body").css({
					backgroundImage: "url(/images/1_wir_sinds/bg_verlauf_1.jpg)"
				});
			});
		} else if (current_bg != "bg1" && iex) {
			// statischer Bild-Tausch fuer IEx
			$("#bg1").show();
			$("#" + current_bg).hide();
			$("#bg1").css({ zIndex: "2" });
			$("#" + current_bg).css({ zIndex: "1" });
			current_bg = "bg1";
			// Verlauf-Bild (Hintergrund) tauschen
			$("body").css({
				backgroundImage: "url(/images/1_wir_sinds/bg_verlauf_1.jpg)"
			});
		}
		// Stoff-Bild tauschen
		$("#content_container").css({
			backgroundImage: "url(/images/1_wir_sinds/stoff1.gif)"
		});
		// Text-Hintergrundbild tauschen
		$("#logo").css({
			backgroundImage: "url(/images/1_wir_sinds/bg_text1.gif)"
		});
		// Logo-Bild tauschen
		$("#logo a img").attr({
			src: "/images/1_wir_sinds/label_1.gif"
		});

		$("#navi_1_content").load("wir_sind.html");
	}
);

$("#navi_2_link").click(
	function () {
		// Verschiebung des 1. Navipunktes
		moveNavi(1);
		$("#navi_2").animate({
			top: "40px",
			height: "290px"
		});
		hideOthers(this, 2);
		
		// Hintergrundbild im body tauschen
		if (current_bg != "bg2" && !iex) {
			$("#bg2").show();
			$("#" + current_bg).fadeOut("slow", function () {
				// z-index fuer das alte und das neue Bild tauschen
				$("#bg2").css({ zIndex: "2" });
				$("#" + current_bg).css({ zIndex: "1" });
				current_bg = "bg2";
				// Verlauf-Bild (Hintergrund) tauschen
				$("body").css({
					backgroundImage: "url(/images/2_shirts/bg_verlauf_2.jpg)"
				});
			});
		} else if (current_bg != "bg2" && iex) {
			// statischer Bild-Tausch fuer IEx
			$("#bg2").show();
			$("#" + current_bg).hide();
			$("#bg2").css({ zIndex: "2" });
			$("#" + current_bg).css({ zIndex: "1" });
			current_bg = "bg2";
			// Verlauf-Bild (Hintergrund) tauschen
			$("body").css({
				backgroundImage: "url(/images/2_shirts/bg_verlauf_2.jpg)"
			});
		}
		// Stoff-Bild tauschen
		$("#content_container").css({
			backgroundImage: "url(/images/2_shirts/stoff2.gif)"
		});
		// Text-Hintergrundbild tauschen
		$("#logo").css({
			backgroundImage: "url(/images/2_shirts/bg_text2.gif)"
		});
		// Logo-Bild tauschen
		$("#logo a img").attr({
			src: "/images/2_shirts/label_2.gif"
		});

		// normaler Content-DIV wieder einblenden (kann ja sein, dass derzeit Pflegehinweise zu sehen ist)
		$("#navi_2_content").fadeIn("slow");
		// Metanavi zuruecksetzen
		resetMetanavi2();
	}
);

$("#navi_3_link").click(
	function () {
		if (reset_order_form) {
			reset_order_form_func();
		}
		// Verschiebung von Navipunkt 1, 2
		moveNavi(2);
		$("#navi_3").animate({
			top: "60px",
			height: "290px"
		});
		hideOthers(this, 3);
		
		// Hintergrundbild im body tauschen
		if (current_bg != "bg3" && !iex) {
			$("#bg3").show();
			$("#" + current_bg).fadeOut("slow", function () {
				// z-index fuer das alte und das neue Bild tauschen
				$("#bg3").css({ zIndex: "2" });
				$("#" + current_bg).css({ zIndex: "1" });
				current_bg = "bg3";
				// Verlauf-Bild (Hintergrund) tauschen
				$("body").css({
					backgroundImage: "url(/images/3_bestell/bg_verlauf_3.jpg)"
				});
			});
		} else if (current_bg != "bg3" && iex) {
			// statischer Bild-Tausch fuer IEx
			$("#bg3").show();
			$("#" + current_bg).hide();
			$("#bg3").css({ zIndex: "2" });
			$("#" + current_bg).css({ zIndex: "1" });
			current_bg = "bg3";
			// Verlauf-Bild (Hintergrund) tauschen
			$("body").css({
				backgroundImage: "url(/images/3_bestell/bg_verlauf_3.jpg)"
			});
		}
		// Stoff-Bild tauschen
		$("#content_container").css({
			backgroundImage: "url(/images/3_bestell/stoff3.gif)"
		});
		// Text-Hintergrundbild tauschen
		$("#logo").css({
			backgroundImage: "url(/images/3_bestell/bg_text3.gif)"
		});
		// Logo-Bild tauschen
		$("#logo a img").attr({
			src: "/images/3_bestell/label_3.gif"
		});
	}
);

$("#navi_4_link").click(
	function () {
		// Verschiebung von Navipunkt 1, 2, 3
		moveNavi(3);
		$("#navi_4").animate({
			top: "80px",
			height: "290px"
		});
		hideOthers(this, 4);
		
		// Hintergrundbild im body tauschen
		if (current_bg != "bg4" && !iex) {
			$("#bg4").show();
			$("#" + current_bg).fadeOut("slow", function () {
				// z-index fuer das alte und das neue Bild tauschen
				$("#bg4").css({ zIndex: "2" });
				$("#" + current_bg).css({ zIndex: "1" });
				current_bg = "bg4";
				// Verlauf-Bild (Hintergrund) tauschen
				$("body").css({
					backgroundImage: "url(/images/4_dinge/bg_verlauf_4.jpg)"
				});
			});
		} else if (current_bg != "bg4" && iex) {
			// statischer Bild-Tausch fuer IEx
			$("#bg4").show();
			$("#" + current_bg).hide();
			$("#bg4").css({ zIndex: "2" });
			$("#" + current_bg).css({ zIndex: "1" });
			current_bg = "bg4";
			// Verlauf-Bild (Hintergrund) tauschen
			$("body").css({
				backgroundImage: "url(/images/4_dinge/bg_verlauf_4.jpg)"
			});
		}
		// Stoff-Bild tauschen
		$("#content_container").css({
			backgroundImage: "url(/images/4_dinge/stoff4.gif)"
		});
		// Text-Hintergrundbild tauschen
		$("#logo").css({
			backgroundImage: "url(/images/4_dinge/bg_text4.gif)"
		});
		// Logo-Bild tauschen
		$("#logo a img").attr({
			src: "/images/4_dinge/label_4.gif"
		});
	}
);

$("#navi_5_link").click(
	function () {
		// Verschiebung von Navipunkt 1, 2, 3, 4
		moveNavi(4);
		$("#navi_5").animate({
			top: "100px",
			height: "290px"
		});
		hideOthers(this, 5);
		
		// Hintergrundbild im body tauschen
		if (current_bg != "bg5" && !iex) {
			$("#bg5").show();
			$("#" + current_bg).fadeOut("slow", function () {
				// z-index fuer das alte und das neue Bild tauschen
				$("#bg5").css({ zIndex: "2" });
				$("#" + current_bg).css({ zIndex: "1" });
				current_bg = "bg5";
				// Verlauf-Bild (Hintergrund) tauschen
				$("body").css({
					backgroundImage: "url(/images/5_kontakt/bg_verlauf_5.jpg)"
				});
			});
		} else if (current_bg != "bg5" && iex) {
			// statischer Bild-Tausch fuer IEx
			$("#bg5").show();
			$("#" + current_bg).hide();
			$("#bg5").css({ zIndex: "2" });
			$("#" + current_bg).css({ zIndex: "1" });
			current_bg = "bg5";
			// Verlauf-Bild (Hintergrund) tauschen
			$("body").css({
				backgroundImage: "url(/images/5_kontakt/bg_verlauf_5.jpg)"
			});
		}
		// Stoff-Bild tauschen
		$("#content_container").css({
			backgroundImage: "url(/images/5_kontakt/stoff5.gif)"
		});
		// Text-Hintergrundbild tauschen
		$("#logo").css({
			backgroundImage: "url(/images/5_kontakt/bg_text5.gif)"
		});
		// Logo-Bild tauschen
		$("#logo a img").attr({
			src: "/images/5_kontakt/label_5.gif"
		});
		
		// Standardtext der Ueberschrift einsetzen
		$("#navi_5_content h3").html(header_contact);
		// Textarea leeren, falls dort noch ein Schluesselband-Text vorhanden ist
		if($("#contact_message").val().search(/^Schlüsselband/) != -1) {
			$("#contact_message").val("");
		}
	}
);

// Alle Navipunkt mit verschieben
function moveNavi(pos) {
	for (i=1; i<=pos; i++) {
		var prepos = i;
		// Multiplizieren mit dem Pixel-Wert
		var pixel = prepos * 20;
		$("#navi_" + i).animate({
			top: pixel + "px"
		});
	}
}

// Alle nichtaktiven Reiter unterhalb des aktuellen verstecken; dazu noch die CSS-Klasse entfernen
function hideOthers(obj, pos) {
	// Video im 1. Tab ausblenden
	$("#video_iwieida").hide();
	// Video im 2. Tab ausblenden - IEx Bugfix
	$("#navi_1_content").html("");
	//$("#navi_1_content").load("leer.html");

	// Demarkierung aller Reiter
	for (i=0; i<=navi.length; i++) {
		$("#navi_" + i + "_link").removeClass("current");
	}
	// Markierung des aktuellen Reiters
	$(obj).addClass("current");
	
	// Verstecken aller Reiter unterhalb des aktuellen
	if (pos < 1) {
		$("#navi_1").animate({
			top: "290px",
			height: "20px"
		});
	}
	if (pos < 2) {
		$("#navi_2").animate({
			top: "310px",
			height: "20px"
		});
	}
	if (pos < 3) {
		$("#navi_3").animate({
			top: "330px",
			height: "20px"
		});
	}
	if (pos < 4) {
		$("#navi_4").animate({
			top: "350px",
			height: "20px"
		});
	}
	if (pos < 5) {
		$("#navi_5").animate({
			top: "370px",
			height: "20px"
		});
	}
//	$("#navi_1_content object").hide();
}

/*** Infografik auf der ersten Seite ***/
$("#start_info").click(
	function() {
		$("#navi_3_link").trigger('click');
	}
);

/*** Step 1 - Shirt ***/
$("#breadcrumb li#breadcrumb_1").click(
	function() {
		if (order_array[0] == default_shirt_type_1) {
			$("#shirt_long").trigger('click');
		} else if (order_array[0] == default_shirt_type_2) {
			$("#shirt_short").trigger('click');
		}
	}
);
// Klick-Events
$("#shirt_long").click(
	function() {
		$("#shirt_description p").each(function() {
			$(this).hide();
		});
		$("#description_long").show();
		order_array[0] = default_shirt_type_1;
		
		// Text bei "Schnitt" setzen
		$("#step10 p").hide();
		$("#step10 p#step10_text_1").show();
		// Anzeige/Auswahl der Farben definieren
		show_colors();
		// Anzeige der Groessen definieren
		show_size();
	}
);
$("#shirt_short").click(
	function() {
		$("#shirt_description p").each(function() {
			$(this).hide();
		});
		$("#description_short").show();
		order_array[0] = default_shirt_type_2;

		// Text bei "Schnitt" setzen
		$("#step10 p").hide();
		$("#step10 p#step10_text_2").show();
		// Anzeige/Auswahl der Farben definieren
		show_colors();
		// Anzeige der Groessen definieren
		show_size();
	}
);
// Hover-Events
$("#step1 div label img").hover(
	function() {
		$("#shirt_description p").each(function() {
			$(this).hide();
		});
		// anhand des label ermitteln welche Beschreibung darstellt werden soll
		$("#" + $(this).parent().attr("for").replace(/shirt/, "description")).show();
	},
	function() {
		$("#shirt_description p").each(function() {
			$(this).hide();
		});
		if (order_array[0] == default_shirt_type_1) {
			$("#shirt_long").trigger('click');
		} else if (order_array[0] == default_shirt_type_2) {
			$("#shirt_short").trigger('click');
		} else {
			$("#description_start").show();
		}
	}
);
function show_size() {
	// entsprechende Beschreibung anzeigen
	$("#step3 span").hide();
	$("#step3 span#size_descr_" + order_array[7]).show();
	// bei T-Shirts noch ein Zusatztext (falls Maedchen- oder Junge-Schnitt)
	if (order_array[0] == "tshirt") {
		$("#step3 span#size_descr_" + order_array[7] + " span").show();
	}

	// entsprechende Radiobuttons anzeigen
	// beide Tabellen mit Radiobuttons ausblenden
	$("#shirt_size_1, #shirt_size_2").hide();
	// Sonderfall (7-8 Jahre) einblenden
	$(".no_tshirt span").css("display", "block");

	if (order_array[7] == "B") {
		// Schnitt: Baby
		$("#shirt_size_1").show();
	} else if (order_array[7] == "M" || order_array[7] == "J") {
		// Schnitt: Maedchen/Junge
		$("#shirt_size_2").show();
		// Sonderfall T-Shirt: hier gibt es den letzten Radiobutton (7-8 Jahre) nicht
		if (order_array[0] == default_shirt_type_2) {
			$(".no_tshirt span").css("display", "none");
		}
	}

	// Sonderfall: Longsleeve + Baby = kein "18-24 Monate" vorhanden
	if (order_array[0] == "longsleeve") {
		$("#step3 div.no_longsleeve").hide();
	} else {
		$("#step3 div.no_longsleeve").show();
	}

	// Default-Wert fuer Shirt-Typ: Longsleeve
	var shirt_size_table_img = "masstabelle.jpg";
	if (order_array[0] == default_shirt_type_2 && order_array[7] == "B") {
		// kein Longsleeve, Schnitt: Baby
		shirt_size_table_img = "masstabelle_babies.gif";
	} else if ( order_array[0] == default_shirt_type_2 && order_array[7] == "M" ) {
		// kein Longsleeve, Schnitt: Maedchen
		shirt_size_table_img = "masstabelle_maedchen.gif";
	} else if ( order_array[0] == default_shirt_type_2 && order_array[7] == "J" ) {
		// kein Longsleeve, Schnitt: Junge
		shirt_size_table_img = "masstabelle_jungs.gif";
	}
	// entsprechende Masstabelle anzeigen
	$("#shirt_size_table").attr("src", "/images/3_bestell/step3/" + shirt_size_table_img);
}

/*** Step 10 - Schnitt ***/
/*** Dieser Schritt ist nachtraeglich eingefuegt worden und hat deshalb die Nr. 10 ***/
$("#breadcrumb li#breadcrumb_10").click(
	function() {
		order_array[7] = (order_array[7] == "") ? default_shirt_gender : order_array[7];

		// Radiobutton "Geschlecht" markieren
		$("#step10 li input").each(
			function() {
				if ($(this).val() == order_array[7]) {
					$(this).trigger("click");
				}
			}
		);
	}
);
$("#step10 li input").click(
	function() {
		// markiertes Geschlecht in globalen Array merken
		order_array[7] = $(this).val();
		
		// Anzeige der Farben definieren (abhaenig von shirt_type und shirt_gender)
		show_colors();
		// Anzeige der Groessen definieren
		show_size();
	}
);
function show_colors() {
	// Anzahl der verfuegbaren Farben
	var max_color = 6;

	if (order_array[0] == default_shirt_type_1) {
		// 1. Longsleeve
		// Farben: alle, bis auf "dunkelblau"
		for(i = 1; i <= max_color; i++) {
			if (i != 6) {
				$("#shirt_color_" + i).show();
			} else {
				$("#shirt_color_" + i).hide();
			}
		}
	} else if (order_array[0] == default_shirt_type_2 && ( order_array[7] == "B" || order_array[7] == "M" )) {
		// 2. a) T-shirt + Baby/Maedchen
		// Farben: "weiss" und "rosa"
		for(i = 1; i <= max_color; i++) {
			if (i == 1 || i == 2) {
				$("#shirt_color_" + i).show();
			} else {
				$("#shirt_color_" + i).hide();
			}
		}
	} else {
		// 2. b) T-shirt + Junge
		// Farben: "grau" und "dunkelblau"
		for(i = 1; i <= max_color; i++) {
			if (i == 4 || i == 6) {
				$("#shirt_color_" + i).show();
			} else {
				$("#shirt_color_" + i).hide();
			}
		}
	}
	
	// falls die zuletzt angeklickte Farbe mittlerweile nicht mehr verfuegbar ist, dann die erste moegliche Farbe markieren
	if ( $("#step2 div.current").css("display") == "none" || $("#step2 div.current").length == 0 ) {
		if( $("#step2 div#" + order_array[1]).parent().css("display") != "none" ) {
			// falls eine Farbe im Array steht, die auch sichtbar ist, dann diese markieren
			$("#step2 div#" + order_array[1]).trigger("click");
		} else {
			// ansonsten das 1. sichtbare markieren
			order_array[1] = $("#step2 > div:visible:first").children("div").attr("id");
			$("#step2 > div:visible:first").children("div").trigger("click");
		}
	}
}
/*** Step 2 - Farbe ***/
$("#breadcrumb li#breadcrumb_2").click(
	function() {
		var type = (order_array[0] == "") ? default_shirt_type_2 : order_array[0];
		order_array[0] = type;
		// Standardwert setzen, falls keine Farbe definiert ist
		if (order_array[1] == "") {
			order_array[1] = default_shirt_color;
		}
		$("#shirt_color_preview").attr({
			"src": "/images/3_bestell/step2/" + type + "_" + order_array[1] + ".jpg"
		});
		
		// verfuegbare Farben anzeigen
		show_colors();
		
		// Bild mit dem Rahmen ueberall entfernen und beim angeklickten setzen
		$("#step2 div").each(function() {
			if ($(this).children("div").attr("id") == order_array[1]) {
				$(this).addClass("current");
			} else {
				$(this).removeClass("current");
			}
		});
	}
);
$("#step2 div div").click(
	function() {
		// Bild mit dem Rahmen ueberall entfernen und beim angeklickten setzen
		$("#step2 div.current").removeClass("current");

		$(this).parent().addClass("current");

		// Bildname aus der ID entnehmen
		var color = $(this).attr("id");
		$("#shirt_color_preview").attr({
			"src": "/images/3_bestell/step2/" + order_array[0] + "_" + color + ".jpg"
		});
		order_array[1] = color;
		// Wert ins hiddenfield setzen
		$("#shirt_color").val(order_array[1]);
	}
);
$("#step2 div div").hover(
	function () {
		$(this).css({ backgroundImage: "url(/images/3_bestell/step2/shirt_color_hover.gif)" });
	},
	function () {
		$(this).css({ backgroundImage: "" });
	}
);

/*** Step 3 - Groesse ***/
$("#breadcrumb li#breadcrumb_3").click(
	function() {
		// Pfad des Vorschaubildes holen
		var value = $("#shirt_size_preview").attr("src");
		// regulaeren Ausdruck auf die Variable als Objekt erstellen
		var reg = new RegExp(order_array[0]);
		// Vorschaubild tauschen, falls ein anderer Shirt-Typ derzeit angezeigt wird
		if(!reg.exec(value)) {
			var reg2, new_value;
			if (order_array[0] == default_shirt_type_1) {
				reg2 = new RegExp(default_shirt_type_2);
				new_value = default_shirt_type_1;
			} else {
				reg2 = new RegExp(default_shirt_type_1);
				new_value = default_shirt_type_2;
			}
			$("#shirt_size_preview").attr({
				"src": value.replace(reg2, new_value)
			});
		}

		// Anzeige der Groessen definieren
		show_size();
	}
);
$("#step3 input").click(
	function() {
		order_array[2] = $(this).val();
	}
);

/*** Step 4 - Motiv ***/
$("#breadcrumb li#breadcrumb_4").click(
	function() {
		// Pfad des aktuellen 1. Hintergrundbildes holen
		var value = $("#step4 div").css("background-image");
		// regulaeren Ausdruck auf die Variable als Objekt erstellen
		var reg = new RegExp(order_array[0]);
		// Hintergrundbilder tauschen, falls ein anderer Shirt-Typ derzeit angezeigt wird
		if(!reg.exec(value)) {
			$("#step4 div").each(function() {
				var reg2, new_value;
				if (order_array[0] == default_shirt_type_1) {
					reg2 = new RegExp(default_shirt_type_2);
					new_value = default_shirt_type_1;
				} else {
					reg2 = new RegExp(default_shirt_type_1);
					new_value = default_shirt_type_2;
				}
				$(this).css({
					"background-image": $(this).css("background-image").replace(reg2, new_value)
				});
			});
		}
		// gespeicherte Kollektion (oder Standard) setzen
		$("#step4 div").each(function() {
			if ($(this).children("input").val() == order_array[3]) {
				$(this).children("input").trigger('click');
			}
		});
	}
);
$("#step4 div input").click(
	function() {
		order_array[3] = $(this).val();
	}
);

/*** Step 5 - Text ***/
$("#breadcrumb li#breadcrumb_5").click(
	function() {
		// Buchstabe der aktuellen Kollektion ermitteln
		var reg = /.$/;
		var collection_letter = reg.exec(order_array[3]);
		// alle DIV des 5. Schrittes ausblenden
		$("#step5 div").each(function() {
			$(this).hide();
		});
		// nur das DIV der gewuenschten Kollektion im Schritt 5 anzeigen
		$("#step5 div#collection_" + collection_letter + "_text").show();
		// sowie das DIV darin
		$("#step5 div#collection_" + collection_letter + "_text div").show();

		// Pfad des Vorschaubildes holen
		var value = $("#step5 div img.preview").attr("src");
		// regulaeren Ausdruck auf die Variable als Objekt erstellen
		var reg = new RegExp(order_array[0]);
		// Vorschaubilder tauschen, falls ein anderer Shirt-Typ derzeit angezeigt wird
		if(!reg.exec(value)) {
			var reg2, new_value;
			if (order_array[0] == default_shirt_type_1) {
				reg2 = new RegExp(default_shirt_type_2);
				new_value = default_shirt_type_1;
			} else {
				reg2 = new RegExp(default_shirt_type_1);
				new_value = default_shirt_type_2;
			}
			$("#step5 div img.preview").each(function() {
				value = $(this).attr("src");
				$(this).attr({
					"src": value.replace(reg2, new_value)
				});
			});
		}
	}
);
$(".B_input").click(
	function() {
		$("#B_text_2").val($(this).val());
	}
);
$(".C_input").click(
	function() {
		$("#C_text_2").val($(this).val());
	}
);
$(".D_input").click(
	function() {
		$("#D_text_2").val($(this).val());
	}
);

/*** Step 6 - Stoff ***/
$("#breadcrumb li#breadcrumb_6").click(
	function() {
		// Falls schon ein Muster gewaehlt ist, dann dieses markieren
		if (order_array[6]) {
			$("#shirt_stoff" + order_array[6]).trigger('click');
		}
	}
);
$("#center2 div.stoff").click(
	function () {
		// Rahmen beim zuvor aktiven Bild entfernen
		$("#shirt_stoff" + order_array[6]).removeClass("current");
		// Stoff-Nummer ermitteln und im Bestell-Array merken
		var reg = /.+?(\d+)\.jpg/;
		reg.exec($(this).css("backgroundImage"));
		order_array[6] = RegExp.$1;
		$("#step6_preview div").html("");
		$("#shirt_stoff" + order_array[6]).addClass("current");
		$("#step6_preview").css({ backgroundImage: $(this).css("backgroundImage").replace(/klein/, "gross") });
	}
);
var step6_standard_text = $("#step6_preview div").html();
$("#center2 div div").hover(
	function () {
		// Standardtext in dem Vorschaufenster entfernen
		$("#step6_preview div").html("");
		// Rahmenbild bei aktuellen anzeigen
		$(this).addClass("current");
		// Vorschaubild anzeigen
		$("#step6_preview").css({ backgroundImage: $(this).css("backgroundImage").replace(/klein/, "gross") });
	},
	function () {
		// Rahmenbild entfernen
		$(this).removeClass("current");
		// pruefen, ob schon ein Stoff gewaehlt wurde
		if (order_array[6] != 0) {
			// Rahmen wieder setzen
			$("#shirt_stoff" + order_array[6]).addClass("current");
			// zugehoeriges Vorschaubild setzen
			$("#step6_preview").css({ backgroundImage: $("#shirt_stoff" + order_array[6]).css("backgroundImage").replace(/klein/, "gross") });
		} else {
			// ansonsten Standardtext einfuegen
			$("#step6_preview div").html(step6_standard_text);
			// Vorschaubild entfernen
			$("#step6_preview").css({ backgroundImage: "" });
		}
	}
);

/*** Step 7 - Check ***/
$("#breadcrumb li#breadcrumb_7").click(
	function() {
		// Alle Werte aus den einzelnen Schritte in die Felder zum Check setzen
		var shirt_descr;
		if (order_array[0] == "longsleeve") {
			shirt_descr = "Longsleeve";
		} else {
			// Standard-Shirt auf "T-Shirt setzen, falls noch keines gewaehlt wurde
			order_array[0] = "tshirt";
			shirt_descr = "T-Shirt";
		}
		
		$("#order_0").html(shirt_descr);
		$("#order_data_0").val(shirt_descr);
		$("#order_1").html(order_array[1]);
		$("#order_data_1").val(order_array[1]);

		// Groesse erneut abfragen, da beim Refresh der Seite der Radiobutton nicht zurueckgesetzt wird
		$("#step3 input").each(
			function() {
				if($(this).attr("checked")) {
					// Wert der markierte Auswahlt setzen
					order_array[2] = $(this).val();
				}
			}
		);
		$("#order_2").html(order_array[2]);
		$("#order_data_2").val(order_array[2]);

		$("#order_3").html(order_array[3]);
		$("#order_data_3").val(order_array[3]);

		// Buchstabe der aktuellen Kollektion ermitteln
		var reg = /.$/;
		var collection_letter = reg.exec(order_array[3]);
		// Werte des letzten Schrittes speichern
		order_array[4] = (collection_letter) ? $("#" + collection_letter + "_text_1").val() : "";
		order_array[5] = (collection_letter) ? $("#" + collection_letter + "_text_2").val() : "";

		// beim Text gibt es verschiedene Varianten
		var order_4_text = "";
		if (collection_letter == "A") {
			order_4_text = order_array[4] + " wie " + order_array[5];
		} else if (collection_letter == "B" || collection_letter == "C" || collection_letter == "D" || collection_letter == "E") {
			order_4_text = order_array[4] + " (" + order_array[5] + ")";
		} else {
			order_4_text = order_array[4];
		}
		$("#order_4").html(order_4_text);
		$("#order_data_4").val(order_4_text);

		var order_5_text;
		if(order_array[6]) {
			order_5_text = "Nr. " + order_array[6];
		}
		$("#order_5").html(order_5_text);
		$("#order_data_5").val(order_5_text);
		
		var order_6_text = "Baby";
		if (order_array[7] == "M") {
			order_6_text = "Mädchen";
		} else if (order_array[7] == "J") {
			order_6_text = "Junge";
		}
		$("#order_6").html(order_6_text);
		$("#order_data_6").val(order_array[7]);

		// alle Daten fuer die Anzeige des richtigen Shirts zusammenstellen
		// 1. Stoff als Hintergrundbild
		$("#order_preview").css({ backgroundImage: "url(/images/3_bestell/step6/stoff_klein_" + order_array[6] + ".jpg)" });
		// 2. Shirt-Typ und Kollektion darstellen
		$("#order_preview img").attr({
			"src": "/images/3_bestell/step7/kollektionen_" + order_array[0] + "_gross_" + collection_letter + ".gif"
		});
	}
);

/*** Step 8 - Bestelldaten ***/
$("#breadcrumb li#breadcrumb_8").click(
	function() {
		// Fehler-Flag
		error_order_form = 0;
		jump_to_step = "";
		var error_msg = "";
		
		// Shirt-Typ pruefen
		if (order_array[0] == "") {
			error_order_form = 1;
			error_msg += "- Shirt-Typ nicht gewählt<br>";
			if (!jump_to_step) jump_to_step = 1;
		}
		// Shirt-Farbe pruefen
		if (order_array[1] == "") {
			error_order_form = 1;
			error_msg += "- Shirt-Farbe nicht gewählt<br>";
			if (!jump_to_step) jump_to_step = 2;
		}
		// Shirt-Groesse pruefen
		if (order_array[2] == "") {
			error_order_form = 1;
			error_msg += "- Shirt-Größe nicht gewählt<br>";
			if (!jump_to_step) jump_to_step = 3;
		}
		// Buchstabe der aktuellen Kollektion ermitteln
		var reg = /.$/;
		var collection_letter = reg.exec(order_array[3]);
		// Shirt-Motiv pruefen und anschliessend den Text der gewaehlten Kollektion
		if (order_array[3] == "") {
			error_order_form = 1;
			error_msg += "- Shirt-Motiv nicht gewählt<br>";
			if (!jump_to_step) jump_to_step = 4;
		} else if (collection_letter == "A") {
			var reg_A = /^./;
			var name_letter = reg_A.exec(order_array[5]);
			// Kollektion A: Buchstabe und zugehoeriger Name
			if (order_array[4] == "") {
				error_order_form = 1;
				error_msg += "- Buchstabe (vorne) fehlt<br>";
				if (!jump_to_step) jump_to_step = 5;
			} else if (order_array[5] == "") {
				error_order_form = 1;
				error_msg += "- Name (hinten) fehlt<br>";
				if (!jump_to_step) jump_to_step = 5;
			} else if (order_array[4] != name_letter) {
				error_order_form = 1;
				error_msg += "- Buchstabe und Name stimmen nicht überein<br>";
				if (!jump_to_step) jump_to_step = 5;
			}
		} else if (collection_letter == "B") {
			// Kollektion B: Name und Position der Applikation
			if (order_array[4] == "") {
				error_order_form = 1;
				error_msg += "- Name fehlt<br>";
				if (!jump_to_step) jump_to_step = 5;
			} else if (order_array[5] == "") {
				error_order_form = 1;
				error_msg += "- Position der Applikation nicht gewählt<br>";
				if (!jump_to_step) jump_to_step = 5;
			}
		} else if (collection_letter == "C") {
			// Kollektion C: Zahlwort und Position der Applikation
			if (order_array[4] == "") {
				error_order_form = 1;
				error_msg += "- Zahlwort fehlt<br>";
				if (!jump_to_step) jump_to_step = 5;
			} else if (order_array[5] == "") {
				error_order_form = 1;
				error_msg += "- Position der Applikation nicht gewählt<br>";
				if (!jump_to_step) jump_to_step = 5;
			}
		} else if (collection_letter == "D") {
			// Kollektion D: Ziffer oder Buchstabe (vorn)
			if (order_array[4] == "") {
				error_order_form = 1;
				error_msg += "- Ziffer oder Buchstabe fehlt<br>";
				if (!jump_to_step) jump_to_step = 5;
			}
		} else if (collection_letter == "E") {
			// Kollektion E: Motiv (vorn)
			if (order_array[4] == "") {
				error_order_form = 1;
				error_msg += "- Motiv nicht gewählt<br>";
				if (!jump_to_step) jump_to_step = 5;
			} else if (order_array[5] == "") {
				error_order_form = 1;
				error_msg += "- Name beim Motiv fehlt<br>";
				if (!jump_to_step) jump_to_step = 5;
			}
		}
		// Stoff pruefen
		if (order_array[6] == "") {
			error_order_form = 1;
			error_msg += "- Stoff nicht gewählt";
			if (!jump_to_step) jump_to_step = 6;
		}
		
		// falls kein Fehler vorhanden war, den Check-Button pruefen
		if(!error_order_form) {
			if(!$("#order_checked").attr("checked")) {
				error_order_form = 1;
				error_msg += "- Angaben bestätigen (Haken setzen)";
				if (!jump_to_step) jump_to_step = 7;
			}
		}
		
		// Fehlermeldung zeigen
		if(error_order_form) {
			$("#error_order_msg").html(error_msg);
			$("#messages_order").show();
			$("#error_order").show();
		}
	}
);
$("#step8 input").focus(
	function() {
		$(this).removeClass("error");
	}
);

/*** Step 9 - Bestellung Abschicken ***/
$("#breadcrumb li#breadcrumb_9").click(
	function() {
		// Fehler-Flag
		error_order_form_2 = 0;
		var error_msg = "";
		
		// Pflichfelder abfragen
		var required = new Array("#order_name", "#order_street", "#order_city", "#order_phone", "#order_email");
		for(i=0; i<required.length; i++) {
			if($(required[i]).val() == "") {
				$(required[i]).addClass("error");
				error_order_form_2 = 1;
			} else {
				$(required[i]).removeClass("error");
			}
		}
		
		// Schreibweise der E-Mail-Adresse abfragen
		if($("#order_email").val().search(email_regex) == -1) {
			$("#order_email").addClass("error");
			error_msg = "<br><br>Bitte trage eine korrekte E-Mail ein. Danke!";
			error_order_form_2 = 1;
		} else {
			$("#order_email").removeClass("error");
			$("#error_order_msg_2").html("");
		}
		
		// Versandart abfragen
		var dispatch_ok = 0;
		$(".dispatch").each(
			function () {
				if($(this).attr("checked") == true) {
					dispatch_ok = 1;
				}
			}
		);
		// falls keine Versandart gewaehlt ist, dann Fehlerflag setzen
		if (!dispatch_ok) {
			error_order_form_2 = 1;
		}
		
		// AGB abfragen
		if(!$("#agb_checked").attr("checked")) {
			error_order_form_2 = 1;
		}

		// Fehlermeldung zeigen
		if(error_order_form_2) {
			$("#error_order_msg_2").html(error_msg);
			$("#messages_order").show();
			$("#error_order_2").show();
		} else {
			// URL mit den angehaengten Parametern erzeugen
			var url = "/cgi-iwieida/email.cgi?" + $("#orderform").serialize();
			jQuery.get( url, function (result) {
				if (result == "OK") {
					// alles ok, jetzt das Flag zum "Formular leeren" setzen
					reset_order_form = 1;
				} else {
					// Scriptfehler
				}
			});
		}
	}
);


// Hinweismeldungen ausblenden
$(".close_order").click(
	function() {
		$("#messages_order").hide();
		$("#error_order").hide();
		$("#error_order_2").hide();
	}
);
// Hinweismeldungen ausblenden und zum Punkt springen, der unvollstaendig ist
$(".button_bg_bestell").click(
	function() {
		$(".close_order").trigger('click');
		$("#breadcrumb li#breadcrumb_" + jump_to_step).trigger('click');
	}
);
$(".button_bg_bestell_2").click(
	function() {
		$(".close_order").trigger('click');
	}
);

/*** Breadcrumb/Schritte des Bestell-Prozesses ***/
$("#breadcrumb li").click(
	function () {
		// falls Bestellprozess Fehler erzeugt hat, nicht weiter scrollen
		if (!error_order_form && !error_order_form_2) {
			// aktuellen Punkt demarkieren
			$("#breadcrumb li").each(function(){
				$(this).children("a").removeClass("current");
			});
			// angeklickten Punkt als current markieren
			$(this).children("a").addClass("current");
			// Breadcrumb markieren: alle bis einschl. des angeklickten Punktes
			$(this).prevAll("li").andSelf().children("a").addClass("active");
			// Breadcrumb demarkieren: alle nach dem angeklickten Punkt
			$(this).nextAll("li").children("a").removeClass("active");
			
			// DIVs der Bestellschritte verschieben
			var new_left = $("#content #order div").width() * $(this).prevAll("li").length;
			$("#content #order").animate({
				left: "-" + new_left + "px"
			});
		}
		// Fehler- und Jump-Flag zuruecksetzen, damit man zurueck scrollen kann
		error_order_form = 0;
		error_order_form_2 = 0;
		return false;
	}
)

/*** Weiter-/Back-Link des Bestellprozesses ***/
$(".next").click(
	function () {
		var id = $(this).attr("id").replace(/next_/, "");

		/*** Sonderfall fuer den nachtraeglich eingefuegten Schritt 10 ***/
		if (id == 10) {
			id = 2;
		} else if (id == 2) {
			id = 3;
		} else if (id == 3) {
			id = 1;
		} else if (id == 1) {
			id = 9;
		}
		/*** Sonderfall Ende **/

		// Breadcrumb-Klick der naechsthoeheren ID aufrufen
		$("#breadcrumb_" + ++id).trigger('click');
		return false;
	}
);
$(".next").hover(
	function () {
		$(this).css({ backgroundPosition: "0px 0px" });
	},
	function () {
		$(this).css({ backgroundPosition: "0px -17px" });
	}
);
$(".back").click(
	function () {
		var id = $(this).attr("id").replace(/back_/, "");

		/*** Sonderfall fuer den nachtraeglich eingefuegten Schritt 10 ***/
		if (id == 10) {
			id = 2;
		} else if (id == 2) {
			id = 4;
		} else if (id == 3) {
			id = 11;
		} else if (id == 4) {
			id = 3;
		}
		/*** Sonderfall Ende **/

		// Breadcrumb-Klick der naechstniedrigeren ID aufrufen
		$("#breadcrumb_" + --id).trigger('click');
		return false;
	}
);
$(".back").hover(
	function () {
		$(this).css({ backgroundPosition: "0px 0px" });
	},
	function () {
		$(this).css({ backgroundPosition: "0px -17px" });
	}
);


/*** Kontaktformular ***/
// Hintergrundbild bei Buttons verschieben
$(".button_bg").hover(
	function () {
		$(this).css({ backgroundPosition: "0px 0px" });
	},
	function () {
		$(this).css({ backgroundPosition: "0px -17px" });
	}
);

$("#contactform input").focus(
	function() {
		$(this).removeClass("error");
	}
);

$("#contactform").submit(
	function () {
		$("#contactsuccess").hide();
		$("#contacterror").hide();
		$("#contacterror_script").hide();

		// Pflichfelder abfragen
		var required = new Array("#required_name", "#required_street", "#required_city", "#required_phone", "#required_email");
		var error = 0;
		for(i=0; i<required.length; i++) {
			if($(required[i]).val() == "") {
				$(required[i]).addClass("error");
				error++;
			} else {
				$(required[i]).removeClass("error");
			}
		}
		
		// Schreibweise der E-Mail-Adresse abfragen
		if($("#required_email").val().search(email_regex) == -1) {
			$("#required_email").addClass("error");
			$("#contact_email_error").show();
			error++;
		} else {
			$("#required_email").removeClass("error");
			$("#contact_email_error").hide();
		}
		
		if(error) {
			$("#messages").show();
			$("#contacterror").show();
		} else {
			// URL mit den angehaengten Parametern erzeugen
			var url = "/cgi-iwieida/email.cgi?" + $("#contactform").serialize();
			jQuery.get( url, function (result) {
				if (result == "OK") {
					$("#messages").show();
					$("#contactsuccess").show();
					$("#contact_reset").trigger("click");
				} else {
					$("#messages").show();
					$("#contacterror_script").show();
				}
			});
		}
		return false;
	}
);

// Hinweismeldungen ausblenden
$(".close").click(
	function() {
		$("#messages").hide();
		$("#contactsuccess").hide();
		$("#contacterror").hide();
		$("#contacterror_script").hide();
	}
);

// E-Mail-Schutzfunktion
function openmailurl(prefix, postfix) {
	if(!postfix) {
		postfix = 'iwieida.de';
	}
	location.href= 'mailto:' + prefix + '@' + postfix;
}

/*** Bookmark-Funktion fuer die einzelnen Navi-Elemente ***/
$(document).ready(function () {
	var url = location.href;
	url = url.split("#");
	switch (url[1]) {
		case "wir":
			$("#navi_1_link").trigger('click');
			break;
		case "shirts":
			$("#navi_2_link").trigger('click');
			break;
		case "bestell":
			$("#navi_3_link").trigger('click');
			break;
		case "dinge":
			$("#navi_4_link").trigger('click');
			break;
		case "kontakt":
			$("#navi_5_link").trigger('click');
			break;
	}
	// Video der ersten Seite bei Bedarf anzeigen
	if (url.length == 1 || url[1] == "start") {
		window.setTimeout(function() {
			$("#video_iwieida").show();
		}, 1000);
	}
});