$(function() {

	//////////////////////////////////////////////////////////////////
	//////////////////////// Transition Test /////////////////////////
	//////////////////////////////////////////////////////////////////
	
	var css_transitions = supportsTransitions();

	function supportsTransitions() {
		var b = document.body || document.documentElement;
		var s = b.style;
		var p = 'transition';
		if(typeof s[p] == 'string') {return true; }

		// Tests for vendor specific prop
		v = ['Moz', 'Webkit', 'Khtml', 'O', 'Ms'],
		p = p.charAt(0).toUpperCase() + p.substr(1);
		for(var i=0; i<v.length; i++) {
		  if(typeof s[v[i] + p] == 'string') { return true; }
		}
		return false;
	}
	
	
	//////////////////////////////////////////////////////////////////
	///////////////////////////// MISC ///////////////////////////////
	//////////////////////////////////////////////////////////////////

	// Fancybox Selectors
	$('#thumbnail_content').find('a').fancybox({
		'titlePosition' : 'inside'
	});
	
	// Attempt to hide email from SPIDERS
	function superComplicatedEmail() {
		var mail = 'mailto:';
		var name = 'luke';
		var at = '@';
		var domain = 'jukes';
		var dot = '.';
		var suffix = 'us';
		var address = name + at + domain + dot + suffix;
		var mail_address = mail + name + at + domain + dot + suffix;
		return '<a href="' + mail_address + '">' + address + '</a>';
	}

	$('.email').append(superComplicatedEmail());

	// Toggle Page Info on click
	(function() {
		var info_toggle = false;
		var $info_box = $('.page_info'); 
		var info_height = $info_box.css('max-height');
		
		$('.info_button').click(infoClick);
		
		function infoClick() {
			if (css_transitions) {
				if (!info_toggle) {
					$info_box.css({height: info_height});
				} else {
					$info_box.css({height: '0'});
				}
			} else {
				if (!info_toggle) {
					$info_box.animate({height: info_height}, 200);
				} else {
					$info_box.animate({height: '0'}, 200);
				}
			}
			info_toggle = !info_toggle;
		}
	})();
		
		
	//////////////////////////////////////////////////////////////////////////////	
	///////////////////////////// HEADER ANIMATION ///////////////////////////////
	//////////////////////////////////////////////////////////////////////////////
	
	$('#header_image').hover(function() {
		var random_header = Math.floor(Math.random() * 3);
		$(this).css({'background-position': + ((random_header*(-118)) -118) + 'px 0'});
	}, function() {
		$(this).css({'background-position':'0 0'});
	});
	
		
	//////////////////////////////////////////////////////////////////////////////
	/////////////////////////// NAVIGATION ANIMATION /////////////////////////////
	//////////////////////////////////////////////////////////////////////////////
	
	// Background Slide
	
	var $back_shift = $('#back_shift');
	
	$('#nav_bar').find('li').find('a').hover(function() {
		slide_right(this);
	}, function() {
		slide_left();
	});
	
	function slide_right(a) {
		if (css_transitions) {
			$back_shift.css({width: '100%', backgroundColor: $(a).parent('li').css('background-color')});
		} else {
			$back_shift.stop(true, true).animate({width:'100%'}, 300).css({backgroundColor: $(a).parent('li').css('background-color')});	
		}
	}
	
	function slide_left() {
		if (css_transitions) {
			$back_shift.css({width: '0%'});
		} else {
			$back_shift.stop(true, true).animate({width:'0%'}, 100);
		}
	}
		
	
	//////////////////////////////////////////////////////////////////////////////
	//////////////////////////////// THUMBNAILS //////////////////////////////////
	//////////////////////////////////////////////////////////////////////////////
	
		
	// Thumbnail Hover Effect
	var $hidden_thumb = $('.hidden_thumb');
	var $thumbnail = $('.thumbnail');
	var direction = ['0', '0', '0', '0'];
	
	set_thumbs();
	
	// Fade in all thumbs on mouseout
	$('#thumbnail_content').mouseleave(function() {
		if (css_transitions) {
			$thumbnail.css({opacity: '1'});
		} else {
			$thumbnail.stop().animate({opacity:'1'},480);
		}
	});
	
	// Thumbnail hover call	
	$thumbnail.hover(function() {
		$hidden_thumb = $(this).find('.hidden_thumb');
		move_thumbs(this);
	}, function() {
		reset_thumbs(this);
	});
	
	function set_thumbs () {
		$.each($thumbnail, function() {
			direction = randomDirection();
			$(this).data('dir', direction);
			$(this).children('.hidden_thumb').css({top: direction[2], 'left': direction[3]});
		});
	}
	
	function move_thumbs(thumb) {
		var color = random_color();
		var opac = '.5'
		direction = $(thumb).data('dir');
		
		// Set opacity for hovered thumb, other thumbs, animate image and thumb
		if (css_transitions) {
			$(thumb).css({opacity: '1'}).children('.thumbnail_border').css({'border-color': color[0]}).show();
			$thumbnail.not(thumb).css({opacity: opac});
			if ($(thumb).hasClass('sliding')) {
				$(thumb).children('img').first().css({'top': direction[0], 'left': direction[1]});
				$hidden_thumb.css({'top':'0', 'left':'0'});
			}
		} else {
			$(thumb).stop().animate({opacity:'1'},160).children('.thumbnail_border').css({'border-color': color[0]}).show();
			$thumbnail.not(thumb).stop().animate({opacity: opac},320);
			if ($(thumb).hasClass('sliding')) {
				$(thumb).children('img').first().stop().animate({'top': direction[0], 'left': direction[1]});
				$hidden_thumb.stop().animate({'top':'0', 'left':'0'});
			}
		}
	}

	function reset_thumbs(thumb) { // Mouse off thumbnail
		$(thumb).children('.thumbnail_border').hide();
		if ($(thumb).hasClass('sliding')) {
			if (css_transitions) {
				$(thumb).children('img').first().css({'top': '0', 'left': '0'}); // Slide original image back home
				$hidden_thumb.css({'top': direction[2], 'left': direction[3]}); // Slide full thumb back where it started
			} else {
				$(thumb).children('img').first().stop().animate({'top': '0', 'left': '0'}); // Slide original image back home
				$hidden_thumb.stop().animate({'top': direction[2], 'left': direction[3]}); // Slide full thumb back where it started
			}
		}
	}	
		
	// Web Thumbs
	
	$('.see_it_live').css('visibility','visible');
	
	$('.web_photo').hover(function() {
		if (css_transitions) {
			$(this).children('img').css({opacity: '.5'});
			$(this).children('.see_it_live').css({opacity: '1'});
		} else {
			$(this).children('img').stop(true,true).animate({opacity:.5},200);
			$(this).children('.see_it_live').stop(true,true).animate({opacity:1},200);
		}
	}, function() {
		if (css_transitions) {
			$(this).children('img').css({opacity: '1'});
			$(this).children('.see_it_live').css({opacity: '0'});
		} else {
			$(this).children('img').animate({opacity:1},200);
			$(this).children('.see_it_live').animate({opacity:0},200);
		}
	});
			
			
	//////////////////////////////////////////////////////////////////////////////	
	/////////////////////////////// CONTACT FORM /////////////////////////////////
	//////////////////////////////////////////////////////////////////////////////
	
	var form_input = $('#form_top').find('input');
	var form_textarea = $('#form_top').find('textarea');
		
	$(form_input).add(form_textarea).focus(function() {
		$(this).parent('p').css({backgroundColor: '#23BEC4', color: '#fff'});
	});		
	
	$(form_input).add(form_textarea).blur(function() {
		$(this).parent('p').css({backgroundColor: '#393939', color: '#fff'});
	});
		
	// Contact Form Ajax
	$("#ajax_contact_form").submit(function(){
	
		var str = $(this).serialize();
		
		$.ajax({
			type: "POST",
			url: "http://jukes.us/wp-content/themes/Jukespress/scripts/form_contact.php",
			data: str,
			success: function(msg){   
				$("#note").ajaxComplete(function(event, request, settings){
				if(msg == 'OK') { // Message Sent? Show the 'Thank You' message and hide the form
					result = '<div class="notification_ok"><p>Thanks for the message!</p></div>';
					$("#form_fields").hide();
				}
				else {
					result = msg;
				}
				$(this).html(result);
				});
			}
			});
		return false;
	});

	//////////////////////////////////////////////////////////////////////////////
	///////////////////////////////// FUNCTIONS //////////////////////////////////
	//////////////////////////////////////////////////////////////////////////////
	
	// Random Color Generator Function
	
	function random_color() {
		var color = ['#000', '#000'];
		var randomNumber = Math.floor(Math.random() * 6);
		
		if (randomNumber === 0) {
			color[0] = '#D74B83';			
			color[1] = '#fff';
		} else if (randomNumber === 1) {
			color[0] = '#D74B83';
			color[1] = '#fff';
		} else if (randomNumber === 2) {
			color[0] = '#FF8F21';
			color[1] = '#fff';
		} else if (randomNumber === 3) {
			color[0] = '#23BEC4';
			color[1] = '#fff';
		} else if (randomNumber === 4) {
			color[0] = '#FF8F21';
			color[1] = '#fff';
		} else if (randomNumber === 5) {
			color[0] = '#23BEC4';
			color[1] = '#fff';
		}
		
		return color;
	}
	
	// Random Direction generator for thumbnail scrolling
	function randomDirection() {
	
		var dir = ['0', '0', '0', '0']; // direction[0] is top coords, 1 is left;
		var random_direction = Math.floor(Math.random() * 4);
		
		if (random_direction === 0) {
			dir[0] = '-160px';
			dir[1] = '0';
			dir[2] = '160px';
			dir[3] = '0';
		} else if (random_direction === 1) {
			dir[0] = '0';
			dir[1] = '160px';
			dir[2] = '0';
			dir[3] = '-160px';
		} else if (random_direction === 2) {
			dir[0] = '160px';
			dir[1] = '0';
			dir[2] = '-160px';
			dir[3] = '0';
		} else if (random_direction === 3) {
			dir[0] = '0';
			dir[1] = '-160px';
			dir[2] = '0';
			dir[3] = '160px';
		}
		
		return dir;
	}
	
	function fixIE() {
		// Fix for PNG transparency issue in IE when crossfading
		var i;
		for (i in document.images) {
			if (document.images[i].src) {
				var imgSrc = document.images[i].src;
					if (imgSrc.substr(imgSrc.length-4) === '.png' || imgSrc.substr(imgSrc.length-4) === '.PNG') {
					document.images[i].style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled='true',sizingMethod='crop',src='" + imgSrc + "')";
				}
			}
		};
	}
	
	fixIE();	
	
});