// 
// MappingDuBois.org
// Michelle Rajunov
// JQuery main file 
// used in all pages of website
// Feb 26, 2009
//
// contains
//	- PNG fix for IE 6
//	- scrolling function inside #content > div.section (to switch between subsections in each page)
//	- animation for sidebar links (the green ones)
//	- animation for topnav links (the red ones)


$(document).ready(function() {  

//!////////// PNG fix for IE6 ///////
//
//  check if browser is IE 6
// 	http://docs.jquery.com/Tutorials:PNG_Opacity_Fix_for_IE6
//
// 	The PNGs are replaced by transparent GIFs, and we use a Microsoft Filter to get our original image back

	var badBrowser = (/MSIE ((5\.5)|6)/.test(navigator.userAgent) && navigator.platform == "Win32");
	if (badBrowser) {
		// get all pngs on page
		$('img[src$=.png]').each(function() {
			// If the images are not loaded, yet, jQuery can't find out the width and height
			if (!this.complete) { 	this.onload = function(){fixPng(this)};	} 
			else {	fixPng(this);	}
		});
	}
	

//!////////// scrolling inside #content > div ///////
//
//  hide all #content > div except target div, show target div
//

	// on dom ready, hide all panels (div.section)	
	// first one will be shown by default
	var hash = window.location.hash;
	if(!hash)	$('#content').children().hide().eq(0).show(); 
	else{		$('#content').children().hide(); $(hash).show();	
				$('#sidebar li').removeClass('on').find('a[href="'+hash+'"]').parent().addClass('on'); }


	$('#sidebar li a').click(function(){	
		var target = $(this).attr("href");
		
		if(!$(this).parent().hasClass('on')){
			// toggle 'on' class for #sidebar li
			// make sure css is reset by animating mouse out behaviour
		$('#sidebar li.on')
				.animate({
					paddingRight: '0px', marginRight: '40px', marginLeft: '-40px', 
					borderTopColor: '#5A4B29', borderBottomColor: '#5A4B29', borderLeftColor: '#5A4B29',
					backgroundColor: '#5A4B29'
					}, 400)
				.removeClass('on')
				.find('a').animate({color: '#FBE8BE' }, 'fast');
		
			// add the 'on' class to clicked li
		$(this).parent().addClass('on');
			// hide all div.section (panels) inside #content, show target
		$('#content div.section').hide();
		$(target).fadeIn(1000);
		}
	});


	
//!////////// animation for sidebar links ///////
//
//	change padding to match border width
//  change background color, then margin to animate
//	do not change li.on
//
//
	
	$("#sidebar li").hoverIntent(
		function() { ///////mouse in
		if(!$(this).hasClass('on')){
			$(this).find('a').animate({color: '#142505' }, 100);
			$(this).animate({ 
					borderTopColor: '#667733', borderBottomColor: '#667733', borderLeftColor: '#667733', 
					backgroundColor: '#99bb55',
					paddingRight: '40px', marginRight:  '0',  marginLeft:  '0'
					}, 400);
		}
		}, function() { 				////////mouse out
		if(!$(this).hasClass('on')){
			$(this).animate({
					paddingRight: '0px', marginRight: '40px', marginLeft: '-40px', 
					borderTopColor: '#5A4B29', borderBottomColor: '#5A4B29', borderLeftColor: '#5A4B29',
					backgroundColor: '#5A4B29'
					}, 400); 
			$(this).find('a').animate({color: '#FBE8BE' }, 'fast');	
		}
		});
	


//!////////// animation for nav links ///////
//
//	change padding to match border width
//  change background color, then margin to animate
//	do not change li.on
//
//
	$("#nav li:not('.on')").hoverIntent(
		function() { ///////mouse in
		if(!$(this).hasClass('google')){
			$(this).animate({ 
					borderBottomColor: '#993333', borderLeftColor: '#993333', borderRightColor: '#993333', borderTopColor: '#993333', 
					paddingTop: '5px'}, 100)
					.animate({		backgroundColor: '#D6504C', paddingBottom: '50px'	}, 400)
					.contents().animate({ paddingBottom: '50px', paddingTop: '5px'});		// animate <a> for Safari
		}
		}, function() { 				////////mouse out
		if(!$(this).hasClass('google')){
			$(this).animate({ 
				borderBottomColor: '#5A4B29', borderLeftColor: '#5A4B29', borderRightColor: '#5A4B29', borderTopColor: '#5A4B29'}, 100)
				.animate({paddingBottom: '0', paddingTop: '0', backgroundColor: '#5A4B29'	}, 400)
				.contents().animate({ paddingBottom: '0px'});	// animate <a> for Safari
		}
		});
		
		
}); 
/******************* end document.ready *****************************/

///
//!////////// For PNG Fix
////
 var blank = new Image();
 blank.src = 'img/blank.gif';
 
function fixPng(png) {
   // we store the original image in the variable src
   var src = png.src;
   // The filter needs width and height to be set, so we check, whether the information is available. If not, we use jQuery to find it out.
   if (!png.style.width) { png.style.width = $(png).width(); }
   if (!png.style.height) { png.style.height = $(png).height(); }
   // replace by blank image
   // When the image ist replaced by the transparent gif, the event is fired again.
   png.onload = function() { };
   png.src = blank.src;
   // set filter (display original image)
   png.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + src + "',sizingMethod='scale')";
}