var tooltip=function(){
	var id = 'tt';
	var top = 3;
	var left = -110;
	var ttwidth = 220;
	var maxw = 300;
	var speed = 10;
	var timer = 20;
	var endalpha = 95;
	var alpha = 0;
	var tt,t,eventTableMidTableBodyRowTd2,b,h;
	var ie = document.all ? true : false;
	return{
		show:function(v,w){
			if(tt == null){
	
                               w = ttwidth;          
		//*******************************************************
                //* The following uses the BubbleMethod for the ToolTip *
                //*******************************************************
		//	<table id="dpop" class="popup">
		//		<tbody><tr>
		//			<td id="topleft" class="corner"></td>
		//			<td class="top"></td>
		//			<td id="topright" class="corner"></td>
		//		</tr>
		//		<tr>
		//			<td class="left"></td>
		//			<td><table class="popup-contents">
		//				<tbody><tr class="event-notes">
		//					<th></th>
		//					<td id="event-content>INSERT CONTENT HERE</td>
		//				</tr>
		//			</tbody></table>
		//			</td>
		//			<td class="right"></td>    
		//		</tr>
		//		<tr>
		//			<td class="corner" id="bottomleft"></td>
		//			<td class="bottom"><img width="30" height="29" alt="popup tail" src="http://www.rcalvary.org/images/bubbleInfo/bubble-tail2.png"/></td>
		//			<td id="bottomright" class="corner"></td>
		//		</tr>
		//	</tbody></table>
		//</div>      


				tt = document.createElement('div');
				tt.setAttribute('id',id);

				// <table id="dpop">
				eventTable = document.createElement("table");
				var eventTableId = 'dpop';
				eventTable.setAttribute('id',eventTableId);
				eventTable.className = "popup";
						
				//<tbody>
				var eventTableBody = document.createElement("tbody");


				//================================================
				// CREATE THE TOP ROW SECTION				
				//<tr>
				var eventTableTopRow = document.createElement("tr");
		
				//<td id="topleft" class="corner"></td>
				var eventTableTopRowTD1 = document.createElement("td");
				var eventTableTopRowTD1Id = 'topleft';
				eventTableTopRowTD1.setAttribute('id',eventTableTopRowTD1Id);
				eventTableTopRowTD1.className = "corner";

				//<td class="top"></td>
				var eventTableTopRowTD2 = document.createElement("td");
				eventTableTopRowTD2.className = "top"
		
				//<td id="topright" class="corner"></td>
				var eventTableTopRowTD3 = document.createElement("td");
				var eventTableTopRowTD3Id = 'topright';
				eventTableTopRowTD3.setAttribute('id',eventTableTopRowTD3Id);
				eventTableTopRowTD3.className = "corner";				

				// PUT THE TOP ROW SECTION ALL TOGETHER
				eventTableTopRow.appendChild(eventTableTopRowTD1);
				eventTableTopRow.appendChild(eventTableTopRowTD2);
				eventTableTopRow.appendChild(eventTableTopRowTD3);
				//================================================


				//================================================		
				// CREATE THE MIDDLE ROW SECTION				
				//<tr>
				var eventTableMidRow = document.createElement("tr");		

				// <td class="left"></td>
				var eventTableMidRowTD1 = document.createElement("td");
				//var eventTableLeft = 'tableLeft';
				//eventTableMidRowTD1.setAttribute('id',eventTableLeft);
				eventTableMidRowTD1.className = "left"

				//<td>
				var eventTableMidRowTD2 = document.createElement("td");

				//<table class="popup-contents">
				var eventTableMidTable = document.createElement("table");
				eventTableMidTable.className = "popup-contents"		

				//<tbody>                                         
				var eventTableMidTableBody = document.createElement("tbody");

				//<tr>
				var eventTableMidTableBodyRow = document.createElement("tr");
							
				//<td>
				var eventTableMidTableBodyRowTd1 = document.createElement("td");
				var eventTableMidTableBodyRowTd1Valign = 'middle';
				eventTableMidTableBodyRowTd1.setAttribute('valign',eventTableMidTableBodyRowTd1Valign);
				
				
				//<img>
				var eventTableMidTableBodyRowImg = document.createElement("img");
				eventTableMidTableBodyRowImg.src = "http://www.rcalvary.org/images/bubbleInfo/toolTipLogo.png";

				//<td id='event-content'>
				eventTableMidTableBodyRowTd2 = document.createElement("td");
				var eventTableMidTableBodyRowTd2Id = 'event-content';
				eventTableMidTableBodyRowTd2.setAttribute('id',eventTableMidTableBodyRowTd2Id);

				// <td class="right"></td>
				var eventTableMidRowTD3 = document.createElement("td");
				//var eventTableRight = 'tableRight';
				//eventTableMidRowTD3.setAttribute('id',eventTableRight);
				eventTableMidRowTD3.className = "right"

				// PUT THE MIDDLE ROW SECTION ALL TOGETHER
				eventTableMidRow.appendChild(eventTableMidRowTD1);

				// FIRST PUT TOGETHER TD2
				//eventTableMidTableBodyRowTd1.appendChild(eventTableMidTableBodyRowImg);
				//eventTableMidTableBodyRow.appendChild(eventTableMidTableBodyRowTd1);
				eventTableMidTableBodyRow.appendChild(eventTableMidTableBodyRowTd2);
				eventTableMidTableBody.appendChild(eventTableMidTableBodyRow);
				eventTableMidTable.appendChild(eventTableMidTableBody);
				eventTableMidRowTD2.appendChild(eventTableMidTable);

				eventTableMidRow.appendChild(eventTableMidRowTD2);
				eventTableMidRow.appendChild(eventTableMidRowTD3);
				//================================================


				//================================================
				// CREATE THE BOTTOM ROW SECTION
				//<tr>
				var eventTableBtmRow = document.createElement("tr");

				//<td class="corner" id="bottomleft"></td>
				var eventTableBtmRowTD1 = document.createElement("td");
				var eventTableBtmRowTD1Id = 'bottomleft';
				eventTableBtmRowTD1.setAttribute('id',eventTableBtmRowTD1Id);
				eventTableBtmRowTD1.className = "corner";

				//<td class="bottom"><img width="30" height="29" src="http://www.rcalvary.org/images/bubbleInfo/bubble-tail2.png"/></td>
				var eventTableBtmRowTD2 = document.createElement("td");
				eventTableBtmRowTD2.className = "bottom"

				var eventTableBtmRowTD2Img = document.createElement("img");
				eventTableBtmRowTD2Img.setAttribute('width',"30");
				eventTableBtmRowTD2Img.setAttribute('height',"29");
				eventTableBtmRowTD2Img.setAttribute('src',"http://www.rcalvary.org/images/bubbleInfo/bubble-tail2.png");
				eventTableBtmRowTD2.appendChild(eventTableBtmRowTD2Img);

				//<td id="bottomright" class="corner"></td>
				var eventTableBtmRowTD3 = document.createElement("td");
				var eventTableBtmRowTD3Id = 'bottomright';
				eventTableBtmRowTD3.setAttribute('id',eventTableBtmRowTD3Id);
				eventTableBtmRowTD3.className = "corner";				

				//PUT THE BOTTOM ROW SECTION ALL TOGETHER
				eventTableBtmRow.appendChild(eventTableBtmRowTD1);
				eventTableBtmRow.appendChild(eventTableBtmRowTD2);
				eventTableBtmRow.appendChild(eventTableBtmRowTD3);
				//================================================

				//PUT THE TABLE ALL TOGETHER
				eventTableBody.appendChild(eventTableTopRow);
				eventTableBody.appendChild(eventTableMidRow);
				eventTableBody.appendChild(eventTableBtmRow);
				eventTable.appendChild(eventTableBody);
				tt.appendChild(eventTable);

				document.body.appendChild(tt);
				tt.style.opacity = 0;
				tt.style.filter = 'alpha(opacity=0)';
				document.onmousemove = this.pos;
			}
			w = ttwidth;
			tt.style.display = 'block';
			
			// add image to toolTip content
			v = "<img src='/images/bubbleInfo/toolTipLogo.png' style='float:left'>" + v;
			eventTableMidTableBodyRowTd2.innerHTML = v;
		
			tt.style.width = w ? w + 'px' : 'auto';
			if(!w && ie){
				//t.style.display = 'none';
				//b.style.display = 'none';
				tt.style.display = 'none';
				tt.style.width = tt.offsetWidth;
				//t.style.display = 'block';
				//b.style.display = 'block';
			}
			if(tt.offsetWidth > maxw){tt.style.width = maxw + 'px'}
			h = parseInt(tt.offsetHeight) + top;
			clearInterval(tt.timer);
			tt.timer = setInterval(function(){tooltip.fade(1)},timer);
		},
		pos:function(e){
			var u = ie ? event.clientY + document.documentElement.scrollTop : e.pageY;
			var l = ie ? event.clientX + document.documentElement.scrollLeft : e.pageX;
			tt.style.top = (u - h) + 'px';
			tt.style.left = (l + left) + 'px';
		},
		fade:function(d){
			var a = alpha;
			if((a != endalpha && d == 1) || (a != 0 && d == -1)){
				var i = speed;
				if(endalpha - a < speed && d == 1){
					i = endalpha - a;
				}else if(alpha < speed && d == -1){
					i = a;
				}
				alpha = a + (i * d);
				tt.style.opacity = alpha * .01;
				tt.style.filter = 'alpha(opacity=' + alpha + ')';
			}else{
				clearInterval(tt.timer);
				if(d == -1){tt.style.display = 'none'}
			}
		},
		hide:function(){
			clearInterval(tt.timer);
			tt.timer = setInterval(function(){tooltip.fade(-1)},timer);
		}
	};
}();