/* Syfy Top Feature Rotator
 * syfyTopFeatureRotator('id of div to bind to', 'json object of content', 'options')
 * style w/ CSS
 * use in conjunction w/ leaf module TopFeature class to build json object of content
 */

function syfyTopFeatureRotator(containerName, items, options) {
	var self;
	self=this;
	
	this.containerElement = $(document.getElementById(containerName));
	this.featureItems = items;
	this.currentIndex = null;

	if (options === undefined) { options = {} }

	if (options.totalItems) {
		this.totalItems = options.totalItems;
	} else {
		this.totalItems = this.featureItems.length;
	}

	this.rotateIntervalMS = 6000;
	this.rotateInterval = null;

	// build the items
	this.containerElement.append('<div id="top-feature"></div>');
	this.containerElement.append('<div id="on-chiller"><h1>on chiller</h1><ul id="dl-nav"></ul></div>');
	for (var i=0;i<this.totalItems;i++) {
		var item = this.featureItems[i];
		// barf, template this
		this.buildFeature(item,i);
		this.buildButton(item,i);
	}

	this.moveTo(0);

	$(document).ready(function() {
		self.rotateInterval = window.setInterval(function() { self.moveTo(self.nextIndex()); }, self.rotateIntervalMS);		
	});
	
}

syfyTopFeatureRotator.prototype.darkenColor = function(color, percent) {
	var rgb = { r: parseInt(color.substr(0,2), 16), g: parseInt(color.substr(2,2), 16), b: parseInt(color.substr(4,2), 16) }
	var newcolor = '';
	for (c in rgb) {
		var wonk = (rgb[c] - Math.round((rgb[c]/100)*percent)).toString(16);
		if (wonk.length < 2) { wonk = '0'+wonk; }
		newcolor += wonk;
	}
	return(newcolor);
}

syfyTopFeatureRotator.prototype.buildFeature = function(item,i) {
	// feature
	var htmlstring = '<div id="feature-info" style="position: absolute; display: none;"><a href="'+item.itemURL+'"><h1>'+item.itemTitle+'</h1><h2>'+item.itemShortDescription+'</h2><p>'+item.itemLongDescription+'</p></a></div>';
	htmlstring +=	'<div id="feature-img" style="position: absolute; display: none;"><a href="'+item.itemURL+'"><img alt="'+item.itemTitle+'" src="'+item.itemFeatureImage+'"></a></div>';
	var element = $(htmlstring);
	element.appendTo('#top-feature');
	if (window['Cufon'] != undefined) { 
			Cufon.replace('#top-feature #feature-info h1');
			Cufon.replace('#top-feature #feature-info h2'); 
			Cufon.replace('#top-feature #feature-info p');
			Cufon.replace('#on-chiller h1');
	}
	this.featureItems[i].featureElement = element;

}

syfyTopFeatureRotator.prototype.buildButton = function(item,i) {
	var self;
	self=this;
	htmlstring = '<li><a href="'+item.itemURL+'"><div class="carousel-item clearfix"><div class="carousel-thump"><img width="64" height="64" alt="carousel thumpnail" src="'+item.itemThumbnail+'"></div><h1>'+item.itemTitle+'</h1><h2>'+item.itemShortDescription+'</h2></div></a></li>';

	var element = $(htmlstring);
	element.appendTo('#dl-nav');
	if (window['Cufon'] != undefined) { 
			Cufon.replace('#dl-nav li h1');
			Cufon.replace('#dl-nav li h2'); 
	}
	this.featureItems[i].buttonElement = element;

	// bind
	element.mouseover(function() {
		if (self.rotateInterval) {
			window.clearInterval(self.rotateInterval);
		}
		if (!$(this).children().children().hasClass('carousel-item-over')) {
			self.moveTo(i);
		}
	});

	element.mouseout(function() {
		self.rotateInterval = window.setInterval(function() { self.moveTo(self.nextIndex()); }, self.rotateIntervalMS);
	});

}

syfyTopFeatureRotator.prototype.moveTo = function(index) {

	if (this.currentIndex != null) {
		var currentItem = this.featureItems[this.currentIndex];
		currentItem.featureElement.stop(true,true).fadeOut();	
		currentItem.buttonElement.children().children().removeClass('carousel-item-over');
		currentItem.buttonElement.children().children().addClass('carousel-item');
		currentItem.buttonElement.children().children().addClass('clearfix');			
	}
	var targetItem = this.featureItems[index];
	targetItem.featureElement.stop(true,true).fadeIn();
	targetItem.buttonElement.children().children().removeClass('carousel-item');
	targetItem.buttonElement.children().children().removeClass('clearfix');
	targetItem.buttonElement.children().children().addClass('carousel-item-over');
	this.currentIndex = index;
	if (window['Cufon'] != undefined) { 
			Cufon.replace('#dl-nav li h1');
			Cufon.replace('#dl-nav li h2'); 
		}
}


syfyTopFeatureRotator.prototype.nextIndex = function() {
	if (this.currentIndex == (this.totalItems-1)) {
		return(0);
	} else {
		return(this.currentIndex+1);
	}
}