soundmap_wordpress_plugin/soundmap/js/soundmap-wp.js
Xavier Balderas 536c69fa7e New update
This new update is totally functional and incorporates new theme tags
for introducing the map.
2012-02-01 19:35:59 +01:00

103 lines
4.2 KiB
JavaScript

var g_map;
var or_latln;
var info_w;
jQuery(document).ready(function($) {
// $() will work as an alias for jQuery() inside of this function
var map_canvas = $('.map_canvas');
or_latln = new google.maps.LatLng(WP_Params.lat, WP_Params.lng);
var or_maptype;
switch (WP_Params.mapType) {
case 'ROADMAP':
or_maptype = google.maps.MapTypeId.ROADMAP;
break;
case 'HYBRID':
or_maptype = google.maps.MapTypeId.HYBRID;
break;
case 'TERRAIN':
or_maptype = google.maps.MapTypeId.TERRAIN;
break;
case 'SATELLITE':
or_maptype = google.maps.MapTypeId.SATELLITE;
break;
}
map_canvas.after('<div id="hidden-markers-content" style ="display:hidden;"></div>')
info_w = false;
if(map_canvas) {
markers_map = $('.map_canvas').gmap({
'center' : or_latln,
'zoom' : Number(WP_Params.zoom),
'mapTypeId' : or_maptype
}).bind('init', function(event, map) {
if( typeof onMapFinished == 'function') {
onMapFinished(map);
}
g_map = map;
info_w = new google.maps.InfoWindow({
content : ' '
});
var data = {
action : 'soundmap_JSON_load_markers',
markers : WP_Params.markers
};
$.post(WP_Params.ajaxurl, data, function(response) {
result = $.parseJSON(response);
if(result) {
/////////////_ICON
var image = new google.maps.MarkerImage(WP_Params.pluginURL + '/img/map_icons/marker.png',
// This marker is 20 pixels wide by 32 pixels tall.
new google.maps.Size(19, 30),
// The origin for this image is 0,0.
new google.maps.Point(0, 0),
// The anchor for this image is the base of the flagpole at 0,32.
new google.maps.Point(9, 30));
var shadow = new google.maps.MarkerImage(WP_Params.pluginURL + '/img/map_icons/marker_shadow.png',
// The shadow image is larger in the horizontal dimension
// while the position and offset are the same as for the main image.
new google.maps.Size(34, 30), new google.maps.Point(0, 0), new google.maps.Point(9, 30));
// Shapes define the clickable region of the icon.
// The type defines an HTML <area> element 'poly' which
// traces out a polygon as a series of X,Y points. The final
// coordinate closes the poly by connecting to the first
// coordinate.
var shape = {
coord : [9, 0, 19, 9, 12, 17, 9, 30, 6, 17, 0, 9, 9, 0],
type : 'poly'
};
//////////////_ICON
ajax_url = WP_Params.ajaxurl;
$.each(result, function(i, m) {
$('.map_canvas').gmap('addMarker', {
id : m.id.toString(),
'position' : new google.maps.LatLng(m.lat, m.lng),
'shadow' : shadow,
'icon' : image,
'shape' : shape
}).click(function() {
id = this.id;
marker = this;
var data = {
action : 'soundmap_load_infowindow',
marker : id
};
$.post(ajax_url, data, function(response) {
info_w.close();
$("#hidden-markers-content").append(response);
info_w.setContent($("#hidden-markers-content").children().get(0));
info_w.open(g_map, marker);
});
})
});
}
});
});
}
});