var self;

function Ribbon(ribbonCont,nav,objName,ribbonTop) {

	self = this;
	this.baseURL = "/includes/menu/";	// default URL to the scripts
	this.ribbonCont = ribbonCont;
	this.mainNavEl = document.getElementById(nav);
	this.parentEl = this.mainNavEl.parentNode;
	this.targetHeight = 0;	// the height of the ribbon
	this.targetWidth = 0;	// the width of the ribbon
	this.targetLeft = 0;	// the left of the ribbon
	this.onOverTime = 3;
	this.targetTop = ribbonTop;
	this.ribbonLayout;
	this.ribbonTimer;
	this.div = false; // false means a ribbon is not being shown
	this.ribbonType;
	/* Posições do Mouse */
	this.cAtual; //Cursor Fora
	this.pAtual; //Posição Dentro
	this.sensitivity = 500;

	// create custom events for the links that have ribbons
	this.links = this.mainNavEl.getElementsByTagName("a");
	this.cacheArray = new Array();
	this.linkAnt = new Object();
	this.cursor();
	
	for(var i = 0; i < this.links.length; i++) {

		if(this.links[i].getAttribute("rel")) {
			
			this.links[i].onmouseover = function(ev) {

				ribbonObj.pAtual = ribbonObj.mouseCoords(ev);
				
				this.getElementsByTagName('img')[0].src = this.getElementsByTagName('img')[0].src.replace('.gif', '-over.gif');
				
				if (ribbonObj.compare()) {
					// if the ribbon container already exists we just swap the content
					if(el = document.getElementById("ribbonCont")) {
						var ribbonLink = document.getElementsByClassName("ribbonOn");
						if(ribbonLink)
							ribbonLink[0].className = ribbonLink[0].className.replace(/ribbonOn/,"");
	
						while(el.firstChild) {
							el.removeChild(el.firstChild);
						}
	
						ribbonObj.clearTimer();
						this.className += " ribbonOn sub"
						//link.width.hight.left
						var ribbonType = this.getAttribute("rel").split(".");
						ribbonObj.ribbonType = ribbonType[1];
						ribbonObj.targetWidth = ribbonType[2];
						ribbonObj.targetHeight = ribbonType[3];
						ribbonObj.targetLeft = ribbonType[4];
						ribbonObj.getRibbon();

						ribbonObj.linkAnt.className = ribbonObj.linkAnt.className.replace("sub","");
						ribbonObj.linkAnt.getElementsByTagName('img')[0].src = ribbonObj.linkAnt.getElementsByTagName('img')[0].src.replace('-over.gif', '.gif');
						ribbonObj.linkAnt = this;
					} else {
	
						this.className += " ribbonOn sub"
						var ribbonType = this.getAttribute("rel").split(".");
						ribbonObj.ribbonType = ribbonType[1];
						ribbonObj.targetWidth = ribbonType[2];
						ribbonObj.targetHeight = ribbonType[3];
						ribbonObj.targetLeft = ribbonType[4];
						ribbonObj.initRibbon();
						ribbonObj.linkAnt = this;
					}
				}
			}

			this.links[i].onmouseout = function() {
				//this.style.border = "0px";
				ribbonObj.startTimer();
			};
		} else {
			this.links[i].onmouseover = function(ev) {
				this.getElementsByTagName('img')[0].src = this.getElementsByTagName('img')[0].src.replace('.gif', '-over.gif');
			}
			this.links[i].onmouseout = function(ev) {
				this.getElementsByTagName('img')[0].src = this.getElementsByTagName('img')[0].src.replace('-over.gif', '.gif');
			}
		}
	}

	// hide the select boxes in IE6-
	if(typeof document.body.style.maxHeight == "undefined") {

		this.ie6 = true;
		this.selectArray = new Array();
		var select = document.getElementsByTagName("select")
		for(var i = 0; i < select.length; i++) {
			if(select[i].id == "newsSelect" || select[i].id == "q" || select[i].id == "p" || select[i].id == "chearleaderDropdown" ||
				select[i].id == "Select1" || select[i].id == "d")
				this.selectArray.push(select[i])
		}
	}	
}
/*----------------------*/
Ribbon.prototype.cursor = function() {
	document.getElementById('wrapMenu').onmousemove = function(ev) {
		ribbonObj.cAtual = ribbonObj.mouseCoords(ev);
	}	
}
Ribbon.prototype.unsetCursor = function() {
	document.getElementById('wrapMenu').onmousemove = function(ev){};
}
/*----------------------*/
Ribbon.prototype.compare = function() {

	//if ( ( Math.abs(ribbonObj.pAtual['x']-ribbonObj.cAtual['x']) + Math.abs(ribbonObj.pAtual['y']-ribbonObj.cAtual['y']) ) < ribbonObj.sensitivity )
		return true;

	//return false;
}
/*----------------------*/
Ribbon.prototype.mouseCoords = function(ev) {
	var x, y;
    if(typeof(ev) != "undefined") {
      x = ev.pageX
	  y = ev.pageY;
    } else {
      x = event.clientX,
      y = event.clientY
    }
	return {'x':x,'y':y}
}

