var loadPage = 'hello';
var clientOffset = 1;
var chainSwinging = false;
var switchDown = null;
var switchUp = null;

// DOM READY
$(document).ready(function() {
	
	// redirect ie6
	if($.browser.msie && parseInt($.browser.version) < 7) {
		document.location = '/index-flash.html';
	}

	
	// nav bar
	$('#nav a').click(function() {
		var section = $(this).text().toLowerCase();
		document.location = '#' + section;
		changePage(section);
		$(this).blur();
		return false;
	});
	$('#content').show().addClass('loading');

	// theme pull switch
	if(document.createElement('audio')) {
		var switchDown = document.createElement('audio');
		var switchUp = document.createElement('audio');
		var audioFormat = document.all ? 'mp3' : 'ogg';
		switchDown.setAttribute('src', 'audio/switch-down.' + audioFormat);
		switchDown.setAttribute('preload', 'preload');
		switchUp.setAttribute('src', 'audio/switch-up.' + audioFormat);
		switchUp.setAttribute('preload', 'preload');
	}
	
	var opac = 0;
	var ts = $('#theme-switch');
	for(i = 0; i < 9; i++) {
		opac = opac + .15;
		if(opac > 1) opac = 1;
		ts.append('<span class="sm"></span>');
		ts.find('span:last').css('opacity', opac);
	}
	ts.append('<span class="lg"></span>').mousedown(function() {
		$(this).addClass('switch-pulled').animate({marginTop: -6}, 100);
		try {
			switchDown.play();
		}
		catch(e) {}
		return false;
	}).find('span').mouseout(function(event) {
		var swingLeft = false;
		if(event.pageX < $(this).offset().left + ($(this).width() / 2)) {
			swingLeft = true;	
		}
		swingChain(swingLeft);
	}).mouseover(function() {
		//stopChainSwing();
	});
	
	$(document.body).mouseup(function() {
									 
		if(loadPage == 'hello') {
			if($('.switch-pulled').length) {
				$('.switch-pulled').removeClass('switch-pulled')
				.animate({marginTop: -18}, 100, function() {
					swingChain();
					setTimeout('stopChainSwing()', 100);
				});
				var look = $(document.body).hasClass('day') ? 'nite' : 'day';
				swapLook(look);	
				try {
					switchUp.play();
				}
				catch(e) {}
			}
		}
	});

	// detect load page
	var url = document.location.href;
	var hash = url.lastIndexOf('#');
	if(hash > -1) {
		var page = url.substring(url.lastIndexOf('#') + 1);
		if(page.length) {
			loadPage = page;
		}
	}
	
	// client list
	$('#work li').each(function() {
		$(this).prepend('<span></span>');				
	}).click(function() {
		if(!$(this).hasClass('open')) {
			$(this).find('span:first').removeClass('hover');
			$('.open').animate({marginTop: 35, height: 150}).removeClass('open');
			$(this).addClass('open');
			$(this).animate({marginTop: -60, height: 330});
		}
		//$(this).blur();
		//return false;
	}).mouseover(function() {
		if(!$(this).hasClass('open')) {
			$(this).find('span:first').addClass('hover');
		}
	}).mouseout(function() {
		$(this).find('span:first').removeClass('hover');
	});

	// client navigation
	var offsetMax = $('#page-clients li').length / 3;
	var updatingList = false;
	$('#work-back').add('#work-next').click(function() {
		if(!updatingList) {
			updatingList = true;
			var timedelay = 0;
			if($(this).attr('id') == 'work-back') {
				clientOffset --;
				if(clientOffset < 1) {
					clientOffset = offsetMax;	
				}
			}
			else {
				clientOffset ++;
				if(clientOffset > offsetMax) {
					clientOffset = 1;	
				}
			}
			var min = (clientOffset * 3) - 3;
			var max = (clientOffset * 3);
			$('#work ul li').stop().css({marginTop: 35, height: 150})
			.removeClass('open').hide().each(function(i) {
				if(i >= min && i < max) {
					timedelay = timedelay + 150;
					var el = $(this);
					setTimeout(function() {
						$(el).fadeIn();
					}, timedelay);
				}
			});
			setTimeout(function() {
				updatingList = false;
			}, 750);
		}
		$(this).blur();
		return false;
	}).mousedown(function() {
		$(this).css({marginTop: parseInt($(this).css('marginTop')) + 1});
	}).mouseup(function() {
		$(this).css({marginTop: parseInt($(this).css('marginTop')) - 1});
	});

	// services list
	$('#services h3').hover(function() {
		$(this).addClass('hover');
	}, function() {
		$(this).removeClass('hover');
	}).click(function() {
		$('#services h3:first').animate({marginTop: 5}, 250);
		if($('#services .selected').length) {
			$('#services .selected').removeClass('selected').next().hide();
			$('#services h3').addClass('dimmed');
			$(this).removeClass('dimmed').addClass('selected').next().show();
		}
		else {
			$('#services h3').addClass('dimmed');
			$(this).removeClass('dimmed').addClass('selected').next().slideDown(250);			
		}
		$(this).blur();
		return false;
	});
	
	// about page contact link
	$('#about .link').click(function() {
		document.location = '#contact';
		changePage('contact');
		$(this).blur();
		return false;
	});
	
	// contact form
	$('#contact form').submit(function() {
		var o = {};
		
		o.name = $('#contact-name').val();
		o.email = $('#contact-email').val();
		o.phone = $('#contact-phone').val();
		o.message = $('#contact-message').val();
		o.subject = 'Message from ' + o.name;
		o.id = '1';
		o.redirect = '#';
		$.ajax({
			type: 'POST',
			url: '/mail.php',
			data: o,
			success: function(data) {
				alert('Thanks, we will be in contact with you shortly!');
				$('#contact-message').val('');
				$('#contact-phone').val('');
				$('#contact-email').val('');
				$('#contact-name').val('');
			},
			error: function(data) {
				var errorMessage = 'Sorry, '
				+ 'there was a problem submitting this form.\n'
				+ 'Make sure the email you entered is valid and\n'
				+ 'all fields are filled out, then try again.';
				alert(errorMessage);	
			}
		});
		return false;
	});

});

