// foldable-headings.js


insertStylesheet( "../css/foldable-headings.css" );


function addClass( element, className )
{
	var space = element.className == "" ? "" : " ";
	
	element.className += space + className;
}

function removeClass( element, className )
{
	// Pad with trailing space
	var temp = element.className + " ";
	
	// Remove name and subsequent space
	temp = temp.replace( new RegExp( "\\b" + className + " " ), "" );
	
	// Remove trailing space
	element.className = temp.replace( / $/, "" );
}

function replaceClass( element, oldClass, newClass )
{
	element.className = element.className.replace( new RegExp( "\\b" + oldClass + "\\b" ), newClass );
}

function isEndOfHeading( next, level )
{
	return    next == null
	       || (    next.nodeName[0] == 'H'
	            && (    next.nodeName[1] == 'R'
	                 || next.nodeName[1] <= level ) );
}

function foldHeading()
{
	var heading = this;
	
	var level = heading.nodeName[1];
	
	var parent = heading.parentNode;
	
	var innerDiv = document.createElement( 'div' );
	
	innerDiv.className = 'folded-content';
	
	while ( !isEndOfHeading( heading.nextSibling, level ) )
	{
		var next = heading.nextSibling;
		
		parent.removeChild( next );
		
		innerDiv.appendChild( next );
	}
	
	parent.insertBefore( innerDiv, heading.nextSibling );
	
	heading.onclick = unfoldHeading;
	
	//removeClass( heading, 'unfolded' );
	addClass( heading, 'folded' );
}

function unfoldHeading()
{
	var heading = this;
	
	var parent = heading.parentNode;
	
	var innerDiv = heading.nextSibling;
	
	while ( innerDiv.childNodes.length > 0 )
	{
		var next = innerDiv.firstChild;
		
		innerDiv.removeChild( next );
		
		parent.insertBefore( next, innerDiv );
	}
	
	parent.removeChild( innerDiv );
	
	heading.onclick = foldHeading;
	
	removeClass( heading, 'folded' );
}

function makeHeadingFoldable( heading )
{
	heading.onclick = foldHeading;
	heading.className += " foldable-item";
}

function enrichHeadingsOfLevel( level )
{
	var tagName = 'h' + level;
	
	var headings = document.getElementsByTagName( tagName );
	
	for ( var i = 0;  i < headings.length;  ++i )
	{
		makeHeadingFoldable( headings[ i ] );
	}
}

function enrichHeadings()
{
	// h5 and h6 are not foldable
	for ( var i = 1;  i <= 4;  ++i )
	{
		enrichHeadingsOfLevel( i );
	}
}

window.addEventListener( 'load', enrichHeadings, false );