jQuery(document).ready(function() {
	
	// Select every element matching the class "t41_slide_toggle"
	jQuery('.t41_slide_toggle').each(function () {

		// Check whether default status is open or closed
		status = (jQuery(this).attr('class').search(/close/) != '-1') ? false : true;
		// Store the current status on the toggle element
		jQuery(this).data('status', {open: status});
		id = jQuery(this).attr('id');
		
		// If default status wasn't "open"
		if (status == false) {
			// Close the content element
			jQuery('#' + id + '_content').slideUp('fast');
			// Switch the background-image from open to closed
			imgsrc = jQuery(this).css('background-image').replace('_open', '_close');
			jQuery(this).css('background-image', imgsrc);
		}
	});
	
	// On Click
	jQuery('.t41_slide_toggle').click(function () {
		id = jQuery(this).attr('id');
		// Get current background-image source URL
		imgsrc = jQuery(this).css('background-image');
		// Get current status in the datastore
		status = jQuery(this).data('status').open;
		// Toggle slider
		jQuery('#' + id + '_content').slideToggle("slow", function () {
			// Switch status
			jQuery('#' + id).data('status').open = status ? false : true;
			// Switch background-image source URL
			newsrc = status ? imgsrc.replace('_open', '_close') : imgsrc.replace('_close', '_open');
			jQuery('#' + id).css('background-image', newsrc); 
		});
	});
	
});

/*
<div id="{{ID}}_wrapper">
	<a id="{{ID}}" class="t41_slide_toggle [open|close]" style="background-image: url([open|close])">{{TITLE}}</a>
	
	<div id="{{ID}}_content" class="t41_slide_content">
		{{CONTENT}}
	</div>
</div>
*/