var sldSpeed = 10;

var ctrlSpeed = 10;

var ctrlIntvl; // Controls interval

var sldIntvl; // Slide interval

var sldTmtIntvl; // Timeout interval

var curIndex = 0; // Index of currently shown item


var slideContent = 

[["slide.png", 343, 149, "Some text"],

 ["slide.png", 343, 149, "Some text"],

 ["slide.png", 343, 149, "Some text"],

 ["slide.png", 343, 149, "Some text"]];



// Detect browswer type and version

var MSIE = false;

var IE56 = false;

function detectBrowser() {

	if (navigator.appVersion.indexOf("MSIE") > -1) {

		var arVersion = navigator.appVersion.split("MSIE");

		var version = parseFloat(arVersion[1]);

		if (version >= 5.5 && version < 7) {

			IE56 = true; 

		}

		MSIE = true;

	}

}

detectBrowser();

 

// Get browser window size

function getWinSize() {

	var size = new Array();

	var width = 0; 

	var height = 0;

	if (typeof(window.innerWidth) == "number") {

		//Non-IE

		width = window.innerWidth;

		height = window.innerHeight;

	} else if (document.documentElement && (document.documentElement.clientWidth || document.documentElement.clientHeight)) {

		//IE 6+ in 'standards compliant mode'

		width = document.documentElement.clientWidth;

		height = document.documentElement.clientHeight;

	} else if (document.body && (document.body.clientWidth || document.body.clientHeight)) {

		//IE 4 compatible

		width = document.body.clientWidth;

		height = document.body.clientHeight;

	}

	size.push(width);

	size.push(height);

	return size;

}

 

// Cross-browser image rendering

function createImage(url, width, height, id, title) {

	var img;

	if (imgPath && url.indexOf("/") == -1) {

		url = imgPath + url;

	}

	var imgType = (url.substr(url.lastIndexOf(".")+1)).toLowerCase();

	if (IE56 && imgType == "png") {

		img = document.createElement("span");

		img.contentEditable = "true";

		img.style.width = width + "px";

		img.style.height = height + "px";

		img.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + url + "', sizingMethod='scale')";

		if (id) {

			img.id = id;

		}

	} else {

		img = document.createElement("img");

		img.setAttribute("src", url);

		img.setAttribute("width", width.toString());

		img.setAttribute("height", height.toString());

		img.setAttribute("alt", "");

		if (id) {

			img.id = id;

		}

		if (title) {

			img.setAttribute("title", title);

		}

	}

	return img;

}



// Cross-browser event listener

function addEvent(elem, evtType, func) {

	if (elem.addEventListener) {

		elem.addEventListener(evtType, func, false);

	} else if (elem.attachEvent) {

		elem.attachEvent("on" + evtType, func);

	} else {

		elem["on" + evtType] = func;

	}

}



 // Cache images 

var images = new Array();

function cacheImages() {

	for (var i = 0; i < slideContent.length; i++) {

		var imgSrc = slideContent[i][0];

		var imgWidth = slideContent[i][1];

		var imgHeight = slideContent[i][2];

		var imgObj = new Image(imgWidth, imgHeight);

		imgObj.src = (imgPath && imgSrc.indexOf("/") == -1) ? imgPath+imgSrc : imgSrc;

		images.push(imgObj);

	}

}

cacheImages();

  

// Create slideshow

function initSlideShow(x, y) {

	var slideShow = document.createElement("div");

	slideShow.id = "slideShow";

	slideShow.style.width = "450px";

	slideShow.style.height = "190px";

	slideShow.style.overflow = "hidden";

	var spBack = document.createElement("span");

	var imgBack = createImage("sshow_bg.png", 450, 190, "imgBack");

	spBack.appendChild(imgBack);

	slideShow.appendChild(spBack);

	var spSlides = document.createElement("span");

	spSlides.style.width = "410px";

	spSlides.style.height = "190px";

	spSlides.style.overflow = "hidden";

	spSlides.style.position = "absolute";

	spSlides.style.left = "0px";

	spSlides.style.top = "0px";

	var slides = document.createElement("span");

	slides.id = "slides";

	// Create main menu items

	for (var i = 0; i < slideContent.length; i++) {

		var slide = document.createElement("span");

		slide.id = "slide"+i;

		slide.className = "slide";

		// Add precached image to slide

		var imgObj = images[i];

		var imgSrc = imgObj.src;

		var imgWidth = imgObj.width;

		var imgHeight = imgObj.height;

		var img = createImage(imgSrc, imgWidth, imgHeight, "sldImg"+i);

		var imgSpan = document.createElement("span");

		imgSpan.id = "sldImgSpan"+i;

		imgSpan.style.zIndex = "0";

		imgSpan.appendChild(img);

		slide.appendChild(imgSpan);

		// Add text

		var txt = document.createTextNode(i+1);

		var txtSpan = document.createElement("span");

		txtSpan.id = "sldTxtSpan"+i;

		txtSpan.style.zIndex = "1";

		txtSpan.className = "slidetext";

		txtSpan.appendChild(txt);

		slide.appendChild(txtSpan);

		// Add slide to slide group

		slides.appendChild(slide);

	}

	// Add slide group to slideshow

	spSlides.appendChild(slides);

	slideShow.appendChild(spSlides);

	// Add slideshow to document

	//document.body.appendChild(slideShow);

	var prt = document.getElementById("sshowPrt");

	prt.appendChild(slideShow);

	var totalWidth = 0;

	for (var i = 0; i < slideContent.length; i++) {

		// Position slides

		var slide = document.getElementById("slide"+i);

		var imgSpan = document.getElementById("sldImgSpan"+i);

		var txtSpan = document.getElementById("sldTxtSpan"+i);

		slide.style.position = "absolute";

		slide.style.left = totalWidth + "px";

		slide.style.top = "0px";

		imgSpan.style.position = "absolute";

		imgSpan.style.left = "40px";

		imgSpan.style.top = (slideShow.offsetHeight-imgSpan.offsetHeight)/2 + "px";

		txtSpan.style.position = "absolute";

		txtSpan.style.left = "40px";

		txtSpan.style.top = "10px";

		if (slide.offsetWidth >= spSlides.offsetWidth) {

			totalWidth += slide.offsetWidth;

		} else {

			totalWidth += slide.offsetWidth + (spSlides.offsetWidth - slide.offsetWidth);

		}

	}

	//slides.style.width = totalWidth + "px";

	slides.style.position = "absolute";

	slides.style.left = "0px";

	// Position slideshow

	slideShow.style.position = "absolute";

	slideShow.style.top = y + "px";

	slideShow.style.left = x + "px";

	initCtrl();

	timeSlide();

}



