WIP: Resolve "Use bing maps" #1069

Draft
korina.cordero wants to merge 16 commits from 221-use-bing-maps into master
14 changed files with 403 additions and 160 deletions

View file

@ -16,6 +16,7 @@ APP_SECRET=b344cd6cd151ae1d61403ed55806c5ce
DATABASE_URL=mysql://db_user:db_password@127.0.0.1:3306/db_name
###< doctrine/doctrine-bundle ###
GMAPS_API_KEY=insertgmapsapikeyhere
BINGMAPS_API_KEY=insertbingmapsapikeyhere
# rising tide sms gateway
RT_USER=rt_user

View file

@ -4,3 +4,4 @@ twig:
strict_variables: '%kernel.debug%'
globals:
gmaps_api_key: "%env(GMAPS_API_KEY)%"
bingmaps_api_key: "%env(BINGMAPS_API_KEY)%"

View file

@ -87,6 +87,10 @@ services:
$password: "%env(REDIS_CLIENT_PASSWORD)%"
$env_flag: "dev"
App\Service\BingMapManager: ~
App\Service\MapManagerInterface: "@App\\Service\\BingMapManager"
Catalyst\APIBundle\Security\APIKeyUserProvider:
arguments:
$em: "@doctrine.orm.entity_manager"

View file

@ -6,6 +6,7 @@ use App\Entity\SupportedArea;
use App\Service\KMLFileImporter;
use App\Service\FileUploader;
use App\Service\MapManagerInterface;
use Doctrine\ORM\Query;
use Doctrine\ORM\QueryBuilder;
@ -25,13 +26,14 @@ class GeofenceController extends Controller
/**
* @Menu(selected="geofence_list")
*/
public function index()
public function index(MapManagerInterface $map_manager)
{
$this->denyAccessUnlessGranted('geofence.list', null, 'No access.');
$params['areas'] = $this->getDoctrine()
->getRepository(SupportedArea::class)
->findAll();;
->findAll();
$params['map_manager'] = $map_manager->getMapManager();
return $this->render('geofence/list.html.twig', $params);
}

View file

