mirror of
https://github.com/FoggedLens/iD.git
synced 2026-05-15 21:48:20 +02:00
Update fixes UI for icons, link styling, and non-actionable fixes
Fix several bugs
This commit is contained in:
+45
-21
@@ -3009,50 +3009,60 @@ div.full-screen > button:hover {
|
||||
width: 100%;
|
||||
font-weight: inherit;
|
||||
border-radius: 0;
|
||||
text-align: inherit;
|
||||
display: flex;
|
||||
color: inherit;
|
||||
}
|
||||
[dir='rtl'] .issue button {
|
||||
padding: 5px 5px 5px 10px;
|
||||
}
|
||||
|
||||
.issue button.label {
|
||||
text-align: inherit;
|
||||
display: flex;
|
||||
}
|
||||
.warnings-list,
|
||||
.issue.severity-warning,
|
||||
.issue.severity-warning li,
|
||||
li.issue.severity-warning {
|
||||
border-color: #FFDF5C;
|
||||
}
|
||||
.errors-list,
|
||||
.issue.severity-error,
|
||||
.issue.severity-error li,
|
||||
li.issue.severity-error {
|
||||
border-color: #f5b0ab;
|
||||
}
|
||||
|
||||
.issue.severity-warning,
|
||||
.issue.severity-warning button,
|
||||
.mode-save .warning-section {
|
||||
background: #ffb;
|
||||
}
|
||||
.issue.severity-warning button:hover,
|
||||
.issue.severity-warning button:focus {
|
||||
.issue.severity-warning:not(.expanded) button:hover,
|
||||
.issue.severity-warning:not(.expanded) button:focus {
|
||||
background: #FFFF99;
|
||||
}
|
||||
.issue.severity-warning .icon {
|
||||
color: #FFB300
|
||||
.issue.severity-warning .issue-icon,
|
||||
.issue.severity-warning .issue-fix-item.actionable {
|
||||
color: #ff9205;
|
||||
fill: #ff9205;
|
||||
}
|
||||
.issue.severity-warning .issue-fix-item.actionable:hover {
|
||||
color: #f07504;
|
||||
fill: #f07504;
|
||||
}
|
||||
|
||||
.issue.severity-error,
|
||||
.issue.severity-error button,
|
||||
.mode-save .error-section {
|
||||
background: #FFD5D4;
|
||||
}
|
||||
.issue.severity-error button:hover,
|
||||
.issue.severity-error button:focus {
|
||||
.issue.severity-error:not(.expanded) button:hover,
|
||||
.issue.severity-error:not(.expanded) button:focus {
|
||||
background: #ffc9c7;
|
||||
}
|
||||
.issue.severity-error .icon {
|
||||
color: #DD1400
|
||||
.issue.severity-error .issue-icon,
|
||||
.issue.severity-error .issue-fix-item.actionable {
|
||||
color: #DD1400;
|
||||
fill: #DD1400;
|
||||
}
|
||||
.issue.severity-error .issue-fix-item.actionable:hover {
|
||||
color: #ab0f00;
|
||||
fill: #ab0f00;
|
||||
}
|
||||
|
||||
/* Issues Pane */
|
||||
@@ -3091,13 +3101,27 @@ div.full-screen > button:hover {
|
||||
.entity-issues .issue:not(:last-of-type) {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
ul.issue-fix-list li:first-child {
|
||||
border-top-style: solid;
|
||||
border-top-width: 2px;
|
||||
.issue.expanded button.label {
|
||||
cursor: pointer;
|
||||
pointer-events: none;
|
||||
padding-bottom: 0px;
|
||||
}
|
||||
ul.issue-fix-list li:not(:last-of-type) {
|
||||
border-bottom-style: solid;
|
||||
border-bottom-width: 1px;
|
||||
ul.issue-fix-list button {
|
||||
padding: 2px 10px 2px 26px;
|
||||
}
|
||||
.issue-fix-item:first-of-type button {
|
||||
padding-top:4px;
|
||||
}
|
||||
.issue-fix-item:last-of-type button {
|
||||
padding-bottom:7px;
|
||||
}
|
||||
.issue-fix-item:not(.actionable) button {
|
||||
cursor: pointer;
|
||||
pointer-events: none;
|
||||
}
|
||||
.issue-fix-item:not(.actionable) .fix-icon {
|
||||
color: #555;
|
||||
fill: #555;
|
||||
}
|
||||
.issue:not(.expanded) ul.issue-fix-list {
|
||||
height: 0px;
|
||||
|
||||
@@ -1266,6 +1266,8 @@ en:
|
||||
remove_tag:
|
||||
title: Remove the tag
|
||||
annotation: Removed tag.
|
||||
reposition_features:
|
||||
title: Reposition the features
|
||||
select_preset:
|
||||
title: Select a feature type
|
||||
tag_as_disconnected:
|
||||
|
||||
Vendored
+3
@@ -1556,6 +1556,9 @@
|
||||
"title": "Remove the tag",
|
||||
"annotation": "Removed tag."
|
||||
},
|
||||
"reposition_features": {
|
||||
"title": "Reposition the features"
|
||||
},
|
||||
"select_preset": {
|
||||
"title": "Select a feature type"
|
||||
},
|
||||
|
||||
@@ -222,6 +222,7 @@ export function validationIssue(attrs) {
|
||||
|
||||
|
||||
export function validationIssueFix(attrs) {
|
||||
this.icon = attrs.icon;
|
||||
this.title = attrs.title;
|
||||
this.onClick = attrs.onClick;
|
||||
this.entityIds = attrs.entityIds || []; // Used for hover-higlighting.
|
||||
|
||||
+41
-16
@@ -14,11 +14,13 @@ export function uiEntityIssues(context) {
|
||||
var _entityID;
|
||||
|
||||
|
||||
// context.validator().on('reload.entity_issues', function() {
|
||||
// _selection.selectAll('.entity-issues')
|
||||
// .call(render);
|
||||
// update();
|
||||
// });
|
||||
context.validator().on('reload.entity_issues', function() {
|
||||
|
||||
update();
|
||||
|
||||
_selection.selectAll('.entity-issues')
|
||||
.call(render);
|
||||
});
|
||||
|
||||
|
||||
function clamp(num, min, max) {
|
||||
@@ -64,6 +66,11 @@ export function uiEntityIssues(context) {
|
||||
var itemsEnter = items.enter()
|
||||
.append('div')
|
||||
.attr('class', function(d) { return 'issue severity-' + d.severity; })
|
||||
.call(tooltip()
|
||||
.html(true)
|
||||
.title(function(d) { return uiTooltipHtml(d.tooltip); })
|
||||
.placement('top')
|
||||
)
|
||||
.on('mouseover.highlight', function(d) {
|
||||
var ids = d.entities.map(function(e) { return e.id; });
|
||||
utilHighlightEntities(ids, true, context);
|
||||
@@ -91,13 +98,6 @@ export function uiEntityIssues(context) {
|
||||
.append('button')
|
||||
.attr('class', 'label');
|
||||
|
||||
labelsEnter
|
||||
.call(tooltip()
|
||||
.html(true)
|
||||
.title(function(d) { return uiTooltipHtml(d.tooltip); })
|
||||
.placement('top')
|
||||
);
|
||||
|
||||
labelsEnter
|
||||
.append('span')
|
||||
.attr('class', 'issue-icon')
|
||||
@@ -129,14 +129,39 @@ export function uiEntityIssues(context) {
|
||||
// fixes
|
||||
var fixLists = items.selectAll('.issue-fix-list');
|
||||
|
||||
fixLists.selectAll('.issue-fix-item')
|
||||
var fixes = fixLists.selectAll('.issue-fix-item')
|
||||
.data(function(d) { return d.fixes; })
|
||||
.enter()
|
||||
.append('li')
|
||||
.attr('class', 'issue-fix-item')
|
||||
.attr('class', function(d) {
|
||||
return 'issue-fix-item ' + (!!d.onClick ? 'actionable' : '');
|
||||
})
|
||||
.append('button')
|
||||
.text(function(d) { return d.title; })
|
||||
.on('click', function(d) { d.onClick(); });
|
||||
.on('click', function(d) {
|
||||
if (d.onClick) {
|
||||
utilHighlightEntities(d.entityIds, false, context);
|
||||
d.onClick();
|
||||
}
|
||||
})
|
||||
.on('mouseover.highlight', function(d) {
|
||||
utilHighlightEntities(d.entityIds, true, context);
|
||||
})
|
||||
.on('mouseout.highlight', function(d) {
|
||||
utilHighlightEntities(d.entityIds, false, context);
|
||||
});
|
||||
|
||||
fixes.append('span')
|
||||
.attr('class', 'fix-icon')
|
||||
.each(function(d) {
|
||||
var iconName = d.icon || 'iD-icon-wrench';
|
||||
if (iconName.startsWith('maki')) {
|
||||
iconName += '-15';
|
||||
}
|
||||
d3_select(this).call(svgIcon('#' + iconName, 'pre-text'));
|
||||
});
|
||||
|
||||
fixes.append('span')
|
||||
.text(function(d) { return d.title; });
|
||||
}
|
||||
|
||||
|
||||
|
||||
@@ -162,6 +162,7 @@ export function validationAlmostJunction() {
|
||||
if (Object.keys(node.tags).length === 0) {
|
||||
// node has no tags, suggest noexit fix
|
||||
fixes.push(new validationIssueFix({
|
||||
icon: 'maki-barrier',
|
||||
title: t('issues.fix.tag_as_disconnected.title'),
|
||||
onClick: function() {
|
||||
var nodeID = this.issue.entities[1].id;
|
||||
|
||||
@@ -398,7 +398,9 @@ export function validationCrossingWays() {
|
||||
}
|
||||
}));
|
||||
}
|
||||
|
||||
fixes.push(new validationIssueFix({
|
||||
title: t('issues.fix.reposition_features.title')
|
||||
}));
|
||||
return new validationIssue({
|
||||
type: type,
|
||||
severity: 'warning',
|
||||
|
||||
@@ -30,6 +30,7 @@ export function validationDeprecatedTag() {
|
||||
},
|
||||
fixes: [
|
||||
new validationIssueFix({
|
||||
icon: 'iD-icon-up',
|
||||
title: t('issues.fix.upgrade_tags.title'),
|
||||
onClick: function() {
|
||||
var entity = this.issue.entities[0];
|
||||
|
||||
@@ -38,6 +38,7 @@ export function validationDisconnectedWay() {
|
||||
|
||||
if (!entity.isClosed()) {
|
||||
fixes.push(new validationIssueFix({
|
||||
icon: 'iD-operation-continue-left',
|
||||
title: t('issues.fix.continue_from_start.title'),
|
||||
entityIds: [entity.first()],
|
||||
onClick: function() {
|
||||
@@ -46,6 +47,7 @@ export function validationDisconnectedWay() {
|
||||
}
|
||||
}));
|
||||
fixes.push(new validationIssueFix({
|
||||
icon: 'iD-operation-continue',
|
||||
title: t('issues.fix.continue_from_end.title'),
|
||||
entityIds: [entity.last()],
|
||||
onClick: function() {
|
||||
@@ -56,6 +58,7 @@ export function validationDisconnectedWay() {
|
||||
}
|
||||
|
||||
fixes.push(new validationIssueFix({
|
||||
icon: 'iD-operation-delete',
|
||||
title: t('issues.fix.delete_feature.title'),
|
||||
entityIds: [entity.id],
|
||||
onClick: function() {
|
||||
@@ -80,7 +83,7 @@ export function validationDisconnectedWay() {
|
||||
function continueDrawing(way, vertex) {
|
||||
// make sure the vertex is actually visible and editable
|
||||
var map = context.map();
|
||||
if (!map.editable() || !map.contains(vertex.loc)) {
|
||||
if (!map.editable() || !map.trimmedExtent().contains(vertex.loc)) {
|
||||
map.zoomToEase(vertex);
|
||||
}
|
||||
|
||||
|
||||
@@ -6,7 +6,7 @@ import { actionChangeTags } from '../actions';
|
||||
import { discardNames } from '../../node_modules/name-suggestion-index/config/filters.json';
|
||||
|
||||
|
||||
export function validationGenericName(context) {
|
||||
export function validationGenericName() {
|
||||
var type = 'generic_name';
|
||||
|
||||
|
||||
@@ -37,7 +37,7 @@ export function validationGenericName(context) {
|
||||
}
|
||||
|
||||
|
||||
var validation = function(entity) {
|
||||
var validation = function(entity, context) {
|
||||
var issues = [];
|
||||
var generic = isGenericName(entity);
|
||||
if (generic) {
|
||||
@@ -50,6 +50,7 @@ export function validationGenericName(context) {
|
||||
entities: [entity],
|
||||
fixes: [
|
||||
new validationIssueFix({
|
||||
icon: 'iD-operation-delete',
|
||||
title: t('issues.fix.remove_generic_name.title'),
|
||||
onClick: function() {
|
||||
var entity = this.issue.entities[0];
|
||||
|
||||
@@ -58,12 +58,14 @@ export function validationMissingTag() {
|
||||
entities: [entity],
|
||||
fixes: [
|
||||
new validationIssueFix({
|
||||
icon: 'iD-icon-search',
|
||||
title: t('issues.fix.select_preset.title'),
|
||||
onClick: function() {
|
||||
context.ui().sidebar.showPresetList();
|
||||
}
|
||||
}),
|
||||
new validationIssueFix({
|
||||
icon: 'iD-operation-delete',
|
||||
title: t('issues.fix.delete_feature.title'),
|
||||
onClick: function() {
|
||||
var id = this.issue.entities[0].id;
|
||||
|
||||
@@ -0,0 +1,4 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg width="20px" height="20px" viewBox="0 0 20 20" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<path d="M10.6879121,7.42604898 C10.2489814,6.19270935 10.5231466,4.76238732 11.5104076,3.77512627 C12.8772427,2.40829124 15.0933201,2.40829124 16.4601551,3.77512627 C16.6542987,3.96926984 16.8208663,4.1805469 16.9598581,4.4040902 L14.1066017,5.11740429 L14.1066017,7.11740429 L17.0920951,7.86377764 C16.9309697,8.17376943 16.720323,8.46470585 16.4601551,8.72487373 C15.4728941,9.71213479 14.042572,9.98629999 12.8092324,9.54736932 L7.9750032,14.3815985 C8.08186131,15.1334839 7.84611589,15.9246994 7.26776695,16.5030483 C6.29145622,17.4793591 4.70854378,17.4793591 3.73223305,16.5030483 C2.75592232,15.5267376 2.75592232,13.9438252 3.73223305,12.9675144 C4.31058199,12.3891655 5.10179747,12.1534201 5.85368286,12.2602782 L10.6879121,7.42604898 Z M6.20710678,15.4423882 C6.59763107,15.0518639 6.59763107,14.4186989 6.20710678,14.0281746 C5.81658249,13.6376503 5.18341751,13.6376503 4.79289322,14.0281746 C4.40236893,14.4186989 4.40236893,15.0518639 4.79289322,15.4423882 C5.18341751,15.8329124 5.81658249,15.8329124 6.20710678,15.4423882 Z" fill="currentColor"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.2 KiB |
@@ -0,0 +1,4 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg width="20px" height="20px" viewBox="0 0 20 20" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<path d="M6,4 C9.314,4 12,6.686 12,10 C12,13.314 9.314,16 6,16 C2.686,16 0,13.314 0,10 C0,6.686 2.686,4 6,4 Z M7,6 L5,6 L5,9 L2,9 L2,11 L5,11 L5,14 L7,14 L7,11 L10,11 L10,9 L7,9 L7,6 Z M15,9 L15,11 L13,11 L13,9 L15,9 Z M18,8 C19.105,8 20,8.895 20,10 C20,11.105 19.105,12 18,12 C16.895,12 16,11.105 16,10 C16,8.895 16.895,8 18,8 Z" fill="inherit"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 543 B |
Reference in New Issue
Block a user