bodywear_products = {
	genderFilter:"all",
	categoryFilter:"all",
	nextIndex:5,
	
	init: function() {
		// Color product backgrounds
		$("li:even", $("#products")).addClass("alternate");
		
		// Mark the last product in each row
		var products = $("li", $("#products"));
		for(var j=2; j<products.length; j+=3) {
			products.get(j).className += " rowEnd";
		}
		
		// Add product click events
		$(".product > img", $("#products")).click(function() { bodywear_products.showDetail(this); });
		
		// Add filter click events
		$("#genderAll").click(function() { bodywear_products.filterGender(this, "all"); });
		$("#genderMen").click(function() { bodywear_products.filterGender(this, "men"); });
		$("#genderWomen").click(function() { bodywear_products.filterGender(this, "women"); });
		$("#categoryAll").click(function() { bodywear_products.filterCategory(this, "all"); });
		$("#categoryBasics").click(function() { bodywear_products.filterCategory(this, "basics"); });
		$("#categoryJustIn").click(function() { bodywear_products.filterCategory(this, "justin"); });
		
		// Size repeated pattern
		$("#repeater").css("height", $("#products").height() + "px");
	},
	
	filterCategory: function(trigger, filterBy) {
		bodywear_products.categoryFilter = filterBy;
		$(".category", $("#filters")).removeClass("on");
		$(trigger).addClass("on");
		bodywear_products.refilter();
	},
	
	filterGender: function(trigger, filterBy) {
		bodywear_products.genderFilter = filterBy;
		$(".gender", $("#filters")).removeClass("on");
		$(trigger).addClass("on");
		bodywear_products.refilter();
	},
	
	refilter: function() {
		$(".detail").remove();
		var gf = bodywear_products.genderFilter;
		var cf = bodywear_products.categoryFilter;
		$("li", $("#products")).removeClass("hidden");
		if(gf == "all" && cf == "all") {
			// do nothing
		} else if(gf == "all") {
			$("li:not(." + cf + ")", $("#products")).addClass("hidden");
		} else if(cf == "all") {
			$("li:not(." + gf + ")", $("#products")).addClass("hidden");
		} else {
			$("li", $("#products")).addClass("hidden");
			$("li." + cf + "." + gf, $("#products")).removeClass("hidden");
		}
		var filtered = $("li:not(.hidden)", $("#products"));
		filtered.removeClass("alternate");
		filtered.removeClass("rowEnd");
		for(var i=0; i<filtered.length; i++) {
			if(i % 2 == 0) { filtered.get(i).className += " alternate"; }
			if(i % 3 == 2) { filtered.get(i).className += " rowEnd"; }
		}
		$("#repeater").css("height", $("#products").height() + "px");
	},
	
	showDetail: function(trigger) {
		$(".detail").remove();
		var imageName = $(trigger).attr("src");
		imageName = imageName.replace(".png", "-big.png");
		$(trigger).parent().parent().css("z-index", bodywear_products.nextIndex);
		$(trigger).parent().parent().append('<div class="detail"><img src="' + imageName + '" alt="" /></div>');
		$(".detail", $(trigger).parent().parent()).click(function() { $(this).remove(); });
		bodywear_products.nextIndex++;
	}
}

bodywear_retailers = {
	xmlBase: "",
	req: null,
	writeListWrapper: null,
	writeListType: "city",

	init: function() {
		$("#countries").change(function() { bodywear_retailers.toggleCountry(this.value); return false; });
	},
	
	loadXML: function(file) {
		if(bodywear_retailers.req) {
			bodywear_retailers.req.abort();
		}
		if(window.XMLHttpRequest) {
			bodywear_retailers.req = new XMLHttpRequest();
		} else if(window.ActiveXObject) {
			bodywear_retailers.req = new ActiveXObject("Microsoft.XMLHTTP");
		}
		if(bodywear_retailers.req) {
			bodywear_retailers.req.onreadystatechange = bodywear_retailers.xmlStateChange;
			bodywear_retailers.req.open("GET", bodywear_retailers.xmlBase + file, true);
			bodywear_retailers.req.send("");
		}
	},
	
	xmlStateChange: function() {
		if(bodywear_retailers.req.readyState == 4) {
			if(bodywear_retailers.req.status == 200) {
				bodywear_retailers.writeList();
			} else {
				alert("xml error\n" + bodywear_retailers.req.status + "\n" + bodywear_retailers.req.statusText);
			}
		}
	},
	
	writeList: function() {
		var listItems = bodywear_retailers.req.responseXML.getElementsByTagName("object");
		if(bodywear_retailers.writeListType == "city") {
			for(var i = 0; i < listItems.length; i++) {
				bodywear_retailers.writeListWrapper.append("<option value='" + listItems[i].getElementsByTagName("link")[0].firstChild.nodeValue + "'>" + listItems[i].getElementsByTagName("header")[0].firstChild.nodeValue + "</option>");
			}
			$("#cities").change(function() { bodywear_retailers.toggleCity(this.value); return false; });
		} else if(bodywear_retailers.writeListType == "retailer") {
			for(var j = 0; j < listItems.length; j++) {
				var appendRetailer = "<li class='retailer'>" + listItems[j].getElementsByTagName("header")[0].firstChild.nodeValue;
				var infoLines = listItems[j].getElementsByTagName("detail")[0].getElementsByTagName("line");
				for(var jj = 0; jj < infoLines.length; jj++) {
					if(infoLines[jj].firstChild) {
						appendRetailer += "<br />" + infoLines[jj].firstChild.nodeValue;
					}
				}
				appendRetailer += "</li>";
				bodywear_retailers.writeListWrapper.append(appendRetailer);
			}
		}
	},

	toggleCountry: function(trigger) {
		if($("select#cities").length > 0) {
			$("select#cities").remove();
		}
		if($(".retailList").length > 0) {
			$(".retailList").remove();
		}

		if(trigger != "0") {
			cityHead = $("#city-header");
			cityHead.removeClass("hidden");
			cityHead.after("<select id='cities'><option value='0'>Please Select</option></select>"); // add city list wrapper
			bodywear_retailers.writeListWrapper = cityHead.next();
			bodywear_retailers.writeListType = "city";
			bodywear_retailers.loadXML(trigger);
		} else {
			cityHead.addClass("hidden");
		}
	},

	toggleCity: function(trigger) {
		if($(".retailList").length > 0) {
			$(".retailList").remove();
		}

		if(trigger != "0") {
			var cityHead = $("#cities");
			cityHead.after("<ul class='retailList'></ul>"); // add retailer list wrapper
			bodywear_retailers.writeListWrapper = cityHead.next();
			bodywear_retailers.writeListType = "retailer";
			bodywear_retailers.loadXML(trigger);
		}
	}
}

$(document).ready(function() {
	bodywear_products.init();
	bodywear_retailers.init();
});