diff --git a/modules/behavior/operation.js b/modules/behavior/operation.js index d71790e54..a3456c674 100644 --- a/modules/behavior/operation.js +++ b/modules/behavior/operation.js @@ -1,5 +1,4 @@ import { event as d3_event } from 'd3-selection'; -import { uiFlash } from '../ui/flash'; /* Creates a keybinding behavior for an operation */ @@ -15,7 +14,7 @@ export function behaviorOperation(context) { var flash; if (disabled) { - flash = uiFlash() + flash = context.ui().flash .duration(4000) .iconName('#iD-operation-' + _operation.id) .iconClass('operation disabled') @@ -24,7 +23,7 @@ export function behaviorOperation(context) { flash(); } else { - flash = uiFlash() + flash = context.ui().flash .duration(2000) .iconName('#iD-operation-' + _operation.id) .iconClass('operation') diff --git a/modules/modes/drag_node.js b/modules/modes/drag_node.js index 79cc9c5fc..5db55a083 100644 --- a/modules/modes/drag_node.js +++ b/modules/modes/drag_node.js @@ -25,7 +25,6 @@ import { import { modeBrowse } from './browse'; import { modeSelect } from './select'; import { osmJoinWays, osmNode } from '../osm'; -import { uiFlash } from '../ui/flash'; import { utilArrayIntersection, utilKeybinding } from '../util'; @@ -136,7 +135,7 @@ export function modeDragNode(context) { if (_isCancelled) { if (hasHidden) { - uiFlash() + context.ui().flash .duration(4000) .text(t('modes.drag_node.connected_to_hidden'))(); } @@ -235,7 +234,7 @@ export function modeDragNode(context) { var nope = context.surface().classed('nope'); if (isInvalid === 'relation' || isInvalid === 'restriction') { if (!nope) { // about to nope - show hint - uiFlash() + context.ui().flash .duration(4000) .text(t('operations.connect.' + isInvalid, { relation: context.presets().item('type/restriction').name() } @@ -243,12 +242,12 @@ export function modeDragNode(context) { } } else if (isInvalid) { var errorID = isInvalid === 'line' ? 'lines' : 'areas'; - uiFlash() + context.ui().flash .duration(3000) .text(t('self_intersection.error.' + errorID))(); } else { if (nope) { // about to un-nope, remove hint - uiFlash() + context.ui().flash .duration(1) .text('')(); } diff --git a/modules/modes/draw_area.js b/modules/modes/draw_area.js index 15bf9cb9f..0b1ccfacf 100644 --- a/modules/modes/draw_area.js +++ b/modules/modes/draw_area.js @@ -1,6 +1,5 @@ import { t } from '../util/locale'; import { behaviorDrawWay } from '../behavior/draw_way'; -import { uiFlash } from '../ui/flash'; export function modeDrawArea(context, wayID, startGraph, button) { @@ -19,7 +18,7 @@ export function modeDrawArea(context, wayID, startGraph, button) { behavior = behaviorDrawWay(context, wayID, undefined, mode, startGraph) .tail(t('modes.draw_area.tail')) .on('rejectedSelfIntersection.modeDrawArea', function() { - uiFlash() + context.ui().flash .text(t('self_intersection.error.areas'))(); }); diff --git a/modules/modes/draw_line.js b/modules/modes/draw_line.js index 40d5840ff..4a16b336f 100644 --- a/modules/modes/draw_line.js +++ b/modules/modes/draw_line.js @@ -1,6 +1,5 @@ import { t } from '../util/locale'; import { behaviorDrawWay } from '../behavior/draw_way'; -import { uiFlash } from '../ui/flash'; export function modeDrawLine(context, wayID, startGraph, button, affix, continuing) { @@ -23,7 +22,7 @@ export function modeDrawLine(context, wayID, startGraph, button, affix, continui behavior = behaviorDrawWay(context, wayID, index, mode, startGraph) .tail(t('modes.draw_line.tail')) .on('rejectedSelfIntersection.modeDrawLine', function() { - uiFlash() + context.ui().flash .text(t('self_intersection.error.lines'))(); }); diff --git a/modules/ui/flash.js b/modules/ui/flash.js index f62ed0fc4..0ed943ca9 100644 --- a/modules/ui/flash.js +++ b/modules/ui/flash.js @@ -1,30 +1,27 @@ -import { select as d3_select } from 'd3-selection'; import { timeout as d3_timeout } from 'd3-timer'; -var _flashTimer; +export function uiFlash(context) { + var _flashTimer; - -export function uiFlash() { var _duration = 2000; var _iconName = '#iD-icon-no'; var _iconClass = 'disabled'; var _text = ''; - var _textClass; - + var _textClass; function flash() { if (_flashTimer) { _flashTimer.stop(); } - d3_select('.main-footer-wrap') + context.container().select('.main-footer-wrap') .classed('footer-hide', true) .classed('footer-show', false); - d3_select('.flash-wrap') + context.container().select('.flash-wrap') .classed('footer-hide', false) .classed('footer-show', true); - var content = d3_select('.flash-wrap').selectAll('.flash-content') + var content = context.container().select('.flash-wrap').selectAll('.flash-content') .data([0]); // Enter @@ -73,10 +70,10 @@ export function uiFlash() { _flashTimer = d3_timeout(function() { _flashTimer = null; - d3_select('.main-footer-wrap') + context.container().select('.main-footer-wrap') .classed('footer-hide', false) .classed('footer-show', true); - d3_select('.flash-wrap') + context.container().select('.flash-wrap') .classed('footer-hide', true) .classed('footer-show', false); }, _duration); diff --git a/modules/ui/geolocate.js b/modules/ui/geolocate.js index 32b0bc7d9..d7681e5c2 100644 --- a/modules/ui/geolocate.js +++ b/modules/ui/geolocate.js @@ -5,7 +5,6 @@ import { uiTooltip } from './tooltip'; import { geoExtent } from '../geo'; import { modeBrowse } from '../modes/browse'; import { svgIcon } from '../svg/icon'; -import { uiFlash } from './flash'; import { uiLoading } from './loading'; export function uiGeolocate(context) { @@ -61,7 +60,7 @@ export function uiGeolocate(context) { // use the position from a previous call if we have one zoomTo(); } else { - uiFlash() + context.ui().flash .text(t('geolocate.location_unavailable')) .iconName('#iD-icon-geolocate')(); } diff --git a/modules/ui/init.js b/modules/ui/init.js index 9279aa551..0dfe6e6bd 100644 --- a/modules/ui/init.js +++ b/modules/ui/init.js @@ -84,8 +84,7 @@ export function uiInit(context) { map .on('hitMinZoom.ui', function() { - uiFlash() - .text(t('cannot_zoom'))(); + ui.flash.text(t('cannot_zoom'))(); }); container @@ -448,6 +447,8 @@ export function uiInit(context) { }); }; + ui.flash = uiFlash(context); + ui.sidebar = uiSidebar(context); ui.photoviewer = uiPhotoviewer(context); diff --git a/test/spec/ui/flash.js b/test/spec/ui/flash.js index 29d843569..b43761f47 100644 --- a/test/spec/ui/flash.js +++ b/test/spec/ui/flash.js @@ -1,6 +1,8 @@ describe('iD.uiFlash', function () { + var context; beforeEach(function() { + context = iD.coreContext().init(); d3.select('body') .append('div') .attr('class', 'flash-wrap') @@ -14,7 +16,7 @@ describe('iD.uiFlash', function () { }); it('flash is shown', function() { - iD.uiFlash().duration(200)(); + iD.uiFlash(context).duration(200)(); var flashWrap = d3.selectAll('.flash-wrap'); var footerWrap = d3.selectAll('.main-footer-wrap'); expect(flashWrap.classed('footer-show')).to.be.ok; @@ -22,7 +24,7 @@ describe('iD.uiFlash', function () { }); it('flash goes away', function(done) { - iD.uiFlash().duration(200)(); + iD.uiFlash(context).duration(200)(); window.setTimeout(function() { d3.timerFlush(); var flashWrap = d3.selectAll('.flash-wrap');