/**
 * NOTE: this is a common script included in every page. Keep it slim!
 */
(function(exports) {
	var getEl = function(selector) {
		return $(selector).get(0);
	}, isIE7 = function() {
		return $("html").hasClass("msIe7");
	}, isIE = function() {
		return $("html").hasClass("msIe");
	}, log = function() {
		if (console && console.log) {
			console.log.apply(undefined, arguments);
		}
	}, hasTouch = function() {
		try {
			document.createEvent("TouchEvent");
			return true;
		} catch (e) {
			return false;
		}
	}, toggleClass = function(el, styleClass) {
		var styleClasses = el.className;
		if (styleClasses.indexOf(styleClass) !== -1) {
			el.className = styleClasses.replace(styleClass, "");
		} else {
			el.className = styleClasses + " " + styleClass;
		}
	}, adjustDividerHeight = function() {
		var navigation = document.getElementById('navigation'), container = document
				.getElementById('container'), height = container.offsetHeight;
		if (navigation != null
				&& navigation.offsetHeight > container.offsetHeight) {
			height = navigation.offsetHeight;
			container.style.height = height + "px";
		}
		height -= 120; // correction for dividerTop and dividerBottom
		divider = document.getElementById('dividerLeft');

		if (divider != null) {
			divider.style.height = height + "px";
		}

		divider = document.getElementById('dividerRight');
		if (divider != null) {
			divider.style.height = height + "px";
		}
	}, createElement = function(name, attributes) {
		var el = document.createElement(name), name;
		for (name in attributes) {
			el.setAttribute(name, attributes[name]);
		}
		return el;
	}, createFileUploadOverlay = function(buttonLabel) {
		var fileUploadOverlay = createElement("div", {
			"class" : "fakefile"
		}), input = createElement("input", {
			"class" : "sam-button-light file-name-button",
			disabled : "disabled"
		}), button = createElement("input", {
			"class" : "sam-button-light",
			type : "button",
			value : buttonLabel,
			id : "fakeFileuploadButton"
		});

		fileUploadOverlay.appendChild(input);
		fileUploadOverlay.appendChild(button);
		return fileUploadOverlay;
	}, augmentFileUploads = function(buttonLabel) {
		if (!isIE()) { // TODO create solution for IE if requested from
						// business. So far IE applies hard security
						// restrictions to file uploads
			$("input[type=file]")
					.each(
							function() {
								var fileUpload = $(this), fileUploadOverlay = createFileUploadOverlay(buttonLabel);

								fileUpload.addClass("sam-offscreen");
								fileUpload.parent().append(fileUploadOverlay);
								fileUpload
										.bind(
												"change",
												function() {
													var labelButton = $(
															fileUploadOverlay)
															.find(
																	".file-name-button"), fileName = fileUpload
															.val();

													if (fileName
															.match(/fakepath/)) {
														fileName = fileName
																.substring(fileName
																		.lastIndexOf("\\") + 1);
													}
													labelButton.val(fileName);
												});
								$(fileUploadOverlay).bind("click", function() {
									fileUpload.trigger("click");
								});
							});
		}
	}, clickEvent = "click", prepareTooltip = function(ev) {
		var padding = 8;
		var toggle = $(ev.target);
		var tooltip = $('#' + toggle.data('tooltip-divid'));
		var element = $('#' + toggle.data('tooltip-elementid'));
		if (element.selector == '#undefined') {
			element = toggle;
		}
		var direction = toggle.data('tooltip-direction');
		var tooltipHeight = tooltip.height();
		var tooltipWidth = tooltip.width();
		var elementPos = element.position();
		var elementPosTop = elementPos.top;
		var elementPosLeft = elementPos.left;
		var elementWidth = element.width();
		var elementHeight = element.height();
		var container = element.closest(".sam-tooltip-container");
		if (container && container !== '#undefined' && container.length > 0) {
			elementPosTop = element.offset().top - container.offset().top;
			elementPosLeft = element.offset().left - container.offset().left;
		}
		if (direction == "topleft") {
			var posTop = elementPosTop - tooltipHeight - padding;
			if (posTop > padding) {
				tooltip.css('top', posTop);
			} else {
				tooltip.css('top', elementPosTop + elementHeight + padding);
			}
			var posLeft = elementPosLeft - tooltipWidth + elementWidth;
			if (posLeft > padding) {
				tooltip.css('left', posLeft);
			} else {
				tooltip.css('left', padding);
			}
		} else if (direction == "bottomright") {
			tooltip.css('top', elementPosTop + elementHeight + padding);
			tooltip.css('left', elementPosLeft);
		} else if (direction == "bottomleft") {
			tooltip.css('top', elementPosTop + elementHeight + padding);
			var posLeft = elementPosLeft - tooltipWidth + elementWidth;
			if (posLeft > padding) {
				tooltip.css('left', posLeft);
			} else {
				tooltip.css('left', padding);
			}
		} else { // default = topright
			var posTop = elementPosTop - tooltipHeight - padding;
			if (posTop > padding) {
				tooltip.css('top', posTop);
			} else {
				tooltip.css('top', elementPosTop + elementHeight + padding);
			}
			tooltip.css('left', elementPosLeft);
		}
		return tooltip;
	}, showTooltip = function(ev) {
		prepareTooltip(ev).show();
	}, hideTooltip = function(ev) {
		var toggle = $(ev.target);
		var tooltip = $('#' + toggle.data('tooltip-divid'));
		tooltip.hide();
	}, toggleTooltip = function(ev) {
		ev.preventDefault();
		var tooltip = prepareTooltip(ev);
		tooltip.toggle();
	}, setIeClass = function() {
		if ($.browser.msie) {
			var version = $.browser.version.split('.')[0];
			$('body').addClass('sam-msie' + version);
		}
	}, poller = function(pollFunction, completedFunction, numberOfPolls,
			initialWait, timeToWait) {
		var checkForResult = function() {
			pollFunction(function(completed) {
				numberOfPolls--;
				if (completed) {
					completedFunction(true);
				} else if (numberOfPolls) {
					setTimeout(checkForResult, timeToWait);
				} else {
					completedFunction(false);
				}
			});
		};

		setTimeout(checkForResult, initialWait);
	};

	$(function() {
		var navigationIcon = getEl('.sam-navigation-icon'), page = getEl("#sam-page"), mobileMenu = getEl('#navigation'), mobileMenuContent = getEl('#sam-navigation-mobile-content'), body = $(document.body);

		if (hasTouch()) {
			clickEvent = "touchstart";
		}
		if (navigationIcon) {
			var menuOpenClass = 'menu-open';
			$(navigationIcon).click(function(e) {
				e.preventDefault();
				e.stopPropagation();
				$(mobileMenu).addClass(menuOpenClass);
				$(page).addClass(menuOpenClass);
				$(mobileMenuContent).scrollTop(0);
				// $(mobileMenu).height($(page).height());
				body.addClass("fixed-body-when-open-menu");
				$(page).bind('touchstart mousedown', function(e) {
					e.preventDefault();
					e.stopPropagation();
					$(mobileMenu).removeClass(menuOpenClass);
					$(page).removeClass(menuOpenClass);
					body.removeClass("fixed-body-when-open-menu");
					$(page).unbind('touchstart mousedown');
				});
			});
		}
	});

	/***************************************************************************
	 * this is the official entry point to provide SAM specific javascripts. A
	 * single global variable should be used by SAM - no more.
	 **************************************************************************/
	window.scssam = {
		adjustDividerHeight : adjustDividerHeight,
		augmentFileUploads : augmentFileUploads,
		showTooltip : showTooltip,
		hideTooltip : hideTooltip,
		toggleTooltip : toggleTooltip,
		setIeClass : setIeClass,
		clickEvent : (hasTouch() ? "touchstart" : "click"),
		util : {
			toggleClass : toggleClass,
			isIE7 : isIE7
		},
		poller : poller
	};

	// deprecated: remove as soon as possible
	window.adjustDividerHeight = adjustDividerHeight;
}(this));

$(function() {
	// scssam.adjustDividerHeight();

	$(".DESKTOP [data-tooltip-divid]").bind('mouseover', scssam.showTooltip)
			.bind('mouseout', scssam.hideTooltip);

	$(".TABLET [data-tooltip-divid], .PHONE [data-tooltip-divid]").bind(
			'click', scssam.toggleTooltip);

	scssam.setIeClass();
});

/**
 * Changes the css class when a checkbox is checked/unchecked.
 */
$(function() {
	$('input[type=checkbox]').each(function() {
		// first, set all to the initial class
		toggleCheckboxLabelClass($(this), $(this).parent());

		// second, add event handler to do the same on change
		$(this).on('change', function() {
			toggleCheckboxLabelClass($(this), $(this).parent());
		});
	});
});

function toggleCheckboxLabelClass(checkbox, label) {
	if (checkbox.is(':checked')) {
		label.attr('class', 'checkedCheckbox');
	} else {
		label.attr('class', 'uncheckedCheckbox');
	}
}