/******************
hforbes 25/11/2011

Simple dropdowns widget
Call this on a container div, likely $('.dropdowns').rsaDropDowns();
Expected markup:

<div class="dropdowns">
 <div>
  <h4>Title</h4>
  <whatever content>
 </div>
 <div>
  <h4>Title2</h4>
  <whatever content>
 </div>
</div>

********/
(function( $ ){
	$.fn.rsaDropDowns = function() {
		return this.each(function() {
			//add enable class to activate css that is only relevant if js is on
			$(this).addClass('enabled');
		
			$(this).children('div').each(function(){
				var div = $(this);
				var header = div.children('h4').first();
				var contents = div.contents();
				//move current contents into a hidden wrapper div
				var inner = $('<div class="inner"/>').hide().appendTo(div).append(contents);
				//move header outside the wrapper and add click event handler 
				header.prependTo(div).click(function(e){
					$(this).toggleClass('open').siblings('div.inner').toggle();
				});
			});

			//open the first section
			$(this).children('div').first().children('h4').addClass('open').siblings('div.inner').show();
		});
	};
})( jQuery );