jQuery(function($) {
	// First create a div to host the map
	var themap = jQuery('<div id="CMSmap"></div>').insertBefore('ul.maplocations');
    
    
	// Now initialise the map
	var mapstraction = new Mapstraction('CMSmap','google');
	mapstraction.addControls({
		zoom: 'small',
		map_type: true
	});
    
	// Centre map
	mapstraction.setCenterAndZoom(
		new LatLonPoint($('ul.maplocations .centre .geo .latitude').text(), $('ul.maplocations .centre .geo .longitude').text()),12
	);

    $('.maplocations .vcard').each(function() {
        var hcard = $(this);
		
        var latitude = parseFloat(hcard.find('.geo .latitude').text());
        var longitude = parseFloat(hcard.find('.geo .longitude').text());

        var marker = new Marker(new LatLonPoint(latitude, longitude));
        imgIcon = hcard.find('img.icon')[0];
        //marker.setIcon(imgIcon.src,[imgIcon.height,imgIcon.width],[imgIcon.height,imgIcon.width/2]);
        marker.setIcon(imgIcon.src,[28,28],[29,29]);
        marker.setShadowIcon('/images/blank.gif',[1,1]);
		
		directions = "<a class=\"directions\" target=\"_blank\" href=\"http://maps.google.co.uk/maps?q=to:"+
			hcard.find('.adr .street-address').text()+", "+
			hcard.find('.adr .locality').text()+", "+
			hcard.find('.adr .postal-code').text()+
		"\">Get directions to here</a>";
		
        marker.setInfoBubble(
            '<div class="mapbubble">' + hcard.html() + directions + '</div>'
        );
        mapstraction.addMarker(marker);
    });
    jQuery('ul.maplocations').hide();
});