93 lines
3.3 KiB
Text
93 lines
3.3 KiB
Text
|
||
<script src="https://maps.googleapis.com/maps/api/js?key=@Yavsc.Startup.GoogleSettings.BrowserApiKey"></script>
|
||
<script>
|
||
$(document).ready(function(){
|
||
|
||
function chooseLoc(config, sender, loc) {
|
||
if (sender === 'user') $('#'+config.addrId).val(loc.formatted_address);
|
||
var pos = loc.geometry.location;
|
||
var lat = new Number(pos.lat);
|
||
var lng = new Number(pos.lng);
|
||
var mapid = '#'+config.addrId;
|
||
var gmap = config.gmap;
|
||
gmap.setCenter(pos);
|
||
$('#'+config.latId).val(pos.lat);
|
||
$('#'+config.longId).val(pos.lng);
|
||
var marker = new google.maps.Marker({
|
||
map: gmap,
|
||
draggable: true,
|
||
animation: google.maps.Animation.DROP,
|
||
position: pos
|
||
});
|
||
google.maps.event.addListener(marker, 'dragend', function() {
|
||
var pos = marker.getPosition();
|
||
$('#'+config.latId).val(pos.lat);
|
||
$('#'+config.longId).val(pos.lng);
|
||
});
|
||
$('#'+config.addrId).valid();
|
||
$('#'+config.valId).empty();
|
||
return true;
|
||
}
|
||
|
||
function setupInputAddress (mapDiv)
|
||
{
|
||
var config = {
|
||
mapId: $(mapDiv).attr('id'),
|
||
addrId: $(mapDiv).data('addr'),
|
||
lonId: $(mapDiv).data('lon'),
|
||
latId: $(mapDiv).data('lat'),
|
||
valId: $(mapDiv).data('val'),
|
||
locComboId: $(mapDiv).data('loccombo')
|
||
};
|
||
console.log(config);
|
||
|
||
var input = '#'+config.addrId;
|
||
$(input).data("val-required", '@SR["SpecifyPlace"]') ;
|
||
$(input).data("val-remote", '@SR[ "GoogleDidntGeoLocalized"]') ;
|
||
$(input).rules("add",
|
||
{
|
||
remote: {
|
||
url: 'https://maps.googleapis.com/maps/api/geocode/json',
|
||
type: 'get',
|
||
data: {
|
||
key: '@Startup.GoogleSettings.BrowserApiKey',
|
||
sensor: false,
|
||
address: function () { return $('#'+config.addrId).val() }
|
||
},
|
||
dataType: 'json',
|
||
dataFilter: function(datastr,type) {
|
||
$('#'+config.locComboId).html("");
|
||
var data = JSON.parse(datastr);
|
||
data.results.forEach(function(element) {
|
||
if (element.formatted_address !== $('#'+config.addrId).val()) {
|
||
$('<li style="pointer:cursor;">'+element.formatted_address+'</li>')
|
||
.data("geoloc",element)
|
||
.click(function() { chooseLoc(config, 'user', $(this).data("geoloc")) })
|
||
.appendTo($('#'+config.locComboId));}
|
||
});
|
||
if ((data.status === 'OK') && (data.results.length == 1))
|
||
{
|
||
chooseLoc(config, 'google', data.results[0]);
|
||
return true
|
||
}
|
||
return false
|
||
},
|
||
error: function(xhr, textStatus, errorThrown)
|
||
{
|
||
console.log('ajax loading error ... '+textStatus+' ... '+ errorThrown);
|
||
return false
|
||
}
|
||
}
|
||
});
|
||
|
||
var gmap = new google.maps.Map(document.getElementById(config.mapId), {
|
||
zoom: 8
|
||
});
|
||
config.gmap = gmap;
|
||
}
|
||
$("div.map").each(function(indexMap){
|
||
setupInputAddress(this)
|
||
});
|
||
});
|
||
</script>
|
||
|