var map;
var geo;
var marker;
var pe;
var updater;
var gbounds;
Event.observe(window, 'load', init_app);
var unique;

function init_app(event) {

	var tb =$('testbild');
	var rules = {
		 '#start' : function(el) {
		     el.change = function() { 
		     	el.form.submit();
		 	 }	
		 },
		 '#geostart' : function(el) {
				el.onclick = showAddress;      
       	 },
		 '#save' : function(el) {
		 	el.onclick = function() {
		 		new Ajax.Request('./saveloc.php',{
				parameters:'latlng=' 
				+ $F('latlng') 
				+ '&tn=' 
				+ $('tn').getAttribute('rel')});
				resetApp();		 		
		 	}
		 },
		  '#esc' : function(el) {
		 	el.onclick = function() {
		 		$('out').innerHTML = '';
		 		resetApp();
		 		
		 	}
		 },
		 '#map' : function() {
		 	_mPreferMetric = true;
	 		geocoder = new GClientGeocoder();
    		map = new GMap2($("map"));
    		gbounds = new GLatLngBounds();
    		new Ajax.Request('./getloc.php', {
    			onSuccess: function(x) {
        		map.setCenter(new GLatLng(53.57787,10.059741),7);
    				var markers = eval('('+x.responseText+')');
					var total = 0;
					for (var id in markers) {
    					total= total +1;
					}
					var i=total;
    				for (var id in markers) {
    					setAllMarkers(markers[id].split(','),id,i);
						i = i-1;
					}
							map.setZoom(map.getBoundsZoomLevel(gbounds));
		             map.setCenter(gbounds.getCenter());

				}}
			);
			map.addControl(new GSmallMapControl());
    		geo = new GClientGeocoder(); 
    	
		 },
		 '#starter' : function(el) {
		 	el.onclick= function() {
		 		alert('Test');
		 	}
		 },
		 '#file' : function(el) {
		 	el.onmouseover = function() {
//		 		$('out').innerHTML='';//
//		 		$('navi').hide();
		 		
		 	}
		 }
	};
	Behaviour.register(rules);
	Behaviour.apply(rules); 
	dragger = new Draggable($('uploader'));
	unique = '4711';
	new AjaxUpload('upload_button', {
		action: 'upload.php',
		autoSubmit: true,
		name: 'file1',
		data: {
    		'UPLOAD_IDENTIFIER' : unique
    	},
		onSubmit: function(file,extension) {
		 	$('uploader').style.display='block';
		 	$('upload_button').hide();
			$('progress').show();
		 
		 updater = new Ajax.PeriodicalUpdater('progress', './progress.php', {asynchronous:true, frequency:2,postBody:'uniq=' + unique});
		
		 },
		onComplete: function(file, response) {
			$('progress').hide();
			updater.stop();
		}
		});
}


function setAllMarkers(latlng,id,c) {
	if (c>23) return;
	var icon = new GIcon(G_DEFAULT_ICON, './uploads/' + id + '.jpg');
	icon.iconSize = new GSize(32,24);
	icon.shadow = './shadow.png';
	icon.transparent = './transparent.png';
	icon.shadowSize = new GSize(44,24);
	icon.iconAnchor = new GPoint(16,24);
	icon.infoWindowAnchor = new GPoint(16,0);
	var point = new GLatLng(latlng[0],latlng[1]);
	var m = new GMarker(point,{icon:icon,title:c});
	if (c<5) {
		gbounds.extend(point);
	}
	map.addOverlay(m);
	GEvent.addListener(m,"click", function() {
		var html = '<div style="padding:10px;width:480px;height:320px"><img height="320" src="./uploads/'+ id +'.JPG?'+c+'" width="480" /></div>';
		m.openInfoWindowHtml(html);});
}


function resetApp() {
	$('uploader').hide();
	Effect.Fade('navi');
	$('upload_button').show();
}



function esc() {$('out').innerHTML = '';}


function setMarker(mymap,lat,lng) {
		mymap.clearOverlays();
		var point = new GLatLng(lat,lng);
		mymap.setCenter(point,14);
		setTimeout(function() {updater.stop();},1000);
		var src = document.getElementById('tn').getAttribute('rel');
	    var icon = new GIcon(G_DEFAULT_ICON, src + '.jpg');
	    icon.iconSize = new GSize(32,24);
		marker = new GMarker(point,{draggable:true,icon:icon});
		mymap.addOverlay(marker);
		GEvent.addListener(marker, "click", function() {
          	var html = '<div style="padding:10px;width:480px;height:320px">'
            + '<img height="320" src="'+src +'.JPG" width="480" /></div>';
          	marker.openInfoWindowHtml(html);
        });

//		var latlng = marker.getLatLng();   
		GEvent.addListener(marker, "dragend", saveLoc); 
		//$('legende').innerHTML='Das Bildchen ist in der Karte verschieblich …';
		//$('legende').style.color='red';
	    Effect.Fade('geostart');
	    $('gaddr').style.width='220px';
}

 
function saveLoc(loc) {
	var latlng = marker.getLatLng();    				
	geo.getLocations(latlng,showPoint);
	$('latlng').value = latlng.toUrlValue();
	new Ajax.Request('./saveloc.php',{
		parameters:'latlng=' 
		+ latlng.toUrlValue() 
		+ '&tn=' 
		+ document.getElementById('tn').getAttribute('rel')});
	$('save').disabled = null;
}

function showPoint(response) {
        if (response.Status.code == G_GEO_SUCCESS) {
        	place = response.Placemark[0].address;
        	$('gaddr').value = place;
      	} 
}

function showLLAddress(lat,lng) {
		$('latlng').value =  lat + ',' + lng;
		setMarker(map,lat,lng);
		saveLoc();

}

function showAddress() {
	map.checkResize() ;
	var search = $F('gaddr');
	geo.getLocations(search, function (result) { 
        	if (result.Status.code == G_GEO_SUCCESS) {
			var p = result.Placemark[0].Point.coordinates;
			$('latlng').value =  p[1] + ',' +p[0];
			setMarker(map,p[1],p[0]);
			saveLoc();
		} else {
			var example = 'Leipzig, Karl-Liebknecht-Straße 2';
			alert("Keine gültige Adresse. \nEin Beispiel wäre: \n" + example  );
			$('gaddr').value= example;
		}
	});
}

function save() {
	new Ajax.Request('./saveloc.php',{
				parameters:'latlng=' 
				+ $F('latlng') 
				+ '&tn=' 
				+ $('tn').getAttribute('rel')});
		 		$('out').innerHTML = '';

}