// JavaScript Document

// when the document is ready:
$(document).ready(function(){
						   
						   
						   
	$('#orangeCenter').tabs({ fxFade: true, fxSpeed: 'fast' });
	({
		fxFade: true,
		fxSpeed: 'fast',
		onClick: function() {
			//alert('onClick');
		},
		
		onHide: function() {
			alert('onHide');
		},
		onShow: function() {
			alert('onShow');
			selectedClass: 'tabs-selected';
		}
	});
	
				
	// tests to see if we're in IE and ie less that 7
	var isIE = $.browser.msie;
	var isBadIE = $.browser.msie && /MSIE\s(5\.5|6\.)/.test(navigator.userAgent);						   
	
	// functions found below
	
	accordionise();
	accordionisep();
	
	// this is interface.js - it needs to be linked to from the pages with jquery
	//$(document).ScrollToAnchors(700);
	
	
	// rel = external to open in new window
	// fix for target=”_blank”
	$("a[@rel~=’external’]").click(function(){
		window.open($(this).attr("href"));
		return false;
	});
	
	//$(".collapselink").hide();
	
	//var output = $("#center").css("margin");
	//alert(output);
});


// this function search and replaces a string and returns the new string
// http://www.daveshuck.com/blog/index.cfm/2006/12/13/Javascript-examples--removeElement-and-replaceAll
function replaceAll( str, searchTerm, replaceWith, ignoreCase )   {
   var regex = "/"+searchTerm+"/g";
   if( ignoreCase ) regex += "i";
   return str.replace( eval(regex), replaceWith );
}

// 1312 - a reworking of the s50 one
function accordionise() {
	// hide the accordion things on load - this might cause a flash. If so manually put an inline style on the elements
	// <div class="accordionListContent" style="display: none;">...
	$('.accordionListContent').hide(); 	

	$("h3.accordionTitle").hover(function() {
		// add class on roll over
		$(this).addClass("hover");
	},function(){
		// remove it on roll off
		$(this).removeClass("hover");
	});	

	// the accordion stuff, fires when you click a h3 with class "accordionTitle"
	$('h3.accordionTitle').click(function() {
		// this looks at what the next thing is in the html to the h3, its always gonna be a div for us
		var $nextDiv = $(this).next();
		// looks to see if the next thing is visible or not - checked in a bit
		var $visibleSiblings = $nextDiv.siblings('div:visible'); 
		// i like $$ = $(this) as short hand
		var $$ = $(this);
		
			// ----------------------------------
			// this series of stuff formulates an anchor to add to the h3 so we can move the page to top of the newly opened div
			// set the flag below to false if you dont want this to happen
			// ----------------------------------
			var doAnchors = true; //set to false if you dont want the anchors to be active
			
			if (doAnchors) {
				// grabbing the html content
				var thisHtml = $$.html();
				// keeping a record of what it was before, so I can remove the anchor later (so every click doesnt add more and more of them)
				var originalHtml = thisHtml;
				// replaceOutSpaces and ampersands to make it easier for bad browsers
				thisHtml = replaceAll(thisHtml, " ", "");
				thisHtml = replaceAll(thisHtml, "&amp;", "");		
				thisHtml = replaceAll(thisHtml, "'", "");		
				// the anchor link itself
				var anchorLink = '<a name=title-' + thisHtml + ' id=title-' + thisHtml + '></a>';
				// then but it before the content of the h3's (so ends up <h3><a name=...></a></h3>
				$$.prepend(anchorLink);
			}
			// ----------------------------------
			
		
			//----------------------------------
			// wanna highlight this one as active when you clicked it?
			// write a css style for h3.active
			// ----------------------------------
			// make all the h3s grey on click
			$("h3.accordionTitle").removeClass("active");
			// except the one we just clicked
			$$.addClass("active");
			// ----------------------------------
			
			//----------------------------------
			// wanna make the other titles do something when you have a div open?
			// write a css style for h3.inActive
			// ----------------------------------
			// make all the h3s grey on click
			$("h3.accordionTitle").addClass("inActive");
			// except the one we just clicked
			$$.removeClass("inActive");
			// ----------------------------------
		
		
		// ----------------------------------
		// this is the bit that does the moving around of the divs
		// ----------------------------------
		if ($visibleSiblings.length ) {
			// if there is something thats been forced to visible that we need to close to open our new one
			// essentially tests the array of $visibleSiblings to see if its something and not nothing (arrays ftw)
			$visibleSiblings.slideUp('slow', function() {
			// on finish of slideing up the old one, slide down the next (the nesting of jquery functions creates odd code)
				$nextDiv.slideToggle('slow', function() {
					// and when this has done its slide
					// if we're doing anchors, move the window to this h3's new anchor
					if (doAnchors) {
						window.location = "#title-" + thisHtml;
						// then remove the new anchor (so as not to leave the DOM messy)
						$$.html(originalHtml);
					}
				});
		  });
		} else {
			$nextDiv.slideToggle('slow', function() {
				// hide or show whatever
				// if we're doing anchors, move the window to this h3's new anchor
				if (doAnchors) {
					window.location = "#title-" + thisHtml;
					// then remove the new anchor (so as not to leave the DOM messy)
					$$.html(originalHtml);
				}
				// now going to check to see if we just opened something or closed it
				var nextDivVisibility = $nextDiv.css("display");
				// if we closed something, then the h3's to all be normal and not active
				if (nextDivVisibility != "block") {
					$("h3.accordionTitle").removeClass("inActive");
					$("h3.accordionTitle").removeClass("active");
				}	
			});
		}
		// ----------------------------------
	});	
	
	// ----------------------------------
	// to close the open div
	// ----------------------------------
	$("a.collapselink").click(function() {
		// travserse the DOM to find the div you want to close
		var $collapseThis = $(this).parent().parent().parent();
		// run the close up thing
		$collapseThis.slideUp("slow");
		// dump those classes
		$("h3.accordionTitle").removeClass("inActive");
		$("h3.accordionTitle").removeClass("active");
	});

}


