﻿/* what page are we on? */
var temp = window.location;
$(document).ready(function() {
	if(	temp == "http://marcstutzel.com/index.php" || temp == "http://www.marcstutzel.com/index.php" ||
		temp == "http://marcstutzel.com/" || temp == "http://www.marcstutzel.com/") {
		$("#header a").not("a[id]").addClass("headLink");
		$("#header li > a:contains(websites)").addClass("whiteLight");
		$("#header li > a:contains(websites)").attr("id","pageOn");
	}else if(temp == "http://marcstutzel.com/photography.php" || temp == "http://www.marcstutzel.com/photography.php" ) {
		$("#header a").not("a[id]").addClass("headLink");
		$("#header li > a:contains(photography)").addClass("whiteLight");
		$("#header li > a:contains(photography)").attr("id","pageOn")
	}else if(temp == "http://marcstutzel.com/resume.php" || temp == "http://www.marcstutzel.com/resume.php" ) {
		$("#header a").not("a[id]").addClass("headLink");
		$("#header li > a:contains(resume)").addClass("whiteLight");
		$("#header li > a:contains(resume)").attr("id","pageOn")
	}else if(temp == "http://marcstutzel.com/contact.php" || temp == "http://www.marcstutzel.com/contact.php" ) {
		$("#header a").not("a[id]").addClass("headLink");
		$("#header li > a:contains(contact)").addClass("whiteLight");
		$("#header li > a:contains(contact)").attr("id","pageOn")
	}else if(temp == "http://marcstutzel.com/church.php" || temp == "http://www.marcstutzel.com/church.php" ) {
		$("#header a").not("a[id]").addClass("headLink");
		$("#header li > a:contains(church)").addClass("whiteLight");
		$("#header li > a:contains(church)").attr("id","pageOn")
	}
});

$(document).ready(function() {
	$("#header a").not("a[id]").hover(function() {
			$(this).addClass("whiteLight");
	},function(){
		$(this).removeClass("whiteLight");
		if(	temp == "http://marcstutzel.com/index.php" || temp == "http://www.marcstutzel.com/index.php" ||
			temp == "http://marcstutzel.com/" || temp == "http://www.marcstutzel.com/") {
			$("#header a").not("a[id]").addClass("headLink");
			$("#header li > a:contains(website)").addClass("whiteLight");
		}else if(temp == "http://marcstutzel.com/photography.php" || temp == "http://www.marcstutzel.com/photography.php" ) {
			$("#header a").not("a[id]").addClass("headLink");
			$("#header li > a:contains(photography)").addClass("whiteLight");
		}else if(temp == "http://marcstutzel.com/resume.php" || temp == "http://www.marcstutzel.com/resume.php" ) {
			$("#header a").not("a[id]").addClass("headLink");
			$("#header li > a:contains(resume)").addClass("whiteLight");
		}else if(temp == "http://marcstutzel.com/contact.php" || temp == "http://www.marcstutzel.com/contact.php" ) {
			$("#header a").not("a[id]").addClass("headLink");
			$("#header li > a:contains(contact)").addClass("whiteLight");
		}else if(temp == "http://marcstutzel.com/church.php" || temp == "http://www.marcstutzel.com/church.php" ) {
			$("#header a").not("a[id]").addClass("headLink");
			$("#header li > a:contains(church)").addClass("whiteLight");
		}
	});
});

/* handle initial site list click */
/* websites */
$(document).ready(function() {
	$("#siteList a").click(function(event){
		event.preventDefault();
		linkClick = $(this).attr('href');
		$("#mainMenu").hide("");
		$("#siteList").hide("");
		var content = $("#contentVisible").html("<div id='grayTop'>"+$(".website > h3:contains("+linkClick+")").parent().html()+"</div>");
		$("#contentVisible").show("slow",function() {
			$("#sites").show("slow")
			updateWebsite(linkClick);	
		});
	});
			
		$("#siteList a").hover(function(event){
		$(this).parent().css("background-color","#B0E0E6");
		$(this).css("color","#ffffff");
	},function(){
		$(this).parent().css("background-color","#ffffff");
		$(this).css("color","#3cc5e8");
	});
	
	
});

