//alert(screen.width);
//public variables

var storyIndexPointer = 10;

function actOnUrl(){
	
	//alert("ratio:" + (screen.width / screen.height) + "default: " + (1024/768));
	//alert("browser: " + BrowserDetect.browser + " version " + BrowserDetect.version);
	redoLayoutForBrowser();
	var contentId = document.URL.toQueryParams().contentId;
	
	//Number of stories in the 'database'
	var storyCount = contentData.length;
	
	//Validate to
	/*
	if(contentId != null && contentId != "undefined" && contentId < storyCount){
		publishContent(contentId);
	} else {
		publishContent(0);
	}
	*/
	
	
	if(contentId != null && contentId != "undefined"){
		
		if (contentId == "erotischeverhalen"){
			writeStoryIndex();
		} else if (contentId < storyCount){
			publishContent(contentId);	
		} else {
			publishContent(0);
		}
		
		publishContent(contentId);
	} else {
		publishContent(0);
	}
	
}

function redoLayoutForBrowser(){

	if(BrowserDetect.browser == "Explorer" && BrowserDetect.version == "5.5"){
		
		//alert("Wrong!");
		$("guidingFrame").style.top = '165px';
		$("storyFrameHeader").style.width = '32.1%';
	}
}

function getStory(storyId){

	//alert(storyId + " - " + storyContent[storyId].fileName);
	
	var storyPath = storyDirectory + storyContent[storyId].fileName;
	document.StoryTitle.innerHTML = storyContent[storyId].storyTitle;
	document.StoryDate.innerHTML = dateToString(storyContent[storyId].storyDate);
	document.author.innerHTML = storyContent[storyId].author
	publishImage(contentData[storyid].imageId);
	placeContentByAjax("storyContainer", storyPath);

}

function publishContent(contentId){

 	$("main_wrapper").style.visibility = "visible";
 	$("main_wrapper_images").style.visibility = "hidden"; 	
	$("permaLinkClick").style.visibility = "visible";

	var storyPath = storyDirectory + contentData[contentId].fileName;
	//alert(">" +storyPath + "< - " + contentId );
	document.getElementById("storyTitle").innerHTML = contentData[contentId].storyTitle;
	document.getElementById("storyDate").innerHTML = dateToString(contentData[contentId].storyDate);
	document.getElementById("author").innerHTML = contentData[contentId].author;
	document.getElementById("bookMark").innerHTML = "<a href='javascript:createBookmarkLink(" + contentId + ")' >Bookmark " + contentData[contentId].storyTitle + "</a>";
	$("linkTitle").innerHTML = contentData[contentId].storyTitle;   	
	$("linkUrl").innerHTML = "http://www.zwoeledromen.nl/index.html?rev=0&contentId=" + contentId
	publishImage(contentData[contentId].imageId);
	placeContentByAjax("storyContainer", storyPath);

}

function dateToString(aDate){	

	return aDate.getDate() + "-" + aDate.getMonth() + "-" +  aDate.getFullYear() 


}
/*
	left:17%;
	top: 140px;
	width: 26.5%;
	height: 75%;
*/
function publishImage(imageId){

	document["guidingImage"].src= imageDirectory + imageStore[imageId].imageFileName;
	var hv = imageStore[imageId].direction;
	//var imgStyle = $('guidingFrame');
	//alert(hv + " - " + imageStore[imageId].imageFileName);
	
	if (hv == "S" ){
		$('guidingFrame').style.width='26.5%';
		$('guidingFrame').style.height='75%';
		$('guidingFrame').style.left='17%';	
	} else {
		$('guidingFrame').style.width='33.8%';
		$('guidingFrame').style.height='65%';
		$('guidingFrame').style.left='10%';	
	}
	
	
	//alert(document["guidingImage"].width - document["guidingImage"].height);
	
}



