// Scripts for the Portal home page
// Slideshow and Carousel
// State of California
// 5/19/2010

var Carousel = {
	widthOfEachImg:50, // width of each image, including padding
	totalNumberOfImgs:12,
	numberOfVisibleImgs:6, // Number of images to show at a time
	speed:20, // number of pixels to move each cycle

	currentOffset: 0,
	scrollTimerID: null,
	direction: -1, // -1 = right arrow/move left, 1 = left arrow/move right
	counterA: 0,

	fControl:function (paramDirection) {
		if (!Carousel.scrollTimerID) {
			if (((paramDirection == 1) && (Carousel.currentOffset < 0)) || ((paramDirection == -1) && (Carousel.currentOffset > (-1)*Carousel.widthOfEachImg*(Carousel.totalNumberOfImgs-Carousel.numberOfVisibleImgs)))) {
				Carousel.direction = paramDirection;
				Carousel.counterA = 0;
				Carousel.fPerformScroll();
			}
		}
	},
	
	fPerformScroll:function () { // loops during scroll
		Carousel.currentOffset += Carousel.direction * Carousel.speed;
		Carousel.counterA += Carousel.speed;
		document.getElementById("carousel_slider").style.left = Carousel.currentOffset + "px";
		if (Carousel.counterA < Carousel.widthOfEachImg * Carousel.numberOfVisibleImgs) {
			Carousel.scrollTimerID = setTimeout(Carousel.fPerformScroll,50); // short pause, recurse to continue scroll.
		} else {
			// Finished scroll
			Carousel.scrollTimerID = null;
			if (Carousel.currentOffset < 0) {
				document.getElementById("carousel_left_arrow").style.backgroundPosition = '0px 0px'; // left arrow enabled
			} else {
				document.getElementById("carousel_left_arrow").style.backgroundPosition = '-60px 0px'; // left arrow disabled
			}
			if (Carousel.currentOffset > (-1)*Carousel.widthOfEachImg*(Carousel.totalNumberOfImgs-Carousel.numberOfVisibleImgs)) {
				document.getElementById("carousel_right_arrow").style.backgroundPosition = '-30px 0px'; // right arrow enabled
			} else {
				document.getElementById("carousel_right_arrow").style.backgroundPosition = '-90px 0px'; // right arrow disabled
			}
		}
	}
}

