Highlight related but unselected features when hovering over operations in the edit menu (close #8034)

This commit is contained in:
Quincy Morgan
2020-09-30 16:46:13 -04:00
parent ebe77b2d6b
commit 27003d9e71
4 changed files with 71 additions and 25 deletions
+24 -18
View File
@@ -5,45 +5,51 @@ import { utilArrayGroupBy } from '../util';
export function operationContinue(context, selectedIDs) {
var graph = context.graph();
var entities = selectedIDs.map(function(id) { return graph.entity(id); });
var geometries = Object.assign(
var _entities = selectedIDs.map(function(id) { return context.graph().entity(id); });
var _geometries = Object.assign(
{ line: [], vertex: [] },
utilArrayGroupBy(entities, function(entity) { return entity.geometry(graph); })
utilArrayGroupBy(_entities, function(entity) { return entity.geometry(context.graph()); })
);
var vertex = geometries.vertex[0];
var _vertex = _geometries.vertex.length && _geometries.vertex[0];
function candidateWays() {
return graph.parentWays(vertex).filter(function(parent) {
return parent.geometry(graph) === 'line' &&
return _vertex ? context.graph().parentWays(_vertex).filter(function(parent) {
return parent.geometry(context.graph()) === 'line' &&
!parent.isClosed() &&
parent.affix(vertex.id) &&
(geometries.line.length === 0 || geometries.line[0] === parent);
});
parent.affix(_vertex.id) &&
(_geometries.line.length === 0 || _geometries.line[0] === parent);
}) : [];
}
var _candidates = candidateWays();
var operation = function() {
var candidate = candidateWays()[0];
var candidate = _candidates[0];
context.enter(
modeDrawLine(context, candidate.id, context.graph(), 'line', candidate.affix(vertex.id), true)
modeDrawLine(context, candidate.id, context.graph(), 'line', candidate.affix(_vertex.id), true)
);
};
operation.relatedEntityIds = function() {
return _candidates.length ? [_candidates[0].id] : [];
};
operation.available = function() {
return geometries.vertex.length === 1 &&
geometries.line.length <= 1 &&
!context.features().hasHiddenConnections(vertex, context.graph());
return _geometries.vertex.length === 1 &&
_geometries.line.length <= 1 &&
!context.features().hasHiddenConnections(_vertex, context.graph());
};
operation.disabled = function() {
var candidates = candidateWays();
if (candidates.length === 0) {
if (_candidates.length === 0) {
return 'not_eligible';
} else if (candidates.length > 1) {
} else if (_candidates.length > 1) {
return 'multiple';
}
+26 -7
View File
@@ -1,6 +1,7 @@
import { t } from '../core/localizer';
import { actionDisconnect } from '../actions/disconnect';
import { behaviorOperation } from '../behavior/operation';
import { utilArrayUniq } from '../util/array';
import { utilGetAllNodes, utilTotalExtent } from '../util/util';
@@ -21,13 +22,16 @@ export function operationDisconnect(context, selectedIDs) {
}
});
var _extent, _nodes, _coords, _descriptionID = '', _annotationID = 'features';
var _coords, _descriptionID = '', _annotationID = 'features';
var _disconnectingVertexIds = [];
var _disconnectingWayIds = [];
if (_vertexIDs.length > 0) {
// At the selected vertices, disconnect the selected ways, if any, else
// disconnect all connected ways
_extent = utilTotalExtent(_vertexIDs, context.graph());
_disconnectingVertexIds = _vertexIDs;
_vertexIDs.forEach(function(vertexID) {
var action = actionDisconnect(vertexID);
@@ -40,6 +44,11 @@ export function operationDisconnect(context, selectedIDs) {
action.limitWays(waysIDsForVertex);
}
_actions.push(action);
_disconnectingWayIds = _disconnectingWayIds
.concat(context.graph().parentWays(context.graph().entity(vertexID)).map(d => d.id));
});
_disconnectingWayIds = utilArrayUniq(_disconnectingWayIds).filter(function(id) {
return _wayIDs.indexOf(id) === -1;
});
_descriptionID += _actions.length === 1 ? 'single_point.' : 'multiple_points.';
@@ -56,8 +65,8 @@ export function operationDisconnect(context, selectedIDs) {
var ways = _wayIDs.map(function(id) {
return context.entity(id);
});
_nodes = utilGetAllNodes(_wayIDs, context.graph());
_coords = _nodes.map(function(n) { return n.loc; });
var nodes = utilGetAllNodes(_wayIDs, context.graph());
_coords = nodes.map(function(n) { return n.loc; });
// actions for connected nodes shared by at least two selected ways
var sharedActions = [];
@@ -66,7 +75,7 @@ export function operationDisconnect(context, selectedIDs) {
var unsharedActions = [];
var unsharedNodes = [];
_nodes.forEach(function(node) {
nodes.forEach(function(node) {
var action = actionDisconnect(node.id).limitWays(_wayIDs);
if (action.disabled(context.graph()) !== 'not_connected') {
@@ -95,13 +104,13 @@ export function operationDisconnect(context, selectedIDs) {
if (sharedActions.length) {
// if any nodes are shared, only disconnect the selected ways from each other
_actions = sharedActions;
_extent = utilTotalExtent(sharedNodes, context.graph());
_disconnectingVertexIds = sharedNodes.map(node => node.id);
_descriptionID += 'conjoined';
_annotationID = 'from_each_other';
} else {
// if no nodes are shared, disconnect the selected ways from all connected ways
_actions = unsharedActions;
_extent = utilTotalExtent(unsharedNodes, context.graph());
_disconnectingVertexIds = unsharedNodes.map(node => node.id);
if (_wayIDs.length === 1) {
_descriptionID += context.graph().geometry(_wayIDs[0]);
} else {
@@ -110,6 +119,8 @@ export function operationDisconnect(context, selectedIDs) {
}
}
var _extent = utilTotalExtent(_disconnectingVertexIds, context.graph());
var operation = function() {
context.perform(function(graph) {
@@ -120,6 +131,14 @@ export function operationDisconnect(context, selectedIDs) {
};
operation.relatedEntityIds = function() {
if (_vertexIDs.length) {
return _disconnectingWayIds;
}
return _disconnectingVertexIds;
};
operation.available = function() {
if (_actions.length === 0) return false;
if (_otherIDs.length !== 0) return false;
+5
View File
@@ -45,6 +45,11 @@ export function operationSplit(context, selectedIDs) {
};
operation.relatedEntityIds = function() {
return _selectedWayIds.length ? [] : _ways.map(way => way.id);
};
operation.available = function() {
return _isAvailable;
};
+16
View File
@@ -5,6 +5,7 @@ import { geoVecAdd } from '../geo';
import { localizer } from '../core/localizer';
import { uiTooltip } from './tooltip';
import { utilRebind } from '../util/rebind';
import { utilHighlightEntities } from '../util/util';
import { svgIcon } from '../svg/icon';
@@ -89,6 +90,16 @@ export function uiEditMenu(context) {
.on('pointerdown mousedown', function pointerdown() {
// don't let button presses also act as map input - #1869
d3_event.stopPropagation();
})
.on('mouseenter.highlight', function(d) {
if (!d.relatedEntityIds || d3_select(this).classed('disabled')) return;
utilHighlightEntities(d.relatedEntityIds(), true, context);
})
.on('mouseleave.highlight', function(d) {
if (!d.relatedEntityIds) return;
utilHighlightEntities(d.relatedEntityIds(), false, context);
});
buttonsEnter.each(function(d) {
@@ -140,6 +151,11 @@ export function uiEditMenu(context) {
function click(operation) {
d3_event.stopPropagation();
if (operation.relatedEntityIds) {
utilHighlightEntities(operation.relatedEntityIds(), false, context);
}
if (operation.disabled()) {
if (lastPointerUpType === 'touch' ||
lastPointerUpType === 'pen') {