From 914ef0236a0798b0fbc74bc440e37e3866cd655a Mon Sep 17 00:00:00 2001 From: Bryan Housel Date: Sun, 24 Sep 2017 23:25:49 -0400 Subject: [PATCH] Convert lodah-es and d3 to named imports for modes --- modules/modes/add_area.js | 6 ++-- modules/modes/add_line.js | 6 ++-- modules/modes/add_point.js | 6 ++-- modules/modes/drag_node.js | 38 +++++++++++++----------- modules/modes/draw_area.js | 3 +- modules/modes/draw_line.js | 3 +- modules/modes/move.js | 20 +++++++------ modules/modes/rotate.js | 28 +++++++++++------- modules/modes/save.js | 56 ++++++++++++++++++++++-------------- modules/modes/select.js | 59 ++++++++++++++++++++++---------------- 10 files changed, 132 insertions(+), 93 deletions(-) diff --git a/modules/modes/add_area.js b/modules/modes/add_area.js index 2160a8b97..4e0af4318 100644 --- a/modules/modes/add_area.js +++ b/modules/modes/add_area.js @@ -3,11 +3,11 @@ import { actionAddEntity, actionAddMidpoint, actionAddVertex -} from '../actions/index'; +} from '../actions'; -import { behaviorAddWay } from '../behavior/index'; +import { behaviorAddWay } from '../behavior'; import { modeDrawArea } from './index'; -import { osmNode, osmWay } from '../osm/index'; +import { osmNode, osmWay } from '../osm'; export function modeAddArea(context) { diff --git a/modules/modes/add_line.js b/modules/modes/add_line.js index 64bd36382..d18deff14 100644 --- a/modules/modes/add_line.js +++ b/modules/modes/add_line.js @@ -3,11 +3,11 @@ import { actionAddEntity, actionAddMidpoint, actionAddVertex -} from '../actions/index'; +} from '../actions'; -import { behaviorAddWay } from '../behavior/index'; +import { behaviorAddWay } from '../behavior'; import { modeDrawLine } from './index'; -import { osmNode, osmWay } from '../osm/index'; +import { osmNode, osmWay } from '../osm'; export function modeAddLine(context) { diff --git a/modules/modes/add_point.js b/modules/modes/add_point.js index 1ea931527..678be7c68 100644 --- a/modules/modes/add_point.js +++ b/modules/modes/add_point.js @@ -1,8 +1,8 @@ import { t } from '../util/locale'; -import { actionAddEntity } from '../actions/index'; -import { behaviorDraw } from '../behavior/index'; +import { actionAddEntity } from '../actions'; +import { behaviorDraw } from '../behavior'; import { modeBrowse, modeSelect } from './index'; -import { osmNode } from '../osm/index'; +import { osmNode } from '../osm'; export function modeAddPoint(context) { diff --git a/modules/modes/drag_node.js b/modules/modes/drag_node.js index 8d682b99c..4e4fd22a5 100644 --- a/modules/modes/drag_node.js +++ b/modules/modes/drag_node.js @@ -1,27 +1,33 @@ -import * as d3 from 'd3'; -import _ from 'lodash'; +import _map from 'lodash-es/map'; + +import { + event as d3_event, + select as d3_select +} from 'd3-selection'; + import { t } from '../util/locale'; + import { actionAddMidpoint, actionConnect, actionMoveNode, actionNoop -} from '../actions/index'; +} from '../actions'; import { behaviorEdit, behaviorHover, behaviorDrag -} from '../behavior/index'; +} from '../behavior'; import { modeBrowse, modeSelect } from './index'; -import { geoChooseEdge } from '../geo/index'; -import { osmNode } from '../osm/index'; -import { utilEntitySelector } from '../util/index'; +import { geoChooseEdge } from '../geo'; +import { osmNode } from '../osm'; +import { utilEntitySelector } from '../util'; export function modeDragNode(context) { @@ -101,7 +107,7 @@ export function modeDragNode(context) { function start(entity) { wasMidpoint = entity.type === 'midpoint'; - isCancelled = d3.event.sourceEvent.shiftKey || + isCancelled = d3_event.sourceEvent.shiftKey || context.features().hasHiddenConnections(entity, context.graph()); if (isCancelled) { @@ -122,7 +128,7 @@ export function modeDragNode(context) { // activeIDs generate no pointer events. This prevents the node or vertex // being dragged from trying to connect to itself or its parent element. - activeIDs = _.map(context.graph().parentWays(entity), 'id'); + activeIDs = _map(context.graph().parentWays(entity), 'id'); activeIDs.push(entity.id); setActiveElements(); @@ -131,7 +137,7 @@ export function modeDragNode(context) { function datum() { - var event = d3.event && d3.event.sourceEvent; + var event = d3_event && d3_event.sourceEvent; if (!event || event.altKey) { return {}; } else { @@ -143,7 +149,7 @@ export function modeDragNode(context) { function doMove(entity, nudge) { nudge = nudge || [0, 0]; - var currPoint = (d3.event && d3.event.point) || context.projection(lastLoc), + var currPoint = (d3_event && d3_event.point) || context.projection(lastLoc), currMouse = vecSub(currPoint, nudge), loc = context.projection.invert(currMouse), d = datum(); @@ -151,7 +157,7 @@ export function modeDragNode(context) { if (!nudgeInterval) { if (d.type === 'node' && d.id !== entity.id) { loc = d.loc; - } else if (d.type === 'way' && !d3.select(d3.event.sourceEvent.target).classed('fill')) { + } else if (d.type === 'way' && !d3_select(d3_event.sourceEvent.target).classed('fill')) { loc = geoChooseEdge(context.childNodes(d), context.mouse(), context.projection).loc; } } @@ -167,11 +173,11 @@ export function modeDragNode(context) { function move(entity) { if (isCancelled) return; - d3.event.sourceEvent.stopPropagation(); - lastLoc = context.projection.invert(d3.event.point); + d3_event.sourceEvent.stopPropagation(); + lastLoc = context.projection.invert(d3_event.point); doMove(entity); - var nudge = edge(d3.event.point, context.map().dimensions()); + var nudge = edge(d3_event.point, context.map().dimensions()); if (nudge) { startNudge(entity, nudge); } else { @@ -237,7 +243,7 @@ export function modeDragNode(context) { var behavior = behaviorDrag() .selector('g.node, g.point, g.midpoint') - .surface(d3.select('#map').node()) + .surface(d3_select('#map').node()) .origin(origin) .on('start', start) .on('move', move) diff --git a/modules/modes/draw_area.js b/modules/modes/draw_area.js index 3eb062e37..e5478d339 100644 --- a/modules/modes/draw_area.js +++ b/modules/modes/draw_area.js @@ -1,5 +1,6 @@ import { t } from '../util/locale'; -import { behaviorDrawWay } from '../behavior/index'; +import { behaviorDrawWay } from '../behavior'; + export function modeDrawArea(context, wayId, startGraph) { var mode = { diff --git a/modules/modes/draw_line.js b/modules/modes/draw_line.js index c4fd68268..5198fd444 100644 --- a/modules/modes/draw_line.js +++ b/modules/modes/draw_line.js @@ -1,5 +1,6 @@ import { t } from '../util/locale'; -import { behaviorDrawWay } from '../behavior/index'; +import { behaviorDrawWay } from '../behavior'; + export function modeDrawLine(context, wayId, startGraph, affix) { var mode = { diff --git a/modules/modes/move.js b/modules/modes/move.js index d8d392834..a6571d332 100644 --- a/modules/modes/move.js +++ b/modules/modes/move.js @@ -1,9 +1,13 @@ -import * as d3 from 'd3'; -import { d3keybinding } from '../lib/d3.keybinding.js'; +import { + event as d3_event, + 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/index'; -import { behaviorEdit } from '../behavior/index'; +import { actionMove } from '../actions'; +import { behaviorEdit } from '../behavior'; import { modeBrowse, @@ -17,7 +21,7 @@ import { operationReflectLong, operationReflectShort, operationRotate -} from '../operations/index'; +} from '../operations'; export function modeMove(context, entityIDs, baseGraph) { @@ -26,7 +30,7 @@ export function modeMove(context, entityIDs, baseGraph) { button: 'browse' }; - var keybinding = d3keybinding('move'), + var keybinding = d3_keybinding('move'), behaviors = [ behaviorEdit(context), operationCircularize(entityIDs, context).behavior, @@ -122,7 +126,7 @@ export function modeMove(context, entityIDs, baseGraph) { function finish() { - d3.event.stopPropagation(); + d3_event.stopPropagation(); context.enter(modeSelect(context, entityIDs)); stopNudge(); } @@ -165,7 +169,7 @@ export function modeMove(context, entityIDs, baseGraph) { .on('⎋', cancel) .on('↩', finish); - d3.select(document) + d3_select(document) .call(keybinding); }; diff --git a/modules/modes/rotate.js b/modules/modes/rotate.js index d6dd377f4..4efd701dd 100644 --- a/modules/modes/rotate.js +++ b/modules/modes/rotate.js @@ -1,9 +1,20 @@ -import * as d3 from 'd3'; -import { d3keybinding } from '../lib/d3.keybinding.js'; +import { + event as d3_event, + select as d3_select +} from 'd3-selection'; + +import { + polygonHull as d3_polygonHull, + 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 { geoInterp } from '../geo'; + import { modeBrowse, modeSelect @@ -18,11 +29,6 @@ import { operationReflectShort } from '../operations'; -import { - polygonHull as d3polygonHull, - polygonCentroid as d3polygonCentroid -} from 'd3'; - import { utilGetAllNodes } from '../util'; @@ -32,7 +38,7 @@ export function modeRotate(context, entityIDs) { button: 'browse' }; - var keybinding = d3keybinding('rotate'), + var keybinding = d3_keybinding('rotate'), behaviors = [ behaviorEdit(context), operationCircularize(entityIDs, context).behavior, @@ -75,7 +81,7 @@ export function modeRotate(context, entityIDs) { } else if (points.length === 2) { pivot = geoInterp(points[0], points[1], 0.5); } else { - pivot = d3polygonCentroid(d3polygonHull(points)); + pivot = d3_polygonCentroid(d3_polygonHull(points)); } prevAngle = undefined; } @@ -96,7 +102,7 @@ export function modeRotate(context, entityIDs) { function finish() { - d3.event.stopPropagation(); + d3_event.stopPropagation(); context.enter(modeSelect(context, entityIDs)); } @@ -128,7 +134,7 @@ export function modeRotate(context, entityIDs) { .on('⎋', cancel) .on('↩', finish); - d3.select(document) + d3_select(document) .call(keybinding); }; diff --git a/modules/modes/save.js b/modules/modes/save.js index b16f1240e..18a01ea9b 100644 --- a/modules/modes/save.js +++ b/modules/modes/save.js @@ -1,7 +1,19 @@ -import * as d3 from 'd3'; -import _ from 'lodash'; +import _clone from 'lodash-es/clone'; +import _difference from 'lodash-es/difference'; +import _filter from 'lodash-es/filter'; +import _each from 'lodash-es/each'; +import _map from 'lodash-es/map'; +import _reduce from 'lodash-es/reduce'; +import _union from 'lodash-es/union'; +import _uniq from 'lodash-es/uniq'; +import _without from 'lodash-es/without'; -import { d3keybinding } from '../lib/d3.keybinding.js'; +import { + event as d3_event, + select as d3_select +} from 'd3-selection'; + +import { d3keybinding as d3_keybinding } from '../lib/d3.keybinding.js'; import { t } from '../util/locale'; import { @@ -34,7 +46,7 @@ export function modeSave(context) { id: 'save' }; - var keybinding = d3keybinding('select'); + var keybinding = d3_keybinding('select'); var commit = uiCommit(context) .on('cancel', cancel) @@ -54,8 +66,8 @@ export function modeSave(context) { origChanges = history.changes(actionDiscardTags(history.difference())), localGraph = context.graph(), remoteGraph = coreGraph(history.base(), true), - modified = _.filter(history.difference().summary(), {changeType: 'modified'}), - toCheck = _.map(_.map(modified, 'entity'), 'id'), + modified = _filter(history.difference().summary(), {changeType: 'modified'}), + toCheck = _map(_map(modified, 'entity'), 'id'), toLoad = withChildNodes(toCheck, localGraph), conflicts = [], errors = []; @@ -76,12 +88,12 @@ export function modeSave(context) { function withChildNodes(ids, graph) { - return _.uniq(_.reduce(ids, function(result, id) { + return _uniq(_reduce(ids, function(result, id) { var entity = graph.entity(id); if (entity.type === 'way') { try { var cn = graph.childNodes(entity); - result.push.apply(result, _.map(_.filter(cn, 'version'), 'id')); + result.push.apply(result, _map(_filter(cn, 'version'), 'id')); } catch (err) { /* eslint-disable no-console */ if (typeof console !== 'undefined') console.error(err); @@ -89,7 +101,7 @@ export function modeSave(context) { } } return result; - }, _.clone(ids))); + }, _clone(ids))); } @@ -106,19 +118,19 @@ export function modeSave(context) { } else { var loadMore = []; - _.each(result.data, function(entity) { + _each(result.data, function(entity) { remoteGraph.replace(entity); - toLoad = _.without(toLoad, entity.id); + toLoad = _without(toLoad, entity.id); // Because loadMultiple doesn't download /full like loadEntity, // need to also load children that aren't already being checked.. if (!entity.visible) return; if (entity.type === 'way') { loadMore.push.apply(loadMore, - _.difference(entity.nodes, toCheck, toLoad, loadMore)); + _difference(entity.nodes, toCheck, toLoad, loadMore)); } else if (entity.type === 'relation' && entity.isMultipolygon()) { loadMore.push.apply(loadMore, - _.difference(_.map(entity.members, 'id'), toCheck, toLoad, loadMore)); + _difference(_map(entity.members, 'id'), toCheck, toLoad, loadMore)); } }); @@ -149,7 +161,7 @@ export function modeSave(context) { if (local.version !== remote.version) return false; if (local.type === 'way') { - var children = _.union(local.nodes, remote.nodes); + var children = _union(local.nodes, remote.nodes); for (var i = 0; i < children.length; i++) { var a = localGraph.hasEntity(children[i]), @@ -162,7 +174,7 @@ export function modeSave(context) { return true; } - _.each(toCheck, function(id) { + _each(toCheck, function(id) { var local = localGraph.entity(id), remote = remoteGraph.entity(id); @@ -208,7 +220,7 @@ export function modeSave(context) { if (changes.modified.length || changes.created.length || changes.deleted.length) { osm.putChangeset(changeset, changes, uploadCallback); } else { // changes were insignificant or reverted by user - d3.select('.inspector-wrap *').remove(); + d3_select('.inspector-wrap *').remove(); loading.close(); context.flush(); cancel(); @@ -229,7 +241,7 @@ export function modeSave(context) { success(changeset); // Add delay to allow for postgres replication #1646 #2678 window.setTimeout(function() { - d3.select('.inspector-wrap *').remove(); + d3_select('.inspector-wrap *').remove(); loading.close(); context.flush(); }, 2500); @@ -257,7 +269,7 @@ export function modeSave(context) { if (conflicts[i].chosen === 1) { // user chose "keep theirs" var entity = context.hasEntity(conflicts[i].id); if (entity && entity.type === 'way') { - var children = _.uniq(entity.nodes); + var children = _uniq(entity.nodes); for (var j = 0; j < children.length; j++) { history.replace(actionRevert(children[j])); } @@ -308,14 +320,14 @@ export function modeSave(context) { .classed('hide-toggle', true) .text(function(d) { return d.msg || t('save.unknown_error_details'); }) .on('click', function() { - var error = d3.select(this), - detail = d3.select(this.nextElementSibling), + var error = d3_select(this), + detail = d3_select(this.nextElementSibling), exp = error.classed('expanded'); detail.style('display', exp ? 'none' : 'block'); error.classed('expanded', !exp); - d3.event.preventDefault(); + d3_event.preventDefault(); }); var details = enter @@ -361,7 +373,7 @@ export function modeSave(context) { keybinding .on('⎋', cancel, true); - d3.select(document) + d3_select(document) .call(keybinding); context.container().selectAll('#content') diff --git a/modules/modes/select.js b/modules/modes/select.js index 9fab54beb..281e77709 100644 --- a/modules/modes/select.js +++ b/modules/modes/select.js @@ -1,9 +1,18 @@ -import * as d3 from 'd3'; -import _ from 'lodash'; -import { d3keybinding } from '../lib/d3.keybinding.js'; +import _intersection from 'lodash-es/intersection'; +import _map from 'lodash-es/map'; +import _uniq from 'lodash-es/uniq'; +import _values from 'lodash-es/values'; +import _without from 'lodash-es/without'; + +import { + event as d3_event, + 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/index'; +import { actionAddMidpoint } from '../actions'; import { behaviorBreathe, @@ -12,18 +21,18 @@ import { behaviorLasso, behaviorPaste, behaviorSelect -} from '../behavior/index'; +} from '../behavior'; import { geoExtent, geoChooseEdge, geoPointInPolygon -} from '../geo/index'; +} from '../geo'; import { osmNode, osmWay -} from '../osm/index'; +} from '../osm'; import { modeBrowse } from './browse'; import { modeDragNode } from './drag_node'; @@ -45,7 +54,7 @@ export function modeSelect(context, selectedIDs) { button: 'browse' }; - var keybinding = d3keybinding('select'), + var keybinding = d3_keybinding('select'), timeout = null, behaviors = [ behaviorCopy(context), @@ -102,13 +111,13 @@ export function modeSelect(context, selectedIDs) { return []; // selection includes some not vertexes } - var currParents = _.map(graph.parentWays(entity), 'id'); + var currParents = _map(graph.parentWays(entity), 'id'); if (!commonParents.length) { commonParents = currParents; continue; } - commonParents = _.intersection(commonParents, currParents); + commonParents = _intersection(commonParents, currParents); if (!commonParents.length) { return []; } @@ -177,7 +186,7 @@ export function modeSelect(context, selectedIDs) { function toggleMenu() { // deprecation warning - Radial Menu to be removed in iD v3 - if (d3.select('.edit-menu, .radial-menu').empty()) { + if (d3_select('.edit-menu, .radial-menu').empty()) { positionMenu(); showMenu(); } else { @@ -236,7 +245,7 @@ export function modeSelect(context, selectedIDs) { function dblclick() { - var target = d3.select(d3.event.target), + var target = d3_select(d3_event.target), datum = target.datum(); if (datum instanceof osmWay && !target.classed('fill')) { @@ -249,16 +258,16 @@ export function modeSelect(context, selectedIDs) { t('operations.add.annotation.vertex') ); - d3.event.preventDefault(); - d3.event.stopPropagation(); + d3_event.preventDefault(); + d3_event.stopPropagation(); } else if (datum.type === 'midpoint') { context.perform( actionAddMidpoint({loc: datum.loc, edge: datum.edge}, osmNode()), t('operations.add.annotation.vertex')); - d3.event.preventDefault(); - d3.event.stopPropagation(); + d3_event.preventDefault(); + d3_event.stopPropagation(); } } @@ -289,7 +298,7 @@ export function modeSelect(context, selectedIDs) { if (selection.empty()) { // Return to browse mode if selected DOM elements have // disappeared because the user moved them out of view.. - var source = d3.event && d3.event.type === 'zoom' && d3.event.sourceEvent; + var source = d3_event && d3_event.type === 'zoom' && d3_event.sourceEvent; if (drawn && source && (source.type === 'mousemove' || source.type === 'touchmove')) { context.enter(modeBrowse(context)); } @@ -306,7 +315,7 @@ export function modeSelect(context, selectedIDs) { function firstVertex() { - d3.event.preventDefault(); + d3_event.preventDefault(); var parent = singularParent(); if (parent) { var way = context.entity(parent); @@ -318,7 +327,7 @@ export function modeSelect(context, selectedIDs) { function lastVertex() { - d3.event.preventDefault(); + d3_event.preventDefault(); var parent = singularParent(); if (parent) { var way = context.entity(parent); @@ -330,7 +339,7 @@ export function modeSelect(context, selectedIDs) { function previousVertex() { - d3.event.preventDefault(); + d3_event.preventDefault(); var parent = singularParent(); if (!parent) return; @@ -354,7 +363,7 @@ export function modeSelect(context, selectedIDs) { function nextVertex() { - d3.event.preventDefault(); + d3_event.preventDefault(); var parent = singularParent(); if (!parent) return; @@ -378,8 +387,8 @@ export function modeSelect(context, selectedIDs) { function nextParent() { - d3.event.preventDefault(); - var parents = _.uniq(commonParents()); + d3_event.preventDefault(); + var parents = _uniq(commonParents()); if (!parents || parents.length < 2) return; var index = parents.indexOf(relatedParent); @@ -402,7 +411,7 @@ export function modeSelect(context, selectedIDs) { if (!checkSelectedIDs()) return; - var operations = _.without(d3.values(Operations), Operations.operationDelete) + var operations = _without(_values(Operations), Operations.operationDelete) .map(function(o) { return o(selectedIDs, context); }) .filter(function(o) { return o.available(); }); @@ -434,7 +443,7 @@ export function modeSelect(context, selectedIDs) { .on('⎋', esc, true) .on('space', toggleMenu); - d3.select(document) + d3_select(document) .call(keybinding);