120 lines
3.6 KiB
Twig
120 lines
3.6 KiB
Twig
<script type='text/javascript' src='http://www.bing.com/api/maps/mapcontrol?callback=GetMap&key={{ bingmaps_api_key|raw }}' async defer></script>
|
|
<script>
|
|
|
|
$(function() {
|
|
var form_in_process = false;
|
|
var pin;
|
|
|
|
function selectPoint(e) {
|
|
if (e.targetType == "map") {
|
|
var point = new Microsoft.Maps.Point(e.getX(), e.getY());
|
|
var locTemp = e.target.tryPixelToLocation(point);
|
|
var location = new Microsoft.Maps.Location(locTemp.latitude,
|
|
locTemp.longitude)
|
|
|
|
map.entities.remove(pin);
|
|
|
|
pin = new Microsoft.Maps.Pushpin(location, {
|
|
draggable: false,
|
|
icon: '/assets/images/icon-destination.png'
|
|
});
|
|
|
|
map.entities.push(pin);
|
|
map.setCenter(location);
|
|
|
|
// set value in hidden input
|
|
$('#map_lat').val(locTemp.latitude);
|
|
$('#map_lng').val(locTemp.longitude);
|
|
}
|
|
|
|
map.setCenter(lat, lng);
|
|
map.addMarker({
|
|
lat: lat,
|
|
lng: lng,
|
|
icon: '/assets/images/icon-destination.png'
|
|
});
|
|
|
|
// set value in hidden input
|
|
$('#map_lat').val(lat);
|
|
$('#map_lng').val(lng);
|
|
}
|
|
|
|
var map = new Microsoft.Maps.Map('#m_gmap', {
|
|
center: new Microsoft.Maps.Location(14.6091, 121.0223),
|
|
}
|
|
Microsoft.Maps.Events.addHandler(map, 'click', selectPoint);
|
|
|
|
|
|
{
|
|
div: '#m_gmap',
|
|
lat: 14.6091,
|
|
lng: 121.0223,
|
|
click: function(e) {
|
|
// handle click in map
|
|
selectPoint(map, e.latLng);
|
|
e.stop();
|
|
}
|
|
});
|
|
var handleAction = function() {
|
|
var text = $.trim($('#m_gmap_address').val());
|
|
GMaps.geocode({
|
|
address: text,
|
|
callback: function(results, status) {
|
|
map.removeMarkers();
|
|
if (status == 'OK') {
|
|
selectPoint(map, results[0].geometry.location);
|
|
}
|
|
},
|
|
region: 'ph'
|
|
});
|
|
}
|
|
|
|
$('#m_gmap_btn').click(function(e) {
|
|
e.preventDefault();
|
|
handleAction();
|
|
});
|
|
|
|
$("#m_gmap_address").keypress(function(e) {
|
|
var keycode = (e.keyCode ? e.keyCode : e.which);
|
|
if (keycode == '13') {
|
|
e.preventDefault();
|
|
handleAction();
|
|
}
|
|
});
|
|
|
|
{% if ftags.set_map_coordinate %}
|
|
// check if we need to set map
|
|
var latlng = new google.maps.LatLng({{ obj.getCoordinates.getLatitude }}, {{ obj.getCoordinates.getLongitude }});
|
|
selectPoint(map, latlng);
|
|
|
|
// remove placeholder text
|
|
$("[data-vehicle-field='1']").prop('placeholder', '');
|
|
{% endif %}
|
|
|
|
{% if mode in ['update-processing', 'update-reassign-hub'] %}
|
|
// display hub map
|
|
var hmap = new GMaps({
|
|
div: '#hub_map',
|
|
lat: {{ obj.getCoordinates.getLatitude }},
|
|
lng: {{ obj.getCoordinates.getLongitude }}
|
|
});
|
|
|
|
hmap.addMarker({
|
|
lat: {{ obj.getCoordinates.getLatitude }},
|
|
lng: {{ obj.getCoordinates.getLongitude }},
|
|
icon: '/assets/images/icon-destination.png',
|
|
title: "Destination",
|
|
content: "Destination"
|
|
});
|
|
|
|
{% for hub in hubs %}
|
|
hmap.addMarker({
|
|
lat: {{ hub.hub.getCoordinates.getLatitude }},
|
|
lng: {{ hub.hub.getCoordinates.getLongitude }},
|
|
title: "{{ hub.hub.getName }}",
|
|
content: "{{ hub.hub.getName }}",
|
|
icon: '/assets/images/icon-outlet.png'
|
|
});
|
|
{% endfor %}
|
|
|
|
{% endif %}
|