
var $E = YAHOO.util.Event,
$D = YAHOO.util.Dom,
$ = YAHOO.util.Dom.get;

YAHOO.namespace('IEDesign');

YAHOO.IEDesign.IVWidget = function () {

	var interval = false;

	var config = {
		
		contentClass : "iv-content",
		
		widgetClass : "iv-widget",
		
		tooltipClass : "iv-tooltip"
	
	}	
	
	
	function navClicked(e){
		
		
		var target = $E.getTarget(e);
		
		if (target.nodeName.toLowerCase() != 'li'){
		  return;
		}
		
		var n = target.innerHTML;		
		
		var bd = $D.getChildren(this)[1];
		
		contentId = $('iv' + this.id.substr(6));
		
		var contentEls = $D.getChildren($D.getChildren(contentId)[1]);//$D.getChildren(contentId)[1].getElementsByTagName('li');
		
		bd.innerHTML = contentEls[n-1].innerHTML;
		
		navButtons = $D.getChildren(target.parentNode);
		
		for (var i = 0; i < navButtons.length; i++){
			
			if (i != n-1){
				$D.removeClass(navButtons[i], 'selected');
			}else{
				$D.addClass(navButtons[i], 'selected');
			}
			
		}
		
		clearInterval(interval);	

	}
	
	function transformContent(el){
		
		var tmp = $D.getChildren(el);
		
		var newId = 'widget' + el.id.substr(2);
		
		var widget = document.createElement('div');		
		widget.id = newId;
		$D.addClass(widget, config.widgetClass);
		
		var hd = document.createElement('div'); $D.addClass(hd, 'hd');
		var bd = document.createElement('div'); $D.addClass(bd, 'bd'); bd.id = 'widget-content'
		var ft = document.createElement('div'); $D.addClass(ft, 'ft');
		
		widget.appendChild(hd);
		
		widget.appendChild(bd);
		
		var heading = tmp[0];
		
		hd.innerHTML = heading.innerHTML;
		
		$D.setStyle(heading, 'display', 'none');
		
		var navEl = document.createElement('ul');
		
		$D.addClass(navEl, 'iv-nav');
		
		//widgetEl.appendChild(contentEl);
		ft.appendChild(navEl);
		
		$E.on(navEl, 'click', navClicked, widget, true);
		
		var children = $D.getChildren(tmp[1]);
		
		for (var i = 1; i < children.length+1; i++){
			navEl.innerHTML += '<li id="sel-' + i + '">' + i + '</li>';	
		}
		
		bd.innerHTML = children[0].innerHTML;
		
		widget.appendChild(ft);
		
		$D.insertBefore(widget, el);
		
		$D.addClass($D.getChildren(navEl)[0], 'selected');
		
		//hide original content
		$D.setStyle(el, 'display', 'none');
		
		$E.on(navEl, 'selectstart', function(e){ $E.stopEvent(e); } );
		
		$E.on(navEl, 'mousedown', function(e){ $E.stopEvent(e); } );

		$E.on(bd, 'mousedown', function(e){ clearInterval(interval); $E.stopEvent(e);} );
		
		//work out how many we have then make them
            
		$E.on('sel-1', 'mouseover', function(e){var region = $D.getRegion(this); $D.setStyle('tooltip1', 'visibility', 'visible');$D.setXY('tooltip1', [region.left , region.top -27]); });
		$E.on('sel-1', 'mouseout', function(e){$D.setStyle('tooltip1', 'visibility', 'hidden');});
		
		$E.on('sel-2', 'mouseover', function(e){var region = $D.getRegion(this); $D.setStyle('tooltip2', 'visibility', 'visible');$D.setXY('tooltip2', [region.left , region.top -27]); });
		$E.on('sel-2', 'mouseout', function(e){$D.setStyle('tooltip2', 'visibility', 'hidden');});
		
		$E.on('sel-3', 'mouseover', function(e){var region = $D.getRegion(this); $D.setStyle('tooltip3', 'visibility', 'visible');$D.setXY('tooltip3', [region.left , region.top -27]); });
		$E.on('sel-3', 'mouseout', function(e){$D.setStyle('tooltip3', 'visibility', 'hidden');});
		
		$E.on('sel-4', 'mouseover', function(e){var region = $D.getRegion(this); $D.setStyle('tooltip4', 'visibility', 'visible');$D.setXY('tooltip4', [region.left , region.top -27]); });
		$E.on('sel-4', 'mouseout', function(e){$D.setStyle('tooltip4', 'visibility', 'hidden');});
		
		$E.on('sel-5', 'mouseover', function(e){var region = $D.getRegion(this); $D.setStyle('tooltip5', 'visibility', 'visible');$D.setXY('tooltip5', [region.left , region.top -27]); });
		$E.on('sel-5', 'mouseout', function(e){$D.setStyle('tooltip5', 'visibility', 'hidden');});



	}
	
	function navChange(selected) {
		
		var n = selected.innerHTML;
		
		var widget = $D.getAncestorByClassName(selected, 'iv-widget');
		
		contentId = $('iv' + widget.id.substr(6));

		var bd = $D.getChildren(widget)[1];
		
		var contentEls = $D.getChildren($D.getChildren(contentId)[1]);//$D.getChildren(contentId)[1].getElementsByTagName('li');
		
		bd.innerHTML = contentEls[n-1].innerHTML;
		
		navButtons = $D.getChildren(selected.parentNode);
		
		for (var i = 0; i < navButtons.length; i++){
			
			if (i != n-1){
				$D.removeClass(navButtons[i], 'selected');
			}else{
				$D.addClass(navButtons[i], 'selected');
			}
			
		}
		
	}
	
	//"private" method:
	var init = function () {
		
		var contentEls = $D.getElementsByClassName(config.contentClass, 'div');//, transformContent);
		
		for (var i = 0; i < contentEls.length; i++){
		  transformContent(contentEls[i]);
		}
	
		interval = setInterval(function(){
										
			var navs = $D.getElementsByClassName('iv-nav', 'ul');
			
			
			for (var n in navs) {
				
				var els = navs[n].getElementsByTagName('li');

				for(var e = 0; e < els.length; e++) {

					if ($D.hasClass(els[e], "selected")) {
					
						if (e+1 < els.length) {

							navChange(els[e+1]);
							
							break;
							
						} else {

							navChange(els[0]);
							
							break;
							
						}
						
						
					}

				}

			}
			
		}, 25000);

	}

	return  {
		init: init
	};

}(); 

$E.onDOMReady(YAHOO.IEDesign.IVWidget.init);
