/***********************************************************************************************************************
 * $RCSfile: group.js,v $
 * 
 * Project:      success_group
 * Name:         group.js
 * 
 * @author       Mario Diaz (4fb)
 *
 * {@internal 
 * Created:      15.04.2008
 * }}
 * 
 * $Id: group.js,v 1.0.0 15.04.2008 09:15:43 mario.diaz$ 
***********************************************************************************************************************/

// our layer which should be overlaid
var iHeightLayerOverlaid = 0;
var oOverlay = null;
var iOverlayTop = 0;

// our images:
var aImagesSmall = new Array();

/**
 * function for text effect
 * @param int iNum (which text)
 * @return void
 */
function showTeaserText (iNum) {
	if (document.getElementById('text_box_' + iNum)) {
		// change img:
		oImgLayer = (document.getElementById('img_left')) ? document.getElementById('img_left') : document.getElementById('img_right');
		if (aImagesSmall[iNum - 1]) {
			oImgLayer.innerHTML = "<img src='" + aImagesSmall[iNum - 1] + "' alt='' title='' />";
		}
	
		sText = document.getElementById('text_box_' + iNum).innerHTML;
		document.getElementById('show_text_box_inner').innerHTML = sText;
		aPos = findPos (document.getElementById('show_text_box_inner'));
		iWidthLayerOverlaid = document.getElementById('show_text_box_inner').offsetWidth;
		//iHeightLayerOverlaid = oImgLayer.offsetHeight;
		oTextLayerMain = (document.getElementById('show_text_box')) ? document.getElementById('show_text_box') : document.getElementById('show_text_box_' + 2);
		iHeightLayerOverlaid = oTextLayerMain.offsetHeight;
		
		// set overlay:
		oOverlay = document.getElementById('brown_overlay');
		oOverlay.style.left = aPos[0] + "px";
		oOverlay.style.top = aPos[1] + "px";
		oOverlay.style.width = iWidthLayerOverlaid + "px";
		oOverlay.style.height = iHeightLayerOverlaid + "px";
		oOverlay.style.visibility = "visible";
		iOverlayTop = aPos[1];
		setTimeout ("changeOverlay ()", 20);
	}
}


/**
 * finds pos of element in browser
 * @param object obj
 * @return int array  
 */
function findPos (obj) {
	var curleft = curtop = 0;
	if (obj.offsetParent) {
		curleft = obj.offsetLeft
		curtop = obj.offsetTop
		while (obj = obj.offsetParent) {
			curleft += obj.offsetLeft
			curtop += obj.offsetTop
		}
	}
	return [curleft,curtop];
}


/**
 * moves and resizes overlay
 * @return void
 */
function changeOverlay () {
	iHeightLayerOverlaid--;
	if (iHeightLayerOverlaid > 0) {
		iOverlayTop++;
		oOverlay.style.top = iOverlayTop + "px";
		oOverlay.style.height = iHeightLayerOverlaid + "px";
		setTimeout ("changeOverlay ()", 20);
	} else {
		oOverlay.style.visibility = "hidden";
	}
}


/**
 * preloads images for image change
 * @return void
 */
function preloadSmallImages () {
	var aImagesPreload = new Array();
	for (i = 0; i < aImagesSmall.length; i++) {
		aImagesPreload[i] = new Image();
		aImagesPreload[i].src = aImagesSmall[i];
	}
}


// for preloading images:
var aTmpPreload = new Array();

/**
 * preloads images:
 * @param aImgArr
 * @return void
 */
function preloadImages (aImgArr) {
	iStart = aTmpPreload.length;
	for (i = 0; i < aImgArr.length; i++) {
		aTmpPreload[iStart + i] = new Image();
		aTmpPreload[iStart + i].src = aImgArr[i];
	}
}


/**
 * changes img (mouse over)
 * @param string sXhtmlId
 * @param int iImg
 * @param int iState
 * @return void
 */
function changeImg (sXhtmlId, iImg, iState) {
	if (document.getElementById(sXhtmlId)) {
		sImg = (iState == 0) ? aImagesOver[iImg] : aImagesOut[iImg];
		document.getElementById(sXhtmlId).src = sImg;
	}
}


// our large img to load
var oImgLarge = null;

// medianame of large img
var sTitleLargeImg = "";

/**
 * shows large image
 * @param int iIdPreview
 * @return void
 */
