From a4367d5c946cea388851d511c8c1e41b9c6b617f Mon Sep 17 00:00:00 2001
From: Christopher Baines <cbaines8@gmail.com>
Date: Sun, 3 Feb 2013 13:29:26 +0000
Subject: Add popups for settlements

---
 resources/map.js | 28 +++++++++++++++++++++++++++-
 1 file changed, 27 insertions(+), 1 deletion(-)

diff --git a/resources/map.js b/resources/map.js
index b51e456..6567510 100644
--- a/resources/map.js
+++ b/resources/map.js
@@ -186,7 +186,23 @@ function displayMap(self, map) {
 							color: 'black',
 							dashArray: '3',
 							fillOpacity: 0.1};
-				}
+				},
+                onEachFeature: function(feature, layer) {
+                    var center;
+                    if (feature.geometry.type === "Point") {
+                        center = feature.geometry.coordinates;
+                    } else {
+                        center = feature.geometry.coordinates[0];
+                    }
+
+                    var displayProperties = { name: feature.properties["name"], population: feature.properties["population"] };
+                    if (typeof displayProperties["name"] == "undefined")
+                        displayProperties["name"] = "Unknown";
+                    if (typeof displayProperties["population"] == "undefined")
+                        displayProperties["population"] = "Unknown";
+
+                    layer.bindPopup(self.settlementPopupTemplate({ properties: feature.properties, coordinate: center }));
+                },
 			});
 			map.addLayer(self.villageLayer);
 			self.layersControl.addOverlay(self.villageLayer, "Settlements");
@@ -257,6 +273,16 @@ $(document).ready(function() {
 <tr><td>Population</td><td align="right"><%= properties["population"] %></td></tr>\
 <tr><td>Furthest distance from settlement to health structure</td><td align="right"><%= properties["greatest_settlement_dist"] %></td></tr>\
 <tr><td>Average distance of all settlements from health structure</td><td align="right"><%= properties["average_settlement_dist"] %></td></tr>\
+</table>');
+
+	self.settlementPopupTemplate = _.template('<a href="http://www.openstreetmap.org/edit?editor=potlatch2&lat=<%= coordinate[1] %>&lon=<%= coordinate[0] %>&zoom=18">\
+<img src="resources/img/potlatch.png"></a>\
+<a href="http://www.openstreetmap.org/edit?editor=remote&lat=<%= coordinate[1] %>&lon=<%= coordinate[0] %>&zoom=18">\
+<img src="resources/img/josm.png"></a>\
+<h3>Settlement</h3>\
+<table width="100%">\
+<tr><td>Name</td><td align="right"><%= properties["name"] %></td></tr>\
+<tr><td>Population</td><td align="right"><%= properties["population"] %></td></tr>\
 </table>');
 
 	self.tileLayer = L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
-- 
cgit v1.2.3