// This is to avoid flicker when rendering hidden elements in IE
var node = document.documentElement, append, className;
if (node.className === null || node.className.match(/\bjs\b/) === null) {
	append = "js";
	className = node.className;
	node.className = className === null ? append : className.replace(/\s+/g, " ") + (className === "" ? "" : " ") + append;
}

$(document).ready(function() {
	// do stuff when DOM is ready
	$("body,form").addClass("js");

	product.init();
	productList.init();
	solutionPickerBorders.init();
	pushPortlet.init();

	if ($.browser.msie && $.browser.version < 7) {
		$('li.change-country').cssHover();
		$('li.change-language').cssHover();
	}

	$("h3.closed, h4.closed").click(function() {
		$(this).toggleClass("expanded");
		$(this).next().toggle();
	});

	slideshowSetup.init();
	initSolutionPickerIfExists();
	initProductsAccessories();
});

$.fn.cssHover = function() {
	this.each(function() {
		if ($(this).css('hover')) { //fix for IE6
			var hover = $(this).css('hover').match(/^['"]?(.+?)["']?$/)[1];
			$(this).mouseover(function() { $(this).addClass(hover); }).mouseout(function() { $(this).removeClass(hover); });
		}
	});
	return this;
};

/*** Product page images ***/
var product = {
	init: function() {
		var productImage = $("#imageview img");

		if (productImage.length > 0) {
			if ($.browser.msie) { //fix for ie and png24
				$(productImage).css("background-color", "#ffffff");
			}
			var productThumbs = $("#image-thumb-list li a");

			$(productThumbs).click(function(e) {
				e.preventDefault();
				$(productThumbs).parent("li").removeClass("selected");
				var productThumb = $(this);
				productThumb.parent("li").addClass("selected");
				$(productImage).stop();
				$(productImage).animate({"opacity": 0} , 300, function(){
					$(productImage).attr("src", productThumb.attr("href"))
					.delay(200)
					.animate({"opacity": 1}, 100 );
				});
				return false;
			});
		}
	}
};


/*** Product list on start page ***/
//Adds wrapper div for styling purposes
var productList = {
	init: function() {

		//two columns if in this zone
		var twoColumnPortlet = $("#centerPortletZone .product-list-portlet");

		twoColumnPortlet.each(function(i, val) {
			var liElements = $(this).children("ul").children("li");

			var listCount = liElements.length;

			$(liElements).filter(":nth-child(1)").addClass("first-item");
			$(liElements).filter(":nth-child(2)").addClass("first-item");

			if (listCount % 2 == 0) {
				var secondLastElementId = listCount - 1;
				$(liElements).filter(":nth-child(" + secondLastElementId + ")").addClass("last-item");
			}
		})

		//three columns if in this area
		var threeColumnPortlet = $("#topPortletsLower .product-list-portlet");

		threeColumnPortlet.each(function(i, val) {
			var liElements = $(this).children("ul").children("li");

			var listCount = liElements.length;

			if (listCount % 3 == 0) {
				$(liElements).filter(":nth-child(" + (listCount - 1) + ")").addClass("last-item");
				$(liElements).filter(":nth-child(" + (listCount - 2) + ")").addClass("last-item");
			} else if (listCount % 3 == 2) {
				$(liElements).filter(":nth-child(" + (listCount - 1) + ")").addClass("last-item");
			}

			liElements.each(function(i, val) {
				if (i < 3) {
					$(this).addClass("first-item");
				}
				if (i % 3 == 0) {
					$(this).addClass("first");
				} else if (i % 3 == 2) {
					$(this).addClass("last");
				} else {
					$(this).addClass("middle");
				}
			})
		})
	}
};
var solutionPickerBorders = {
	init: function() {

		//two columns if in this zone
		var twoColumnPortlet = $("#centerPortletZone .solution-picker");

		twoColumnPortlet.each(function(i, val) {
			$(this).children("ul.segment-list").each(function() {
				var liElements = $(this).children("li");
				liElements.each(function(i, val) {
					if (i < 2) {
						$(this).addClass("first-line");
					}
					if (i % 2 == 0) {
						$(this).addClass("first");
					} else if (i % 2 == 1) {
						$(this).addClass("last");
					}
				})

				var listCount = liElements.length;
				$(liElements).filter(":nth-child(" + listCount + ")").addClass("last-line");
				if (listCount % 2 == 0) {
					$(liElements).filter(":nth-child(" + (listCount - 1) + ")").addClass("last-line");
				}
			})
		})

		//three columns if in this area
		var threeColumnPortlet = $("#topPortletsLower .solution-picker");

		threeColumnPortlet.each(function(i, val) {
			$(this).children("ul.segment-list").each(function() {
				var liElements = $(this).children("li");

				liElements.each(function(i, val) {
					if (i < 3) {
						$(this).addClass("first-line");
					}
					if (i % 3 == 0) {
						$(this).addClass("first");
					} else if (i % 3 == 2) {
						$(this).addClass("last");
					} else {
						$(this).addClass("middle");
					}
				})

				var listCount = liElements.length;
				$(liElements).filter(":nth-child(" + listCount + ")").addClass("last-line");
				var remainder = listCount % 3;
				if (remainder == 0 || remainder > 1) {
					$(liElements).filter(":nth-child(" + (listCount - 1) + ")").addClass("last-line");
				}
				if (remainder == 0) {
					$(liElements).filter(":nth-child(" + (listCount - 2) + ")").addClass("last-line");
				}

			})
		})
	}
};
/*** Push portlet ***/
//Makes the whole background image clickable and sets
//the link as underline on hovering image
var pushPortlet = {
	init: function() {

		var push = $(".divpush p.read-more-text").parent().parent();
		push.css("cursor", "pointer");

		$(push).hover(
		function() {
			$(this).addClass("hover");
		},
		function() {
			$(this).removeClass("hover");
		}
	);

		$(push).click(function() {
			var href = $(this).children().children("p").children().attr("href");
			document.location.href = href;
		});
	}
};