function writeStoryIndex(){

 	document.getElementById("main_wrapper").style.visibility = "visible";
 	document.getElementById("main_wrapper_images").style.visibility = "hidden";

	var indexContent = "<table border='0'cellpadding='3' cellspacing='0' >";
	indexContent += "<tr class=\"headerRow\"><th>Naam</th><th>auteur</th><th>Datum gepubliceerd</th><th>aant. woorden</th><th>Serie </td><th>Genre</th></tr>";
	//contentDataStories = contentData.slice(10);
	//contentDataStories.reverse();
	for (var i = contentData.length - 1; i > 9;  i--){
	//alert(i + " " + contentData[i].storyTitle);
	//alert(i);
		//alert(i % 2)
		if (contentData[i].catagory != "gedichten"){	
			if(i % 2 == 0)className = "evenRow";
			else className = "oddRow";
			//" + className + "' \" onclick=\"publishContent(" + i + ")\
			indexContent += "<tr class='" + className + "' onmouseover=\"this.className='highlightRow'\"" 
						 + "\" onmouseout=\"this.className='" + className + "'\" onclick=\"publishContent(" + i + ")\" >"
						 + "<td>" + contentData[i].storyTitle + "</td><td>"
						 + contentData[i].author + "</td><td>"
						 + dateToString(contentData[i].storyDate) + "</td><td>" 
						 + contentData[i].storyWordCount + "</td><td>"
						 + contentData[i].serie + "</td><td>"
						 + contentData[i].catagory + "</td></tr>"
		//alert(indexContent)				 
		}
	}
	indexContent += "</table>";
	//alert(indexContent);
	document.getElementById("storyContainer").innerHTML =  indexContent;
	document["guidingImage"].src= imageDirectory + imageStore[3].imageFileName;
	document.getElementById("storyTitle").innerHTML = "overzicht verhalen";
	document.getElementById("storyDate").innerHTML = "";
	document.getElementById("bookMark").innerHTML  = "";
	$("permaLinkClick").style.visibility = "hidden";
	$("linkTitle").innerHTML = "";   	
	$("linkUrl").innerHTML = "h";

}

function writePoemIndex(){

 	document.getElementById("main_wrapper").style.visibility = "visible";
 	document.getElementById("main_wrapper_images").style.visibility = "hidden";

	var indexContent = "<table border='0'cellpadding='0' cellspacing='0' >";
	indexContent += "<tr class=\"headerRow\"><th>Naam</th><th>Datum gepubliceerd</th></tr>";
	
	for (var i = 10, y = 0; i <contentData.length; i++){
	//alert(i + " " + contentData[i].storyTitle);
		if (contentData[i].catagory != "gedichten"){}
		else {
			//alert(i % 2)
			
			if(i % 2 == 0)className = "evenRow";
			else className = "oddRow";
			//" + className + "' \" onclick=\"publishContent(" + i + ")\
			indexContent += "<tr class='" + className + "' onmouseover=\"this.className='highlightRow'\"" 
						 + "\" onmouseout=\"this.className='" + className + "'\" onclick=\"publishContent(" + i + ")\" >"
						 + "<td>" + contentData[i].storyTitle + "</td><td>"
						 + dateToString(contentData[i].storyDate) + "</td><td>"
		//alert(indexContent)
		}				 
	}
	indexContent += "</table>";
	//alert(indexContent);
	$("storyContainer").innerHTML =  indexContent;
	document["guidingImage"].src= imageDirectory + imageStore[3].imageFileName;
	$("permaLink").style.visibility = "hidden";
	$("storyTitle").innerHTML = "overzicht verhalen";
	$("linkTitle").innerHTML = "";   	
	$("linkUrl").innerHTML = "h";	

}

function placeContentByAjax(elementid, contentUrl){

	var returned = new Ajax.Updater({success: elementid} , contentUrl, { method: 'get', onFailure: reportError });
	//alert(returned);
}

