nIndex = 0;
$(document).ready(function() {
	$("ul#homeSlides").cycle({
		fx: 'fade',
		after: counter,
		timeout: 2000,  // ms between slide transitions
		speed: 2000		// speed of transition
	});
});

function counter(curr,next,opts) { 
	nIndex	= opts.currSlide;
} 

var htmlResort = "<div id=\"vvtFrame\"><div id=\"vvtHead\"><div id=\"headLogo\"></div><div id=\"headDone\" onclick=\"$.colorbox.close();\"></div><div id=\"headLine\"></div></div>";
htmlResort += '<iframe src="tours/Resort1.html" id="myFrame" scrolling="no" marginheight="0" marginwidth="0" frameborder="0" style="width:805px; height:476px; border:0; display:block;" allowtransparency="true" />';
htmlResort += "</div>";

var htmlOkendo = "<div id=\"vvtFrame\"><div id=\"vvtHead\"><div id=\"headLogo\"></div><div id=\"headDone\" onclick=\"$.colorbox.close();\"></div><div id=\"headLine\"></div></div>";
htmlOkendo += '<iframe src="tours/City1.html" id="myFrame" scrolling="no" marginheight="0" marginwidth="0" frameborder="0" style="width:805px; height:476px; border:0; display:block;" allowtransparency="true" />';
htmlOkendo += "</div>";

var htmlPalau = "<div id=\"vvtFrame\"><div id=\"vvtHead\"><div id=\"headLogo\"></div><div id=\"headDone\" onclick=\"$.colorbox.close();\"></div><div id=\"headLine\"></div></div>";
htmlPalau += '<iframe src="tours/Monument2.html" id="myFrame" scrolling="no" marginheight="0" marginwidth="0" frameborder="0" style="width:805px; height:476px; border:0; display:block;" allowtransparency="true" />';
htmlPalau += "</div>";

function showDemo() {
	pageTracker._trackEvent('Element', 'Click', 'view_demo_home');
	if (nIndex < 2)
		$.colorbox({html:htmlResort, width:'805', height:'519', overlayClose:false, iframe:false});
	else if (nIndex < 4)
		$.colorbox({html:htmlOkendo, width:'805', height:'519', overlayClose:false, iframe:false});
	else
		$.colorbox({html:htmlPalau, width:'805', height:'519', overlayClose:false, iframe:false});
}

function positionLoginPopup(){
	$("#loginPopup").attr("style", "left:"+(($("body").width()-400) /2) +"px; top:"+(($(window).height()-500) /2 +$(window).scrollTop()) +"px;");	
}