/**
 * @author Filip Michalowski / Fi Stockholm
 */
Namespace.create("ng.modules.speakersModule");

ng.modules.speakersModule.SpeakersModule = function () {

	//private variables:
	var moduleContainer;
	var moduleData;
	
	var defaultItemNo = 8;
	var moduleTooltipContainer;
	var moduleTooltipTimeout;

	//private methods:
	
	var draw = function() {		
		
		createTooltipContainer();
		updateStyles();	
		initalizeListeners();	
		initializeForm();
		//initializePagination(moduleContainer.find("table.speakerList"));		
	};
	
	var createTooltipContainer = function() {
		moduleTooltipContainer = moduleContainer.find("div.speakersModuletooltip").clone();        
		$("body").append(moduleTooltipContainer);
		
		moduleTooltipContainer.mouseover(function() {
			stopModuleTooltipTimeout();
		});
		moduleTooltipContainer.mouseout(function() {
			startModuleTooltipTimeout();
		});
	};
	
	var initializeForm = function() {
		
		var form = moduleContainer.find("#filterForm");		
		var table = moduleContainer.find("table.speakerList");
		
		//empty the e-mail input field on first click
		var speakernameinput = form.find("input[name='speakername']");
		speakernameinput.val("Type name to filter");
		speakernameinput.focus(function() {
			$(this).unbind();
			$(this).removeClass("textinputerror").addClass("textinput").val("");
			
			$(this).keyup(function() {
				if (validateForm() === false) {				
					return false;
				} else {
					filterItems( form.find("input[name='speakername']").val() );
				}
			});
		});		
		
		// rollover/down states for submit button
		form.find("input[name='findBt']").mouseover(function() {
			var src = $(this).attr("src");
			src = src.split("_out").join("_over");
			$(this).attr("src", src);
		});
		form.find("input[name='findBt']").mouseout(function() {
			var src = $(this).attr("src");
			src = src.split("_over").join("_out");
			src = src.split("_down").join("_out");
			$(this).attr("src", src);
		});
		form.find("input[name='findBt']").mousedown(function() {
			var src = $(this).attr("src");
			src = src.split("_over").join("_down");
			$(this).attr("src", src);
		});
		form.find("input[name='findBt']").mouseup(function() {
			var src = $(this).attr("src");
			src = src.split("_down").join("_over");
			$(this).attr("src", src);
		});
				
		// submit event handler
		form.submit(function() {
			
			if (validateForm() === false) {				
				return false;
			} else {
				filterItems( form.find("input[name='speakername']").val() );
			}		  
			
        	return false;
        });
	};
	
	var initalizeListeners = function() {
		moduleContainer.find("table.speakerList td").mouseover(function() {
			$(this).addClass("active");
			showTooltip($(this));
		});
		moduleContainer.find("table.speakerList td").mouseout(function() {
			$(this).removeClass("active");
			hideTooltip($(this));
		});
	};
	
	var initializePagination = function(table) {
		
		var currentPage;
		var buttonUp = moduleContainer.find("a.scrollUp");
		var buttonDown = moduleContainer.find("a.scrollDown");
		
		var itemNo = table.find("tbody tr").length;
		var maxPage = Math.ceil ( itemNo / defaultItemNo );
						
		if (itemNo === 0) {
			currentPage = 0;			
		} else {
			currentPage = 1;
		}
				
		buttonUp.fadeTo(50, 0.5).css("cursor", "default").attr("title","");
		moduleContainer.find("span.total").html("/ " + maxPage);
		moduleContainer.find("span.current").html("" + currentPage);
		
		buttonUp.unbind();
		buttonDown.unbind();
		
		if (maxPage > 1) {
			buttonUp.click(function() {									
				if (currentPage > 1) {
					currentPage--;
					showPage(currentPage);
					buttonDown.fadeTo(50, 1).css("cursor", "pointer").attr("title","Scroll Down");						
				}
				
				if (currentPage === 1) {
					$(this).fadeTo(50, 0.5).css("cursor", "default").attr("title","");
				} 									
				
				return false;
			});
			buttonDown.click(function() {				
				if (currentPage < maxPage) {
					currentPage++;
					showPage(currentPage);
					buttonUp.fadeTo(50, 1).css("cursor", "pointer").attr("title","Scroll Up");
				}
				
				if (currentPage === maxPage) {
					$(this).fadeTo(50, 0.5).css("cursor", "default").attr("title","");						
				}						
									
				return false;
			});
			buttonDown.fadeTo(50, 1).css("cursor", "pointer").attr("title","Scroll Down");
		} else {
			buttonDown.fadeTo(50, 0.5).css("cursor", "default").attr("title","");			
			buttonUp.click(function() {					
				return false;
			});
			buttonDown.click(function() {				
				return false;
			});
		}		
		
	};
	
	var showPage = function(index) {
		var table = moduleContainer.find("table.speakerList");
		
		var indexStart = ( index - 1 ) * defaultItemNo;
		var indexEnd = index * defaultItemNo - 1;
		
		table.find("tbody tr").removeClass("nodisplay");
		table.find("tbody tr:lt(" + indexStart + ")").addClass("nodisplay");
		table.find("tbody tr:gt(" + indexEnd + ")").addClass("nodisplay");
		
		moduleContainer.find("span.current").html(index);
		
	};
	
	var filterItems = function(query) {
		// since 'contains' is case-sensitive, convert first letter of each query to uppercase to match names we're searching for
		var tmp = query.split(" ");
		var query = '';
		for(var i=0; i<tmp.length;i++){
			query += tmp[i].charAt(0).toUpperCase() + tmp[i].substr(1,tmp[i].length-1);
			if(i < tmp.length-1){query+=' ';}
		}
		
		//clean previous result
		moduleContainer.find("table.result").remove();
		
		var table = moduleContainer.find("table.speakerList");	
		table.addClass("nodisplay");	
		var resultTable = table.clone().addClass("result").removeClass("nodisplay");
		resultTable.find("tbody").empty();
		
		$("td a.fn:contains('"+ query + "')", table).each(function () {
			var row = $(this).parent().parent().parent().clone().removeClass("nodisplay");			
			resultTable.find("tbody").append(row);
		});		
		
		$("tbody tr:even td", resultTable).css("background-color", "#f1f1f1");
		$("tbody tr:odd td", resultTable).css("background-color", "#ffffff");
		moduleContainer.find("table.speakerList").after(resultTable);
		
		resultTable.find("td").mouseover(function() {
			$(this).addClass("active");
			showTooltip($(this));
		});
		resultTable.find("td").mouseout(function() {
			$(this).removeClass("active");
			hideTooltip($(this));
		});
		
		var itemNo = resultTable.find("tbody tr").length;
						
		if (itemNo === 0) {
			showNoResultsScreen(query);			
		} else {
			hideNoResultScreen();
		}
		
		initializePagination(resultTable);
		
	};
	
	var showNoResultsScreen = function(query) {
		
		var noResultScreen = moduleContainer.find("div.noresult");
		var message = $.tmpl(ng.modules.speakersModule.SpeakersModuleTemplates.NoResultScreen, {query: query});
		noResultScreen.find("p.description").html(message);		
		noResultScreen.removeClass("nodisplay");
		
		noResultScreen.find("a.tryagain").click(function() {
			moduleContainer.find("input[name='speakername']").val("")
			moduleContainer.find("input[name='speakername']").focus();
			return false;
		});
		noResultScreen.find("a.clearsearch").click(function() {
			moduleContainer.find("input[name='speakername']").val("");
			moduleContainer.find("input[name='speakername']").focus();
			moduleContainer.find("table.result").remove();
			moduleContainer.find("table.speakerList").removeClass("nodisplay");
			initializePagination(moduleContainer.find("table.speakerList"));
			return false;
		});
	};
	
	var hideNoResultScreen = function(query) {
		var noResultScreen = moduleContainer.find("div.noresult");
		noResultScreen.addClass("nodisplay");
		noResultScreen.find("a.tryagain").unbind();
		noResultScreen.find("a.clearsearch").unbind();
	};
	
	var updateStyles = function() {
		// colors of table rows
		moduleContainer.find("table.speakerList tbody tr:even td").css("background-color", "#f1f1f1");
		moduleContainer.find("table.speakerList tbody tr:odd td").css("background-color", "#ffffff");
			
		//turn off scrollbar
		//moduleContainer.find("div.tableWrapper").css("overflow", "hidden");	
		
		//show pagination
		//moduleContainer.find("div.pagination").removeClass("nodisplay");
		
	};
	
	var showTooltip = function(element) {	
	
		stopModuleTooltipTimeout();	
				        
		moduleTooltipContainer.find("img").attr("src", element.find("img").attr("src") );
		moduleTooltipContainer.find("a").attr("href", element.find("a.fn").attr("href") );
		//moduleTooltipContainer.find("p.title").text( element.find("span.role").text() );
		
		var offset = $(element).offset();
		var top = $.browser.safari ? 111 : 100;	
		moduleTooltipContainer.css({
			left: offset.left + 100,
			top: offset.top - top // safari 111
		});		
		
		moduleTooltipContainer.removeClass("nodisplay");
				
	};
		
	var hideTooltip = function(element){
		moduleTooltipContainer.addClass("nodisplay");		
	};
	
	var hideTooltip = function(element){		
		startModuleTooltipTimeout();		
	};
	
	var onModuleTooltipTimeout = function(){
		moduleTooltipContainer.addClass("nodisplay");
	}
	
	var startModuleTooltipTimeout = function() {
		moduleTooltipTimeout = setTimeout(onModuleTooltipTimeout, 100);
	}
	
	var stopModuleTooltipTimeout = function() {
		clearTimeout(moduleTooltipTimeout);
	}
	
	var validateForm = function() {
		var speakernameinput = moduleContainer.find("input[name='speakername']");
		var speakername = speakernameinput.val();		
		
		var formValid = true;
		
		if (speakernameinput.hasClass("textinputerror") || speakername === "Type name to filter") {
			formValid = false;
			speakernameinput.removeClass("textinput").addClass("textinputerror").val("Type name to filter");
			speakernameinput.focus(function() {
				$(this).unbind();
				$(this).removeClass("textinputerror").addClass("textinput").val("");				
				
				$(this).keyup(function() {
					if (validateForm() === false) {				
						return false;
					} else {
						filterItems( form.find("input[name='speakername']").val() );
					}
				});
			});
		};
		
		return formValid;
	};

	//the returned object here will become ng.modules.speakersModule.SpeakersModule:
	return  {
		
		// public
		
		init: function (container, data) {
			moduleContainer = container;
			moduleData = data;
			
			draw();
		}

	};
}(); // the parens here cause the anonymous function to execute and return


/**
 * Markup templates for the SpeakersModule
 */
ng.modules.speakersModule.SpeakersModuleTemplates = 
{
	NoResultScreen : "Sorry, no search results for #{query}.<br/>Please <a href=\"#\" title=\"Try again\" class=\"tryagain\">try again</a> or <a href=\"#\" title=\"Clear search\" class=\"clearsearch\">clear search</a>"
	
};