var SlideShow = {
	delayMS: 8000, // Delay before displaying next image, in milliseconds
	bPlaying: 1, // 1 = playing, 0 = paused

	arrayImgs: null, // Array of anchors
	currentIndex: 0, // Index of current image
	nextIndex: 1, // Index of next image
	mainTimerID: null,
	fadeTimerID: null,
	counterZ: 2, // counter, used for z-index of front image

	fMainLoop:function () { /* main loop, repeats every x seconds */

		for(counterI = 0; counterI < arrayImgs.length; counterI++) {
			document.getElementById("slide_show_control_" + (counterI+1)).className = "";
		}
		document.getElementById("slide_show_control_" + (SlideShow.nextIndex+1)).className = "slide_show_control_highlight";

		arrayImgs[SlideShow.nextIndex].xOpacity = 0; // Set opacity of next image to 0
		SlideShow.fSetOpacity(arrayImgs[SlideShow.nextIndex]);

		SlideShow.counterZ++;
		arrayImgs[SlideShow.nextIndex].style.zIndex = SlideShow.counterZ; // Place next <a> on top

		SlideShow.fCrossFade(); // do fade

		if (SlideShow.bPlaying)
			SlideShow.mainTimerID = setTimeout(SlideShow.fMainLoop,SlideShow.delayMS); // delay, recurse
	},

	fCrossFade:function () { /* loops during fade */
		SlideShow.fadeTimerID = null;
		arrayImgs[SlideShow.nextIndex].xOpacity += .20; // fade in
		arrayImgs[SlideShow.currentIndex].xOpacity -= .20; // fade out
		
		SlideShow.fSetOpacity(arrayImgs[SlideShow.nextIndex]);
		SlideShow.fSetOpacity(arrayImgs[SlideShow.currentIndex]);
		
		if (arrayImgs[SlideShow.nextIndex].xOpacity >= .99) {
			// done with fade

			SlideShow.currentIndex = SlideShow.nextIndex;
	
			SlideShow.nextIndex = (SlideShow.currentIndex < arrayImgs.length - 1) ? SlideShow.currentIndex + 1 : 0; // index of next img

			for(counterJ = 0; counterJ < arrayImgs.length; counterJ++) {
				if (SlideShow.currentIndex != counterJ) {
					arrayImgs[counterJ].xOpacity = 0; /* Make sure all other images are transparent. Fix problem where user clicks arrows rapidly. */
					SlideShow.fSetOpacity(arrayImgs[counterJ]);
				}
			}
		} else {
			SlideShow.fadeTimerID = setTimeout(SlideShow.fCrossFade,50); // short pause, recurse to continue fade.
		}

	},

	fSetOpacity:function (obj) {
		if (obj.xOpacity > .99) {
			obj.xOpacity = .99;
		}
		obj.style.opacity = obj.xOpacity; // the CSS3 method, for newer Mozilla, Safari, Opera
		obj.style.MozOpacity = obj.xOpacity; // older Mozilla
		obj.style.filter = "alpha(opacity=" + (obj.xOpacity * 100) + ")"; // for IE
	},

	fControl:function (controlParam) { /* called when a button is clicked */
		if (!SlideShow.fadeTimerID) {
			if (controlParam == "prev"){
				clearTimeout (SlideShow.mainTimerID);
				SlideShow.nextIndex = (SlideShow.currentIndex > 0) ? SlideShow.currentIndex - 1 : arrayImgs.length - 1; // index of prev img
				SlideShow.fMainLoop();
			} else if (controlParam == "next"){
				clearTimeout (SlideShow.mainTimerID);
				SlideShow.fMainLoop();
			} else {
				if (SlideShow.currentIndex != controlParam - 1) {
					SlideShow.nextIndex = controlParam - 1;
					clearTimeout (SlideShow.mainTimerID);
					SlideShow.fMainLoop();
				}
			}
		}
	},

	initialize:function () {

		if (document.getElementById && document.getElementById("slide_show_container")) { // Make sure browser supports getElementById and div "slide_show_container" exists

			var newAnchor;

			//document.getElementById("slide_show_container").className += " javascript_enabled";
	
			// create array of all img nodes
			arrayImgs = document.getElementById("slide_show_images").getElementsByTagName("a");

			// append a linked number for each image
			for(counterI = 0; counterI < arrayImgs.length; counterI++) {
				newAnchor = document.createElement('a');
				newAnchor.appendChild(document.createTextNode(counterI + 1)); // insert the image number as text
				newAnchor.href = "#";
				newAnchor.onclick = new Function("SlideShow.fControl(" + (counterI + 1) + ");this.blur();return false;"); // added blur to remove outlines in IE
				newAnchor.id = "slide_show_control_" + (counterI + 1);
				document.getElementById('slide_show_numbers').appendChild(newAnchor);
				
				arrayImgs[counterI].xOpacity = (counterI == 0) ? 1 : 0;
				SlideShow.fSetOpacity(arrayImgs[counterI]);
			}

			document.getElementById("slide_show_control_" + (SlideShow.currentIndex+1)).className = "slide_show_control_highlight";
			
			// display first img
			arrayImgs[SlideShow.currentIndex].style.zIndex = SlideShow.counterZ; // Place first <a> on top

			SlideShow.mainTimerID = setTimeout(SlideShow.fMainLoop,SlideShow.delayMS);
		}
	}
}

addLoadEvent(SlideShow.initialize);

// Preload the first slideshow image (fixing an IE8 issue, blank slideshow section)
if (document.images) {
	var img1 = new Image();
	img1.src = "images/home/slideshow_data_ca_gov.png";
	var img2 = new Image();
	img2.src = "../images/home/slideshow_mobile_ca_gov.png";
	var img3 = new Image();
	img3.src = "../images/home/slideshow_weconnect_net_png";
	var img4 = new Image();
	img4.src = "../images/home/slideshow_schoolfinder_ca_gov.png";
	var img5 = new Image();
	img5.src = "../images/home/slideshow_video_dot_ca_gov.png";
	var img6 = new Image();
	img6.src = "../images/home/slideshow_driveclean_ca_gov.png";
}