/*** [Portlet] Image slideshow ***/
var slideshowSetup = {
	init: function() {

		var images = $(".slideshow-image");

		images.each(function(i) {
			var item = $(this);
			if (i == 0) {
				item.addClass("selected");
			}
			item.data('item', i);
		});


		var slideshow = $(".image-slideshow").addClass("slideshow-panel");
		if (slideshow.length > 0) {
			slideshow.position().left = 0;

			var sliderWidth = $("#slider").width();
			var noOfChildren = slideshow.children('div').length;

			slideshow.width(sliderWidth * noOfChildren);

			// TODO: future extension, this could be configurable in EPiServer
			var options = $.extend({
				autoRotate: 4000,
				interval: 1000
			});

			function animateImage(imageDiv) {
				images.removeClass("selected");
				imageDiv.addClass("selected");
				var leftSlidePixels = (sliderWidth * imageDiv.data("item"));
				var pixels = "-" + leftSlidePixels + "px";
				images.parent().stop().animate({ left: pixels, borderWidth: "0px" }, options.interval);
			};

			setInterval(function() {
				var currentImage = images.parent().find(".selected");
				var nextImage = currentImage.next();
				if (nextImage.length) {
					animateImage(nextImage);
				}
				else {
					animateImage(images.parent().find("div:first"));
				}

			}, options.autoRotate);
		}
	}
};

/*** [Portlet] Solution picker ***/
function initSolutionPickerIfExists() {
	var solutionPicker = $("div.solution-picker");
	if (solutionPicker.length !== 0) {
		initSolutionPicker(solutionPicker);
	}
};

function initSolutionPicker(solutionPicker) {
	showAndHideSegments(solutionPicker);

	var heading = solutionPicker.find("h2.portlet-heading");
	var currentHeadingAppend = "";
	solutionPicker.find("ul").each(attachClickEventHandler);

	function showAndHideSegments(solutionPicker) {
		$(solutionPicker).find("ul.segment-list").hide();
		$(solutionPicker).find("ul.segment-list:first").show();
	};

	function attachClickEventHandler() {
		var parentList = $(this);
		parentList.find("a.has-sub").each(function() {
			var linkTitle = $(this);
			linkTitle.bind("click", { element: parentList }, handleTitleClick);
		});
	};

	function handleTitleClick(event) {
		var linkTitle = $(this);
		event.preventDefault();
		currentHeadingAppend = " - " + linkTitle.text();
		hideSegmentListShowSubSegmentList(event.data.element, linkTitle);
	};

	function appendToHeading() {
		heading.append(currentHeadingAppend);
	};

	function hideSegmentListShowSubSegmentList(parentList, link) {
		var subSegmentClassName = link[0].hash.slice(1);
		parentList.slideUp(400, function() {
			showFooter(parentList, link);
			appendToHeading();
			parentList.parent().find("." + subSegmentClassName).slideDown(400);
		});
		return false;
	};

	function showFooter(parentList, link) {
		var footer = parentList.parent().find(".segments-back-link");
		var className = parentList[0].className;
		var hash = className.substr(className.indexOf(" ") + 1, className.length);
		$(footer).attr("href", "#" + hash);
		if ($(footer).data("events") === null) {
			footer.bind("click", { parentList: parentList, footer: footer }, handleBackClick);
		}
		footer.css("display", "block");
	};

	function handleBackClick(event) {
		event.preventDefault();
		var headingText = heading.text();
		heading.text(headingText.substr(0, headingText.indexOf(currentHeadingAppend)));
		currentHeadingAppend = "";
		$(solutionPicker).find("ul.segment-list").slideUp(400, function() {
			event.data.parentList.slideDown(400);
		});
		event.data.footer.hide();
	};
};

