mirror of
https://github.com/FoggedLens/iD.git
synced 2026-05-27 18:32:25 +02:00
WIP uiEntityIssues cleanups, simplify
fixes are still not being applied properly
This commit is contained in:
Bryan Housel
@@ -171,11 +171,6 @@ export function uiEntityEditor(context) {
|
||||
.attr('class', 'namepart')
|
||||
.text(function(d) { return d; });
|
||||
|
||||
body.select('.entity-issues')
|
||||
.call(entityIssues
|
||||
.entityID(_entityID)
|
||||
);
|
||||
|
||||
// update quick links
|
||||
var choices = [{
|
||||
id: 'zoom_to',
|
||||
@@ -193,6 +188,11 @@ export function uiEntityEditor(context) {
|
||||
|
||||
|
||||
// update editor sections
|
||||
body.select('.entity-issues')
|
||||
.call(entityIssues
|
||||
.entityID(_entityID)
|
||||
);
|
||||
|
||||
body.select('.preset-editor')
|
||||
.call(presetEditor
|
||||
.preset(_activePreset)
|
||||
|
||||
+80
-84
@@ -1,5 +1,4 @@
|
||||
import { dispatch as d3_dispatch } from 'd3-dispatch';
|
||||
import { select as d3_selectAll } from 'd3-selection';
|
||||
import { select as d3_select } from 'd3-selection';
|
||||
|
||||
import { svgIcon } from '../svg';
|
||||
import { t } from '../util/locale';
|
||||
@@ -10,22 +9,31 @@ import { utilRebind, utilHighlightEntities } from '../util';
|
||||
|
||||
|
||||
export function uiEntityIssues(context) {
|
||||
var dispatch = d3_dispatch('change');
|
||||
var _selection = d3_select(null);
|
||||
var _expanded = 0;
|
||||
var _entityID;
|
||||
|
||||
context.validator().on('reload.entity_issues', issuesDidReload);
|
||||
|
||||
|
||||
function issuesDidReload() {
|
||||
var selection = d3_selectAll('.entity-issues .disclosure-wrap');
|
||||
renderContent(selection);
|
||||
context.validator().on('reload.entity_issues', function() {
|
||||
_selection.selectAll('.entity-issues')
|
||||
.call(render);
|
||||
update();
|
||||
});
|
||||
|
||||
|
||||
function clamp(num, min, max) {
|
||||
return Math.max(min, Math.min(num, max));
|
||||
}
|
||||
|
||||
|
||||
function entityIssues(selection) {
|
||||
_selection = selection;
|
||||
|
||||
selection
|
||||
.call(uiDisclosure(context, 'entity_issues', true).content(renderContent));
|
||||
.call(uiDisclosure(context, 'entity_issues', true)
|
||||
.content(render)
|
||||
);
|
||||
|
||||
update();
|
||||
}
|
||||
|
||||
@@ -33,16 +41,17 @@ export function uiEntityIssues(context) {
|
||||
function update() {
|
||||
var issues = context.validator().getIssuesForEntityWithID(_entityID);
|
||||
|
||||
d3_selectAll('.entity-issues')
|
||||
_selection.selectAll('.entity-issues')
|
||||
.classed('hide', issues.length === 0);
|
||||
|
||||
d3_selectAll('.hide-toggle-entity_issues span')
|
||||
_selection.selectAll('.hide-toggle-entity_issues span')
|
||||
.text(t('issues.list_title', { count: issues.length }));
|
||||
}
|
||||
|
||||
|
||||
function renderContent(selection) {
|
||||
function render(selection) {
|
||||
var issues = context.validator().getIssuesForEntityWithID(_entityID);
|
||||
_expanded = clamp(_expanded, 0, issues.length);
|
||||
|
||||
var items = selection.selectAll('.issue')
|
||||
.data(issues, function(d) { return d.id(); });
|
||||
@@ -52,9 +61,9 @@ export function uiEntityIssues(context) {
|
||||
.remove();
|
||||
|
||||
// Enter
|
||||
var enter = items.enter()
|
||||
var itemsEnter = items.enter()
|
||||
.append('div')
|
||||
.attr('class', function (d) { return 'issue severity-' + d.severity; })
|
||||
.attr('class', function(d) { return 'issue severity-' + d.severity; })
|
||||
.on('mouseover.highlight', function(d) {
|
||||
var ids = d.entities.map(function(e) { return e.id; });
|
||||
utilHighlightEntities(ids, true, context);
|
||||
@@ -62,101 +71,88 @@ export function uiEntityIssues(context) {
|
||||
.on('mouseout.highlight', function(d) {
|
||||
var ids = d.entities.map(function(e) { return e.id; });
|
||||
utilHighlightEntities(ids, false, context);
|
||||
})
|
||||
.on('click', function(d, i) {
|
||||
_expanded = i; // expand only the clicked item
|
||||
items.classed('expanded', function(d, i) { return i === _expanded; });
|
||||
|
||||
var loc = d.loc();
|
||||
if (loc) {
|
||||
context.map().centerZoomEase(loc, Math.max(context.map().zoom(), 18));
|
||||
} else if (d.entities && d.entities.length > 0 &&
|
||||
!d.entities[0].intersects(context.map().extent(), context.graph())) {
|
||||
context.map().zoomToEase(d.entities[0]);
|
||||
}
|
||||
});
|
||||
|
||||
var label = enter
|
||||
var labelsEnter = itemsEnter
|
||||
.append('button')
|
||||
.classed('label', true)
|
||||
.attr('class', 'label');
|
||||
|
||||
labelsEnter
|
||||
.call(tooltip()
|
||||
.html(true)
|
||||
.title(function(d) { return uiTooltipHtml(d.tooltip); })
|
||||
.placement('top')
|
||||
);
|
||||
|
||||
label.each(function(d) {
|
||||
var iconSuffix = d.severity === 'warning' ? 'alert' : 'error';
|
||||
d3_selectAll(this)
|
||||
.append('div')
|
||||
.attr('title', t('issues.' + d.severity + 's.icon_tooltip'))
|
||||
.style('display', 'inline')
|
||||
.call(svgIcon('#iD-icon-' + iconSuffix, 'pre-text'));
|
||||
});
|
||||
|
||||
label
|
||||
labelsEnter
|
||||
.append('span')
|
||||
.attr('class', 'issue-icon')
|
||||
.call(svgIcon('', 'pre-text'));
|
||||
|
||||
labelsEnter
|
||||
.append('strong')
|
||||
.text(function(d) { return d.message; });
|
||||
.attr('class', 'issue-text');
|
||||
|
||||
itemsEnter
|
||||
.append('ul')
|
||||
.attr('class', 'issue-fix-list');
|
||||
|
||||
enter.each(function(d) {
|
||||
var issue = d3_selectAll(this);
|
||||
|
||||
var list = issue
|
||||
.selectAll('ul.fixes')
|
||||
.data([0]);
|
||||
|
||||
if (d.fixes && d.fixes.length > 0) {
|
||||
list = list.enter()
|
||||
.append('ul')
|
||||
.attr('class', 'fixes')
|
||||
.merge(list);
|
||||
|
||||
issue.selectAll('.label')
|
||||
.on('click', function() {
|
||||
if (!issue.classed('fixes-open')) {
|
||||
issue.classed('fixes-open', true);
|
||||
var loc = d.loc();
|
||||
if (loc) {
|
||||
context.map().centerZoomEase(loc, Math.max(context.map().zoom(), 18));
|
||||
} else if (d.entities && d.entities.length > 0 &&
|
||||
!d.entities[0].intersects(context.map().extent(), context.graph())) {
|
||||
context.map().zoomToEase(d.entities[0]);
|
||||
}
|
||||
} else {
|
||||
issue.classed('fixes-open', false);
|
||||
}
|
||||
});
|
||||
|
||||
var fixItems = list
|
||||
.selectAll('li')
|
||||
.data(d.fixes);
|
||||
|
||||
fixItems.exit()
|
||||
.remove();
|
||||
|
||||
fixItems.enter()
|
||||
.append('li')
|
||||
.append('button')
|
||||
.text(function(d) {return d.title; })
|
||||
.on('click', function(d) { d.onClick(); })
|
||||
.on('mouseover.highlight', function(d) {
|
||||
utilHighlightEntities(d.entityIds, true, context);
|
||||
})
|
||||
.on('mouseout.highlight', function(d) {
|
||||
utilHighlightEntities(d.entityIds, false, context);
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
// Update
|
||||
items = items
|
||||
.merge(enter);
|
||||
.merge(itemsEnter)
|
||||
.classed('expanded', function(d, i) { return i === _expanded; });
|
||||
|
||||
// open the fixes for the first issue if no others are already open
|
||||
if (selection.selectAll('.issue.fixes-open').empty()) {
|
||||
selection.selectAll('.issue:first-child').classed('fixes-open', true);
|
||||
}
|
||||
|
||||
items.select('button.label') // propagate bound data
|
||||
.attr('title', function(d) {
|
||||
return t('issues.' + d.severity + 's.icon_tooltip');
|
||||
});
|
||||
|
||||
items.select('.issue-icon svg use') // propagate bound data
|
||||
.attr('href', function(d) {
|
||||
return '#iD-icon-' + (d.severity === 'warning' ? 'alert' : 'error');
|
||||
});
|
||||
|
||||
items.select('.issue-text') // propagate bound data
|
||||
.text(function(d) { return d.message; });
|
||||
|
||||
|
||||
// fixes
|
||||
var fixLists = items.selectAll('.issue-fix-list');
|
||||
|
||||
fixLists.selectAll('.issue-fix-item')
|
||||
.data(function(d) { return d.fixes; })
|
||||
.enter()
|
||||
.append('li')
|
||||
.attr('class', 'issue-fix-item')
|
||||
.append('button')
|
||||
.text(function(d) { return d.title; })
|
||||
.on('click', function(d) { d.onClick(); });
|
||||
}
|
||||
|
||||
|
||||
entityIssues.entityID = function(val) {
|
||||
if (!arguments.length) return _entityID;
|
||||
if (_entityID === val) return entityIssues;
|
||||
_entityID = val;
|
||||
if (_entityID !== val) {
|
||||
_entityID = val;
|
||||
_expanded = 0;
|
||||
}
|
||||
return entityIssues;
|
||||
};
|
||||
|
||||
|
||||
return utilRebind(entityIssues, dispatch, 'on');
|
||||
return entityIssues;
|
||||
}
|
||||
|
||||
@@ -130,7 +130,7 @@ export function uiIssues(context) {
|
||||
items = items
|
||||
.merge(itemsEnter);
|
||||
|
||||
items.select('button') // propagate bound data
|
||||
items.select('button.label') // propagate bound data
|
||||
.attr('title', function(d) {
|
||||
return t('issues.' + d.severity + 's.icon_tooltip');
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user