/*
File Name:  hotelProfile_Animation.js
Created By:  Andrew Marks
Created:  8/15/07

This is the javascript for all animations on the hotel profile page, including tab switching/fading,
expand/collapse on info boxes, the enlarge image functionality, switching/fading the large image for
the photo viewer and opening the ratings guide.
*/

//array of tab content area div IDs
var tabAreas = new Array();
tabAreas[0] = hotelCode + "_Overview";
tabAreas[1] = hotelCode + "_Rooms";
tabAreas[2] = hotelCode + "_DiningAndEntertainment";
tabAreas[3] = hotelCode + "_Activities";
tabAreas[4] = hotelCode + "_PhotosAndVideo";
if (showBookTab.toUpperCase() != "FALSE") {
	tabAreas[5] = hotelCode + "_Book Hotel";
}

//array of tab icon div IDs
var tabIcons = new Array();
tabIcons[0] = "OverviewTab";
tabIcons[1] = "RoomsTab";
tabIcons[2] = "DiningTab";
tabIcons[3] = "ActivitiesTab";
tabIcons[4] = "PhotosTab";
if (showBookTab.toUpperCase() != "FALSE") {
	tabIcons[5] = "BookTab";
}

function switchTab(inTabId, divId) {
	var totalTime = 400;	//Approximate time in milliseconds (varies by browser and CPU speed)
	var FPS = 30;		//Approximate frame rate for the animation (varies by browser and CPU speed)
	var delay = Math.round(1000 / FPS);
	var numFrames = Math.round(totalTime / delay * 1000) / 1000;
	
	var divFrom, divTo;
	var tabFrom, tabTo;
	
	//Find the div that's currently displaying
	for (i = 0; i < tabAreas.length; i++) {
		if (document.getElementById(tabAreas[i]).style.display == "block") {
			divFrom = document.getElementById(tabAreas[i]);
			break;
		}
	}
	
	//Find the div about to be displayed
	divTo = document.getElementById(divId);
	
	//Find the tab that's currently active
	for (i = 0; i < tabAreas.length; i++) {
		if (document.getElementById(tabIcons[i]).className == "HP_Tab_Active" || document.getElementById(tabIcons[i]).className == "HP_Tab_Active_Right" || document.getElementById(tabIcons[i]).className == "HP_BookTab_Active" ) {
			tabFrom = document.getElementById(tabIcons[i])
			break;
		}
	}
	
	//Find the tab about to be displayed
	tabTo = document.getElementById(inTabId);
	
	var currentOpacity
	var opacityIncrement
	if (navigator.appName == "Netscape") {
		opacityIncrement = 1 / numFrames;
		currentOpacity = 1;
	}
	if (navigator.appName == "Microsoft Internet Explorer") {
		opacityIncrement = 100 / numFrames;
		currentOpacity = 100;
	}
	
	//Hide the div currently displaying
	divFrom.style.display = "none";
	
	//Show the content div for the active tab (also show res tool if on Book Hotel tab)
	if (divTo != null) {
		divTo.style.display = "block";
		
		//Start with div faded out all the way
		if (navigator.appName == "Netscape") {
			var currentOpacity = 0;
			divTo.style.opacity = currentOpacity;
			fadeIn(divId, currentOpacity, opacityIncrement, delay);
		}
		if (navigator.appName == "Microsoft Internet Explorer") {
			var currentOpacity = 0;
			//9/20/07 APM - Start - Need to disable tab fading in IE to avoid strange print preview and printing bugs.
			//divTo.style.filter = "alpha(opacity=" + currentOpacity + ")";
			//fadeIn(divId, currentOpacity, opacityIncrement, delay);
			//9/20/07 APM - End
		}

		if (showBookTab.toUpperCase() != "FALSE") {
			var resToolDiv = document.getElementById(hotelCode + "_ResTool")
			if (resToolDiv != undefined) {
				if (inTabId == "BookTab") {
					resToolDiv.style.display = "block";
					//9/20/07 APM - Need to disable tab fading in IE to avoid strange print preview and printing bugs.
					//fadeIn(resToolDiv.id, currentOpacity, opacityIncrement, delay);
					if (navigator.appName == "Netscape") {
						fadeIn(resToolDiv.id, currentOpacity, opacityIncrement, delay);
					}
					//9/20/07 APM - End
				}
				else {
					resToolDiv.style.display = "none";
				}
			}
		}
	}
	
	//Deactivate the icon for the tab we came from
	if (tabFrom.className == "HP_Tab_Active") {
		tabFrom.className = "HP_Tab_Inactive";
	}
	if (tabFrom.className == "HP_Tab_Active_Right") {
		tabFrom.className = "HP_Tab_Inactive_Right";
	}
	if (tabFrom.className == "HP_BookTab_Active") {
		tabFrom.className = "HP_BookTab_Inactive";
		document.getElementById("BookTabLink").className = "HP_BookTabLink_Inactive";
	}
	
	//Activate the icon for the tab that was clicked
	if (tabTo.className == "HP_Tab_Inactive") {
		tabTo.className = "HP_Tab_Active";
	}
	if (tabTo.className == "HP_Tab_Inactive_Right") {
		tabTo.className = "HP_Tab_Active_Right";
	}
	if (tabTo.className == "HP_BookTab_Inactive") {
		tabTo.className = "HP_BookTab_Active";
		document.getElementById("BookTabLink").className = "HP_BookTabLink_Active";
	}
}

