diff --git a/modules/util/curtain.js b/modules/ui/curtain.js similarity index 94% rename from modules/util/curtain.js rename to modules/ui/curtain.js index a3edcae05..b6155266f 100644 --- a/modules/util/curtain.js +++ b/modules/ui/curtain.js @@ -1,14 +1,12 @@ import * as d3 from 'd3'; -import { utilGetDimensions } from './dimensions'; -import { utilRebind } from './rebind'; -import { uiToggle } from '../ui/toggle'; +import { utilGetDimensions } from '../util/dimensions'; +import { uiToggle } from './toggle'; // Tooltips and svg mask used to highlight certain features -export function d3curtain() { +export function uiCurtain() { - var dispatch = d3.dispatch(), - surface = d3.select(null), + var surface = d3.select(null), tooltip = d3.select(null), darkness = d3.select(null); @@ -145,8 +143,9 @@ export function d3curtain() { curtain.remove = function() { surface.remove(); tooltip.remove(); + d3.select(window).on('resize.curtain', null); }; - return utilRebind(curtain, dispatch, 'on'); + return curtain; } diff --git a/modules/ui/index.js b/modules/ui/index.js index 9ad44eb4f..76dd5fd31 100644 --- a/modules/ui/index.js +++ b/modules/ui/index.js @@ -7,6 +7,7 @@ export { uiCommit } from './commit'; export { uiConfirm } from './confirm'; export { uiConflicts } from './conflicts'; export { uiContributors } from './contributors'; +export { uiCurtain } from './curtain'; export { uiDisclosure } from './disclosure'; export { uiEditMenu } from './edit_menu'; export { uiEntityEditor } from './entity_editor'; diff --git a/modules/ui/intro/intro.js b/modules/ui/intro/intro.js index 06a15cf57..2203d7ea9 100644 --- a/modules/ui/intro/intro.js +++ b/modules/ui/intro/intro.js @@ -1,10 +1,10 @@ import * as d3 from 'd3'; import { t } from '../../util/locale'; import { coreGraph } from '../../core/graph'; -import { modeBrowse } from '../../modes/index'; +import { modeBrowse } from '../../modes/browse'; import { osmEntity } from '../../osm/entity'; -import { d3curtain } from '../../util/curtain'; import { dataIntroGraph } from '../../../data/intro_graph.json'; +import { uiCurtain } from '../curtain'; import { uiIntroNavigation } from './navigation'; import { uiIntroPoint } from './point'; @@ -104,25 +104,14 @@ export function uiIntro(context) { // Load semi-real data used in intro context.connection().toggle(false).reset(); context.history().reset(); - context.history().merge(d3.values(coreGraph().load(introGraph).entities)); context.background().bing(); d3.selectAll('#map .layer-background').style('opacity', 1); - var curtain = d3curtain(); + var curtain = uiCurtain(); selection.call(curtain); - - function reveal(box, text, options) { - options = options || {}; - curtain.reveal(box, - text || '', - options.tooltipClass || '', - options.duration - ); - } - var steps = ['navigation', 'point', 'area', 'line', 'startEditing'].map(function(step, i) { var s = sampleIntros[step](context, reveal) .on('done', function() { @@ -175,6 +164,16 @@ export function uiIntro(context) { enter(steps[0]); + function reveal(box, text, options) { + options = options || {}; + curtain.reveal(box, + text || '', + options.tooltipClass || '', + options.duration + ); + } + + function enter(newStep) { if (step) { step.exit(); }