// Create slideshow controls

function initCtrl() {

	var ctrl = document.createElement("div");

	ctrl.id = "ctrl";

	for (var i = 0; i < slideContent.length; i++) {		

		var item = document.createElement("span");

		item.id = "ctrlItem"+i;

		// Add bottom image

		var img = createImage("ctrl_up.gif", 10, 10, "ctrlImg"+i);

		var imgSpan = document.createElement("span");

		imgSpan.id = "ctrlImgSpan"+i;

		imgSpan.style.zIndex = "0";

		imgSpan.appendChild(img);

		item.appendChild(imgSpan);

		// Add top image

		var img2 = createImage("ctrl_over.gif", 10, 10, "ctrlImg2"+i);

		var imgSpan2 = document.createElement("span");

		imgSpan2.id = "ctrlImgSpan2"+i;

		imgSpan2.style.zIndex = "1";

		imgSpan2.appendChild(img2);

		item.appendChild(imgSpan2);

		var img3 = createImage("ctrl_down.gif", 10, 10, "ctrlImg3"+i);

		var imgSpan3 = document.createElement("span");

		imgSpan3.id = "ctrlImgSpan3"+i;

		imgSpan3.style.zIndex = "2";

		imgSpan3.appendChild(img3);

		item.appendChild(imgSpan3);

		//Add item to submenu

		ctrl.appendChild(item);

	}

	// Add slideshow controls to document

	//document.body.appendChild(ctrl);

	var prt = document.getElementById("sshowPrt");

	prt.appendChild(ctrl);

	var totalWidth = 0;

	for (var i = 0; i < slideContent.length; i++) {	

		// Position ctrl item

		var imgSpan = document.getElementById("ctrlImgSpan"+i);

		var imgSpan2 = document.getElementById("ctrlImgSpan2"+i);

		var imgSpan3 = document.getElementById("ctrlImgSpan3"+i); 

		var img = document.getElementById("ctrlImg"+i);

		var img2 = document.getElementById("ctrlImg2"+i);

		var img3 = document.getElementById("ctrlImg3"+i);

		imgSpan.style.position = "absolute";

		imgSpan.style.left = totalWidth + "px";

		imgSpan2.style.position = "absolute";

		imgSpan2.style.left = imgSpan.offsetLeft + "px";

		imgSpan3.style.position = "absolute";

		imgSpan3.style.left = imgSpan.offsetLeft + "px";

		if (MSIE) {

			img.style.filter = "alpha(opacity=100)";

			img2.style.filter = "alpha(opacity=100)";

			img3.style.filter = "alpha(opacity=100)";

			imgSpan.style.filter = "alpha(opacity=100)";

			imgSpan2.style.filter = "alpha(opacity=0)";

			imgSpan3.style.filter = "alpha(opacity=0)";

		} else {

			imgSpan.style.opacity = "100";

			imgSpan2.style.opacity = "0";

			imgSpan3.style.opacity = "0";

		}

		// Add events

		var item = document.getElementById("ctrlItem"+i);

		addEvent(item, "mouseover", fadeCtrl);

		addEvent(item, "mouseout", fadeCtrl);

		addEvent(item, "click", selectCtrl);

		addEvent(item, "click", startSlide);

		totalWidth += imgSpan.offsetWidth + 4;

	}

	// Position slideshow controls

	var slideShow = document.getElementById("slideShow");

	var x = slideShow.offsetLeft + slideShow.offsetWidth - (totalWidth + 40);

	var y = slideShow.offsetTop + slideShow.offsetHeight - 20;

	ctrl.style.position = "absolute";

	ctrl.style.left = x + "px";

	ctrl.style.top = y + "px";

	selectCtrl();

}



