/*
	 * HEADINGS MUST BE <li><h3>headingtext</h3></li>
	 * IMAGES MUST BE CALLED #image-1, #image-2, #image-3, etc
	 *
	 * EACH HEADING MUST HAVE AN INDIVIDUAL IMAGE
	 *
	 */
	
	var imageHeadings;
	var numHeadings;
	var parentAccordion
	
	function setupCustomHeadings() {
		// setup vars
		imageHeadings = new Array();
		
		// setup accordion
		parentAccordion=new TINY.accordion.slider("parentAccordion");
		parentAccordion.init("acc","h3",1,-1,"selected-acc");
		setupHeadings();
		
		// show first img
		changeToImage(0);
	}
	
	function changeToImage(image) {
		hideImages();
		showImage(image);
	}
	
	function hideImages() {
		for(var i = 0; i <= numHeadings; i++) {
			$("#image-" + (i)).hide();//i+1
		}
	}
	
	function showImage(image) {
		$("#image-" + image).show();
	}
	
	function setupHeadings() {
		
		numHeadings = 0;
		
		// for each h3		
	  	$(".acc h3").each( function() { 
			
			numHeadings++;
			
			var newText = $(this).find(".accordion-read-more").parent().text();
			imageHeadings.push(newText);
	  
	  		// setup hover
			$(this).hover( function() {
					$(this).css({'color': '#cdcd00','border-bottom': '1px solid #cdcd00'});
				}, function() {
					$(this).css({'color': '#878585','border-bottom': '1px solid #878585'});
			});
		  
		  
		  	// setup click toggle
			$(this).click( function() {
				// find the current READ MORE section
				var currentHTML = $(this).find(".accordion-read-more");
				
				// set other (now closed) heading text to READ MORE
				$(".acc h3").not($(this)).find(".accordion-read-more").html("read more &raquo;");
				
				// set other headings to grey
				$(".acc h3").not($(this)).css({'color': '#878585','border-bottom': '1px solid #878585'});
				
				// set other headings to grey/green hover
				$(".acc h3").not($(this)).hover( function() {
					$(this).css({'color': '#cdcd00','border-bottom': '1px solid #cdcd00'});
				}, function() {
					$(this).css({'color': '#878585','border-bottom': '1px solid #878585'});
				});
					
				var currentText = currentHTML.html();		// get current "read more" text
				
				// if text is "read more"	
				if(currentText.indexOf("read more") != -1) {
					
					// find current text
					var s = currentHTML.parent().text();

					// find which heading this is, and change to the correct image
					for(var j = 0; j < numHeadings; j++) {
						if(s.indexOf(imageHeadings[j]) != -1) {
							changeToImage(j+1);
						}
					}
					
					currentHTML.html("&laquo; collapse");
					currentHTML.parent().css({'color': '#cdcd00','border-bottom': '1px solid #cdcd00'});
					
					currentHTML.parent().hover( function() {
						$(this).css({'color': '#cdcd00','border-bottom': '1px solid #cdcd00'});
					}, function() {
						$(this).css({'color': '#cdcd00','border-bottom': '1px solid #cdcd00'});
					});
				}
				
				// else if text is "collapse"
				else if(currentText.indexOf("collapse") != -1) {
					currentHTML.html("read more &raquo;");
					currentHTML.parent().css({'color': '#878585','border-bottom': '1px solid #878585'});
					
					currentHTML.parent().hover( function() {
						$(this).css({'color': '#878585','border-bottom': '1px solid #878585'});
					}, function() {
						$(this).css({'color': '#878585','border-bottom': '1px solid #878585'});
					});
				}
				
			});
		});
	}