function showLargeImg (iIdPreview) {
	oLayerPreview = document.getElementById('hotel_images');
	oLayerLarge = document.getElementById('image_large');
	// get upper left corner of preview images layer:
	aPosPreviewLayer = findPos(oLayerPreview);
	iPreviewLayerWidth = oLayerPreview.offsetWidth;
	//iPreviewLayerHeight = oLayerPreview.offsetHeight;
	iPreviewLayerHeight = 394;	// use fixed because of scrolling
	iLayerLargeWidth = oLayerLarge.offsetWidth;
	iLayerLargeHeight = oLayerLarge.offsetHeight;
	oLayerLarge.style.left = (aPosPreviewLayer[0] + ((iPreviewLayerWidth - iLayerLargeWidth) / 2)) + "px";
	oLayerLarge.style.top = (aPosPreviewLayer[1] - 10 + ((iPreviewLayerHeight - iLayerLargeHeight) / 2)) + "px";
	oLayerLarge.style.visibility = 'visible';
	
	oImgLarge = new Image();
	oImgLarge.src = aImagesLarge[iIdPreview];
	
	//
	// sTitleLargeImg = sImgLargeTitle + " " + (iIdPreview + 1);
	sTitleLargeImg = unescape(aImagesMedianames[iIdPreview]);
	sTitleLargeImg = sTitleLargeImg.replace(/\\/g, '');
	sTitleLargeImg = sTitleLargeImg.replace(/\+/g, ' ');
	setTimeout("checkImgLargeComplete ()", 12);
}



/**
 * checks if large img is loaded completely
 * if so then get width of image and correct position:
 */
function checkImgLargeComplete () {
	bFinished = false;
	if (oImgLarge.complete) {

		oLayerLarge = document.getElementById('image_large');
		oLayerLarge.innerHTML = "<a href='#' onclick='hideLargeImg(); return false;'><img id='whole_image_large' src='" + oImgLarge.src + "' alt='' /></a>";
		oLayerLarge.innerHTML += "<div id='large_img_medianame'>" + sTitleLargeImg + "</div>";
		oImgLargeFinal = document.getElementById('whole_image_large');
		bFinished = true;
		iImgWidth = oImgLargeFinal.offsetWidth;
		iImgHeight = oImgLargeFinal.offsetHeight;
		// now correct position:
		oLayerPreview = document.getElementById('hotel_images');
		aPosPreviewLayer = findPos(oLayerPreview);
		
		iPreviewLayerWidth = oLayerPreview.offsetWidth;
		//iPreviewLayerHeight = oLayerPreview.offsetHeight;
		iPreviewLayerHeight = 394;	// use fixed because of scrolling
		
		oLayerLarge.style.left = (aPosPreviewLayer[0] + ((iPreviewLayerWidth - iImgWidth) / 2)) + "px";
		oLayerLarge.style.top = (aPosPreviewLayer[1] - 10 + ((iPreviewLayerHeight - iImgHeight) / 2)) + "px";
		oLayerLarge.style.width = iImgWidth + "px";
		oLayerLarge.style.height = iImgHeight + "px";

	}
	if (!bFinished) {
		setTimeout("checkImgLargeComplete ()", 12);
	}
}



/**
 * hides large image layer
 * @return void
 */
function hideLargeImg () {
	document.getElementById('image_large').style.visibility = 'hidden';
	document.getElementById('image_large').innerHTML = "<img src='images/loading.gif' id='preloading' alt='' />";
}



/**
 * creates mouseover effect
 * @param int iMainEl
 * @param string sClassMain
 * @param string sClassSpacer
 * @return void
 */
function createMouseEffect (iMainEl, sClassMain, sClassSpacer) {
	if (!document.getElementById('li_navi_main_' + iMainEl) || !document.getElementById('li_navi_spacer_' + iMainEl)) {
		return false;
	}
	document.getElementById('li_navi_main_' + iMainEl).className = sClassMain;
	document.getElementById('li_navi_spacer_' + iMainEl).className = sClassSpacer;
}


/* *** lang menu (mouse over -> layer) ****************************************************************************** */
var bIE = document.all? true : false;
if (!bIE) document.captureEvents(Event.MOUSEMOVE);
document.onmousemove = getMouseXY;
var iTmpX = 0;
var iTmpY = 0;
var aLangAreaTop = new Array(0, 0, 0, 0);		// left, top, width, height
var aLangAreaBottom = new Array(0, 0, 0, 0);	// left, top, width, height



/**
 * captures mouse position
 * @param event e
 * return bool
 */
function getMouseXY(e) {
	if (bIE) {
		iTmpX = event.clientX + document.body.scrollLeft;
		iTmpY = event.clientY + document.body.scrollTop;
	} else {  
		iTmpX = e.pageX;
		iTmpY = e.pageY;
	}  
	// catch possible negative values in NS4
	if (iTmpX < 0) { iTmpX = 0 }
	if (iTmpY < 0) { iTmpY = 0 }
	return true
}


/**
 * shows layer for lang select
 * @return void
 */
