CalvinBackup/iD
1
0
Fork 0
mirror of https://github.com/FoggedLens/iD.git synced 2026-05-15 21:48:20 +02:00
Code Issues Packages Projects Releases Wiki Activity

Convert lodah-es and d3 to named imports for ui/intro

Browse Source
This commit is contained in:
Bryan Housel
2017-09-26 00:27:21 -04:00
parent 6d65a1c89a
commit d296c26fcc
9 changed files with 216 additions and 167 deletions
Download Patch File Download Diff File Expand all files Collapse all files
modules/ui/intro/area.js
+36 -30
View File
@@ -1,4 +1,10 @@
import * as d3 from 'd3';
import { dispatch as d3_dispatch } from 'd3-dispatch';
import {
event as d3_event,
select as d3_select
} from 'd3-selection';
import { t } from '../../util/locale';
import { modeBrowse, modeSelect } from '../../modes';
import { utilRebind } from '../../util/rebind';
@@ -7,7 +13,7 @@ import { icon, pad, transitionTime } from './helper';
export function uiIntroArea(context, reveal) {
var dispatch = d3.dispatch('done'),
var dispatch = d3_dispatch('done'),
playground = [-85.63552, 41.94159],
playgroundPreset = context.presets().item('leisure/playground'),
descriptionField = context.presets().field('description'),
@@ -26,8 +32,8 @@ export function uiIntroArea(context, reveal) {
function eventCancel() {
d3.event.stopPropagation();
d3.event.preventDefault();
d3_event.stopPropagation();
d3_event.preventDefault();
}
@@ -196,13 +202,13 @@ export function uiIntroArea(context, reveal) {
}
// disallow scrolling
d3.select('.inspector-wrap').on('wheel.intro', eventCancel);
d3_select('.inspector-wrap').on('wheel.intro', eventCancel);
timeout(function() {
// reset pane, in case user somehow happened to change it..
d3.select('.inspector-wrap .panewrap').style('right', '-100%');
d3_select('.inspector-wrap .panewrap').style('right', '-100%');
d3.select('.preset-search-input')
d3_select('.preset-search-input')
.on('keydown.intro', null)
.on('keyup.intro', checkPresetSearch);
@@ -222,11 +228,11 @@ export function uiIntroArea(context, reveal) {
context.enter(modeSelect(context, [areaId]));
// reset pane, in case user somehow happened to change it..
d3.select('.inspector-wrap .panewrap').style('right', '-100%');
d3_select('.inspector-wrap .panewrap').style('right', '-100%');
// disallow scrolling
d3.select('.inspector-wrap').on('wheel.intro', eventCancel);
d3_select('.inspector-wrap').on('wheel.intro', eventCancel);
d3.select('.preset-search-input')
d3_select('.preset-search-input')
.on('keydown.intro', null)
.on('keyup.intro', checkPresetSearch);
@@ -239,7 +245,7 @@ export function uiIntroArea(context, reveal) {
});
function checkPresetSearch() {
var first = d3.select('.preset-list-item:first-child');
var first = d3_select('.preset-list-item:first-child');
if (first.classed('preset-leisure-playground')) {
reveal(first.select('.preset-list-button').node(),
@@ -247,7 +253,7 @@ export function uiIntroArea(context, reveal) {
{ duration: 300 }
);
d3.select('.preset-search-input')
d3_select('.preset-search-input')
.on('keydown.intro', eventCancel, true)
.on('keyup.intro', null);
@@ -258,10 +264,10 @@ export function uiIntroArea(context, reveal) {
}
function continueTo(nextStep) {
d3.select('.inspector-wrap').on('wheel.intro', null);
d3_select('.inspector-wrap').on('wheel.intro', null);
context.on('enter.intro', null);
context.history().on('change.intro', null);
d3.select('.preset-search-input').on('keydown.intro keyup.intro', null);
d3_select('.preset-search-input').on('keydown.intro keyup.intro', null);
nextStep();
}
}
@@ -276,16 +282,16 @@ export function uiIntroArea(context, reveal) {
return searchPresets();
}
if (!d3.select('.form-field-description').empty()) {
if (!d3_select('.form-field-description').empty()) {
return continueTo(describePlayground);
}
// disallow scrolling
d3.select('.inspector-wrap').on('wheel.intro', eventCancel);
d3_select('.inspector-wrap').on('wheel.intro', eventCancel);
timeout(function() {
// reset pane, in case user somehow happened to change it..
d3.select('.inspector-wrap .panewrap').style('right', '0%');
d3_select('.inspector-wrap .panewrap').style('right', '0%');
// It's possible for the user to add a description in a previous step..
// If they did this already, just continue to next step.
@@ -299,7 +305,7 @@ export function uiIntroArea(context, reveal) {
{ duration: 300 }
);
d3.select('.more-fields .combobox-input')
d3_select('.more-fields .combobox-input')
.on('click.intro', function() {
continueTo(chooseDescriptionField);
});
@@ -310,8 +316,8 @@ export function uiIntroArea(context, reveal) {
});
function continueTo(nextStep) {
d3.select('.inspector-wrap').on('wheel.intro', null);
d3.select('.more-fields .combobox-input').on('click.intro', null);
d3_select('.inspector-wrap').on('wheel.intro', null);
d3_select('.more-fields .combobox-input').on('click.intro', null);
context.on('exit.intro', null);
nextStep();
}
@@ -327,21 +333,21 @@ export function uiIntroArea(context, reveal) {
return searchPresets();
}
if (!d3.select('.form-field-description').empty()) {
if (!d3_select('.form-field-description').empty()) {
return continueTo(describePlayground);
}
// Make sure combobox is ready..
if (d3.select('div.combobox').empty()) {
if (d3_select('div.combobox').empty()) {
return continueTo(clickAddField);
}
// Watch for the combobox to go away..
var watcher;
watcher = window.setInterval(function() {
if (d3.select('div.combobox').empty()) {
if (d3_select('div.combobox').empty()) {
window.clearInterval(watcher);
timeout(function() {
if (d3.select('.form-field-description').empty()) {
if (d3_select('.form-field-description').empty()) {
continueTo(retryChooseDescription);
} else {
continueTo(describePlayground);
@@ -377,9 +383,9 @@ export function uiIntroArea(context, reveal) {
}
// reset pane, in case user happened to change it..
d3.select('.inspector-wrap .panewrap').style('right', '0%');
d3_select('.inspector-wrap .panewrap').style('right', '0%');
if (d3.select('.form-field-description').empty()) {
if (d3_select('.form-field-description').empty()) {
return continueTo(retryChooseDescription);
}
@@ -409,7 +415,7 @@ export function uiIntroArea(context, reveal) {
}
// reset pane, in case user happened to change it..
d3.select('.inspector-wrap .panewrap').style('right', '0%');
d3_select('.inspector-wrap .panewrap').style('right', '0%');
reveal('.entity-editor-pane',
t('intro.areas.retry_add_field', { field: descriptionField.label() }), {
@@ -450,9 +456,9 @@ export function uiIntroArea(context, reveal) {
context.on('enter.intro exit.intro', null);
context.map().on('move.intro drawn.intro', null);
context.history().on('change.intro', null);
d3.select('.inspector-wrap').on('wheel.intro', null);
d3.select('.preset-search-input').on('keydown.intro keyup.intro', null);
d3.select('.more-fields .combobox-input').on('click.intro', null);
d3_select('.inspector-wrap').on('wheel.intro', null);
d3_select('.preset-search-input').on('keydown.intro keyup.intro', null);
d3_select('.more-fields .combobox-input').on('click.intro', null);
};
modules/ui/intro/building.js
+36 -29
View File
@@ -1,5 +1,12 @@
import * as d3 from 'd3';
import _ from 'lodash';
import _uniq from 'lodash-es/uniq';
import { dispatch as d3_dispatch } from 'd3-dispatch';
import {
event as d3_event,
select as d3_select
} from 'd3-selection';
import { t, textDirection } from '../../util/locale';
import { modeBrowse, modeSelect } from '../../modes';
import { utilRebind } from '../../util/rebind';
@@ -7,7 +14,7 @@ import { icon, pad, isMostlySquare, selectMenuItem, transitionTime } from './hel
export function uiIntroBuilding(context, reveal) {
var dispatch = d3.dispatch('done'),
var dispatch = d3_dispatch('done'),
house = [-85.62815, 41.95638],
tank = [-85.62732, 41.95347],
buildingCatetory = context.presets().item('category-building'),
@@ -29,8 +36,8 @@ export function uiIntroBuilding(context, reveal) {
function eventCancel() {
d3.event.stopPropagation();
d3.event.preventDefault();
d3_event.stopPropagation();
d3_event.preventDefault();
}
@@ -148,7 +155,7 @@ export function uiIntroBuilding(context, reveal) {
var graph = context.graph(),
way = context.entity(context.selectedIDs()[0]),
nodes = graph.childNodes(way),
points = _.uniq(nodes).map(function(n) { return context.projection(n.loc); });
points = _uniq(nodes).map(function(n) { return context.projection(n.loc); });
if (isMostlySquare(points)) {
houseId = way.id;
@@ -200,13 +207,13 @@ export function uiIntroBuilding(context, reveal) {
}
// disallow scrolling
d3.select('.inspector-wrap').on('wheel.intro', eventCancel);
d3_select('.inspector-wrap').on('wheel.intro', eventCancel);
timeout(function() {
// reset pane, in case user somehow happened to change it..
d3.select('.inspector-wrap .panewrap').style('right', '-100%');
d3_select('.inspector-wrap .panewrap').style('right', '-100%');
var button = d3.select('.preset-category-building .preset-list-button');
var button = d3_select('.preset-category-building .preset-list-button');
reveal(button.node(),
t('intro.buildings.choose_category_building', { category: buildingCatetory.name() })
@@ -231,8 +238,8 @@ export function uiIntroBuilding(context, reveal) {
});
function continueTo(nextStep) {
d3.select('.inspector-wrap').on('wheel.intro', null);
d3.select('.preset-list-button').on('click.intro', null);
d3_select('.inspector-wrap').on('wheel.intro', null);
d3_select('.preset-list-button').on('click.intro', null);
context.on('enter.intro', null);
nextStep();
}
@@ -249,13 +256,13 @@ export function uiIntroBuilding(context, reveal) {
}
// disallow scrolling
d3.select('.inspector-wrap').on('wheel.intro', eventCancel);
d3_select('.inspector-wrap').on('wheel.intro', eventCancel);
timeout(function() {
// reset pane, in case user somehow happened to change it..
d3.select('.inspector-wrap .panewrap').style('right', '-100%');
d3_select('.inspector-wrap .panewrap').style('right', '-100%');
var button = d3.select('.preset-building-house .preset-list-button');
var button = d3_select('.preset-building-house .preset-list-button');
reveal(button.node(),
t('intro.buildings.choose_preset_house', { preset: housePreset.name() }),
@@ -281,8 +288,8 @@ export function uiIntroBuilding(context, reveal) {
});
function continueTo(nextStep) {
d3.select('.inspector-wrap').on('wheel.intro', null);
d3.select('.preset-list-button').on('click.intro', null);
d3_select('.inspector-wrap').on('wheel.intro', null);
d3_select('.preset-list-button').on('click.intro', null);
context.on('enter.intro', null);
nextStep();
}
@@ -541,13 +548,13 @@ export function uiIntroBuilding(context, reveal) {
}
// disallow scrolling
d3.select('.inspector-wrap').on('wheel.intro', eventCancel);
d3_select('.inspector-wrap').on('wheel.intro', eventCancel);
timeout(function() {
// reset pane, in case user somehow happened to change it..
d3.select('.inspector-wrap .panewrap').style('right', '-100%');
d3_select('.inspector-wrap .panewrap').style('right', '-100%');
d3.select('.preset-search-input')
d3_select('.preset-search-input')
.on('keydown.intro', null)
.on('keyup.intro', checkPresetSearch);
@@ -567,11 +574,11 @@ export function uiIntroBuilding(context, reveal) {
context.enter(modeSelect(context, [tankId]));
// reset pane, in case user somehow happened to change it..
d3.select('.inspector-wrap .panewrap').style('right', '-100%');
d3_select('.inspector-wrap .panewrap').style('right', '-100%');
// disallow scrolling
d3.select('.inspector-wrap').on('wheel.intro', eventCancel);
d3_select('.inspector-wrap').on('wheel.intro', eventCancel);
d3.select('.preset-search-input')
d3_select('.preset-search-input')
.on('keydown.intro', null)
.on('keyup.intro', checkPresetSearch);
@@ -584,7 +591,7 @@ export function uiIntroBuilding(context, reveal) {
});
function checkPresetSearch() {
var first = d3.select('.preset-list-item:first-child');
var first = d3_select('.preset-list-item:first-child');
if (first.classed('preset-man_made-storage_tank')) {
reveal(first.select('.preset-list-button').node(),
@@ -592,7 +599,7 @@ export function uiIntroBuilding(context, reveal) {
{ duration: 300 }
);
d3.select('.preset-search-input')
d3_select('.preset-search-input')
.on('keydown.intro', eventCancel, true)
.on('keyup.intro', null);
@@ -603,10 +610,10 @@ export function uiIntroBuilding(context, reveal) {
}
function continueTo(nextStep) {
d3.select('.inspector-wrap').on('wheel.intro', null);
d3_select('.inspector-wrap').on('wheel.intro', null);
context.on('enter.intro', null);
context.history().on('change.intro', null);
d3.select('.preset-search-input').on('keydown.intro keyup.intro', null);
d3_select('.preset-search-input').on('keydown.intro keyup.intro', null);
nextStep();
}
}
@@ -773,9 +780,9 @@ export function uiIntroBuilding(context, reveal) {
context.on('enter.intro exit.intro', null);
context.map().on('move.intro drawn.intro', null);
context.history().on('change.intro', null);
d3.select('.inspector-wrap').on('wheel.intro', null);
d3.select('.preset-search-input').on('keydown.intro keyup.intro', null);
d3.select('.more-fields .combobox-input').on('click.intro', null);
d3_select('.inspector-wrap').on('wheel.intro', null);
d3_select('.preset-search-input').on('keydown.intro keyup.intro', null);
d3_select('.more-fields .combobox-input').on('click.intro', null);
};
modules/ui/intro/helper.js
+3 -2
View File
@@ -1,4 +1,5 @@
import * as d3 from 'd3';
import { select as d3_select } from 'd3-selection';
import { t } from '../../util/locale';
import { geoSphericalDistance } from '../../geo';
@@ -160,7 +161,7 @@ export function isMostlySquare(points) {
export function selectMenuItem(operation) {
var selector = '.edit-menu .edit-menu-item-' + operation +
', .radial-menu .radial-menu-item-' + operation;
return d3.select(selector);
return d3_select(selector);
}
modules/ui/intro/intro.js
+18 -11
View File
@@ -1,5 +1,12 @@
import * as d3 from 'd3';
import _ from 'lodash';
import _difference from 'lodash-es/difference';
import _uniq from 'lodash-es/uniq';
import _values from 'lodash-es/values';
import {
select as d3_select,
selectAll as d3_selectAll
} from 'd3-selection';
import { t, textDirection } from '../../util/locale';
import { localize } from './helper';
@@ -63,7 +70,7 @@ export function uiIntro(context) {
zoom = context.map().zoom(),
background = context.background().baseLayerSource(),
overlays = context.background().overlayLayerSources(),
opacity = d3.selectAll('#map .layer-background').style('opacity'),
opacity = d3_selectAll('#map .layer-background').style('opacity'),
loadedTiles = osm && osm.loadedTiles(),
baseEntities = context.history().graph().base().entities,
countryCode = services.geocoder.countryCode;
@@ -74,7 +81,7 @@ export function uiIntro(context) {
// Load semi-real data used in intro
if (osm) { osm.toggle(false).reset(); }
context.history().reset();
context.history().merge(d3.values(coreGraph().load(introGraph).entities));
context.history().merge(_values(coreGraph().load(introGraph).entities));
context.history().checkpoint('initial');
context.background().bing();
overlays.forEach(function (d) { context.background().toggleOverlayLayer(d); });
@@ -84,7 +91,7 @@ export function uiIntro(context) {
callback(null, t('intro.graph.countrycode'));
};
d3.selectAll('#map .layer-background').style('opacity', 1);
d3_selectAll('#map .layer-background').style('opacity', 1);
var curtain = uiCurtain();
selection.call(curtain);
@@ -107,13 +114,13 @@ export function uiIntro(context) {
if (i < chapterFlow.length - 1) {
var next = chapterFlow[i + 1];
d3.select('button.chapter-' + next)
d3_select('button.chapter-' + next)
.classed('next', true);
}
// store walkthrough progress..
progress.push(chapter);
context.storage('walkthrough_progress', _.uniq(progress).join(';'));
context.storage('walkthrough_progress', _uniq(progress).join(';'));
});
return s;
});
@@ -121,19 +128,19 @@ export function uiIntro(context) {
chapters[chapters.length - 1].on('startEditing', function() {
// store walkthrough progress..
progress.push('startEditing');
context.storage('walkthrough_progress', _.uniq(progress).join(';'));
context.storage('walkthrough_progress', _uniq(progress).join(';'));
// store if walkthrough is completed..
var incomplete = _.difference(chapterFlow, progress);
var incomplete = _difference(chapterFlow, progress);
if (!incomplete.length) {
context.storage('walkthrough_completed', 'yes');
}
curtain.remove();
navwrap.remove();
d3.selectAll('#map .layer-background').style('opacity', opacity);
d3_selectAll('#map .layer-background').style('opacity', opacity);
if (osm) { osm.toggle(true).reset().loadedTiles(loadedTiles); }
context.history().reset().merge(d3.values(baseEntities));
context.history().reset().merge(_values(baseEntities));
context.background().baseLayerSource(background);
overlays.forEach(function (d) { context.background().toggleOverlayLayer(d); });
if (history) { context.history().fromJSON(history, false); }
modules/ui/intro/line.js
+31 -24
View File
@@ -1,5 +1,12 @@
import * as d3 from 'd3';
import _ from 'lodash';
import _some from 'lodash-es/some';
import { dispatch as d3_dispatch } from 'd3-dispatch';
import {
event as d3_event,
select as d3_select
} from 'd3-selection';
import { t, textDirection } from '../../util/locale';
import { geoSphericalDistance } from '../../geo';
import { modeBrowse, modeSelect } from '../../modes';
@@ -8,7 +15,7 @@ import { icon, pad, selectMenuItem, transitionTime } from './helper';
export function uiIntroLine(context, reveal) {
var dispatch = d3.dispatch('done'),
var dispatch = d3_dispatch('done'),
timeouts = [],
tulipRoadId = null,
flowerRoadId = 'w646',
@@ -44,8 +51,8 @@ export function uiIntroLine(context, reveal) {
function eventCancel() {
d3.event.stopPropagation();
d3.event.preventDefault();
d3_event.stopPropagation();
d3_event.preventDefault();
}
@@ -191,8 +198,8 @@ export function uiIntroLine(context, reveal) {
if (!entity) return false;
var drawNodes = context.graph().childNodes(entity);
return _.some(drawNodes, function(node) {
return _.some(context.graph().parentWays(node), function(parent) {
return _some(drawNodes, function(node) {
return _some(context.graph().parentWays(node), function(parent) {
return parent.id === flowerRoadId;
});
});
@@ -200,7 +207,7 @@ export function uiIntroLine(context, reveal) {
function retryIntersect() {
d3.select(window).on('mousedown.intro', eventCancel, true);
d3_select(window).on('mousedown.intro', eventCancel, true);
var box = pad(tulipRoadIntersection, 80, context);
reveal(box,
@@ -245,15 +252,15 @@ export function uiIntroLine(context, reveal) {
return chapter.restart();
});
var button = d3.select('.preset-category-road .preset-list-button');
var button = d3_select('.preset-category-road .preset-list-button');
if (button.empty()) return chapter.restart();
// disallow scrolling
d3.select('.inspector-wrap').on('wheel.intro', eventCancel);
d3_select('.inspector-wrap').on('wheel.intro', eventCancel);
timeout(function() {
// reset pane, in case user somehow happened to change it..
d3.select('.inspector-wrap .panewrap').style('right', '-100%');
d3_select('.inspector-wrap .panewrap').style('right', '-100%');
reveal(button.node(),
t('intro.lines.choose_category_road', { category: roadCategory.name() })
@@ -266,8 +273,8 @@ export function uiIntroLine(context, reveal) {
}, 400); // after editor pane visible
function continueTo(nextStep) {
d3.select('.inspector-wrap').on('wheel.intro', null);
d3.select('.preset-list-button').on('click.intro', null);
d3_select('.inspector-wrap').on('wheel.intro', null);
d3_select('.preset-list-button').on('click.intro', null);
context.on('exit.intro', null);
nextStep();
}
@@ -283,7 +290,7 @@ export function uiIntroLine(context, reveal) {
return chapter.restart();
});
var subgrid = d3.select('.preset-category-road .subgrid');
var subgrid = d3_select('.preset-category-road .subgrid');
if (subgrid.empty()) return chapter.restart();
subgrid.selectAll(':not(.preset-highway-residential) .preset-list-button')
@@ -304,7 +311,7 @@ export function uiIntroLine(context, reveal) {
}, 300);
function continueTo(nextStep) {
d3.select('.preset-list-button').on('click.intro', null);
d3_select('.preset-list-button').on('click.intro', null);
context.on('exit.intro', null);
nextStep();
}
@@ -322,10 +329,10 @@ export function uiIntroLine(context, reveal) {
});
// disallow scrolling
d3.select('.inspector-wrap').on('wheel.intro', eventCancel);
d3_select('.inspector-wrap').on('wheel.intro', eventCancel);
timeout(function() {
var button = d3.select('.entity-editor-pane .preset-list-button');
var button = d3_select('.entity-editor-pane .preset-list-button');
reveal(button.node(),
t('intro.lines.retry_preset_residential', { preset: residentialPreset.name() })
@@ -338,8 +345,8 @@ export function uiIntroLine(context, reveal) {
}, 500);
function continueTo(nextStep) {
d3.select('.inspector-wrap').on('wheel.intro', null);
d3.select('.preset-list-button').on('click.intro', null);
d3_select('.inspector-wrap').on('wheel.intro', null);
d3_select('.preset-list-button').on('click.intro', null);
context.on('exit.intro', null);
nextStep();
}
@@ -953,7 +960,7 @@ export function uiIntroLine(context, reveal) {
reveal(box, t('intro.lines.multi_rightclick'), { duration: 0 });
});
d3.select(window).on('click.intro contextmenu.intro', function() {
d3_select(window).on('click.intro contextmenu.intro', function() {
timeout(function() {
var ids = context.selectedIDs();
if (ids.length === 2 &&
@@ -983,7 +990,7 @@ export function uiIntroLine(context, reveal) {
function continueTo(nextStep) {
context.map().on('move.intro drawn.intro', null);
d3.select(window).on('click.intro contextmenu.intro', null, true);
d3_select(window).on('click.intro contextmenu.intro', null, true);
context.history().on('change.intro', null);
nextStep();
}
@@ -1072,12 +1079,12 @@ export function uiIntroLine(context, reveal) {
chapter.exit = function() {
timeouts.forEach(window.clearTimeout);
d3.select(window).on('mousedown.intro', null, true);
d3_select(window).on('mousedown.intro', null, true);
context.on('enter.intro exit.intro', null);
context.map().on('move.intro drawn.intro', null);
context.history().on('change.intro', null);
d3.select('.inspector-wrap').on('wheel.intro', null);
d3.select('.preset-list-button').on('click.intro', null);
d3_select('.inspector-wrap').on('wheel.intro', null);
d3_select('.preset-list-button').on('click.intro', null);
};
modules/ui/intro/navigation.js
+28 -22
View File
@@ -1,4 +1,10 @@
import * as d3 from 'd3';
import { dispatch as d3_dispatch } from 'd3-dispatch';
import {
event as d3_event,
select as d3_select
} from 'd3-selection';
import { t } from '../../util/locale';
import { modeBrowse, modeSelect } from '../../modes';
import { utilRebind } from '../../util/rebind';
@@ -6,7 +12,7 @@ import { icon, pointBox, transitionTime } from './helper';
export function uiIntroNavigation(context, reveal) {
var dispatch = d3.dispatch('done'),
var dispatch = d3_dispatch('done'),
timeouts = [],
hallId = 'n2061',
townHall = [-85.63591, 41.94285],
@@ -28,8 +34,8 @@ export function uiIntroNavigation(context, reveal) {
function eventCancel() {
d3.event.stopPropagation();
d3.event.preventDefault();
d3_event.stopPropagation();
d3_event.preventDefault();
}
@@ -250,7 +256,7 @@ export function uiIntroNavigation(context, reveal) {
if (!isTownHallSelected()) return clickTownHall();
// disallow scrolling
d3.select('.inspector-wrap').on('wheel.intro', eventCancel);
d3_select('.inspector-wrap').on('wheel.intro', eventCancel);
var onClick = function() { continueTo(presetTownHall); };
@@ -272,7 +278,7 @@ export function uiIntroNavigation(context, reveal) {
function continueTo(nextStep) {
context.on('exit.intro', null);
context.history().on('change.intro', null);
d3.select('.inspector-wrap').on('wheel.intro', null);
d3_select('.inspector-wrap').on('wheel.intro', null);
nextStep();
}
}
@@ -282,9 +288,9 @@ export function uiIntroNavigation(context, reveal) {
if (!isTownHallSelected()) return clickTownHall();
// reset pane, in case user happened to change it..
d3.select('.inspector-wrap .panewrap').style('right', '0%');
d3_select('.inspector-wrap .panewrap').style('right', '0%');
// disallow scrolling
d3.select('.inspector-wrap').on('wheel.intro', eventCancel);
d3_select('.inspector-wrap').on('wheel.intro', eventCancel);
// preset match, in case the user happened to change it.
var entity = context.entity(context.selectedIDs()[0]);
@@ -310,7 +316,7 @@ export function uiIntroNavigation(context, reveal) {
function continueTo(nextStep) {
context.on('exit.intro', null);
context.history().on('change.intro', null);
d3.select('.inspector-wrap').on('wheel.intro', null);
d3_select('.inspector-wrap').on('wheel.intro', null);
nextStep();
}
}
@@ -320,9 +326,9 @@ export function uiIntroNavigation(context, reveal) {
if (!isTownHallSelected()) return clickTownHall();
// reset pane, in case user happened to change it..
d3.select('.inspector-wrap .panewrap').style('right', '0%');
d3_select('.inspector-wrap .panewrap').style('right', '0%');
// disallow scrolling
d3.select('.inspector-wrap').on('wheel.intro', eventCancel);
d3_select('.inspector-wrap').on('wheel.intro', eventCancel);
var onClick = function() { continueTo(closeTownHall); };
@@ -344,7 +350,7 @@ export function uiIntroNavigation(context, reveal) {
function continueTo(nextStep) {
context.on('exit.intro', null);
context.history().on('change.intro', null);
d3.select('.inspector-wrap').on('wheel.intro', null);
d3_select('.inspector-wrap').on('wheel.intro', null);
nextStep();
}
}
@@ -354,7 +360,7 @@ export function uiIntroNavigation(context, reveal) {
if (!isTownHallSelected()) return clickTownHall();
var selector = '.entity-editor-pane button.preset-close svg use';
var href = d3.select(selector).attr('href') || '#icon-close';
var href = d3_select(selector).attr('href') || '#icon-close';
reveal('.entity-editor-pane',
t('intro.navigation.close_townhall', { button: icon(href, 'pre-text') })
@@ -367,7 +373,7 @@ export function uiIntroNavigation(context, reveal) {
context.history().on('change.intro', function() {
// update the close icon in the tooltip if the user edits something.
var selector = '.entity-editor-pane button.preset-close svg use';
var href = d3.select(selector).attr('href') || '#icon-close';
var href = d3_select(selector).attr('href') || '#icon-close';
reveal('.entity-editor-pane',
t('intro.navigation.close_townhall', { button: icon(href, 'pre-text') }),
@@ -396,14 +402,14 @@ export function uiIntroNavigation(context, reveal) {
t('intro.navigation.search_street', { name: t('intro.graph.name.spring-street') })
);
d3.select('.search-header input')
d3_select('.search-header input')
.on('keyup.intro', checkSearchResult);
}, msec + 100);
}
function checkSearchResult() {
var first = d3.select('.feature-list-item:nth-child(0n+2)'), // skip "No Results" item
var first = d3_select('.feature-list-item:nth-child(0n+2)'), // skip "No Results" item
firstName = first.select('.entity-name'),
name = t('intro.graph.name.spring-street');
@@ -417,14 +423,14 @@ export function uiIntroNavigation(context, reveal) {
continueTo(selectedStreet);
});
d3.select('.search-header input')
d3_select('.search-header input')
.on('keydown.intro', eventCancel, true)
.on('keyup.intro', null);
}
function continueTo(nextStep) {
context.on('exit.intro', null);
d3.select('.search-header input')
d3_select('.search-header input')
.on('keydown.intro', null)
.on('keyup.intro', null);
nextStep();
@@ -490,7 +496,7 @@ export function uiIntroNavigation(context, reveal) {
function editorStreet() {
var selector = '.entity-editor-pane button.preset-close svg use';
var href = d3.select(selector).attr('href') || '#icon-close';
var href = d3_select(selector).attr('href') || '#icon-close';
reveal('.entity-editor-pane',
t('intro.navigation.editor_street', {
@@ -507,7 +513,7 @@ export function uiIntroNavigation(context, reveal) {
context.history().on('change.intro', function() {
// update the close icon in the tooltip if the user edits something.
var selector = '.entity-editor-pane button.preset-close svg use';
var href = d3.select(selector).attr('href') || '#icon-close';
var href = d3_select(selector).attr('href') || '#icon-close';
reveal('.entity-editor-pane',
t('intro.navigation.editor_street', {
@@ -548,8 +554,8 @@ export function uiIntroNavigation(context, reveal) {
context.on('enter.intro exit.intro', null);
context.map().on('move.intro drawn.intro', null);
context.history().on('change.intro', null);
d3.select('.inspector-wrap').on('wheel.intro', null);
d3.select('.search-header input').on('keydown.intro keyup.intro', null);
d3_select('.inspector-wrap').on('wheel.intro', null);
d3_select('.search-header input').on('keydown.intro keyup.intro', null);
};
modules/ui/intro/point.js
+24 -19
View File
@@ -1,4 +1,9 @@
import * as d3 from 'd3';
import { dispatch as d3_dispatch } from 'd3-dispatch';
import {
event as d3_event,
select as d3_select
} from 'd3-selection';
import { t, textDirection } from '../../util/locale';
import { actionChangePreset } from '../../actions';
import { modeBrowse, modeSelect } from '../../modes';
@@ -7,7 +12,7 @@ import { icon, pointBox, pad, selectMenuItem, transitionTime } from './helper';
export function uiIntroPoint(context, reveal) {
var dispatch = d3.dispatch('done'),
var dispatch = d3_dispatch('done'),
timeouts = [],
intersection = [-85.63279, 41.94394],
building = [-85.632422, 41.944045],
@@ -44,8 +49,8 @@ export function uiIntroPoint(context, reveal) {
function eventCancel() {
d3.event.stopPropagation();
d3.event.preventDefault();
d3_event.stopPropagation();
d3_event.preventDefault();
}
@@ -115,9 +120,9 @@ export function uiIntroPoint(context, reveal) {
}
// disallow scrolling
d3.select('.inspector-wrap').on('wheel.intro', eventCancel);
d3_select('.inspector-wrap').on('wheel.intro', eventCancel);
d3.select('.preset-search-input')
d3_select('.preset-search-input')
.on('keydown.intro', null)
.on('keyup.intro', checkPresetSearch);
@@ -136,9 +141,9 @@ export function uiIntroPoint(context, reveal) {
context.enter(modeSelect(context, [pointId]));
// disallow scrolling
d3.select('.inspector-wrap').on('wheel.intro', eventCancel);
d3_select('.inspector-wrap').on('wheel.intro', eventCancel);
d3.select('.preset-search-input')
d3_select('.preset-search-input')
.on('keydown.intro', null)
.on('keyup.intro', checkPresetSearch);
@@ -152,10 +157,10 @@ export function uiIntroPoint(context, reveal) {
function checkPresetSearch() {
var first = d3.select('.preset-list-item:first-child');
var first = d3_select('.preset-list-item:first-child');
if (first.classed('preset-amenity-cafe')) {
d3.select('.preset-search-input')
d3_select('.preset-search-input')
.on('keydown.intro', eventCancel, true)
.on('keyup.intro', null);
@@ -173,8 +178,8 @@ export function uiIntroPoint(context, reveal) {
function continueTo(nextStep) {
context.on('enter.intro', null);
context.history().on('change.intro', null);
d3.select('.inspector-wrap').on('wheel.intro', null);
d3.select('.preset-search-input').on('keydown.intro keyup.intro', null);
d3_select('.inspector-wrap').on('wheel.intro', null);
d3_select('.preset-search-input').on('keydown.intro keyup.intro', null);
nextStep();
}
}
@@ -211,7 +216,7 @@ export function uiIntroPoint(context, reveal) {
}
// reset pane, in case user happened to change it..
d3.select('.inspector-wrap .panewrap').style('right', '0%');
d3_select('.inspector-wrap .panewrap').style('right', '0%');
timeout(function() {
// It's possible for the user to add a name in a previous step..
@@ -252,10 +257,10 @@ export function uiIntroPoint(context, reveal) {
function addCloseEditor() {
// reset pane, in case user happened to change it..
d3.select('.inspector-wrap .panewrap').style('right', '0%');
d3_select('.inspector-wrap .panewrap').style('right', '0%');
var selector = '.entity-editor-pane button.preset-close svg use';
var href = d3.select(selector).attr('href') || '#icon-close';
var href = d3_select(selector).attr('href') || '#icon-close';
context.on('exit.intro', function() {
continueTo(reselectPoint);
@@ -321,7 +326,7 @@ export function uiIntroPoint(context, reveal) {
}
// reset pane, in case user happened to untag the point..
d3.select('.inspector-wrap .panewrap').style('right', '0%');
d3_select('.inspector-wrap .panewrap').style('right', '0%');
context.on('exit.intro', function() {
continueTo(reselectPoint);
@@ -351,7 +356,7 @@ export function uiIntroPoint(context, reveal) {
}
// reset pane, in case user happened to change it..
d3.select('.inspector-wrap .panewrap').style('right', '0%');
d3_select('.inspector-wrap .panewrap').style('right', '0%');
context.on('exit.intro', function() {
continueTo(rightClickPoint);
@@ -490,8 +495,8 @@ export function uiIntroPoint(context, reveal) {
context.on('enter.intro exit.intro', null);
context.map().on('move.intro drawn.intro', null);
context.history().on('change.intro', null);
d3.select('.inspector-wrap').on('wheel.intro', eventCancel);
d3.select('.preset-search-input').on('keydown.intro keyup.intro', null);
d3_select('.inspector-wrap').on('wheel.intro', eventCancel);
d3_select('.preset-search-input').on('keydown.intro keyup.intro', null);
};
modules/ui/intro/start_editing.js
+11 -6
View File
@@ -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 { icon } from './helper';
import { uiModal } from '../modal';
@@ -6,8 +11,8 @@ import { utilRebind } from '../../util/rebind';
export function uiIntroStartEditing(context, reveal) {
var dispatch = d3.dispatch('done', 'startEditing'),
modalSelection = d3.select(null);
var dispatch = d3_dispatch('done', 'startEditing'),
modalSelection = d3_select(null);
var chapter = {
@@ -33,7 +38,7 @@ export function uiIntroStartEditing(context, reveal) {
}
function showSave() {
d3.selectAll('.shaded').remove(); // in case user opened keyboard shortcuts
d3_selectAll('.shaded').remove(); // in case user opened keyboard shortcuts
reveal('#bar button.save',
t('intro.startediting.save'), {
buttonText: t('intro.ok'),
@@ -43,7 +48,7 @@ export function uiIntroStartEditing(context, reveal) {
}
function showStart() {
d3.selectAll('.shaded').remove(); // in case user opened keyboard shortcuts
d3_selectAll('.shaded').remove(); // in case user opened keyboard shortcuts
modalSelection = uiModal(context.container());
@@ -81,7 +86,7 @@ export function uiIntroStartEditing(context, reveal) {
chapter.exit = function() {
modalSelection.remove();
d3.selectAll('.shaded').remove(); // in case user opened keyboard shortcuts
d3_selectAll('.shaded').remove(); // in case user opened keyboard shortcuts
};
modules/ui/intro/welcome.js
+29 -24
View File
@@ -1,10 +1,15 @@
import * as d3 from 'd3';
import { dispatch as d3_dispatch } from 'd3-dispatch';
import {
event as d3_event,
select as d3_select
} from 'd3-selection';
import { t } from '../../util/locale';
import { utilRebind } from '../../util/rebind';
export function uiIntroWelcome(context, reveal) {
var dispatch = d3.dispatch('done'),
var dispatch = d3_dispatch('done'),
listener = clickListener();
var chapter = {
@@ -66,7 +71,7 @@ export function uiIntroWelcome(context, reveal) {
listener.on('click', function(which) {
if (which === 'left') {
d3.select('.curtain-tooltip.intro-mouse .counter')
d3_select('.curtain-tooltip.intro-mouse .counter')
.text(String(++counter));
if (counter === times) {
@@ -107,7 +112,7 @@ export function uiIntroWelcome(context, reveal) {
listener.on('click', function(which) {
if (which === 'right') {
d3.select('.curtain-tooltip.intro-mouse .counter')
d3_select('.curtain-tooltip.intro-mouse .counter')
.text(String(++counter));
if (counter === times) {
@@ -155,9 +160,9 @@ export function uiIntroWelcome(context, reveal) {
function clickListener() {
var dispatch = d3.dispatch('click'),
var dispatch = d3_dispatch('click'),
minTime = 120,
tooltip = d3.select(null),
tooltip = d3_select(null),
down = {};
// `down` keeps track of which buttons/keys are down.
@@ -166,20 +171,20 @@ function clickListener() {
// on Windows a contextmenu event happens after keyup/mouseup
function keydown() {
if (d3.event.keyCode === 93) { // context menu
d3.event.preventDefault();
d3.event.stopPropagation();
down.menu = d3.event.timeStamp;
if (d3_event.keyCode === 93) { // context menu
d3_event.preventDefault();
d3_event.stopPropagation();
down.menu = d3_event.timeStamp;
tooltip.classed('rightclick', true);
}
}
function keyup() {
if (d3.event.keyCode === 93) { // context menu
d3.event.preventDefault();
d3.event.stopPropagation();
var endTime = d3.event.timeStamp,
if (d3_event.keyCode === 93) { // context menu
d3_event.preventDefault();
d3_event.stopPropagation();
var endTime = d3_event.timeStamp,
startTime = down.menu || endTime,
delay = (endTime - startTime < minTime) ? minTime : 0;
@@ -194,23 +199,23 @@ function clickListener() {
function mousedown() {
var button = d3.event.button;
if (button === 0 && !d3.event.ctrlKey) {
var button = d3_event.button;
if (button === 0 && !d3_event.ctrlKey) {
tooltip.classed('leftclick', true);
} else if (button === 2) {
tooltip.classed('rightclick', true);
}
down[button] = d3.event.timeStamp;
down[button] = d3_event.timeStamp;
}
function mouseup() {
var button = d3.event.button,
endTime = d3.event.timeStamp,
var button = d3_event.button,
endTime = d3_event.timeStamp,
startTime = down[button] || endTime,
delay = (endTime - startTime < minTime) ? minTime : 0;
if (button === 0 && !d3.event.ctrlKey) {
if (button === 0 && !d3_event.ctrlKey) {
window.setTimeout(function() {
tooltip.classed('leftclick', false);
down[button] = undefined; // delayed, for Windows
@@ -235,8 +240,8 @@ function clickListener() {
function contextmenu() {
d3.event.preventDefault();
d3.event.stopPropagation();
d3_event.preventDefault();
d3_event.stopPropagation();
if (!down[2] && !down.menu) {
tooltip.classed('rightclick', true);
window.setTimeout(function() {
@@ -251,7 +256,7 @@ function clickListener() {
tooltip = selection;
down = {};
d3.select(window)
d3_select(window)
.on('keydown.intro', keydown)
.on('keyup.intro', keyup)
.on('mousedown.intro', mousedown)
@@ -261,7 +266,7 @@ function clickListener() {
behavior.off = function() {
d3.select(window)
d3_select(window)
.on('keydown.intro', null)
.on('keyup.intro', null)
.on('mousedown.intro', null)