pageurl = "http://kylehale.net";

// TODO
// • Animate Home
// • Make transition wait for load

$.fn.delayish = function(time, callback){
    // Empty function:
    jQuery.fx.step.delay = function(){};
    // Return meaningless animation, (will be added to queue)
    return this.animate({delay:1}, time, callback);
}

$(function() {
	
	kh.init();
	
	// Contact Form Stuff
	$("#submit").live('click', function() {
		$(".error").hide();
		var hasError = false;
		var emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;
		
		var emailVal = $("#field-email").val();
		if(emailVal == '') {
			$("#field-email").after('<span class="error">You forgot to enter your email address.</span>');
			hasError = true;
		} else if(!emailReg.test(emailVal)) {
			$("#field-email").after('<span class="error">Please enter a valid email address to send.</span>');
			hasError = true;
		}
		
		var subjectVal = $("#field-name").val();
		if(subjectVal == '') {
			$("#field-name").after('<span class="error">Please enter your name.</span>');
			hasError = true;
		}
		
		var messageVal = 'Name: ' + $("#field-name").val() + " \n" + 'Date: ' + $("#field-date").val() + " \n" + 'Heard: ' + $("#field-hear").val() + " \n" + $("#field-message").val();
		
		if(hasError == false) {
			
			$.post(pageurl + "/sendemail.php",
   				{ emailTo: 'kyle.hale@gmail.com', emailFrom: emailVal, subject: 'kylehale.net', message: messageVal },
   					function(data){
						$("label").animate({opacity: 0}, 1000);
						$("textarea").animate({opacity: 0}, 1000);
						$(".textfield").animate({opacity: 0}, 1000, function() {
							$("#submit").css('background-position', '0 -15px')
						});
   					}
				 );
		}	
		return false;
	});
});


