From 4c90bf44d58722090739c554206a39eb3759cda0 Mon Sep 17 00:00:00 2001
From: Tom MacWright <tom@macwright.org>
Date: Fri, 2 Nov 2012 14:14:47 -0400
Subject: [PATCH] Indicate support, take DOM elements as input. Fixes #55.

---
 index.html            |  5 +++--
 js/iD/id.js           | 14 ++++++++++++++
 js/iD/renderer/Map.js | 12 ++++++++++--
 3 files changed, 27 insertions(+), 4 deletions(-)

diff --git a/index.html b/index.html
index 55478d68c..45df677ed 100755
--- a/index.html
+++ b/index.html
@@ -57,12 +57,13 @@
         <script type="text/javascript" src="js/iD/Graph.js"></script>
 
         <script>
-            var m = d3.select('#map'),
-                map = iD.Map('#map').setZoom(18).setCentre({
+            var map = iD.Map(document.getElementById('map')).setZoom(18).setCenter({
                 lat: 40.7965621,
                 lon: -74.4773184
             });
 
+            var m = d3.select('#map');
+
             iD.Hash().map(map);
 
             window.onresize = function() {
diff --git a/js/iD/id.js b/js/iD/id.js
index 73b11b555..9041b915c 100644
--- a/js/iD/id.js
+++ b/js/iD/id.js
@@ -1 +1,15 @@
 if (typeof iD === 'undefined') var iD = {};
+
+iD.supported = function() {
+    if (navigator.appName !== 'Microsoft Internet Explorer') {
+        return true;
+    } else {
+        var ua = navigator.userAgent;
+        var re = new RegExp("MSIE ([0-9]{1,}[\\.0-9]{0,})");
+        if (re.exec(ua) !== null) {
+            rv = parseFloat( RegExp.$1 );
+        }
+        if (rv && rv < 9) return false;
+        else return true;
+    }
+};
diff --git a/js/iD/renderer/Map.js b/js/iD/renderer/Map.js
index ec307921d..3f6a1f2e4 100755
--- a/js/iD/renderer/Map.js
+++ b/js/iD/renderer/Map.js
@@ -1,4 +1,12 @@
-iD.Map = function(parentSelector) {
+iD.Map = function(elem) {
+
+    if (!iD.supported()) {
+        elem.innerHTML = 'This editor is supported in Firefox, Chrome, Safari, Opera, ' +
+            'and Internet Explorer 9 and above. Please upgrade your browser ' +
+            'or use Potlatch 2 to edit the map.';
+        elem.style.cssText = 'text-align:center;font-style:italic;';
+        return;
+    }
 
     var map = {},
         width, height,
@@ -7,7 +15,7 @@ iD.Map = function(parentSelector) {
         graph = new iD.Graph(),
         connection = new iD.Connection(graph);
         inspector = iD.Inspector(graph),
-        parent = d3.selectAll(parentSelector),
+        parent = d3.select(elem),
         selection = [],
         projection = d3.geo.mercator()
             .scale(512).translate([512, 512]),