// ----------------------------------------
// menu - accordion
// Version 1.0.20090309.1
// Dwain Blazej Dwain.Blazej.Public@gmail.com

// Example init:
// menu_accordion.init('menu_accordion','News');
// menu_accordion.init('[HTML ID of div containing the menu]',[index of menu to start as expanded]);
//
// This script expects an element (such as in the header) name id="menu_accordion_expansion-[menu_name]"
// The script expects two image files with the same name except one name contains the string " - expanded" while the other contains the name " - collapsed".  Example HTML:
//	<img class="menu_accordion_expansion" id="menu_accordion_expansion-2009_Parmelee_Lectures" src="../asset/image/interface/icon - triangle - expanded - 11x11.gif" width="11" height="11" />
	//
// In document header include:
//	<script type="text/javascript">
	//	  document.write(unescape('%3Cstyle type="text/css"%3E#menu_accordion { display:none } .menu_accordion_header {cursor:pointer;}%3C/style%3E'));
//	</script>
	// this is so if JavaScript is enabled, then make the initial page load render hidden.  Let the JavaScript menu_accordion_accordion function initialize (collapse) the menu before making the menu visible.  This prevents the menu from showing then shrinking when the page is loaded.
//
// Bugs:
// Menu height should be recalculated on window resize.  Workaround: Reload page.



var menu_accordion=function(){
	// speed: larger number means *slower*.
	// timer:  the number of milliseconds (1/1000 of a second) to wait between menu silde animation frames.
	// animateP: Set to 'yes' for animation.
	var speed=2; var timer=42;
	animateP='yes'
	var aContentNames=[]; var menu_id;
	var js_file_name='menu - accordion.js';
	return{
		init:function(t,c){  // "c" string of default content to expand, empty string for none.
			var s,ds,l,i,eltExpansionIcon,header_name_tail; 
			// var header_index,
			menu_id=t;
			s=document.getElementById(t); ds=s.getElementsByTagName('div'); l=ds.length; i=y=0;
			var header_re = new RegExp('^'+t+'_header-(.+)$');
			for(i=0;i<l;i++){
				var d,did,section,x; d=ds[i]; did=d.id;
				if(did.indexOf('_header-')!=-1){
					// header_index++;
					d.onclick=new Function('menu_accordion.process(this)');
					header_name_tail=did.replace(header_re, '$1');
					// alert('header: '+header_name_tail+'\ndid: '+did);
				}else if(did.indexOf('_content-')!=-1){
					section=did.replace(menu_id+'_content-','');
					aContentNames.push(section);
					// alert('section: '+section);
					// Currently, each contents is assumed to have exactly one img elt with an expansion id.
					eltExpansionIcon=document.getElementById(menu_id+'_expansion-'+section);
					if (! eltExpansionIcon) { throw(js_file_name+': Failed to find expansion for \"'+section+'\"'); }
					// if(1){ alert('Begin:\n'+eltExpansionIcon.getAttribute('src')+'\n'+unescape(eltExpansionIcon.getAttribute('src')));}
					// if((c==header_index)||(c==header_name_tail)){
					if(c==header_name_tail){
						this.expansion(eltExpansionIcon,'expanded');
						d.style.display='block';
					}
					else{
						d.style.height='0px'; d.style.display='none';
						this.expansion(eltExpansionIcon,'collapsed');
					}
					// if(1){ alert('End:\n'+x.getAttribute('src')+'\n'+unescape(x.getAttribute('src')));}
				} 
			}

			// Once the visibility is setup, make the entire menu visible.
			s.style.display='block'
		},
		process:function(d){
			var cl,i; cl=aContentNames.length; i=0;
			for(i;i<cl;i++){
				var s,h,c,x,cd;
				s=aContentNames[i]; h=document.getElementById(menu_id+'_header-'+s);
				x=document.getElementById(menu_id+'_expansion-'+s);
				c=menu_id+'_content-'+s; cd=document.getElementById(c); clearInterval(cd.timer);
				if(h==d&&cd.style.display=='none'){
					this.expansion(x,'expanded');
					if(animateP=='yes') {
						cd.style.display='block';
						if(!cd.maxh){cd.style.height='auto'; cd.maxh=cd.offsetHeight; cd.style.height='0px'}
						this.islide(c,1);
					} else {
						cd.style.height='100%';
						cd.style.display='block';
					}
				}else if(cd.style.display=='block'){ 
					this.expansion(x,'collapsed');
					if(animateP=='yes') { 
						this.islide(c,-1);
					} else {
						cd.style.display='none';
					}
				}
			}
		},
		expansion:function(x,to){  // Changes the icon img src in elemnet "x" to the expansion status "to".
			var expansion_src;
			// On windows: systems the "src" attribute is URL escaped even when the source HTML is not.
			// On windows: "escape"ing  the "unescape"d string fails to produce the original URL.  
			// Work around by "unescape"ing but not re-"escape"ing. 
			expansion_src=unescape(x.getAttribute('src'));
			if(to=='expanded'){
				x.setAttribute('src', expansion_src.replace(/- collapsed( -|\.)([^\/]*)$/i, '- expanded$1$2'));
				//x.setAttribute('src', expansion_src.replace(/collapsed/, 'expanded'));
			}else if(to=='collapsed') {
				x.setAttribute('src', expansion_src.replace(/- expanded( -|\.)([^\/]*)$/i, '- collapsed$1$2'));
				//x.setAttribute('src', expansion_src.replace(/expanded/, 'collapsed'));
			} else {
				throw('menu - accordion: unrecognized expansion \"'+to+'\".');
			}
		},
		islide:function(i,d){var c,m; c=document.getElementById(i); m=c.maxh; c.direction=d; c.timer=setInterval("menu_accordion.slide('"+i +"')",timer)},
		slide:function(i){
			var c,m,h,dist; c=document.getElementById(i); m=c.maxh; h=c.offsetHeight;
			dist=(c.direction==1)?Math.round((m-h)/speed):Math.round(h/speed);
			if(dist<=1){dist=1}
			c.style.height=h+(dist*c.direction)+'px'; c.style.opacity=h/c.maxh; c.style.filter='alpha(opacity='+(h*100/c.maxh)+')';
			if(h<2&&c.direction!=1){
				c.style.display='none'; clearInterval(c.timer);
			}else if(h>(m-2)&&c.direction==1){clearInterval(c.timer)}
		}
	};}();