var kh = {
	initCalled: false,
	starting: "",
	currPage: "home",
	nextPage: "",
	currSubPage: "",
	nextSubPage: "",
	activeNav: '',
	activeSubnav: '',
	currImage: 1,
	nextImage: 2,
	deeplinked: false,
	goHome: false,
	goPortfolio: false,
	heightper: 24,
	startheight: -9,
	stackArray: new Array(),
	inArray: new Array(),
	outArray: new Array(),
	alertTest: function() {
		alert('test');
	},
	init: function() { // initialize
		
		// Event handlers
	    $.address.init(function(event) {
			if (typeof(event.pathNames[0]) != "undefined") {
				// someone was deeplinked here
				kh.goDeep();
				kh.deeplinked = false;
			} else {
				// not deep linked here so proceed as usual
			}
	    }).change(function(event) {
			if (event.value == '/') {
				// do nothing
			} else {
				// open object, but the click() function is taking care of this.
			}
	    }).internalChange(function(event) {
	        // alert('internalChange: ' + event.value);
			kh.checkForInit();
	    }).externalChange(function(event) {
	        // alert('externalChange: ' + event.value);
	    });
		
		// Check to see what page we're starting on
		var loc = $(location).attr('href').replace($(location).attr('hash'), '');
		var full_loc = $(location).attr('href');
		var hash = $(location).attr('hash');
		
		var patt1 = /portfolio/gi;
		var patt1a = /engagements/gi;
		var patt1b = /personal/gi;
		var patt2 = /information/gi;
		var patt2b = /rates/gi;
		var patt3 = /about/gi;
		var patt4 = /contact/gi;
		
		if (hash != null && hash != '#' && hash != '#/' && hash != '') {
			if (hash.match(patt1) != null) {
				if (hash.match(patt1a) != null) {
					kh.starting = "engagements";
					kh.currImage = Number(hash.replace('#/portfolio/engagements/', ''));
				} else if (hash.match(patt1b) != null) {
					kh.starting = "personal";
					kh.currImage = Number(hash.replace('#/portfolio/personal/', ''));
				} else {
					kh.starting = "weddings";
					kh.currImage = Number(hash.replace('#/portfolio/weddings/', ''));
				}
				
				if (kh.currImage == '#/portfolio/weddings' || kh.currImage == '#/portfolio/engagements' || kh.currImage == '#/portfolio/personal' || kh.currImage == '#/portfolio') {
					kh.currImage = 1;
				}
			} else if (hash.match(patt2) != null) {
				if (hash.match(patt2b) != null) {
					kh.starting = "rates";
				} else {
					kh.starting = "links";
				}
			} else if (hash.match(patt3) != null) {
				kh.starting = "about";
			} else if (hash.match(patt4) != null) {
				kh.starting = "contact";
			} else {
				kh.starting = "home";
			}
		} else {
			if (loc.match(patt1) != null) {
				if (loc.match(patt1a) != null) {
					kh.starting = "engagements";
				} else if (loc.match(patt1b) != null) {
					kh.starting = "personal";
				} else {
					kh.starting = "weddings";
				}
			} else if (loc.match(patt2) != null) {
				if (loc.match(patt2b) != null) {
					kh.starting = "rates";
				} else {
					kh.starting = "links";
				}
			} else if (loc.match(patt3) != null) {
				kh.starting = "about";
			} else if (loc.match(patt4) != null) {
				kh.starting = "contact";
			} else {
				kh.starting = "home";
			}
		}
		
		kh.nextPage = kh.starting;
		
		$('#image-holder a#next').live('click', function(e) {
			e.preventDefault();
			kh.nextImage = kh.currImage + 1;
			kh.fadeImage();
			$.address.value($(this).attr('href').replace(pageurl, ''));
		});
		
		$('#image-holder a#prev').live('click', function(e) {
			e.preventDefault();
			kh.nextImage = kh.currImage - 1;
			kh.fadeImage();
			$.address.value($(this).attr('href').replace(pageurl, ''));
		});
		
		kh.initNav();
		kh.checkForInit();
		
		kh.initCalled = true;
		
	},
	goDeep: function() {
				
		$('#nav li.active a').css('margin-top', '11px');
		
		$('#nav li').animate({
			'top': ('-=' + kh.heightper)
		}, 0);
		
		$('#nav').css('margin-left', 180);
		
		$('#subnav').css('opacity', 0);
		
		kh.reorderNav();
	},
	checkForInit: function() {
		// Check to see if we're on the portfolio page
		var patt = /portfolio/gi;
		var theUrl = document.location.href;
		if (theUrl.match(patt) != null) {
			kh.goPortfolio = true;
		}
		
		if (kh.goPortfolio == true) {
			//kh.initPortfolio();
		}
	},
	initNav: function() {
		// Setup clicks for nav
		$('#nav li a, #subnav li a').live('click', function(e) {
			if ($(this).parent().attr('id') != "blog") {
				e.preventDefault();
				$.address.value($(this).attr('href').replace(pageurl, ''));
				
				var loc = $(this).attr('href');
				var hash = $(location).attr('hash');
				var patt1 = /portfolio/gi;
				var patt1a = /engagements/gi;
				var patt1b = /personal/gi;
				var patt2 = /information/gi;
				var patt2b = /rates/gi;
				var patt3 = /about/gi;
				var patt4 = /contact/gi;
				
				if (loc.match(patt1) != null) {
					if (loc.match(patt1a) != null) {
						kh.nextPage = "engagements";
						kh.currImage = 1;
					} else if (loc.match(patt1b) != null) {
						kh.nextPage = "personal";
						kh.currImage = 1;
					} else {
						kh.nextPage = "weddings";
						kh.currImage = 1;
					}
				} else if (loc.match(patt2) != null) {
					if (loc.match(patt2b) != null) {
						kh.nextPage = "rates";
					} else {
						kh.nextPage = "links";
					}
				} else if (loc.match(patt3) != null) {
					kh.nextPage = "about";
				} else if (loc.match(patt4) != null) {
					kh.nextPage = "contact";
				} else {
					kh.nextPage = "home";
				}
				
				kh.shrinkNav();
				$(this).parent().addClass('active');
				if ($(this).parent().parent().attr('id') == 'nav') {
					$(this).css('margin-top', '11px');
				}
			}
		});
		
		// set li to absolute position
		$('#nav li').css('position', 'absolute');
		
		// create array of nav li
		$('#nav li').each(function() {
			kh.stackArray.push($(this).attr('id'));
		});
		
		// position each of the li
		if (kh.nextPage == "home") {
			// if its the homepage we have to add a little extra
			for (var i in kh.stackArray) {
				$('#'+kh.stackArray[i]).css('top', (kh.startheight + kh.heightper * i + 9));
			}
		} else {
			for (var i in kh.stackArray) {
				$('#'+kh.stackArray[i]).css('top', (kh.startheight + kh.heightper * i));
			}
		}
		
		// set the height of the ul
		$('#nav').height($('#nav li').size() * kh.heightper);
		
	},
	shrinkNav: function() {
		if (kh.currPage == "home") {
			kh.collapseNav();
		} else {
			$('#nav li.active a').animate({
				'margin-top': '11px'
			}, 500);
		
			$('#nav li').removeClass('active');
		
			$('#nav li').animate({
				'top': ('-=' + kh.heightper)
			}, 500);
		
			$('body').animate({'margin': 0}, 500, kh.collapseNav);
		}
	},
	collapseNav: function() {
		$('#nav').animate({
			'margin-left': '180px'
		}, 700, kh.reorderNav);
		
		$('#subnav').animate({
			'opacity': 0
		}, 700);
	},
	expandNav: function() {
		$('#nav').animate({
			'margin-left': 0
		}, 700);
		
		$('#nav li.active a').delay(700).animate({
			'margin-top': '20px'
		}, 350);
		
		$('#nav li').delay(1000).animate({
			'top': ('+=' + kh.heightper)
		}, 350);
		
		$('#subnav').delay(1500).animate({
			'opacity': 1
		}, 350);
	},
	reorderNav: function() {
		kh.activeSubnav = 'x';
		if (kh.nextPage == 'weddings' || kh.nextPage == 'engagements' || kh.nextPage == 'personal') {
			kh.activeNav = 'portfolio';
			kh.activeSubnav = kh.nextPage;
		} else if (kh.nextPage == 'rates' || kh.nextPage == 'links') {
			kh.activeNav = 'information';
			kh.activeSubnav = kh.nextPage;
		} else {
			kh.activeNav = kh.nextPage;
		}
		
		$('#nav li').removeClass('active');
		$('#nav #' + kh.activeNav).addClass('active');
		
		$('#nav li.active a').css('margin-top', '11px');
		
		kh.inArray.length = 0;
		kh.outArray.length = 0;
		
		for (var i in kh.stackArray) {
			// if current has clicked class add to inArray
			// else add to outArray
			if ($('#'+kh.stackArray[i]).hasClass('active')) {
				kh.inArray.push(kh.stackArray[i]);
			} else {
				kh.outArray.push(kh.stackArray[i]);
			}
		}
		
		kh.stackArray = kh.outArray.concat(kh.inArray);
		
		for (var i in kh.stackArray) {
			$('#'+kh.stackArray[i]).css('top', (kh.startheight - kh.heightper + i*kh.heightper));
		}
		
		kh.fadeOutPage();
	},
	fadeOutPage: function() {
		$('#image-holder img').animate({
			'opacity': 0
		}, 700, kh.loadNextPage);
		
		$('#sub-right').animate({
			'opacity': 0
		}, 700);
	},
	fadeInPage: function() {
		$('#image-holder img').animate({
			'opacity': 1
		}, 700, kh.expandNav);
		
		$('#sub-right').css('display', 'block');
		$('#sub-right').animate({
			'opacity': 1
		}, 700);
		
		kh.currPage = kh.nextPage;
	},
	loadNextPage: function() {
		$('#subnav').remove();
		$('#sub-right').remove();
		
		var w = 0;
		var h = 0;
		var img = '';
		var content = '';
		var sub = '';
		
		if (kh.nextPage == "rates" || kh.nextPage == "links") {
			if (kh.nextPage == "rates") {
				w = ratesWidth;
				h = ratesHeight;
				img = ratesImg;
				content = ratesContent;
			}
			if (kh.nextPage == "links") {
				w = linksWidth;
				h = linksHeight;
				img = linksImg
				content = linksContent;
			}
			kh.animateBox(w, h);
			$('#image-holder').html('<img src="' + img + '" alt="" />');
			$('#right').append('<div id="sub-right"><p>' + content + '</p></div>');
			$('#right').append('<ul id="subnav"><li id="rates"><a href="' + pageurl + '/information/rates">Rates</a></li><li id="links"><a href="' + pageurl + '/information/links">Links</a></li></ul>');
			
			//kh.initInformation();
		}
		
		if (kh.nextPage == "about") {
			kh.animateBox(aboutWidth, aboutHeight);
			$('#image-holder').html('<img src="' + aboutImg + '" alt="" />');
			$('#right').append('<div id="sub-right"><p>' + aboutContent + '</p></div>');
			$('#right').append('<div id="subnav"></div>');
		}
		
		if (kh.nextPage == "weddings" || kh.nextPage == "engagements" || kh.nextPage == "personal") {
			if (kh.nextPage == "weddings") {
				w = weddingsWidth;
				h = weddingsHeight;
				img = weddingsImg;
				sub = 'weddings';
				var imgs = weddingsImgs;
			}
			
			if (kh.nextPage == "engagements") {
				w = engagementsWidth;
				h = engagementsHeight;
				img = engagementsImg;
				sub = 'engagements';
				var imgs = engagementsImgs;
			}
			
			if (kh.nextPage == "personal") {
				w = personalWidth;
				h = personalHeight;
				img = personalImg;
				sub = 'personal';
				var imgs = personalImgs;
			}
			
			// alert(imgs[kh.currImage][1]);
			kh.animateBox(imgs[kh.currImage-1][1], imgs[kh.currImage-1][2]);
			kh.currSubPage = kh.nextPage;
			
			$('#image-holder').html('<img src="' + imgs[kh.currImage-1][0] + '" alt="" />');
			if (kh.currImage == 1) {
				$('#image-holder').append('<span id="prev"></span>');
			} else {
				$('#image-holder').append('<a href="' + pageurl + '/portfolio/' + sub + '/' + (kh.currImage-1) + '" id="prev">prev</a>')
			}
			if (kh.currImage == imgs.length) {
				$('#image-holder').append('<span id="next"></span>');
			} else {
				$('#image-holder').append('<a href="' + pageurl + '/portfolio/' + sub + '/' + (kh.currImage+1) + '" id="next">next</a>');
			}
			$('#right').append('<ul id="subnav"><li id="weddings"><a href="' + pageurl + '/portfolio/weddings">Weddings</a></li><li id="engagements"><a href="' + pageurl + '/portfolio/engagements">Engagements</a></li><li id="personal"><a href="' + pageurl + '/portfolio/personal">Personal</a></li></ul>');
			
			kh.initPortfolio();
		}
		
		if (kh.nextPage == "contact") {
			kh.animateBox(contactWidth, contactHeight);
			$('#image-holder').html('<img src="' + contactImg + '" alt="" />');
			$('#right').append('<div id="sub-right"><p>' + contactContent + '</p><form action=""><fieldset><label for="field-name">Name</label><input type="text" name="field-name" id="field-name" class="textfield" /><label for="field-email">Email</label><input type="text" name="field-email" id="field-email" class="textfield" /><label for="field-date">Wedding Date</label><input type="text" name="field-date" id="field-date" class="textfield" /><label for="field-hear">How\'d you hear about me?</label><input type="text" name="field-hear" id="field-hear" class="textfield" /><label for="field-message">Message</label><textarea id="field-message" name="field-message"></textarea><input type="submit" name="submit" id="submit" value="Send Message" /></fieldset></form></div>');
			$('#right').append('<div id="subnav"></div>');
		}
		
		$('#image-holder img').css('opacity', 0);
		$('#subnav').css('opacity', 0);
		$('#sub-right').css('display', 'none');
		$('#sub-right').css('opacity', 0);
		
		$('#subnav #' + kh.activeSubnav).addClass('active');
		
		kh.currPage = kh.nextPage;
	},
	animateBox: function(w, h) {
		$('#image-holder').animate({
			'width': w,
			'height': h
		}, 700, kh.fadeInPage);
	},
	fadeImage: function() {
		$('#image-holder img').animate({
			'opacity': 0
		}, 700, kh.loadNextImage);
	},
	loadNextImage: function() {
		if (kh.nextPage == 'weddings') {
			var imgs = weddingsImgs;
		} else if (kh.nextPage == 'engagements') {
			var imgs = engagementsImgs;
		} else {
			var imgs = personalImgs;
		}
		
		if ($('#image-holder').width() == imgs[kh.nextImage-1][1] && $('#image-holder').height() == imgs[kh.nextImage-1][2]) {
			// currImage and nextImage are the same size so don't resize #image-holder
			$('#image-holder').html('<img src="' + imgs[kh.nextImage-1][0] + '" alt="" />');
			$('#image-holder img').css('opacity', 0);
			$('#image-holder img').animate({
				'opacity': 1
			}, 700, kh.advImage);
		} else {
			// currImage and nextImage are NOT the same size so resize #image-holder
			$('#image-holder').animate({
				'width': imgs[kh.nextImage-1][1],
				'height': imgs[kh.nextImage-1][2]
			}, 700);

			$('#image-holder').delay(700).html('<img src="' + imgs[kh.nextImage-1][0] + '" alt="" />');
			$('#image-holder img').delay(700).css('opacity', 0);
			
			$('#image-holder').children('img').load(function() {
				$('#image-holder img').animate({
					'opacity': 1
				}, 700, kh.advImage);
			});
		}
	},
	advImage: function() {
		if (kh.nextPage == 'weddings') {
			var imgs = weddingsImgs;
		} else if (kh.nextPage == 'engagements') {
			var imgs = engagementsImgs;
		} else {
			var imgs = personalImgs;
		}
		
		if (kh.nextImage == 1) {
			$('#image-holder').append('<span id="prev"></span>');
		} else {
			$('#image-holder').append('<a href="' + pageurl + '/portfolio/' + kh.nextPage + '/' + (kh.nextImage-1) + '" id="prev">prev</a>');
		}
		if (kh.nextImage == imgs.length) {
			$('#image-holder').append('<span id="next"></span>');
		} else {
			$('#image-holder').append('<a href="' + pageurl + '/portfolio/' + kh.nextPage + '/' + (kh.nextImage + 1) + '" id="next">next</a>');
		}
		$("a#next").css('background', 'url(' + pageurl + '/images/arrow-next.gif) no-repeat 70% 50%').css('opacity', '0');
		$("a#prev").css('background', 'url(' + pageurl + '/images/arrow-prev.gif) no-repeat 30% 50%').css('opacity', '0');
		
		kh.currImage = kh.nextImage;
	},
	initPortfolio: function() {
		
		$("a#next").css('background', 'url(' + pageurl + '/images/arrow-next.gif) no-repeat 70% 50%').css('opacity', '0');
		$("a#prev").css('background', 'url(' + pageurl + '/images/arrow-prev.gif) no-repeat 30% 50%').css('opacity', '0');
		
		// Teach Navigation on first load
		$('#image-holder img').delay(500).animate({
			opacity: .1
		}, 1500).animate({
			opacity: 1
		}, 1500);
		
		$('a#next').delay(500).animate({
			opacity: .5
		}, 1500).delay(500).animate({
			opacity: 0
		}, 1500);
		
		$('a#prev').delay(500).animate({
			opacity: .5
		}, 1500).delay(500).animate({
			opacity: 0
		}, 1500);
		
		
		// NEXT/PREV mouse overs
		// $('a#next').live('mouseover', function() {
		// 	$(this).animate({
		// 		opacity: .4
		// 	}, 500);
		// });
		// 
		// $('a#next').live('mouseout', function() {
		// 	$(this).animate({
		// 		opacity: 0
		// 	}, 500);
		// });
		// 
		// $('a#prev').live('mouseover', function() {
		// 	$(this).animate({
		// 		opacity: .4
		// 	}, 500);
		// });
		// 
		// $('a#prev').live('mouseout', function() {
		// 	$(this).animate({
		// 		opacity: 0
		// 	}, 500);
		// });
	}
	
};