﻿jQuery().ready(function()
{
	var charCount = 0;
	var breakElement;

	var readMore = jQuery('<div id="expandable"><div class="more-button">Read More</div></div>');

	//wrap any text blocks with a <span> tag so we can treat them as elements
	jQuery('#CaseStudy').contents().filter(function()
	{
		return this.nodeType == 3;
	}).wrap('<span></span>');

	//grab all elements after the .section element
	var contentElements = jQuery('#CaseStudy .section').nextAll();
	contentElements.each(function()
	{
		var contentElement = jQuery(this);
		var text = contentElement.text();
		charCount += text.length;

		if (charCount >= 1500)
		{
			breakElement = contentElement;
			return false;
		}
	});

	if (breakElement != null)
	{
		var hiddenElements = breakElement.nextAll();
		hiddenElements.wrapAll('<div class="hiddenElements" />');
		hiddenElements = jQuery('#CaseStudy .hiddenElements').hide();

		readMore.insertAfter(breakElement);
		readMore.click(function()
		{
			//For some reason, in IE8 if we hide the readMore element after showing the hiddenElements, the hiddenElements content would sometimes look 'compressed'.
			//However, if we hide the readMore element before showing the hiddenElements, the hiddenElements content seems to consistently display properly.
			readMore.hide();
			hiddenElements.show();
		});
	}
});

