diff --git a/css/80_app.css b/css/80_app.css index 7a8809be5..61b5505a4 100644 --- a/css/80_app.css +++ b/css/80_app.css @@ -945,6 +945,9 @@ a.hide-toggle { background-color: #ececec; } } +.feature-list-item.hover { + background-color: #ececec; +} .feature-list-item button { background: transparent; } diff --git a/modules/modes/select.js b/modules/modes/select.js index d23704a93..4c7fea42f 100644 --- a/modules/modes/select.js +++ b/modules/modes/select.js @@ -41,7 +41,7 @@ export function modeSelect(context, selectedIDs) { var behaviors = [ behaviorPaste(context), breatheBehavior, - behaviorHover(context), + behaviorHover(context).on('hover', context.ui().sidebar.hoverModeSelect), behaviorSelect(context), behaviorLasso(context), modeDragNode(context).restoreSelectedIDs(selectedIDs).behavior, diff --git a/modules/ui/sidebar.js b/modules/ui/sidebar.js index 9af0a9a44..8c0b76bc9 100644 --- a/modules/ui/sidebar.js +++ b/modules/ui/sidebar.js @@ -153,6 +153,24 @@ export function uiSidebar(context) { .append('div') .attr('class', 'inspector-hidden inspector-wrap fr'); + var hoverModeSelect = function hoverModeSelect(datum) { + context.container().selectAll('.feature-list-item').classed('hover', false); + + if (context.mode().selectedIDs().length > 1 + && (datum instanceof osmEntity)){ + + var elements = context.container().selectAll('.feature-list-item') + .filter(function (node) { + return node.id === datum.id; + }); + + if (elements.size() > 0){ + elements.classed('hover', true); + } + } + } + + sidebar.hoverModeSelect = _throttle(hoverModeSelect, 200); function hover(datum) { if (datum && datum.__featurehash__) { // hovering on data