function updateWebsite(linkClick3) {
	//setup link
	link = $("#contentVisible .link").html();
	$("#contentVisible .link").html("<a href='"+link+"' target='_blank'>visit site &#187;</a>");
	
	//setup images
	$("#contentVisible .image").insertBefore("#contentVisible h3");
	
	obj = $("#contentVisible .imageLinks > li:first").children("a");
	
	overallLink = obj.attr("href");
	firstlink = new Array();
	firsttitle = "";
	if(overallLink) {
		if(overallLink.split(".com/").length > 1) {
			firstlink = overallLink.split(".com/");
			firsttitle = obj.attr("title");
		}else{
			firstlink[1] = overallLink;
			firsttitle = obj.attr("title");
		}	
	}
	
	$("#contentVisible .image > li:first").html("Click to view a larger image <br /><a href='lightbox'><img src='screenshots/"+firstlink[1]+"MED.jpg' title='"+firsttitle+"'></a>");
	
	var imagePath = new Array();
	var index = 0;
	
	$("#contentVisible .imageLinks li").each(function(index) {
		if(overallLink==$(this).children("a").attr("href")) {
			$(this).children("a").addClass("selected");
		}else{
			$(this).children("a").addClass("notselected");
		}
	});
	
	//handle code samples (if there are any)
	$("#contentVisible .codesample").prepend("code samples &#187; ");
	
	
	$("#sites li a:contains("+linkClick3+")").parent().css("background-color","#ffffff");
	$("#sites li a").not("#sites li a:contains("+linkClick3+")").parent().css("background-color","#ece5f7");
	$("html,body").animate({ scrollTop:0}, 1100, function() {});
}

/* handle imageLinks clicks - update website image */
$(document).ready(function() {
	
	$("#contentVisible").click(function(event){
		//i have no idea why i can't call imageLinks specifically
		//what, in the dom, did i break? ah well.
		event.preventDefault();
		target = event.target.href;
		target2 = event.target.src;
		
		//why, oh why, does firefox and IE handle these things differently?!!
		if(target==target2 && (target || target2)) {
			//I guess we're in IE or something
			tSplit = target.split("/screenshots/");
			tSplit2 = target.split("/code/");
			if(tSplit.length==2 || tSplit2.length==2) {
				//lightboxing images or code
				target = false;
			}
		}
		
		if(target) {
			tSplit = target.split("code/");
			if(tSplit.length==2) {
				//sample code;lightbox it
				source = "code/"+tSplit[1]+".gif";
				caption = event.target.title;
				lightBox(source,caption);
			}else{
				//check for lightbox
				//okay - switching images around
				tSplit2 = target.split("marcstutzel");
				if(tSplit2.length>1) {
					tSplit = target.split(".com/");
					//update image
					
					$("#contentVisible .imageLinks li").each(function(index) {
						if(tSplit[1]==$(this).children("a").attr("href")) {
							$(this).children("a").removeClass("notselected");
							$(this).children("a").addClass("selected");
							title = $(this).children("a").attr("title");
						}else{
							$(this).children("a").removeClass("selected");
							$(this).children("a").addClass("notselected");
						}
					});
					
					$("#contentVisible .image > li:first").html("Click to view a larger image <br /><a href='lightbox'><img src='screenshots/"+tSplit[1]+"MED.jpg' title='"+title+"'></a>");
				}else{
					popUp(target);
				}				
			}	
		}else if(target2) {
			//lightboxing image
			//remove med from target2
			temp = target2.split("MED.jpg");
			temp2 = temp[0].split(".com");
			source = temp2[1]+".jpg";
			
			//find caption
			caption = event.target.title;
			lightBox(source,caption);		
		}
	});

});

function popUp(target) {
	window.open(target, '', 'width=825, height=800, resizable=yes, scrollbars=yes');
}

/* handle left side click */
$(document).ready(function() {
	var linkClick2;
	var change = 0;
			
	$("#sites a").click(function(event){
		event.preventDefault();
		linkClick2 = $(this).attr('href');
		
		newHTML = $(".website > h3:contains("+linkClick2+")").parent().html();
		newHTML2 = $("#grayTop > #contentVisible").html();
		if(newHTML2) {
			if(newHTML2.length>0) {
				$("#contentVisible").html(newHTML);
			}else {
				$("#contentVisible").html("<div id='grayTop'>"+newHTML+"</div>");
			}
		}else{
			$("#contentVisible").html("<div id='grayTop'>"+newHTML+"</div>");
		}
	
		updateWebsite(linkClick2);
		
		change = 0;
	});
			
	$("#sites a").hover(function(){
		listen = $(this).parent().css("background-color");
		if(listen=="rgb(255, 255, 255)" || listen=="#ffffff") {
			change = 0;
		}else{
			$(this).parent().css("background-color","#ffffff");
			change = 1;
		}
	},function(){
		if(change==1) {
			$(this).parent().css("background-color","#ece5f7");
		}
	});
});


