// new.medcompnet.com/js/products.js

//call activate_section('section abbrev'); once from below the tab links as page loads
function activate_section(section) {
	var tab = document.getElementById('tab_'+section);
	tab.id = tab.id+'_active';
	tab.href = 'javascript:void(1);';
	document.body.id = section;	//activate css styles
}


//initiate layout elements which must be scoped globally for the below functions
var tabsLoaded = 0;
var productContentDiv = {};
var productDivTable = {};	//TABLE containing content DIVs and tab links
var productFeaturesCell = {};	//TD containing the content DIVs
var productBtnsCell = {};	//TD container for horizontal tabs affected by the below functions
var productDivHeight = 0;	//starting height of DIVs within the table, not including tab buttons beneath
var productFlashDiv = {};	//DIV element containing Flash movie
function initProductLayout() {
	productContentDiv = document.getElementById('productContentDiv');
	if(productContentDiv == null) { return }
	productDivTable = document.getElementById('div_table');
	productBtnsCell = document.getElementById('buttons_cell');
	productFeaturesCell = document.getElementById('features_cell');
	if(productFeaturesCell == null) { return }
	productFlashDiv = document.getElementById('productFlashDiv');
	
	//make sure div_table's containing DIV is a fixed height:
	productContentDiv.style.height = productDivTable.offsetHeight +'px';
	productDivHeight = productFeaturesCell.offsetHeight - 24;	//CSS padding values
	
	//tell the tab() function it's ok to work now :)
	tabsLoaded = 1;
}
onload_list.push("initProductLayout()");
//consider moving this call to a script tag below the Flash product image DIV


