3 files changed, 99 insertions, 6 deletions

diff --git a/web/models/points.js b/web/models/points.js
index 7bb4e24..e8c181e 100644
--- a/web/models/points.js
+++ b/web/models/points.js
@@ -26,6 +26,14 @@ exports.get_points = function(callback) {
 	});
 }
 
+exports.get_all_active_points = function(callback) {
+	var activeStatusTypes = ["new", "pending"];
+	Json.find({ status: { $in: activeStatusTypes } }).exec(function(err, docs) {
+		if (err) callback(err, null);
+		callback(null, docs);
+	});
+}
+
 // this function stores A user report into the db
 exports.save_request = function(data, callback) {
 	Json.create(data, function(err, result) {
@@ -33,3 +41,13 @@ exports.save_request = function(data, callback) {
 		callback(null, result);
 	});
 }
+
+exports.update_point_status = function(id, newStatus, callback) {
+	Json.findByIdAndUpdate(id, {status: newStatus}, {new: true},
+		function(err, result) {
+			if (err) callback(err, null);
+			// result contains the updated point document
+			callback(null, result);
+		}
+	);
+}
diff --git a/web/public/javascripts/map.js b/web/public/javascripts/map.js
index 544da9e..17b9208 100644
--- a/web/public/javascripts/map.js
+++ b/web/public/javascripts/map.js
@@ -13,11 +13,23 @@ const Races = {
 	"Other"     : "Other",
 };
 
+const PendingIcon = new L.Icon({
+	iconAnchor: [ 12, 41 ],
+	iconUrl: "../assets/orange-icon.png",
+	iconSize: [ 25, 41 ],
+	popupAnchor: [ 1, -34 ],
+	shadowSize: [ 41, 41 ],
+	tooltipAnchor: [ 16, -28 ]
+});
+
 function plotPointsOnMap(points) {
 	L.geoJson(points, {
 		pointToLayer: function (feature, latlng) {
 			//return L.circleMarker(latlng);
 			latlngbounds.extend(latlng);
+			if (feature.status === "pending") {
+				return L.marker(latlng, {icon: PendingIcon});
+			}
 			return L.marker(latlng);
 		}
 	}).on('click', showDetails).addTo(map);
@@ -33,7 +45,7 @@ function showDetails(e) {
 	// layer.feature.geometry gives you access to all the fields
 	let layer = e.layer;
 	currPoint = layer;
-	
+
 	let sideBar = document.getElementById('sidebar');
 
 	if (getComputedStyle(sideBar).visibility === 'hidden') {
@@ -93,11 +105,34 @@ function showDetails(e) {
 }
 
 function markAsPending(e) {
-	currPoint._icon.src = '../assets/orange-icon.png';
+	let currPointDetails = currPoint.feature.geometry;
+	let currPointId = currPointDetails._id;
+	if (currPointDetails.status === "pending") return;
+
+	updatePointStatusInDb(currPointId, "pending")
+		.then(function(responseJson) {
+			alert("Your change has been saved.");
+			currPoint._icon.src = '../assets/orange-icon.png';
+		})
+		.catch(function(error) {
+			alert(error);
+		});
 }
 
 function markAsCompleted(e) {
-	map.removeLayer(currPoint);
+	let currPointDetails = currPoint.feature.geometry;
+	let currPointId = currPointDetails._id;
+	if (currPointDetails.status === "complete") return;
+
+	updatePointStatusInDb(currPointId, "complete")
+		.then(function(responseJson) {
+			alert("Your change has been saved.");
+			map.removeLayer(currPoint);
+		})
+		.catch(function(error) {
+			alert(error);
+		});
+	closeDetails();
 }
 
 function closeDetails(e) {
@@ -105,6 +140,23 @@ function closeDetails(e) {
 	details.style.visibility = 'hidden';
 }
 
+// returns a Promise object
+function updatePointStatusInDb(pointId, pointStatus) {
+	return fetch('/savestatus/' + pointStatus, {
+		method: "POST",
+		headers: {
+			"Content-Type": "application/json",
+		},
+		body: JSON.stringify({id: pointId}),
+	})
+	.then(function(response) {
+		if (response.ok) {
+			return response.json();
+		}
+		throw new Error("We were unable to save your changes.");
+	});
+}
+
 // 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',
diff --git a/web/routes/index.js b/web/routes/index.js
index 1ecce83..2633c04 100644
--- a/web/routes/index.js
+++ b/web/routes/index.js
@@ -17,9 +17,7 @@ router.get('/', function(req, res, next) {
 
 /* GET Map page. */
 router.get('/map', function(req,res) {
-	// load the map with all the points
-	// Mockpoints.get_points(function(err, points){
-	Points.get_points(function(err, points){
+	Points.get_all_active_points(function(err, points){
 		res.render('map', {
 			lat : 43.665234,
 			lng : -79.383370,
@@ -57,6 +55,31 @@ router.post('/mobilerequest', function(req, res) {
 	});
 });
 
+router.post('/savestatus/:status', function(req, res) {
+	var data = req.body;
+	var pointId = data.id;
+	var setStatus = req.params.status;
+	if (
+			setStatus !== "new" &&
+			setStatus !== "pending" &&
+			setStatus !== "complete"
+	) {
+		console.log("Invalid status supplied.");
+		return res.status(422).send({error: "Error: Status must be one of 'new', 'pending', or 'complete'"});
+	}
+
+	// here we are guaranteed to be able to do the query
+	Points.update_point_status(pointId, setStatus, function(err, result) {
+		if (err) {
+			console.log(`err updating point status in db: ${err}`);
+			res.status(500).send({ error: "Oops. Something went wrong on our end." });
+		} else {
+			console.log(result);
+			res.status(200).send({'status': 'success'});
+		}
+	});
+});
+
 router.get('/stream', function(req, res){
 	// set up server side event (communication line between front end and server)
 	res.sseSetup();