var map;
var geocode;
var mouseX;
var mouseY;

// add items to search box
$(function() {
	if ( $('[name="members"]').is(':visible') ) {
		
		var h = '<option value="0">Please select</option>\n';
		$('[name="members"]').append(h);
		
		var u = '/admin/xml/mapajax';
		$.getJSON(u, function(json){
			$.each(json, function(k,v) {
				var h = '<option value="'+v.id+'">'+v.name+'</option>\n';
				$('[name="members"]').append(h);
			});
		});
	}
});

// display only selected member on a map
$(function() {
	$('[name="members"]').change(function () {
		//var type = $(this).val();
		var id = $(this).val();
		id ? id : null;
		initialize(0, id);
	});
});



function showAddress(address) {
	if (geocoder) {
        geocoder.getLatLng(
          address,
          function(point) {
            if (!point) {
              alert(address + " not found");
            } else {
              map.setCenter(point, 13);
              var marker = new GMarker(point);
              //var marker = createCleanMarker(point);
              map.addOverlay(marker);
              //marker.openInfoWindowHtml(address);
            }
          }
        );
      }
}

// search address form
$(function() {
	$('[name="search_submit"]').click(function() {
		
		var address = $('[name="search_term"]').val();
		showAddress(address);
		
		return false;
	});
	
});





$(document).ready(function() {

	initialize(0);
	
	
	$().mousemove(function(e){
	      mouseX = e.pageX;
	      mouseY = e.pageY;
	   }); 
	
});





function createInfoBox(name,street,city,phone){
	var html = "<h3>" + name + "</h3><p>" + street + "<br />" + city + "</p>";
	if (phone) html = html + "<p style=\"margin:0px;padding:0px;\"><strong>Tlf:</strong> " + phone + "</p>";
	
	return html;
}



function createCleanMarker(point) {
	var marker = new GMarker(point, blackMarkerOptions);
	return marker;
}



function createMarker(point, html) {
	
	var marker = new GMarker(point, blackMarkerOptions);

	GEvent.addListener(marker, 'mouseover', function(){
		topPos 	= mouseY;
		leftPos = mouseX+10
		
		$('#mapinfobox').css('top', topPos+'px');
		$('#mapinfobox').css('left', leftPos+'px');
		$('#mapinfobox').css('display', 'block');
		$('#mapinfobox').html(html);
		
	});
	GEvent.addListener(marker, 'mouseout', function(){
		$('#mapinfobox').css('display', 'none');
	});
	
	return marker;
}


function initialize(type, id) {
	if (GBrowserIsCompatible()) {
		
    	// blackicon //OBS - (poorly) modified by maaløe
		var blackIcon = new GIcon(G_DEFAULT_ICON);
		//blackIcon.image = "/images/gmap_blue_icon.png";
		//blackIcon.shadow = "/images/gmap_icon_shadow.png";
		blackIcon.shadowSize = new GSize(0, 0);
		blackIcon.iconAnchor = new GPoint(5, 5);
		//blackIcon.iconSize = new GSize(10, 10);
		blackMarkerOptions = { icon:blackIcon };
		
		// center map
		map = new GMap2(document.getElementById("map_canvas"));
		map.setCenter(new GLatLng(56.0744, 11.5683), 6);

		// geocoder
		geocoder = new GClientGeocoder();
	  
		// add controlls
		var mapType = new GMapTypeControl();
		map.addControl(mapType);
		var mapNav = new GSmallMapControl();
		map.addControl(mapNav);

		// add search bar
		geocoder = new GClientGeocoder();

		// draw markers
		$.getJSON('/admin/xml/mapajax/type/'+type+'/id/'+id, function(json){
			$.each(json, function(key, value) {
				var point 	= new GLatLng(value.location_lat, value.location_lon);
				
				var name 		= value.name;
				var street	= value.streetname;
				var city		= value.cityname;
				var phone		= value.phone;
				var html		= createInfoBox(name,street,city,phone);
			      
				//var marker	= new GMarker(point,html);
				var marker 	= createMarker(point,html);
				map.addOverlay(marker);
				  
				/*
				GEvent.addListener(marker, "click", function() {
					var balon = '<b>'+value.name+"</b><br />Adresse: "+value.streetname+'<br />By: '+value.cityname+'<br />Tlf.: '+value.phone;
					marker.openInfoWindowHtml(balon);
				});
				*/
				
			});
		});
	  
    }
 }