$(document).ready(function(){
	$('.accContainer').Accordion();		
});

(function($){
$.fn.Accordion = function(params){
	var defaults = {  
		acc: null,           /* Stores a pointer to the the accordion element */  
		contents: null,            /* Array of pointers to the headings and content panes of the accordion */  
		options: null,             /* Allows user to define the names of the css classes */  
		maxHeight: 0,              /* Stores the height of the tallest content pane */  
		current: null,             /* Stores a pointer to the currently expanded content pane */  
		toExpand: null,            /* Stores a pointer to the content pane to expand when a user clicks */  
		isAnimating: false         /* Keeps track of whether or not animation is currently running */  
	},  
	intialize = function(id, defaultExpandedCount){
		if($(id).length < 1) throw("Attempted to initalize accordion  failed.");  
		defaults.acc = $(id);  
		defaults.options = {  
			toggleClass: "accordion-toggle",  
			toggleActive: "accordion-toggle-active",  
			contentClass: "accordion-content"  
		}  
		defaults.contents = $('div.' + defaults.options.contentClass);  
		defaults.isAnimating = false;  
		defaults.current = defaultExpandedCount ? defaults.contents.eq(defaultExpandedCount-1) : defaults.contents.eq(0);  
		defaults.toExpand = null;  
		checkMaxHeight();  
		initialHide();  
		attachInitialMaxHeight();  
		//var clickHandler =  this.clickHandler.bindAsEventListener(this);  
		defaults.acc.find('div.accordion-toggle').bind('click', handleClick);  
	},
	readXML = function(container){
			//read xml file and generate html contents
	$.ajax({
		url: "accordion.xml",
		dataType: ($.browser.msie) ? "text" : "xml",
		success: function(data){
			var xml;
			if (typeof data == "string") {
				xml = new ActiveXObject("Microsoft.XMLDOM");
				xml.async = false;
				xml.loadXML(data);
			} else {
				xml = data;
			}
			// Returned data available in object "xml"
			//create accordion html
			$('accordion', xml).each(function(){
				var heading = $('heading', this).text();
				var subHead = $('subHead', this).text();
				var img = $('img', this).text();
				var text = $('text', this).text();
				var linkLoc = $('linkLoc', this).text();
				var linkText = $('linkText', this).text();
				
				$('div.accContainer').append('<div class="accordionBlock"><div class="accordionHeader"><div class="accordion-toggle">' + '<h3 class="heading">' +  heading + '</h3>' + '<h4 class="subHeading">' + subHead + '</h4></div><div class="accordion-content"><img src="' + img + '" alt="Img" /><div class="accordionText"><p class="text">' + text + '</p><p class="link"><a href="' + linkLoc + '">' + linkText + '</a></p></div></div></div>');						
				
			});
			
			//set the defaul height from xml file
			var h = $('accordionHeight', xml).text();
			defaults.maxHeight = h/1;
			intialize(container, 1);
	   }
 	}); 		

	},
	checkMaxHeight = function(){
		defaults.contents.each(function(){
			if($(this).height() > defaults.maxHeight) {  
				defaults.maxHeight = $(this).height();  
			}  
		});  
		defaults.maxHeight += 5;
		//alert(defaults.maxHeight);
	},         /* Determines the height of the tallest content pane */  
	initialHide = function(){
		defaults.contents.each(function(){
			if(this != defaults.current[0]){
				$(this).hide();
				$(this).css('height', '0px');
			}
		});
	},            /* Hides the panes which are not displayed by default */  
	attachInitialMaxHeight = function(){
		defaults.current.prev().attr('id', defaults.options.toggleActive);  
		if(defaults.current.height() != defaults.maxHeight) defaults.current.css({height: defaults.maxHeight+"px"});  
	}, /* Ensures that the height of the first content pane matches the tallest */  
	expand = function(el){
		defaults.toExpand = el.next();
		if(defaults.current[0] != defaults.toExpand[0]){  
			defaults.toExpand.show();  
			animate(el);  
		}  
		//alert('exp');
	},               /* Tells the animation function which elements to animate */  
	animate = function(el){
		el.next().show();
		var div = 'div#' + defaults.options.toggleActive;
		$(div).attr('id', '').next().animate({
			height: 0,
			opacity: 0
		}, { duration: 500,
		step: function(now, fx){
			var h, o;
			if(fx.prop == 'height'){
				h = defaults.maxHeight - now;
				el.next().css({height: h + 'px'});
			}
			if(fx.prop == 'opacity'){
				o = 1 - now;
				el.next().css({opacity: o});
			}
			
		}});
		
		el.attr('id', defaults.options.toggleActive);
		defaults.current = el;
	},                /* Performs the actual animation of the accordion effect */  
	handleClick = function(e){
		var el = $(this);
		if(el.hasClass(defaults.options.toggleClass) && !defaults.isAnimating) {  
			expand(el);  
		}  		
	}            /* Determine where a user has clicked and act based on that click */  
	
	return this.each(function(){
		readXML(this);							  
		//intialize(this, 1);					  
	});
}
})(jQuery);