// 1312 - a reworking of the s50 one
function accordionisep() {
	// hide the accordion things on load - this might cause a flash. If so manually put an inline style on the elements
	// <div class="accordionListContent" style="display: none;">...
	$('.accordionListContent').hide(); 	

	$("p.accordionTitle").hover(function() {
		// add class on roll over
		$(this).addClass("hover");
	},function(){
		// remove it on roll off
		$(this).removeClass("hover");
	});	

	// the accordion stuff, fires when you click a h3 with class "accordionTitle"
	$('p.accordionTitle').click(function() {
		// this looks at what the next thing is in the html to the h3, its always gonna be a div for us
		var $nextDiv = $(this).next();
		// looks to see if the next thing is visible or not - checked in a bit
		var $visibleSiblings = $nextDiv.siblings('div:visible'); 
		// i like $$ = $(this) as short hand
		var $$ = $(this);
		
			// ----------------------------------
			// this series of stuff formulates an anchor to add to the h3 so we can move the page to top of the newly opened div
			// set the flag below to false if you dont want this to happen
			// ----------------------------------
			var doAnchors = true; //set to false if you dont want the anchors to be active
			
			if (doAnchors) {
				// grabbing the html content
				var thisHtml = $$.html();
				// keeping a record of what it was before, so I can remove the anchor later (so every click doesnt add more and more of them)
				var originalHtml = thisHtml;
				// replaceOutSpaces and ampersands to make it easier for bad browsers
				thisHtml = replaceAll(thisHtml, " ", "");
				thisHtml = replaceAll(thisHtml, "&amp;", "");		
				thisHtml = replaceAll(thisHtml, "'", "");		
				// the anchor link itself
				var anchorLink = '<a name=title-' + thisHtml + ' id=title-' + thisHtml + '></a>';
				// then but it before the content of the h3's (so ends up <h3><a name=...></a></h3>
				$$.prepend(anchorLink);
			}
			// ----------------------------------
			
		
			//----------------------------------
			// wanna highlight this one as active when you clicked it?
			// write a css style for h3.active
			// ----------------------------------
			// make all the h3s grey on click
			$("p.accordionTitle").removeClass("active");
			// except the one we just clicked
			$$.addClass("active");
			// ----------------------------------
			
			//----------------------------------
			// wanna make the other titles do something when you have a div open?
			// write a css style for h3.inActive
			// ----------------------------------
			// make all the h3s grey on click
			$("p.accordionTitle").addClass("inActive");
			// except the one we just clicked
			$$.removeClass("inActive");
			// ----------------------------------
		
		
		// ----------------------------------
		// this is the bit that does the moving around of the divs
		// ----------------------------------
		if ($visibleSiblings.length ) {
			// if there is something thats been forced to visible that we need to close to open our new one
			// essentially tests the array of $visibleSiblings to see if its something and not nothing (arrays ftw)
			$visibleSiblings.slideUp('slow', function() {
			// on finish of slideing up the old one, slide down the next (the nesting of jquery functions creates odd code)
				$nextDiv.slideToggle('slow', function() {
					// and when this has done its slide
					// if we're doing anchors, move the window to this h3's new anchor
					if (doAnchors) {
						window.location = "#title-" + thisHtml;
						// then remove the new anchor (so as not to leave the DOM messy)
						$$.html(originalHtml);
					}
				});
		  });
		} else {
			$nextDiv.slideToggle('slow', function() {
				// hide or show whatever
				// if we're doing anchors, move the window to this h3's new anchor
				if (doAnchors) {
					window.location = "#title-" + thisHtml;
					// then remove the new anchor (so as not to leave the DOM messy)
					$$.html(originalHtml);
				}
				// now going to check to see if we just opened something or closed it
				var nextDivVisibility = $nextDiv.css("display");
				// if we closed something, then the h3's to all be normal and not active
				if (nextDivVisibility != "block") {
					$("p.accordionTitle").removeClass("inActive");
					$("p.accordionTitle").removeClass("active");
				}	
			});
		}
		// ----------------------------------
	});	
	
	// ----------------------------------
	// to close the open div
	// ----------------------------------
	$("a.collapselink").click(function() {
		// travserse the DOM to find the div you want to close
		var $collapseThis = $(this).parent().parent().parent();
		// run the close up thing
		$collapseThis.slideUp("slow");
		// dump those classes
		$("p.accordionTitle").removeClass("inActive");
		$("p.accordionTitle").removeClass("active");
	});

}