function retCarray(id){
	var id = id;
	for(var x=0; x<listlength+1; x++){
		if(carray[x][0]==id){
			return carray[x];
		}
	}
	return;
}
// get popup content from xml file
function getXML(xmlfile,id) {
	var id = id;
	var url = xmlfile;

	new Ajax.Request(url,
	{
		method:'get',
		onSuccess: function(transport){
			var response = transport.responseXML || "no response text";
			var y = response.getElementsByTagName('country');
			for(i=0; i<y.length; i++){
				if(y[i].getAttribute('ID')==id){
					var ID = (y[i].getAttribute('ID'));
					var name = (y[i].getAttribute('name'));
					var population = (y[i].getAttribute('population'));
					var area = (y[i].getAttribute('area'));
					var content = "<div style='background: url(bubble_top.png) no-repeat; height:49px;'><div style='padding-left:30px; padding-top: 25px; width:30px;float:left;' class='flag'><img src='ZA.gif' /></div><div style='color:#000000; padding-left:70px; padding-top: 27px; width:100%;font-size:10pt;font-weight:bold;' class ='country'>"+name+"</div></div><div style='background: url(bubble_mid.png) repeat-y; color:#000000; padding-left:30px;font-size:9pt;' class='info'>Population: "+ population +"<br/>Area: "+ area +" km�<br/></div><div class='bottom' style='background: url(bubble_btm.png) no-repeat; height:33px;'>&nbsp;</div>";

					var popupdiv=document.getElementById('popup');
					if(!popupdiv){return};
					popupdiv.innerHTML='';
					popupdiv.innerHTML=content;	
					exit;
				}
			}
		},
		onFailure: function(){ alert('Something went wrong...') }
	});	
}
// get popup content as text
function getContent(id) {
	var id = id;
	var url = "getdata2.php?id="+id;

	new Ajax.Request(url,
	{
		method:'get',
		onSuccess: function(transport){
			var response = transport.responseText || "no response text";
			//alert("Success! \n\n" + response);
			var popupdiv=document.getElementById('popup');
			if(!popupdiv){return};
			popupdiv.innerHTML='';
			popupdiv.innerHTML=response;
		},
		onFailure: function(){ alert('Something went wrong...') }
	});	
}
// display Pop Up div element
function displayPopupDiv(e){
	var posx=0;
	var posy=0;
	if(!e){var e=window.event};
	// determine target DIV
	var targ=e.target?e.target:e.srcElement;
	// calculate mouse coordinates
	if(e.pageX||e.pageY){
		posx=e.pageX;
		posy=e.pageY;
	}
	else if(e.clientX||e.clientY){
		posx=e.clientX;
		posy=e.clientY;
		// check for scroll offsets in IE 6
		if(document.documentElement.scrollLeft||document.documentElement.scrollTop){	
			posx+=document.documentElement.scrollLeft;
			posy+=document.documentElement.scrollTop;
		}
	}

    if(targ.alt=='country'){
    var div=document.getElementById('popup');
    var ch; //how many sites have been added
    if(!div){
        var div=document.createElement('div');
        div.setAttribute('id','popup');
        div.className='popupdiv2';
        document.getElementsByTagName('body')[0].appendChild(div);
        if(targ.alt=='country'){
            var content = retCarray(targ.id);
            // flag folder => config
//           content = "<div class='bubble' id='topbubble'><div class='bubble' id='topflag'><img src='data/flags/"+content[4]+".gif' /></div><div class='bubble' id='topheader'>"+content[1]+"</div></div><div class='bubble' id='mid'><!--<table class='popuptable'><tr class='popuptable'><td class='popuptable'>Population:&nbsp;</td><td class='popuptable'> "+ content[2] +"</td></tr><tr class='popuptable'><td class='popuptable'>Area:&nbsp;</td><td class='popuptable'>"+ content[3] +" km&sup2;</td></tr></table>--></div><div class='bubble' id='btm'>&nbsp;</div>";
           var contentOut ="<div class='bubble' id='topbubble'><div class='bubble' id='topflag'><img src='data/flags/"+content[2]+".gif' /></div><div class='bubble' id='topheader'>"+content[1]+"</div></div>";
           contentOut =contentOut+"<div class='bubble' id='mid'><table class='popuptable'><tr class='popuptable'><td class='popuptable'>Sites:&nbsp;</td></tr>";

           for (  ch = 3 ; ch <content.length; ch++){
                contentOut =contentOut+"<tr class='popuptable'><td class='popuptable'>"+content[ch]+"</td></tr>";
           }                    
           contentOut = contentOut+"</table></div><div class='bubble' id='btm'>&nbsp;</div>";

            var popupdiv=document.getElementById('popup');
            if(!popupdiv){return};
            popupdiv.innerHTML='';
            popupdiv.innerHTML=contentOut;    
        }
    }
        
    // move pop-up DIV element
    div.style.top=posy-120+'px';
    div.style.left=posx+3+'px';
    }
    
    if(targ.alt=='site'){
    var div=document.getElementById('popup');
    if(!div){
        var div=document.createElement('div');
        div.setAttribute('id','popup');
        div.className='popupdiv2';
        document.getElementsByTagName('body')[0].appendChild(div);
        var content = "<div><div class='bubble_site_left'></div><div class='bubble_site_mid'>"+targ.id+"</div><div class='bubble_site_right'></div></div>";
        var popupdiv=document.getElementById('popup');
        if(!popupdiv){return};
        popupdiv.innerHTML='';
        popupdiv.innerHTML=content;    
        
    }
    div.style.top=posy-65+'px';
    div.style.left=posx+3+'px';
    }
    
    if(targ.alt=='site_un'){
    var div=document.getElementById('popup');
    if(!div){
        var div=document.createElement('div');
        div.setAttribute('id','popup');
        div.className='popupdiv2';
        document.getElementsByTagName('body')[0].appendChild(div);
        var content = "<div class='bubble' id='topbubble'><div class='bubble' id='topheader'>"+targ.id+"</div></div><div class='bubble' id='mid'><table class='popuptable'><tr class='popuptable'><td class='popuptable'>Content coming soon</td></tr></table></div><div class='bubble' id='btm'>&nbsp;</div>";
    
        var popupdiv=document.getElementById('popup');
        if(!popupdiv){return};
        popupdiv.innerHTML='';
        popupdiv.innerHTML=content;    
        
    }    
    // move pop-up DIV element
    div.style.top=posy-100+'px';
    div.style.left=posx+3+'px';
    }

}

// remove pop-up DIV element
function hidePopupDiv(){
	var div=document.getElementById('popup');
	if(!div){return};
	div.parentNode.removeChild(div);	
}

// activate pop-up DIV elements
function activatePopupDivs(){
	var areas=document.getElementsByTagName('area');
	if(!areas){return};
	for(var i=0;i<areas.length;i++){
		if(areas[i].className=='popupcontainer'){
			// display pop-up DIV element
			areas[i].onmousemove=displayPopupDiv;
			// hide pop-up DIV elementa.
			areas[i].onmouseout=hidePopupDiv;
		}
	}
}

// activate pop-up DIV elements when web page has been loaded
window.onload=function(){
	if(document.getElementById&&document.createElement&&document.createTextNode){
		activatePopupDivs();
	}
}