Add uninstall functions to several toolbar items

Tweak toolbar item spacing

css/80_app.css

@@ -457,16 +457,13 @@ button[disabled].action:hover {
     position: relative;
     height: 40px;
     width: auto;
+    margin: 0 5px;
 }
 #bar .toolbar-item .item-label {
     text-align: center;
-    margin-top: 1px;
-    margin-bottom: 2px;
     font-size: 11px;
     white-space: nowrap;
-}
-#bar .toolbar-item:not(.spacer) {
-    margin: 0 5px 0 5px;
+    margin: 1px 2px 2px 2px;
 }
 #bar .toolbar-item.spacer {
     width: 100%;

modules/ui/tools/save.js

@@ -16,57 +16,54 @@ export function uiToolSave(context) {
         label: t('save.title')
     };
 
+    var button = null,
+        tooltipBehavior = null;
     var history = context.history();
     var key = uiCmd('⌘S');
     var _numChanges = 0;
 
+    function isSaving() {
+        var mode = context.mode();
+        return mode && mode.id === 'save';
+    }
 
-    tool.render = function(selection) {
+    function isDisabled() {
+        return _numChanges === 0 || isSaving();
+    }
 
-
-        function isSaving() {
-            var mode = context.mode();
-            return mode && mode.id === 'save';
+    function save() {
+        d3_event.preventDefault();
+        if (!context.inIntro() && !isSaving() && history.hasChanges()) {
+            context.enter(modeSave(context));
         }
+    }
 
-
-        function isDisabled() {
-            return _numChanges === 0 || isSaving();
+    function bgColor() {
+        var step;
+        if (_numChanges === 0) {
+            return null;
+        } else if (_numChanges <= 50) {
+            step = _numChanges / 50;
+            return d3_interpolateRgb('#fff', '#ff8')(step);  // white -> yellow
+        } else {
+            step = Math.min((_numChanges - 50) / 50, 1.0);
+            return d3_interpolateRgb('#ff8', '#f88')(step);  // yellow -> red
         }
+    }
 
+    function updateCount() {
+        var val = history.difference().summary().length;
+        if (val === _numChanges) return;
+        _numChanges = val;
 
-        function save() {
-            d3_event.preventDefault();
-            if (!context.inIntro() && !isSaving() && history.hasChanges()) {
-                context.enter(modeSave(context));
-            }
-        }
-
-
-        function bgColor() {
-            var step;
-            if (_numChanges === 0) {
-                return null;
-            } else if (_numChanges <= 50) {
-                step = _numChanges / 50;
-                return d3_interpolateRgb('#fff', '#ff8')(step);  // white -> yellow
-            } else {
-                step = Math.min((_numChanges - 50) / 50, 1.0);
-                return d3_interpolateRgb('#ff8', '#f88')(step);  // yellow -> red
-            }
-        }
-
-
-        function updateCount() {
-            var val = history.difference().summary().length;
-            if (val === _numChanges) return;
-            _numChanges = val;
-
+        if (tooltipBehavior) {
             tooltipBehavior
                 .title(uiTooltipHtml(
                     t(_numChanges > 0 ? 'save.help' : 'save.no_changes'), key)
                 );
+        }
 
+        if (button) {
             button
                 .classed('disabled', isDisabled())
                 .style('background', bgColor(_numChanges));
@@ -74,14 +71,17 @@ export function uiToolSave(context) {
             button.select('span.count')
                 .text(_numChanges);
         }
+    }
 
 
-        var tooltipBehavior = tooltip()
+    tool.render = function(selection) {
+
+        tooltipBehavior = tooltip()
             .placement('bottom')
             .html(true)
             .title(uiTooltipHtml(t('save.no_changes'), key));
 
-        var button = selection
+        button = selection
             .append('button')
             .attr('class', 'save disabled bar-button')
             .attr('tabindex', -1)
@@ -107,14 +107,31 @@ export function uiToolSave(context) {
 
         context
             .on('enter.save', function() {
-                button
-                    .classed('disabled', isDisabled());
+                if (button) {
+                    button
+                        .classed('disabled', isDisabled());
 
-                if (isSaving()) {
-                    button.call(tooltipBehavior.hide);
+                    if (isSaving()) {
+                        button.call(tooltipBehavior.hide);
+                    }
                 }
             });
     };
 
+    tool.uninstall = function() {
+
+        context.keybinding()
+            .off(key, true);
+
+        context.history()
+            .on('change.save', null);
+
+        context
+            .on('enter.save', null);
+
+        button = null;
+        tooltipBehavior = null;
+    };
+
     return tool;
 }

modules/ui/tools/search_add.js

@@ -37,7 +37,7 @@ export function uiToolSearchAdd(context) {
 
     var allowedGeometry = ['area', 'line', 'point', 'vertex'];
     var shownGeometry = [];
-
+    var key = t('modes.add_feature.key');
 
     function updateShownGeometry(geom) {
         shownGeometry = geom.sort();
@@ -68,8 +68,6 @@ export function uiToolSearchAdd(context) {
     tool.render = function(selection) {
         updateShownGeometry(allowedGeometry.slice());   // shallow copy
 
-        var key = t('modes.add_feature.key');
-
         searchWrap = selection
             .append('div')
             .attr('class', 'search-wrap')
@@ -164,7 +162,8 @@ export function uiToolSearchAdd(context) {
                 updateResultsList();
             });
 
-        context.features().on('change.search-add', updateForFeatureHiddenState);
+        context.features()
+            .on('change.search-add', updateForFeatureHiddenState);
 
         context.keybinding().on(key, function() {
             search.node().focus();
@@ -183,6 +182,17 @@ export function uiToolSearchAdd(context) {
         updateResultsList();
     };
 
+    tool.uninstall = function() {
+        context.keybinding().off(key);
+
+        context.features()
+            .on('change.search-add', null);
+
+        context.map()
+            .on('move.search-add', null)
+            .on('drawn.search-add', null);
+    };
+
     function osmEditable() {
         var mode = context.mode();
         return context.editable() && mode && mode.id !== 'save';

modules/ui/tools/undo_redo.js

@@ -100,5 +100,21 @@ export function uiToolUndoRedo(context) {
         }
     };
 
+    tool.uninstall = function() {
+        context.keybinding()
+            .off(commands[0].cmd)
+            .off(commands[1].cmd);
+
+        context.map()
+            .on('move.undo_redo', null)
+            .on('drawn.undo_redo', null);
+
+        context.history()
+            .on('change.undo_redo', null);
+
+        context
+            .on('enter.undo_redo', null);
+    };
+
     return tool;
 }