diff --git a/modules/behavior/copy.js b/modules/behavior/copy.js index 4aaca957f..247bc6ba2 100644 --- a/modules/behavior/copy.js +++ b/modules/behavior/copy.js @@ -7,12 +7,12 @@ import { select as d3_select } from 'd3-selection'; -import { d3keybinding as d3_keybinding } from '../lib/d3.keybinding.js'; +import { utilKeybinding } from '../util'; import { uiCmd } from '../ui'; export function behaviorCopy(context) { - var keybinding = d3_keybinding('copy'); + var keybinding = utilKeybinding('copy'); function groupEntities(ids, graph) { diff --git a/modules/behavior/draw.js b/modules/behavior/draw.js index 54517c62d..8640b4ce0 100644 --- a/modules/behavior/draw.js +++ b/modules/behavior/draw.js @@ -7,12 +7,11 @@ import { touches as d3_touches } from 'd3-selection'; -import { d3keybinding as d3_keybinding } from '../lib/d3.keybinding.js'; import { behaviorEdit } from './edit'; import { behaviorHover } from './hover'; import { behaviorTail } from './tail'; import { geoChooseEdge, geoVecLength } from '../geo'; -import { utilRebind } from '../util/rebind'; +import { utilKeybinding, utilRebind } from '../util'; var _usedTails = {}; @@ -25,7 +24,7 @@ export function behaviorDraw(context) { 'move', 'click', 'clickWay', 'clickNode', 'undo', 'cancel', 'finish' ); - var keybinding = d3_keybinding('draw'); + var keybinding = utilKeybinding('draw'); var hover = behaviorHover(context).altDisables(true) .on('hover', context.ui().sidebar.hover); diff --git a/modules/behavior/draw_way.js b/modules/behavior/draw_way.js index 148a6fd89..e99da7b32 100644 --- a/modules/behavior/draw_way.js +++ b/modules/behavior/draw_way.js @@ -5,8 +5,6 @@ import { select as d3_select } from 'd3-selection'; -import { d3keybinding as d3_keybinding } from '../lib/d3.keybinding.js'; - import { actionAddMidpoint, actionMoveNode, @@ -17,6 +15,7 @@ import { behaviorDraw } from './draw'; import { geoChooseEdge, geoHasSelfIntersections } from '../geo'; import { modeBrowse, modeSelect } from '../modes'; import { osmNode } from '../osm'; +import { utilKeybinding } from '../util'; export function behaviorDrawWay(context, wayId, index, mode, startGraph) { @@ -41,9 +40,8 @@ export function behaviorDrawWay(context, wayId, index, mode, startGraph) { _tempEdits++; - function keydown() { - if (d3_event.keyCode === d3_keybinding.modifierCodes.alt) { + if (d3_event.keyCode === utilKeybinding.modifierCodes.alt) { if (context.surface().classed('nope')) { context.surface() .classed('nope-suppressed', true); @@ -56,7 +54,7 @@ export function behaviorDrawWay(context, wayId, index, mode, startGraph) { function keyup() { - if (d3_event.keyCode === d3_keybinding.modifierCodes.alt) { + if (d3_event.keyCode === utilKeybinding.modifierCodes.alt) { if (context.surface().classed('nope-suppressed')) { context.surface() .classed('nope', true); diff --git a/modules/behavior/hover.js b/modules/behavior/hover.js index 99d12a9dc..fc0ef8a7a 100644 --- a/modules/behavior/hover.js +++ b/modules/behavior/hover.js @@ -5,9 +5,8 @@ import { select as d3_select } from 'd3-selection'; -import { d3keybinding as d3_keybinding } from '../lib/d3.keybinding.js'; import { osmEntity, osmNote } from '../osm'; -import { utilRebind } from '../util/rebind'; +import { utilKeybinding, utilRebind } from '../util'; /* @@ -29,7 +28,7 @@ export function behaviorHover(context) { function keydown() { - if (_altDisables && d3_event.keyCode === d3_keybinding.modifierCodes.alt) { + if (_altDisables && d3_event.keyCode === utilKeybinding.modifierCodes.alt) { _selection.selectAll('.hover') .classed('hover-suppressed', true) .classed('hover', false); @@ -43,7 +42,7 @@ export function behaviorHover(context) { function keyup() { - if (_altDisables && d3_event.keyCode === d3_keybinding.modifierCodes.alt) { + if (_altDisables && d3_event.keyCode === utilKeybinding.modifierCodes.alt) { _selection.selectAll('.hover-suppressed') .classed('hover-suppressed', false) .classed('hover', true); diff --git a/modules/behavior/operation.js b/modules/behavior/operation.js index 0fc96e1f0..5e3e03897 100644 --- a/modules/behavior/operation.js +++ b/modules/behavior/operation.js @@ -3,8 +3,8 @@ import { select as d3_select } from 'd3-selection'; -import { d3keybinding as d3_keybinding } from '../lib/d3.keybinding.js'; import { uiFlash } from '../ui'; +import { utilKeybinding } from '../util'; /* Creates a keybinding behavior for an operation */ @@ -14,7 +14,7 @@ export function behaviorOperation() { var behavior = function () { if (_operation && _operation.available()) { - keybinding = d3_keybinding('behavior.key.' + _operation.id); + keybinding = utilKeybinding('behavior.key.' + _operation.id); keybinding.on(_operation.keys, function() { d3_event.preventDefault(); var disabled = _operation.disabled(); diff --git a/modules/behavior/paste.js b/modules/behavior/paste.js index 6a2f44326..a663309b8 100644 --- a/modules/behavior/paste.js +++ b/modules/behavior/paste.js @@ -6,8 +6,6 @@ import { select as d3_select } from 'd3-selection'; -import { d3keybinding as d3_keybinding } from '../lib/d3.keybinding.js'; - import { actionCopyEntities, actionMove @@ -21,10 +19,11 @@ import { import { modeMove } from '../modes'; import { uiCmd } from '../ui'; +import { utilKeybinding } from '../util'; export function behaviorPaste(context) { - var keybinding = d3_keybinding('paste'); + var keybinding = utilKeybinding('paste'); function doPaste() { diff --git a/modules/lib/index.js b/modules/lib/index.js index bee98416c..1cb15f749 100644 --- a/modules/lib/index.js +++ b/modules/lib/index.js @@ -1,2 +1 @@ export { d3combobox } from './d3.combobox'; -export { d3keybinding } from './d3.keybinding'; diff --git a/modules/modes/drag_node.js b/modules/modes/drag_node.js index a395d98fb..9753f8e1e 100644 --- a/modules/modes/drag_node.js +++ b/modules/modes/drag_node.js @@ -6,8 +6,6 @@ import { select as d3_select } from 'd3-selection'; -import { d3keybinding as d3_keybinding } from '../lib/d3.keybinding.js'; - import { t } from '../util/locale'; import { @@ -34,6 +32,8 @@ import { import { modeBrowse, modeSelect } from './index'; import { osmJoinWays, osmNode } from '../osm'; import { uiFlash } from '../ui'; +import { utilKeybinding } from '../util'; + export function modeDragNode(context) { @@ -102,7 +102,7 @@ export function modeDragNode(context) { function keydown() { - if (d3_event.keyCode === d3_keybinding.modifierCodes.alt) { + if (d3_event.keyCode === utilKeybinding.modifierCodes.alt) { if (context.surface().classed('nope')) { context.surface() .classed('nope-suppressed', true); @@ -115,7 +115,7 @@ export function modeDragNode(context) { function keyup() { - if (d3_event.keyCode === d3_keybinding.modifierCodes.alt) { + if (d3_event.keyCode === utilKeybinding.modifierCodes.alt) { if (context.surface().classed('nope-suppressed')) { context.surface() .classed('nope', true); diff --git a/modules/modes/move.js b/modules/modes/move.js index 8cfbbe6b7..1a9704e4b 100644 --- a/modules/modes/move.js +++ b/modules/modes/move.js @@ -3,13 +3,13 @@ import { select as d3_select } from 'd3-selection'; -import { d3keybinding as d3_keybinding } from '../lib/d3.keybinding.js'; import { t } from '../util/locale'; import { actionMove } from '../actions'; import { behaviorEdit } from '../behavior'; import { geoViewportEdge, geoVecSubtract } from '../geo'; import { modeBrowse, modeSelect } from './index'; +import { utilKeybinding } from '../util'; import { operationCircularize, @@ -27,7 +27,7 @@ export function modeMove(context, entityIDs, baseGraph) { button: 'browse' }; - var keybinding = d3_keybinding('move'); + var keybinding = utilKeybinding('move'); var behaviors = [ behaviorEdit(context), operationCircularize(entityIDs, context).behavior, diff --git a/modules/modes/rotate.js b/modules/modes/rotate.js index 12cac0fdd..1b0f30248 100644 --- a/modules/modes/rotate.js +++ b/modules/modes/rotate.js @@ -8,17 +8,11 @@ import { polygonCentroid as d3_polygonCentroid } from 'd3-polygon'; -import { d3keybinding as d3_keybinding } from '../lib/d3.keybinding.js'; - import { t } from '../util/locale'; import { actionRotate } from '../actions'; import { behaviorEdit } from '../behavior'; import { geoVecInterp } from '../geo'; - -import { - modeBrowse, - modeSelect -} from './index'; +import { modeBrowse, modeSelect } from './index'; import { operationCircularize, @@ -29,7 +23,7 @@ import { operationReflectShort } from '../operations'; -import { utilGetAllNodes } from '../util'; +import { utilGetAllNodes, utilKeybinding } from '../util'; export function modeRotate(context, entityIDs) { @@ -38,7 +32,7 @@ export function modeRotate(context, entityIDs) { button: 'browse' }; - var keybinding = d3_keybinding('rotate'); + var keybinding = utilKeybinding('rotate'); var behaviors = [ behaviorEdit(context), operationCircularize(entityIDs, context).behavior, diff --git a/modules/modes/save.js b/modules/modes/save.js index 5e67bd163..5b1ef162f 100644 --- a/modules/modes/save.js +++ b/modules/modes/save.js @@ -11,7 +11,6 @@ import { select as d3_select } from 'd3-selection'; -import { d3keybinding as d3_keybinding } from '../lib/d3.keybinding.js'; import { t } from '../util/locale'; import { @@ -40,7 +39,8 @@ import { import { utilDisplayName, - utilDisplayType + utilDisplayType, + utilKeybinding } from '../util'; @@ -49,7 +49,7 @@ var _isSaving = false; export function modeSave(context) { var mode = { id: 'save' }; - var keybinding = d3_keybinding('modeSave'); + var keybinding = utilKeybinding('modeSave'); var loading = uiLoading(context) .message(t('save.uploading')) diff --git a/modules/modes/select.js b/modules/modes/select.js index 1d19eccc3..8e47d6aed 100644 --- a/modules/modes/select.js +++ b/modules/modes/select.js @@ -9,7 +9,6 @@ import { select as d3_select } from 'd3-selection'; -import { d3keybinding as d3_keybinding } from '../lib/d3.keybinding.js'; import { t } from '../util/locale'; import { actionAddMidpoint } from '../actions'; @@ -23,30 +22,21 @@ import { behaviorSelect } from '../behavior'; -import { - geoExtent, - geoChooseEdge, - geoPointInPolygon -} from '../geo'; - -import { - osmNode, - osmWay -} from '../osm'; - +import { geoExtent, geoChooseEdge, geoPointInPolygon } from '../geo'; import { modeBrowse } from './browse'; import { modeDragNode } from './drag_node'; import { modeDragNote } from './drag_note'; +import { osmNode, osmWay } from '../osm'; import * as Operations from '../operations/index'; import { uiEditMenu, uiSelectionList } from '../ui'; import { uiCmd } from '../ui/cmd'; -import { utilEntityOrMemberSelector, utilEntitySelector } from '../util'; +import { utilEntityOrMemberSelector, utilEntitySelector, utilKeybinding } from '../util'; // deprecation warning - Radial Menu to be removed in iD v3 import { uiRadialMenu } from '../ui'; -var relatedParent; +var _relatedParent; export function modeSelect(context, selectedIDs) { @@ -55,7 +45,7 @@ export function modeSelect(context, selectedIDs) { button: 'browse' }; - var keybinding = d3_keybinding('select'); + var keybinding = utilKeybinding('select'); var timeout = null; var behaviors = [ behaviorCopy(context), @@ -132,7 +122,7 @@ export function modeSelect(context, selectedIDs) { function singularParent() { var parents = commonParents(); if (!parents || parents.length === 0) { - relatedParent = null; + _relatedParent = null; return null; } @@ -140,12 +130,12 @@ export function modeSelect(context, selectedIDs) { // parents, and we want to remember which parent line we started on. if (parents.length === 1) { - relatedParent = parents[0]; // remember this parent for later - return relatedParent; + _relatedParent = parents[0]; // remember this parent for later + return _relatedParent; } - if (parents.indexOf(relatedParent) !== -1) { - return relatedParent; // prefer the previously seen parent + if (parents.indexOf(_relatedParent) !== -1) { + return _relatedParent; // prefer the previously seen parent } return parents[0]; @@ -292,8 +282,8 @@ export function modeSelect(context, selectedIDs) { .classed('related', false); singularParent(); - if (relatedParent) { - surface.selectAll(utilEntitySelector([relatedParent])) + if (_relatedParent) { + surface.selectAll(utilEntitySelector([_relatedParent])) .classed('related', true); } @@ -412,19 +402,19 @@ export function modeSelect(context, selectedIDs) { var parents = _uniq(commonParents()); if (!parents || parents.length < 2) return; - var index = parents.indexOf(relatedParent); + var index = parents.indexOf(_relatedParent); if (index < 0 || index > parents.length - 2) { - relatedParent = parents[0]; + _relatedParent = parents[0]; } else { - relatedParent = parents[index + 1]; + _relatedParent = parents[index + 1]; } var surface = context.surface(); surface.selectAll('.related') .classed('related', false); - if (relatedParent) { - surface.selectAll(utilEntitySelector([relatedParent])) + if (_relatedParent) { + surface.selectAll(utilEntitySelector([_relatedParent])) .classed('related', true); } } diff --git a/modules/modes/select_data.js b/modules/modes/select_data.js index 89cde781e..e7b9f8bf8 100644 --- a/modules/modes/select_data.js +++ b/modules/modes/select_data.js @@ -6,8 +6,6 @@ import { select as d3_select } from 'd3-selection'; -import { d3keybinding as d3_keybinding } from '../lib/d3.keybinding.js'; - import { behaviorBreathe, behaviorHover, @@ -16,9 +14,9 @@ import { } from '../behavior'; import { geoExtent } from '../geo'; -import { modeDragNode, modeDragNote } from '../modes'; -import { modeBrowse } from './browse'; +import { modeBrowse, modeDragNode, modeDragNote } from '../modes'; import { uiDataEditor } from '../ui'; +import { utilKeybinding } from '../util'; export function modeSelectData(context, selectedDatum) { @@ -27,7 +25,7 @@ export function modeSelectData(context, selectedDatum) { button: 'browse' }; - var keybinding = d3_keybinding('select-data'); + var keybinding = utilKeybinding('select-data'); var dataEditor = uiDataEditor(context); var behaviors = [ diff --git a/modules/modes/select_note.js b/modules/modes/select_note.js index 67ae6b1c5..43606540d 100644 --- a/modules/modes/select_note.js +++ b/modules/modes/select_note.js @@ -3,8 +3,6 @@ import { select as d3_select } from 'd3-selection'; -import { d3keybinding as d3_keybinding } from '../lib/d3.keybinding.js'; - import { behaviorBreathe, behaviorHover, @@ -12,14 +10,10 @@ import { behaviorSelect } from '../behavior'; -import { - modeDragNode, - modeDragNote -} from '../modes'; - +import { modeBrowse, modeDragNode, modeDragNote } from '../modes'; import { services } from '../services'; -import { modeBrowse } from './browse'; import { uiNoteEditor } from '../ui'; +import { utilKeybinding } from '../util'; export function modeSelectNote(context, selectedNoteID) { @@ -29,7 +23,7 @@ export function modeSelectNote(context, selectedNoteID) { }; var osm = services.osm; - var keybinding = d3_keybinding('select-note'); + var keybinding = utilKeybinding('select-note'); var noteEditor = uiNoteEditor(context) .on('change', function() { context.map().pan([0,0]); // trigger a redraw diff --git a/modules/ui/background.js b/modules/ui/background.js index 6f91098b8..c95fc59c2 100644 --- a/modules/ui/background.js +++ b/modules/ui/background.js @@ -10,8 +10,6 @@ import { select as d3_select } from 'd3-selection'; -import { d3keybinding as d3_keybinding } from '../lib/d3.keybinding.js'; - import { t, textDirection } from '../util/locale'; import { svgIcon } from '../svg'; import { uiBackgroundDisplayOptions } from './background_display_options'; @@ -23,7 +21,7 @@ import { uiMapData } from './map_data'; import { uiMapInMap } from './map_in_map'; import { uiSettingsCustomBackground } from './settings/custom_background'; import { uiTooltipHtml } from './tooltipHtml'; -import { utilCallWhenIdle } from '../util'; +import { utilCallWhenIdle, utilKeybinding } from '../util'; import { tooltip } from '../util/tooltip'; @@ -412,7 +410,7 @@ export function uiBackground(context) { update(); - var keybinding = d3_keybinding('background') + var keybinding = utilKeybinding('background') .on(key, togglePane) .on(uiCmd('⌘' + key), quickSwitch) .on([t('map_data.key'), t('help.key')], hidePane); diff --git a/modules/ui/conflicts.js b/modules/ui/conflicts.js index 1c23289de..fed273f45 100644 --- a/modules/ui/conflicts.js +++ b/modules/ui/conflicts.js @@ -5,8 +5,6 @@ import { select as d3_select } from 'd3-selection'; -import { d3keybinding as d3_keybinding } from '../lib/d3.keybinding.js'; - import { t } from '../util/locale'; import { JXON } from '../util/jxon'; import { geoExtent } from '../geo'; @@ -16,6 +14,7 @@ import { utilDetect } from '../util/detect'; import { utilEntityOrMemberSelector, + utilKeybinding, utilRebind, utilWrap } from '../util'; @@ -23,7 +22,7 @@ import { export function uiConflicts(context) { var dispatch = d3_dispatch('cancel', 'save'); - var keybinding = d3_keybinding('conflicts'); + var keybinding = utilKeybinding('conflicts'); var _origChanges; var _conflictList; diff --git a/modules/ui/feature_list.js b/modules/ui/feature_list.js index e3974f926..c086e952b 100644 --- a/modules/ui/feature_list.js +++ b/modules/ui/feature_list.js @@ -3,8 +3,6 @@ import { select as d3_select } from 'd3-selection'; -import { d3keybinding as d3_keybinding } from '../lib/d3.keybinding.js'; - import * as sexagesimal from '@mapbox/sexagesimal'; import { t } from '../util/locale'; import { dmsCoordinatePair } from '../util/units'; @@ -20,12 +18,13 @@ import { utilDisplayName, utilDisplayType, utilEntityOrMemberSelector, + utilKeybinding, utilNoAuto } from '../util'; export function uiFeatureList(context) { - var keybinding = d3_keybinding('uiFeatureList'); + var keybinding = utilKeybinding('uiFeatureList'); var _geocodeResults; diff --git a/modules/ui/full_screen.js b/modules/ui/full_screen.js index 55ed0df9d..32bb4cdb4 100644 --- a/modules/ui/full_screen.js +++ b/modules/ui/full_screen.js @@ -3,15 +3,14 @@ import { select as d3_select } from 'd3-selection'; -import { d3keybinding as d3_keybinding } from '../lib/d3.keybinding.js'; - import { uiCmd } from './cmd'; +import { utilKeybinding } from '../util'; import { utilDetect } from '../util/detect'; export function uiFullScreen(context) { var element = context.container().node(), - keybinding = d3_keybinding('full-screen'); + keybinding = utilKeybinding('full-screen'); // button; diff --git a/modules/ui/help.js b/modules/ui/help.js index 1d350be2d..a9035e140 100644 --- a/modules/ui/help.js +++ b/modules/ui/help.js @@ -3,10 +3,7 @@ import { select as d3_select } from 'd3-selection'; -import { d3keybinding as d3_keybinding } from '../lib/d3.keybinding.js'; - import marked from 'marked'; -import { t, textDirection } from '../util/locale'; import { svgIcon } from '../svg'; import { uiCmd } from './cmd'; import { uiBackground } from './background'; @@ -14,6 +11,9 @@ import { uiIntro } from './intro'; import { uiMapData } from './map_data'; import { uiShortcuts } from './shortcuts'; import { uiTooltipHtml } from './tooltipHtml'; +import { utilKeybinding } from '../util'; + +import { t, textDirection } from '../util/locale'; import { tooltip } from '../util/tooltip'; import { icon } from './intro/helper'; @@ -476,7 +476,7 @@ export function uiHelp(context) { clickHelp(docs[0], 0); - var keybinding = d3_keybinding('help') + var keybinding = utilKeybinding('help') .on(key, togglePane) .on([t('background.key'), t('map_data.key')], hidePane); diff --git a/modules/ui/info.js b/modules/ui/info.js index e6130bcdb..20553c996 100644 --- a/modules/ui/info.js +++ b/modules/ui/info.js @@ -3,12 +3,11 @@ import { select as d3_select } from 'd3-selection'; -import { d3keybinding as d3_keybinding } from '../lib/d3.keybinding.js'; - import { t } from '../util/locale'; import { svgIcon } from '../svg'; import { uiCmd } from './cmd'; import { uiInfoPanels } from './panels'; +import { utilKeybinding } from '../util'; export function uiInfo(context) { @@ -118,7 +117,7 @@ export function uiInfo(context) { redraw(); - var keybinding = d3_keybinding('info') + var keybinding = utilKeybinding('info') .on(uiCmd('⌘' + t('info_panels.key')), toggle); ids.forEach(function(k) { diff --git a/modules/ui/init.js b/modules/ui/init.js index 497201b0a..93c8c9c5b 100644 --- a/modules/ui/init.js +++ b/modules/ui/init.js @@ -3,8 +3,6 @@ import { select as d3_select } from 'd3-selection'; -import { d3keybinding as d3_keybinding } from '../lib/d3.keybinding.js'; - import { t, textDirection } from '../util/locale'; import { tooltip } from '../util/tooltip'; @@ -12,6 +10,7 @@ import { behaviorHash } from '../behavior'; import { modeBrowse } from '../modes'; import { svgDefs, svgIcon } from '../svg'; import { utilGetDimensions } from '../util/dimensions'; +import { utilKeybinding } from '../util'; import { uiAccount } from './account'; import { uiAttribution } from './attribution'; @@ -298,7 +297,7 @@ export function uiInit(context) { var panPixels = 80; - var keybinding = d3_keybinding('main') + var keybinding = utilKeybinding('main') .on('⌫', function() { d3_event.preventDefault(); }) .on(t('sidebar.key'), ui.sidebar.toggle) .on('←', pan([panPixels, 0])) diff --git a/modules/ui/map_data.js b/modules/ui/map_data.js index 9f4f96e53..aeae728d7 100644 --- a/modules/ui/map_data.js +++ b/modules/ui/map_data.js @@ -3,8 +3,6 @@ import { select as d3_select } from 'd3-selection'; -import { d3keybinding as d3_keybinding } from '../lib/d3.keybinding.js'; - import { svgIcon } from '../svg'; import { t, textDirection } from '../util/locale'; import { tooltip } from '../util/tooltip'; @@ -15,6 +13,7 @@ import { uiDisclosure } from './disclosure'; import { uiHelp } from './help'; import { uiSettingsCustomData } from './settings/custom_data'; import { uiTooltipHtml } from './tooltipHtml'; +import { utilKeybinding } from '../util'; export function uiMapData(context) { @@ -646,7 +645,7 @@ export function uiMapData(context) { update(); setFill(_fillSelected); - var keybinding = d3_keybinding('features') + var keybinding = utilKeybinding('features') .on(key, togglePane) .on(t('area_fill.wireframe.key'), toggleWireframe) .on([t('background.key'), t('help.key')], hidePane); diff --git a/modules/ui/map_in_map.js b/modules/ui/map_in_map.js index 139f41f6c..0cf229705 100644 --- a/modules/ui/map_in_map.js +++ b/modules/ui/map_in_map.js @@ -10,8 +10,6 @@ import { zoomIdentity as d3_zoomIdentity } from 'd3-zoom'; -import { d3keybinding as d3_keybinding } from '../lib/d3.keybinding.js'; - import { t } from '../util/locale'; import { geoRawMercator, @@ -23,7 +21,7 @@ import { import { rendererTileLayer } from '../renderer'; import { svgDebug, svgData } from '../svg'; -import { utilSetTransform } from '../util'; +import { utilKeybinding, utilSetTransform } from '../util'; import { utilGetDimensions } from '../util/dimensions'; @@ -336,7 +334,7 @@ export function uiMapInMap(context) { redraw(); - var keybinding = d3_keybinding('map-in-map') + var keybinding = utilKeybinding('map-in-map') .on(t('background.minimap.key'), toggle); d3_select(document) diff --git a/modules/ui/modal.js b/modules/ui/modal.js index 4a1aafc19..91de76e8a 100644 --- a/modules/ui/modal.js +++ b/modules/ui/modal.js @@ -3,13 +3,12 @@ import { select as d3_select } from 'd3-selection'; -import { d3keybinding as d3_keybinding } from '../lib/d3.keybinding.js'; - import { svgIcon } from '../svg'; +import { utilKeybinding } from '../util'; export function uiModal(selection, blocking) { - var keybinding = d3_keybinding('modal'); + var keybinding = utilKeybinding('modal'); var previous = selection.select('div.modal'); var animate = previous.empty(); diff --git a/modules/ui/modes.js b/modules/ui/modes.js index 4aa4f369a..503544d95 100644 --- a/modules/ui/modes.js +++ b/modules/ui/modes.js @@ -1,7 +1,6 @@ import _debounce from 'lodash-es/debounce'; import { select as d3_select } from 'd3-selection'; -import { d3keybinding as d3_keybinding } from '../lib/d3.keybinding.js'; import { modeAddArea, @@ -13,6 +12,7 @@ import { import { svgIcon } from '../svg'; import { tooltip } from '../util/tooltip'; +import { utilKeybinding } from '../util'; import { uiTooltipHtml } from './tooltipHtml'; @@ -56,7 +56,7 @@ export function uiModes(context) { .classed('mode-' + exited.id, false); }); - var keybinding = d3_keybinding('mode-buttons'); + var keybinding = utilKeybinding('mode-buttons'); modes.forEach(function(mode) { keybinding.on(mode.key, function() { diff --git a/modules/ui/preset_list.js b/modules/ui/preset_list.js index 1242e2fe2..b593602fe 100644 --- a/modules/ui/preset_list.js +++ b/modules/ui/preset_list.js @@ -5,8 +5,6 @@ import { select as d3_select } from 'd3-selection'; -import { d3keybinding as d3_keybinding } from '../lib/d3.keybinding.js'; - import { t, textDirection } from '../util/locale'; import { actionChangePreset } from '../actions/index'; import { operationDelete } from '../operations/index'; @@ -14,19 +12,19 @@ import { modeBrowse } from '../modes/index'; import { svgIcon } from '../svg/index'; import { uiPresetIcon } from './preset_icon'; import { uiTagReference } from './tag_reference'; -import { utilNoAuto, utilRebind } from '../util'; +import { utilKeybinding, utilNoAuto, utilRebind } from '../util'; export function uiPresetList(context) { - var dispatch = d3_dispatch('choose'), - id, - currentPreset, - autofocus = false; + var dispatch = d3_dispatch('choose'); + var _entityID; + var _currentPreset; + var _autofocus = false; function presetList(selection) { - var entity = context.entity(id), - geometry = context.geometry(id); + var entity = context.entity(_entityID); + var geometry = context.geometry(_entityID); // Treat entities on addr:interpolation lines as points, not vertices (#3241) if (geometry === 'vertex' && entity.isOnAddressLine(context.graph())) { @@ -45,11 +43,11 @@ export function uiPresetList(context) { .append('h3') .text(t('inspector.choose')); - if (context.entity(id).isUsed(context.graph())) { + if (context.entity(_entityID).isUsed(context.graph())) { messagewrap .append('button') .attr('class', 'preset-choose') - .on('click', function() { dispatch.call('choose', this, currentPreset); }) + .on('click', function() { dispatch.call('choose', this, _currentPreset); }) .call(svgIcon((textDirection === 'rtl') ? '#iD-icon-backward' : '#iD-icon-forward')); } else { messagewrap @@ -64,16 +62,16 @@ export function uiPresetList(context) { function initialKeydown() { // hack to let delete shortcut work when search is autofocused if (search.property('value').length === 0 && - (d3_event.keyCode === d3_keybinding.keyCodes['⌫'] || - d3_event.keyCode === d3_keybinding.keyCodes['⌦'])) { + (d3_event.keyCode === utilKeybinding.keyCodes['⌫'] || + d3_event.keyCode === utilKeybinding.keyCodes['⌦'])) { d3_event.preventDefault(); d3_event.stopPropagation(); - operationDelete([id], context)(); + operationDelete([_entityID], context)(); // hack to let undo work when search is autofocused } else if (search.property('value').length === 0 && (d3_event.ctrlKey || d3_event.metaKey) && - d3_event.keyCode === d3_keybinding.keyCodes.z) { + d3_event.keyCode === utilKeybinding.keyCodes.z) { d3_event.preventDefault(); d3_event.stopPropagation(); context.undo(); @@ -86,7 +84,7 @@ export function uiPresetList(context) { function keydown() { // down arrow - if (d3_event.keyCode === d3_keybinding.keyCodes['↓'] && + if (d3_event.keyCode === utilKeybinding.keyCodes['↓'] && // if insertion point is at the end of the string search.node().selectionStart === search.property('value').length) { d3_event.preventDefault(); @@ -137,7 +135,7 @@ export function uiPresetList(context) { searchWrap .call(svgIcon('#iD-icon-search', 'pre-text')); - if (autofocus) { + if (_autofocus) { search.node().focus(); } @@ -168,7 +166,7 @@ export function uiPresetList(context) { items.enter() .append('div') .attr('class', function(item) { return 'preset-list-item preset-' + item.preset.id.replace('/', '-'); }) - .classed('current', function(item) { return item.preset === currentPreset; }) + .classed('current', function(item) { return item.preset === _currentPreset; }) .each(function(item) { d3_select(this).call(item); }) .style('opacity', 0) .transition() @@ -181,7 +179,7 @@ export function uiPresetList(context) { var parentItem = d3_select(item.node().parentElement.closest('.preset-list-item')); // arrow down, move focus to the next, lower item - if (d3_event.keyCode === d3_keybinding.keyCodes['↓']) { + if (d3_event.keyCode === utilKeybinding.keyCodes['↓']) { d3_event.preventDefault(); d3_event.stopPropagation(); // the next item in the list at the same level @@ -205,7 +203,7 @@ export function uiPresetList(context) { } // arrow up, move focus to the previous, higher item - } else if (d3_event.keyCode === d3_keybinding.keyCodes['↑']) { + } else if (d3_event.keyCode === utilKeybinding.keyCodes['↑']) { d3_event.preventDefault(); d3_event.stopPropagation(); // the previous item in the list at the same level @@ -215,8 +213,7 @@ export function uiPresetList(context) { if (previousItem.empty()) { // if there is a parent item if (!parentItem.empty()) { - // the item is the first subitem of a sublist, - // select the parent item + // the item is the first subitem of a sublist select the parent item previousItem = parentItem; } // if the previous item is expanded @@ -224,29 +221,27 @@ export function uiPresetList(context) { // select the last subitem of the sublist of the previous item previousItem = previousItem.select('.subgrid .preset-list-item:last-child'); } + if (!previousItem.empty()) { // focus on the previous item previousItem.select('.preset-list-button').node().focus(); - } - else { + } else { // the focus is at the top of the list, move focus back to the search field var search = d3_select(this.closest('.preset-list-pane')).select('.preset-search-input'); search.node().focus(); } - } + // arrow left, move focus to the parent item if there is one - else if (d3_event.keyCode === d3_keybinding.keyCodes[(textDirection === 'rtl') ? '→' : '←']) { + } else if (d3_event.keyCode === utilKeybinding.keyCodes[(textDirection === 'rtl') ? '→' : '←']) { d3_event.preventDefault(); d3_event.stopPropagation(); - - // if there is a parent item + // if there is a parent item, focus on the parent item if (!parentItem.empty()) { - // focus on the parent item parentItem.select('.preset-list-button').node().focus(); } - } + // arrow right, choose this item - else if (d3_event.keyCode === d3_keybinding.keyCodes[(textDirection === 'rtl') ? '←' : '→']) { + } else if (d3_event.keyCode === utilKeybinding.keyCodes[(textDirection === 'rtl') ? '←' : '→']) { d3_event.preventDefault(); d3_event.stopPropagation(); item.datum().choose(); @@ -277,12 +272,12 @@ export function uiPresetList(context) { .attr('class', 'preset-list-button') .classed('expanded', false) .call(uiPresetIcon() - .geometry(context.geometry(id)) + .geometry(context.geometry(_entityID)) .preset(preset)) .on('click', click) .on('keydown', function() { // right arrow, expand the focused item - if (d3_event.keyCode === d3_keybinding.keyCodes[(textDirection === 'rtl') ? '←' : '→']) { + if (d3_event.keyCode === utilKeybinding.keyCodes[(textDirection === 'rtl') ? '←' : '→']) { d3_event.preventDefault(); d3_event.stopPropagation(); // if the item isn't expanded @@ -291,7 +286,7 @@ export function uiPresetList(context) { click.call(this); } // left arrow, collapse the focused item - } else if (d3_event.keyCode === d3_keybinding.keyCodes[(textDirection === 'rtl') ? '→' : '←']) { + } else if (d3_event.keyCode === utilKeybinding.keyCodes[(textDirection === 'rtl') ? '→' : '←']) { d3_event.preventDefault(); d3_event.stopPropagation(); // if the item is expanded @@ -348,7 +343,6 @@ export function uiPresetList(context) { }; item.preset = preset; - return item; } @@ -361,7 +355,7 @@ export function uiPresetList(context) { wrap.append('button') .attr('class', 'preset-list-button') .call(uiPresetIcon() - .geometry(context.geometry(id)) + .geometry(context.geometry(_entityID)) .preset(preset)) .on('click', item.choose) .on('keydown', itemKeydown) @@ -375,9 +369,8 @@ export function uiPresetList(context) { item.choose = function() { context.presets().choose(preset); - context.perform( - actionChangePreset(id, currentPreset, preset), + actionChangePreset(_entityID, _currentPreset, preset), t('operations.change_tags.annotation') ); @@ -390,30 +383,30 @@ export function uiPresetList(context) { }; item.preset = preset; - item.reference = uiTagReference(preset.reference(context.geometry(id)), context); + item.reference = uiTagReference(preset.reference(context.geometry(_entityID)), context); return item; } - presetList.autofocus = function(_) { - if (!arguments.length) return autofocus; - autofocus = _; + presetList.autofocus = function(val) { + if (!arguments.length) return _autofocus; + _autofocus = val; return presetList; }; - presetList.entityID = function(_) { - if (!arguments.length) return id; - id = _; - presetList.preset(context.presets().match(context.entity(id), context.graph())); + presetList.entityID = function(val) { + if (!arguments.length) return _entityID; + _entityID = val; + presetList.preset(context.presets().match(context.entity(_entityID), context.graph())); return presetList; }; - presetList.preset = function(_) { - if (!arguments.length) return currentPreset; - currentPreset = _; + presetList.preset = function(val) { + if (!arguments.length) return _currentPreset; + _currentPreset = val; return presetList; }; diff --git a/modules/ui/save.js b/modules/ui/save.js index 09d6e5d08..6b4f0d90d 100644 --- a/modules/ui/save.js +++ b/modules/ui/save.js @@ -5,13 +5,12 @@ import { select as d3_select } from 'd3-selection'; -import { d3keybinding as d3_keybinding } from '../lib/d3.keybinding.js'; - import { t } from '../util/locale'; import { modeSave } from '../modes'; import { svgIcon } from '../svg'; import { uiCmd } from './cmd'; import { uiTooltipHtml } from './tooltipHtml'; +import { utilKeybinding } from '../util'; import { tooltip } from '../util/tooltip'; @@ -101,7 +100,7 @@ export function uiSave(context) { updateCount(); - var keybinding = d3_keybinding('uiSave') + var keybinding = utilKeybinding('uiSave') .on(key, save, true); d3_select(document) diff --git a/modules/ui/shortcuts.js b/modules/ui/shortcuts.js index 882e54738..05c124829 100644 --- a/modules/ui/shortcuts.js +++ b/modules/ui/shortcuts.js @@ -3,33 +3,32 @@ import { selectAll as d3_selectAll } from 'd3-selection'; -import { d3keybinding as d3_keybinding } from '../lib/d3.keybinding.js'; - import { t } from '../util/locale'; import { dataShortcuts } from '../../data'; import { svgIcon } from '../svg'; import { uiCmd } from './cmd'; import { uiModal } from './modal'; +import { utilKeybinding } from '../util'; import { utilDetect } from '../util/detect'; export function uiShortcuts() { var detected = utilDetect(); - var activeTab = 0; - var modalSelection; - var savedSelection; + var _activeTab = 0; + var _modalSelection; + var _selection = d3_select(null); - var keybinding = d3_keybinding('shortcuts') + var keybinding = utilKeybinding('shortcuts') .on(t('shortcuts.toggle.key'), function () { if (d3_selectAll('.modal-shortcuts').size()) { // already showing - if (modalSelection) { - modalSelection.close(); - modalSelection = null; + if (_modalSelection) { + _modalSelection.close(); + _modalSelection = null; } } else { - modalSelection = uiModal(savedSelection); - shortcutsModal(modalSelection); + _modalSelection = uiModal(_selection); + shortcutsModal(_modalSelection); } }); @@ -38,11 +37,11 @@ export function uiShortcuts() { - function shortcutsModal(modalSelection) { - modalSelection.select('.modal') + function shortcutsModal(_modalSelection) { + _modalSelection.select('.modal') .classed('modal-shortcuts', true); - var shortcutsModal = modalSelection.select('.content'); + var shortcutsModal = _modalSelection.select('.content'); shortcutsModal .append('div') @@ -84,7 +83,7 @@ export function uiShortcuts() { .append('div') .attr('class', 'tab') .on('click', function (d, i) { - activeTab = i; + _activeTab = i; render(selection); }); @@ -98,7 +97,7 @@ export function uiShortcuts() { // Update wrapper.selectAll('.tab') .classed('active', function (d, i) { - return i === activeTab; + return i === _activeTab; }); @@ -246,16 +245,16 @@ export function uiShortcuts() { // Update wrapper.selectAll('.shortcut-tab') .style('display', function (d, i) { - return i === activeTab ? 'flex' : 'none'; + return i === _activeTab ? 'flex' : 'none'; }); } return function(selection, show) { - savedSelection = selection; + _selection = selection; if (show) { - modalSelection = uiModal(selection); - shortcutsModal(modalSelection); + _modalSelection = uiModal(selection); + shortcutsModal(_modalSelection); } }; } diff --git a/modules/ui/undo_redo.js b/modules/ui/undo_redo.js index e57a93140..256219678 100644 --- a/modules/ui/undo_redo.js +++ b/modules/ui/undo_redo.js @@ -5,12 +5,11 @@ import { select as d3_select } from 'd3-selection'; -import { d3keybinding as d3_keybinding } from '../lib/d3.keybinding.js'; - import { t, textDirection } from '../util/locale'; import { svgIcon } from '../svg'; import { uiCmd } from './cmd'; import { uiTooltipHtml } from './tooltipHtml'; +import { utilKeybinding } from '../util'; import { tooltip } from '../util/tooltip'; @@ -65,7 +64,7 @@ export function uiUndoRedo(context) { .call(svgIcon('#iD-icon-' + iconName)); }); - var keybinding = d3_keybinding('undo') + var keybinding = utilKeybinding('undo') .on(commands[0].cmd, function() { d3_event.preventDefault(); commands[0].action(); }) .on(commands[1].cmd, function() { d3_event.preventDefault(); commands[1].action(); }); diff --git a/modules/ui/zoom.js b/modules/ui/zoom.js index 48d28d783..27e6286a2 100644 --- a/modules/ui/zoom.js +++ b/modules/ui/zoom.js @@ -3,12 +3,11 @@ import { select as d3_select } from 'd3-selection'; -import { d3keybinding as d3_keybinding } from '../lib/d3.keybinding.js'; - import { t, textDirection } from '../util/locale'; import { svgIcon } from '../svg'; import { uiCmd } from './cmd'; import { uiTooltipHtml } from './tooltipHtml'; +import { utilKeybinding } from '../util'; import { tooltip } from '../util/tooltip'; @@ -73,7 +72,7 @@ export function uiZoom(context) { .call(svgIcon('#iD-icon-' + d.icon, 'light')); }); - var keybinding = d3_keybinding('zoom'); + var keybinding = utilKeybinding('zoom'); ['plus', 'ffplus', '=', 'ffequals'].forEach(function(key) { keybinding.on([key], zoomIn); diff --git a/modules/util/index.js b/modules/util/index.js index a0269240f..bbca0d00a 100644 --- a/modules/util/index.js +++ b/modules/util/index.js @@ -16,6 +16,7 @@ export { utilGetSetValue } from './get_set_value'; export { utilHashcode } from './util'; export { utilHighlightEntity } from './util'; export { utilIdleWorker } from './idle_worker'; +export { utilKeybinding } from './keybinding'; export { utilNoAuto } from './util'; export { utilPrefixCSSProperty } from './util'; export { utilPrefixDOMProperty } from './util'; diff --git a/modules/lib/d3.keybinding.js b/modules/util/keybinding.js similarity index 88% rename from modules/lib/d3.keybinding.js rename to modules/util/keybinding.js index 8fb2f7372..88019df27 100644 --- a/modules/lib/d3.keybinding.js +++ b/modules/util/keybinding.js @@ -4,31 +4,22 @@ import { } from 'd3-selection'; -/* - * This code is licensed under the MIT license. - * - * Copyright © 2013, iD authors. - * - * Portions copyright © 2011, Keith Cirkel - * See https://github.com/keithamus/jwerty - * - */ -export function d3keybinding(namespace) { - var bindings = []; +export function utilKeybinding(namespace) { + var _keybindings = []; function testBindings(isCapturing) { - var didMatch = false, - i, binding; + var didMatch = false; + var i, binding; // Most key shortcuts will accept either lower or uppercase ('h' or 'H'), // so we don't strictly match on the shift key, but we prioritize - // shifted bindings first, and fallback to unshifted only if no match. + // shifted keybindings first, and fallback to unshifted only if no match. // (This lets us differentiate between '←'/'⇧←' or '⌘Z'/'⌘⇧Z') - // priority match shifted bindings first - for (i = 0; i < bindings.length; i++) { - binding = bindings[i]; + // priority match shifted keybindings first + for (i = 0; i < _keybindings.length; i++) { + binding = _keybindings[i]; if (!binding.event.modifiers.shiftKey) continue; // no shift if (!!binding.capture !== isCapturing) continue; if (matches(binding, true)) { @@ -37,10 +28,10 @@ export function d3keybinding(namespace) { } } - // then unshifted bindings + // then unshifted keybindings if (didMatch) return; - for (i = 0; i < bindings.length; i++) { - binding = bindings[i]; + for (i = 0; i < _keybindings.length; i++) { + binding = _keybindings[i]; if (binding.event.modifiers.shiftKey) continue; // shift if (!!binding.capture !== isCapturing) continue; if (matches(binding, false)) { @@ -115,7 +106,7 @@ export function d3keybinding(namespace) { keybinding.off = function(selection) { - bindings = []; + _keybindings = []; selection = selection || d3_select(document); selection.on('keydown.capture' + namespace, null); selection.on('keydown.bubble' + namespace, null); @@ -148,17 +139,17 @@ export function d3keybinding(namespace) { // Normalise matching errors if (code[j] === '++') code[j] = '+'; - if (code[j] in d3keybinding.modifierCodes) { - binding.event.modifiers[d3keybinding.modifierProperties[d3keybinding.modifierCodes[code[j]]]] = true; + if (code[j] in utilKeybinding.modifierCodes) { + binding.event.modifiers[utilKeybinding.modifierProperties[utilKeybinding.modifierCodes[code[j]]]] = true; } else { - binding.event.key = d3keybinding.keys[code[j]] || code[j]; - if (code[j] in d3keybinding.keyCodes) { - binding.event.keyCode = d3keybinding.keyCodes[code[j]]; + binding.event.key = utilKeybinding.keys[code[j]] || code[j]; + if (code[j] in utilKeybinding.keyCodes) { + binding.event.keyCode = utilKeybinding.keyCodes[code[j]]; } } } - bindings.push(binding); + _keybindings.push(binding); } return keybinding; @@ -168,7 +159,12 @@ export function d3keybinding(namespace) { } -d3keybinding.modifierCodes = { +/* + * See https://github.com/keithamus/jwerty + */ + + +utilKeybinding.modifierCodes = { // Shift key, ⇧ '⇧': 16, shift: 16, // CTRL key, on Mac: ⌃ @@ -179,14 +175,14 @@ d3keybinding.modifierCodes = { '⌘': 91, meta: 91, cmd: 91, 'super': 91, win: 91 }; -d3keybinding.modifierProperties = { +utilKeybinding.modifierProperties = { 16: 'shiftKey', 17: 'ctrlKey', 18: 'altKey', 91: 'metaKey' }; -d3keybinding.keys = { +utilKeybinding.keys = { // Backspace key, on Mac: ⌫ (Backspace) '⌫': 'Backspace', backspace: 'Backspace', // Tab Key, on Mac: ⇥ (Tab), on Windows ⇥⇥ @@ -287,7 +283,7 @@ d3keybinding.keys = { f25: 'F25' }; -d3keybinding.keyCodes = { +utilKeybinding.keyCodes = { // Backspace key, on Mac: ⌫ (Backspace) '⌫': 8, backspace: 8, // Tab Key, on Mac: ⇥ (Tab), on Windows ⇥⇥ @@ -362,26 +358,26 @@ d3keybinding.keyCodes = { // NUMPAD 0-9 var i = 95, n = 0; while (++i < 106) { - d3keybinding.keyCodes['num-' + n] = i; + utilKeybinding.keyCodes['num-' + n] = i; ++n; } // 0-9 i = 47; n = 0; while (++i < 58) { - d3keybinding.keyCodes[n] = i; + utilKeybinding.keyCodes[n] = i; ++n; } // F1-F25 i = 111; n = 1; while (++i < 136) { - d3keybinding.keyCodes['f' + n] = i; + utilKeybinding.keyCodes['f' + n] = i; ++n; } // a-z i = 64; while (++i < 91) { - d3keybinding.keyCodes[String.fromCharCode(i).toLowerCase()] = i; + utilKeybinding.keyCodes[String.fromCharCode(i).toLowerCase()] = i; } diff --git a/test/index.html b/test/index.html index abcf0ed83..c954aae87 100644 --- a/test/index.html +++ b/test/index.html @@ -81,7 +81,6 @@ - @@ -138,6 +137,7 @@ + diff --git a/test/spec/lib/d3.combobox.js b/test/spec/lib/d3.combobox.js index 9a803f004..af588c766 100644 --- a/test/spec/lib/d3.combobox.js +++ b/test/spec/lib/d3.combobox.js @@ -10,7 +10,7 @@ describe('d3.combobox', function() { ]; function simulateKeypress(key) { - var keyCode = iD.lib.d3keybinding.keyCodes[key]; + var keyCode = iD.utilKeybinding.keyCodes[key]; var value = input.property('value'); var start = input.property('selectionStart'); var finis = input.property('selectionEnd'); diff --git a/test/spec/lib/d3.keybinding.js b/test/spec/util/keybinding.js similarity index 97% rename from test/spec/lib/d3.keybinding.js rename to test/spec/util/keybinding.js index c4ce6a5da..672060dba 100644 --- a/test/spec/lib/d3.keybinding.js +++ b/test/spec/util/keybinding.js @@ -1,8 +1,8 @@ -describe('d3.keybinding', function() { +describe('utilKeybinding', function() { var keybinding, spy, input; beforeEach(function () { - keybinding = iD.lib.d3keybinding('keybinding-test'); + keybinding = iD.utilKeybinding('keybinding-test'); spy = sinon.spy(); input = d3.select('body') .append('input');