//open correct tab if page is called with a hash link on the end, i.e. page.html#videos//
function jumpTab() {
	var x = location.hash.replace(/^#/,'');
	var myTab = '';
	if(x.indexOf('featur') == 0) {
		myTab = 'features';
	} else if(x.indexOf('order') == 0) {
		myTab = 'ordering';
	} else if(x.indexOf('pdf') == 0 || x.indexOf('brochure') == 0) {
		myTab = 'pdf';
	} else if(x.indexOf('video') == 0) {
		myTab = 'videos';
	} else if(x.indexOf('ifu') == 0) {
		myTab = 'ifu';
	}
	if(myTab != '') {
		tab(document.getElementById(myTab));
	}
}
onload_list.push("jumpTab()");


//Change the active product tab (not product section tab) and show/hide/animate the correct layer
var productActiveClassName = 'active';
var productInactiveClassName = 'hidden';
var productActiveLink = {};
var productNewLink = {};
var productActiveDiv = {};
var productNewDiv = {};
var expandingDivs = /(videos|pdf|ifu)(_div)?/;	//name DIVs to animate in & out via function toggleExpand
function tab(linkObj) {
	if(!tabsLoaded) { return }
	var newHash = (linkObj.id == 'pdf')? 'brochures' : linkObj.id;
	document.location.hash = newHash;
	//document.location.search = '';
	productNewLink = linkObj;
	productNewDiv = document.getElementById(linkObj.id+'_div');
	var containerId = productBtnsCell.id; //or linkObj.offsetParent.id <- was not always working in Firefox
	//alert('containerId: '+containerId);
	//find the currently active link within the same container as caller link
	for(i in document.links) {
		var a = document.links[i];
		if(a.offsetParent != undefined && a.offsetParent.id == containerId && a.className == productActiveClassName) {
			productActiveLink = a;
			productActiveDiv = document.getElementById(a.id+'_div');
			break;
		}
	}
	//alert('link: '+productActiveLink.id +', div: '+ productActiveDiv.id);
	if(productActiveLink.id == linkObj.id) {
		return; /*This tab is already active, matching div is already open */
	}
	
	var finishEvent = "tabFinish();";
	
	if(expandingDivs.test(productActiveLink.id)) {	//alert('about to pull up link: '+ productActiveLink.id);
		if(expandingDivs.test(linkObj.id)) {
			finishEvent += " toggleExpand('"+ linkObj.id +"_div', 'drop_down');";
		}
		toggleExpand(productActiveLink.id +'_div', 'pull_up', finishEvent);
	} else {
		eval(finishEvent);
	}
	if(expandingDivs.test(linkObj.id) && !(expandingDivs.test(productActiveLink.id))) {	//alert('about to drop down: '+ linkObj.id);
		toggleExpand(linkObj.id +'_div', 'drop_down');
	}
}

function tabFinish() {	//alert('tabFinish, deactivating: '+productActiveDiv.id+ 'and activating: '+productNewLink.id);
	productActiveLink.className = '';
	productNewLink.className = productActiveClassName;
	productActiveDiv.className = productInactiveClassName;
	productNewDiv.className = productActiveClassName;
	if(IE6) {//Force a redraw of elements within the affected tab. Only needed in IE6, afaik.//
		var containerIndex = 0; var endingIndex = 0; var els = 0;
		for(var i=0; i<document.all.length; i++) {
			el = document.all[i];
			if(el.id == productNewDiv.id) {
				containerIndex = i;
				//alert('container is: '+ productNewDiv.id +' at index '+ i);
			}
			if(containerIndex > 0 && i > containerIndex) {
				el.style.display = 'none';
				els++;//var redrawFix = elm.offsetHeight;
				el.style.display = 'inline-block';
			}
			if(el.id == 'productFlashDiv') {
				endingInex = i;
				//alert('productFlashDiv index is: '+ i +' with '+ els +' elements contained.');
				break;
			}
		}
	}
}

/*Pull up or drop-down animate the videos div before/after activating that tab.
direction == 'pull_up' || 'drop_down'
evt = function(){whatever to do after animation completes}*/
var toggleExpandPlayers = 0;	//so we don't start a second loop before the first one finishes
var thumb_counts = {			//how many PDF thumbnails appear in the pdf_div and ifu_div layers
	pdf_div:{thumbsPerRow:2, maxRows:3, thumbCount:0, firstNodeIndex:'', scroller:{}},
	ifu_div:{thumbsPerRow:1, maxRows:3, thumbCount:0, firstNodeIndex:'', scroller:{}}
};
var thumbsCounted = false;		//so we only iterate through the thumbnails once
var thumbHeight = 65;			//how much vertical space to use for each row, in pixels
var showFirstThumb = 0;			//Set to 1 from main page to toggle open the first PDF thumbnail in a Brochures or IFUs tab.
function toggleExpand(div_id, direction, evt) {
	var toggle_div = document.getElementById(div_id);	//Video player or PDF div layer
	
	var start = toggle_div.style.height.replace(/px$/,'') || productDivHeight;
	var finish = (direction == 'drop_down')? ((div_id == 'videos_div')?275:225) : productDivHeight;
	var startOpacity = (direction == 'drop_down')? 0 : 100;
	var finishOpacity = (direction == 'drop_down')? 100 : 0;
	var animationTime = (direction == 'drop_down')? 700 : 300;
	var eventString = evt;
	if(div_id == 'videos_div') {
		var flashEvent = (direction == 'drop_down')? 'playVideo()' : 'stopVideo()';
		if(direction == 'drop_down' && VAR.video != undefined) {
			eventString = "tellFlash('video_swf','changeVideo(\\\'"+VAR.video+"\\\')'); "+ eventString;
			var vidList = document.videos_form.videos_list;
			for(var i=0; i<vidList.length; i++) {
				vidList[i].selected = (vidList[i].value == VAR.video)? true : false;
			}
		}
		eventString = "tellFlash('video_swf','"+ flashEvent +"'); "+ eventString;
	} else if(expandingDivs.test(div_id) && direction == 'drop_down') {
		//it's either pdf_div or ifu_div, so calculate a new finish height
		var thumb_divs = document.getElementsByName('resource_div');
		
		if(IE) {//see: http://webbugtrack.blogspot.com/2007/08/bug-411-getelementsbyname-doesnt-work.html
			thumb_divs = new Array();
			var divTags = document.getElementsByTagName('div');
			for(var d=0; d<divTags.length; d++) {
				if(divTags[d].name == 'resource_div') {
					thumb_divs.push(divTags[d]);
				}
			}
		}
		
		if(!thumbsCounted) { //alert('thubs not counted. Counting now...');
			for(var i=0; i<thumb_divs.length; i++) {//alert('counting thumb_divs '+i+' of '+ thumb_divs.length);
				var thumbId = thumb_divs[i].id;
				var whichDiv;
				var nodeString = '.parentNode';
				PARENTS: while(1) {//alert('doing PARENTS: while loop');
					nodeString += '.parentNode';
					whichDiv = eval("document.getElementById('"+ thumbId +"')"+ nodeString);
					
					if(whichDiv.id != '') {//alert('breaking loop');
						break PARENTS;
					}
				}
				thumb_counts[whichDiv.id].thumbCount ++;
				if(thumb_counts[whichDiv.id].firstNodeIndex == '') {
					thumb_counts[whichDiv.id].firstNodeIndex = i;
					thumb_counts[whichDiv.id].scroller = thumb_divs[i].parentNode;
				}
			}
			thumbsCounted = true;
			//alert('div '+ div_id +' has '+ thumb_counts[div_id].thumbCount +' thumbs');
		}
		
		//If there is only one thumbnail in the set, or showFirstThumb is true, expand it.
		if(thumb_counts[div_id].thumbCount == 1) {// || showFirstThumb == 1
			//showFirstThumb = 0;
			var detail_id = String(thumb_divs[thumb_counts[div_id].firstNodeIndex].id).replace(/_div$/, ''); //id20100510105700_div
			//debug('adding to event string: '+ eventString);
			eventString = ((eventString == undefined)? '': eventString.replace(/\;\s+$/, "; ")) + "toggleDetails('"+detail_id+"', 'details');";
		}
		
		var rowCount = Math.round(thumb_counts[div_id].thumbCount / thumb_counts[div_id].thumbsPerRow);
		rowCount = (rowCount == 0)? 1 :
			(rowCount > thumb_counts[div_id].maxRows)? thumb_counts[div_id].maxRows : rowCount;
		var scrollerHeight = thumbHeight * rowCount;
		scrollerHeight = (scrollerHeight < 110)? 110 : scrollerHeight;
		
		//set hight of the appropriate scroller div
		if(!thumb_counts[div_id].scroller.style) {
			thumb_counts[div_id].scroller = document.getElementById(div_id);
		}
		thumb_counts[div_id].scroller.style.height = scrollerHeight +'px';
		if(thumb_counts[div_id].scroller.offsetTop > 24) {
			finish = scrollerHeight + 24;
		} else {
			finish = scrollerHeight + thumb_counts[div_id].scroller.offsetTop;	//-24px in CSS padding?
		}
	//alert('finish:'+finish+', scrollerHeight:'+scrollerHeight+', thumbHeight:'+thumbHeight+', rowCount:'+rowCount+', scroller offsetTop:'+thumb_counts[div_id].scroller.offsetTop);
		finish = (finish < productDivHeight)? productDivHeight : finish;
		animationTime = (rowCount/thumb_counts[div_id].maxRows) * animationTime;
		//alert('rowCount:'+rowCount+'/maxRows:'+thumb_counts[div_id].maxRows+'*time:'+animationTime);
	}
	
	if(direction == 'drop_down') {
		toggleExpandPlayers++;
		if(toggleExpandPlayers == 1) {
			with(productDivTable.style) {
				position = 'absolute';
				width = document.getElementById('b2').offsetWidth + document.getElementById('b3').offsetWidth +'px';
			}
		}
	} else {
		eventString = "toggleExpandFinish(); "+ eventString;
	}
	//alert('calling easeOut('+toggle_div+', height, '+start+', '+finish+', '+animationTime+', '+15+', '+eventString+');');
	if(IE) {
		eventString = "document.getElementById('"+div_id+"').style.position=''; "+ eventString;
	}
	easeOut(toggle_div, 'height', start, finish, animationTime, 15, eventString);
	if(!IE) {//opacity filter in IE creates jagged edges on bold text and PNG image translucency
		easeOut(toggle_div, 'opacity', startOpacity, finishOpacity, animationTime, 15);
	//	debug(toggle_div.id +', start: '+ startOpacity +', finish: '+ finishOpacity);
	}
}
function toggleExpandFinish() {	//alert('toggleExpandFinish');
	toggleExpandPlayers = (toggleExpandPlayers <= 0)? 0 : toggleExpandPlayers--;
	if(toggleExpandPlayers == 0 && productDivTable) {
		with(productDivTable.style) {
			position = '';
			width = '';
		}
	}
}

function download_video(prefix) {
	var resource_filename = document.videos_form.videos_list.value;
	var resource_id = video_id[resource_filename][prefix];
	var brand_name = resource_filename.replace(/_(insertion|animation)\.(f4v|wmv|mov)$/, "");
	brand_name = brand_name.replace(/_/g, " ");
	resource_filename = resource_filename.replace(/\.f4v$/, '.'+prefix);
	//alert('resource_id: '+ resource_id+', file: '+ resource_filename);
	//download(resources,as,zip,targ,dialog)
	download(resource_id,resource_filename,0,0,1,'popup',{'brand_name':brand_name,'part_number':resource_id});
}

function hideTab(id) {
	if(id == 'ifu' || id == 'pdf') {
		document.getElementById(id).style.display = 'none';
	}
}