Modal Dialog and Save/Restore improvements

(closes #3036)

1. Fix the modal close button icon - was not visible
2. Use a blocking modal for the Save/Restore dialog
3. Don't allow `context.save()` while modal is visible
   (especially for `onbeforeunload` event - this would wipe user's saved
    history if browser is closed while the Save/Restore modal was visible)
4. Don't allow blocking modals to be dismissed by pressing escape
5. Don't show the close button icon for blocking modals

js/id/id.js

@@ -107,7 +107,7 @@ window.iD = function () {
     };
 
     context.save = function() {
-        if (inIntro || (mode && mode.id === 'save')) return;
+        if (inIntro || (mode && mode.id === 'save') || d3.select('.modal').size()) return;
         history.save();
         if (history.hasChanges()) return t('save.unsaved_changes');
     };

js/id/ui/modal.js

@@ -1,5 +1,5 @@
 iD.ui.modal = function(selection, blocking) {
-
+    var keybinding = d3.keybinding('modal');
     var previous = selection.select('div.modal');
     var animate = previous.empty();
 
@@ -23,29 +23,32 @@ iD.ui.modal = function(selection, blocking) {
             .transition()
             .duration(200)
             .style('top','0px');
+
         keybinding.off();
     };
 
-    var keybinding = d3.keybinding('modal')
-        .on('⌫', shaded.close)
-        .on('⎋', shaded.close);
-
-    d3.select(document).call(keybinding);
 
     var modal = shaded.append('div')
         .attr('class', 'modal fillL col6');
 
+    if (!blocking) {
         shaded.on('click.remove-modal', function() {
-            if (d3.event.target === this && !blocking) shaded.close();
+            if (d3.event.target === this) {
+                shaded.close();
+            }
         });
 
-    modal.append('button')
-        .attr('class', 'close')
-        .on('click', function() {
-            if (!blocking) shaded.close();
-        })
-        .append('div')
-            .attr('class','icon close');
+        modal.append('button')
+            .attr('class', 'close')
+            .on('click', shaded.close)
+            .call(iD.svg.Icon('#icon-close'));
+
+        keybinding
+            .on('⌫', shaded.close)
+            .on('⎋', shaded.close);
+
+        d3.select(document).call(keybinding);
+    }
 
     modal.append('div')
         .attr('class', 'content');

js/id/ui/restore.js

@@ -3,7 +3,7 @@ iD.ui.Restore = function(context) {
         if (!context.history().lock() || !context.history().restorableChanges())
             return;
 
-        var modal = iD.ui.modal(selection);
+        var modal = iD.ui.modal(selection, true);
 
         modal.select('.modal')
             .attr('class', 'modal fillL col6');