function fadeIn(divId, currentOpacity, opacityIncrement, delay) {
	var div = document.getElementById(divId);
	
	if (navigator.appName == "Netscape") {
		currentOpacity = Math.round((currentOpacity + opacityIncrement) * 100000) / 100000;
		if (currentOpacity > 1){
			currentOpacity = 1;
		}
		div.style.opacity = currentOpacity;
		if (currentOpacity < 1) {
			setTimeout('fadeIn(\''+divId+'\','+currentOpacity+','+opacityIncrement+','+delay+')',delay);
		}
	}
	if (navigator.appName == "Microsoft Internet Explorer") {
		currentOpacity = Math.round(currentOpacity + opacityIncrement);
		if (currentOpacity > 100){
			currentOpacity = 100;
		}
		div.style.filter = "alpha(opacity=" + currentOpacity + ")";
		if (currentOpacity < 100) {
			setTimeout('fadeIn(\''+divId+'\','+currentOpacity+','+opacityIncrement+','+delay+')',delay);
		}
	}
}

function expandCollapseSection(iconId, divId) {
	var icon = document.getElementById(iconId);
	var div = document.getElementById(divId);
	
	//Switch the arrow icon
	var imageName = icon.src.substring(icon.src.lastIndexOf("/") + 1);
	if (imageName == "hotelProfile_arrowRight.gif") {
		icon.src = "../images/hotelProfile_arrowDown.gif";
	}
	else {
		icon.src = "../images/hotelProfile_arrowRight.gif";
	}
	
	//Show or hide the content section
	if (div.style.display == "none") {
		div.style.display = "block";
	}
	else {
		div.style.display = "none";
	}
}

