resq/templates/job-order/bingmaps.js.twig

145 lines
4.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 src="//maps.google.com/maps/api/js?key={{ gmaps_api_key|raw }}" type="text/javascript"></script>
<script src="/assets/vendors/custom/gmaps/gmaps.js" type="text/javascript"></script>
<script>
var form_in_process = false;
var pin;
var map;
function GetMap()
{
map = new Microsoft.Maps.Map('#m_gmap', {
center: new Microsoft.Maps.Location(14.6091, 121.0223),
culture: 'fil-Latn',
zoom: 13
});
Microsoft.Maps.Events.addHandler(map, 'click', selectPoint);
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.setView({
center: location
});
// set value in hidden input
$('#map_lat').val(locTemp.latitude);
$('#map_lng').val(locTemp.longitude);
}
}
};
$(function() {
var handleAction = function() {
var text = $.trim($('#m_gmap_address').val());
GMaps.geocode({
address: text,
callback: function(results, status) {
map.entities.clear();
if (status == 'OK') {
var location = results[0].geometry.location;
var lat = location.lat();
var lng = location.lng();
// show in map
var loc = new Microsoft.Maps.Location(lat, lng);
pin = new Microsoft.Maps.Pushpin(loc, {
draggable: false,
icon: '/assets/images/icon-destination.png'
});
map.entities.push(pin);
map.setView({
center: loc
});
// set value in hidden input
$('#map_lat').val(lat);
$('#map_lng').val(lng);
}
},
});
};
$('#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 location = new Microsoft.Maps.Location({{ obj.getCoordinates.getLatitude }}, {{ obj.getCoordinates.getLongitude }});
map.entities.remove(pin);
pin = new Microsoft.Maps.Pushpin(location, {
draggable: false,
icon: '/assets/images/icon-destination.png'
});
map.entities.push(pin);
map.setView({
center: location
});
// set value in hidden input
$('#map_lat').val(location.latitude);
$('#map_lng').val(location.longitude);
// remove placeholder text
$("[data-vehicle-field='1']").prop('placeholder', '');
{% endif %}
{% if mode in ['update-processing', 'update-reassign-hub'] %}
// display hub map
var hmap = new Microsoft.Maps.Map('#hub_map', {
center: new Microsoft.Maps.Location({{ obj.getCoordinates.getLatitude }},
{{ obj.getCoordinates.getLongitude }}),
culture: 'fil-Latn'
});
var dest = new Microsoft.Maps.Location({{ obj.getCoordinates.getLatitude }},
{{ obj.getCoordinates.getLongitude }});
hmap.entities.push(new Microsoft.Maps.Pushpin(dest, {
title: "Destination",
text: "Destination",
icon: '/assets/images/icon-destination.png'
})
);
{% for hub in hubs %}
var hub_dest = new Microsoft.Maps.Location({{ hub.hub.getCoordinates.getLatitude }},
{{ hub.hub.getCoordinates.getLongitude }});
hmap.entities.push(new Microsoft.Maps.Pushpin(hub_dest, {
title: "{{ hub.hub.getName }}",
text: "{{ hub.hub.getName }}",
icon: '/assets/images/icon-outlet.png'
})
);
{% endfor %}
{% endif %}