Merge pull request #3167 from openstreetmap/3118-ui

Modularize iD.ui
This commit is contained in:
Tom MacWright
2016-06-17 11:48:54 -04:00
committed by GitHub
76 changed files with 9075 additions and 400 deletions
+21 -66
View File
@@ -52,7 +52,12 @@ MODULE_TARGETS = \
js/lib/id/presets.js \
js/lib/id/renderer.js \
js/lib/id/services.js \
js/lib/id/ui/intro.js \
js/lib/id/svg.js \
js/lib/id/ui/index.js \
js/lib/id/ui/core.js \
js/lib/id/ui/intro.js \
js/lib/id/ui/preset.js \
js/lib/id/util.js \
js/lib/id/validations.js
@@ -96,6 +101,22 @@ js/lib/id/svg.js: $(shell find modules/svg -type f)
@rm -f $@
node_modules/.bin/rollup -f umd -n iD.svg modules/svg/index.js --no-strict -o $@
js/lib/id/ui/index.js: $(shell find modules/ui -type f)
@rm -f $@
node_modules/.bin/rollup -f umd -n iD modules/ui/ui.js --no-strict -o $@
js/lib/id/ui/core.js: $(shell find modules/ui/core -type f)
@rm -f $@
node_modules/.bin/rollup -f umd -n iD.ui modules/ui/core/index.js --no-strict -o $@
js/lib/id/ui/intro.js: $(shell find modules/ui/intro -type f)
@rm -f $@
node_modules/.bin/rollup -f umd -n iD.ui.intro modules/ui/intro/index.js --no-strict -o $@
js/lib/id/ui/preset.js: $(shell find modules/ui/preset -type f)
@rm -f $@
node_modules/.bin/rollup -f umd -n iD.ui.preset modules/ui/preset/index.js --no-strict -o $@
js/lib/id/util.js: $(shell find modules/util -type f)
@rm -f $@
node_modules/.bin/rollup -f umd -n iD.util modules/util/index.js --no-strict -o $@
@@ -127,72 +148,6 @@ dist/iD.js: \
js/id/start.js \
js/id/id.js \
$(MODULE_TARGETS) \
js/id/ui.js \
js/id/ui/account.js \
js/id/ui/attribution.js \
js/id/ui/background.js \
js/id/ui/cmd.js \
js/id/ui/commit.js \
js/id/ui/confirm.js \
js/id/ui/conflicts.js \
js/id/ui/contributors.js \
js/id/ui/disclosure.js \
js/id/ui/entity_editor.js \
js/id/ui/feature_info.js \
js/id/ui/feature_list.js \
js/id/ui/flash.js \
js/id/ui/full_screen.js \
js/id/ui/geolocate.js \
js/id/ui/help.js \
js/id/ui/info.js \
js/id/ui/inspector.js \
js/id/ui/intro.js \
js/id/ui/lasso.js \
js/id/ui/loading.js \
js/id/ui/map_data.js \
js/id/ui/map_in_map.js \
js/id/ui/modal.js \
js/id/ui/modes.js \
js/id/ui/notice.js \
js/id/ui/preset_icon.js \
js/id/ui/preset.js \
js/id/ui/preset_list.js \
js/id/ui/radial_menu.js \
js/id/ui/raw_member_editor.js \
js/id/ui/raw_membership_editor.js \
js/id/ui/raw_tag_editor.js \
js/id/ui/restore.js \
js/id/ui/save.js \
js/id/ui/scale.js \
js/id/ui/selection_list.js \
js/id/ui/sidebar.js \
js/id/ui/source_switch.js \
js/id/ui/spinner.js \
js/id/ui/splash.js \
js/id/ui/status.js \
js/id/ui/success.js \
js/id/ui/tag_reference.js \
js/id/ui/toggle.js \
js/id/ui/undo_redo.js \
js/id/ui/view_on_osm.js \
js/id/ui/zoom.js \
js/id/ui/preset/access.js \
js/id/ui/preset/address.js \
js/id/ui/preset/check.js \
js/id/ui/preset/combo.js \
js/id/ui/preset/cycleway.js \
js/id/ui/preset/input.js \
js/id/ui/preset/localized.js \
js/id/ui/preset/maxspeed.js \
js/id/ui/preset/radio.js \
js/id/ui/preset/restrictions.js \
js/id/ui/preset/textarea.js \
js/id/ui/preset/wikipedia.js \
js/id/ui/intro/area.js \
js/id/ui/intro/line.js \
js/id/ui/intro/navigation.js \
js/id/ui/intro/point.js \
js/id/ui/intro/start_editing.js \
js/id/end.js \
js/lib/locale.js \
data/introGraph.js
+6 -69
View File
@@ -45,79 +45,16 @@
<script src='js/lib/id/services.js'></script>
<script src='js/lib/id/svg.js'></script>
<script src='js/lib/id/util.js'></script>
<script src='js/lib/id/ui/index.js'></script>
<script src='js/lib/id/ui/core.js'></script>
<script src='js/lib/id/ui/intro.js'></script>
<script src='js/lib/id/ui/preset.js'></script>
<script src='js/lib/id/validations.js'></script>
<script src='data/data_dev.js'></script>
<script src='js/id/ui.js'></script>
<script src='js/id/ui/intro.js'></script>
<script src='js/id/ui/info.js'></script>
<script src='js/id/ui/attribution.js'></script>
<script src='js/id/ui/radial_menu.js'></script>
<script src='js/id/ui/inspector.js'></script>
<script src='js/id/ui/modal.js'></script>
<script src='js/id/ui/cmd.js'></script>
<script src='js/id/ui/confirm.js'></script>
<script src='js/id/ui/conflicts.js'></script>
<script src='js/id/ui/commit.js'></script>
<script src='js/id/ui/success.js'></script>
<script src='js/id/ui/loading.js'></script>
<script src='js/id/ui/account.js'></script>
<script src='js/id/ui/background.js'></script>
<script src='js/id/ui/map_data.js'></script>
<script src='js/id/ui/map_in_map.js'></script>
<script src='js/id/ui/modes.js'></script>
<script src='js/id/ui/contributors.js'></script>
<script src='js/id/ui/help.js'></script>
<script src='js/id/ui/geolocate.js'></script>
<script src='js/id/ui/notice.js'></script>
<script src='js/id/ui/flash.js'></script>
<script src='js/id/ui/feature_info.js'></script>
<script src='js/id/ui/save.js'></script>
<script src='js/id/ui/full_screen.js'></script>
<script src='js/id/ui/scale.js'></script>
<script src='js/id/ui/splash.js'></script>
<script src='js/id/ui/spinner.js'></script>
<script src='js/id/ui/restore.js'></script>
<script src='js/id/ui/tag_reference.js'></script>
<script src='js/id/ui/preset.js'></script>
<script src='js/id/ui/preset_icon.js'></script>
<script src='js/id/ui/lasso.js'></script>
<script src='js/id/ui/source_switch.js'></script>
<script src='js/id/ui/status.js'></script>
<script src='js/id/ui/toggle.js'></script>
<script src='js/id/ui/undo_redo.js'></script>
<script src='js/id/ui/view_on_osm.js'></script>
<script src='js/id/ui/zoom.js'></script>
<script src='js/id/ui/raw_tag_editor.js'></script>
<script src='js/id/ui/raw_member_editor.js'></script>
<script src='js/id/ui/raw_membership_editor.js'></script>
<script src='js/id/ui/feature_list.js'></script>
<script src='js/id/ui/selection_list.js'></script>
<script src='js/id/ui/preset_list.js'></script>
<script src='js/id/ui/entity_editor.js'></script>
<script src='js/id/ui/disclosure.js'></script>
<script src='js/id/ui/sidebar.js'></script>
<script src='js/id/ui/preset/access.js'></script>
<script src='js/id/ui/preset/address.js'></script>
<script src='js/id/ui/preset/check.js'></script>
<script src='js/id/ui/preset/combo.js'></script>
<script src='js/id/ui/preset/cycleway.js'></script>
<script src='js/id/ui/preset/input.js'></script>
<script src='js/id/ui/preset/localized.js'></script>
<script src='js/id/ui/preset/maxspeed.js'></script>
<script src='js/id/ui/preset/radio.js'></script>
<script src='js/id/ui/preset/restrictions.js'></script>
<script src='js/id/ui/preset/textarea.js'></script>
<script src='js/id/ui/preset/wikipedia.js'></script>
<script src='js/id/ui/intro/navigation.js'></script>
<script src='js/id/ui/intro/point.js'></script>
<script src='js/id/ui/intro/area.js'></script>
<script src='js/id/ui/intro/line.js'></script>
<script src='js/id/ui/intro/start_editing.js'></script>
<script src='js/lib/locale.js'></script>
<script src='data/introGraph.js'></script>
</head>
+6005
View File
File diff suppressed because it is too large Load Diff
+251
View File
@@ -0,0 +1,251 @@
(function (global, factory) {
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports) :
typeof define === 'function' && define.amd ? define(['exports'], factory) :
(factory((global.iD = global.iD || {})));
}(this, function (exports) { 'use strict';
function ui(context) {
function render(container) {
var map = context.map();
if (iD.detect().opera) container.classed('opera', true);
var hash = iD.behavior.Hash(context);
hash();
if (!hash.hadHash) {
map.centerZoom([0, 0], 2);
}
container.append('svg')
.attr('id', 'defs')
.call(iD.svg.Defs(context));
container.append('div')
.attr('id', 'sidebar')
.attr('class', 'col4')
.call(ui.sidebar);
var content = container.append('div')
.attr('id', 'content');
var bar = content.append('div')
.attr('id', 'bar')
.attr('class', 'fillD');
content.append('div')
.attr('id', 'map')
.call(map);
content
.call(iD.ui.MapInMap(context));
content.append('div')
.call(iD.ui.Info(context));
bar.append('div')
.attr('class', 'spacer col4');
var limiter = bar.append('div')
.attr('class', 'limiter');
limiter.append('div')
.attr('class', 'button-wrap joined col3')
.call(iD.ui.Modes(context), limiter);
limiter.append('div')
.attr('class', 'button-wrap joined col1')
.call(iD.ui.UndoRedo(context));
limiter.append('div')
.attr('class', 'button-wrap col1')
.call(iD.ui.Save(context));
bar.append('div')
.attr('class', 'full-screen')
.call(iD.ui.FullScreen(context));
bar.append('div')
.attr('class', 'spinner')
.call(iD.ui.Spinner(context));
var controls = bar.append('div')
.attr('class', 'map-controls');
controls.append('div')
.attr('class', 'map-control zoombuttons')
.call(iD.ui.Zoom(context));
controls.append('div')
.attr('class', 'map-control geolocate-control')
.call(iD.ui.Geolocate(context));
controls.append('div')
.attr('class', 'map-control background-control')
.call(iD.ui.Background(context));
controls.append('div')
.attr('class', 'map-control map-data-control')
.call(iD.ui.MapData(context));
controls.append('div')
.attr('class', 'map-control help-control')
.call(iD.ui.Help(context));
var about = content.append('div')
.attr('id', 'about');
about.append('div')
.attr('id', 'attrib')
.call(iD.ui.Attribution(context));
var footer = about.append('div')
.attr('id', 'footer')
.attr('class', 'fillD');
footer.append('div')
.attr('class', 'api-status')
.call(iD.ui.Status(context));
footer.append('div')
.attr('id', 'scale-block')
.call(iD.ui.Scale(context));
var aboutList = footer.append('div')
.attr('id', 'info-block')
.append('ul')
.attr('id', 'about-list');
if (!context.embed()) {
aboutList.call(iD.ui.Account(context));
}
aboutList.append('li')
.append('a')
.attr('target', '_blank')
.attr('tabindex', -1)
.attr('href', 'https://github.com/openstreetmap/iD')
.text(iD.version);
var issueLinks = aboutList.append('li');
issueLinks.append('a')
.attr('target', '_blank')
.attr('tabindex', -1)
.attr('href', 'https://github.com/openstreetmap/iD/issues')
.call(iD.svg.Icon('#icon-bug', 'light'))
.call(bootstrap.tooltip()
.title(t('report_a_bug'))
.placement('top')
);
issueLinks.append('a')
.attr('target', '_blank')
.attr('tabindex', -1)
.attr('href', 'https://github.com/openstreetmap/iD/blob/master/CONTRIBUTING.md#translating')
.call(iD.svg.Icon('#icon-translate', 'light'))
.call(bootstrap.tooltip()
.title(t('help_translate'))
.placement('top')
);
aboutList.append('li')
.attr('class', 'feature-warning')
.attr('tabindex', -1)
.call(iD.ui.FeatureInfo(context));
aboutList.append('li')
.attr('class', 'user-list')
.attr('tabindex', -1)
.call(iD.ui.Contributors(context));
window.onbeforeunload = function() {
return context.save();
};
window.onunload = function() {
context.history().unlock();
};
var mapDimensions = map.dimensions();
d3.select(window).on('resize.editor', function() {
mapDimensions = content.dimensions(null);
map.dimensions(mapDimensions);
});
function pan(d) {
return function() {
d3.event.preventDefault();
if (!context.inIntro()) context.pan(d);
};
}
// pan amount
var pa = 10;
var keybinding = d3.keybinding('main')
.on('⌫', function() { d3.event.preventDefault(); })
.on('←', pan([pa, 0]))
.on('↑', pan([0, pa]))
.on('→', pan([-pa, 0]))
.on('↓', pan([0, -pa]))
.on('⇧←', pan([mapDimensions[0], 0]))
.on('⇧↑', pan([0, mapDimensions[1]]))
.on('⇧→', pan([-mapDimensions[0], 0]))
.on('⇧↓', pan([0, -mapDimensions[1]]))
.on(iD.ui.cmd('⌘←'), pan([mapDimensions[0], 0]))
.on(iD.ui.cmd('⌘↑'), pan([0, mapDimensions[1]]))
.on(iD.ui.cmd('⌘→'), pan([-mapDimensions[0], 0]))
.on(iD.ui.cmd('⌘↓'), pan([0, -mapDimensions[1]]));
d3.select(document)
.call(keybinding);
context.enter(iD.modes.Browse(context));
context.container()
.call(iD.ui.Splash(context))
.call(iD.ui.Restore(context));
var authenticating = iD.ui.Loading(context)
.message(t('loading_auth'));
context.connection()
.on('authenticating.ui', function() {
context.container()
.call(authenticating);
})
.on('authenticated.ui', function() {
authenticating.close();
});
}
function ui(container) {
context.container(container);
context.loadLocale(function() {
render(container);
});
}
ui.sidebar = iD.ui.Sidebar(context);
return ui;
}
ui.tooltipHtml = function(text, key) {
var s = '<span>' + text + '</span>';
if (key) {
s += '<div class="keyhint-wrap">' +
'<span> ' + (t('tooltip_keyhint')) + ' </span>' +
'<span class="keyhint"> ' + key + '</span></div>';
}
return s;
};
exports.ui = ui;
Object.defineProperty(exports, '__esModule', { value: true });
}));
+619
View File
@@ -0,0 +1,619 @@
(function (global, factory) {
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports) :
typeof define === 'function' && define.amd ? define(['exports'], factory) :
(factory((global.iD = global.iD || {}, global.iD.ui = global.iD.ui || {}, global.iD.ui.intro = global.iD.ui.intro || {})));
}(this, function (exports) { 'use strict';
function area(context, reveal) {
var event = d3.dispatch('done'),
timeout;
var step = {
title: 'intro.areas.title'
};
step.enter = function() {
var playground = [-85.63552, 41.94159],
corner = [-85.63565411045074, 41.9417715536927];
context.map().centerZoom(playground, 19);
reveal('button.add-area',
t('intro.areas.add', { button: iD.ui.intro.icon('#icon-area', 'pre-text') }),
{ tooltipClass: 'intro-areas-add' });
context.on('enter.intro', addArea);
function addArea(mode) {
if (mode.id !== 'add-area') return;
context.on('enter.intro', drawArea);
var padding = 120 * Math.pow(2, context.map().zoom() - 19);
var pointBox = iD.ui.intro.pad(corner, padding, context);
reveal(pointBox, t('intro.areas.corner'));
context.map().on('move.intro', function() {
padding = 120 * Math.pow(2, context.map().zoom() - 19);
pointBox = iD.ui.intro.pad(corner, padding, context);
reveal(pointBox, t('intro.areas.corner'), {duration: 0});
});
}
function drawArea(mode) {
if (mode.id !== 'draw-area') return;
context.on('enter.intro', enterSelect);
var padding = 150 * Math.pow(2, context.map().zoom() - 19);
var pointBox = iD.ui.intro.pad(playground, padding, context);
reveal(pointBox, t('intro.areas.place'));
context.map().on('move.intro', function() {
padding = 150 * Math.pow(2, context.map().zoom() - 19);
pointBox = iD.ui.intro.pad(playground, padding, context);
reveal(pointBox, t('intro.areas.place'), {duration: 0});
});
}
function enterSelect(mode) {
if (mode.id !== 'select') return;
context.map().on('move.intro', null);
context.on('enter.intro', null);
timeout = setTimeout(function() {
reveal('.preset-search-input',
t('intro.areas.search',
{ name: context.presets().item('leisure/playground').name() }));
d3.select('.preset-search-input').on('keyup.intro', keySearch);
}, 500);
}
function keySearch() {
var first = d3.select('.preset-list-item:first-child');
if (first.classed('preset-leisure-playground')) {
reveal(first.select('.preset-list-button').node(), t('intro.areas.choose'));
d3.selection.prototype.one.call(context.history(), 'change.intro', selectedPreset);
d3.select('.preset-search-input').on('keyup.intro', null);
}
}
function selectedPreset() {
reveal('.pane',
t('intro.areas.describe', { button: iD.ui.intro.icon('#icon-apply', 'pre-text') }));
context.on('exit.intro', event.done);
}
};
step.exit = function() {
window.clearTimeout(timeout);
context.on('enter.intro', null);
context.on('exit.intro', null);
context.history().on('change.intro', null);
context.map().on('move.intro', null);
d3.select('.preset-search-input').on('keyup.intro', null);
};
return d3.rebind(step, event, 'on');
}
function line(context, reveal) {
var event = d3.dispatch('done'),
timeouts = [];
var step = {
title: 'intro.lines.title'
};
function timeout(f, t) {
timeouts.push(window.setTimeout(f, t));
}
function eventCancel() {
d3.event.stopPropagation();
d3.event.preventDefault();
}
step.enter = function() {
var centroid = [-85.62830, 41.95699];
var midpoint = [-85.62975395449628, 41.95787501510204];
var start = [-85.6297754121684, 41.95805253325314];
var intersection = [-85.62974496187628, 41.95742515554585];
context.map().centerZoom(start, 18);
reveal('button.add-line',
t('intro.lines.add', { button: iD.ui.intro.icon('#icon-line', 'pre-text') }),
{ tooltipClass: 'intro-lines-add' });
context.on('enter.intro', addLine);
function addLine(mode) {
if (mode.id !== 'add-line') return;
context.on('enter.intro', drawLine);
var padding = 150 * Math.pow(2, context.map().zoom() - 18);
var pointBox = iD.ui.intro.pad(start, padding, context);
reveal(pointBox, t('intro.lines.start'));
context.map().on('move.intro', function() {
padding = 150 * Math.pow(2, context.map().zoom() - 18);
pointBox = iD.ui.intro.pad(start, padding, context);
reveal(pointBox, t('intro.lines.start'), {duration: 0});
});
}
function drawLine(mode) {
if (mode.id !== 'draw-line') return;
context.history().on('change.intro', addIntersection);
context.on('enter.intro', retry);
var padding = 300 * Math.pow(2, context.map().zoom() - 19);
var pointBox = iD.ui.intro.pad(midpoint, padding, context);
reveal(pointBox, t('intro.lines.intersect', {name: t('intro.graph.flower_st')}));
context.map().on('move.intro', function() {
padding = 300 * Math.pow(2, context.map().zoom() - 19);
pointBox = iD.ui.intro.pad(midpoint, padding, context);
reveal(pointBox, t('intro.lines.intersect', {name: t('intro.graph.flower_st')}), {duration: 0});
});
}
// ended line before creating intersection
function retry(mode) {
if (mode.id !== 'select') return;
var pointBox = iD.ui.intro.pad(intersection, 30, context),
ids = mode.selectedIDs();
reveal(pointBox, t('intro.lines.restart', {name: t('intro.graph.flower_st')}));
d3.select(window).on('mousedown.intro', eventCancel, true);
timeout(function() {
context.replace(iD.actions.DeleteMultiple(ids));
step.exit();
step.enter();
}, 3000);
}
function addIntersection(changes) {
if ( _.some(changes.created(), function(d) {
return d.type === 'node' && context.graph().parentWays(d).length > 1;
})) {
context.history().on('change.intro', null);
context.on('enter.intro', enterSelect);
var padding = 900 * Math.pow(2, context.map().zoom() - 19);
var pointBox = iD.ui.intro.pad(centroid, padding, context);
reveal(pointBox, t('intro.lines.finish'));
context.map().on('move.intro', function() {
padding = 900 * Math.pow(2, context.map().zoom() - 19);
pointBox = iD.ui.intro.pad(centroid, padding, context);
reveal(pointBox, t('intro.lines.finish'), {duration: 0});
});
}
}
function enterSelect(mode) {
if (mode.id !== 'select') return;
context.map().on('move.intro', null);
context.on('enter.intro', null);
d3.select('#curtain').style('pointer-events', 'all');
presetCategory();
}
function presetCategory() {
timeout(function() {
d3.select('#curtain').style('pointer-events', 'none');
var road = d3.select('.preset-category-road .preset-list-button');
reveal(road.node(), t('intro.lines.road'));
road.one('click.intro', roadCategory);
}, 500);
}
function roadCategory() {
timeout(function() {
var grid = d3.select('.subgrid');
reveal(grid.node(), t('intro.lines.residential'));
grid.selectAll(':not(.preset-highway-residential) .preset-list-button')
.one('click.intro', retryPreset);
grid.selectAll('.preset-highway-residential .preset-list-button')
.one('click.intro', roadDetails);
}, 500);
}
// selected wrong road type
function retryPreset() {
timeout(function() {
var preset = d3.select('.entity-editor-pane .preset-list-button');
reveal(preset.node(), t('intro.lines.wrong_preset'));
preset.one('click.intro', presetCategory);
}, 500);
}
function roadDetails() {
reveal('.pane',
t('intro.lines.describe', { button: iD.ui.intro.icon('#icon-apply', 'pre-text') }));
context.on('exit.intro', event.done);
}
};
step.exit = function() {
d3.select(window).on('mousedown.intro', null, true);
d3.select('#curtain').style('pointer-events', 'none');
timeouts.forEach(window.clearTimeout);
context.on('enter.intro', null);
context.on('exit.intro', null);
context.map().on('move.intro', null);
context.history().on('change.intro', null);
};
return d3.rebind(step, event, 'on');
}
function pointBox(point, context) {
var rect = context.surfaceRect();
point = context.projection(point);
return {
left: point[0] + rect.left - 30,
top: point[1] + rect.top - 50,
width: 60,
height: 70
};
}
function pad(box, padding, context) {
if (box instanceof Array) {
var rect = context.surfaceRect();
box = context.projection(box);
box = {
left: box[0] + rect.left,
top: box[1] + rect.top
};
}
return {
left: box.left - padding,
top: box.top - padding,
width: (box.width || 0) + 2 * padding,
height: (box.width || 0) + 2 * padding
};
}
function icon(name, svgklass) {
return '<svg class="icon ' + (svgklass || '') + '">' +
'<use xlink:href="' + name + '"></use></svg>';
}
function navigation(context, reveal) {
var event = d3.dispatch('done'),
timeouts = [];
var step = {
title: 'intro.navigation.title'
};
function set(f, t) {
timeouts.push(window.setTimeout(f, t));
}
function eventCancel() {
d3.event.stopPropagation();
d3.event.preventDefault();
}
step.enter = function() {
var rect = context.surfaceRect(),
map = {
left: rect.left + 10,
top: rect.top + 70,
width: rect.width - 70,
height: rect.height - 170
};
context.map().centerZoom([-85.63591, 41.94285], 19);
reveal(map, t('intro.navigation.drag'));
context.map().on('move.intro', _.debounce(function() {
context.map().on('move.intro', null);
townhall();
context.on('enter.intro', inspectTownHall);
}, 400));
function townhall() {
var hall = [-85.63645945147184, 41.942986488012565];
var point = context.projection(hall);
if (point[0] < 0 || point[0] > rect.width ||
point[1] < 0 || point[1] > rect.height) {
context.map().center(hall);
}
var box = iD.ui.intro.pointBox(hall, context);
reveal(box, t('intro.navigation.select'));
context.map().on('move.intro', function() {
var box = iD.ui.intro.pointBox(hall, context);
reveal(box, t('intro.navigation.select'), {duration: 0});
});
}
function inspectTownHall(mode) {
if (mode.id !== 'select') return;
context.on('enter.intro', null);
context.map().on('move.intro', null);
set(function() {
reveal('.entity-editor-pane',
t('intro.navigation.pane', { button: iD.ui.intro.icon('#icon-close', 'pre-text') }));
context.on('exit.intro', streetSearch);
}, 700);
}
function streetSearch() {
context.on('exit.intro', null);
reveal('.search-header input',
t('intro.navigation.search', { name: t('intro.graph.spring_st') }));
d3.select('.search-header input').on('keyup.intro', searchResult);
}
function searchResult() {
var first = d3.select('.feature-list-item:nth-child(0n+2)'), // skip No Results item
firstName = first.select('.entity-name'),
name = t('intro.graph.spring_st');
if (!firstName.empty() && firstName.text() === name) {
reveal(first.node(), t('intro.navigation.choose', { name: name }));
context.on('exit.intro', selectedStreet);
d3.select('.search-header input')
.on('keydown.intro', eventCancel, true)
.on('keyup.intro', null);
}
}
function selectedStreet() {
var springSt = [-85.63585099140167, 41.942506848938926];
context.map().center(springSt);
context.on('exit.intro', event.done);
set(function() {
reveal('.entity-editor-pane',
t('intro.navigation.chosen', {
name: t('intro.graph.spring_st'),
button: iD.ui.intro.icon('#icon-close', 'pre-text')
}));
}, 400);
}
};
step.exit = function() {
timeouts.forEach(window.clearTimeout);
context.map().on('move.intro', null);
context.on('enter.intro', null);
context.on('exit.intro', null);
d3.select('.search-header input')
.on('keydown.intro', null)
.on('keyup.intro', null);
};
return d3.rebind(step, event, 'on');
}
function point(context, reveal) {
var event = d3.dispatch('done'),
timeouts = [];
var step = {
title: 'intro.points.title'
};
function setTimeout(f, t) {
timeouts.push(window.setTimeout(f, t));
}
function eventCancel() {
d3.event.stopPropagation();
d3.event.preventDefault();
}
step.enter = function() {
context.map().centerZoom([-85.63279, 41.94394], 19);
reveal('button.add-point',
t('intro.points.add', { button: iD.ui.intro.icon('#icon-point', 'pre-text') }),
{ tooltipClass: 'intro-points-add' });
var corner = [-85.632481,41.944094];
context.on('enter.intro', addPoint);
function addPoint(mode) {
if (mode.id !== 'add-point') return;
context.on('enter.intro', enterSelect);
var pointBox = iD.ui.intro.pad(corner, 150, context);
reveal(pointBox, t('intro.points.place'));
context.map().on('move.intro', function() {
pointBox = iD.ui.intro.pad(corner, 150, context);
reveal(pointBox, t('intro.points.place'), {duration: 0});
});
}
function enterSelect(mode) {
if (mode.id !== 'select') return;
context.map().on('move.intro', null);
context.on('enter.intro', null);
setTimeout(function() {
reveal('.preset-search-input',
t('intro.points.search', {name: context.presets().item('amenity/cafe').name()}));
d3.select('.preset-search-input').on('keyup.intro', keySearch);
}, 500);
}
function keySearch() {
var first = d3.select('.preset-list-item:first-child');
if (first.classed('preset-amenity-cafe')) {
reveal(first.select('.preset-list-button').node(), t('intro.points.choose'));
d3.selection.prototype.one.call(context.history(), 'change.intro', selectedPreset);
d3.select('.preset-search-input')
.on('keydown.intro', eventCancel, true)
.on('keyup.intro', null);
}
}
function selectedPreset() {
setTimeout(function() {
reveal('.entity-editor-pane', t('intro.points.describe'), {tooltipClass: 'intro-points-describe'});
context.history().on('change.intro', closeEditor);
context.on('exit.intro', selectPoint);
}, 400);
}
function closeEditor() {
d3.select('.preset-search-input').on('keydown.intro', null);
context.history().on('change.intro', null);
reveal('.entity-editor-pane',
t('intro.points.close', { button: iD.ui.intro.icon('#icon-apply', 'pre-text') }));
}
function selectPoint() {
context.on('exit.intro', null);
context.history().on('change.intro', null);
context.on('enter.intro', enterReselect);
var pointBox = iD.ui.intro.pad(corner, 150, context);
reveal(pointBox, t('intro.points.reselect'));
context.map().on('move.intro', function() {
pointBox = iD.ui.intro.pad(corner, 150, context);
reveal(pointBox, t('intro.points.reselect'), {duration: 0});
});
}
function enterReselect(mode) {
if (mode.id !== 'select') return;
context.map().on('move.intro', null);
context.on('enter.intro', null);
setTimeout(function() {
reveal('.entity-editor-pane',
t('intro.points.fixname', { button: iD.ui.intro.icon('#icon-apply', 'pre-text') }));
context.on('exit.intro', deletePoint);
}, 500);
}
function deletePoint() {
context.on('exit.intro', null);
context.on('enter.intro', enterDelete);
var pointBox = iD.ui.intro.pad(corner, 150, context);
reveal(pointBox, t('intro.points.reselect_delete'));
context.map().on('move.intro', function() {
pointBox = iD.ui.intro.pad(corner, 150, context);
reveal(pointBox, t('intro.points.reselect_delete'), {duration: 0});
});
}
function enterDelete(mode) {
if (mode.id !== 'select') return;
context.map().on('move.intro', null);
context.on('enter.intro', null);
context.on('exit.intro', deletePoint);
context.map().on('move.intro', deletePoint);
context.history().on('change.intro', deleted);
setTimeout(function() {
var node = d3.select('.radial-menu-item-delete').node();
var pointBox = iD.ui.intro.pad(node.getBoundingClientRect(), 50, context);
reveal(pointBox,
t('intro.points.delete', { button: iD.ui.intro.icon('#operation-delete', 'pre-text') }));
}, 300);
}
function deleted(changed) {
if (changed.deleted().length) event.done();
}
};
step.exit = function() {
timeouts.forEach(window.clearTimeout);
context.on('exit.intro', null);
context.on('enter.intro', null);
context.map().on('move.intro', null);
context.history().on('change.intro', null);
d3.select('.preset-search-input')
.on('keyup.intro', null)
.on('keydown.intro', null);
};
return d3.rebind(step, event, 'on');
}
function startEditing(context, reveal) {
var event = d3.dispatch('done', 'startEditing'),
modal,
timeouts = [];
var step = {
title: 'intro.startediting.title'
};
function timeout(f, t) {
timeouts.push(window.setTimeout(f, t));
}
step.enter = function() {
reveal('.map-control.help-control',
t('intro.startediting.help', { button: iD.ui.intro.icon('#icon-help', 'pre-text') }));
timeout(function() {
reveal('#bar button.save', t('intro.startediting.save'));
}, 5000);
timeout(function() {
reveal('#surface');
}, 10000);
timeout(function() {
modal = iD.ui.modal(context.container());
modal.select('.modal')
.attr('class', 'modal-splash modal col6');
modal.selectAll('.close').remove();
var startbutton = modal.select('.content')
.attr('class', 'fillL')
.append('button')
.attr('class', 'modal-section huge-modal-button')
.on('click', function() {
modal.remove();
});
startbutton.append('div')
.attr('class','illustration');
startbutton.append('h2')
.text(t('intro.startediting.start'));
event.startEditing();
}, 10500);
};
step.exit = function() {
if (modal) modal.remove();
timeouts.forEach(window.clearTimeout);
};
return d3.rebind(step, event, 'on');
}
exports.area = area;
exports.line = line;
exports.pad = pad;
exports.pointBox = pointBox;
exports.icon = icon;
exports.navigation = navigation;
exports.point = point;
exports.startEditing = startEditing;
Object.defineProperty(exports, '__esModule', { value: true });
}));
File diff suppressed because it is too large Load Diff
@@ -1,4 +1,4 @@
iD.ui.Account = function(context) {
export function Account(context) {
var connection = context.connection();
function update(selection) {
@@ -63,4 +63,4 @@ iD.ui.Account = function(context) {
connection.on('auth.account', function() { update(selection); });
update(selection);
};
};
}
@@ -1,4 +1,4 @@
iD.ui.Attribution = function(context) {
export function Attribution(context) {
var selection;
function attribution(data, klass) {
@@ -77,4 +77,4 @@ iD.ui.Attribution = function(context) {
update();
};
};
}
@@ -1,4 +1,7 @@
iD.ui.Background = function(context) {
import { cmd } from './cmd';
import { MapInMap } from './map_in_map';
export function Background(context) {
var key = 'B',
opacities = [1, 0.75, 0.5, 0.25],
directions = [
@@ -405,7 +408,7 @@ iD.ui.Background = function(context) {
.append('input')
.attr('type', 'checkbox')
.on('change', function() {
iD.ui.MapInMap.toggle();
MapInMap.toggle();
d3.event.preventDefault();
});
@@ -477,7 +480,7 @@ iD.ui.Background = function(context) {
var keybinding = d3.keybinding('background')
.on(key, toggle)
.on(iD.ui.cmd('⌘B'), quickSwitch)
.on(cmd('⌘B'), quickSwitch)
.on('F', hide)
.on('H', hide);
@@ -489,4 +492,4 @@ iD.ui.Background = function(context) {
}
return background;
};
}
+2 -2
View File
@@ -1,6 +1,6 @@
// Translate a MacOS key command into the appropriate Windows/Linux equivalent.
// For example, ⌘Z -> Ctrl+Z
iD.ui.cmd = function(code) {
export function cmd(code) {
if (iD.detect().os === 'mac') {
return code;
}
@@ -27,4 +27,4 @@ iD.ui.cmd = function(code) {
}
return result;
};
}
@@ -1,4 +1,4 @@
iD.ui.Commit = function(context) {
export function Commit(context) {
var dispatch = d3.dispatch('cancel', 'save');
function commit(selection) {
@@ -275,4 +275,4 @@ iD.ui.Commit = function(context) {
}
return d3.rebind(commit, dispatch, 'on');
};
}
@@ -1,5 +1,7 @@
iD.ui.confirm = function(selection) {
var modal = iD.ui.modal(selection);
import { modal as modalModule } from './modal';
export function confirm(selection) {
var modal = modalModule(selection);
modal.select('.modal')
.classed('modal-alert', true);
@@ -28,4 +30,4 @@ iD.ui.confirm = function(selection) {
};
return modal;
};
}
@@ -1,4 +1,4 @@
iD.ui.Conflicts = function(context) {
export function Conflicts(context) {
var dispatch = d3.dispatch('download', 'cancel', 'save'),
list;
@@ -247,4 +247,4 @@ iD.ui.Conflicts = function(context) {
};
return d3.rebind(conflicts, dispatch, 'on');
};
}
@@ -1,4 +1,4 @@
iD.ui.Contributors = function(context) {
export function Contributors(context) {
var debouncedUpdate = _.debounce(function() { update(); }, 1000),
limit = 4,
hidden = false,
@@ -69,4 +69,4 @@ iD.ui.Contributors = function(context) {
context.connection().on('loaded.contributors', debouncedUpdate);
context.map().on('move.contributors', debouncedUpdate);
};
};
}
@@ -1,4 +1,6 @@
iD.ui.Disclosure = function() {
import { Toggle } from './toggle';
export function Disclosure() {
var dispatch = d3.dispatch('toggled'),
title,
expanded = false,
@@ -27,7 +29,7 @@ iD.ui.Disclosure = function() {
function toggle() {
expanded = !expanded;
$link.classed('expanded', expanded);
$body.call(iD.ui.Toggle(expanded));
$body.call(Toggle(expanded));
dispatch.toggled(expanded);
}
};
@@ -51,4 +53,4 @@ iD.ui.Disclosure = function() {
};
return d3.rebind(disclosure, dispatch, 'on');
};
}
@@ -1,4 +1,11 @@
iD.ui.EntityEditor = function(context) {
import { preset as presetModule } from './preset';
import { PresetIcon } from './preset_icon';
import { RawTagEditor } from './raw_tag_editor';
import { RawMemberEditor } from './raw_member_editor';
import { RawMembershipEditor } from './raw_membership_editor';
import { TagReference } from './tag_reference';
export function EntityEditor(context) {
var dispatch = d3.dispatch('choose'),
state = 'select',
coalesceChanges = false,
@@ -8,9 +15,9 @@ iD.ui.EntityEditor = function(context) {
preset,
reference;
var presetEditor = iD.ui.preset(context)
var presetEditor = presetModule(context)
.on('change', changeTags);
var rawTagEditor = iD.ui.RawTagEditor(context)
var rawTagEditor = RawTagEditor(context)
.on('change', changeTags);
function entityEditor(selection) {
@@ -88,7 +95,7 @@ iD.ui.EntityEditor = function(context) {
// Update
$body.select('.preset-list-item button')
.call(iD.ui.PresetIcon()
.call(PresetIcon()
.geometry(context.geometry(id))
.preset(preset));
@@ -112,7 +119,7 @@ iD.ui.EntityEditor = function(context) {
if (entity.type === 'relation') {
$body.select('.raw-member-editor')
.style('display', 'block')
.call(iD.ui.RawMemberEditor(context)
.call(RawMemberEditor(context)
.entityID(id));
} else {
$body.select('.raw-member-editor')
@@ -120,7 +127,7 @@ iD.ui.EntityEditor = function(context) {
}
$body.select('.raw-membership-editor')
.call(iD.ui.RawMembershipEditor(context)
.call(RawMembershipEditor(context)
.entityID(id));
function historyChanged() {
@@ -226,11 +233,11 @@ iD.ui.EntityEditor = function(context) {
if (!arguments.length) return preset;
if (_ !== preset) {
preset = _;
reference = iD.ui.TagReference(preset.reference(context.geometry(id)), context)
reference = TagReference(preset.reference(context.geometry(id)), context)
.showing(false);
}
return entityEditor;
};
return d3.rebind(entityEditor, dispatch, 'on');
};
}
@@ -1,4 +1,4 @@
iD.ui.FeatureInfo = function(context) {
export function FeatureInfo(context) {
function update(selection) {
var features = context.features(),
stats = features.stats(),
@@ -43,4 +43,4 @@ iD.ui.FeatureInfo = function(context) {
update(selection);
});
};
};
}
@@ -1,4 +1,4 @@
iD.ui.FeatureList = function(context) {
export function FeatureList(context) {
var geocodeResults;
function featureList(selection) {
@@ -253,4 +253,4 @@ iD.ui.FeatureList = function(context) {
}
return featureList;
};
}
@@ -1,5 +1,7 @@
iD.ui.flash = function(selection) {
var modal = iD.ui.modal(selection);
import { modal as modalModule } from './modal';
export function flash(selection) {
var modal = modalModule(selection);
modal.select('.modal').classed('modal-flash', true);
@@ -16,4 +18,4 @@ iD.ui.flash = function(selection) {
}, 1500);
return modal;
};
}
@@ -1,4 +1,6 @@
iD.ui.FullScreen = function(context) {
import { cmd } from './cmd';
export function FullScreen(context) {
var element = context.container().node(),
keybinding = d3.keybinding('full-screen');
// button;
@@ -65,9 +67,9 @@ iD.ui.FullScreen = function(context) {
keybinding
.on('f11', fullScreen)
.on(iD.ui.cmd('⌘⇧F'), fullScreen);
.on(cmd('⌘⇧F'), fullScreen);
d3.select(document)
.call(keybinding);
};
};
}
@@ -1,6 +1,8 @@
iD.ui.Geolocate = function(context) {
import { Loading } from './loading';
export function Geolocate(context) {
var geoOptions = { enableHighAccuracy: false, timeout: 6000 /* 6sec */ },
locating = iD.ui.Loading(context).message(t('geolocate.locating')).blocking(true),
locating = Loading(context).message(t('geolocate.locating')).blocking(true),
timeoutId;
function click() {
@@ -43,4 +45,4 @@ iD.ui.Geolocate = function(context) {
.call(bootstrap.tooltip()
.placement('left'));
};
};
}
+5 -3
View File
@@ -1,4 +1,6 @@
iD.ui.Help = function(context) {
import { intro } from './intro';
export function Help(context) {
var key = 'H';
var docKeys = [
@@ -90,7 +92,7 @@ iD.ui.Help = function(context) {
}
function clickWalkthrough() {
d3.select(document.body).call(iD.ui.intro(context));
d3.select(document.body).call(intro(context));
setVisible(false);
}
@@ -153,4 +155,4 @@ iD.ui.Help = function(context) {
}
return help;
};
}
+48
View File
@@ -0,0 +1,48 @@
export { Account } from './account';
export { Attribution } from './attribution';
export { Background } from './background';
export { cmd } from './cmd';
export { Commit } from './commit';
export { confirm } from './confirm';
export { Conflicts } from './conflicts';
export { Contributors } from './contributors';
export { Disclosure } from './disclosure';
export { EntityEditor } from './entity_editor';
export { FeatureInfo } from './feature_info';
export { FeatureList } from './feature_list';
export { flash } from './flash';
export { FullScreen } from './full_screen';
export { Geolocate } from './geolocate';
export { Help } from './help';
export { Info } from './info';
export { Inspector } from './inspector';
export { intro } from './intro';
export { Lasso } from './lasso';
export { Loading } from './loading';
export { MapData } from './map_data';
export { MapInMap } from './map_in_map';
export { modal } from './modal';
export { Modes } from './modes';
export { Notice } from './notice';
export { preset } from './preset';
export { PresetIcon } from './preset_icon';
export { PresetList } from './preset_list';
export { RadialMenu } from './radial_menu';
export { RawMemberEditor } from './raw_member_editor';
export { RawMembershipEditor } from './raw_membership_editor';
export { RawTagEditor } from './raw_tag_editor';
export { Restore } from './restore';
export { Save } from './save';
export { Scale } from './scale';
export { SelectionList } from './selection_list';
export { Sidebar } from './sidebar';
export { SourceSwitch } from './source_switch';
export { Spinner } from './spinner';
export { Splash } from './splash';
export { Status } from './status';
export { Success } from './success';
export { TagReference } from './tag_reference';
export { Toggle } from './toggle';
export { UndoRedo } from './undo_redo';
export { ViewOnOSM } from './view_on_osm';
export { Zoom } from './zoom';
+5 -3
View File
@@ -1,5 +1,7 @@
iD.ui.Info = function(context) {
var key = iD.ui.cmd('⌘I'),
import { cmd } from './cmd';
export function Info(context) {
var key = cmd('⌘I'),
imperial = (iD.detect().locale.toLowerCase() === 'en-us'),
hidden = true;
@@ -228,4 +230,4 @@ iD.ui.Info = function(context) {
}
return info;
};
}
@@ -1,6 +1,10 @@
iD.ui.Inspector = function(context) {
var presetList = iD.ui.PresetList(context),
entityEditor = iD.ui.EntityEditor(context),
import { PresetList } from './preset_list';
import { EntityEditor } from './entity_editor';
import { ViewOnOSM } from './view_on_osm';
export function Inspector(context) {
var presetList = PresetList(context),
entityEditor = EntityEditor(context),
state = 'select',
entityID,
newFeature = false;
@@ -52,7 +56,7 @@ iD.ui.Inspector = function(context) {
.attr('class', 'footer');
selection.select('.footer')
.call(iD.ui.ViewOnOSM(context)
.call(ViewOnOSM(context)
.entityID(entityID));
function showList(preset) {
@@ -93,4 +97,4 @@ iD.ui.Inspector = function(context) {
};
return inspector;
};
}
+2 -35
View File
@@ -1,4 +1,4 @@
iD.ui.intro = function(context) {
export function intro(context) {
var step;
function intro(selection) {
@@ -153,37 +153,4 @@ iD.ui.intro = function(context) {
}
return intro;
};
iD.ui.intro.pointBox = function(point, context) {
var rect = context.surfaceRect();
point = context.projection(point);
return {
left: point[0] + rect.left - 30,
top: point[1] + rect.top - 50,
width: 60,
height: 70
};
};
iD.ui.intro.pad = function(box, padding, context) {
if (box instanceof Array) {
var rect = context.surfaceRect();
box = context.projection(box);
box = {
left: box[0] + rect.left,
top: box[1] + rect.top
};
}
return {
left: box.left - padding,
top: box.top - padding,
width: (box.width || 0) + 2 * padding,
height: (box.width || 0) + 2 * padding
};
};
iD.ui.intro.icon = function(name, svgklass) {
return '<svg class="icon ' + (svgklass || '') + '">' +
'<use xlink:href="' + name + '"></use></svg>';
};
}
@@ -1,4 +1,6 @@
iD.ui.Lasso = function(context) {
import { Toggle } from './toggle';
export function Lasso(context) {
var group, polygon;
lasso.coordinates = [];
@@ -13,7 +15,7 @@ iD.ui.Lasso = function(context) {
polygon = group.append('path')
.attr('class', 'lasso-path');
group.call(iD.ui.Toggle(true));
group.call(Toggle(true));
}
@@ -39,7 +41,7 @@ iD.ui.Lasso = function(context) {
lasso.close = function() {
if (group) {
group.call(iD.ui.Toggle(false, function() {
group.call(Toggle(false, function() {
d3.select(this).remove();
}));
}
@@ -47,4 +49,4 @@ iD.ui.Lasso = function(context) {
};
return lasso;
};
}
@@ -1,10 +1,12 @@
iD.ui.Loading = function(context) {
import { modal as modalModule } from './modal';
export function Loading(context) {
var message = '',
blocking = false,
modal;
var loading = function(selection) {
modal = iD.ui.modal(selection, blocking);
modal = modalModule(selection, blocking);
var loadertext = modal.select('.content')
.classed('loading-modal', true)
@@ -41,4 +43,4 @@ iD.ui.Loading = function(context) {
};
return loading;
};
}
@@ -1,4 +1,4 @@
iD.ui.MapData = function(context) {
export function MapData(context) {
var key = 'F',
features = context.features().keys(),
layers = context.layers(),
@@ -431,4 +431,4 @@ iD.ui.MapData = function(context) {
}
return map_data;
};
}
@@ -1,4 +1,4 @@
iD.ui.MapInMap = function(context) {
export function MapInMap(context) {
var key = '/';
function map_in_map(selection) {
@@ -268,7 +268,7 @@ iD.ui.MapInMap = function(context) {
}
}
iD.ui.MapInMap.toggle = toggle;
MapInMap.toggle = toggle;
var wrap = selection.selectAll('.map-in-map')
.data([0]);
@@ -297,4 +297,4 @@ iD.ui.MapInMap = function(context) {
}
return map_in_map;
};
}
@@ -1,4 +1,4 @@
iD.ui.modal = function(selection, blocking) {
export function modal(selection, blocking) {
var keybinding = d3.keybinding('modal');
var previous = selection.select('div.modal');
var animate = previous.empty();
@@ -60,4 +60,4 @@ iD.ui.modal = function(selection, blocking) {
}
return shaded;
};
}
@@ -1,4 +1,4 @@
iD.ui.Modes = function(context) {
export function Modes(context) {
var modes = [
iD.modes.AddPoint(context),
iD.modes.AddLine(context),
@@ -68,4 +68,4 @@ iD.ui.Modes = function(context) {
buttons.property('disabled', !editable());
}
};
};
}
@@ -1,4 +1,4 @@
iD.ui.Notice = function(context) {
export function Notice(context) {
return function(selection) {
var div = selection.append('div')
.attr('class', 'notice');
@@ -22,4 +22,4 @@ iD.ui.Notice = function(context) {
disableTooHigh();
};
};
}
@@ -1,4 +1,4 @@
iD.ui.preset = function(context) {
export function preset(context) {
var event = d3.dispatch('change'),
state,
fields,
@@ -266,4 +266,4 @@ iD.ui.preset = function(context) {
};
return d3.rebind(presets, event, 'on');
};
}
@@ -1,4 +1,4 @@
iD.ui.PresetIcon = function() {
export function PresetIcon() {
var preset, geometry;
function presetIcon(selection) {
@@ -79,4 +79,4 @@ iD.ui.PresetIcon = function() {
};
return presetIcon;
};
}
@@ -1,4 +1,7 @@
iD.ui.PresetList = function(context) {
import { PresetIcon } from './preset_icon';
import { TagReference } from './tag_reference';
export function PresetList(context) {
var event = d3.dispatch('choose'),
id,
currentPreset,
@@ -134,7 +137,7 @@ iD.ui.PresetList = function(context) {
wrap.append('button')
.attr('class', 'preset-list-button')
.classed('expanded', false)
.call(iD.ui.PresetIcon()
.call(PresetIcon()
.geometry(context.geometry(id))
.preset(preset))
.on('click', function() {
@@ -195,7 +198,7 @@ iD.ui.PresetList = function(context) {
wrap.append('button')
.attr('class', 'preset-list-button')
.call(iD.ui.PresetIcon()
.call(PresetIcon()
.geometry(context.geometry(id))
.preset(preset))
.on('click', item.choose)
@@ -223,7 +226,7 @@ iD.ui.PresetList = function(context) {
};
item.preset = preset;
item.reference = iD.ui.TagReference(preset.reference(context.geometry(id)), context);
item.reference = TagReference(preset.reference(context.geometry(id)), context);
return item;
}
@@ -248,4 +251,4 @@ iD.ui.PresetList = function(context) {
};
return d3.rebind(presetList, event, 'on');
};
}
@@ -1,4 +1,4 @@
iD.ui.RadialMenu = function(context, operations) {
export function RadialMenu(context, operations) {
var menu,
center = [0, 0],
tooltip;
@@ -130,4 +130,4 @@ iD.ui.RadialMenu = function(context, operations) {
};
return radialMenu;
};
}
@@ -1,4 +1,6 @@
iD.ui.RawMemberEditor = function(context) {
import { Disclosure } from './disclosure';
export function RawMemberEditor(context) {
var id;
function selectMember(d) {
@@ -39,7 +41,7 @@ iD.ui.RawMemberEditor = function(context) {
});
});
selection.call(iD.ui.Disclosure()
selection.call(Disclosure()
.title(t('inspector.all_members') + ' (' + memberships.length + ')')
.expanded(true)
.on('toggled', toggled)
@@ -117,4 +119,4 @@ iD.ui.RawMemberEditor = function(context) {
};
return rawMemberEditor;
};
}
@@ -1,4 +1,6 @@
iD.ui.RawMembershipEditor = function(context) {
import { Disclosure } from './disclosure';
export function RawMembershipEditor(context) {
var id, showBlank;
function selectRelation(d) {
@@ -97,7 +99,7 @@ iD.ui.RawMembershipEditor = function(context) {
});
});
selection.call(iD.ui.Disclosure()
selection.call(Disclosure()
.title(t('inspector.all_relations') + ' (' + memberships.length + ')')
.expanded(true)
.on('toggled', toggled)
@@ -214,4 +216,4 @@ iD.ui.RawMembershipEditor = function(context) {
};
return rawMembershipEditor;
};
}
@@ -1,4 +1,7 @@
iD.ui.RawTagEditor = function(context) {
import { Disclosure } from './disclosure';
import { TagReference } from './tag_reference';
export function RawTagEditor(context) {
var event = d3.dispatch('change'),
showBlank = false,
state,
@@ -9,7 +12,7 @@ iD.ui.RawTagEditor = function(context) {
function rawTagEditor(selection) {
var count = Object.keys(tags).filter(function(d) { return d; }).length;
selection.call(iD.ui.Disclosure()
selection.call(Disclosure()
.title(t('inspector.all_tags') + ' (' + count + ')')
.expanded(context.storage('raw_tag_editor.expanded') === 'true' || preset.isFallback())
.on('toggled', toggled)
@@ -86,9 +89,9 @@ iD.ui.RawTagEditor = function(context) {
var isRelation = (context.entity(id).type === 'relation'),
reference;
if (isRelation && tag.key === 'type')
reference = iD.ui.TagReference({rtype: tag.value}, context);
reference = TagReference({rtype: tag.value}, context);
else
reference = iD.ui.TagReference({key: tag.key, value: tag.value}, context);
reference = TagReference({key: tag.key, value: tag.value}, context);
if (state === 'hover') {
reference.showing(false);
@@ -248,4 +251,4 @@ iD.ui.RawTagEditor = function(context) {
};
return d3.rebind(rawTagEditor, event, 'on');
};
}
@@ -1,9 +1,11 @@
iD.ui.Restore = function(context) {
import { modal as modalModule } from './modal';
export function Restore(context) {
return function(selection) {
if (!context.history().lock() || !context.history().restorableChanges())
return;
var modal = iD.ui.modal(selection, true);
var modal = modalModule(selection, true);
modal.select('.modal')
.attr('class', 'modal fillL col6');
@@ -43,4 +45,4 @@ iD.ui.Restore = function(context) {
restore.node().focus();
};
};
}
+5 -3
View File
@@ -1,6 +1,8 @@
iD.ui.Save = function(context) {
import { cmd } from './cmd';
export function Save(context) {
var history = context.history(),
key = iD.ui.cmd('⌘S');
key = cmd('⌘S');
function saving() {
@@ -82,4 +84,4 @@ iD.ui.Save = function(context) {
if (saving()) button.call(tooltip.hide);
});
};
};
}
@@ -1,4 +1,4 @@
iD.ui.Scale = function(context) {
export function Scale(context) {
var projection = context.projection,
imperial = (iD.detect().locale.toLowerCase() === 'en-us'),
maxLength = 180,
@@ -86,4 +86,4 @@ iD.ui.Scale = function(context) {
update(selection);
});
};
};
}
@@ -1,4 +1,4 @@
iD.ui.SelectionList = function(context, selectedIDs) {
export function SelectionList(context, selectedIDs) {
function selectEntity(entity) {
context.enter(iD.modes.Select(context, [entity.id]).suppressMenu(true));
@@ -67,4 +67,4 @@ iD.ui.SelectionList = function(context, selectedIDs) {
return selectionList;
};
}
@@ -1,13 +1,17 @@
iD.ui.Sidebar = function(context) {
var inspector = iD.ui.Inspector(context),
import { Inspector } from './inspector';
import { FeatureList } from './feature_list';
import { Notice } from './notice';
export function Sidebar(context) {
var inspector = Inspector(context),
current;
function sidebar(selection) {
var featureListWrap = selection.append('div')
.attr('class', 'feature-list-pane')
.call(iD.ui.FeatureList(context));
.call(FeatureList(context));
selection.call(iD.ui.Notice(context));
selection.call(Notice(context));
var inspectorWrap = selection.append('div')
.attr('class', 'inspector-hidden inspector-wrap fr');
@@ -79,4 +83,4 @@ iD.ui.Sidebar = function(context) {
sidebar.hide = function() {};
return sidebar;
};
}
@@ -1,4 +1,4 @@
iD.ui.SourceSwitch = function(context) {
export function SourceSwitch(context) {
var keys;
function click() {
@@ -37,4 +37,4 @@ iD.ui.SourceSwitch = function(context) {
};
return sourceSwitch;
};
}
@@ -1,4 +1,4 @@
iD.ui.Spinner = function(context) {
export function Spinner(context) {
var connection = context.connection();
return function(selection) {
@@ -16,4 +16,4 @@ iD.ui.Spinner = function(context) {
.style('opacity', 0);
});
};
};
}
@@ -1,11 +1,14 @@
iD.ui.Splash = function(context) {
import { modal as modalModule } from './modal';
import { intro } from './intro';
export function Splash(context) {
return function(selection) {
if (context.storage('sawSplash'))
return;
context.storage('sawSplash', true);
var modal = iD.ui.modal(selection);
var modal = modalModule(selection);
modal.select('.modal')
.attr('class', 'modal-splash modal col6');
@@ -33,7 +36,7 @@ iD.ui.Splash = function(context) {
.attr('class', 'col6 walkthrough')
.text(t('splash.walkthrough'))
.on('click', function() {
d3.select(document.body).call(iD.ui.intro(context));
d3.select(document.body).call(intro(context));
modal.close();
});
@@ -45,4 +48,4 @@ iD.ui.Splash = function(context) {
modal.select('button.close').attr('class','hide');
};
};
}
@@ -1,4 +1,4 @@
iD.ui.Status = function(context) {
export function Status(context) {
var connection = context.connection(),
errCount = 0;
@@ -32,4 +32,4 @@ iD.ui.Status = function(context) {
window.setInterval(update, 90000);
update(selection);
};
};
}
@@ -1,4 +1,4 @@
iD.ui.Success = function(context) {
export function Success(context) {
var dispatch = d3.dispatch('cancel'),
changeset;
@@ -66,4 +66,4 @@ iD.ui.Success = function(context) {
};
return d3.rebind(success, dispatch, 'on');
};
}
@@ -1,4 +1,4 @@
iD.ui.TagReference = function(tag, context) {
export function TagReference(tag, context) {
var tagReference = {},
button,
body,
@@ -146,4 +146,4 @@ iD.ui.TagReference = function(tag, context) {
};
return tagReference;
};
}
@@ -2,7 +2,7 @@
// hide class, which sets display=none, and a d3 transition for opacity.
// this will cause blinking when called repeatedly, so check that the
// value actually changes between calls.
iD.ui.Toggle = function(show, callback) {
export function Toggle(show, callback) {
return function(selection) {
selection
.style('opacity', show ? 0 : 1)
@@ -16,4 +16,4 @@ iD.ui.Toggle = function(show, callback) {
if (callback) callback.apply(this);
});
};
};
}
@@ -1,12 +1,14 @@
iD.ui.UndoRedo = function(context) {
import { cmd } from './cmd';
export function UndoRedo(context) {
var commands = [{
id: 'undo',
cmd: iD.ui.cmd('⌘Z'),
cmd: cmd('⌘Z'),
action: function() { if (!(context.inIntro() || saving())) context.undo(); },
annotation: function() { return context.history().undoAnnotation(); }
}, {
id: 'redo',
cmd: iD.ui.cmd('⌘⇧Z'),
cmd: cmd('⌘⇧Z'),
action: function() {if (!(context.inIntro() || saving())) context.redo(); },
annotation: function() { return context.history().redoAnnotation(); }
}];
@@ -62,4 +64,4 @@ iD.ui.UndoRedo = function(context) {
});
}
};
};
}
@@ -1,4 +1,4 @@
iD.ui.ViewOnOSM = function(context) {
export function ViewOnOSM(context) {
var id;
function viewOnOSM(selection) {
@@ -28,4 +28,4 @@ iD.ui.ViewOnOSM = function(context) {
};
return viewOnOSM;
};
}
+8 -6
View File
@@ -1,4 +1,6 @@
iD.ui.Zoom = function(context) {
import { cmd } from './cmd';
export function Zoom(context) {
var zooms = [{
id: 'zoom-in',
icon: 'plus',
@@ -58,17 +60,17 @@ iD.ui.Zoom = function(context) {
_.each(['=','ffequals','plus','ffplus'], function(key) {
keybinding.on(key, zoomIn);
keybinding.on('⇧' + key, zoomIn);
keybinding.on(iD.ui.cmd('⌘' + key), zoomInFurther);
keybinding.on(iD.ui.cmd('⌘⇧' + key), zoomInFurther);
keybinding.on(cmd('⌘' + key), zoomInFurther);
keybinding.on(cmd('⌘⇧' + key), zoomInFurther);
});
_.each(['-','ffminus','_','dash'], function(key) {
keybinding.on(key, zoomOut);
keybinding.on('⇧' + key, zoomOut);
keybinding.on(iD.ui.cmd('⌘' + key), zoomOutFurther);
keybinding.on(iD.ui.cmd('⌘⇧' + key), zoomOutFurther);
keybinding.on(cmd('⌘' + key), zoomOutFurther);
keybinding.on(cmd('⌘⇧' + key), zoomOutFurther);
});
d3.select(document)
.call(keybinding);
};
};
}
@@ -1,4 +1,4 @@
iD.ui.intro.area = function(context, reveal) {
export function area(context, reveal) {
var event = d3.dispatch('done'),
timeout;
@@ -85,4 +85,4 @@ iD.ui.intro.area = function(context, reveal) {
};
return d3.rebind(step, event, 'on');
};
}
+5
View File
@@ -0,0 +1,5 @@
export { area } from './area';
export { line } from './line';
export { navigation } from './navigation';
export { point } from './point';
export { startEditing } from './start_editing';
@@ -1,4 +1,4 @@
iD.ui.intro.line = function(context, reveal) {
export function line(context, reveal) {
var event = d3.dispatch('done'),
timeouts = [];
@@ -150,4 +150,4 @@ iD.ui.intro.line = function(context, reveal) {
};
return d3.rebind(step, event, 'on');
};
}
@@ -1,4 +1,4 @@
iD.ui.intro.navigation = function(context, reveal) {
export function navigation(context, reveal) {
var event = d3.dispatch('done'),
timeouts = [];
@@ -109,4 +109,4 @@ iD.ui.intro.navigation = function(context, reveal) {
};
return d3.rebind(step, event, 'on');
};
}
@@ -1,4 +1,4 @@
iD.ui.intro.point = function(context, reveal) {
export function point(context, reveal) {
var event = d3.dispatch('done'),
timeouts = [];
@@ -149,4 +149,4 @@ iD.ui.intro.point = function(context, reveal) {
};
return d3.rebind(step, event, 'on');
};
}
@@ -1,4 +1,4 @@
iD.ui.intro.startEditing = function(context, reveal) {
export function startEditing(context, reveal) {
var event = d3.dispatch('done', 'startEditing'),
modal,
timeouts = [];
@@ -54,4 +54,4 @@ iD.ui.intro.startEditing = function(context, reveal) {
};
return d3.rebind(step, event, 'on');
};
}
@@ -1,4 +1,4 @@
iD.ui.preset.access = function(field) {
export function access(field) {
var dispatch = d3.dispatch('change'),
items;
@@ -193,4 +193,4 @@ iD.ui.preset.access = function(field) {
};
return d3.rebind(access, dispatch, 'on');
};
}
@@ -1,4 +1,4 @@
iD.ui.preset.address = function(field, context) {
export function address(field, context) {
var dispatch = d3.dispatch('init', 'change'),
wrap,
entity,
@@ -216,4 +216,4 @@ iD.ui.preset.address = function(field, context) {
};
return d3.rebind(address, dispatch, 'on');
};
}
@@ -1,5 +1,5 @@
iD.ui.preset.check =
iD.ui.preset.defaultcheck = function(field) {
export { check as defaultcheck };
export function check(field) {
var dispatch = d3.dispatch('change'),
options = field.strings && field.strings.options,
values = [],
@@ -79,4 +79,4 @@ iD.ui.preset.defaultcheck = function(field) {
};
return d3.rebind(check, dispatch, 'on');
};
}
@@ -1,6 +1,5 @@
iD.ui.preset.combo =
iD.ui.preset.typeCombo =
iD.ui.preset.multiCombo = function(field, context) {
export { combo as typeCombo, combo as multiCombo };
export function combo(field, context) {
var dispatch = d3.dispatch('change'),
isMulti = (field.type === 'multiCombo'),
optstrings = field.strings && field.strings.options,
@@ -304,4 +303,4 @@ iD.ui.preset.multiCombo = function(field, context) {
return d3.rebind(combo, dispatch, 'on');
};
}
@@ -1,4 +1,4 @@
iD.ui.preset.cycleway = function(field) {
export function cycleway(field) {
var dispatch = d3.dispatch('change'),
items;
@@ -97,4 +97,4 @@ iD.ui.preset.cycleway = function(field) {
};
return d3.rebind(cycleway, dispatch, 'on');
};
}
+12
View File
@@ -0,0 +1,12 @@
export { access } from './access';
export { address } from './address';
export { check, defaultcheck} from './check';
export { combo, typeCombo, multiCombo } from './combo';
export { cycleway } from './cycleway';
export { text, url, number, email, tel } from './input';
export { localized } from './localized';
export { maxspeed } from './maxspeed';
export { radio } from './radio';
export { restrictions } from './restrictions';
export { textarea } from './textarea';
export { wikipedia } from './wikipedia';
@@ -1,8 +1,10 @@
iD.ui.preset.text =
iD.ui.preset.number =
iD.ui.preset.tel =
iD.ui.preset.email =
iD.ui.preset.url = function(field, context) {
export {
url as text,
url as number,
url as tel,
url as email
};
export function url(field, context) {
var dispatch = d3.dispatch('change'),
input,
@@ -85,4 +87,4 @@ iD.ui.preset.url = function(field, context) {
};
return d3.rebind(i, dispatch, 'on');
};
}
@@ -1,4 +1,4 @@
iD.ui.preset.localized = function(field, context) {
export function localized(field, context) {
var dispatch = d3.dispatch('change', 'input'),
wikipedia = iD.services.wikipedia(),
input, localizedInputs, wikiTitles,
@@ -239,4 +239,4 @@ iD.ui.preset.localized = function(field, context) {
};
return d3.rebind(localized, dispatch, 'on');
};
}
@@ -1,4 +1,4 @@
iD.ui.preset.maxspeed = function(field, context) {
export function maxspeed(field, context) {
var dispatch = d3.dispatch('change'),
entity,
imperial,
@@ -107,4 +107,4 @@ iD.ui.preset.maxspeed = function(field, context) {
};
return d3.rebind(maxspeed, dispatch, 'on');
};
}
@@ -1,4 +1,4 @@
iD.ui.preset.radio = function(field) {
export function radio(field) {
var dispatch = d3.dispatch('change'),
labels, radios, placeholder;
@@ -72,4 +72,4 @@ iD.ui.preset.radio = function(field) {
};
return d3.rebind(radio, dispatch, 'on');
};
}
@@ -1,4 +1,4 @@
iD.ui.preset.restrictions = function(field, context) {
export function restrictions(field, context) {
var dispatch = d3.dispatch('change'),
hover = iD.behavior.Hover(context),
vertexID,
@@ -171,4 +171,4 @@ iD.ui.preset.restrictions = function(field, context) {
};
return d3.rebind(restrictions, dispatch, 'on');
};
}
@@ -1,4 +1,4 @@
iD.ui.preset.textarea = function(field) {
export function textarea(field) {
var dispatch = d3.dispatch('change'),
input;
@@ -34,4 +34,4 @@ iD.ui.preset.textarea = function(field) {
};
return d3.rebind(textarea, dispatch, 'on');
};
}
@@ -1,4 +1,4 @@
iD.ui.preset.wikipedia = function(field, context) {
export function wikipedia(field, context) {
var dispatch = d3.dispatch('change'),
wikipedia = iD.services.wikipedia(),
wikidata = iD.services.wikidata(),
@@ -195,4 +195,4 @@ iD.ui.preset.wikipedia = function(field, context) {
};
return d3.rebind(wiki, dispatch, 'on');
};
}
+3 -3
View File
@@ -1,4 +1,4 @@
iD.ui = function(context) {
export function ui(context) {
function render(container) {
var map = context.map();
@@ -226,9 +226,9 @@ iD.ui = function(context) {
ui.sidebar = iD.ui.Sidebar(context);
return ui;
};
}
iD.ui.tooltipHtml = function(text, key) {
ui.tooltipHtml = function(text, key) {
var s = '<span>' + text + '</span>';
if (key) {
s += '<div class="keyhint-wrap">' +
+5 -49
View File
@@ -52,57 +52,13 @@
<script src='../js/lib/id/services.js'></script>
<script src='../js/lib/id/svg.js'></script>
<script src='../js/lib/id/util.js'></script>
<script src='../js/lib/id/ui/index.js'></script>
<script src='../js/lib/id/ui/core.js'></script>
<script src='../js/lib/id/ui/preset.js'></script>
<script src='../js/lib/id/validations.js'></script>
<script src='../js/id/ui.js'></script>
<script src='../js/id/ui/attribution.js'></script>
<script src='../js/id/ui/radial_menu.js'></script>
<script src='../js/id/ui/inspector.js'></script>
<script src='../js/id/ui/modal.js'></script>
<script src='../js/id/ui/cmd.js'></script>
<script src='../js/id/ui/confirm.js'></script>
<script src='../js/id/ui/conflicts.js'></script>
<script src='../js/id/ui/commit.js'></script>
<script src='../js/id/ui/success.js'></script>
<script src='../js/id/ui/loading.js'></script>
<script src='../js/id/ui/account.js'></script>
<script src='../js/id/ui/background.js'></script>
<script src='../js/id/ui/map_data.js'></script>
<script src='../js/id/ui/map_in_map.js'></script>
<script src='../js/id/ui/modes.js'></script>
<script src='../js/id/ui/contributors.js'></script>
<script src='../js/id/ui/geolocate.js'></script>
<script src='../js/id/ui/notice.js'></script>
<script src='../js/id/ui/flash.js'></script>
<script src='../js/id/ui/feature_info.js'></script>
<script src='../js/id/ui/save.js'></script>
<script src='../js/id/ui/scale.js'></script>
<script src='../js/id/ui/splash.js'></script>
<script src='../js/id/ui/restore.js'></script>
<script src='../js/id/ui/tag_reference.js'></script>
<script src='../js/id/ui/preset.js'></script>
<script src='../js/id/ui/preset_icon.js'></script>
<script src='../js/id/ui/lasso.js'></script>
<script src='../js/id/ui/source_switch.js'></script>
<script src='../js/id/ui/toggle.js'></script>
<script src='../js/id/ui/undo_redo.js'></script>
<script src='../js/id/ui/zoom.js'></script>
<script src='../js/id/ui/raw_tag_editor.js'></script>
<script src='../js/id/ui/raw_membership_editor.js'></script>
<script src='../js/id/ui/selection_list.js'></script>
<script src='../js/id/ui/preset_list.js'></script>
<script src='../js/id/ui/entity_editor.js'></script>
<script src='../js/id/ui/disclosure.js'></script>
<script src='../js/id/ui/sidebar.js'></script>
<script src='../js/id/ui/preset/access.js'></script>
<script src='../js/id/ui/preset/address.js'></script>
<script src='../js/id/ui/preset/input.js'></script>
<script src='../js/id/ui/preset/check.js'></script>
<script src='../js/id/ui/preset/combo.js'></script>
<script src='../js/id/ui/preset/localized.js'></script>
<script src='../js/id/ui/preset/wikipedia.js'></script>
<script src='../js/lib/locale.js'></script>
<script src='../data/data_dev.js'></script>