function expandCollapseSection2(iconId, divId) {
	var totalTime = 300;	//Approximate time in milliseconds (varies by browser and CPU speed)
	var FPS = 50;		//Approximate frame rate for the animation (varies by browser and CPU speed)
	var delay = Math.round(1000 / FPS);
	var numFrames = Math.round(totalTime / delay * 1000) / 1000;

	var icon = document.getElementById(iconId);
	var div = document.getElementById(divId);

	//Switch the arrow icon
	var imageName = icon.src.substring(icon.src.lastIndexOf("/") + 1);
	if (imageName == "hotelProfile_arrowRight.gif") {
		icon.src = "../images/hotelProfile_arrowDown.gif";
	}
	else {
		icon.src = "../images/hotelProfile_arrowRight.gif";
	}
	
	//Show or hide the content section
	if (div.style.display == "none") {
		//Expand div while hidden and determine ending height
		div.style.visibility = "hidden";
		div.style.display = "block";
		var divEndingHeight = div.offsetHeight;
		if (navigator.appName == "Netscape"){
			//Subtract starting width of padding and borders in Netscape/Firefox
			var extraHeightNetscape = 0;
			var paddingTop = parseInt(document.defaultView.getComputedStyle(div,null).getPropertyValue("padding-top"));
			var paddingBottom = parseInt(document.defaultView.getComputedStyle(div,null).getPropertyValue("padding-bottom"));
			var borderTopWidth = parseInt(document.defaultView.getComputedStyle(div,null).getPropertyValue("border-top-width"));
			var borderBottomWidth = parseInt(document.defaultView.getComputedStyle(div,null).getPropertyValue("border-bottom-width"));
			extraNetscapeHeight = paddingTop + paddingBottom + borderTopWidth + borderBottomWidth;
			divEndingHeight -= extraNetscapeHeight;
		}
		
		//Start div at 0 height (actually 1 so IE doesn't do auto)
		var divCurrentHeight = 1;
		div.style.height = 1;
		
		//Determine size change increment
		var divIncrement = divEndingHeight / numFrames;
		
		//Show div
		div.style.visibility = "visible";
		
		//Do expand animation
		setTimeout('expandSection(\''+divId+'\','+divEndingHeight+','+divCurrentHeight+','+divIncrement+','+delay+')',delay);
	}
	else {
		//Determine starting height
		var divStartingHeight = parseFloat(div.style.height);
		var divCurrentHeight = divStartingHeight;
		if (navigator.appName == "Netscape"){
			//Subtract starting width of padding and borders in Netscape/Firefox
			var extraHeightNetscape = 0;
			var paddingTop = parseInt(document.defaultView.getComputedStyle(div,null).getPropertyValue("padding-top"));
			var paddingBottom = parseInt(document.defaultView.getComputedStyle(div,null).getPropertyValue("padding-bottom"));
			var borderTopWidth = parseInt(document.defaultView.getComputedStyle(div,null).getPropertyValue("border-top-width"));
			var borderBottomWidth = parseInt(document.defaultView.getComputedStyle(div,null).getPropertyValue("border-bottom-width"));
			extraNetscapeHeight = paddingTop + paddingBottom + borderTopWidth + borderBottomWidth;
			divEndingHeight -= extraNetscapeHeight;
		}

		//Determine size change increment
		var divIncrement = divCurrentHeight / numFrames;
		
		//Do collapse animation
		setTimeout('collapseSection(\''+divId+'\','+divStartingHeight+','+divCurrentHeight+','+divIncrement+','+delay+')',delay);
	}
}

function expandSection(divId, divEndingHeight, divCurrentHeight, divIncrement, delay) {
	var div = document.getElementById(divId);
	
	//Increment height
	divCurrentHeight = divCurrentHeight + divIncrement;
	
	//Stop if it reaches the ending size
	if (divCurrentHeight >= divEndingHeight) {
		divCurrentHeight = divEndingHeight;
	}
	div.style.height = divCurrentHeight;
	
	if (divCurrentHeight < divEndingHeight) {
		setTimeout('expandSection(\''+divId+'\','+divEndingHeight+','+divCurrentHeight+','+divIncrement+','+delay+')',delay);
	}
}

function collapseSection(divId, divStartingHeight, divCurrentHeight, divIncrement, delay) {
	var div = document.getElementById(divId);
	
	//Decrement height
	divCurrentHeight = divCurrentHeight - divIncrement;
	
	//Stop if it reaches 0
	if (divCurrentHeight <= 0) {
		divCurrentHeight = 0;
	}
	div.style.height = divCurrentHeight;
	
	if (divCurrentHeight > 0) {
		setTimeout('collapseSection(\''+divId+'\','+divStartingHeight+','+divCurrentHeight+','+divIncrement+','+delay+')',delay);
	}
	else {
		//Hide div and reset height for repeat clicks
		div.style.display = "none";
		div.style.height = divStartingHeight;
	}
}