function initProductsAccessories() {
	addExpandClickEvents();
	hideDropdown();
	styleProductAccessoriesButtonsAsLinks();
	addClickEventHandlers();
};

function addExpandClickEvents() {
	$("div.closed").each(function() {
		$(this).unbind("click");
		$(this).click(function(event) {
			$(this).toggleClass("expanded");
			$(this).next().slideToggle(500);
		});
	});
}

function hideDropdown() {
	$("select[id$='productSelector']").hide();
};

function styleProductAccessoriesButtonsAsLinks() {
	$("button[id$='changeProductButton']").addClass("button-link");
	$("button[id$='changeAccessoriesButton']").addClass("button-link");
}
function addPostbackToButton(button) {
	$(button).click(function(event) {
		event.preventDefault();
		var inputBtn = $(this);
		var inputs = inputFields.fetch(inputBtn);
		var formAction = $("form").attr("action");
		$.post(formAction, inputs, function(responseText) {
			var html = $("<div/>");
			html.append(responseText.replace(/<script(.|\s)*?\/script>/g, ""));
			if (html.find("#aspnetForm").size() > 0) {
				$(":hidden[name='__VIEWSTATE']").val(html.find(":hidden[name='__VIEWSTATE']").val());
				$("#__EVENTVALIDATION").after(html.find("#__EVENTVALIDATION")).remove();
				$("#products-accessories").after(html.find("#products-accessories")).remove();
				$("#solution-price").after(html.find("#solution-price")).remove();
			}
			initProductsAccessories();
		});
	});
};

var inputFields = {
	fetch: function(jqButton) {
		var obj = {};
		$(":input").not($("button")).add(jqButton).each(function() {
			switch ($(this).attr("type")) {
				case "button":
					obj[$(":hidden[name$='EVENTTARGET']").attr("name")] = $(this).attr("name");
					obj[$(":hidden[name$='EVENTARGUMENT']").attr("name")] = "";
					obj[$(this).attr("name")] = "";
					break;
				case "checkbox":
				case "radio":
					if (!$(this).is(":checked")) {
						break;
					}
				default:
					obj[$(this).attr("name")] = $(this).val();
					break;
			}
		});
		return obj;
	}
};

function addClickEventHandlers() {
	addChangeProductButtonEventHandler();
	addProductSelectorEventHandlers();
	addChangeAccessoriesButtonEventHandler();
	addCalculatePriceButtonEventHandler();
}

function addChangeProductButtonEventHandler() {
	var changeProduct = $("button[id$='changeProductButton']");
	changeProduct.unbind("click");
	changeProduct.click(function(event) {
		event.preventDefault();
		$("div#product-selector").slideToggle(500);
	});
};

function addProductSelectorEventHandlers() {
	$(".product-selector-item").each(function() {
		$(this).unbind("click");
		$(this).click(function(event) {
			event.preventDefault();
			var dropdown = $("select[id$='productSelector']");
			dropdown.val($(this).text());
			$("div#product-selector").hide();
		});
		addPostbackToButton($(this));
	});
}

function addChangeAccessoriesButtonEventHandler() {
	var changeAccessories = $("button[id$='changeAccessoriesButton']");
	changeAccessories.unbind("click");
	addPostbackToButton(changeAccessories);
};

function addCalculatePriceButtonEventHandler() {
	var calculatePrice = $("button[id$='calculatePriceButton']");
	calculatePrice.unbind("click");
	addPostbackToButton(calculatePrice);
}