// JavaScript Document ??!?

google.load("maps", "2.84");
var bounds;
var mummer;
var map;
var f;
var i            = 0;
var markerCnt    = 0;
var point        = [];
var marker       = [];
var gmarkers     = [];
var htmls        = [];
var names        = [];
var Grau         = [];
var myCitIcon    = "portal/pics/marker_daihatsu_big.png";
var myArrIcon    = "portal/pics/marker_daihatsu_start_big.png";
var myShadeIcon  = "portal/pics/marker_daihatsu_shadow.png";
var actField     = "";
var dirError     = false;
var thisPoiDescr = "";
var thisMailData = [];
		
function WerteNullen() {
	map.clearOverlays();
	bounds    = new GLatLngBounds();
	i         = 0;
	markerCnt = 0;
}

function initialize() {
	map = new google.maps.Map2($('map_canvas'));
	geocoder = new GClientGeocoder();
	bounds = new GLatLngBounds();
	var baseIcon = new GIcon(G_DEFAULT_ICON);
	var citroenIcon = new GIcon(baseIcon);
	citroenIcon.image = myCitIcon;
	citroenIcon.shadow = myShadeIcon;
	citroenIcon.iconSize = new GSize(30, 40);
	citroenIcon.shadowSize = new GSize(50, 40);
	citroenIcon.iconAnchor = new GPoint(15, 40);
	citroenIcon.infoWindowAnchor = new GPoint(20,30);
	//citroenIcon.image = myCitIcon;
	markerOptions = { icon:citroenIcon };
	
	f = document.hdlsuche_ergebnis_form;
	
	$('hdlsuche_suche').observe('keydown', function(eve){
		if(eve.keyCode == 13){
			if($('kv'))$('kv').hide();
			buildSearchQuery();  
		}  
	});

	gdir = new GDirections(map);
	GEvent.addListener(gdir, "error", handleErrors);
	GEvent.addListener(gdir,"load", function() {
		if(!dirError) {
			setTimeout('customPanel(map,"map",gdir,$("planer_ausgabe"))', 1);
			HaendlersucheRoutingSuche(false);
		}
	});
	if (AutoSetCenter == 0) {
		if (google.loader.ClientLocation && google.loader.ClientLocation.address.country_code == "DE" && google.loader.ClientLocation.address.region) {
			map.setCenter(new google.maps.LatLng((google.loader.ClientLocation.latitude-0.3),	google.loader.ClientLocation.longitude), 9);
		} else {
			map.setCenter(new google.maps.LatLng(51.320381, 6.512231), 9);
		}
	} else {
		geocoder.getLocations($('Hdl_adresse').value, setzeNeueMitteHaendler);
	}

}
google.setOnLoadCallback(initialize);

function setzeNeueMitteHaendler(response) {
	if (response != null) {
		platz = response.Placemark[0];
		punkt_c = new GLatLng((platz.Point.coordinates[1]),platz.Point.coordinates[0]);
		punkt = new GLatLng(platz.Point.coordinates[1],platz.Point.coordinates[0]);
		map.setCenter((punkt_c), 9);
		marker_start = new GMarker(punkt, markerOptions)
		GEvent.addListener(marker_start, "click", function() {
			marker_start.openInfoWindowHtml(html);
		});
		map.addOverlay(marker_start);
	}
}

function holeAdressenUndSetzeMitte() {
	WerteNullen();
	for(j=0;j<f.length;j++) {
		if( f[j].value != '0,0'){
			markerCnt = j;
			latlng = f[j].value.split(',');
			setzeMarker(parseFloat(latlng[0]),parseFloat(latlng[1]));
		}
	}
}

function setzeMarker(lat,lng) {
	nameInput = f[markerCnt].id;
	pointInput = new GLatLng(lat,lng);
	marker = createMarker(pointInput, nameInput);
	map.addOverlay(marker);
	map.setZoom(map.getBoundsZoomLevel(bounds));
	map.setCenter(bounds.getCenter());
}

function createMarker(point, name) {
	var marker = new GMarker(point, markerOptions);
	bounds.extend(marker.getPoint());
	
	GEvent.addListener(marker, "click", function() {
		marker.openInfoWindowHtml('<div id="opened_window" class="infowindow"><span style="width:100%;text-align:center"><img src="portal/pics/ajax-loader.gif" alt="Informationen werden geladen..." /><br />Informationen werden geladen...</span></div>',  {minHeight:615, maxWidth:415});
		getBubbleContent(name);
		setzeAndereGrau(marker);
	});
	GEvent.addListener(map.getInfoWindow(),"closeclick", function() {
		setzeAlleRot();
		map.setCenter(bounds.getCenter());
	});
	gmarkers[i] = marker;
	names[i] = name;
	i++;
	return marker;
}

getBubbleContent = function(id) {
	var thisUrl = cfm_file + "&myid=" + id;
	new Ajax.Updater($('opened_window'), thisUrl, {
		method: 'get',
		onSuccess: function(transport) {
		}
	})
}

