
/*
* @object cci
*/



if(!(typeof cci == 'object' ) && true) {
	cci = {};
	cci.utils = {};
}

/*
* utils namespace for various utility fuctions
* @object cci.utils
*/

/*
	Carousel - Template designed to paginate through a group of items

	This carousel script updated from lib.js version - 02-2010
	Updated features inlude:
		-No restriction on element names for container and items to be put in carousel
		-Increased reliance on YUI tools for Dom Selection
		-Improved event handling
	Notes:
		-Temporarily disabled rewriting of img attrs (unsure of why this was being done)
		-Disabled building of extra navigation features not needed for typical image carousel
		-Animation on page load disabled.
*/

cci.carousel = {
	carousels : [],
	initialize:function(element){

		var instance = {};

		// Declaring and Setting Object References
		instance.self = element;
		instance.itemContainer = YAHOO.util.Dom.getElementsByClassName('carousel_items', '*', instance.self)[0];
		instance.arrayOfItems = YAHOO.util.Dom.getElementsByClassName('carousel_item', '*', instance.self);

		instance.miniSlide;
		instance.miniSlides = [];
		instance.loader;
		instance.itemCaptionContainer;
		instance.itemCaption;

		// Populating Properties
		instance.layoutType = instance.itemContainer.getAttribute("name"); // vertical | standard
		instance.totalItems = instance.arrayOfItems.length;

		instance.itemsPerSlide = element.getAttribute("alt");
		instance.totalSlides = Math.ceil(instance.totalItems / instance.itemsPerSlide);
		instance.viewingSlide = 0;
		instance.nextSlide = 0;
		instance.navigationLocked = false;
		instance.carouselWidth = instance.self.offsetWidth;
		instance.transitionType = element.getAttribute("name");

		//for vertical layout draw item caption
		if (instance.layoutType == "vertical") {
			buildItemCaption(self,true);
		}

		if((instance.layoutType == "vertical") && (instance.arrayOfItems.length == 1)) {
			buildPagination('empty');
		}
		else{
			buildPagination('full');
		}


		// Load Slides and Display First Slide:
		var slide1 = document.createElement("div");
		YAHOO.util.Dom.addClass(slide1, "carousel_slide");
		slide1.style.display = "none";
		slide1.style.position = "absolute";
		slide1.style.width = instance.carouselWidth + "px";
		instance.itemContainer.appendChild(slide1);
		instance.slideToShow = slide1;

		var slide2 = slide1.cloneNode(true);
		instance.itemContainer.appendChild(slide2);
		instance.slideToHide = slide2;


		 // Populating First Slide
		instance.slideToShow.innerHTML = "";
		if(instance.viewingSlide >= instance.totalSlides){
			instance.viewingSlide = 0;
			instance.nextSlide = 1;
		}
		instance.viewingSlide++;
		instance.nextSlide = instance.viewingSlide + 1;

		var multiple = instance.viewingSlide * instance.itemsPerSlide;
		var placement = multiple - (instance.itemsPerSlide - 1);

		for(var i=0; i<instance.itemsPerSlide; i++){
			var itemToPlace = instance.arrayOfItems[(placement + i) -1];

			if (navigator.userAgent.toLowerCase().indexOf('firefox') > -1) {

				if (itemToPlace){
					var clonedItem = itemToPlace.cloneNode(true);
					instance.slideToShow.appendChild(clonedItem);
				}
			} else {
				if (instance.arrayOfItems[(placement + i) -1]){
					var clonedItem = document.createElement("li");
					clonedItem.className = "carousel_item";
                                        var clonedItemHTML = instance.arrayOfItems[(placement + i) -1].innerHTML;
                                        clonedItem.innerHTML = clonedItemHTML.replace(/\n/g, ' ').replace(/<script.*?>.*<\/script>/gi, '');

					instance.slideToShow.appendChild(clonedItem);
				}
		 	}
		}


		// display first slide without animation

		instance.slideToShow.style.display = "block";
	        instance.slideToHide.style.display = "block";
		cci.carousel.utils.setCarouselHeight(instance);
		instance.slideToShow.style.left = '0';
		instance.slideToHide.style.left = '560px';

		// var slideIn = new YAHOO.util.Anim(instance.slideToShow, {left: { from: showFrom, to: showTo }}, 0);
		// slideIn.animate();

		// var slideOut = new YAHOO.util.Anim(instance.slideToHide, {left: { from: hideFrom, to: hideTo }}, .5, YAHOO.util.Easing.easeOut);
		// slideOut.animate();
		/*
		slideOut.onComplete.subscribe(function(){
			instance.navigationLocked = false;
		});
		*/






		// Try to set size of carousel:
		cci.carousel.utils.setCarouselHeight(instance);
		function buildPagination(type){

			// Create Container
			var pagination_container = document.createElement("div");
			instance.self.appendChild(pagination_container);
			YAHOO.util.Dom.addClass(pagination_container, "carousel_pagination");

			if(type!="empty") {

				// Create Previous Button
				var previous_button = document.createElement("a");
				previous_button.setAttribute('href','#');
				previous_button.innerHTML = 'previous';

				YAHOO.util.Event.addListener(previous_button, "click", function(e){

						previousSlide(instance);
						//for vertical layout draw header
						if (instance.layoutType == "vertical") {
							buildItemCaption(instance,false);
						}
						this.blur();
						if (e.preventDefault)
							e.preventDefault();
						else
							e.returnValue = false;
				});

				pagination_container.appendChild(previous_button);
				YAHOO.util.Dom.addClass(previous_button, "carousel_previous");

				// Create Next Button
				var next_button = document.createElement("a");
				next_button.innerHTML = 'next';
				next_button.setAttribute("href", "#");

				YAHOO.util.Event.addListener(next_button, "click", function(e){

					nextSlide(instance);
					//for vertical layout draw header
					if (instance.layoutType == "vertical") {
						buildItemCaption(instance,false);
					}
					this.blur();
					if (e.preventDefault)
						e.preventDefault();
					else
						e.returnValue = false;
				});

				pagination_container.appendChild(next_button);
				YAHOO.util.Dom.addClass(next_button, "carousel_next");
			}


				/*
			// disabling other navigation element
			if (instance.layoutType == "standard") {
				// Create MiniSlide Container
				instance.miniSlide = document.createElement("div");
				pagination_container.appendChild(instance.miniSlide);
				YAHOO.util.Dom.addClass('foo', 'baz');(instance.miniSlide, "mini_slides");

				// Creating MiniSlides
				for (i=0; i<instance.totalSlides; i++){
					instance.miniSlides[i] = buildMiniSlides(i);
				}


			// Build Loading Animation
			instance.loader = document.createElement("div");
			pagination_container.appendChild(instance.loader);
			YAHOO.util.Dom.addClass('foo', 'baz');(instance.loader, "loading_container");
			var loaderImage = document.createElement("img");
			loaderImage.setAttribute("src", "http://demo-static.blackplanet.com/shared/images/carousel/loader.gif");
			loaderImage.setAttribute("width", "70");
			loaderImage.setAttribute("height", "12");
			instance.loader.appendChild(loaderImage);
			instance.loader.style.display = "none";
			}
			*/


		}

		function buildItemCaption(self,init) {
			//item caption is only supported in vertical layout and is appended to head of carousel
				if (instance.layoutType == "vertical" && (instance.arrayOfItems.length != 1)) {
					var currentItem = instance.viewingSlide;

					if (init == true) { currentItem = instance.viewingSlide + 1; }
					instance.itemCaption = "<div class='itemCaptionContainer'><h4>" + currentItem + " of " + instance.totalSlides + "<\/h4><\/div>";

					var carousel_header = getElementsByClassName(instance.self, "div", 'carousel_head')[0];
					carousel_header.innerHTML = instance.itemCaption;
				}
		}

		function buildMiniSlides(count){
			var miniSlideTmpl = document.createElement("a");
			miniSlideTmpl.setAttribute("href", "#");
			miniSlideTmpl.id = count.toString();
			miniSlideTmpl.onclick = function(){

				if((parseInt(this.id)+1) != instance.viewingSlide){
					instance.viewingSlide = parseInt(this.id);
					nextSlide(instance);
				}
				this.blur();
				return false;
			};
			var miniSlideTmplSpan = document.createElement("span");
			var miniSlideTmplSpanText = document.createTextNode("W");

			instance.miniSlide.appendChild(miniSlideTmpl);
			miniSlideTmpl.appendChild(miniSlideTmplSpan);
			miniSlideTmplSpan.appendChild(miniSlideTmplSpanText);
			instance.miniSlides[count] = miniSlideTmpl;

			return miniSlideTmpl;
		}

		function nextSlide(){
			if(instance.navigationLocked != true){
				instance.navigationLocked = true;
				// Swap Slides References
				var slideToHideRef = instance.slideToHide;
				instance.slideToHide = instance.slideToShow;
				instance.slideToShow = slideToHideRef;
				// Populate Next Slide
				cci.carousel.utils.populateSlide(instance, "next");
			}
		}

		function previousSlide(){
			if(instance.navigationLocked != true){
				instance.navigationLocked = true;
				// Swap Slides References
				var slideToHideRef = instance.slideToHide;
				instance.slideToHide = instance.slideToShow;
				instance.slideToShow = slideToHideRef;

				// Populate Next Slide
				cci.carousel.utils.populateSlide(instance, "previous");
			}
		}

		return instance;

	},

		setMiniSlideNavHLite:function(instance, selectedNum){
		for(i=0; i<instance.miniSlides.length; i++){
			if(instance.miniSlides[i].className){
				YAHOO.util.Dom.removeClass(instance.miniSlides[i], "selected");
			}
		}
		YAHOO.util.Dom.addClass(instance.miniSlides[selectedNum], "selected");
	},

	utils : {

		setCarouselHeight:function(instance){
			// Set height of carousel content based off of cotents height
			if (instance.layoutType == "standard") {
				instance.carouselHeight = instance.slideToShow.offsetHeight;
				instance.itemContainer.style.height = instance.carouselHeight + "px";
			}
		},

		populateSlide:function(instance, direction){

			instance.slideToShow.innerHTML = "";
			if(direction == "next"){
				if(instance.viewingSlide >= instance.totalSlides){
					instance.viewingSlide = 0;
					instance.nextSlide = 1;
				}
				instance.viewingSlide++;
				instance.nextSlide = instance.viewingSlide + 1;
			}
			if(direction == "previous"){
				instance.viewingSlide--;
				instance.nextSlide = instance.viewingSlide - 1;

				if(instance.viewingSlide == 0){
					instance.viewingSlide = instance.totalSlides;
					instance.nextSlide = instance.totalSlides - 1;
				}
			}

			var multiple = instance.viewingSlide * instance.itemsPerSlide;
			var placement = multiple - (instance.itemsPerSlide - 1);

			for(var i=0; i<instance.itemsPerSlide; i++){

                            var itemToPlace = instance.arrayOfItems[(placement + i) -1];
				if (navigator.userAgent.toLowerCase().indexOf('firefox') > -1) {

					if (itemToPlace){
						var clonedItem = itemToPlace.cloneNode(true);
						instance.slideToShow.appendChild(clonedItem);
					}
				} else {
					if (instance.arrayOfItems[(placement + i) -1]){
						var clonedItem = document.createElement(itemToPlace.tagName);
						clonedItem.className = itemToPlace.className;
						clonedItem.innerHTML = instance.arrayOfItems[(placement + i) -1].innerHTML;
						instance.slideToShow.appendChild(clonedItem);
				}
		 	}
			}

			cci.carousel.utils.prepItem(instance);
			if (instance.layoutType == "standard") {
			 //	cci.carousel.setMiniSlideNavHLite(instance, instance.viewingSlide - 1);
			}
		},

		multiCallBack: {

			callBackCount: 0,

			itemAdded:function(){
				cci.carousel.utils.multiCallBack.callBackCount++;
			},
			itemLoaded:function(instance){
				cci.carousel.utils.multiCallBack.callBackCount--;
				cci.carousel.utils.multiCallBack.checkCount(instance);
			},
			checkCount:function(instance){
				if(cci.carousel.utils.multiCallBack.callBackCount == 0){
					// All content has finished loading, run the following functions:
					cci.carousel.utils.transitions.manager(instance);
					cci.carousel.utils.toggleLoader(instance);
				}
			}
		},

		toggleLoader:function(instance){
			/*
			if(instance.miniSlide.style.display == "none"){
				instance.loader.style.display = "none";
				instance.miniSlide.style.display = "block";
			} else {
				instance.loader.style.display = "block";
				instance.miniSlide.style.display = "none";
			}
			*/

		},


		prepItem:function(instance){

			if (instance.layoutType == "vertical") { cci.carousel.utils.transitions.manager(instance); return; }


			var images = instance.slideToShow.getElementsByTagName("IMG");
			if(images.length != 0 ){
				//cci.carousel.utils.toggleLoader(instance);
				for(i=0; i<images.length; i++){
					//if(hasClass(images[i], "not_prepped")){
						cci.carousel.utils.multiCallBack.itemAdded();
						// images[i].src = images[i].title;
						// images[i].title = "";
						//removeClass(images[i], "not_prepped");
						//addClass(images[i], "prepped");
						images[i].onload = function(){
							// OK to show this content
							//alert("here");
							cci.carousel.utils.multiCallBack.itemLoaded(instance);
						};
					//}
				}
				return instance.slideToShow;
			} else {
				cci.carousel.utils.transitions.manager(instance);
				return false;
			}

			cci.carousel.utils.transitions.manager(instance);
			return false;
			// cci.carousel.utils.transitions.manager(instance);
		},

		transitions : {

			manager:function(instance){
				switch (instance.transitionType){
					case "basic":
						cci.carousel.utils.transitions.basic(instance);
						break;
					case "fade":
						cci.carousel.utils.transitions.crossFade(instance);
						break;
					case "slide":
						if(instance.nextSlide > instance.viewingSlide){
							cci.carousel.utils.transitions.slide(instance, "right");
						} else {
							cci.carousel.utils.transitions.slide(instance, "left");
						}
						break;
					default:
						cci.carousel.utils.transitions.basic(instance);
				}
			},

			basic:function(instance){
				if (instance.slideToHide == null){
					showSlide(instance.slideToShow);
				}
				else {
					hideSlide(instance.slideToHide);
					showSlide(instance.slideToShow);
				}

				instance.navigationLocked = false;

				function showSlide(element){
					element.style.top = "0px";
					element.style.left = "0px";
					element.style.display = "block";
					cci.carousel.utils.setCarouselHeight(instance);
				}
				function hideSlide(element){
					element.style.top = "0px";
					element.style.left = "0px";
					element.style.display = "none";
				}
			},

			crossFade:function(instance){

				if (instance.slideToHide == null){
					// Do Nothing
				}
				else {
					instance.slideToShow.style.display = "block";
					instance.slideToHide.style.display = "block";
					cci.carousel.utils.setCarouselHeight(instance);

					var slideFadeIn = new YAHOO.util.Anim(instance.slideToShow, {opacity: { from: 0, to: 1 }}, 1, YAHOO.util.Easing.easeOut);
					slideFadeIn.animate();

					var slideFadeOut = new YAHOO.util.Anim(instance.slideToHide, {opacity: { from: 1, to: 0 }}, 1, YAHOO.util.Easing.easeOut);
					slideFadeOut.animate();
					slideFadeOut.onComplete.subscribe(function(){
						instance.navigationLocked = false;
					});
				}
			},

			slide:function(instance, direction){


				if(direction == "right"){
					var showFrom = instance.carouselWidth;
					var showTo = 0;
					var hideFrom = 0;
					var hideTo = instance.carouselWidth * (-1);
				} else {
					var showFrom = instance.carouselWidth * (-1);
					var showTo = 0;
					var hideFrom = 0;
					var hideTo = instance.carouselWidth;
				}

				instance.slideToShow.style.display = "block";
				instance.slideToHide.style.display = "block";
				cci.carousel.utils.setCarouselHeight(instance);

				var slideIn = new YAHOO.util.Anim(instance.slideToShow, {left: { from: showFrom, to: showTo }}, .5, YAHOO.util.Easing.easeOut);
				slideIn.animate();

				var slideOut = new YAHOO.util.Anim(instance.slideToHide, {left: { from: hideFrom, to: hideTo }}, .5, YAHOO.util.Easing.easeOut);
				slideOut.animate();
				slideOut.onComplete.subscribe(function(){
					instance.navigationLocked = false;
				});
			}

		},

		deBug:function(str){
			//document.body.innerHTML += str + "<br\/>";
		}
	}
}