function enlargePhoto(photoId, closeButtonId, smallPhotoId) {
	var totalTime = 500;	//Approximate time in milliseconds (varies by browser and CPU speed)
	var FPS = 40;		//Approximate frame rate for the animation (varies by browser and CPU speed)
	var delay = Math.round(1000 / FPS);
	var numFrames = Math.round(totalTime / delay * 1000) / 1000;
	
	//Find the specified items
	var photo = document.getElementById(photoId);
	var closeButton = document.getElementById(closeButtonId);
	var smallPhoto = document.getElementById(smallPhotoId);
	
	//Set photo's ending width and calculate incremental size change
	var photoStartingWidth = smallPhoto.width;
	var photoEndingWidth = photo.width;
	var photoWidthIncrement = Math.round((photoEndingWidth - photoStartingWidth) / numFrames * 1000) / 1000;
	
	//Set large photo to size and position of small photo and show it
	var photoCurrentWidth = smallPhoto.width;
	photo.width = photoCurrentWidth;
	//Tami 2008/04/16 We don't need to dynamically position when we can absolutely position to containing div.
	//photo.style.left = findPosition(smallPhoto)[0];
	//photo.style.top = findPosition(smallPhoto)[1];
	photo.style.visibility = "visible";
	
	//Do grow animation
	setTimeout("growPhoto('" + photoId + "','" + closeButtonId + "'," + photoCurrentWidth + "," + photoEndingWidth + "," + photoWidthIncrement + "," + delay + ")");	
}

function growPhoto(photoId, closeButtonId, photoCurrentWidth, photoEndingWidth, photoWidthIncrement, delay) {
	var photo = document.getElementById(photoId);
	var closeButton = document.getElementById(closeButtonId);
	var closeButtonLeftOffset = 0;
	
	//Determine the photo's next size
	photoCurrentWidth = photoCurrentWidth + photoWidthIncrement;
	
	if (photoCurrentWidth >= photoEndingWidth) {
		//If photo reaches its ending size, stop and show close button
		photo.width = photoEndingWidth;
		//Tami 2008/04/16 setting close button top in css.
		//closeButton.style.top = parseFloat(photo.style.top) + 9;
		//Tami 2008/04/16 Positioning shouldn't be offset, relative to containing div.
		//also, firefox needs the px to work properly with the xhtml doctype.
		//closeButton.style.left = findPosition(photo)[0] + photo.width;
		closeButtonLeftOffset = photo.width - 60;
		closeButton.style.left = closeButtonLeftOffset+"px";
		closeButton.style.visibility = "visible";
	}
	else {
		//Increase the photo's size and continue
		photo.width = photoCurrentWidth;
		setTimeout("growPhoto('" + photoId + "','" + closeButtonId + "'," + photoCurrentWidth + "," + photoEndingWidth + "," + photoWidthIncrement + "," + delay + ")");
	}
}

function closeEnlargedPhoto(photoId, closeButtonId, smallPhotoId) {
	var totalTime = 500;	//Approximate time in milliseconds (varies by browser and CPU speed)
	var FPS = 40;		//Approximate frame rate for the animation (varies by browser and CPU speed)
	var delay = Math.round(1000 / FPS);
	var numFrames = Math.round(totalTime / delay * 1000) / 1000;
	
	//Find the specified items
	var photo = document.getElementById(photoId);
	var closeButton = document.getElementById(closeButtonId);
	var smallPhoto = document.getElementById(smallPhotoId);
	
	//Hide the close button
	closeButton.style.visibility = "hidden";
	
	//Set photo's ending width and calculate incremental size change
	var photoStartingWidth = photo.width;
	var photoEndingWidth = smallPhoto.width;
	var photoWidthIncrement = Math.round((photoEndingWidth - photoStartingWidth) / numFrames * 1000) / 1000;
	
	//Set large photo to size and position of small photo and show it
	var photoCurrentWidth = photo.width;
	
	//Do shrink animation
	setTimeout("shrinkPhoto('" + photoId + "','" + closeButtonId + "'," + photoStartingWidth + "," + photoCurrentWidth + "," + photoEndingWidth + "," + photoWidthIncrement + "," + delay + ")");
}

function shrinkPhoto(photoId, closeButtonId, photoStartingWidth, photoCurrentWidth, photoEndingWidth, photoWidthIncrement, delay) {
	var photo = document.getElementById(photoId);
	var closeButton = document.getElementById(closeButtonId);
	
	//Determine the photo's next size
	photoCurrentWidth = photoCurrentWidth + photoWidthIncrement;
	
	if (photoCurrentWidth <= photoEndingWidth) {
		//If photo reaches its ending size, stop, hide it, and restore it's original size for repeat clicks
		photo.width = photoEndingWidth;
		photo.style.visibility = "hidden";
		photo.width = photoStartingWidth;
	}
	else {
		//Decrease the photo's size and continue
		photo.width = photoCurrentWidth;
		setTimeout("shrinkPhoto('" + photoId + "','" + closeButtonId + "'," + photoStartingWidth + "," + photoCurrentWidth + "," + photoEndingWidth + "," + photoWidthIncrement + "," + delay + ")");
	}
}

