
function osmlive(map,target,tagtarget){
this.map=map;
this.target=target;
this.tagtarget=tagtarget;
this.ball="images/dot_red.png";
this.liveInterval=null;
this.timeouts=new Array();

this.init=function(){
	
	this.audio = new Audio("images/beepbeep.mp3");
	this.loadlive();
	var that=this;
	var tempFunction1=function(){
		that.loadlive();
	}
	this.liveInterval=setInterval(tempFunction1,50000); //50 sec
//	setInterval("makeSmall()",300000); 
//	map.addCallbackFunction(listinger);
}
this.xmlhttp=new XMLHttpRequest();
this.loadlive=function(){
	var that=this;
	var rand=Math.random();
	this.xmlhttp.open("GET","examples/live.php?"+rand,true);
	this.xmlhttp.onreadystatechange=function(){
		if(that.xmlhttp.readyState==4){
			if(that.xmlhttp.responseXML){
				that.render(that.xmlhttp.responseXML);
			}
		}
	}
	this.xmlhttp.send(null);	
}
this.waittime=null;
this.render=function(dom){
	var ways=dom.documentElement.childNodes;
	//this.waittime=null;
	for(var i=0; i < ways.length;i++){
		this.add(ways.item(i));
	}
	/*
	var nodes=dom.getElementsByTagName("node");
        for(var i=0; i < nodes.length;i++){
                this.add(nodes.item(i));
        }
	*/

}


this.circle=null;
this.circle2=null;
this.makeAnimation=function(p,deadcounter,circle,style){
       	var r=45- deadcounter; 
	var opacity= deadcounter/40;
	var green=215 + deadcounter;
	
        if(circle==null){
                style=new kStyle();
                //style.addStyle("fill","yellow");
                style.addStyle("stroke","gray");
                style.addStyle("opacity",opacity);
                style.addStyle("fillStyle","rgb(255,"+green+",0)");
                style.addStyle("globalAlpha",opacity);
                circle= new kCircle(p,r+"px",style);
                map.addOverlay(circle);


        }else{
                style.addStyle("fillStyle","rgb(255,"+green+",0)");
		style.addStyle("opacity",opacity);
                circle.moveTo(p);
		//alert(r);
                circle.makeRadius(r +"px");
		//this
        }
	if(deadcounter >0){
		var that=this;
		var tempFunction=function(){
			that.makeAnimation(p,deadcounter -1,circle,style);
		}
		setTimeout(tempFunction,100);
        }else{
		map.removeOverlay(circle);
		circle=null;
	}

}


this.addNode=function(node){
	var lat=node.getAttribute("lat");
	var lng=node.getAttribute("lon");
	var image=node.getAttribute("image");
	if(image==""||!image){
		image="unknown";
		//console.log(image);
		return;	
	}
	var p=new kPoint(lat,lng);
	this.makeAnimation(p,40);
	//try{
	//document.getElementById("beepbeep").play();
	if(location.hash=="#sound"){
		this.audio.play();
	}

	//}catch(){}
	var img=this.makeImage(image);
       	var div= document.createElement("div");
        div.style.border="1px solid #c0c0c0";
        div.style.position="absolute";
	//div.style.backgroundColor="white";
	if(image!="road"){
		//div.style.zIndex=1;
	}
	div.style.top="-6px";
	div.style.left="-6px";
	div.style.left="-6px";
	div.style.width="12px";
	div.style.height="12px";
	div.appendChild(img);
	var m=new kMarker(p,div);
	this.map.addOverlay(m);
	var that=this;
	var tempFunction2=function(){
		that.showDetails(node,img);
	}
	div.onmousedown=tempFunction2;
}

this.showDetails=function(node,img){
//	this.tagtarget.parentNode.parentNode.style.display="none";   //bad style
	//var oldsrc=img.getAttribute("src");
	if(!img.getAttribute("oldsrc")){
		img.setAttribute("oldsrc",img.getAttribute("src"));
	}
//	alert("old: "+img.getAttribute("oldsrc"));
	img.setAttribute("src","images/ajaxload.gif");
	var name=node.getAttribute("name");	
	var id=node.getAttribute("id");	
	var lat=node.getAttribute("lat");	
	var lng=node.getAttribute("lon");	
	var type=node.getAttribute("type");	
	var tagname=node.tagName;
//	alert(name+","+id+","+tagname+","+type);
	this.loadWay(node,false,img);
}


this.makeImage=function(image){
        var img=document.createElement("img");
        img.style.width="12px";
        img.style.height="12px";
        img.style.top="-6px";
        img.style.left="-6px";
        
        img.setAttribute("src","images/poi/mapnik/"+image+".png");
        img.setAttribute("title",image);
        img.onerror=function(){
                this.style.display='none'
                //console.log(image);
        };
	return img;
}

this.add=function(way){
	if(way.nodeType!=1)return;
	if(!way.getAttribute("lat"))return;
	if(!way.getAttribute("lon"))return;

        var id=way.getAttribute("id");  
        if(document.getElementById(id)){
                return;
        }


	var name=way.getAttribute("name");
	var timestamp=way.getAttribute("timestamp");
	var time=new Date();
	time.setISO8601(timestamp);
	now =new Date();
	var Unterschied = now.getTimezoneOffset() ;

	var sec=timestamp.substring(timestamp.length - 3, timestamp.length -1);
	var min=timestamp.substring(timestamp.length - 6, timestamp.length -4);
	var hour=timestamp.substring(timestamp.length - 9, timestamp.length -7);
	var div=document.createElement("div");
	div.style.fontSize="10px";
	div.style.cursor="pointer";
	div.style.padding=0;
	div.style.marginTop=-1;
	var a=document.createElement("a");
	a.setAttribute("class","ticker");	
	a.appendChild(div);
	div.setAttribute("id",id);
	div.setAttribute("title",id);
	var lat=way.getAttribute("lat");
	var type=way.getAttribute("type");
	if(type=="delete"){
		div.style.textDecoration="line-through";
	}
	var lng=way.getAttribute("lon");
	var version=way.getAttribute("version");
	var user=way.getAttribute("user");
	//div.onmousedown=tempFunction;
	div.setAttribute("lat",lat);
	div.setAttribute("lng",lng);
	div.style.display="none";
	div.style.backgroundColor="lightgrey";
//	var time2=time.getTime+(Unterschied * -1)*60;
	var delay=Math.floor((now.getTime() - time.getTime())/1000);
	if(this.waittime < delay){
		this.waittime=delay;
		//console.log("waittime: "+this.waittime);
	}
	var delta=this.waittime - Math.floor((now.getTime() - time.getTime())/1000);
	//console.log("delta: "+delta);
	//var tn=document.createTextNode(time.getHours()+":"+min+":"+sec+" "+name+":"+delta+" U:"+Unterschied);
	var tn1=document.createTextNode(time.getHours()+":"+min+":"+sec+" ");
	var newspan = document.createElement("span");
	newspan.style.padding=0;
	newspan.style.margin=0;
	var i = document.createElement("i");
	if(version==1){
		newspan.style.color="green";
	}
	var tn2=document.createTextNode(" "+user+": ");
	var tn3=document.createTextNode(" "+name);

        newspan.appendChild(tn3);
        div.appendChild(tn1);
	var poiImage=this.makeImage(way.getAttribute("image"));
	div.appendChild(poiImage);	
        i.appendChild(tn2);
        div.appendChild(i);
        div.appendChild(newspan);
	var that=this;
	tempFunction3=function(){
		that.loadWay(way,true,poiImage);
	}
	a.onmousedown=tempFunction3;

	this.target.insertBefore(a,this.target.firstChild);	
	if(delta <0){
		delta=0;
	}
	var that=this;
	var tempFunction4=function(){
		//if(way.tagName=="node"){
			that.addNode(way);
		//}
		that.append(way);
	}
	this.timeouts.push(setTimeout(tempFunction4,parseInt(delta)*1000*0.9));
	//setTimeout("console.log('"+sec+"')",sec*1000);
	delta=delta*0.9;
}
this.color="white";
this.append=function(way){
	var id=way.getAttribute("id");
	if(this.color=="white"){
		this.color="#efefef";
	}else{
		this.color="white";
	}
	var el=document.getElementById(id);
	if(!el)return;
	el.style.display="";
	el.setAttribute("show","yes");
	el.style.backgroundColor=this.color;
//	el.parentNode.appendChild(el);
//	el.scrollIntoView();
//	var lat=el.getAttribute("lat");
//	var lng=el.getAttribute("lng");
	//console.log(lat,lng);
//	if(isNaN(lat))return;
//	if(isNaN(lng))return;
	
}

this.xmlhttpway=new XMLHttpRequest();
this.loadWay=function(node,jump,img){
	this.tagtarget.parentNode.parentNode.style.display="none";   //bad style
	var id=node.getAttribute("id");
	var lat=node.getAttribute("lat");
	var lng=node.getAttribute("lon");

	if(!img.getAttribute("oldsrc")){
		img.setAttribute("oldsrc",img.getAttribute("src"));
	}
//	alert("old: "+img.getAttribute("oldsrc"));
	img.setAttribute("src","images/ajaxload.gif");


	if(node.tagName=="way"){
		var url="/iphonemapproxy/gpxproxy.php?http://www.openstreetmap.org/api/0.6/way/"+id+"/full";
	}else{
		var url="/iphonemapproxy/gpxproxy.php?http://www.openstreetmap.org/api/0.6/node/"+id;
	}
	//var xmlhttp=new XMLHttpRequest();
	//document.getElementById("ajaxload").style.display="";
	this.xmlhttpway.open("GET",url,true);
	var that=this;
	this.xmlhttpway.onreadystatechange=function(){
		if(that.xmlhttpway.readyState==4){
			if(img.getAttribute("oldsrc")){
				img.setAttribute("src",img.getAttribute("oldsrc"));
			}
		
			//document.getElementById("ajaxload").style.display="none";
			if(that.xmlhttpway.responseXML){
				//img.setAttribute("src",img.getAttribute("oldsrc"));
				that.renderWay(that.xmlhttpway.responseXML);
			}
		}
	}
	this.xmlhttpway.send(null);
	//console.log(url);
	if(jump ||   this.map.getZoom() <11){
		var p=new kPoint(lat,lng);
		this.map.setCenter(p,11);
	}
}
this.renderWay=function(dom){
	this.makeTags(dom,false);
	if(dom.getElementsByTagName("way").length >0){
	var style=new kStyle();
	style.addStyle("strokeStyle","red");
	style.addStyle("lineWidth","4");
	style.addStyle("fillStyle","rgba(0,0,0,0)");
	var osm=new kOSM(dom,style);
	map.addOverlay(osm);
	}
	
}
this.makeTags=function(dom,history){
	while(this.tagtarget.firstChild){
		this.tagtarget.removeChild(this.tagtarget.firstChild);
	}
	this.tagtarget.parentNode.parentNode.style.display="";   //bad style
	
	var way=dom.getElementsByTagName("way").item(0);
	if(!way){
		var way=dom.getElementsByTagName("node").item(0);
	}
	if(!way)return;
	var id=way.getAttribute("id");
	var version=way.getAttribute("version");
	
	for(var i=0; i < way.attributes.length;i++){
		var tr1=document.createElement("tr");
		var td=document.createElement("td");
		var nodeName=way.attributes.item(i).nodeName;
		var nodeValue=way.attributes.item(i).nodeValue;
		
		var tn=document.createTextNode(nodeName);
		td.appendChild(tn);
		tr1.appendChild(td);

                var td=document.createElement("td");
                var tn=document.createTextNode(nodeValue);

                if(nodeName=="version"){
                        if(nodeValue!=1){
				var a=document.createElement("a");
				var tn2=document.createTextNode("< ");
				a.appendChild(tn2);
				a.style.color="blue";
                                a.style.cursor="pointer";
				var that=this;
				a.onmousedown=function(){
					that.loadVersion(way.tagName,id,parseInt(version) -1);
				}
				td.appendChild(a);	
                        }
                }
		if(nodeName=="user"){
			var a=document.createElement("a");
			a.setAttribute("href","http://www.openstreetmap.org/user/"+nodeValue);
			a.setAttribute("target","_blank");
			a.appendChild(tn);
			td.appendChild(a);
		}else{
			td.appendChild(tn);
		}
                tr1.appendChild(td);
		tr1.setAttribute("class","head");
                if(nodeName=="version"){
                        if(history){
                                var a=document.createElement("a");
                                var tn2=document.createTextNode(" >");
                                a.appendChild(tn2);
                                a.style.color="blue";
                                a.style.cursor="pointer";
                                var that=this;
                                a.onmousedown=function(){
                                        that.loadVersion(way.tagName,id,parseInt(version) +1);
                                }
                                td.appendChild(a);
                        }
                }


		//console.log(this.tagtarget.parentNode.tagName,way.attributes.item(i).nodeValue);
		this.tagtarget.appendChild(tr1);	
	}	
	var tags=way.getElementsByTagName("tag");
	for(var i=0; i < tags.length;i++){
		var k=tags.item(i).getAttribute("k");
		var v=tags.item(i).getAttribute("v");

		var tr=document.createElement("tr");
		var td1=document.createElement("td");
		var td2=document.createElement("td");
		var tn1=document.createTextNode(k);
		var tn2=document.createTextNode(v);
		tr.appendChild(td1);
		tr.appendChild(td2);
		td1.appendChild(tn1);
		td2.appendChild(tn2);
		this.tagtarget.appendChild(tr);	
		
	}
}

this.loadVersion=function(type,id,version){
	var url="/iphonemapproxy/gpxproxy.php?http://www.openstreetmap.org/api/0.6/"+type+"/"+id+"/"+version;
	this.xmlhttpway.open("GET",url,true);
	var that=this;	
	this.xmlhttpway.onreadystatechange=function(){
		if(that.xmlhttpway.readyState==4){
			//alert(that.xmlhttpway.responseText);
			that.makeTags(that.xmlhttpway.responseXML,true);
		}

	}
	this.xmlhttpway.send(null);

}

this.destroy=function(){
	if(this.liveInterval){
		this.xmlhttp.abort();
		this.xmlhttpway.abort();
		clearTimeout(this.liveInterval);
		while(this.tagtarget.firstChild){
			this.tagtarget.removeChild(this.tagtarget.firstChild);
		}
		while(this.target.firstChild){
			this.target.removeChild(this.target.firstChild);
		}
		while(this.timeouts.length > 0){
			clearTimeout(this.timeouts.pop());
		}
	}
}

} //end osmlive

