Fix publishing and subscribing for new / updated JOs #299

This commit is contained in:
Kendrick Chan 2020-01-25 05:11:53 +08:00
parent c753be54cb
commit 9e00c3f115
5 changed files with 159 additions and 74 deletions

View file

@ -5,9 +5,11 @@ class DashboardMap {
this.cust_markers = cust_markers;
// layer groups
this.lg_avail_rider = L.layerGroup();
this.lg_jo_rider = L.layerGroup();
this.lg_cust = L.layerGroup();
this.layer_groups = {
'rider_available': L.layerGroup(),
'rider_active_jo': L.layerGroup(),
'customer': L.layerGroup()
};
}
initialize() {
@ -26,9 +28,9 @@ class DashboardMap {
}).addTo(this.map);
// layer groups
this.lg_avail_rider.addTo(this.map);
this.lg_jo_rider.addTo(this.map);
this.lg_cust.addTo(this.map);
this.layer_groups.rider_available.addTo(this.map);
this.layer_groups.rider_active_jo.addTo(this.map);
this.layer_groups.customer.addTo(this.map);
// base layer
var baseMaps = {
@ -37,9 +39,9 @@ class DashboardMap {
// overlay layer
var overlayMaps = {
'Available Riders' : this.lg_avail_rider,
'JO Riders' : this.lg_jo_rider,
'Customers' : this.lg_cust
'Available Riders' : this.layer_groups.rider_available,
'JO Riders' : this.layer_groups.rider_active_jo,
'Customers' : this.layer_groups.customer
}
L.control.layers(baseMaps, overlayMaps).addTo(this.map);
@ -47,6 +49,69 @@ class DashboardMap {
return this.map;
}
putMarker(id, lat, lng, markers, icon, layer_group, popup_url) {
var my = this;
// existing marker
if (markers.hasOwnProperty(id)) {
markers[id].setLatLng(L.latLng(lat, lng));
return;
}
// new marker
markers[id] = L.marker(
[lat, lng],
{ icon: icon }
).bindPopup('Loading...')
.addTo(layer_group);
// bind ajax for popup
markers[id].on('click', function(e) {
var popup = e.target.getPopup();
var url = popup_url.replace('[id]', id);
console.log(url);
$.get(url).done(function(data) {
popup.setContent(data);
popup.update();
});
});
}
putCustomerMarker(id, lat, lng) {
this.putMarker(
id,
lat,
lng,
this.cust_markers,
this.options.icons.customer,
this.layer_groups.customer,
this.options.cust_popup_url
);
}
putRiderAvailableMarker(id, lat, lng) {
this.putMarker(
id,
lat,
lng,
this.rider_markers,
this.options.icons.rider_available,
this.layer_groups.rider_available,
this.options.rider_popup_url
);
}
putRiderActiveJOMarker(id, lat, lng) {
this.putMarker(
id,
lat,
lng,
this.rider_markers,
this.options.icons.rider_active_jo,
this.layer_groups.rider_active_jo,
this.options.rider_popup_url
);
}
loadLocations(location_url) {
console.log(this.rider_markers);
var my = this;
@ -54,9 +119,9 @@ class DashboardMap {
url: location_url,
}).done(function(response) {
// clear all markers
my.lg_avail_rider.clearLayers();
my.lg_jo_rider.clearLayers();
my.lg_cust.clearLayers();
my.layer_groups.rider_available.clearLayers();
my.layer_groups.rider_active_jo.clearLayers();
my.layer_groups.customer.clearLayers();
// get riders and mark
var riders = response.riders;
@ -64,48 +129,22 @@ class DashboardMap {
// rider location
var point = rider_data['loc'];
var lat = point[0];
var long = point[1];
var lng = point[1];
// customer location
var cloc = rider_data['cust_loc'];
var clat = cloc[0];
var clong = cloc[1];
var clng = cloc[1];
// create rider markers
if (rider_data['has_jo']) {
var jo_data = rider_data['jo'];
my.rider_markers[rider_id] = L.marker([lat, long], { icon: my.options.icons.rider_active_jo }).bindPopup('Loading...');
my.cust_markers[jo_data['id']] = L.marker([clat, clong], { icon: my.options.icons.customer }).bindPopup('Loading...');
my.lg_cust.addLayer(my.cust_markers[jo_data['id']]);
my.lg_jo_rider.addLayer(my.rider_markers[rider_id]);
// customer popup ajax
my.cust_markers[jo_data['id']].on('click', function(e) {
var popup = e.target.getPopup();
var url = my.options.cust_popup_url.replace('[id]', jo_data['id']);
console.log(url);
$.get(url).done(function(data) {
popup.setContent(data);
popup.update();
});
});
my.putCustomerMarker(jo_data['id'], clat, clng);
my.putRiderActiveJOMarker(rider_id, lat, lng);
} else {
my.rider_markers[rider_id]= L.marker([lat, long], { icon: my.options.icons.rider_available }).bindPopup('Loading...');
my.lg_avail_rider.addLayer(my.rider_markers[rider_id]);
my.putRiderAvailableMarker(rider_id, lat, lng);
}
// ajax loading of rider popup
my.rider_markers[rider_id].on('click', function(e) {
var popup = e.target.getPopup();
var url = my.options.rider_popup_url.replace('[id]', rider_id);
console.log(url);
$.get(url).done(function(data) {
popup.setContent(data);
popup.update();
});
});
});
// console.log(rider_markers);

View file

@ -1,8 +1,7 @@
class MapEventHandler {
constructor(options, rider_markers, cust_markers) {
constructor(options, dashmap) {
this.options = options;
this.rider_markers = rider_markers;
this.cust_markers = cust_markers;
this.dashmap = dashmap;
}
connect(user_id, host, port) {
@ -12,23 +11,29 @@ class MapEventHandler {
this.mqtt = new Paho.MQTT.Client(host, port, client_id);
var options = {
useSSL: true,
// useSSL: true,
timeout: 3,
onSuccess: this.onConnect,
invocationContext: this,
onSuccess: this.onConnect.bind(this),
};
this.mqtt.onMessageArrived = this.onMessage;
this.mqtt.onMessageArrived = this.onMessage.bind(this);
console.log('connecting to mqtt server...');
this.mqtt.connect(options);
return this.mqtt;
}
onConnect() {
console.log('connected!');
onConnect(icontext) {
console.log('mqtt connected!');
var my = icontext.invocationContext;
this.mqtt.subscribe(this.options.channels.rider_location);
// subscribe to rider locations
console.log('subscribing to ' + my.options.channels.rider_location);
my.mqtt.subscribe(my.options.channels.rider_location);
// subscribe to jo locations
console.log('subscribing to ' + my.options.channels.jo_location);
my.mqtt.subscribe(my.options.channels.jo_location);
}
onMessage(msg) {
@ -44,6 +49,9 @@ class MapEventHandler {
case "rider":
this.handleRider(chan_split, payload);
break;
case "jo":
this.handleJobOrder(chan_split, payload);
break;
}
}
@ -52,7 +60,7 @@ class MapEventHandler {
switch (chan_split[2]) {
case "location":
console.log("got location for rider " + chan_split[1] + " - " + payload);
pl_split = payload.split(':');
var pl_split = payload.split(':');
console.log(pl_split);
// check for correct format
@ -62,19 +70,31 @@ class MapEventHandler {
var lat = parseFloat(pl_split[0]);
var lng = parseFloat(pl_split[1]);
// move marker
console.log(this.rider_markers[chan_split[1]]);
this.dashmap.putRiderAvaialbleMarker(chan_split[1], lat, lng);
break;
}
}
// check if marker exists
if (this.rider_markers.hasOwnProperty(chan_split[1])) {
// marker's there, move it
this.rider_markers[chan_split[1]].setLatLng(L.latLng(lat, lng));
} else {
// no marker, make one
console.log('creating marker');
// TODO: make it add to the correct map layer
this.rider_markers[chan_split[1]]= L.marker([lat, lng], { icon: this.options.icons.rider_available }).addTo(map);;
}
handleJobOrder(chan_split, payload) {
console.log("jo message");
switch (chan_split[2]) {
case "location":
var my = this;
var id = chan_split[1];
console.log("got location for jo " + id + " - " + payload);
var pl_split = payload.split(':');
// check for correct format
if (pl_split.length != 2)
break;
var lat = parseFloat(pl_split[0]);
var lng = parseFloat(pl_split[1]);
// move marker
console.log(lat + ' - ' + lng);
this.dashmap.putCustomerMarker(id, lat, lng);
break;
}
}

View file

@ -49,6 +49,24 @@ class JobOrderActiveCache
// when a job order is updated
public function postUpdate(JobOrder $jo, LifecycleEventArgs $args)
{
$status = $jo->getStatus();
switch ($status)
{
// active
case JOStatus::PENDING:
case JOStatus::RIDER_ASSIGN:
case JOStatus::ASSIGNED:
case JOStatus::IN_TRANSIT:
case JOStatus::IN_PROGRESS:
$this->processActiveJO($jo);
break;
// inactive
case JOStatus::CANCELLED:
case JOStatus::FULFILLED:
$this->processInactiveJO($jo);
break;
}
}
// when a job order is deleted
@ -62,9 +80,18 @@ class JobOrderActiveCache
// put in redis cache
error_log('add ' . $this->key . ' - (' . $coords->getLongitude() . ', ' . $coords->getLatitude() . ') - ' . $jo->getID());
$this->redis->geoadd($this->key, $coords->getLongitude(), $coords->getLatitude(), $jo->getID());
$this->redis->geoadd(
$this->key,
$coords->getLongitude(),
$coords->getLatitude(),
$jo->getID()
);
// TODO: publish to mqtt
// publish to mqtt
$this->mqtt->publish(
'jo/' . $jo->getID() . '/location',
$coords->getLatitude() . ':' . $coords->getLongitude()
);
}
protected function processInactiveJO($jo)

View file

@ -164,7 +164,7 @@ class CMBJobOrderHandler implements JobOrderHandlerInterface
$row['delivery_address'] = $orow->getDeliveryAddress();
$row['date_schedule'] = $orow->getDateSchedule()->format("d M Y g:i A");
$row['type'] = $orow->isAdvanceOrder() ? 'Advanced Order' : 'Immediate';
$row['service_type'] = $service_types[$orow->getServiceType()];
$row['service_type'] = $service_types[$orow->getServiceType()] ?? 'Unknown';
$row['status'] = $statuses[$orow->getStatus()];
$row['flag_advance'] = $orow->isAdvanceOrder();
$row['plate_number'] = $orow->getCustomerVehicle()->getPlateNumber();

View file

@ -43,14 +43,13 @@ function initMap(r_markers, c_markers, icons) {
function initEventHandler(dashmap) {
var options = {
'map': dashmap.map,
'channels': {
'rider_location': 'rider/+/location'
'rider_location': 'rider/+/location',
'jo_location': 'jo/+/location'
},
'icons': icons
};
var event_handler = new MapEventHandler(options, dashmap.rider_markers, dashmap.cust_markers);
var event_handler = new MapEventHandler(options, dashmap);
event_handler.connect('{{ app.user.getID }}', '{{ mqtt_host }}', {{ mqtt_port }});
}