function lightBox(source,caption) {
	$('body').append('<div id="overlay"></div><div id="lightbox"><div id="lightbox-container"><div id="loading"><img src="ajax-loader.gif"></div><div id="lightbox-image"></div></div></div>');
	windowAttr = getPageSize();
				
	$('#overlay').css("backgroundColor",'#000');
	$('#overlay').css("opacity","0.8");
	$('body').css("overflow-x","hidden");
	$('#overlay').css("width",windowAttr[0]+20);
	$('#overlay').css("height",windowAttr[1]+10);
	$('#overlay').css("top","0");
	$('#overlay').css("left","0");
	$('#overlay').fadeIn("slow");
	
	//location of box
	var scroll= getPageScroll();
	
	$('#lightbox').css("top",scroll[1] + (windowAttr[3] / 10));
	$('#lightbox').css("bottom",scroll[0]);
	$('#lightbox').show();
	
	//set what the lightbox image is going to be
	var im = new Image();
	im.onload = function() {
		$('#lightbox-caption').css("visibility","hidden");
		//$("#lightbox-image").html('<div id="#dataBox"><span id="lightbox-caption"></span><div id="navigation"><a href="prev" id="prev">&#171;prev</a> <a id="next" href="next">next&#187;</a>&nbsp;&nbsp;<a href="#" id="lightbox-close">[x]</a></div></div><img src="'+source+'" id="LBimage">');
		$("#lightbox-image").html('<div id="#dataBox"><span id="lightbox-caption"></span><div id="navigation"><a href="prev" id="prev"><img src="prev.jpg" id="prevImage" border="0"></a> <a id="next" href="next"><img src="next.jpg" id="nextImage" border="0"></a>&nbsp;&nbsp;<a href="#" id="lightbox-close"><img src="close.jpg" id="closeImage" border="0"></a></div></div><img src="'+source+'" id="LBimage">');
		$('#lightbox-close').css("visibility","hidden");
		
		//do we need a prev or a next link?
		var prevArray = new Array();
		var nextArray = new Array();
		if(source.indexOf("screenshots/")!=-1) {
			temp = source.split("screenshots/");
			prevArray = findPrevImage("imageLinks",temp[1]);
			nextArray = findNextImage("imageLinks",temp[1]);
		}
		if(source.indexOf("code/")!=-1) {
			temp = source.split("code/");
			prevArray = findPrevImage("code",temp[1]);
			nextArray = findNextImage("code",temp[1]);
		}
		
		var prev = 0;
		var next = 0;
		if(prevArray[0]){
			prev = 1;
		}
		if(nextArray[0]) {
			next = 1;
		}
			
		$('#lightbox-caption').html(caption);
		
		width = im.width;
		height = im.height;
		
		//resize box 
		var cw = $('#lightbox-container').width();
		var ch = $('#lightbox-container').height();
	
		var newWidth = width+30;
		var newHeight = height+100;
	
		$('#lightbox-container').animate({ width: newWidth, height: newHeight },1100,function() { ;
			$('#lightbox-image').fadeIn("slow", function() {
				$('#dataBox').css("width",newWidth);
				$('#loading').css("visibility","hidden");
				if(prev==1) {
					$('#prev').css("visibility","visible");
					$('#prev').css("display","inline");
				}else{
					$('#prev').css("display","none");
				}
				if(next==1) {
					$('#next').css("visibility","visible");
					$('#next').css("display","inline");				
				}else{
					$('#next').css("display","none");
				}
				$('#lightbox-close').css("visibility","visible");
				$('#lightbox-caption').css("visibility","visible");
				$('#LBimage').css("margin-top","10px");
				$('#LBimage').css("visibility","visible");
				if(newHeight > windowAttr[1]+10) {
					$('#overlay').css("height",newHeight+150);
				}
			});
		});	
	};
	
	im.src = source;
	
	$('#lightbox').click(function(event) {
		event.preventDefault();
		//target = event.target.href;
		target = event.target.src;
		var nextTarget = new Array();
		
		
		if(target) {
			if(target.indexOf("#")==-1) {
				//option = target.split(".com/");
				optionT = target.split(".com/");
				optionA = optionT[1].split("\.");
				option = optionA[0];
				imageSrc = $('#LBimage').attr("src");
				//screenshots or sample code?
				if(option!="close" && option!="prev" && option!="next") {
				
				}else if(option=="close") {
				
				}else if(imageSrc.indexOf("screenshots")!=-1) {
					//screenshots!
					temp = imageSrc.split("screenshots/");
					if(option=="prev") {
						prevArray = findPrevImage("imageLinks",temp[1]);
						if(prevArray) {
							//we have a match!
							nextTarget = prevArray;
						}
					}else if(option=="next") {
						nextArray = findNextImage("imageLinks",temp[1]);
						if(nextArray) {
							//we have a match!
							nextTarget = nextArray;
						}
					}
					nextTarget[0] = "screenshots/"+nextTarget[0]+".jpg";
					
				}else if(imageSrc.indexOf("code")!=-1) {
					//sample code!
					temp = imageSrc.split("code/");
					if(option=="prev") {
						prevArray = findPrevImage("code",temp[1]);
						if(prevArray) {
							//we have a match!
							nextTarget = prevArray;
						}
					}else if(option=="next") {
						nextArray = findNextImage("code",temp[1]);
						if(nextArray) {
							//we have a match!
							nextTarget = nextArray;
						}
					}
					nextTarget[0] = ""+nextTarget[0]+".gif";
				}
				if(nextTarget[0]) {
					//load new image
					
					$('#lightbox-image').fadeOut("slow", function() {
						$('#loading').css("visibility","visible");
						$('#lightbox-close').css("visibility","hidden");
						$('#lightbox-caption').css("visibility","hidden");
						$('#prev').hide();
						$('#next').hide();
						
						$('#lightbox-caption').html(nextTarget[1]);
						
						//do we need a prev or a next link?
						var prevArray = new Array();
						var nextArray = new Array();
						
						if(nextTarget[0].indexOf("screenshots/")!=-1) {
							temp = nextTarget[0].split("screenshots/");
							prevArray = findPrevImage("imageLinks",temp[1]);
							nextArray = findNextImage("imageLinks",temp[1]);
						}
						if(nextTarget[0].indexOf("code/")!=-1) {
							temp = nextTarget[0].split("code/");
							prevArray = findPrevImage("code",temp[1]);
							nextArray = findNextImage("code",temp[1]);
						}
						
						var prev = 0;
						var next = 0;
						
						if(prevArray[0]){
							prev = 1;
						}
						if(nextArray[0]) {
							next = 1;
						}
						
						var newImage = new Image();
						newImage.onload = function() {
							$("#LBimage").attr("src",nextTarget[0]);
							width = newImage.width;
							height = newImage.height;
							
							//resize box 
							var cw = $('#lightbox-container').width();
							var ch = $('#lightbox-container').height();
						
							var newWidth = width+30;
							var newHeight = height+100;
						
							$('#lightbox-container').animate({ width: newWidth, height: newHeight },1100,function() { ;
								$('#lightbox-image').fadeIn("slow", function() {
									$('#loading').css("visibility","hidden");
									if(prev==1) {
										$('#prev').css("visibility","visible");
										$('#prev').css("display","inline");
									}else{
										$('#prev').css("display","none");
									}
									if(next==1) {
										$('#next').css("visibility","visible");
										$('#next').css("display","inline");				
									}else{
										$('#next').css("display","none");
									}
									$('#lightbox-close').css("visibility","visible");
									$('#lightbox-caption').css("visibility","visible");
									if(newHeight > windowAttr[1]+10) {
										$('#overlay').css("height",newHeight+150);
									}
								});
							});
						}
						newImage.src = nextTarget[0];
					});
				}else{
					$('#lightbox').remove();
					$('#overlay').fadeOut(function() { 
						$('#overlay').remove(); 
					});			
				}
			}else{
				$('#lightbox').remove();
				$('#overlay').fadeOut(function() { 
					$('#overlay').remove(); 
				});			
			}
		}else{
			$('#lightbox').remove();
			$('#overlay').fadeOut(function() { 
				$('#overlay').remove(); 
			});
		}	
	});
	
	$('#overlay').click(function(event) {
		event.preventDefault();
		$('#lightbox').remove();
		$('#overlay').fadeOut(function() { 
			$('#overlay').remove(); 
		});
	});
	
}