/*

var listingerTimeout=null;
function listinger(){
	if(listingerTimeout){
		clearTimeout(listingerTimeout);
	}
	listingerTimeout=setTimeout("listinger2()",200);
}
function listinger2(){
	var bounds=map.getBounds();
	var sw=bounds.getSW();
	var ne=bounds.getNE();
	var minlat=sw.getLat();
	var minlng=sw.getLng();
	var maxlat=ne.getLat();
	var maxlng=ne.getLng();
	var divs=document.getElementById("target").getElementsByTagName("div");
	for(var i=0; i < divs.length;i++){
		var div=divs.item(i);
		var lat=div.getAttribute("lat");
		var lng=div.getAttribute("lng");
		if(lat < minlat || lat > maxlat || lng <minlng ||lng > maxlng){
			//div.style.color="red";
			div.style.display="none";
		}else{
			div.style.color="black";
			if(div.getAttribute("show")=="yes"){	
				div.style.display="";
			}
		}
	}
}

function makeSmall(){
	//console.log("eh da");
	var boella=document.getElementsByTagName("img");
	for(var i=0; i< boella.length;i++){
		var bolla=boella.item(i);
		if(bolla.getAttribute("src")==ball){
			var r=parseFloat(bolla.getAttribute("r"))*0.98;
			if(r<3)continue; 
			bolla.setAttribute("r",r);
			bolla.style.width=r*2;
			bolla.style.height=r*2;
			bolla.style.top=-r;
			bolla.style.left=-r;
		}
	}
}
*/