function findPosition(object) {
	var currentLeft = currentTop = 0;
	if (object.offsetParent) {
		currentLeft = object.offsetLeft
		currentTop = object.offsetTop
		while (object = object.offsetParent) {
			currentLeft += object.offsetLeft
			currentTop += object.offsetTop
		}
	}
	return [currentLeft,currentTop];
}


function openRatingsGuide() {
	var div = document.getElementById("HP_RatingsGuideOuter");
	div.style.visibility = "visible";
	
	//Determine current window size and position
	var windowWidth = document.body.clientWidth;
	var windowHeight = document.body.clientHeight;
	var scrollHeight = document.body.scrollTop;
	var scrollWidth = document.body.scrollLeft;
	
	//Determine box's size
	var width = div.offsetWidth;
	var height = div.offsetHeight;
	if (navigator.appName == "Netscape"){
		//Subtract starting width of padding and borders in Netscape/Firefox
		var extraWidthNetscape = 0;
		var paddingLeft = parseInt(document.defaultView.getComputedStyle(div,null).getPropertyValue("padding-left"));
		var paddingRight = parseInt(document.defaultView.getComputedStyle(div,null).getPropertyValue("padding-right"));
		var borderLeftWidth = parseInt(document.defaultView.getComputedStyle(div,null).getPropertyValue("border-left-width"));
		var borderRightWidth = parseInt(document.defaultView.getComputedStyle(div,null).getPropertyValue("border-right-width"));
		extraWidthNetscape = paddingLeft + paddingRight + borderLeftWidth + borderRightWidth;
		width -= extraWidthNetscape;
		
		//Subtract starting height of padding and borders in Netscape/Firefox
		var extraHeightNetscape = 0;
		var paddingTop = parseInt(document.defaultView.getComputedStyle(div,null).getPropertyValue("padding-top"));
		var paddingBottom = parseInt(document.defaultView.getComputedStyle(div,null).getPropertyValue("padding-bottom"));
		var borderTopWidth = parseInt(document.defaultView.getComputedStyle(div,null).getPropertyValue("border-top-width"));
		var borderBottomWidth = parseInt(document.defaultView.getComputedStyle(div,null).getPropertyValue("border-bottom-width"));
		extraNetscapeHeight = paddingTop + paddingBottom + borderTopWidth + borderBottomWidth;
		height -= extraNetscapeHeight;
	}
	
	//Move the box to the center of the screen
	div.style.left = ((windowWidth / 2) - (width / 2)) + scrollWidth;
	div.style.top = ((windowHeight / 2) - (height / 2)) + scrollHeight;
}


function closeRatingsGuide() {
	var div = document.getElementById("HP_RatingsGuideOuter");
	div.style.visibility = "hidden";
}


function HP_changeBigPhoto(fileName, caption) {
	var totalTime = 400;	//Approximate time in milliseconds (varies by browser and CPU speed)
	var FPS = 30;		//Approximate frame rate for the animation (varies by browser and CPU speed)
	var delay = Math.round(1000 / FPS);
	var numFrames = Math.round(totalTime / delay * 1000) / 1000;
	
	//Find items on page
	var image = document.getElementById("HP_BigPhoto");
	var captionBox = document.getElementById("HP_BigPhotoCaption");
	
	//Start with image faded out
	if (navigator.appName == "Netscape") {
		image.style.opacity = 0;
	}
	if (navigator.appName == "Microsoft Internet Explorer") {
		image.style.filter = "alpha(opacity=0)";
	}

	//Change image and caption
	image.src = imageRoot + "/" + fileName;
	captionBox.innerHTML = caption;
	
	//Fade in on image
	var opacityIncrement
	if (navigator.appName == "Netscape") {
		opacityIncrement = 1 / numFrames;
	}
	if (navigator.appName == "Microsoft Internet Explorer") {
		opacityIncrement = 100 / numFrames;
	}
	fadeIn(image.id, 0, opacityIncrement, delay);
}