/* 05-01-2006 Cristhian Alcantara
		   Modified: 05-24-2006
		   Tooltip for ESCOs */

	
		var generalEvent = null
		   
		function popupesco_tuneSettingsForDifferentBrowsers(){
		
			//For firefox
			if (  binfo.ffox ) {
				offset_adjust_y = -1;
			}
		}
		
		function popupesco_showEsco( event, escoid, anchorimage_id, isOdd ){
		
			//alert("event is " + event );
			generalEvent = event
			
			//Get the esco  object!!
			var esco = popupesco_getEscoObjectById( escoid ) ;
			if ( !esco ) {
				return
			}else{
				esco.imageId = anchorimage_id;
				esco.isodd = isOdd;
				popupesco_showEscoDivFromObject( esco ); 
			}
			
		}
		
		function popupesco_hideEsco( escoid){
		
			//Get the esco  object!!
			var esco = popupesco_getEscoObjectById( escoid ) ;
			if ( !esco ) {
				return
			}else{
				 popupesco_hideEscoDiv( esco  );
				
			}
			
		}
		
		function popupesco_getEscoObjectById( escoid ) {
		
			var escoobj = null;
			
			for( var eo = 0; eo < escos_array.length; eo++){
				if ( escos_array[eo].theid == escoid ) {
					escoobj	 = escos_array[eo];  //foudn requested esco
					break;
				}
			}
			
			return escoobj;
		}
		
		
		/* Force the esco divs to be loaded on hidden mode */
			
		function popupesco_loadallDivsInHiddenMode(){
			
				for( var i=0; i< escos_array.length; i++){
						popupesco_showEscoDivFromObject( escos_array[i] , false)
				}
				
		}
			
		/* Esco object constructor 
			escoid: unique integer identifier!
		   anchorimageid: each esco div must have a unique image which will be take as a reference to draw the div
		   				  on the screen
		   alayerid: must be unique for each esco div
		   numlinestitle: is important to determine the height of a cell!!
		   aimage: image of the esco
		   aurl: url of the esco link
		   aurlText: link text
		   aphone: selfdescriptive
		   acontent: html content to describe the esco
		*/
		
		function popupesco_escoObject( escoid, numlinestitle, isescorowodd, anchorimageid, alayerid, aimage, aemail, aurl, 
									aurlText , aname, aphone, 
									logoheight,
									alignleft,
									acontent ){
					this.numlinestitle =  numlinestitle
					this.isodd = isescorowodd;
				    this.theid = escoid;
					this.thetableid = ""
					this.layerid = alayerid
					this.theheight = default_table_height;
					this.theurl = aurl;
					this.theemail = aemail;
					this.theurlText = aurlText;
					this.theimage = aimage;
					this.thename = aname;
					this.thephone = aphone;
					this.thecontent = acontent;
					this.threadId = -1;
					this.x0 = 0;		//x0 and y0 referes to the topleft coordinate of the anchor image associated with an esco layer
					this.xy = 0;
					this.imageId = anchorimageid;
					this.logoheight = logoheight;
					this.alignleft = alignleft;
					
					if ( numlinestitle == 1) {
						this.breakerCellHeight = 32;  //Height of a row of the esco table
					}else{
						this.breakerCellHeight = 60;  //Height of a row of the esco table
					}
					
					
		}
				
				
		function popupesco_buildEscoContent( availablewidth, escoinfo, showimage ) {
			
				var toreturn = "";
				var maxwidthimage = 320;
				var maxwidthtext = 200;
				var separation = 20;
				//var theimage = esco_dir_image + escoinfo.theimage ;
				var theimage =  escoinfo.theimage ;
				
				//alert("image will be " + theimage )
				
				var topinfo = 	'<div class="escotitle">'  + escoinfo.thename +'</div> ' +
								'<strong>'+ escoinfo.thephone +'</strong><br> '+
								'<a href="'+  escoinfo.theurl +'">'+  escoinfo.theurlText +'</a><br><br>' ;
				
								
								
				var img = '<img src="'+ theimage +'" style="padding-bottom:7px;" >';
				
				if ( theimage  == "" ){
					img  = "";
				}
								
				//if ( ( maxwidthimage + maxwidthtext + separation ) >  availablewidth ){

				if ( showimage ) {	
					toreturn  += img + '<br>' +topinfo;
				}
				else{
					toreturn  += topinfo;
				}
				//}else{
				//	toreturn  += '<table cellpadding="0" cellspacing="0" border="0" width="100%" align="center" >' +
					//			   '<tr>' +
					//			     '<td align="left" valign="top">' + topinfo + '</td>' +
					//				 '<td align="left" valign="top">' + img + '</td>';
				//}
					
			
				return toreturn + escoinfo.thecontent ;

		}				
				
		/* This layer includes the arrow!! 
		   thediv: the div object into which the table will be drawn
		   imgpos: the anchor toplef absolute coordinate (question mark) associated with an esco div
		   escoinfo: the esco object to show
		   isvisible: will the div be visible or hidden?
		*/
				
		function popupesco_buildInternalTableForEscoDiv( escoinfo, imgpos, thediv, isvisible  ) {
				

				//Calculates the above and below height of a div.
			
				var heightbelow = escoinfo.theheight - escoinfo.breakerCellHeight;
				var contentbackcolor = "#ffffff";
				
				if ( escoinfo.isodd ) {
					 contentbackcolor = "#f1fafd"; 
				}
				
								
				//Calculate available monitor space and scroll information
				//var clientSize = coordFactory.clientSize();
				//var scrollInfo = 	coordFactory.scrollOffset();
				
				//See if the div will have enough space to show based on the scroll and monitor size
				var tablewidth = Math.min( imgpos.x , default_tableMaxWidth );
				var content_cell_width = tablewidth - 1; 
				
				//See if the div must be set visible
				if ( isvisible ) {
					thediv.style.display = "block";	
				}else{
					thediv.style.display = "none";	
				}

										
				//Calcuatel the breaker row height!!		
				var height_breaker = 26;
				//Each cell has an id, so we can find out the height of the cell!!
				var cell_esco = "rowcell" + escoinfo.theid;
				var cell_esco_obj = document.getElementById(cell_esco)
				if ( cell_esco_obj ) {
					//debug("height is " + getObjectHeight( cell_esco_obj ) )
					height_breaker = Math.max( getObjectHeight( cell_esco_obj ),  height_breaker);
				}
				
				
				
				var heightabbelowbreaker = parseInt( ( escoinfo.theheight - height_breaker)  /2 );
				var heightabovebreaker =   parseInt( ( escoinfo.theheight -height_breaker) /2) ;
									
				
				//debug("")
				//debug("new above: " + heightabovebreaker, true );
				//debug("new below: " + heightabbelowbreaker, true );
				
				//try{
					if ( generalEvent) {
							var bottompadding = 30;
							var toppadding = 30;
							//Calculate available monitor space and scroll information
							var clientSize = coordFactory.clientSize(generalEvent );
							var scrollInfo = coordFactory.scrollOffset(generalEvent );
							var mouse1 = coordFactory.mousePosition(generalEvent )
							var mouse2 = coordFactory.mousePosition2(generalEvent )  //absolute mouse position
							var temp = 0;
							var availablespacebelow = (clientSize.y + scrollInfo.y)-  mouse2.y;
							var availablespaceabove =    mouse2.y - scrollInfo.y;
							if ( availablespacebelow -bottompadding  >0 ) {
								availablespacebelow = availablespacebelow  - bottompadding  ; //add a padding;
							}
							if ( availablespaceabove  -toppadding > 0 ) {
								availablespaceabove = availablespaceabove  - toppadding;
							}
							
							if ( availablespaceabove < heightabovebreaker ) {
								temp = heightabovebreaker;
								heightabovebreaker = availablespaceabove;
								heightabbelowbreaker = heightabbelowbreaker + ( temp - heightabovebreaker   );
							}
							
							if (  availablespacebelow   < heightabbelowbreaker ) {
								temp = heightabbelowbreaker;
								heightabbelowbreaker = availablespacebelow;
								heightabovebreaker = heightabovebreaker + ( temp - availablespacebelow  );
							}
					}
				//}catch( exc){
					
				//}
				
			
				//debug ("client size: " + clientSize, true )
				//debug ("Scroll Info: " + scrollInfo, true )
				//debug ("mouse1: " + mouse1 , true)
				//debug ("mouse2: " + mouse2 , true)
				
				
				//debug("new above: " + heightabovebreaker, true );
				//debug("new below: " + heightabbelowbreaker, true );
				//debug("table height: " +  escoinfo.theheight, true );
				//debug("height  breaker: " +  height_breaker, true );
				
				
				var top1 = 0;
				var left1 = 0;
				var width1 = 0;
				var height1 = 0;
				
				if ( escoinfo.alignleft ) {  //align popup to the left
				
						/* Get html */
						toreturn =  getHtmlleft(  escoinfo, tablewidth  ,  escoinfo.theheight , content_cell_width, heightabovebreaker, heightabbelowbreaker, contentbackcolor, height_breaker );

				
						/* Position the layer appropiately */
						thediv.style.width= tablewidth  + "px";
						top1 = (imgpos.y + offset_adjust_y -  heightabovebreaker );
						left1 =(imgpos.x - tablewidth );
						thediv.style.top =   top1 + "px" ;
						thediv.style.left =  left1 + "px" ;
						
						
						width1 = 0;
						height1 = 0;
						
				}else{  //align popup to the right
						
					
						/* Get html */
						toreturn =  getHtmlRight(  escoinfo, tablewidth  ,  escoinfo.theheight , content_cell_width, heightabovebreaker, heightabbelowbreaker, contentbackcolor, height_breaker );
									
				
						/* Position the layer appropiately */
						thediv.style.width= tablewidth  + "px";
						top1 = (imgpos.y + offset_adjust_y -  heightabovebreaker );
						left1 = (imgpos.x  );
						thediv.style.top =  top1  + "px" ;
						thediv.style.left = left1  + "px" ;
					
				}
				
				
				//show invisible iframe below to hide controls in Internet explorer
				var aiframe = document.getElementById("invisibleiframe1");
				if ( aiframe ){
					
					//window.status= "width of table will be " + thediv.style.width ;
					var newwidth = tablewidth-15;
					if ( newwidth > 0 ){
						aiframe.style.top = top1 + "px";
						aiframe.style.left = left1+ "px";
						aiframe.style.width = (newwidth)+ "px";
						aiframe.style.height= escoinfo.theheight+ "px";
					}
					 
				}
			
				
				
				return toreturn;
				
		}
		
		
		function getHtmlleft(  escoinfo, tablewidth  ,  theheight , content_cell_width, heightabovebreaker, heightabbelowbreaker , contentbackcolor, height_breaker){
		
			
				var toreturn =   	
									'<table  width="'+  tablewidth + '" height="'+ theheight +'" border="0" cellpadding="0" cellspacing="0" class="residencialescotable1"> ' +
									'	<tr> '+ 
									'		<td width="'+  content_cell_width +'"  style="background-color:'+ contentbackcolor + '" rowspan="3" class="maincontent1"> ' +
												'  <div class="maincontentPadding"> ' +
												popupesco_buildEscoContent( content_cell_width , escoinfo, true ) +
												'  </div> ' +
									'      </td>  '+
									'      <td width="1" height="' + heightabovebreaker + '" class="blueback"><img src="images/b.gif" width="1" height="1"></td> '+
									'      <td width="10" ></td>  '+
									'  </tr>  '+
									'  <tr> '+
									'      <td   ><img src="images/b.gif" width="1" height="' + height_breaker +'"></td> '+
									'      <td class="tableconnector1"><img src="images/b.gif" width="15" height="1"></td> '+
									'  </tr> '+
									'  <tr>  '+
									'      <td class="blueback" height="'+ heightabbelowbreaker +'"><img src="images/b.gif" width="1" height="1"></td> ' +
									'      <td></td> '+
									'  </tr> '+
									'</table> ';
									
				return toreturn;
		
		}
		
		function getHtmlRight(  escoinfo, tablewidth  ,  theheight , content_cell_width, heightabovebreaker, heightabbelowbreaker , contentbackcolor, height_breaker){
		
			

			
				var toreturn =   	
									'<table  width="'+  tablewidth + '" height="'+ theheight +'" border="0" cellpadding="0" cellspacing="0" class="residencialescotable1"> ' +
									'	<tr> '+
									'      <td width="10" ></td>  '+
									'      <td width="1"  height="' + heightabovebreaker + '" class="blueback"><img src="images/b.gif" width="1" height="1"></td> '+
									'	   <td width="'+  content_cell_width +'"  style="background-color:'+ contentbackcolor + '" rowspan="3" class="maincontent2"> ' +
												'  <div class="maincontentPadding"> ' +
												popupesco_buildEscoContent( content_cell_width , escoinfo, true ) +
												'  </div> ' +
									'      </td>  '+
									
									'  </tr>  '+
									'  <tr> '+
									'      <td class="tableconnector1"><img src="images/b.gif" width="15" height="1"></td> '+
									'      <td><img src="images/b.gif" width="1" height="' + height_breaker +'"></td> '+
									
									'  </tr> '+
									'  <tr>  '+
									'      <td></td> '+
									'      <td class="blueback"  height="'+ heightabbelowbreaker +'"><img src="images/b.gif" width="1" height="1"></td> ' +
									
									'  </tr> '+
									'</table> ';
									
				return toreturn;
		
		}
		

		/* WIll show a esco by div position 
		   Arg 0: Esco object!
		   Arg 1: (optional) boolean to indicate wether to show the esco div after building it
		   		  Default is true
		*/

		function popupesco_showEscoDivFromObject( aobj ){

			if ( !aobj ) {
				return;
			}
			
			var showDiv = true;
			
			if ( arguments.length > 1 ) {
				//we are receiving a boolean to decide if the div will be visible
				showDiv  = arguments[1]
			}
			
			var imgid = aobj.imageId; //get the anchor image for the esco (question mark)
			var imgpos = null; //Will hold the coordinates of the anchor image
			//If anchor image is not set yet
			if ( aobj.imageId == "" ) {
				imgpos =  coordFactory.origin() //if not anchor is set yet, then just use the origin!
			}else{
				var img = document.getElementById( imgid );
				if (!img){ return; } //if anchor image doesnt exist then exit right away
				imgpos =  coordFactory.topLeftOffset( img); //get the top left coordinate of the anchor image
			}
			
			//If the esco div then search for it and update its internal table
			if ( aobj.exists) { 
				var adiv = document.getElementById( aobj.layerid );
				if ( adiv ) {
					adiv.innerHTML = popupesco_buildInternalTableForEscoDiv( aobj , imgpos, adiv, showDiv);
				}
			
			}else{	//If the esco div didn't exist then create the div element and add it to the body
				aobj.exists = true;
				var newdiv = document.createElement('div');
				newdiv.setAttribute('id',  aobj.layerid );
				newdiv.style.position = "absolute";				
				newdiv.style.zIndex = "100";	
				newdiv.innerHTML = popupesco_buildInternalTableForEscoDiv( aobj, imgpos , newdiv, showDiv);
				binfo.tt_db.appendChild(newdiv);

				//The 1st time we will create a temporary div, that will be loaded with the content of the esco, so we can determine
				//the height of the table. This div will be a dummy div, just to calculate the height of the table.
				var newdiv2 = document.createElement('div');
				newdiv2.setAttribute('id',  aobj.layerid + "_trash" );
				newdiv2.style.position = "absolute";						
				newdiv2.style.zIndex ="-100";   //move the layer to the back of any other visible layer
				newdiv2.style.display = "block";												
				newdiv2.style.top= "-500px";
				newdiv2.style.left= "-1000px";
				newdiv2.style.width ="387px";
				//if( aobj.theid == 12 ) {   'to debug a single table drawn in the background
				//	newdiv2.style.zIndex = "2000";
				//}
				
				var tablewidth = Math.min( imgpos.x , default_tableMaxWidth );
				var content_cell_width = tablewidth - 1;
				
				newdiv2.innerHTML = '<table id="'+ aobj.layerid + "_trash" +'" class="residencialescotable1">' +
										'<tr>'  +
											'<td class="maincontent">'+ 
												'<div class="maincontentPadding">'+
														popupesco_buildEscoContent( 500, aobj , false) +
												'</div>' +
											'</td>' +
										'</tr>' +
									 '</table>';
				binfo.tt_db.appendChild(newdiv2);
				
				/* not try to calculate the table height using the invisible dummy div */
				var table_obj = document.getElementById ( aobj.layerid + "_trash" );
				if ( table_obj ) {
					//debug( "esco height is " + aobj.logoheight  )
					aobj.theheight = getObjectHeight( table_obj ) +  aobj.logoheight ;
				}
			
			}
			
			
		
			
			
			//Make the esco div remember if its visible and also the top left position of its anchor image
			aobj.isitvisible = showDiv;
			aobj.x0 = imgpos.x;
			aobj.y0 = imgpos.y;
	
		}				
		
		function debug( text, flag ){
			var adiv1 = document.getElementById( "debug1")
			var adiv2 = document.getElementById( "debug2")
			if ( adiv1 ){
				if ( flag){
					adiv1.innerHTML += text + "<br>";
				}else{
					adiv1.innerHTML = text + "<br>";
				}
			}
			
			if ( adiv2 ){
				if ( flag){
					adiv2.innerHTML += text + "<br>";
				}else{
					adiv2.innerHTML = text + "<br>";
				}
			}
			
		}
		
		/* Hide a esco div */
				
		function popupesco_hideEscoDiv( aobj  ){
			var adiv = document.getElementById( aobj.layerid );
			if ( adiv ) {
				adiv.style.display = "none";
				aobj.isitvisible = false;
				
				var aiframe = document.getElementById("invisibleiframe1");
				if ( aiframe ){
					aiframe.style.top = "0px";
					aiframe.style.left = "0px";
					aiframe.style.width =  "1px";
					aiframe.style.width =  "1px"; 
				}
			}
		
		}