// JavaScript Document

var rs_container_id = 'CollapsablesContainer';	// id of container element for all collapsable sections
var rs_prefix 		= 'RightSection';			// prefix of every collapsable section
var rs_spr 			= '_';						// separator used in id of collapsable section, RightSection_1_collapsed
var type_collapsed 	= 'collapsed';				// flag string in section id, used at blocks displayed at collapsed phase
var type_expanded 	= 'expanded';				// flag string in section id, used at blocks displayed at expanded phase
var rs_title_img_over_suffix = '_over';			// string at the end of img file of section title at over phase

var rs_sections_count = 4;						// number of collapsable sections
var rs_active_section_id = 1;					// default active section


// unobtrusive attaching of event handlers to collapsable sections
addEvent(window, 'load', add_events_temp);

function add_events_temp ()
{
 for (i=1; i<=rs_sections_count; i++)
 	{
	 eval ("addEvent(document.getElementById('RightSection_"+i+"_collapsed'), 'click', toggleCollapsable);");
	 eval ("addEvent(document.getElementById('RightSection_"+i+"_collapsed'), 'mouseover', swapTitleImg);");
	 eval ("addEvent(document.getElementById('RightSection_"+i+"_collapsed'), 'mouseout', swapTitleImg);");
	}
}


/**
 * Function for toggling collapsable sections
 * When collapsed section is clicked on it gets expanded
 * and previously opened/expanded one gets collapsed.
 */
function toggleCollapsable(e)
{
 if (!e) var e = window.event;
 obj = findRStarget(getEventTarget(e));
 if (obj==false)
 	return;
 
 var temp = obj.id.split(rs_spr);
 var caller_id = temp[1];
 var caller_type = temp[2];
 
 if (caller_type==type_expanded || caller_id==rs_active_section_id)
 	{
	 return;
	}
 else
 	{
	 var previous_section = rs_prefix+rs_spr+rs_active_section_id+rs_spr;
	 var new_section = rs_prefix+rs_spr+caller_id+rs_spr;
	 document.getElementById(previous_section+type_expanded).style.display='none';
	 document.getElementById(previous_section+type_collapsed).style.display='block';
	 document.getElementById(new_section+type_collapsed).style.display='none';
	 document.getElementById(new_section+type_expanded).style.display='block';
	 rs_active_section_id = caller_id;
	}
}



/**
 * Function for swaping source file for image used as title of section in collapsed phase
 */
function swapTitleImg(e)
{
 if (!e) var e = window.event;
 targ = findRStarget(getEventTarget(e));
 if (targ==false)
 	return;
 
 var section_images = targ.getElementsByTagName('IMG');
 var title_img_obj = null;
 
 for (i=0; i<section_images.length; i++)
 	if (section_images[i].className.indexOf('rs_title')>=0)
		title_img_obj = section_images[i];
 
 if (title_img_obj==null)
 	return;
 
 var filename = title_img_obj.src.substring(0,(title_img_obj.src.length-4));
 var filename_clean = filename.replace(rs_title_img_over_suffix,'');
 var fileext = title_img_obj.src.substring(title_img_obj.src.length-4);
 
 if (e.type=='mouseover' && title_img_obj.src.indexOf(rs_title_img_over_suffix)<0)
	 title_img_obj.src = filename_clean + rs_title_img_over_suffix + fileext;
 else if (e.type=='mouseout' && title_img_obj.src.indexOf(rs_title_img_over_suffix)>=0)
	 title_img_obj.src = filename_clean + fileext;
}



/**
 * Function which finds proper collapsable section element
 * Because of bubbling of events often original event target is some child element, node,
 * of the real collapsable section element.
 * This function traverses up in the DOM hierarchy until it finds adequate element or until
 * it gets to container element for all collapsable sections.
 * Adequate collapsable element has id AAA_BBB_CCC where
 * AAA - prefix of every collapsable section, 'RightSection', defined at top of this file
 * BBB - number of section
 * CCC - type of section, collapsed or expanded, defined at top of this file
 * _ - separator used in id of collapsable section, defined at top of this file
 */
function findRStarget(targ)
{
 var target_found = false;
 
 while (target_found==false && targ.id!=rs_container_id)
 	{
	 temp = targ.id.split(rs_spr);
	 if (targ.nodeName.toLowerCase()=='div' && (temp.length==3 && temp[0]==rs_prefix && temp[2]==type_collapsed))
		target_found = true;
	 else
	 	targ = targ.parentNode;
	}
 
 if (target_found!=false)
 	return targ;
 else
 	return false;
}



/**
 * Function which adds event handler function to object without need for messing up html code
 *
 * @param obj string reference for object
 * @param evType string name of event for which we want to attach event handler function to this object
 * @param fn string name of function which will handle event passed as argument
 */
function addEvent (obj, evType, fn)
{
 if (!obj)
    return;
 
 if (obj.addEventListener)
 	{
 	 obj.addEventListener(evType, fn, false);
 	 return true;
 	}
 else if (obj.attachEvent)
 	{
 	 var r = obj.attachEvent("on"+evType, fn);
 	 return r;
 	}
 else
 	{
 	 return false;
 	}
}


function getEventTarget(e)
{
 // stoping bubbling of events
 e.cancelBubble = true;
 if (e.stopPropagation) e.stopPropagation();
 
 if (e.target) targ = e.target;
 else if (e.srcElement) targ = e.srcElement;
 if (targ.nodeType == 3) // defeat Safari bug
		targ = targ.parentNode;
 return targ;
}


function _show (msg)
{
 if (document.getElementById('_show'))
 	document.getElementById('_show').value = msg + "\n-------------\n" + document.getElementById('_show').value;
} 


// for use with inline js code
function toggleCollapsable_OLD(obj)
{
 if (obj=='' || obj==null || document.getElementById(obj.id)==null) return;
 
 var temp = obj.id.split(rs_spr);
 var caller_id = temp[1];
 var caller_type = temp[2];
 
 if (caller_type==type_expanded || caller_id==rs_active_section_id)
 	{
	 return;
	}
 else
 	{
	 var previous_section = rs_prefix+rs_spr+rs_active_section_id+rs_spr;
	 var new_section = rs_prefix+rs_spr+caller_id+rs_spr;
	 document.getElementById(previous_section+type_expanded).style.display='none';
	 document.getElementById(previous_section+type_collapsed).style.display='block';
	 document.getElementById(new_section+type_collapsed).style.display='none';
	 document.getElementById(new_section+type_expanded).style.display='block';
	 rs_active_section_id = caller_id;
	}
}