function findPrevImage(id,match) {
	var prev = new Array();
	var weFoundIt = 0;
	//remove the ext
	newM = match.substring(0,match.lastIndexOf("."));
	if(id=='code') {
		newM = "code/"+newM;	
	}
	
	$("#contentVisible ."+id+" li").each(function(index) {
		testLink = reduceLink($(this).children("a").attr("href"));
		if(weFoundIt==0) {
			if(newM==testLink) {
				weFoundIt = 1;
			}else{
				prev[0] = testLink;
				prev[1] = $(this).children("a").attr("title");
			}
		}
	});
	
	return prev;
}

function reduceLink(link) {
	//internet explorer has this habbit of returning the href as a completed link rather than what we actually
	//have in the code. This stops that from happening
	newLink = "";
	newindex = link.indexOf(".com");
	if(newindex>-1) {
		//boo! 
		newLink = link.substring((newindex+5),link.length);
	}else{
		newLink = link;	
	}
	return newLink;
}

function findNextImage(id,match) {
	var next = new Array();
	var weFoundIt = 0;
	//remove the ext
	newM = match.substring(0,match.lastIndexOf("."));
	if(id=='code') {
		newM = "code/"+newM;	
	}
	$("#contentVisible ."+id+" li").each(function(index) {
		testLink = reduceLink($(this).children("a").attr("href"));
		if(weFoundIt==0) {
			if(newM==testLink) {
				weFoundIt = 1;
			}
		}else if(weFoundIt==1) {
			next[0] = testLink;
			next[1] = $(this).children("a").attr("title");
			weFoundIt=2;	
		}
	});
	
	return next;
}

