﻿// jQuery object to collpase/expand a text section.  Will place the 
// element used to click in the prior element.
//
// Typical Use:
// <div>Some Text that is always displayed and will include the click element.</div>
// <div class="content-show-hide">This is the section that will hide/expand</div>
//
// $('.content-show-hide').contentExpand();
//
(function ($) {
	$.fn.contentExpand = function (options) {
		var o = $.extend({}, $.fn.contentExpand.defaults, options);

		return this.each(function (index) {
			var $$ = $(this);

			// turn off the content by default by adding a class that uses CSS display: none
			//
			$$.addClass("expander");

			// add the click elements to the previous element
			//
			var s = $(document.createElement('span'))
				.html(o.moreText)
				.addClass('expand-click')
				.appendTo($$.prev())
				.click(function () {
					if ($(this).html().indexOf(o.moreText) >= 0) {
						$(this).parent().next().slideDown(500);
						$(this).css('background-position', 'left -18px').html(o.lessText);
					}
					else {
						$(this).parent().next().slideUp(500);
						$(this).css('background-position', 'left 0px').html(o.moreText);
					}
				});
		});
	};
	$.fn.contentExpand.defaults = {
		moreText: 'more',
		lessText: 'less&nbsp;&nbsp;'
	};
})(jQuery);

