/**
 * gastelijst.js
 * voor de club 3voor12 gastenlijst pagina
 * Een gastenlijst wordt allee online getoond als deze is gekoppeld aan de Map 'Online Gastenlijst'.
 * @author B.Wikkeling <bjorn@ibe-hosting.nl>
 *
 */
var guestlistEpisodes = [];
var txtGuestListFull = "Gastenlijst is helaas vol";
var txtPersonalInfo = "Ingeschreven met ### <img src=\"/pix/iconen/delete.png\" class=\"png\" width=\"20\" height=\"20\" alt=\"X\" title=\"Verwijder reservering\" />";
var txtReservedMsg = "Je inschrijving met ### is verwerkt";
var txtAvailable = "Nog ### beschikbaar";
var imgReserve = "/pix/navigatie/reserveren.png";
var txtReserve = "RESERVEREN";
var imgModify = "/pix/navigatie/wijzigen.png";
var txtModify = "WIJZIGEN";
var personalInfo = "<span><div>voornaam (verplicht): <input type=\"text\" name=\"firstname\" /></div><div>achternaam (verplicht): <input type=\"text\" name=\"lastname\" /></div></span>";
/**
 * initialize the page
 */
function init() {
	createForm();
}
/**
 * maakt het formulier om je op te geven voor de gastenlijst
 */
