var myContainer;
var myLabels;
var myImage;
var images;
var labels;
var oldLabel;
var oldImage;
var currentCounter;
var myTimer;

function init(vContainerID,width,height) {
	myContainer = document.createElement("DIV");
	myContainer.id = vContainerID + "-containermain";
	myContainer.className = "banner-container";
	myLabels = document.createElement("DIV");
	myLabels.id = vContainerID + "-labels";
	myLabels.className = "banner-labels";
	myImage = document.createElement("DIV");
	myImage.id = vContainerID + "-images";
	myImage.className = "banner-images";
	myImage.style.overflow = "hidden";
	myLabels.style.width = width + "px";
	myImage.style.width = width + "px";
	myImage.style.height = height + "px";
	myContainer.appendChild(myLabels);
	myContainer.appendChild(myImage);
	images = new Array();
	labels = new Array();
	currentCounter = 0;
	oldLabel = "";
	
	myTimer = setTimeout("updateCurrent()",5000);
	return myContainer;
}

function updateCurrent() {
	currentCounter++;
	if (labels.length<=currentCounter) {
		currentCounter = 0;
	}
	setCurrent(currentCounter);
}

function addImage(path,label) {
	labels.push(label);
	images.push(path);
	updateLabels();
	updateImages();
	setCurrent(0);
}

function updateLabels() {
	var currentLabel;
	myLabels.innerHTML = "";
	for(var i in labels) {
		currentLabel = labels[i];
		myLabels.appendChild(_addLabel(currentLabel,i));
	}
}

function updateImages() {
	var currentImage;
	myImage.innerHTML = "";
	for(var i in images) {
		currentImage = images[i];
		myImage.appendChild(_addImage(currentImage,i));
	}
}

function _addLabel(label,idx) {
	var thisLabel = document.createElement("div");
	thisLabel.className = "banner-label other";
	thisLabel.id = "banner-label-" + idx;
	thisLabel.innerHTML = label;
	thisLabel.onclick = function() {
		setCurrent(arguments.callee.me);
};
	thisLabel.onclick.me = idx;
	return thisLabel;
}

function _addImage(image,idx) {
	var thisImgContainer = document.createElement("DIV");
	var thisImage = document.createElement("img");
	thisImage.className = "banner-image other";
	thisImage.id = "banner-image-" + idx;
	thisImage.src = image;
        $(thisImage).css({opacity: 0});
	thisImgContainer.className = "container";
	thisImgContainer.id = "banner-imgc-" + idx;
	thisImgContainer.style.width = myImage.style.width;
	thisImgContainer.style.height = myImage.style.height;
	thisImgContainer.appendChild(thisImage);
	return thisImgContainer;
}

function setCurrent(vIdx) {
	if (myTimer!="") {
		clearTimeout(myTimer);
		myTimer = "";
	}
	currentCounter = vIdx;
	var currentLabel = document.getElementById("banner-label-" + vIdx);
	var currentImage = document.getElementById("banner-image-" + vIdx);
	currentLabel.className = "banner-label current";
	if (oldLabel!="" && oldLabel!=currentLabel) {
		oldLabel.className = "banner-label other";
	}
	if (oldImage) {
		$(oldImage).animate({opacity: 0},1000);
	}
        $(currentImage).animate({opacity: 1},1000);
	oldLabel = currentLabel;
	oldImage = currentImage;
	myTimer = setTimeout("updateCurrent()",5000);
}