/**
 * Aanschouw object
 */
Aanschouw = {
	
	archiveIsBuilt : false,
	contentid : "",
	prevTargetId : "",
	apiPath : "/api/mobile",
	
	/**
	 * JQTouch object
	 */
	jQT : $.jQTouch(),
	
	/**
	 * On document ready: load data and initialize the application on success
	 */
	init : function() {
		$(document).ready(
			function(){
				//$.getJSON('data/getInit.js', Aanschouw.onInitDataLoad);
				$.getJSON(Aanschouw.apiPath+"?method=getInit", Aanschouw.onInitDataLoad);
			}
		);
	},
	
	/**
	 * JSON init data load handler
	 */
	onInitDataLoad : function(data, success) {
		if(success == 'success') {
			Aanschouw.addExitRoutine();
			Aanschouw.buildApp(data);
			$('#jqt').bind('pageAnimationEnd', Aanschouw.onPageAnimationStart);
			Aanschouw.jQT.goTo('#home');
		}else{
			console.log("handle error!");
		}
	},
	
	/**
	 * Run DOM template through Mustache and replace it
	 */
	mustachify : function(selector, data, appendto) {
		var template = selector.html();
		var html = Mustache.to_html(template, data);
		// if !appendto, replace selector html, else append to selector "appendto"
		if(!appendto) {
			selector.html(html);
		}else{
			appendto.append(html);
		}
	},
	
	/**
	 * Set contentid so the target page knows what json data to load
	 */
	setContentId : function(_contentid) {
		
		Aanschouw.contentid = _contentid;
	},
	
	/**
	 * loading template
	 */
	loadingTemplate : '<div class="loading"></div>',
	
	/**
	 * Handle animation event and build/destroy pages if necesary
	 */
	onPageAnimationStart : function(evt) {
		
		if(evt.target.className == "current") {
			switch(evt.target.id) {
				case "home":
					if(Aanschouw.prevTargetId == "exhibition") {
						$("#exhibition").html("");
					}
					break;
				case "archive":
					if(!Aanschouw.archiveIsBuilt) {
						Aanschouw.archiveIsBuilt = true;
						$("#archive").html(Aanschouw.loadingTemplate);
						//$.getJSON('data/getArchive.js', Aanschouw.onArchiveDataLoad);
						$.getJSON(Aanschouw.apiPath+"?method=getArchive", Aanschouw.onArchiveDataLoad);
					}else{
						// clear html
						$("#series").html("");		
					}
					break;
				case "series":
					if(Aanschouw.prevTargetId != "exhibition") {
						$("#series").html(Aanschouw.loadingTemplate);
						//$.getJSON('data/getSeries.js', Aanschouw.onSeriesDataLoad);
						$.getJSON(Aanschouw.apiPath+"?method=getSeries&itemID="+Aanschouw.contentid, Aanschouw.onSeriesDataLoad);
					}else{
						// clear html
						$("#exhibition").html("");		
					}
					break;
				case "exhibition":
					$("#exhibition").html(Aanschouw.loadingTemplate);
					//$.getJSON('data/getExhibition.js', Aanschouw.onExhibitionDataLoad);
					$.getJSON(Aanschouw.apiPath+"?method=getExhibition&itemID="+Aanschouw.contentid, Aanschouw.onExhibitionDataLoad);
					break;
			}
			Aanschouw.prevTargetId = evt.target.id;
		}
	},
	
	/**
	 * Build the application using the loaded data
	 */
	buildApp : function(data) {
		
		if(data.homebody != "mobile_home") $("#home #homebody").html(data.homebody);
		if(!data.nextexhibition.id) $('#nextarrow').css("display", "none");
		$("#about #aboutbody").html(data.aboutbody);
		$("#curexhib").click(function(event){Aanschouw.setContentId(event.currentTarget.id)});
		$("#curexhib").attr("id", data.currentexhibition.id);
		$("#nextexhib").click(function(event){Aanschouw.setContentId(event.currentTarget.id)});
		$("#nextexhib").attr("id", data.nextexhibition.id);
	},

	/**
	 * Build archive page
	 */
	onArchiveDataLoad : function(data, success) {
		if(success == 'success') {
			Aanschouw.buildArchivePage(data);
		}else{
			console.log("handle error!");
		}
	},
	 
	archiveTemplate : '<div class="toolbar">\
						<h1>Archief</h1>\
						<a class="button back" href="#home">terug</a>\
					</div>\
					<ul id="serieslist">\
						{{#archive}}<li class="arrow"><a href="#series" id="{{id}}">{{title}}</a></li>{{/archive}}\
					</ul>',
	
	buildArchivePage : function(archiveData) {
		$("#archive").html(Aanschouw.archiveTemplate);
		Aanschouw.mustachify($("#archive #serieslist"), archiveData);
		$("#archive li a").click(function(event){Aanschouw.setContentId(event.currentTarget.id)});
	},
	
	/**
	 * Build series page
	 */
	onSeriesDataLoad : function(data, success) {
		if(success == 'success') {
			Aanschouw.buildSeriesPage(data);
		}else{
			console.log("handle error!");
		}
	},
	
	seriesTemplate : '<div class="toolbar">\
						<h1>{{title}}</h1>\
						<a class="button back" href="#archive">terug</a>\
					</div>\
					<ul id="exhibitionlist">\
						{{#exhibitions}}<li class="arrow"><a href="#exhibition" id="{{id}}">{{title}}</a></li>{{/exhibitions}}\
					</ul>',
				
	buildSeriesPage : function(seriespageData) {
		
		$("#series").html(Aanschouw.seriesTemplate);
		Aanschouw.mustachify($("#series"), seriespageData);
		// van tot
		if(seriespageData.datestart) {
			var dateHtml = "<div class='text'>van: "+seriespageData.datestart;
			if(seriespageData.dateend) {
				dateHtml = dateHtml + "<br>tot: "+seriespageData.dateend;
			}
			dateHtml = dateHtml + "</div>";
			$("#series").append(dateHtml);
		}
		// flyer
		if(seriespageData.flyer) {
			$("#series").append('<img src="'+seriespageData.flyer+'">');
		}
		if(seriespageData.flyerdesign) {
			if(seriespageData.flyerlink) {
				$("#series").append("<div class='text'>flyerontwerp: <a href="+seriespageData.flyerlink+">"+seriespageData.flyerdesign+"</a></div>");
			}else{
				$("#series").append("<div class='text'>flyerontwerp: "+seriespageData.flyerdesign+"</div>");	
			}
		}
		// description
		if(seriespageData.description) {
			$("#series").append("<div class='text'>"+seriespageData.description+"</div>");	
		}
		//links
		if(seriespageData.links) {
			var linksHtml = "<div class='text'>";
			for(var i in seriespageData.links) {
				if(seriespageData.links[i].description)	{
					linksHtml = linksHtml+"<a href="+seriespageData.links[i].link+">"+seriespageData.links[i].description+"</a><br>";
				}else{
					linksHtml = linksHtml+"<a href="+seriespageData.links[i].link+">"+seriespageData.links[i].link+"</a><br>";	
				}
			}
			linksHtml = linksHtml+"</div>";
			$("#series").append(linksHtml);
		}
		// click function
		$("#series li a").click(function(event){Aanschouw.setContentId(event.currentTarget.id)});
	},

	/**
	 * Build exhibition page
	 */
	onExhibitionDataLoad : function(data, success) {
		if(success == 'success') {
			Aanschouw.buildExhibitionPage(data);
		}else{
			console.log("handle error!");
		}
	},
	
	exhibitionTemplate : '<div class="toolbar">\
							<h1>{{title}}</h1>\
							<a class="button back" href="#series">terug</a>\
						</div>\
						<div class="imagegalleryholder" id="imagegallery"></div>',
	
	buildExhibitionPage : function(exhibitionData) {
		$("#exhibition").html(Aanschouw.exhibitionTemplate);
		Aanschouw.mustachify($("#exhibition"), exhibitionData);
		// startdate, artist, artist site
		var artisthtml = "<div class='text'>";
		if(exhibitionData.datestart) {
			artisthtml = artisthtml + "Vanaf: "+exhibitionData.datestart;	
		}
		if(exhibitionData.artist) {
			artisthtml = artisthtml + "<br><strong>"+exhibitionData.artist+"</strong>";	
		}
		if(exhibitionData.artisturl) {
				artisthtml = artisthtml + "<br>site: <a href='"+exhibitionData.artisturl+"'>"+exhibitionData.artisturl+"</a>";
		}
		artisthtml = artisthtml+"</div>";
		$("#exhibition").append(artisthtml);
		// description
		if(exhibitionData.description) {
			$("#exhibition").append("<div class='text'>"+exhibitionData.description+"<div>");	
		}
		//links
		if(exhibitionData.links) {
			var linksHtml = "<div class='text'>";
			for(var i in exhibitionData.links) {
				if(exhibitionData.links[i].description)	{
					linksHtml = linksHtml+"<a href="+exhibitionData.links[i].link+">"+exhibitionData.links[i].description+"</a><br>";
				}else{
					linksHtml = linksHtml+"<a href="+exhibitionData.links[i].link+">"+exhibitionData.links[i].link+"</a><br>";	
				}
			}
			linksHtml = linksHtml+"</div>";
			$("#exhibition").append(linksHtml);
		}
		// create image slider if there are more then one images
		if(exhibitionData.images.length>0) {
			var images = [];
			for(var i in exhibitionData.images) {
				images.push({src:exhibitionData.images[i]});
			}
			if(images.length>1) {
				Aanschouw.jQT.generateGallery("gallery", images, {appendTo:$("#exhibition")});
			}else{
				$("#"+exhibitionData.id).append('<img src="'+exhibitionData.images[0]+'">');
			}
		}
	},
	
	/**
	 * Return to startup screen on window unload so the user sees it 
	 * when re-launching web app from iPhone home screen
	 */
	addExitRoutine : function() {
		window.onunload = function() {
			Aanschouw.jQT.goTo('#startup');
		}
	}
};

Aanschouw.init();