function infoFensterTriggern(num) {
	nummer = (num-1);
	GEvent.trigger(gmarkers[nummer], "click");
}

function setzeAndereGrau(name) {
	var HaendlerIndex = gmarkers.indexOf(name);
	var HaendlerID    = (HaendlerIndex+1);
	var Haendler      = $('haendler_' + HaendlerID);
	Haendler.setOpacity(1.0);
	Grau              = ($$('.rgt').concat($$('.lft'))).without(Haendler);
	for(g=0;g<Grau.length;g++) {
		$(Grau[g].id).setOpacity(0.4);
	}
}
function setzeAlleRot() {
	Grau              = $$('.rgt').concat($$('.lft'));
	for(g=0;g<Grau.length;g++) {
		$(Grau[g].id).setOpacity(1.0);
	}
}

function buildSearchQuery(){
	var thisUrl    = '';
	var myservices = '';
	if($F('ort').length && $F('ort') != $('ort').title)    thisUrl += '&ort='  + encodeURIComponent($F('ort'));
	if($F('plz').length && $F('plz') != $('plz').title)    thisUrl += '&plz='  + $F('plz');
	if($F('name').length && $F('name') != $('name').title) thisUrl += '&name=' + encodeURIComponent($F('name'));
	if($F('umkreis')) thisUrl += '&umkreis='  + $F('umkreis');
	if($F('service')) thisUrl += ''; // &service=1
	if($F('vertrag')) thisUrl += '&vertrag=1';
	if(thisUrl.length) {
		if(myservices.length)thisUrl += '&services='+ myservices.substr(1);
		thisUrl = cfm_file + thisUrl;
		showRequest(thisUrl);
	}
	else $('forminfo').update('<h2>Hinweis</h2><div class="img z_one">Bitte Sie geben einen Namen oder eine Adresse ein:<br /><br /></div>')
}
		
function nameSearch(){
	thisUrl = cfm_file + '?name=' + $F('name');
	showRequest(thisUrl);
}

showRequest = function(myUrl) {
	new Ajax.Updater($('hdlsuche_ergebnis'), myUrl, {
		method: 'get',
		onSuccess: function(transport) {
			$('hdlsuche_ergebnis').show();
			// $('forminfo').hide();
			if(transport.responseText.length > 700) {
				// $('hdlsuche_suche').hide();
				map.addControl(new GLargeMapControl());
				map.addControl(new GMapTypeControl());
			}
		},
		onComplete: holeAdressenUndSetzeMitte
	})
}

function setMapHeight(height) {
	$("map_container").setStyle({
		height: height+'px'
	});
}

function sucheAendern(){
	map.clearOverlays();
	$('hdlsuche_suche').show();
	$('forminfo').show();
	$('form').hide();
	$('listinfo').hide();
	if(view=='autogas'){
		$('map_canvas').hide();
		$('kv').show();
	}
}

function RoutenPlanung(fromAddress, toAddress, locale) {
	if(fromAddress.length && fromAddress != "Bitte Adresse, PLZ und Ort eingeben"){
		dirError = false;
		map.addControl(new GMapTypeControl());
		map.addControl(new GLargeMapControl());
		G_START_ICON.image = myArrIcon;
		G_START_ICON.shadow = myShadeIcon;
		G_START_ICON.iconSize = new GSize(30, 40);
		G_START_ICON.shadowSize = new GSize(50, 40);
		G_START_ICON.iconAnchor = new GPoint(15, 40);
		G_START_ICON.infoWindowAnchor = new GPoint(20,30);
		G_END_ICON.image   = myCitIcon;
		G_END_ICON.shadow = myShadeIcon;
		G_END_ICON.iconSize = new GSize(30, 40);
		G_END_ICON.shadowSize = new GSize(50, 40);
		G_START_ICON.iconAnchor = new GPoint(15, 40);
		G_END_ICON.infoWindowAnchor = new GPoint(20,30);
		gdir.load("from: " + fromAddress + " to: " + toAddress, { "locale": locale,getSteps:true });
		return false;
	}
	else{
		$('routing_info').update('Geben Sie bitte eine Adresse ein:');
		return false;
	}
}

function handleErrors() {
	if (gdir.getStatus().code == G_GEO_UNKNOWN_ADDRESS || gdir.getStatus().code == G_GEO_SERVER_ERROR || gdir.getStatus().code == G_GEO_MISSING_QUERY) {
		dirError = true;
		$('routing_info').update('Bitte überprüfen Sie Ihre Angaben:');
	}
}

