
if (!window['$hnj'] || !$hnj.registry.included('/scripts/components/homecalloutlisthtmlcomponent.js')) { 
$hni.components.htmlCalloutListHtmlComponent = function(elementId, calloutConfig) {
	var base = new $hni.components.manager(elementId);
	var rotateDelayInSeconds = 5;
	var activeIndex = 0;
	var rotateTask = null;
	
	var callouts = [];
	for (var i = 0; i < calloutConfig.length; i++) {
	    $hnj("<img>").attr("src", calloutConfig[i].bgImagePath);
		callouts[i] = {
			blockElement: $hnj('#' + calloutConfig[i].blockId),
			tabElement: $hnj('#' + calloutConfig[i].tabId),
			activeBlockClasses: calloutConfig[i].activeBlockClasses,
			activeTabClasses: calloutConfig[i].activeTabClasses
		};
	}
	
	var instance = $hnj.extend(
		base,
		{
			activate: function(index) {
				if (callouts.length > 1) {
					rotateTask.cancel();
				}
				if (index != activeIndex) {
					callouts[activeIndex].blockElement.removeClass(callouts[activeIndex].activeBlockClasses.join(' '));
					callouts[index].blockElement.addClass(callouts[index].activeBlockClasses.join(' '));
					callouts[activeIndex].tabElement.removeClass(callouts[activeIndex].activeTabClasses.join(' '));
					callouts[index].tabElement.addClass(callouts[index].activeTabClasses.join(' '));
					activeIndex = index;
				}
				if (callouts.length > 1) {
					rotateTask.restart();
				}
			},
			rotate: function() {
				this.activate(activeIndex < callouts.length - 1 ? activeIndex + 1 : 0);
			}
		});
	rotateTask = $hnj.delay($hnj.delegate(instance.rotate, instance), rotateDelayInSeconds * 1000);
	return instance;
};

}
if (window['$hnj']) { $hnj.registry.register('/scripts/components/homecalloutlisthtmlcomponent.js', false); };