// PAGE LOADED
$(window).load(function() {
	
	// browser sniff
	var badBrowser = false;
	if($.browser.msie && parseInt($.browser.version) < 7) {
		badBrowser = true;	
	}

	// finished loading
	$('#loader').remove();

	// load index page
	if(!badBrowser) {
		$('.page').hide();
		changePage(loadPage);
		$('#content').removeClass('loading');
	}
	// or display message
	else {
		$('.page').hide();
		var browsertext = '<p class="badbrowser">Sorry, this site does not work '
		+ 'with your browser. Try updating your browser to a newer version.</p>';
		$(document.body).prepend(browsertext);
		
	}
	
});

// change current page
function changePage(section) {
	
	loadPage = section;
	
	// change page content
	$('.page').hide();
	$('#' + section).show();
	
	// update nav
	$('#nav li').removeClass('selected');
	$('#nav-' + section).addClass('selected');

	// page animations
	var timedelay = 0;
	switch(section) {
	
	// hello page animations
	case 'hello':
		$('#theme-switch').hide().fadeIn(1000);
		swingChain();
		break;

	// work page animations
	case 'work':
		clientOffset = 1;
		$('#work ul li').css({marginTop: 35, height: 150, cursor: 'pointer'})
		.removeClass('open').hide().each(function(i) {
			if(i < 3) {
				timedelay = timedelay + 150;
				var el = $(this);
				setTimeout(function() {
					$(el).fadeIn();
				}, timedelay);
			}
		});
		break;
	
	// servics page animations
	case 'services':
		$('#services p').hide();
		$('#services h3:first').css({marginTop: 15});
		$('#services h3').removeClass('selected').removeClass('dimmed')
		.hide().each(function() {
			timedelay = timedelay + 100;
			var el = $(this);
			setTimeout(function() {
				$(el).fadeIn();
			}, timedelay);
		});
		$('#atoms').hide().fadeIn(800);
		break;
	
	case 'about':
		$('#about span').removeClass('hilite').each(function() {
			timedelay = timedelay + 100;
			var el = $(this);
			setTimeout(function() {
				$(el).addClass('hilite');
			}, timedelay);
		});
		break;
	}
}