@ -32,6 +32,7 @@ use App\Service\MapTools;
use App\Service\HubCounter;
use App\Service\MQTTClient;
use App\Service\APNSClient;
use App\Service\MapManagerInterface;
use Doctrine\ORM\Query;
use Doctrine\DBAL\Connection;
@ -206,7 +207,7 @@ class JobOrderController extends Controller
/**
* @Menu(selected="jo_in")
*/
public function incomingForm()
public function incomingForm(MapManagerInterface $map_manager)
{
$this->denyAccessUnlessGranted('jo_in.list', null, 'No access.');
@ -214,6 +215,7 @@ class JobOrderController extends Controller
$params['mode'] = 'create';
$params['submit_url'] = $this->generateUrl('jo_in_submit');
$params['return_url'] = $this->generateUrl('jo_in');
$params['map_manager'] = $map_manager->getMapManager();
$em = $this->getDoctrine()->getManager();
@ -227,7 +229,7 @@ class JobOrderController extends Controller
/**
* @Menu(selected="jo_in")
*/
public function openEditForm($id)
public function openEditForm($id, MapManagerInterface $map_manager)
{
$this->denyAccessUnlessGranted('jo_open.edit', null, 'No access.');
@ -240,6 +242,7 @@ class JobOrderController extends Controller
$params['return_url'] = $this->generateUrl('jo_open');
$params['cvid'] = $jo->getCustomerVehicle()->getID();
$params['vid'] = $jo->getCustomerVehicle()->getVehicle()->getID();
$params['map_manager'] = $map_manager->getMapManager();
$em = $this->getDoctrine()->getManager();
@ -390,7 +393,7 @@ class JobOrderController extends Controller
/**
* @Menu(selected="jo_in")
*/
public function incomingVehicleForm($cvid)
public function incomingVehicleForm($cvid, MapManagerInterface $map_manager)
{
$this->denyAccessUnlessGranted('jo_in.list', null, 'No access.');
@ -398,6 +401,7 @@ class JobOrderController extends Controller
$params['submit_url'] = $this->generateUrl('jo_in_submit');
$params['return_url'] = $this->generateUrl('jo_in');
$params['cvid'] = $cvid;
$params['map_manager'] = $map_manager->getMapManager();
$em = $this->getDoctrine()->getManager();
@ -858,7 +862,7 @@ class JobOrderController extends Controller
/**
* @Menu(selected="jo_proc")
*/
public function processingForm(MapTools $map_tools, $id)
public function processingForm(MapTools $map_tools, $id, MapManagerInterface $map_manager)
{
$this->denyAccessUnlessGranted('jo_proc.list', null, 'No access.');
@ -974,6 +978,7 @@ class JobOrderController extends Controller
$params['obj'] = $obj;
$params['submit_url'] = $this->generateUrl('jo_proc_submit', ['id' => $obj->getID()]);
$params['return_url'] = $this->generateUrl('jo_proc');
$params['map_manager'] = $map_manager->getMapManager();
// response
return $this->render('job-order/form.html.twig', $params);
@ -1121,7 +1126,7 @@ class JobOrderController extends Controller
/**
* @Menu(selected="jo_assign")
*/
public function assigningForm(MapTools $map_tools, $id)
public function assigningForm(MapTools $map_tools, $id, MapManagerInterface $map_manager)
{
$this->denyAccessUnlessGranted('jo_assign.list', null, 'No access.');
@ -1195,6 +1200,7 @@ class JobOrderController extends Controller
$params['status_cancelled'] = JOStatus::CANCELLED;
$params['submit_url'] = $this->generateUrl('jo_assign_submit', ['id' => $obj->getID()]);
$params['return_url'] = $this->generateUrl('jo_assign');
$params['map_manager'] = $map_manager->getMapManager();
// response
return $this->render('job-order/form.html.twig', $params);
@ -1309,7 +1315,7 @@ class JobOrderController extends Controller
/**
* @Menu(selected="jo_fulfill")
*/
public function fulfillmentForm(MapTools $map_tools, $id)
public function fulfillmentForm(MapTools $map_tools, $id, MapManagerInterface $map_manager)
{
$this->denyAccessUnlessGranted('jo_fulfill.list', null, 'No access.');
@ -1346,6 +1352,7 @@ class JobOrderController extends Controller
$params['status_cancelled'] = JOStatus::CANCELLED;
$params['submit_url'] = $this->generateUrl('jo_fulfill_submit', ['id' => $obj->getID()]);
$params['return_url'] = $this->generateUrl('jo_fulfill');
$params['map_manager'] = $map_manager->getMapManager();
// response
return $this->render('job-order/form.html.twig', $params);
@ -1528,7 +1535,7 @@ class JobOrderController extends Controller
/**
* @Menu(selected="jo_open")
*/
public function openHubForm(MapTools $map_tools, $id)
public function openHubForm(MapTools $map_tools, $id, MapManagerInterface $map_manager)
{
$this->denyAccessUnlessGranted('jo_open.list', null, 'No access.');
@ -1606,6 +1613,7 @@ class JobOrderController extends Controller
$params['obj'] = $obj;
$params['submit_url'] = $this->generateUrl('jo_open_hub_submit', ['id' => $obj->getID()]);
$params['return_url'] = $this->generateUrl('jo_open');
$params['map_manager'] = $map_manager->getMapManager();
// response
return $this->render('job-order/form.html.twig', $params);
@ -1718,7 +1726,7 @@ class JobOrderController extends Controller
/**
* @Menu(selected="jo_open")
*/
public function openRiderForm($id)
public function openRiderForm($id, MapManagerInterface $map_manager)
{
$this->denyAccessUnlessGranted('jo_open.list', null, 'No access.');
@ -1750,6 +1758,7 @@ class JobOrderController extends Controller
$params['status_cancelled'] = JOStatus::CANCELLED;
$params['submit_url'] = $this->generateUrl('jo_open_rider_submit', ['id' => $obj->getID()]);
$params['return_url'] = $this->generateUrl('jo_open');
$params['map_manager'] = $map_manager->getMapManager();
// response
return $this->render('job-order/form.html.twig', $params);
@ -1862,7 +1871,7 @@ class JobOrderController extends Controller
/**
* @Menu(selected="jo_all")
*/
public function allForm($id)
public function allForm($id, MapManagerInterface $map_manager)
{
$this->denyAccessUnlessGranted('jo_all.list', null, 'No access.');
@ -1884,6 +1893,7 @@ class JobOrderController extends Controller
$params['status_cancelled'] = JOStatus::CANCELLED;
$params['return_url'] = $this->generateUrl('jo_all');
$params['submit_url'] = '';
$params['map_manager'] = $map_manager->getMapManager();
// timeline stuff (descending by time)
$params['timeline'] = [

View file

@ -0,0 +1,13 @@
<?php
namespace App\Service;
class BingMapManager implements MapManagerInterface
{
const MANAGER = 'bing';
public function getMapManager()
{
return self::MANAGER;
}
}

View file

@ -0,0 +1,13 @@
<?php
namespace App\Service;
class GoogleMapManager implements MapManagerInterface
{
const MANAGER = 'google';
public function getMapManager()
{
return self::MANAGER;
}
}

View file

@ -0,0 +1,15 @@
<?php
namespace App\Service;
interface MapManagerInterface
{
public function getMapManager();
//public function jsJobOrderDetails();
//public function jsOutlet();
//public function jsHub();
}

View file

@ -0,0 +1,35 @@
<script type='text/javascript' src='http://www.bing.com/api/maps/mapcontrol?callback=GetMap&key={{ bingmaps_api_key|raw }}' async defer></script>
<script>
var polygons = new Array();
function GetMap()
{
var map = new Microsoft.Maps.Map('#m_geomap', {
center: new Microsoft.Maps.Location(14.6091, 121.0223),
mapTypeId: Microsoft.Maps.MapTypeId.road,
zoom: 13
});
{% if areas %}
{% for obj in areas %}
var pointsArray = new Array();
{% for point in obj.getCoverageArea.getRing(0).getPoints() %}
var polylatlng = new Microsoft.Maps.Location(
{{ point.getLatitude }},
{{ point.getLongitude }});
pointsArray.push(polylatlng);
{% endfor %}
var coveredarea = new Microsoft.Maps.Polygon(pointsArray, {
fillColor: "#FF0000"
});
map.entities.push(coveredarea);
polygons[{{ obj.getID}}] = coveredarea;
{% endfor %}
{% endif %}
}

View file

@ -0,0 +1,42 @@
<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 polygons = new Array();
initMap();
function initMap() {
var map = new google.maps.Map(document.getElementById('m_geomap'),
{
center: {lat: 14.6091, lng: 121.0223},
mapTypeId: 'roadmap',
zoom: 13
});
{% if areas %}
{% for obj in areas %}
var pointsArray = new Array();
{% for point in obj.getCoverageArea.getRing(0).getPoints() %}
var polylatlng = new google.maps.LatLng(
{{ point.getLatitude }},
{{ point.getLongitude }});
pointsArray.push(polylatlng);
{% endfor %}
var coveredarea = new google.maps.Polygon({
paths: pointsArray,
fillColor: "#FF0000",
fillOpacity: .5,
mapTypeId: 'roadmap'
});
coveredarea.setMap(map);
polygons[{{ obj.getID}}] = coveredarea;
{% endfor %}
{% endif %}
}

View file

@ -39,7 +39,7 @@
<div class="m-portlet__body">
<div class="form-group m-form__group row">
<div class="col-lg-12">
<div id="m_gmap" style="height:600px;"></div>
<div id="m_geomap" style="height:600px;"></div>
</div>
</div>
<div id = "area-rows" class="form-group m-form__group row">
@ -83,51 +83,11 @@
{% endblock %}
{% block scripts %}
<script src="//maps.google.com/maps/api/js?key={{ gmaps_api_key }}" type="text/javascript"></script>
<script src="/assets/vendors/custom/gmaps/gmaps.js" type="text/javascript"></script>
<script>
// BEGIN google maps stuff
var polygons = new Array();
initMap();
function initMap() {
var map = new google.maps.Map(document.getElementById('m_gmap'),
{
center: {lat: 14.6091, lng: 121.0223},
mapTypeId: 'roadmap',
zoom: 13
});
{% if areas %}
{% for obj in areas %}
var pointsArray = new Array();
{% for point in obj.getCoverageArea.getRing(0).getPoints() %}
var polylatlng = new google.maps.LatLng(
{{ point.getLatitude }},
{{ point.getLongitude }});
pointsArray.push(polylatlng);
{% endfor %}
var coveredarea = new google.maps.Polygon({
paths: pointsArray,
fillColor: "#FF0000",
fillOpacity: .5,
mapTypeId: 'roadmap'
});
coveredarea.setMap(map);
polygons[{{ obj.getID}}] = coveredarea;
{% endfor %}
{% endif %}
}
// END google maps stuff
{% if map_manager == 'bing' %}
{{ include ('geofence/bingmaps.js.twig')}}
{% else %}
{{ include ('geofence/googlemaps.js.twig')}}
{% endif %}
$('tr td').click(function(e) {
e.preventDefault();

View file

@ -0,0 +1,145 @@
<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 %}

View file

@ -893,109 +893,11 @@
{% endblock %}
{% block scripts %}
<!-- <script src="//maps.google.com/maps/api/js?key={{ gmaps_api_key }}" type="text/javascript"></script> -->
<script src="//maps.googleapis.com/maps/api/js?key={{ gmaps_api_key }}" type="text/javascript"></script>
<script src="/assets/vendors/custom/gmaps/gmaps.js" type="text/javascript"></script>
<script>
$(function() {
var form_in_process = false;
// BEGIN google maps stuff
function selectPoint(map, latlng) {
var lat = latlng.lat();
var lng = latlng.lng();
// show it in map
map.removeMarkers();
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 GMaps({
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 %}
// END google maps stuff
{% if map_manager == 'bing' %}
{{ include ('job-order/bingmaps.js.twig')}}
{% else %}
{{ include ('job-order/googlemaps.js.twig')}}
{% endif %}
$("#row-form").submit(function(e) {
if (form_in_process) {

View file

@ -0,0 +1,100 @@
<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>
$(function() {
var form_in_process = false;
// BEGIN google maps stuff
function selectPoint(map, latlng) {
var lat = latlng.lat();
var lng = latlng.lng();
// show it in map
map.removeMarkers();
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 GMaps({
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 %}