var map;

function createPachubeTrails(feed, lat, lon, dat, wid, hei){	
	var divName = "pachube_trails" + Math.random()*100;
	document.write('<div id="'+divName+'" style="width: '+wid+'px; height: '+hei+'px"></div>');
	document.write('<div style="width:'+wid+'px; background-color:#fff"><a href="http://www.pachube.com/feeds/'+feed+'"><img src="http://apps.pachube.com/img/powered_by_pachube.png" alt="powered by pachube!" border="0"></a></div>');

	var cloudmade = new CM.Tiles.CloudMade.Web({key: 'f25955d9bb3054eaab40eb5cfd157151'});
	map = new CM.Map(divName, cloudmade);
	map.addControl(new CM.SmallMapControl());	
	getTrails(feed, lat, lon, dat);
}

function getTrails(feed, lat, lon, dat){
	var headID = document.getElementsByTagName("head")[0];         
  	var newScript = document.createElement('script');
    newScript.type = 'text/javascript';
    var newScriptURL = 'http://apps.pachube.com/trails/historyJSON.php?feed='+feed+'&lt='+lat+'&ln='+lon+'&d='+dat+'&callback=createTrails';
    newScript.src = newScriptURL;
 	headID.appendChild(newScript);	
}


function createTrails(trailsJSON){
	
	var lats = trailsJSON.lat;
	var lons = trailsJSON.lon;

	var data = trailsJSON.data;

	if (data == null){
		data = new Array();
	}
	
	var locationpoints = new Array();
	var datapoints = new Array();
	var maxpoints = new Array();
	
	var datamax = 0;
	
	for (i=0; i<data.length; i++){
		if (Math.abs(data[i]) > datamax) datamax = Math.abs(data[i]);
	}
	
	//var datamax = Math.max.apply(null, data);
	
	latsLength = lats.length;
	
	//var qq;
	
	for (i=0; i<latsLength; i++){
	
		//qq += lats[i] + "," + lons[i] +  "||";
	
		if ((lats[i] != 0) && (lons[i] != 0)) {
			locationpoints[i]=new CM.LatLng(lats[i], lons[i]);
		} else {
			lats[i] = lats[Math.abs(i-1)];
			lons[i] = lons[Math.abs(i-1)];
			locationpoints[i]=new CM.LatLng(lats[i], lons[i]);
		}
	}

	//alert (qq);

	var res=4;
	polyline = new CM.Polyline(locationpoints, '#FF0066', 3, 0.7);
	
	var bounds = polyline.getBounds();
	map.zoomToBounds(bounds);
	
	
	if (map.getZoom() > 15) map.setZoom(15);
	
	var zoom = map.getZoom();
	
	var verticalextent = map.getBounds().getNorthEast().lng() - map.getBounds().getSouthWest().lng();
	
	var multiple = (verticalextent*0.1)/ datamax;
	
	var maxoffset = - Math.abs(datamax*multiple + multiple); 
	var dataline = new Array();

	for (i=0; i<latsLength; i++){
		offset = - Math.abs((data[i]*multiple + multiple)); 
		var adj_lat;
		var adj_lon;
		adj_lat=lats[i];
		adj_lon=lons[i];
		datapoints[i] = new CM.LatLng(adj_lat - offset, adj_lon);
		maxpoints[i] = new CM.LatLng(adj_lat - maxoffset, adj_lon);

		var datalinepoint = new Array();
		offset = - (data[i]*multiple + multiple); 
		
		datalinepoint[0] = new CM.LatLng(adj_lat - maxoffset, adj_lon);
		datalinepoint[1] = new CM.LatLng(adj_lat, adj_lon);
		dataline[i] = new CM.Polyline(datalinepoint, '#0000FF', 1, 0.3*(i+1)*(1.0/latsLength));
		map.addOverlay(dataline[i]);
	}


	var trailsection=new Array();
	var maxsection=new Array();
	var datasection=new Array();

	var batch=(locationpoints.length/res);
	
	for (i=0; i<batch; i++){
		trailsection[i]=new CM.Polyline(locationpoints.slice(i*res,(i+1)*res+1), '#FF0066', 5, (i+1)*(1.0/batch));
		map.addOverlay(trailsection[i]);
	
		maxsection[i]=new CM.Polyline(maxpoints.slice(i*res,(i+1)*res+1), '#0000FF', 1, 0.6*(i+1)*(1.0/batch));
		map.addOverlay(maxsection[i]);
	
		datasectionpoints = new Array();		
		datasectionpoints = datapoints.slice(i*res,(i+1)*res+1).concat(locationpoints.slice(i*res,(i+1)*res+1).reverse());
		
		datasection[i] = new CM.Polygon(datasectionpoints, '#000000', 1, 0.2*(i+1)*(1.0/batch), "#000000", 0.9*(i+1)*(1.0/batch));
		map.addOverlay(datasection[i]);	
	}
		
	var myMarkerLatLng = locationpoints[latsLength-1];
	var icon = new CM.Icon();
	icon.image  = 'http://apps.pachube.com/img/marker.png';
	icon.shadow  = 'http://apps.pachube.com/img/shadow50.png';
	icon.iconSize = new CM.Size(20, 34);
	icon.shadowSize = new CM.Size(37, 34);
	icon.iconAnchor = new CM.Point(9,33);
	var myMarker = new CM.Marker(myMarkerLatLng, { icon: icon,});
	map.addOverlay(myMarker);
	
}