Add handler for rider location updates in dashboard #299
This commit is contained in:
parent
b435cdfa1b
commit
67a7b86f32
2 changed files with 58 additions and 7 deletions
|
|
@ -35,15 +35,60 @@ var port = 8083;
|
|||
function onConnect() {
|
||||
console.log('connected!');
|
||||
|
||||
mqtt.subscribe('test.channel');
|
||||
mqtt.subscribe('rider/+/location');
|
||||
}
|
||||
|
||||
function onMessage(msg) {
|
||||
console.log(msg);
|
||||
// console.log(msg);
|
||||
console.log('received message');
|
||||
|
||||
var channel = msg.destinationName;
|
||||
var chan_split = channel.split('/');
|
||||
var payload = msg.payloadString;
|
||||
|
||||
// handle different channels
|
||||
switch (chan_split[0]) {
|
||||
case "rider":
|
||||
handleRider(chan_split, payload);
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
function handleRider(chan_split, payload) {
|
||||
console.log("rider message");
|
||||
switch (chan_split[2]) {
|
||||
case "location":
|
||||
console.log("got location for rider " + chan_split[1] + " - " + payload);
|
||||
pl_split = payload.split(':');
|
||||
console.log(pl_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(rider_markers[chan_split[1]]);
|
||||
|
||||
// check if marker exists
|
||||
if (rider_markers.hasOwnProperty(chan_split[1])) {
|
||||
// marker's there, move it
|
||||
rider_markers[chan_split[1]].setLatLng(L.latLng(lat, lng));
|
||||
} else {
|
||||
// TODO: no marker, make one
|
||||
}
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
function mqttConnect() {
|
||||
mqtt = new Paho.MQTT.Client(host, port, "clientjs");
|
||||
var d = new Date();
|
||||
var client_id = "dash-{{ app.user.getID }}-" + d.getMonth() + "-" + d.getDate() + "-" + d.getHours() + "-" + d.getMinutes() + "-" + d.getSeconds() + "-" + d.getMilliseconds();
|
||||
console.log(client_id);
|
||||
|
||||
mqtt = new Paho.MQTT.Client(host, port, client_id);
|
||||
var options = {
|
||||
timeout: 3,
|
||||
onSuccess: onConnect,
|
||||
|
|
|
|||
|
|
@ -5,6 +5,8 @@
|
|||
|
||||
<script>
|
||||
|
||||
var rider_markers = {};
|
||||
|
||||
function mapCreate(div_id, center_lat, center_lng, map_type, zoom) {
|
||||
var map = L.map(div_id).setView(
|
||||
[center_lat, center_lng],
|
||||
|
|
@ -92,15 +94,19 @@ function mapCreate(div_id, center_lat, center_lng, map_type, zoom) {
|
|||
cust_popup += jo_data['stype'] + '<br>';
|
||||
cust_popup += jo_data['status'];
|
||||
|
||||
var rider_marker = L.marker([lat, long], { icon: icon_rider_active_jo }).bindPopup(rider_popup);
|
||||
rider_markers[rider_id] = L.marker([lat, long], { icon: icon_rider_active_jo }).bindPopup(rider_popup);
|
||||
// var rider_marker = L.marker([lat, long], { icon: icon_rider_active_jo }).bindPopup(rider_popup);
|
||||
var cust_marker = L.marker([clat, clong], { icon: icon_customer }).bindPopup(cust_popup);
|
||||
lg_cust.addLayer(cust_marker);
|
||||
lg_jo_rider.addLayer(rider_marker);
|
||||
lg_jo_rider.addLayer(rider_markers[rider_id]);
|
||||
} else {
|
||||
var rider_marker = L.marker([lat, long], { icon: icon_rider_available }).bindPopup(rider_popup);
|
||||
lg_avail_rider.addLayer(rider_marker);
|
||||
rider_markers[rider_id]= L.marker([lat, long], { icon: icon_rider_available }).bindPopup(rider_popup);
|
||||
// var rider_marker = L.marker([lat, long], { icon: icon_rider_available }).bindPopup(rider_popup);
|
||||
lg_avail_rider.addLayer(rider_markers[rider_id]);
|
||||
}
|
||||
});
|
||||
|
||||
// console.log(rider_markers);
|
||||
});
|
||||
|
||||
// base layer
|
||||
|
|
|
|||
Loading…
Reference in a new issue