/*----------------------*/
Ribbon.prototype.initRibbon = function() {

	// if a ribbon is already shown, delete
	if(this.div != false)
		this.deleteRibbon();

	// create the ribbon div and assign attibutes
	// this part is messy, it gets the background and inner shadow to be show as the ribbon slides down
	this.div = document.createElement("div");
	this.div.setAttribute("id","ribbonCont");
//	this.topDiv = document.createElement("div");
//	this.topDiv.setAttribute("id","ribbonTop");
//	this.bottomDiv = document.createElement("div");
//	this.bottomDiv.setAttribute("id","ribbonBottom");	
	
	// events so the ribbon doesn't disappear					
	this.div.onmouseover = function(){ribbonObj.clearTimer()};
	this.div.onmouseout = function(){ribbonObj.startTimer()};
	this.div.onmousemove = function(ev) {
		ribbonObj.cAtual = ribbonObj.mouseCoords(ev); 
	}	
	
//	this.div.appendChild(this.topDiv);
//	this.div.appendChild(this.bottomDiv);
	this.parentEl.insertBefore(this.div,this.mainNavEl.nextSibling);
	this.div.style.height = 1+"px";//this.targetHeight/3 + "px";		// animation trick to speed up the look of the ribbon sliding down
	this.div.style.width = ribbonObj.targetWidth + "px";
	this.div.style.left = ribbonObj.targetLeft + "px";
	this.ribbonTimer = window.setTimeout("ribbonObj.growRibbon()", this.onOverTime);
	this.div.style.top = this.targetTop + "px";
	if(this.ie6)
		this.hideSelect("hidden");
}

/*----------------------*/
// construct the URL to the back-end script
Ribbon.prototype.getRibbon = function() {

	// default URL to the scripts
	this.url = this.ribbonType;

	// if the array 
	if(this.cacheArray[this.url])
		this.showRibbonCache();
	else
		this.showRibbon();
}

/*----------------------*/
// writes the ajax response to page
Ribbon.prototype.showRibbon = function() {
	if(document.getElementById(ribbonObj.url)) {
		this.div.style.width = ribbonObj.targetWidth + "px";
		this.div.style.height = ribbonObj.targetHeight + "px";
		this.div.style.left = ribbonObj.targetLeft + "px";
		ribbonObj.div.innerHTML = ribbonObj.cacheArray[ribbonObj.url] = document.getElementById(ribbonObj.url).innerHTML;
		var ribbon = document.getElementsByClassName("ribbonCont",ribbonObj.div.id);
	}
}

/*----------------------*/
// writes cached version of the ribbon
Ribbon.prototype.showRibbonCache = function() {
	this.div.style.width = ribbonObj.targetWidth + "px";
	this.div.style.height = ribbonObj.targetHeight + "px";
	this.div.style.left = ribbonObj.targetLeft + "px";
	this.div.innerHTML = this.cacheArray[this.url];
}

/*----------------------*/
// grow/slide down effect
Ribbon.prototype.growRibbon = function() {

	if(this.ribbonTimer)
		clearTimeout(this.ribbonTimer);
	// make the div visible if it's the first time around
	if(this.div.style.display != "block")
		this.div.style.display = "block";

	//ribbonObj.getRibbon();
	var height = this.div.offsetHeight;
	if(height < ribbonObj.targetHeight) {
		this.div.style.height = (height + 15) + "px";
		this.ribbonTimer = window.setTimeout("ribbonObj.growRibbon()",3);
	} else {
		// in case the ribbon too tall, correct to desired height
		this.div.style.height = ribbonObj.targetHeight + "px";
		this.ribbonTimer = window.setTimeout("ribbonObj.getRibbon()",50);
		//this.getRibbon();
	}
}

/*----------------------*/
Ribbon.prototype.shrinkRibbon = function() {

	if(this.ribbonTimer)
		clearTimeout(this.ribbonTimer);

	var height = this.div.offsetHeight;
	if(this.div.offsetHeight > 0) {
		this.div.style.height = (this.div.offsetHeight - 10) + "px";
		this.ribbonTimer = window.setTimeout("ribbonObj.shrinkRibbon()",10);
	} else {
		this.deleteRibbon();
	}
}

/*----------------------*/
// remove the ribbon from the DOM
Ribbon.prototype.deleteRibbon = function() {
	var ribbonLink = document.getElementsByClassName("ribbonOn");
	if(ribbonLink) {
		clearTimeout(this.ribbonTimer);
		clearTimeout(this.hideTimer);
		ribbonLink[0].className = ribbonLink[0].className.replace("ribbonOn","");
		ribbonLink[0].className = ribbonLink[0].className.replace("sub","");
		ribbonLink[0].getElementsByTagName('img')[0].src = ribbonLink[0].getElementsByTagName('img')[0].src.replace('-over.gif', '.gif');
	
		if(this.div)
			this.parentEl.removeChild(this.div);
		this.div = false;
	
		if(this.ie6)
			this.hideSelect("visible");
	}
}

/*----------------------*/
Ribbon.prototype.startTimer = function() {
	this.hideTimer = window.setTimeout("ribbonObj.deleteRibbon()",200);
}

/*----------------------*/
Ribbon.prototype.clearTimer = function() {
	clearTimeout(this.hideTimer);
}

/*----------------------*/
Ribbon.prototype.hideSelect = function(display) {

	for(var i = 0; i < this.selectArray.length; i++) {
		this.selectArray[i].style.visibility = display;
	}
}
/*----------------------*/
document.getElementsByClassName = function(className,element) {
	if(element)	{
		var el = document.getElementById(element);
		var children = el.getElementsByTagName('*');
	} else {
		var children = document.getElementsByTagName('*') || document.all;
	}
	
	var elements = [];
	var regexp = new RegExp(className,"ig");
	for(i = 0; i < children.length; i++) {
		if(children[i].className.match(regexp))
			elements.push(children[i]);
	}
	if(elements.length > 0)
		return elements;
	else
		return false;
}
