// JavaScript Document
var imgPath = "images/home/";
var delay = 5000;
var imgPaths = [];
var imgs = [];
var loaded = [];
var currentImg = 0;
var showing = "topDiv";
var timer;
var fader;

var sources = [
	"football-offer.jpg",
	"momAndDaughter.jpg",
	"ohp.jpg",
	"girlSwing.jpg",
	"constructionGuy.jpg",
	"babyExam.jpg"
			   ];

var links = [
	"visit/forms/Sports-Physical-Flyer-2011.pdf",
	"#",
	"#",
	"#",
	"#",
	"#",
	"#"
	]

var numImg = sources.length;

function testLink() {
	if( links[currentImg] != "#") {
		openWin(links[currentImg]);
	}
	
}

function openWin(href) {
	window.open(href, "EncompassUrgentCare");
}

var imgNum = sources.length; //5;

loadImages();

function loadImages() {
	for (i=0; i < imgNum; i++) {
		imgPaths.push(imgPath + sources[i]);
		im = new Image();
		im.index = i;
		im.onload = function () {
			loaded[this.index] = true;
		}
		im.src = imgPaths[i];
		imgs.push(im);
	}
}

function initImage() {
///return;
	b = document.getElementById("topDiv");
	b.style.backgroundImage = "url(" + imgPaths[currentImg] + ")";
	//setControls();
	timer = setTimeout("newTop()", delay);
}

function newTop() {
  	topImg = document.getElementById("topDiv");
	++ currentImg;
	currentImg = currentImg <= imgs.length - 1? currentImg : 0;
	//setControls();
  	if (loaded[currentImg] == true) {
		topImg.style.backgroundImage = "url(" + imgPaths[currentImg] + ")";
		fadeIn("topDiv",0);
	} else {
		currentImg = currentImg > 0? -- currentImg : imgs.length -1;
		timer = setTimeout("newTop()", 3000); //retry in 3 sec.
	}
}

function newBottom() {
  	baseImg = document.getElementById("base");
	++ currentImg;
	currentImg = currentImg <= imgs.length - 1? currentImg : 0;
	//setControls();
	//setCaption();
  	if (loaded[currentImg] == true) { 
		baseImg.style.backgroundImage = "url(" + imgPaths[currentImg] + ")";
		fadeOut("topDiv",100);
	} else {
		currentImg = currentImg > 0? -- currentImg : imgs.length -1;
		timer =setTimeout("newBottom(true)", 3000);
	}
}

function setControls() {
	var newControls = '';
	var q = 0; //numImg -1;
	while(q <numImg){
		if(q==currentImg){ 
			newControls = newControls + "<span class=c1></span>";
		} else { 
			newControls = newControls + "<a href='javascript:showImg(" + q + ");'><span class=c2></span></a>"; 
			//newControls = newControls + "<a href='#' onclick='showImg(" + q + "); return false;'><span class=c2></span></a>"; 
		}
		q++;
  }
  document.getElementById('home-rotator-controls').innerHTML = newControls;
}

function setCaption() {
	cap = document.getElementById("caption");
	cap.innerHTML = captions[currentImg];
}

function showImg(img) {
	clearTimeout(timer);
	clearTimeout(fader);
	currentImg = --img;
	if(showing == "topDiv") {
		newBottom();
	} else {
		newTop();
	}
	
}

//The setOpacity function is passed an object and an opacity value. It then sets the opacity of the supplied object using four proprietary ways. It also prevents a flicker in Firefox caused when opacity is set to 100%, by setting the value to 99.999% instead.
function setOpacity(obj, opacity) {
  opacity = (opacity == 100)?99.999:opacity;
  
  // IE/Win
  obj.style.filter = "alpha(opacity:"+opacity+")";
  
  // Safari<1.2, Konqueror
  obj.style.KHTMLOpacity = opacity/100;
  
  // Older Mozilla and Firefox
  obj.style.MozOpacity = opacity/100;
  
  // Safari 1.2, newer Firefox and Mozilla, CSS3
  obj.style.opacity = opacity/100;
}

//The fadeIn function uses a Timeout to call itself every 100ms with an object Id and an opacity. The opacity is specified as a percentage and increased 10% at a time. The loop stops once the opacity reaches 100%:
function fadeIn(objId,opacity) {
  if (document.getElementById) {
    obj = document.getElementById(objId);
    if (opacity <= 100) {
      setOpacity(obj, opacity);
      opacity += 5;
      fader = setTimeout("fadeIn('"+objId+"',"+opacity+")", 50);
    }
    if (opacity == 100) {
		showing = "topDiv";
      //window.setTimeout("fadeOut('" + objId + "', 100)", delay)
      timer = setTimeout("newBottom()", delay)
    }
  }
}
function fadeOut(objId,opacity) {
  if (document.getElementById) {
    obj = document.getElementById(objId);
    if (opacity >= 0) {
      setOpacity(obj, opacity);
      opacity -= 5;
      fader = setTimeout("fadeOut('"+objId+"',"+opacity+")", 50);
    }
	if (opacity == 0) {
		showing = "base";
		//window.setTimeout("fadeIn('" + objId + "', 0)", delay);
      	timer = setTimeout("newTop()", delay)
	}
  }
}