/* FUNCTIONS FROM OTHER SITES */

/* getPageSize() by quirksmode.com
 * returns an array with page width, height, window width, window height
 */
function getPageSize() {
	var xScroll, yScroll;
	if (window.innerHeight && window.scrollMaxY) {	
		xScroll = window.innerWidth + window.scrollMaxX;
		yScroll = window.innerHeight + window.scrollMaxY;
	} else if (document.body.scrollHeight > document.body.offsetHeight){
		xScroll = document.body.scrollWidth;
		yScroll = document.body.scrollHeight;
	} else { // Explorer Mac
		xScroll = document.body.offsetWidth;
		yScroll = document.body.offsetHeight;
	}
	var windowWidth, windowHeight;
	if (self.innerHeight) {	// all except Explorer
		if(document.documentElement.clientWidth){
			windowWidth = document.documentElement.clientWidth; 
		} else {
			windowWidth = self.innerWidth;
		}
		windowHeight = self.innerHeight;
	} else if (document.documentElement && document.documentElement.clientHeight) { // Explorer 6 Strict Mode
		windowWidth = document.documentElement.clientWidth;
		windowHeight = document.documentElement.clientHeight;
	} else if (document.body) { // other Explorers
		windowWidth = document.body.clientWidth;
		windowHeight = document.body.clientHeight;
	}	
	// for small pages with total height less then height of the viewport
	if(yScroll < windowHeight){
		pageHeight = windowHeight;
	} else { 
		pageHeight = yScroll;
	}
	// for small pages with total width less then width of the viewport
	if(xScroll < windowWidth){	
		pageWidth = xScroll;		
	} else {
		pageWidth = windowWidth;
	}
	arrayPageSize = new Array(pageWidth,pageHeight,windowWidth,windowHeight);
	return arrayPageSize;
};

/* getPageScroll() by quirksmode.com
 * Returns an array with x,y page scroll values.
*/
function getPageScroll() {
	var xScroll, yScroll;
	if (self.pageYOffset) {
		yScroll = self.pageYOffset;
		xScroll = self.pageXOffset;
	} else if (document.documentElement && document.documentElement.scrollTop) {	 // Explorer 6 Strict
		yScroll = document.documentElement.scrollTop;
		xScroll = document.documentElement.scrollLeft;
	} else if (document.body) {// all other Explorers
		yScroll = document.body.scrollTop;
		xScroll = document.body.scrollLeft;	
	}
	arrayPageScroll = new Array(xScroll,yScroll);
	return arrayPageScroll;
};
