From 3b36b1ad459ee739a87a32a18bb5846770125bec Mon Sep 17 00:00:00 2001 From: ivanshen Date: Tue, 5 Mar 2019 16:39:35 -0500 Subject: modularize plot points --- web/app.js | 2 +- web/public/javascripts/map.js | 32 ++++++++++++++------------------ web/routes/index.js | 6 +++++- 3 files changed, 20 insertions(+), 20 deletions(-) (limited to 'web') diff --git a/web/app.js b/web/app.js index 9d6e9d0..1bb97d8 100644 --- a/web/app.js +++ b/web/app.js @@ -26,7 +26,7 @@ var uri; if (env === 'development') { uri = 'mongodb://localhost:27017/helpthehome' // use for small testing only if really necessary - // uri = 'mongodb+srv://development:dreamteam@cluster0-krnr4.mongodb.net/helpthehome?retryWrites=true' + uri = 'mongodb+srv://development:dreamteam@cluster0-krnr4.mongodb.net/helpthehome?retryWrites=true' } else if (env === 'qa') { uri = process.env.MONGODB_URI } else if (env === 'production') { diff --git a/web/public/javascripts/map.js b/web/public/javascripts/map.js index 5739dec..2547780 100644 --- a/web/public/javascripts/map.js +++ b/web/public/javascripts/map.js @@ -3,6 +3,18 @@ // attribution: '© OpenStreetMap contributors' // }).addTo(map); +function plotPointsOnMap(points) { + L.geoJson(points, { + pointToLayer: function (feature, latlng) { + //return L.circleMarker(latlng); + return L.marker(latlng); + } + }).bindPopup(function (layer) { + // layer.feature.geometry gives you access to all the fields + return "

" + JSON.stringify(layer.feature.geometry) + "

"; + }).addTo(map) +} + // different basemap L.tileLayer('https://stamen-tiles-{s}.a.ssl.fastly.net/toner-lite/{z}/{x}/{y}{r}.{ext}', { attribution: 'Map tiles by Stamen Design, CC BY 3.0 — Map data © OpenStreetMap contributors', @@ -11,15 +23,7 @@ L.tileLayer('https://stamen-tiles-{s}.a.ssl.fastly.net/toner-lite/{z}/{x}/{y}{r} maxZoom: 18, ext: 'png' }).addTo(map); -L.geoJson(points, { - pointToLayer: function (feature, latlng) { - //return L.circleMarker(latlng); - return L.marker(latlng); - } -}).bindPopup(function (layer) { - // layer.feature.geometry gives you access to all the fields - return "

" + JSON.stringify(layer.feature.geometry) + "

"; -}).addTo(map) +plotPointsOnMap(points); if (!!window.EventSource) { var source = new EventSource('/stream'); @@ -27,15 +31,7 @@ if (!!window.EventSource) { var data = JSON.parse(e.data); if (data.coordinates) { points.push(data); - L.geoJson(points, { - pointToLayer: function (feature, latlng) { - //return L.circleMarker(latlng); - return L.marker(latlng); - } - }).bindPopup(function (layer) { - // layer.feature.geometry gives you access to all the fields - return "

" + JSON.stringify(layer.feature.geometry) + "

"; - }).addTo(map) + plotPointsOnMap(points); } }, false) diff --git a/web/routes/index.js b/web/routes/index.js index 885724d..b2ba91f 100644 --- a/web/routes/index.js +++ b/web/routes/index.js @@ -36,6 +36,7 @@ router.post('/mobilerequest', function(req, res) { console.log(`err inserting mobile request into db: ${err}`); res.status(500).send({ error: "boo:(" }); } else { + // send event to all connections for(var i = 0; i < connections.length; i++) { connections[i].sseSend(data); } @@ -48,8 +49,11 @@ router.post('/mobilerequest', function(req, res) { router.get('/stream', function(req, res){ - res.sseSetup() + // set up server side event (communication line between front end and server) + res.sseSetup(); + // send an event to the front end to open the connection res.sseSend('ok'); + // push connection to connection array connections.push(res); }); module.exports = router; -- cgit v1.2.3