From 6d65a1c89a3551fe789ead9dcbdb744c1a149d45 Mon Sep 17 00:00:00 2001 From: Bryan Housel Date: Tue, 26 Sep 2017 00:17:13 -0400 Subject: [PATCH] Convert lodah-es and d3 to named imports for ui/fields --- modules/ui/fields/access.js | 19 ++++++----- modules/ui/fields/address.js | 38 +++++++++++++--------- modules/ui/fields/check.js | 28 +++++++++------- modules/ui/fields/combo.js | 50 ++++++++++++++++------------ modules/ui/fields/cycleway.js | 22 +++++++------ modules/ui/fields/input.js | 8 +++-- modules/ui/fields/lanes.js | 8 +++-- modules/ui/fields/localized.js | 54 ++++++++++++++++++------------- modules/ui/fields/maxspeed.js | 27 +++++++++------- modules/ui/fields/radio.js | 21 +++++++----- modules/ui/fields/restrictions.js | 32 ++++++++++-------- modules/ui/fields/textarea.js | 8 +++-- modules/ui/fields/wikipedia.js | 39 +++++++++++++--------- 13 files changed, 210 insertions(+), 144 deletions(-) diff --git a/modules/ui/fields/access.js b/modules/ui/fields/access.js index 2e47b33d9..11fa0c29d 100644 --- a/modules/ui/fields/access.js +++ b/modules/ui/fields/access.js @@ -1,6 +1,9 @@ -import * as d3 from 'd3'; -import _ from 'lodash'; -import { d3combobox } from '../../lib/d3.combobox.js'; +import _forEach from 'lodash-es/forEach'; + +import { dispatch as d3_dispatch } from 'd3-dispatch'; +import { select as d3_select } from 'd3-selection'; +import { d3combobox as d3_combobox } from '../../lib/d3.combobox.js'; + import { utilGetSetValue, utilNoAuto, @@ -9,7 +12,7 @@ import { export function uiFieldAccess(field, context) { - var dispatch = d3.dispatch('change'), + var dispatch = d3_dispatch('change'), items; function access(selection) { @@ -53,8 +56,8 @@ export function uiFieldAccess(field, context) { .attr('id', function(d) { return 'preset-input-access-' + d; }) .call(utilNoAuto) .each(function(d) { - d3.select(this) - .call(d3combobox() + d3_select(this) + .call(d3_combobox() .container(context.container()) .data(access.options(d)) ); @@ -72,7 +75,7 @@ export function uiFieldAccess(field, context) { function change(d) { var tag = {}; - tag[d] = utilGetSetValue(d3.select(this)) || undefined; + tag[d] = utilGetSetValue(d3_select(this)) || undefined; dispatch.call('change', this, tag); } @@ -212,7 +215,7 @@ export function uiFieldAccess(field, context) { items.selectAll('#preset-input-access-access') .attr('placeholder', 'yes'); - _.forEach(placeholders[tags.highway], function(v, k) { + _forEach(placeholders[tags.highway], function(v, k) { items.selectAll('#preset-input-access-' + k) .attr('placeholder', function() { return (tags.access || v); }); }); diff --git a/modules/ui/fields/address.js b/modules/ui/fields/address.js index 9e556eab1..0a19e999f 100644 --- a/modules/ui/fields/address.js +++ b/modules/ui/fields/address.js @@ -1,15 +1,21 @@ -import * as d3 from 'd3'; -import _ from 'lodash'; -import { d3combobox } from '../../lib/d3.combobox.js'; -import { dataAddressFormats } from '../../../data/index'; +import _find from 'lodash-es/find'; +import _includes from 'lodash-es/includes'; +import _reduce from 'lodash-es/reduce'; +import _uniqBy from 'lodash-es/uniqBy'; + +import { dispatch as d3_dispatch } from 'd3-dispatch'; +import { select as d3_select } from 'd3-selection'; +import { d3combobox as d3_combobox } from '../../lib/d3.combobox.js'; + +import { dataAddressFormats } from '../../../data'; import { geoExtent, geoChooseEdge, geoSphericalDistance -} from '../../geo/index'; +} from '../../geo'; -import { services } from '../../services/index'; +import { services } from '../../services'; import { utilGetSetValue, utilNoAuto, @@ -18,9 +24,9 @@ import { export function uiFieldAddress(field, context) { - var dispatch = d3.dispatch('init', 'change'), + var dispatch = d3_dispatch('init', 'change'), nominatim = services.geocoder, - wrap = d3.select(null), + wrap = d3_select(null), isInitialized = false, entity; @@ -46,7 +52,7 @@ export function uiFieldAddress(field, context) { return a.dist - b.dist; }); - return _.uniqBy(streets, 'value'); + return _uniqBy(streets, 'value'); function isAddressable(d) { return d.tags.highway && d.tags.name && d.type === 'way'; @@ -72,7 +78,7 @@ export function uiFieldAddress(field, context) { return a.dist - b.dist; }); - return _.uniqBy(cities, 'value'); + return _uniqBy(cities, 'value'); function isAddressable(d) { @@ -112,16 +118,16 @@ export function uiFieldAddress(field, context) { return a.dist - b.dist; }); - return _.uniqBy(results, 'value'); + return _uniqBy(results, 'value'); } function initCallback(err, countryCode) { if (err) return; - var addressFormat = _.find(dataAddressFormats, function (a) { - return a && a.countryCodes && _.includes(a.countryCodes, countryCode.toLowerCase()); - }) || _.first(dataAddressFormats); + var addressFormat = _find(dataAddressFormats, function (a) { + return a && a.countryCodes && _includes(a.countryCodes, countryCode.toLowerCase()); + }) || dataAddressFormats[0]; var widths = addressFormat.widths || { housenumber: 1/3, street: 2/3, @@ -130,7 +136,7 @@ export function uiFieldAddress(field, context) { function row(r) { // Normalize widths. - var total = _.reduce(r, function(sum, field) { + var total = _reduce(r, function(sum, field) { return sum + (widths[field] || 0.5); }, 0); @@ -177,7 +183,7 @@ export function uiFieldAddress(field, context) { : getNearValues; wrap.selectAll('input.addr-' + tag) - .call(d3combobox() + .call(d3_combobox() .container(context.container()) .minItems(1) .fetcher(function(value, callback) { diff --git a/modules/ui/fields/check.js b/modules/ui/fields/check.js index 455667ec6..8656748ee 100644 --- a/modules/ui/fields/check.js +++ b/modules/ui/fields/check.js @@ -1,4 +1,10 @@ -import * as d3 from 'd3'; +import { dispatch as d3_dispatch } from 'd3-dispatch'; + +import { + select as d3_select, + event as d3_event +} from 'd3-selection'; + import { utilRebind } from '../../util/rebind'; import { t } from '../../util/locale'; import { actionReverse } from '../../actions'; @@ -10,14 +16,14 @@ export { uiFieldCheck as uiFieldOnewayCheck }; export function uiFieldCheck(field, context) { - var dispatch = d3.dispatch('change'), + var dispatch = d3_dispatch('change'), options = field.strings && field.strings.options, values = [], texts = [], - input = d3.select(null), - text = d3.select(null), - label = d3.select(null), - reverser = d3.select(null), + input = d3_select(null), + text = d3_select(null), + label = d3_select(null), + reverser = d3_select(null), impliedYes, entityId, value; @@ -58,7 +64,7 @@ export function uiFieldCheck(field, context) { function reverserHidden() { - if (!d3.select('div.inspector-hover').empty()) return true; + if (!d3_select('div.inspector-hover').empty()) return true; return !(value === 'yes' || (impliedYes && !value)); } @@ -121,7 +127,7 @@ export function uiFieldCheck(field, context) { var t = {}; t[field.key] = values[(values.indexOf(value) + 1) % values.length]; dispatch.call('change', this, t); - d3.event.stopPropagation(); + d3_event.stopPropagation(); }); if (field.type === 'onewayCheck') { @@ -130,13 +136,13 @@ export function uiFieldCheck(field, context) { reverser .call(reverserSetText) .on('click', function() { - d3.event.preventDefault(); - d3.event.stopPropagation(); + d3_event.preventDefault(); + d3_event.stopPropagation(); context.perform( actionReverse(entityId), t('operations.reverse.annotation') ); - d3.select(this) + d3_select(this) .call(reverserSetText); }); } diff --git a/modules/ui/fields/combo.js b/modules/ui/fields/combo.js index baef52aa0..df1dc9dc4 100644 --- a/modules/ui/fields/combo.js +++ b/modules/ui/fields/combo.js @@ -1,8 +1,18 @@ -import * as d3 from 'd3'; -import _ from 'lodash'; +import _compact from 'lodash-es/compact'; +import _filter from 'lodash-es/filter'; +import _find from 'lodash-es/find'; +import _map from 'lodash-es/map'; +import _reject from 'lodash-es/reject'; +import _remove from 'lodash-es/remove'; +import _some from 'lodash-es/some'; +import _uniq from 'lodash-es/uniq'; + +import { dispatch as d3_dispatch } from 'd3-dispatch'; +import { event as d3_event } from 'd3-selection'; +import { d3combobox as d3_combobox } from '../../lib/d3.combobox.js'; + import { t } from '../../util/locale'; -import { d3combobox } from '../../lib/d3.combobox.js'; -import { services } from '../../services/index'; +import { services } from '../../services'; import { utilGetSetValue, utilNoAuto, @@ -18,7 +28,7 @@ export { export function uiFieldCombo(field, context) { - var dispatch = d3.dispatch('change'), + var dispatch = d3_dispatch('change'), nominatim = services.geocoder, taginfo = services.taginfo, isMulti = (field.type === 'multiCombo'), @@ -27,7 +37,7 @@ export function uiFieldCombo(field, context) { optstrings = field.strings && field.strings.options, optarray = field.options, snake_case = (field.snake_case || (field.snake_case === undefined)), - combobox = d3combobox() + combobox = d3_combobox() .container(context.container()) .minItems(isMulti || isSemi ? 1 : 2), comboData = [], @@ -64,7 +74,7 @@ export function uiFieldCombo(field, context) { dval = clean(dval || ''); if (optstrings) { - var match = _.find(comboData, function(o) { + var match = _find(comboData, function(o) { return o.key && clean(o.value) === dval; }); if (match) { @@ -86,7 +96,7 @@ export function uiFieldCombo(field, context) { tval = tval || ''; if (optstrings) { - var match = _.find(comboData, function(o) { return o.key === tval && o.value; }); + var match = _find(comboData, function(o) { return o.key === tval && o.value; }); if (match) { return match.value; } @@ -101,8 +111,8 @@ export function uiFieldCombo(field, context) { function objectDifference(a, b) { - return _.reject(a, function(d1) { - return _.some(b, function(d2) { return d1.value === d2.value; }); + return _reject(a, function(d1) { + return _some(b, function(d2) { return d1.value === d2.value; }); }); } @@ -174,12 +184,12 @@ export function uiFieldCombo(field, context) { taginfo[fn](params, function(err, data) { if (err) return; if (hasCountryPrefix) { - data = _.filter(data, function(d) { + data = _filter(data, function(d) { return d.value.toLowerCase().indexOf(country + ':') === 0; }); } - comboData = _.map(data, function(d) { + comboData = _map(data, function(d) { var k = d.value; if (isMulti) k = k.replace(field.key, ''); var v = snake_case ? unsnake(k) : k; @@ -202,8 +212,8 @@ export function uiFieldCombo(field, context) { if (isMulti || isSemi) { ph = field.placeholder() || t('inspector.add'); } else { - var vals = _.map(d, 'value').filter(function(s) { return s.length < 20; }), - placeholders = vals.length > 1 ? vals : _.map(d, 'key'); + var vals = _map(d, 'value').filter(function(s) { return s.length < 20; }), + placeholders = vals.length > 1 ? vals : _map(d, 'key'); ph = field.placeholder() || placeholders.slice(0, 3).join(', '); } @@ -230,7 +240,7 @@ export function uiFieldCombo(field, context) { } else if (isSemi) { var arr = multiData.map(function(d) { return d.key; }); arr.push(val); - t[field.key] = _.compact(_.uniq(arr)).join(';'); + t[field.key] = _compact(_uniq(arr)).join(';'); } window.setTimeout(function() { input.node().focus(); }, 10); @@ -243,14 +253,14 @@ export function uiFieldCombo(field, context) { function removeMultikey(d) { - d3.event.stopPropagation(); + d3_event.stopPropagation(); var t = {}; if (isMulti) { t[d.key] = undefined; } else if (isSemi) { - _.remove(multiData, function(md) { return md.key === d.key; }); + _remove(multiData, function(md) { return md.key === d.key; }); var arr = multiData.map(function(md) { return md.key; }); - arr = _.compact(_.uniq(arr)); + arr = _compact(_uniq(arr)); t[field.key] = arr.length ? arr.join(';') : undefined; } dispatch.call('change', this, t); @@ -325,10 +335,10 @@ export function uiFieldCombo(field, context) { }); // Set keys for form-field modified (needed for undo and reset buttons).. - field.keys = _.map(multiData, 'key'); + field.keys = _map(multiData, 'key'); } else if (isSemi) { - var arr = _.compact(_.uniq((tags[field.key] || '').split(';'))); + var arr = _compact(_uniq((tags[field.key] || '').split(';'))); multiData = arr.map(function(key) { return { key: key, diff --git a/modules/ui/fields/cycleway.js b/modules/ui/fields/cycleway.js index cbee57bee..4b58f0510 100644 --- a/modules/ui/fields/cycleway.js +++ b/modules/ui/fields/cycleway.js @@ -1,5 +1,9 @@ -import * as d3 from 'd3'; -import { d3combobox } from '../../lib/d3.combobox.js'; +import _keys from 'lodash-es/keys'; + +import { dispatch as d3_dispatch } from 'd3-dispatch'; +import { select as d3_select } from 'd3-selection'; +import { d3combobox as d3_combobox } from '../../lib/d3.combobox.js'; + import { utilGetSetValue, utilNoAuto, @@ -8,8 +12,8 @@ import { export function uiFieldCycleway(field, context) { - var dispatch = d3.dispatch('change'), - items = d3.select(null); + var dispatch = d3_dispatch('change'), + items = d3_select(null); function cycleway(selection) { @@ -57,8 +61,8 @@ export function uiFieldCycleway(field, context) { .attr('class', function(d) { return 'preset-input-cycleway preset-input-' + stripcolon(d); }) .call(utilNoAuto) .each(function(d) { - d3.select(this) - .call(d3combobox() + d3_select(this) + .call(d3_combobox() .container(context.container()) .data(cycleway.options(d)) ); @@ -73,8 +77,8 @@ export function uiFieldCycleway(field, context) { function change() { - var left = utilGetSetValue(d3.select('.preset-input-cyclewayleft')), - right = utilGetSetValue(d3.select('.preset-input-cyclewayright')), + var left = utilGetSetValue(d3_select('.preset-input-cyclewayleft')), + right = utilGetSetValue(d3_select('.preset-input-cyclewayright')), tag = {}; if (left === 'none' || left === '') { left = undefined; } @@ -102,7 +106,7 @@ export function uiFieldCycleway(field, context) { cycleway.options = function() { - return d3.keys(field.strings.options).map(function(option) { + return _keys(field.strings.options).map(function(option) { return { title: field.t('options.' + option + '.description'), value: option diff --git a/modules/ui/fields/input.js b/modules/ui/fields/input.js index c60f9361e..b5a49a6c7 100644 --- a/modules/ui/fields/input.js +++ b/modules/ui/fields/input.js @@ -1,4 +1,6 @@ -import * as d3 from 'd3'; +import { dispatch as d3_dispatch } from 'd3-dispatch'; +import { event as d3_event } from 'd3-selection'; + import { t, textDirection } from '../../util/locale'; import { dataPhoneFormats } from '../../../data'; import { services } from '../../services'; @@ -18,7 +20,7 @@ export { export function uiFieldText(field, context) { - var dispatch = d3.dispatch('change'), + var dispatch = d3_dispatch('change'), nominatim = services.geocoder, input, entity; @@ -80,7 +82,7 @@ export function uiFieldText(field, context) { spinControl.selectAll('button') .on('click', function(d) { - d3.event.preventDefault(); + d3_event.preventDefault(); var num = parseInt(input.node().value || 0, 10); if (!isNaN(num)) input.node().value = num + d; change()(); diff --git a/modules/ui/fields/lanes.js b/modules/ui/fields/lanes.js index c2c57b25b..4eff4a1e5 100644 --- a/modules/ui/fields/lanes.js +++ b/modules/ui/fields/lanes.js @@ -1,10 +1,12 @@ -import * as d3 from 'd3'; +import { dispatch as d3_dispatch } from 'd3-dispatch'; +import { select as d3_select } from 'd3-selection'; + import { utilRebind } from '../../util/rebind'; import { utilGetDimensions } from '../../util/dimensions'; export function uiFieldLanes(field, context) { - var dispatch = d3.dispatch('change'), + var dispatch = d3_dispatch('change'), LANE_WIDTH = 40, LANE_HEIGHT = 200, wayID, @@ -13,7 +15,7 @@ export function uiFieldLanes(field, context) { function lanes(selection) { lanesData = context.entity(wayID).lanes(); - if (!d3.select('.inspector-wrap.inspector-hidden').empty() || !selection.node().parentNode) { + if (!d3_select('.inspector-wrap.inspector-hidden').empty() || !selection.node().parentNode) { selection.call(lanes.off); return; } diff --git a/modules/ui/fields/localized.js b/modules/ui/fields/localized.js index 7ed965724..35ea06f3a 100644 --- a/modules/ui/fields/localized.js +++ b/modules/ui/fields/localized.js @@ -1,10 +1,18 @@ -import * as d3 from 'd3'; -import _ from 'lodash'; +import _find from 'lodash-es/find'; + +import { dispatch as d3_dispatch } from 'd3-dispatch'; + +import { + select as d3_select, + event as d3_event +} from 'd3-selection'; + +import { d3combobox as d3_combobox } from '../../lib/d3.combobox.js'; + import { t } from '../../util/locale'; -import { d3combobox } from '../../lib/d3.combobox.js'; -import { dataSuggestions, dataWikipedia } from '../../../data/index'; -import { services } from '../../services/index'; -import { svgIcon } from '../../svg/index'; +import { dataSuggestions, dataWikipedia } from '../../../data'; +import { services } from '../../services'; +import { svgIcon } from '../../svg'; import { tooltip } from '../../util/tooltip'; import { utilDetect } from '../../util/detect'; import { @@ -16,10 +24,10 @@ import { export function uiFieldLocalized(field, context) { - var dispatch = d3.dispatch('change', 'input'), + var dispatch = d3_dispatch('change', 'input'), wikipedia = services.wikipedia, - input = d3.select(null), - localizedInputs = d3.select(null), + input = d3_select(null), + localizedInputs = d3_select(null), wikiTitles, entity; @@ -40,7 +48,7 @@ export function uiFieldLocalized(field, context) { if (field.id === 'name') { var preset = context.presets().match(entity, context.graph()); input - .call(d3combobox() + .call(d3_combobox() .container(context.container()) .fetcher(utilSuggestNames(preset, dataSuggestions)) ); @@ -79,10 +87,10 @@ export function uiFieldLocalized(field, context) { function addNew() { - d3.event.preventDefault(); + d3_event.preventDefault(); var data = localizedInputs.selectAll('div.entry').data(); var defaultLang = utilDetect().locale.toLowerCase().split('-')[0]; - var langExists = _.find(data, function(datum) { return datum.lang === defaultLang;}); + var langExists = _find(data, function(datum) { return datum.lang === defaultLang;}); var isLangEn = defaultLang.indexOf('en') > -1; if (isLangEn || langExists) { defaultLang = ''; @@ -95,7 +103,7 @@ export function uiFieldLocalized(field, context) { function change(onInput) { return function() { var t = {}; - t[field.key] = utilGetSetValue(d3.select(this)) || undefined; + t[field.key] = utilGetSetValue(d3_select(this)) || undefined; dispatch.call('change', this, t, onInput); }; } @@ -107,9 +115,9 @@ export function uiFieldLocalized(field, context) { function changeLang(d) { - var lang = utilGetSetValue(d3.select(this)), + var lang = utilGetSetValue(d3_select(this)), t = {}, - language = _.find(dataWikipedia, function(d) { + language = _find(dataWikipedia, function(d) { return d[0].toLowerCase() === lang.toLowerCase() || d[1].toLowerCase() === lang.toLowerCase(); }); @@ -120,7 +128,7 @@ export function uiFieldLocalized(field, context) { t[key(d.lang)] = undefined; } - var value = utilGetSetValue(d3.select(this.parentNode) + var value = utilGetSetValue(d3_select(this.parentNode) .selectAll('.localized-value')); if (lang && value) { @@ -137,7 +145,7 @@ export function uiFieldLocalized(field, context) { function changeValue(d) { if (!d.lang) return; var t = {}; - t[key(d.lang)] = utilGetSetValue(d3.select(this)) || undefined; + t[key(d.lang)] = utilGetSetValue(d3_select(this)) || undefined; dispatch.call('change', this, t); } @@ -172,8 +180,8 @@ export function uiFieldLocalized(field, context) { innerWrap.attr('class', 'entry') .each(function() { - var wrap = d3.select(this); - var langcombo = d3combobox() + var wrap = d3_select(this); + var langcombo = d3_combobox() .container(context.container()) .fetcher(fetcher) .minItems(0); @@ -188,11 +196,11 @@ export function uiFieldLocalized(field, context) { .append('button') .attr('class', 'minor remove') .on('click', function(d){ - d3.event.preventDefault(); + d3_event.preventDefault(); var t = {}; t[key(d.lang)] = undefined; dispatch.call('change', this, t); - d3.select(this.parentNode.parentNode) + d3_select(this.parentNode.parentNode) .style('top','0') .style('max-height','240px') .transition() @@ -230,7 +238,7 @@ export function uiFieldLocalized(field, context) { .style('max-height', '240px') .style('opacity', '1') .on('end', function() { - d3.select(this) + d3_select(this) .style('max-height', '') .style('overflow', 'visible'); }); @@ -239,7 +247,7 @@ export function uiFieldLocalized(field, context) { var entry = selection.selectAll('.entry'); utilGetSetValue(entry.select('.localized-lang'), function(d) { - var lang = _.find(dataWikipedia, function(lang) { return lang[2] === d.lang; }); + var lang = _find(dataWikipedia, function(lang) { return lang[2] === d.lang; }); return lang ? lang[1] : d.lang; }); diff --git a/modules/ui/fields/maxspeed.js b/modules/ui/fields/maxspeed.js index fd0f33582..b304aab1b 100644 --- a/modules/ui/fields/maxspeed.js +++ b/modules/ui/fields/maxspeed.js @@ -1,8 +1,11 @@ -import * as d3 from 'd3'; -import _ from 'lodash'; -import { d3combobox } from '../../lib/d3.combobox.js'; -import { dataImperial } from '../../../data/index'; -import { geoPointInPolygon } from '../../geo/index'; +import _some from 'lodash-es/some'; + +import { dispatch as d3_dispatch } from 'd3-dispatch'; +import { select as d3_select } from 'd3-selection'; +import { d3combobox as d3_combobox } from '../../lib/d3.combobox.js'; + +import { dataImperial } from '../../../data'; +import { geoPointInPolygon } from '../../geo'; import { utilGetSetValue, utilNoAuto, @@ -11,11 +14,11 @@ import { export function uiFieldMaxspeed(field, context) { - var dispatch = d3.dispatch('change'), + var dispatch = d3_dispatch('change'), entity, isImperial, - unitInput = d3.select(null), - input = d3.select(null), + unitInput = d3_select(null), + input = d3_select(null), combobox; var metricValues = [20, 30, 40, 50, 60, 70, 80, 90, 100, 110, 120], @@ -23,10 +26,10 @@ export function uiFieldMaxspeed(field, context) { function maxspeed(selection) { - combobox = d3combobox() + combobox = d3_combobox() .container(context.container()); - var unitCombobox = d3combobox() + var unitCombobox = d3_combobox() .container(context.container()) .data(['km/h', 'mph'].map(comboValues)); @@ -49,8 +52,8 @@ export function uiFieldMaxspeed(field, context) { var childNodes = context.graph().childNodes(context.entity(entity.id)), loc = childNodes[~~(childNodes.length/2)].loc; - isImperial = _.some(dataImperial.features, function(f) { - return _.some(f.geometry.coordinates, function(d) { + isImperial = _some(dataImperial.features, function(f) { + return _some(f.geometry.coordinates, function(d) { return geoPointInPolygon(loc, d); }); }); diff --git a/modules/ui/fields/radio.js b/modules/ui/fields/radio.js index fa4fc4090..9cb4d50ea 100644 --- a/modules/ui/fields/radio.js +++ b/modules/ui/fields/radio.js @@ -1,4 +1,9 @@ -import * as d3 from 'd3'; +import { dispatch as d3_dispatch } from 'd3-dispatch'; +import { + select as d3_select, + selectAll as d3_selectAll +} from 'd3-selection'; + import { t } from '../../util/locale'; import { uiField } from '../field'; import { utilRebind } from '../../util'; @@ -8,11 +13,11 @@ export { uiFieldRadio as uiFieldStructureRadio }; export function uiFieldRadio(field, context) { - var dispatch = d3.dispatch('change'), - placeholder = d3.select(null), - wrap = d3.select(null), - labels = d3.select(null), - radios = d3.select(null), + var dispatch = d3_dispatch('change'), + placeholder = d3_select(null), + wrap = d3_select(null), + labels = d3_select(null), + radios = d3_select(null), typeField, layerField, oldType = {}, @@ -21,7 +26,7 @@ export function uiFieldRadio(field, context) { function selectedKey() { var selector = '.form-field-structure .toggle-list label.active input', - node = d3.selectAll(selector); + node = d3_selectAll(selector); return !node.empty() && node.datum(); } @@ -212,7 +217,7 @@ export function uiFieldRadio(field, context) { } radios.each(function(d) { - var active = d3.select(this).property('checked'); + var active = d3_select(this).property('checked'); if (active) activeKey = d; if (field.key) { diff --git a/modules/ui/fields/restrictions.js b/modules/ui/fields/restrictions.js index 8a473d88f..f70b47f48 100644 --- a/modules/ui/fields/restrictions.js +++ b/modules/ui/fields/restrictions.js @@ -1,37 +1,43 @@ -import * as d3 from 'd3'; +import { dispatch as d3_dispatch } from 'd3-dispatch'; + +import { + select as d3_select, + event as d3_event +} from 'd3-selection'; + import { t } from '../../util/locale'; import { behaviorBreathe, behaviorHover -} from '../../behavior/index'; +} from '../../behavior'; import { osmEntity, osmIntersection, osmInferRestriction, osmTurn -} from '../../osm/index'; +} from '../../osm'; import { actionRestrictTurn, actionUnrestrictTurn -} from '../../actions/index'; +} from '../../actions'; import { geoExtent, geoRawMercator -} from '../../geo/index'; +} from '../../geo'; import { svgLayers, svgLines, svgTurns, svgVertices -} from '../../svg/index'; +} from '../../svg'; import { utilRebind } from '../../util/rebind'; -import { utilFunctor } from '../../util/index'; +import { utilFunctor } from '../../util'; import { utilGetDimensions, @@ -40,7 +46,7 @@ import { export function uiFieldRestrictions(field, context) { - var dispatch = d3.dispatch('change'), + var dispatch = d3_dispatch('change'), breathe = behaviorBreathe(context), hover = behaviorHover(context), initialized = false, @@ -50,7 +56,7 @@ export function uiFieldRestrictions(field, context) { function restrictions(selection) { // if form field is hidden or has detached from dom, clean up. - if (!d3.select('.inspector-wrap.inspector-hidden').empty() || !selection.node().parentNode) { + if (!d3_select('.inspector-wrap.inspector-hidden').empty() || !selection.node().parentNode) { selection.call(restrictions.off); return; } @@ -133,7 +139,7 @@ export function uiFieldRestrictions(field, context) { context.history() .on('change.restrictions', render); - d3.select(window) + d3_select(window) .on('resize.restrictions', function() { utilSetDimensions(wrap, null); render(); @@ -145,7 +151,7 @@ export function uiFieldRestrictions(field, context) { .call(breathe.off) .call(breathe); - var datum = d3.event.target.__data__; + var datum = d3_event.target.__data__; if (datum instanceof osmEntity) { fromNodeID = intersection.adjacentNodeId(datum.id); render(); @@ -166,7 +172,7 @@ export function uiFieldRestrictions(field, context) { function mouseover() { - var datum = d3.event.target.__data__; + var datum = d3_event.target.__data__; if (datum instanceof osmTurn) { var graph = context.graph(), presets = context.presets(), @@ -236,7 +242,7 @@ export function uiFieldRestrictions(field, context) { context.history() .on('change.restrictions', null); - d3.select(window) + d3_select(window) .on('resize.restrictions', null); }; diff --git a/modules/ui/fields/textarea.js b/modules/ui/fields/textarea.js index 70b68e1e1..08d057cc3 100644 --- a/modules/ui/fields/textarea.js +++ b/modules/ui/fields/textarea.js @@ -1,4 +1,6 @@ -import * as d3 from 'd3'; +import { dispatch as d3_dispatch } from 'd3-dispatch'; +import { select as d3_select } from 'd3-selection'; + import { t } from '../../util/locale'; import { utilGetSetValue, @@ -8,8 +10,8 @@ import { export function uiFieldTextarea(field) { - var dispatch = d3.dispatch('change'), - input = d3.select(null); + var dispatch = d3_dispatch('change'), + input = d3_select(null); function textarea(selection) { diff --git a/modules/ui/fields/wikipedia.js b/modules/ui/fields/wikipedia.js index fe7e95c52..a292a7e67 100644 --- a/modules/ui/fields/wikipedia.js +++ b/modules/ui/fields/wikipedia.js @@ -1,8 +1,17 @@ -import * as d3 from 'd3'; -import _ from 'lodash'; +import _clone from 'lodash-es/clone'; +import _find from 'lodash-es/find'; + +import { dispatch as d3_dispatch } from 'd3-dispatch'; + +import { + select as d3_select, + event as d3_event +} from 'd3-selection'; + +import { d3combobox as d3_combobox } from '../../lib/d3.combobox.js'; + import { t } from '../../util/locale'; import { actionChangeTags } from '../../actions/index'; -import { d3combobox } from '../../lib/d3.combobox.js'; import { dataWikipedia } from '../../../data/index'; import { services } from '../../services/index'; import { svgIcon } from '../../svg/index'; @@ -15,18 +24,18 @@ import { export function uiFieldWikipedia(field, context) { - var dispatch = d3.dispatch('change'), + var dispatch = d3_dispatch('change'), wikipedia = services.wikipedia, wikidata = services.wikidata, - link = d3.select(null), - lang = d3.select(null), - title = d3.select(null), + link = d3_select(null), + lang = d3_select(null), + title = d3_select(null), wikiURL = '', entity; function wiki(selection) { - var langcombo = d3combobox() + var langcombo = d3_combobox() .container(context.container()) .fetcher(function(value, cb) { var v = value.toLowerCase(); @@ -40,7 +49,7 @@ export function uiFieldWikipedia(field, context) { })); }); - var titlecombo = d3combobox() + var titlecombo = d3_combobox() .container(context.container()) .fetcher(function(value, cb) { if (!value) { @@ -104,7 +113,7 @@ export function uiFieldWikipedia(field, context) { link .on('click', function() { - d3.event.preventDefault(); + d3_event.preventDefault(); if (wikiURL) window.open(wikiURL, '_blank'); }); } @@ -114,7 +123,7 @@ export function uiFieldWikipedia(field, context) { var value = utilGetSetValue(lang).toLowerCase(); var locale = utilDetect().locale.toLowerCase(); var localeLanguage; - return _.find(dataWikipedia, function(d) { + return _find(dataWikipedia, function(d) { if (d[2] === locale) localeLanguage = d; return d[0].toLowerCase() === value || d[1].toLowerCase() === value || @@ -137,7 +146,7 @@ export function uiFieldWikipedia(field, context) { function change(skipWikidata) { var value = utilGetSetValue(title), m = value.match(/https?:\/\/([-a-z]+)\.wikipedia\.org\/(?:wiki|\1-[-a-z]+)\/([^#]+)(?:#(.+))?/), - l = m && _.find(dataWikipedia, function(d) { return m[1] === d[2]; }), + l = m && _find(dataWikipedia, function(d) { return m[1] === d[2]; }), syncTags = {}; if (l) { @@ -181,8 +190,8 @@ export function uiFieldWikipedia(field, context) { if (!data || !Object.keys(data).length) return; var qids = Object.keys(data); - var value = qids && _.find(qids, function(id) { return id.match(/^Q\d+$/); }); - var currTags = _.clone(context.entity(initEntityId).tags); + var value = qids && _find(qids, function(id) { return id.match(/^Q\d+$/); }); + var currTags = _clone(context.entity(initEntityId).tags); currTags.wikidata = value; @@ -201,7 +210,7 @@ export function uiFieldWikipedia(field, context) { wiki.tags = function(tags) { var value = tags[field.key] || '', m = value.match(/([^:]+):([^#]+)(?:#(.+))?/), - l = m && _.find(dataWikipedia, function(d) { return m[1] === d[2]; }), + l = m && _find(dataWikipedia, function(d) { return m[1] === d[2]; }), anchor = m && m[3]; // value in correct format