function showLangLayer () {
	oServiceLink = document.getElementById('service_link_lang');
	aPosLangLink = findPos(oServiceLink);
	oLangLayer = document.getElementById('lang_selection_layer');
	oLangLayer.style.left = (aPosLangLink[0] - 2) + "px";
	oLangLayer.style.top = (aPosLangLink[1] + 20) + "px";
	oLangLayer.style.display = "inline";
	// now save positions:
	aLangAreaTop[0] = aPosLangLink[0];
	aLangAreaTop[1] = aPosLangLink[1];
	aLangAreaTop[2] = oServiceLink.offsetWidth;
	aLangAreaTop[3] = oServiceLink.offsetHeight;
	aPosLangLayer = findPos(oLangLayer);
	aLangAreaBottom[0] = aPosLangLayer[0];
	aLangAreaBottom[1] = aPosLangLayer[1];
	aLangAreaBottom[2] = oLangLayer.offsetWidth;
	aLangAreaBottom[3] = oLangLayer.offsetHeight;
	setTimeout("checkLangLayerDisplay ()", 20);
}


/**
 * checks if mouse position is within area
 * @param array aArea
 * @return bool
 */
function checkMouseWithinArea (aArea) {
	if (iTmpX < aArea[0]) {
		return false;
	}
	if (iTmpX > aArea[0] + aArea[2]) {
		return false;
	}
	if (iTmpY < aArea[1]) {
		return false;
	}
	if (iTmpY > aArea[1] + aArea[3]) {
		return false;
	}
	return true;
}


/**
 * checks if mouse is over lang-selection-layer of lang_link and if not then hide langSel layer
 * @return void
 */
function checkLangLayerDisplay () {
	bHide = true;
	if (checkMouseWithinArea (aLangAreaTop) || checkMouseWithinArea (aLangAreaBottom)) {
		bHide = false;
	}
	if (bHide) {
		document.getElementById('lang_selection_layer').style.display = "none";
	} else {
		setTimeout("checkLangLayerDisplay ()", 20);
	}
}


// *** both main boxes should be same height:

/** 
 * corrects height of boxes
 * @return void
 */
function correctHeightOfMainBoxes () {
	if (document.getElementById('standard_img_text') && document.getElementById('content_article')) {
		oBoxLeft = document.getElementById('standard_img_text');
		oBoxRight = document.getElementById('content_article');
		iHeightLeft = oBoxLeft.offsetHeight;	
		iHeightRight = oBoxRight.offsetHeight;
		if (iHeightLeft > iHeightRight) {
			oBoxRight.style.height = iHeightLeft  + "px";	//
		} else if (iHeightLeft < iHeightRight) {
			oBoxLeft.style.height = (iHeightRight - 2) + "px";	// border!
		}
	}
}


/**
 * hotel details site
 * loads img into large layer: All images already loaded -> just use innerHTML to get large image
 * @param int iNum
 * @return void
 */
function showHotelDetailsImg (iNum) {
	oLayerLarge = null;
	if (document.getElementById('hotel_details_img_large')) {
		oLayerLarge = document.getElementById('hotel_details_img_large');
		if (document.getElementById('img_details_' + iNum)) {
			//alert(document.getElementById('img_link_' + iNum).innerHTML);
			oLayerLarge.innerHTML = document.getElementById('img_details_' + iNum).innerHTML;
		}
	}
}


/**
 * handles complete printing
 * @return void
 */ 
function printContent () {
	document.getElementById('hotel_details_special_links').style.display = 'none';	// don't print "print button"
	sBaseHref = document.getElementsByTagName('base')[0].href;
	newwin = window.open("", "details_win", "width=570, height=600, top=0, left=0, resizable=1, scrollbars=1");
	newwin.document.write("<html>");
	newwin.document.write("<head>");
	newwin.document.write("<base href='" + sBaseHref + "' /><title>PRINT_CONTENT</title>");
	newwin.document.write("<link rel='stylesheet' type='text/css' href='css/group.css' />");
	newwin.document.write("<link rel='stylesheet' type='text/css' href='css/success_hotels.css' />");
	newwin.document.write("<style type='text/css'>div.hotel_details { width: 520px; margin-left: 0; }</style>");
	newwin.document.write("<script type='text/javascript' src='js/group.js'></script>");
	newwin.document.write("</head>");
	newwin.document.write("<body style='margin: 0; padding: 0; background-color: #FFF; text-align: left;' onload='window.self.print();'>");
	// header img:
	newwin.document.write("<div><img src='images/logo.gif' alt='' /></div>");
	newwin.document.write("<div class='table_row' style='width: 510px;'>");
	newwin.document.write(document.getElementById('hotels_map_center').innerHTML);
	newwin.document.write(document.getElementById('hotels_map_right').innerHTML);
	newwin.document.write("<div class='space_line'></div>");
	newwin.document.write("</div>");
	newwin.document.write("</body></html>");
	newwin.document.close();
	document.getElementById('hotel_details_special_links').style.display = 'block';	// display print button again
}


/**
 *
 */
function showReservationCode () {
}