
/*-------------------------------------------------------
* ------------------kvTitle------------------------------
* -------------------------------------------------------*/

(function() {

var kvTitle = {

	titlePopupTimeoutId: null,
	titlePopupTimeoutDuration: 4000,
	titlePopupTimeoutStartDuration: 600,

	init: function() {

		// Set up event handlers for elements with class=kvTitle and title-attribute:
		$(".kvTitle[title]").hover(
			function () {
				kvTitle.toggleTitlePopupsForElement(true, this);
			},
			function () {
				kvTitle.toggleTitlePopupsForElement(false, this);
			}
		);

		$(".kvTitle[title]").mousedown(function() {
			kvTitle.toggleTitlePopupsForElement(false, this);
			return true;
		});

	},


	// Display or hide title-element.
	toggleTitlePopupsForElement: function(display, element) {

		window.clearTimeout(kvTitle.titlePopupTimeoutId);

		if (display) {

			// If title-attribute is empty, return:
			if ($(element).attr("title") == "") {
				//console.log("return ...");
				return;
			}

			// Empty title-element to prevent default display of it and store in jQuery.data:
			$.data(element, "title", $(element).attr("title"));
			$(element).attr({"title": ""});

			kvTitle.titlePopupTimeoutId = window.setTimeout(function() {

				var bottom = ($(window).height() - $(element).offset().top) + 10;
				var left = $(element).offset().left;
				var elementWidth = $(element).width();

				// Determin if element should display left or right of trigger element.
				var displayLeft = (($(document).width() / 2) > left ? false : true) ;

				// Read string-value from jQuery.data for this element:
				var el = kvTitle.generateTitleElement($.data(element, "title"), displayLeft);

				$("body").append(el);
				var elWidth = el.width();
				var elPadding = parseInt(el.css("padding-left").replace("px", "")) * 2;

				if (displayLeft) {
					left = (left - (elWidth + elPadding) + elementWidth) + 5;
					var spanEl = el.find("span");
					var spanElRight = (elementWidth / 2)- 2;
					if (spanElRight <= 2) {
						spanElRight = 2;
					}
					spanEl.css({"right": spanElRight + "px"});
				}

				el.css({"left": left + "px", "bottom": bottom + "px"});
				el.fadeIn(200);

				kvTitle.titlePopupTimeoutId = window.setTimeout(function() {
					kvTitle.toggleTitlePopupsForElement(false, el);
				}, kvTitle.titlePopupTimeoutDuration);

			}, kvTitle.titlePopupTimeoutStartDuration);


		} else {

			// Re-insert title attribute from data:
			$(element).attr({"title": $.data(element, "title")});

			$(".kvTitleElement").fadeOut(100, function() {
				$(this).remove();
			});
		}
	},

	generateTitleElement: function(txt, displayLeft) {

		var el = $("<div/>").addClass("kvTitleElement").html("<span> </span>" + txt);
		if (!displayLeft) {
			el.addClass("displayLeft");
		}
		return el;

	}

};

kvTitle.init();

})();
