From a9ac1bda971bcfcbd56ad41b483e26a8bb6c6573 Mon Sep 17 00:00:00 2001 From: Bryan Housel Date: Thu, 17 Jan 2019 00:06:57 -0500 Subject: [PATCH] Fix issues causing mode/undo/save buttons to be missing disabled style --- modules/renderer/map.js | 11 +++++- modules/ui/modes.js | 33 ++++++++++------ modules/ui/save.js | 88 ++++++++++++++++++++++------------------- 3 files changed, 77 insertions(+), 55 deletions(-) diff --git a/modules/renderer/map.js b/modules/renderer/map.js index d8f3ef459..8398bdd0d 100644 --- a/modules/renderer/map.js +++ b/modules/renderer/map.js @@ -330,9 +330,16 @@ export function rendererMap(context) { surface.selectAll('.layer-osm *').remove(); surface.selectAll('.layer-touch:not(.markers) *').remove(); + var allowed = { + 'browse': true, + 'save': true, + 'select-note': true, + 'select-data': true, + 'select-error': true + }; + var mode = context.mode(); - if (mode && mode.id !== 'save' && mode.id !== 'select-note' && - mode.id !== 'select-data' && mode.id !== 'select-error') { + if (mode && !allowed[mode.id]) { context.enter(modeBrowse(context)); } diff --git a/modules/ui/modes.js b/modules/ui/modes.js index 238d2794e..35dfcc347 100644 --- a/modules/ui/modes.js +++ b/modules/ui/modes.js @@ -22,7 +22,16 @@ export function uiModes(context) { modeAddNote(context) ]; - function editable() { + + function enabled(d) { + if (d.id === 'add-note') { + return notesEnabled() && notesEditable(); + } else { + return osmEditable(); + } + } + + function osmEditable() { var mode = context.mode(); return context.editable() && mode && mode.id !== 'save'; } @@ -37,6 +46,7 @@ export function uiModes(context) { return context.map().notesEditable() && mode && mode.id !== 'save'; } + return function(selection) { context .on('enter.editor', function(entered) { @@ -54,8 +64,7 @@ export function uiModes(context) { modes.forEach(function(mode) { context.keybinding().on(mode.key, function() { - if (mode.id === 'add-note' && !(notesEnabled() && notesEditable())) return; - if (mode.id !== 'add-note' && !editable()) return; + if (!enabled(mode)) return; if (mode.id === context.mode().id) { context.enter(modeBrowse(context)); @@ -94,23 +103,23 @@ export function uiModes(context) { .append('button') .attr('tabindex', -1) .attr('class', function(d) { return d.id + ' add-button'; }) - .on('click.mode-buttons', function(mode) { + .on('click.mode-buttons', function(d) { + if (!enabled(d)) return; + // When drawing, ignore accidental clicks on mode buttons - #4042 var currMode = context.mode().id; - if (currMode.match(/^draw/) !== null) return; + if (/^draw/.test(currMode)) return; - if (mode.id === currMode) { + if (d.id === currMode) { context.enter(modeBrowse(context)); } else { - context.enter(mode); + context.enter(d); } }) .call(tooltip() .placement('bottom') .html(true) - .title(function(mode) { - return uiTooltipHtml(mode.description, mode.key); - }) + .title(function(d) { return uiTooltipHtml(d.description, d.key); }) ); buttonsEnter @@ -132,9 +141,7 @@ export function uiModes(context) { // update buttons = buttons .merge(buttonsEnter) - .property('disabled', function(d) { - return d.id === 'add-note' ? !notesEditable() : !editable(); - }); + .classed('disabled', function(d) { return !enabled(d); }); } }; } diff --git a/modules/ui/save.js b/modules/ui/save.js index 632d0ef48..a818941f7 100644 --- a/modules/ui/save.js +++ b/modules/ui/save.js @@ -12,57 +12,61 @@ import { tooltip } from '../util/tooltip'; export function uiSave(context) { var history = context.history(); var key = uiCmd('⌘S'); - - - function saving() { - var mode = context.mode(); - return mode && mode.id === 'save'; - } - - - function save() { - d3_event.preventDefault(); - if (!context.inIntro() && !saving() && history.hasChanges()) { - context.enter(modeSave(context)); - } - } - - - function getBackground(numChanges) { - 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 - } - } + var _numChanges = 0; return function(selection) { - var numChanges = 0; + + + function isSaving() { + var mode = context.mode(); + return mode && mode.id === 'save'; + } + + + function isDisabled() { + return _numChanges === 0 || isSaving(); + } + + + 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 _ = history.difference().summary().length; - if (_ === numChanges) return; - numChanges = _; + var val = history.difference().summary().length; + if (val === _numChanges) return; + _numChanges = val; tooltipBehavior .title(uiTooltipHtml( - t(numChanges > 0 ? 'save.help' : 'save.no_changes'), key) + t(_numChanges > 0 ? 'save.help' : 'save.no_changes'), key) ); - var background = getBackground(numChanges); - button - .classed('disabled', numChanges === 0) - .style('background', background); + .classed('disabled', isDisabled()) + .style('background', bgColor(_numChanges)); button.select('span.count') - .text(numChanges); + .text(_numChanges); } @@ -102,8 +106,12 @@ export function uiSave(context) { context .on('enter.save', function() { - button.property('disabled', saving()); - if (saving()) button.call(tooltipBehavior.hide); + button + .classed('disabled', isDisabled()); + + if (isSaving()) { + button.call(tooltipBehavior.hide); + } }); }; }