function createForm() {
	var processed = 0;
	guestlistService.getOnlineGuestlistEpisodes(done);
	function done(response) {
		if (response) {
			for (var i = 0, len = response.length; i < len; ++i) {
				var number = response[i].number;
				guestlistEpisodes[i] = {episode:response[i]};
				guestlistService.getGuestlistEntriesAvailable(response[i].number, curry(pushEpisode, i));
			}
		}
		function pushEpisode(i, resp) {
			guestlistEpisodes[i]["available"] = resp;
			++processed;
			if (processed == response.length) {
				display();
			}
		}
	}
	function display() {
		var html = "";
		html += "<ul>";
		for (var i = 0, len = guestlistEpisodes.length; i < len; ++i) {
			var episode = guestlistEpisodes[i].episode;
			var isAvailable = guestlistEpisodes[i].available > 0;
			var cls = i % 2 == 0 ? "up" : "down";
			cls += isAvailable ? " available" : " full";
			cls += i + 1 == len ? " last" : "";
			html += "<li class=\"" + cls + "\" id=\"episode_" + episode.number + "\"";
			if (episode.images[0]) {
				html += " style=\"background-image: url('" + episode.images[0].URL + "+s(160)+part(40x20x120x100)+crop(80x80)')\"";
  			//html += '<img src="'+episode.images[0].URL+'+s(90)+part(20x10x65x55)+crop(45x45)" width="45" height="45" alt="" />';
			}
			html += ">";
			html += "<div class=\"available\">";
			if (isAvailable) {
				var num = guestlistEpisodes[i].available > 1 ? guestlistEpisodes[i].available + " plaatsen" : "1 plaats";
				html += "<p class=\"numAvailable\">" + txtAvailable.replace("###", num) + "</p>";
				html += "<p class=\"reserve\">Aantal personen: <select name=\"count\"><option value=\"1\" selected=\"selected\">1</option><option value=\"2\">2</option></select>";
				html += "<input type=\"image\" src=\"/pix/navigatie/reserveren.png\" width=\"75\" height=\"20\" class=\"button png\" alt=\"RESERVEREN\" value=\"\" /></p>";
				html += "<span class=\"personalInfo\">"+personalInfo+"</span>";
			} else {
				html += "<p class=\"numAvailable\">" + txtGuestListFull + "</p>";
				html += "<p class=\"reserve hidden\">Aantal personen: <select name=\"count\"><option value=\"1\" selected=\"selected\">1</option><option value=\"2\">2</option></select>";
				html += "<input type=\"image\" src=\"/pix/navigatie/reserveren.png\" width=\"75\" height=\"20\" class=\"button png\" alt=\"RESERVEREN\" value=\"\" /></p>";
				html += "<br /><span class=\"personalInfo\"></span>";
			}
			html += "</div>";
			html += "<h1>" + episode.title + "</h1>";
			html += "<p>" + episode.subtitle + "</p>";
			html += getDate(episode.begin);
				//html += episode.end;
			html += "</li>";
		}
		html += "</ul>";
		$("div#formDiv").html(html).find("li").find("input.button").click(function () {
			doClick(this);
		});
      
      // personal items
		if (loggedin) {
			showPersonalItems();
		}
			
      // after login
		var urlParams = getUrlParam();
		if (urlParams && urlParams.refresh && urlParams.number && urlParams.lastAction == "addGuestlistEntry" && urlParams.count && urlParams.firstname && urlParams.lastname) {
			
			var objLi = $("li#episode_" + urlParams.number);
			if( objLi.length > 0){
				objLi.find("select").selectOptions(urlParams.count, true);
				objLi.find("input[name='firstname']").val(unescape(urlParams.firstname));
				objLi.find("input[name='lastname']").val(unescape(urlParams.lastname));
				objLi.find("input.button").click();
			}			
		}
	}
}
function doClick(el) {
	var $li = $(el).parent().parent().parent();
	var number = $li.attr("id").split("_")[1];
	var count = $(el).siblings("select option:selected").val();
	
	var firstname = $li.find("input[name='firstname']").val();
	if(firstname == ''){
		alert('Vergeet niet je voornaam!');
		return;
	}
	var lastname = $li.find("input[name='lastname']").val();
	if(lastname == ''){
		alert('Vergeet niet je achternaam!');
		return;
	}	
	printfire("count: " + count+", naam: "+firstname+" "+lastname);
	
	if (!loggedin) {
		afterLoginParams.lastAction = "addGuestlistEntry";
		afterLoginParams.number = number;
		afterLoginParams.count = count;
		afterLoginParams.firstname = escape(firstname);
		afterLoginParams.lastname = escape(lastname);
		
		loginNew();
	} else {
		waitStart();
		guestlistService.addGuestlistEntry(firstname, lastname, number, count, added);
	}
	function added(response) {
		waitStop();
		var p = count > 1 ? count + " personen" : "1 persoon";
		var pMsg = txtPersonalInfo.replace("###", p);
		var aMsg = txtReservedMsg.replace("###", p);
		//alert(aMsg);
		$li.find("span.personalInfo").html(pMsg).find("img").click(function () {
			alert("Je bent nu uitgeschreven van de gastenlijst");		
			removeGuestlistEntry(this);
		});
		guestlistService.getGuestlistEntriesAvailable(number, updateAvailable);
	}
	function updateAvailable(response) {
		if (response > 0) {
			var num = response > 1 ? response + " plaatsen" : "1 plaats";
			$li.find("p.numAvailable").html(txtAvailable.replace("###", num)).end().find("input.button").attr({src:imgModify, alt:txtModify});
		} else {
			$li.find("p.numAvailable").html(txtGuestListFull).end().find("input.button").attr({src:imgModify, alt:txtModify}).find("p.reserve").addClass("hidden");
		}
	}
}
function showPersonalItems() {
	guestlistService.getGuestlistEntries(done);
	function done(response) {
		if (response) {
			for (var i = 0, ln = response.length; i < ln; ++i) {
				var p = response[i].numberOfPeople > 1 ? response[i].numberOfPeople + " personen" : "1 persoon";
				var pMsg = txtPersonalInfo.replace("###", p);
				$("li#episode_" + response[i].episode.number).find("input.button").attr({src:imgModify, alt:txtModify}).end().find("p.reserve").removeClass("hidden").end().find("span.personalInfo").html(pMsg);
				printfire("IN", $("li#episode_" + response[i].episode.number).find("input.button"));
			}
			$("div#formDiv ul li").find("span.personalInfo img").click(function () {
				alert("Je bent nu uitgeschreven van de gastenlijst");
				removeGuestlistEntry(this);
			});
		}
	}
}
function removeGuestlistEntry(el) {
	waitStart();
	var $li = $(el).parent().parent().parent();
	var number = $li.attr("id").split("_")[1];
	guestlistService.removeGuestlistEntry(number, done);
	printfire("removeGS", $li);
	function done(response) {
		guestlistService.getGuestlistEntriesAvailable(number, updateAvailable);
		$li.find("span.personalInfo").html(personalInfo);
	}
	function updateAvailable(response) {
		waitStop();
		printfire("af del", $li, $li.find("p.numAvailable"));
		if (response > 0) {
			var num = response > 1 ? response + " plaatsen" : "1 plaats";
			$li.find("p.numAvailable").html(txtAvailable.replace("###", num)).end().find("input.button").attr({src:imgReserve, alt:txtReserve}).end().find("p.reserve").removeClass("hidden");
		} else {
			$li.find("p.numAvailable").html(txtGuestListFull).end().find("p.reserve").addClass("hidden").end().find("input.button").attr({src:imgReserve, alt:txtReserve});
		}
	}
}