4 files changed, 82 insertions, 17 deletions

diff --git a/web/app.js b/web/app.js
index f0ae3a5..9d6e9d0 100644
--- a/web/app.js
+++ b/web/app.js
@@ -19,6 +19,7 @@ app.use(express.json());
 app.use(express.urlencoded({ extended: false }));
 app.use(cookieParser());
 app.use(express.static(path.join(__dirname, 'public')));
+app.use(require('./routes/sse'));
 
 var env = process.env.NODE_ENV || 'development';
 var uri;
@@ -45,7 +46,6 @@ mongoose.connect(uri, { useNewUrlParser: true }, function (error) {
 
 app.use('/', indexRouter);
 app.use('/users', usersRouter);
-
 // catch 404 and forward to error handler
 app.use(function(req, res, next) {
   next(createError(404));
diff --git a/web/public/javascripts/map.js b/web/public/javascripts/map.js
index 4a1e697..3f33bcf 100644
--- a/web/public/javascripts/map.js
+++ b/web/public/javascripts/map.js
@@ -3,21 +3,19 @@
 //     attribution: '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
 // }).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 <a href="http://stamen.com">Stamen Design</a>, <a href="http://creativecommons.org/licenses/by/3.0">CC BY 3.0</a> &mdash; Map data &copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors',
-	subdomains: 'abcd',
-	minZoom: 0,
-	maxZoom: 18,
-	ext: 'png'
-}).addTo(map);
+function plotPointsOnMap(points) {
+	L.geoJson(points, {
+		pointToLayer: function (feature, latlng) {
+			//return L.circleMarker(latlng);
+			latlngbounds.extend(latlng);
+			return L.marker(latlng);
+		}
+	}).on('click', showDetails).addTo(map)
 
-L.geoJson(points, {
-	pointToLayer: function (feature, latlng) {
-		//return L.circleMarker(latlng);
-		return L.marker(latlng);
-	}
-}).on('click', showDetails).addTo(map)
+	// rezoom the map so that all the markers fit in the view, add 20% padding so
+	// that marker dont cut off
+	map.fitBounds(latlngbounds.pad(0.20));
+}
 
 // show details about point
 // e is the event info
@@ -85,4 +83,42 @@ function showDetails(e) {
 function closeDetails(e) {
 	let details = document.getElementById('sidebar')
 	details.style.visibility = 'hidden'
-}
\ No newline at end of file
+}
+
+// different basemap
+L.tileLayer('https://stamen-tiles-{s}.a.ssl.fastly.net/toner-lite/{z}/{x}/{y}{r}.{ext}', {
+	attribution: 'Map tiles by <a href="http://stamen.com">Stamen Design</a>, <a href="http://creativecommons.org/licenses/by/3.0">CC BY 3.0</a> &mdash; Map data &copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors',
+	subdomains: 'abcd',
+	minZoom: 0,
+	maxZoom: 18,
+	ext: 'png'
+}).addTo(map);
+
+// keep track of the boundary of the markers so that we can update the
+// map to fit them all
+var latlngbounds = new L.latLngBounds();
+
+plotPointsOnMap(points);
+if (window.EventSource) {
+	var source = new EventSource('/stream');
+
+	source.addEventListener('message', function(e) {
+		var data = JSON.parse(e.data);
+		if (data.coordinates) {
+			points.push(data);
+			plotPointsOnMap(points);
+		}
+	}, false)
+
+	source.addEventListener('open', function(e) {
+	  console.log("Connection was opened")
+	}, false)
+
+	source.addEventListener('error', function(e) {
+	  if (e.readyState == EventSource.CLOSED) {
+		console.log("Connection was closed")
+	  }
+	}, false)
+} else {
+	console.log("sse not supported.");
+}
diff --git a/web/routes/index.js b/web/routes/index.js
index b2d0796..b2ba91f 100644
--- a/web/routes/index.js
+++ b/web/routes/index.js
@@ -2,7 +2,7 @@ var express = require('express');
 var router = express.Router();
 var Mockpoints = require('../models/mockpoints');
 var Points = require('../models/points');
-
+const connections = [];
 /* GET home page. */
 router.get('/', function(req, res, next) {
 	// for now just redirect to /map
@@ -36,10 +36,24 @@ 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);
+			}
 			console.log(result);
 			res.status(200).send({'status': 'success', 'data': data});
 		}
 	});
+	
 });
 
+
+router.get('/stream', function(req, res){
+	// 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;
diff --git a/web/routes/sse.js b/web/routes/sse.js
new file mode 100644
index 0000000..5cd9a3f
--- /dev/null
+++ b/web/routes/sse.js
@@ -0,0 +1,15 @@
+module.exports = function (req, res, next) {
+  res.sseSetup = function() {
+    res.writeHead(200, {
+      'Content-Type': 'text/event-stream',
+      'Cache-Control': 'no-cache',
+      'Connection': 'keep-alive'
+    })
+  }
+
+  res.sseSend = function(data) {
+    res.write("data: " + JSON.stringify(data) + "\n\n");
+  }
+
+  next()
+}
\ No newline at end of file