// change theme
function swapLook(look) {
	$(document.body).attr('className', look);
}

// chain swing animation
function swingChain(left) {
	if(!chainSwinging) {
		chainSwinging = true;
		var chain = $('#theme-switch');
		var chain2 = chain.find('span').eq(2);
		var chain3 = chain.find('span').eq(3);
		var chain4 = chain.find('span').eq(4);
		var chain5 = chain.find('span').eq(5);
		var chain6 = chain.find('span').eq(6);
		var chain7 = chain.find('span').eq(7);
		var chain8 = chain.find('span').eq(8);
		var chain9 = chain.find('span').eq(9);
		chain2.animate({marginLeft: left?9:11}, 200);
		chain3.animate({marginLeft: left?8:12}, 200);
		chain4.animate({marginLeft: left?7:13}, 200);
		chain5.animate({marginLeft: left?6:14}, 200);
		chain6.animate({marginLeft: left?5:15}, 200);
		chain7.animate({marginLeft: left?3:17}, 200);
		chain8.animate({marginLeft: left?2:18}, 200);
		chain9.animate({marginLeft: left?0:20}, 200, function() {
			chain2.animate({marginLeft: left?11:9}, 400);
			chain3.animate({marginLeft: left?12:8}, 400);
			chain4.animate({marginLeft: left?13:7}, 400);
			chain5.animate({marginLeft: left?14:6}, 400);
			chain6.animate({marginLeft: left?15:5}, 400);
			chain7.animate({marginLeft: left?16:4}, 400);
			chain8.animate({marginLeft: left?18:2}, 400);
			chain9.animate({marginLeft: left?20:0}, 400, function() {
				chain2.animate({marginLeft: 10}, 200);
				chain3.animate({marginLeft: 10}, 200);
				chain4.animate({marginLeft: left?9:11}, 300);
				chain5.animate({marginLeft: left?8:12}, 400);
				chain6.animate({marginLeft: left?7:13}, 400);
				chain7.animate({marginLeft: left?6:14}, 400);
				chain8.animate({marginLeft: left?5:15}, 400);
				chain9.animate({marginLeft:	left?4:16}, 400, function() {
					chain4.animate({marginLeft: 10}, 300);
					chain5.animate({marginLeft: 10}, 300);
					chain6.animate({marginLeft: left?11:9}, 300);
					chain7.animate({marginLeft: left?12:8}, 300);
					chain8.animate({marginLeft: left?13:7}, 300);
					chain9.animate({marginLeft: left?14:6}, 300, function() {											 									
						chain5.animate({marginLeft: 10}, 200);
						chain6.animate({marginLeft: left?9:11}, 200);
						chain7.animate({marginLeft: left?8:12}, 200);
						chain8.animate({marginLeft: left?8:12}, 200);
						chain9.animate({marginLeft: left?7:13}, 200, function() {
							chain5.animate({marginLeft: 10}, 200);
							chain6.animate({marginLeft: 10}, 200);
							chain7.animate({marginLeft: 10}, 200);
							chain8.animate({marginLeft: 10}, 200);
							chain9.animate({marginLeft: 10}, 200, function() {
								chainSwinging = false;
							});							
						});	
					});				
				});			
			});	
		});
	}
}

// stop chain swing
function stopChainSwing() {
	if(chainSwinging) {
		var chain = $('#theme-switch');
		chain.find('span').stop().animate({marginLeft: 10}, 150, function() {
			chainSwinging = false;																 
		});
		chainSwinging = true;
	}
}