function reportError(request) { alert('Sorry. Er was een fout.'); }

 function createBookmarkLink(contentId) {

	 title = "ZD " +  contentData[contentId].storyTitle

	
	 url = "http://www.zwoeledromen.nl/index.html?rev=0&contentId=" + contentId;

	
		if ( window.external) { // Mozilla Firefox Bookmark			
			window.external.AddFavorite( url, title); 
		} else if( window.sidebar ) { // IE Favorite
			window.sidebar.addPanel(title, url,"");
		} else if(window.opera && window.print) { // Opera Hotlist
			return true; }
 }
 
 function showImages(){
 
 	$("permaLinkClick").style.visibility="hidden";
 	
 	var imageContent = "<h3>Overzicht beeldmateriaal</h3>";
 	imageContent += "<p width='300px'>Dit is een overzicht van al het beeldmateriaal dat in deze site word gebruikt, met links naar de maker(s)</p>";
 	imageContent += "<p width='300px'>Vind U dat ik onrechtmatig van een foto gebruik maak, of heeft U een mooie foto voor een verhaal<br/>"
 	imageContent += "mail dan: <a href='mailto:zwoeltje@zwoeledromen.nl'>zwoeltje</a></P>";
 	imageContent += "<p><b> This page shows properly in Firefox, not in IE, I am working on a solution</b></p>";
 	
 	imageContent += "<table cellpadding='0' cellspacing='0'>";
 	//alert("number of images: " + imageStore.length );
 	var y = 1;
 	for(var i = 0; i < imageStore.length; i++){
 		
 		var modulus = i % 2;
 		if (modulus == 0){
 			imageContent +="<tr>";
 			y = 1;
 			//alert("adding row " + i);
 		}
 		
 		imageContent += addImageCells(imageStore[i].imageFileName, imageStore[i].imageAlt, imageStore[i].imageSource);
 		if (i == (imageStore.length - 1)){
 			for(var x = 0; x < 2 -y; x++){
 				//alert("empty cells for fil: " + x);
 				imageContent += addEmptyCells();
 			}
 		}
 		
 		if (y == 2 ){
 			imageContent +="</tr>";
 			//alert("closing row " + y);
 		}
 		y++;
 		//alert("y: " + y) 
 	
 	}
 	imageContent += "</table>";
 	
 	document.getElementById("main_wrapper").style.visibility = "hidden";
 	document.getElementById("main_wrapper_images").innerHTML = imageContent;
 	document.getElementById("main_wrapper_images").style.visibility = "visible";
 
 }
 
 function addImageCells(imageFileName, imageAlt, imageSource){

  		cellContent = "<td width='100px'><img src='" + imageDirectory + imageFileName + "' border='0' width='70px' /></td>"
 		cellContent += "<td width='300px' valign='top'>imageTitle: " + imageAlt + "<br/>";
 		cellContent += "Url of artist: " + imageSource + "<br/>";
 		cellContent += "</td>";
 		
 		return cellContent;	
 
 }
 
 function addEmptyCells(){

  		cellContent = "<td width='100px'>&nbsp;</td>"
 		cellContent += "<td width='160px'>&nbsp;</td>"; 		
 		return cellContent;
 
 }
 
 function showLinkDiv(){ 
 	$("permaLink").style.visibility = "visible";
 
 }
 
 function hideLinkDiv(){
 	$("permaLink").style.visibility = "hidden"; 
 
 }

 function validateAndSendFeedback(){
 
 	var sendOK = true;
 	
 	$("lbl_onderwerp").style.color = "#330000";
 	$("lbl_onderwerp").innerHTML = "Onderwerp";
 	$("lbl_reaktie").style.color = "#330000";
 		$("lbl_reaktie").innerHTML = "reaktiee"; 
 	
 	$('formSendResult').style.visibility = "hidden";
 
 	if ($F("onderwerp") == null || $F("onderwerp") == ""){
 		$("lbl_onderwerp").style.color = "red";
 		$("lbl_onderwerp").innerHTML = "Onderwerp - vul een onderwerp in";
 		sendOK = false; 	
 	}
 	
 	if ($F("reaktie") == null || $F("reaktie") == ""){
 		$("lbl_reaktie").style.color = "red";
 		$("lbl_reaktie").innerHTML = "reaktie - geef een reaktie"; 
 		sendOK = false;	
 	}
 	
 	if(sendOK) {
 		$('feedbackForm').request();
 		$('formSendResult').innerHTML = "<p>Uw reactie is verzonden</p>";
 		$('formSendResult').style.visibility = "visible";
 		$('feedbackForm').reset()
  		
 	}
 /*
 {
    		onSuccess: function(transport){
      		var response = transport.responseText || "no response text";
      		alert("Success! \n\n" + response);
    		},
    		onFailure: function(){ alert('Something went wrong...') } ,
    		onComplete: function(){ alert('Send!') }
  		}
 */
 
 }
 
  function validateAndSendGuestbool(){
 
 	var sendOK = true;
 	

 	$("lbl_reaktie").style.color = "#330000";
 	$("lbl_reaktie").innerHTML = "reaktie"; 
 	
 	$('formSendResult').style.visibility = "hidden";

 	
 	if ($F("reaktie") == null || $F("reaktie") == ""){
 		$("lbl_reaktie").style.color = "red";
 		$("lbl_reaktie").innerHTML = "reaktie - geef een reaktie"; 
 		sendOK = false;	
 	}
 	
 	if(sendOK) {
 		$('feedbackForm').request();
 		$('formSendResult').innerHTML = "<p>Uw reactie is verzonden</p>";
 		$('formSendResult').style.visibility = "visible";
 		$('feedbackForm').reset()
  		
 	}

 }
 
 function userInteraction(clickedElement){
 
 	var elementText = clickedElement.innerHtml;
 	switch(elementText){
 		case '&lt;&lt;':
 			publishContent(0);
 			break;
 			
 		case '&lt;':
 			publishContent(loopThroughStoryIndex("down"));
 			break;
 			
 		case 'cijfer':
 			//show cijferdiv
 			break;
 			
 		case 'reageer':
 			//show comment storydiv
 			break; 			
 	
 	
 	}
 
 
 }
 
 function loopThroughStoryIndex(direction){
 
  	switch(elementText){
 		case 'up':
 			if (++storyIndexCounter > contentData.length - 1 ){
 				storyIndexCounter = 0;
 			} 			
 			break;
 			
 		case 'down':
 		 	if (--storyIndexCounter < 0 ){
 				storyIndexCounter = contentData.length - 1;
 			}
 			break;
 	
 	}
 	return storyIndexCounter;
 }
 
 function getGuestBookEntries(){
	 placeContentByAjax("storyContainer", "/back/guestbook.php");
 
 
 }