var m_bSlideLock = false;
var m_moveEffect = null;
var m_nCurrImage = 0;
var m_nTimer = null;

var m_strPath = "";

var m_nImageCycle = 0;

var m_arrImages = new Array();

var m_nMinWidth = 650;
var m_nMinHeight = 600;

var nRealImageWidth = 1200;
var nRealImageHeight = 750;
var nScale = nRealImageWidth / nRealImageHeight;

var nImageWidth = 0;
var nImageHeight = 0;

var m_objMenu = null;
var m_strMenu = "";

// ****************************************************************************
// onBackgroundClick
// ****************************************************************************
function onBackgroundClick() {
  window.location = "approach";
}

// ****************************************************************************
// ready
// ****************************************************************************
function ready() {
  // show titles
  var elemMenuPanel = $('home_menu_panel');
  elemMenuPanel.style.visibility = "visible";
  elemMenuPanel.setOpacity(0);
  new Effect.Opacity(elemMenuPanel, { from: 0, to: 1, duration: 1 });
  
  var elemIntroPanel = $('intro_panel');
  elemIntroPanel.style.visibility = "visible";
  elemIntroPanel.setOpacity(0);

  // show background when titles are faded up  
  new Effect.Opacity(elemIntroPanel, { from: 0, to: 1, duration: 1, afterFinish: this.showBackground.bind(this) });
}

// ****************************************************************************
// showBackground
// ****************************************************************************
function showBackground() {
	// init active/inactive
	m_activeSlide = $("slideHolder1");
	m_inactiveSlide = $("slideHolder2");
	// position absolute
	$("slideHolder1").absolutize();
	$("slideHolder2").absolutize();
	// update to current viewport size
	updateSize();
	// position inactive slide
	m_inactiveSlide.style.left = nImageWidth + "px";
	
	// load
	loadImage($("slideHolder1"), m_arrImages[m_nCurrImage]);
	m_nCurrImage++;
	loadImage($("slideHolder2"), m_arrImages[m_nCurrImage]);	
}

// ****************************************************************************
// updateSize
// ****************************************************************************
function updateSize() {
	var bReset = false;
	var viewDim = document.viewport.getDimensions();
	
	// get viewport size	
	nImageWidth = viewDim.width;
	nImageHeight = viewDim.height;
	if (nImageHeight < m_nMinHeight) {
		nImageHeight = m_nMinHeight;
	} 	
	if (nImageWidth < m_nMinWidth) {
		nImageWidth = m_nMinWidth;
	} 	

	var strWidth = nImageWidth + "px";
	var strHeight = nImageHeight + "px";
	
	// update container heights	
	$("slidesHolder").style.width = strWidth;
	$("slidesHolder").style.height = strHeight;
	
	$("slides").style.width = strWidth;
	$("slides").style.height = strHeight;

	$("slideHolder1").style.width = strWidth;
	$("slideHolder1").style.height = strHeight;
	
	$("slideHolder2").style.width = strWidth;
	$("slideHolder2").style.height = strHeight;
	
	// are we in transition?
	if (m_bSlideLock) {	
		bReset = true;
		// cancel transition
		m_moveEffect.cancel();
		// reset pos
		$("slides").style.left = "0px";		
	}
	// update image widths
	var imageElement = $$("#slides img");
	for (var nElement=0; nElement < imageElement.length; nElement++) {
		if ((nImageWidth / nScale) < nImageHeight) {
			imageElement[nElement].width = nImageHeight * nScale;
			imageElement[nElement].height = nImageHeight;
		}
		else {
			imageElement[nElement].width = nImageWidth;		
			imageElement[nElement].height = nImageWidth / nScale;
		}
	}
	// reposition 2nd slide
	$("slideHolder2").style.left = nImageWidth + "px";

	// was the move reset?
	if (bReset) {
		m_bSlideLock = false;
		nextSlide();		
	}
}

// ****************************************************************************
// loadImage
// ****************************************************************************
function loadImage(slideHolder, strImage) {
	var strPath = m_strPath;
	
	var image = new Image();
	image.onload = function() {		
		slideHolder.setOpacity(0);
		slideHolder.style.visibility = "visible";
	
		var imageElement = $$("#" + slideHolder.id + " img");
		if (imageElement.length) {
			imageElement[0].src = image.src;
			Effect.Fade(slideHolder, { duration: 2, from: 0, to: 1 });
			// start timer for next slide
			if (m_nTimer) {
				clearTimeout(m_nTimer);
			}
			m_nTimer = setTimeout("nextSlide()", 8000);
		}		
	}
	image.src = strPath + strImage;
}

// ****************************************************************************
// nextSlide
// ****************************************************************************
function nextSlide() {
	if (!m_bSlideLock) {
	  // how many slides to show before we enter site
	  var nShowSlides = 2 * (m_arrImages.length - 1);
	  
	  if (m_nImageCycle == nShowSlides) {
	    onBackgroundClick();
	  }
	  else {
	    m_nImageCycle++;
	    m_bSlideLock = true;
	    m_moveEffect = new Effect.Move($("slides"), { duration: 0.6, x: -nImageWidth, afterFinish: slideOff });
	  }			
	}
}

// ****************************************************************************
// slideOff
// ****************************************************************************
function slideOff() {
	// get 2nd img
	var imageElement2 = $$("#slideHolder2 img");
	if (imageElement2.length) {
		// get 1st img
		var imageElement1 = $$("#slideHolder1 img");
		if (imageElement1.length) {
			imageElement1[0].src = imageElement2[0].src;
		}
		$("slides").style.left = "0px";
		
		if (m_nCurrImage+1 < m_arrImages.length) {
			m_nCurrImage++;
		}
		else {
			m_nCurrImage = 0;
		}
		// load next
		loadImage(m_inactiveSlide, m_arrImages[m_nCurrImage]);		
		
		m_bSlideLock = false;
	}	
}