// Fade control items

function fadeCtrl(evt) {

	var index;

	evt = (evt) ? evt : ((window.event) ? window.event : null);

	if (evt) {

		var target = (MSIE) ? evt.srcElement : evt.target;

		var id = target.id;

		index = parseInt(id.substr(id.length-1));

	}

	if (index != undefined) {

		if (evt.type == "mouseover") {

			if (ctrlIntvl) { clearInterval(ctrlIntvl); }

			ctrlIntvl = (MSIE) ? setInterval(function(){fadec(index);}, ctrlSpeed) : setInterval(fadec, ctrlSpeed, index);

		} else {

			if (ctrlIntvl) { clearInterval(ctrlIntvl); }

			ctrlIntvl = (MSIE) ? setInterval(function(){fadec();}, ctrlSpeed) : setInterval(fadec, ctrlSpeed);

		}

	}

}



function fadec(index) {

	var done = true;

	var step = 0.1;

	for (var i = 0; i < slideContent.length; i++) {	

		var ctrlImgSpan = document.getElementById("ctrlImgSpan"+i);

		var ctrlImgSpan2 = document.getElementById("ctrlImgSpan2"+i);

		var o = (MSIE) ? ctrlImgSpan2.filters.alpha.opacity/100 : parseFloat(ctrlImgSpan2.style.opacity);

		if (index != undefined && 

			i == index) 

		{	

			if (o < 1) {

				(Math.abs(o-1) > step) ? o += step : o = 1;

				done = false;

			}

		} else {

			if (o > 0) {

				(Math.abs(o) > step) ? o -= step : o = 0;

				done = false;

			}

		}

		(MSIE) ? ctrlImgSpan2.style.filter = "alpha(opacity="+(o*100)+")" : ctrlImgSpan2.style.opacity = o.toString();

	}

	if (done) {

		clearInterval(ctrlIntvl);

	}

}



function selectCtrl(evt) {

	var index;

	evt = (evt) ? evt : ((window.event) ? window.event : null);

	if (evt) {

		var target = (MSIE) ? evt.srcElement : evt.target;

		var id = target.id;

		index = parseInt(id.substr(id.length-1));

	} else {

		index = curIndex;

	}

	if (index != undefined) {

		for (var i = 0; i < slideContent.length; i++) {	

			var ctrlImgSpan3 = document.getElementById("ctrlImgSpan3"+i);

			var o = (MSIE) ? ctrlImgSpan3.filters.alpha.opacity/100 : parseFloat(ctrlImgSpan3.style.opacity);

			if (i == index) {

				o = 1;

			} else {

				o = 0;

			}

			(MSIE) ? ctrlImgSpan3.style.filter = "alpha(opacity="+(o*100)+")" : ctrlImgSpan3.style.opacity = o.toString();

		}

	}

}



// Time slideshow

function timeSlide() {

	if (sldTmtIntvl) { clearTimeout(sldTmtIntvl); }

	sldTmtIntvl = (MSIE) ? setTimeout(function(){rotateSlide();}, 5000) : setTimeout(rotateSlide, 5000);

}



function rotateSlide() {

	(curIndex < slideContent.length-1) ? curIndex++ : curIndex = 0;

	if (curIndex == 0) {

		var slides = document.getElementById("slides");

		slides.style.left = "0px";

	}

	startSlide();

	selectCtrl();

}



// Fade main menu tabs

function startSlide(evt) {

	var index;

	evt = (evt) ? evt : ((window.event) ? window.event : null);

	if (evt) {

		var target = (MSIE) ? evt.srcElement : evt.target;

		var id = target.id;

		index = parseInt(id.substr(id.length-1));

		curIndex = index;

	} else {

		index = curIndex;

	}

	if (index != undefined) {

		if (sldTmtIntvl) { clearTimeout(sldTmtIntvl); }

		if (sldIntvl) { clearInterval(sldIntvl); }

		sldIntvl = (MSIE) ? setInterval(function(){slide(index);}, sldSpeed) : setInterval(slide, sldSpeed, index);

	}

}



function slide(index) {

	var slides = document.getElementById("slides");

	var slide = document.getElementById("slide"+index);

	var x = slides.offsetLeft;

	var newX = -slide.offsetLeft;

	var step = Math.ceil(Math.abs(x-newX)/8);

	if (x != newX) {

		if (x > newX) {

			(Math.abs(x-newX) > step) ? x -= step : x = newX;

		} else {

			(Math.abs(x-newX) > step) ? x += step : x = newX;

		}

	} else {

		clearInterval(sldIntvl);

		timeSlide();

	}

	slides.style.left = x + "px";

}



//item.style.mozOpacity = "0.2";

//item.style.filter = "alpha(opacity=25)";

//item.style.opacity = "0.2";