From 807fbe882dc4a5aed9380553f083f176e8d1c04c Mon Sep 17 00:00:00 2001
From: Tom MacWright <tom@macwright.org>
Date: Wed, 27 Mar 2013 17:31:31 -0400
Subject: [PATCH] Failsafe browser detection system

---
 css/app.css         |  7 +++++++
 index.html          | 15 +++++++++------
 index_packaged.html | 11 ++++++++---
 js/id/id.js         | 12 ++++++++++++
 js/id/ui.js         | 10 ----------
 5 files changed, 36 insertions(+), 19 deletions(-)

diff --git a/css/app.css b/css/app.css
index 05efc3833..c3e8174fd 100644
--- a/css/app.css
+++ b/css/app.css
@@ -12,6 +12,13 @@ body {
     -webkit-font-smoothing: subpixel-antialiased;
 }
 
+.unsupported {
+    text-align: center;
+    vertical-align: middle;
+    padding-top: 100px;
+    font-size: 16px;
+}
+
 #iD {
     height: 100%;
     width: 100%;
diff --git a/index.html b/index.html
index c583b8f64..bb7b691c1 100644
--- a/index.html
+++ b/index.html
@@ -191,12 +191,15 @@
         <div id='iD'></div>
         <script>
             var div = document.getElementById('iD');
-            if (!iD.detect().support) return iD.
-            iD.data.load(function() {
-                id = iD();
-                d3.select(div)
-                    .call(id.ui());
-            })
+            if (!iD.detect().support) {
+                iD.unsupported(div);
+            } else {
+                iD.data.load(function() {
+                    id = iD();
+                    d3.select(div)
+                        .call(id.ui());
+                })
+            }
         </script>
     </body>
 </html>
diff --git a/index_packaged.html b/index_packaged.html
index 92e00ee63..7634c290e 100644
--- a/index_packaged.html
+++ b/index_packaged.html
@@ -40,9 +40,14 @@
             a.src=document.location.protocol+"//dnn506yrbagrg.cloudfront.net/pages/scripts/0013/6714.js?"+Math.floor(new Date().getTime()/3600000);
             a.async=true;a.type="text/javascript";b.parentNode.insertBefore(a,b)}, 1);
 
-            var id = iD();
-            d3.select('#iD')
-                .call(id.ui());
+            var div = document.getElementById('iD');
+            if (!iD.detect().support) {
+                iD.unsupported(div);
+            } else {
+                var id = iD();
+                d3.select(div)
+                    .call(id.ui());
+            }
         </script>
     </body>
 </html>
diff --git a/js/id/id.js b/js/id/id.js
index 8048175e9..54711e7a6 100644
--- a/js/id/id.js
+++ b/js/id/id.js
@@ -165,6 +165,8 @@ iD.detect = function() {
         browser.support = true;
     }
 
+    browser.support = false;
+
     // Added due to incomplete svg style support. See #715
     browser.opera = ua.indexOf('Opera') >= 0;
 
@@ -184,3 +186,13 @@ iD.detect = function() {
 
     return browser;
 };
+
+iD.unsupported = function(div) {
+    try {
+        div.innerHTML = t('browser_notice');
+    } catch(e) {
+        div.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.';
+    }
+    div.className = 'unsupported';
+};
diff --git a/js/id/ui.js b/js/id/ui.js
index b8540f9fd..c26e1ca0d 100644
--- a/js/id/ui.js
+++ b/js/id/ui.js
@@ -5,16 +5,6 @@ iD.ui = function(context) {
         var history = context.history(),
             map = context.map();
 
-        if (!iD.detect().support) {
-            container
-                .text(t('browser_notice'))
-                .style({
-                    'text-align': 'center',
-                    'font-style': 'italic'
-                });
-            return;
-        }
-
         if (iD.detect().opera) container.classed('opera', true);
 
         var hash = iD.behavior.Hash(context);