function customPanel(map,mapname,dirn,div) {
	var html = "";
	var mailtext = "";
	
	function waypoint(point, type, address) {
		if(type == "play"){ 
			praefix = "Ihre Startadresse: ";
			image = "../pics/citroen_start.png";
			}
		else { 
			praefix = "Ihr Ziel: ";
			image = "../pics/citroen_big.png";
		}
		var target = '"' + mapname+".showMapBlowup(new GLatLng("+point.toUrlValue(6)+"))"  +'"';
		html += '<table style="border: 1px solid silver; margin: 10px 0px; background-color: rgb(238, 238, 238); border-collapse: collapse; color:#260313;">';
		html += '  <tr style="cursor: pointer;" onclick='+target+'>';
		html += '    <td style="padding: 4px 15px 0px 5px; vertical-align: middle; width: 20px;">';
		html += '      <img src="' + image + '">'
		html += '    <\/td>';
		html += '    <td style="vertical-align: middle; width: 100%;font-weight:bold">';
		html +=        praefix + '<b>' + address + '</b>';
		html += '    <\/td>';
		html += '  <\/tr>';
		html += '<\/table>';
	}
	
	function routeDistance(dist) {
		html += '<div style="text-align: right; padding-bottom: 0.3em;">' + dist + '<\/div>';
	}      
	
	function detail(point, num, description, dist) {
		var target = '"' + mapname +".showMapBlowup(new GLatLng("+point.toUrlValue(num)+"))"  +'"';
		html += '<table class="detail" style="margin: 0px; padding: 0px; border-collapse: collapse; width: 100%; ">';
		html += '  <tr style="cursor: pointer;" onclick='+target+'>';
		html += '    <td style="border-top: 1px solid rgb(205, 205, 205); margin: 0px; padding: 0.3em 3px; vertical-align: top; text-align: right; width:5%">';
		html += '      <a href="javascript:void(0)"> '+num+'. <\/a>';
		html += '    <\/td>';
		html += '    <td style="border-top: 1px solid rgb(205, 205, 205); margin: 0px; padding: 0.3em 3px; vertical-align: top; width:85%">';
		html +=        description;
		html += '    <\/td>';
		html += '    <td style="border-top: 1px solid rgb(205, 205, 205); margin: 0px; padding: 0.3em 3px 0.3em 0.5em; vertical-align: top; text-align: right; width:10%">';
		html +=        dist;
		html += '    <\/td>';
		html += '  <\/tr>';
		html += '<\/table>';
	}
	
	function copyright(text) {
		html += '<div style="font-size: 0.86em;">Diese Wegbeschreibung dient nur zu Planungszwecken. Es ist möglich, dass die Verkehrsverhältnisse aufgrund von Baustellen, Verkehr, Wetter oder anderen Ereignissen von den in der Karte dargestellten Suchergebnissen abweichen können. Sie sollten daher Ihre Route entsprechend planen. Sie müssen alle Zeichen oder Hinweise bezüglich Ihrer Route beachten. <br />' + text + '<\/div>';
	}
	
	for (var i=0; i<dirn.getNumRoutes(); i++) {
		if (i==0) {
			var type="play";
		} else {
			var type="pause";
		}
		var route = dirn.getRoute(i);
		var geocode = route.getStartGeocode();
		var point = route.getStep(0).getLatLng();
		waypoint(point, type, geocode.address);
		routeDistance(route.getDistance().html+" (Fahrzeit ca. "+route.getDuration().html+")");

		for (var j=0; j<route.getNumSteps(); j++) {
			var step = route.getStep(j);
			var stepDetails = step.getDescriptionHtml()
			stepDetails     = stepDetails.replace(/(L[0-9]{1,3}n?)/g,'<span class="strasse_L">$1</span>');
			stepDetails     = stepDetails.replace(/(B[0-9]{1,3}n?)/g,'<span class="strasse_B">$1</span>');
			stepDetails     = stepDetails.replace(/(A[0-9]{1,3}n?)/g,'<span class="strasse_A">$1</span>');
			detail(step.getLatLng(), j+1, stepDetails, step.getDistance().html);
		}
	}
	
	var geocode = route.getEndGeocode();
	var point = route.getEndLatLng();
	var address = thisPoiDescr.replace(/§§/,'<br /><span style="margin-left:54px;">' + geocode.address + '</span>');
	waypoint(point, "stop", address);
	
	copyright(dirn.getCopyrightsHtml());
	
	div.innerHTML = html;
}

function HaendlerRoutingAufSuche(bool) {
	if(bool == true) {
		$('alt1').hide();
		$('alt2').hide();
		$('alt3').show();
	} else {
		$('alt1').show();
		$('alt2').show();
		$('alt3').hide();
	}
	return false;
}

function HaendlersucheRoutingSuche(bool) {
	map.clearOverlays();
	if (bool == false) {
		$('hdlsuche_ergebnis').hide();
		$('planer_ausgabe').show();
		$('planer_ausgabe_zurueck').show();
	} else {
		$('hdlsuche_ergebnis').show();
		$('planer_ausgabe').hide();
		$('planer_ausgabe_zurueck').hide();
		setzeAlleRot();
	}
}


function  activateField(field) {
	if($(field).value == $(field).title) $(field).value = '';
	$(field).setStyle({ borderColor:'#FF0000',color:'#666'});
	if(actField.length !=0 && actField != field){
		if($(actField).value == '') $(actField).value = $(actField).title;
		$(actField).setStyle({ borderColor:'#333',color:'#000'});
	}
	actField = field;
}
