From 83f8cd97f6c4cfea42d5996ac8ef320c85a722f9 Mon Sep 17 00:00:00 2001
From: Quincy Morgan <quincy.morgan@icloud.com>
Date: Mon, 11 Feb 2019 09:45:33 -0500
Subject: [PATCH] Add feature highlighting when hovering over their
 corresponding issues

---
 modules/ui/entity_issues.js | 36 +++++++++++++++++++++++-------------
 modules/ui/issues.js        | 17 +++++++++++++++++
 2 files changed, 40 insertions(+), 13 deletions(-)

diff --git a/modules/ui/entity_issues.js b/modules/ui/entity_issues.js
index 5d61f0ffc..4cb82154f 100644
--- a/modules/ui/entity_issues.js
+++ b/modules/ui/entity_issues.js
@@ -1,13 +1,16 @@
 import { dispatch as d3_dispatch } from 'd3-dispatch';
 
 import {
-    select as d3_select
+    select as d3_selectAll
 } from 'd3-selection';
 
 import { t } from '../util/locale';
 import { svgIcon } from '../svg';
 import { uiDisclosure } from './disclosure';
-import { utilRebind } from '../util';
+import {
+    utilRebind,
+    utilHighlightEntity
+} from '../util';
 import { tooltip } from '../util/tooltip';
 import { uiTooltipHtml } from './tooltipHtml';
 
@@ -19,7 +22,7 @@ export function uiEntityIssues(context) {
     context.validator().on('reload.entity_issues', issuesDidReload);
 
     function issuesDidReload() {
-        var selection = d3_select('.entity-issues .disclosure-wrap');
+        var selection = d3_selectAll('.entity-issues .disclosure-wrap');
         renderContent(selection);
         update();
     }
@@ -35,10 +38,10 @@ export function uiEntityIssues(context) {
 
         var issues = context.validator().getIssuesForEntityWithID(_entityID);
 
-        d3_select('.entity-issues')
+        d3_selectAll('.entity-issues')
             .classed('hide', issues.length === 0);
 
-        d3_select('.hide-toggle-entity_issues span')
+        d3_selectAll('.hide-toggle-entity_issues span')
             .text(t('issues.list_title', { count: issues.length }));
     }
 
@@ -48,10 +51,7 @@ export function uiEntityIssues(context) {
 
         var items = selection.selectAll('.issue')
             .data(issues, function(d) {
-                if (d.id) {
-                    return d.id();
-                }
-                return null;
+                return d.id();
             });
 
         // Exit
@@ -63,6 +63,16 @@ export function uiEntityIssues(context) {
             .append('div')
             .attr('class', function (d) {
                 return 'issue severity-' + d.severity;
+            })
+            .on('mouseover.highlight', function(d) {
+                d.entities.forEach(function(entity) {
+                    utilHighlightEntity(entity.id, true, context);
+                });
+            })
+            .on('mouseout.highlight', function(d) {
+                d.entities.forEach(function(entity) {
+                    utilHighlightEntity(entity.id, false, context);
+                });
             });
 
         var label = enter
@@ -79,7 +89,7 @@ export function uiEntityIssues(context) {
 
         label.each(function(d) {
             var iconSuffix = d.severity === 'warning' ? 'alert' : 'error';
-            d3_select(this)
+            d3_selectAll(this)
                 .append('div')
                 .attr('title', t('issues.'+d.severity+'s.icon_tooltip'))
                 .style('display', 'inline')
@@ -93,7 +103,7 @@ export function uiEntityIssues(context) {
 
         enter.each(function(d) {
 
-            var issue = d3_select(this);
+            var issue = d3_selectAll(this);
 
             var list = issue
                 .selectAll('ul.fixes')
@@ -105,7 +115,7 @@ export function uiEntityIssues(context) {
                     .attr('class', 'fixes')
                     .merge(list);
 
-                issue.select('.label')
+                issue.selectAll('.label')
                     .on('click', function() {
                         if (!issue.classed('fixes-open')) {
                             issue.classed('fixes-open', true);
@@ -143,7 +153,7 @@ export function uiEntityIssues(context) {
 
         // open the fixes for the first issue if no others are already open
         if (selection.selectAll('.issue.fixes-open').empty()) {
-            selection.select('.issue:first-child').classed('fixes-open', true);
+            selection.selectAll('.issue:first-child').classed('fixes-open', true);
         }
 
     }
diff --git a/modules/ui/issues.js b/modules/ui/issues.js
index 4c067bb90..fbb63f5ef 100644
--- a/modules/ui/issues.js
+++ b/modules/ui/issues.js
@@ -13,6 +13,9 @@ import { uiDisclosure } from './disclosure';
 import { uiHelp } from './help';
 import { uiMapData } from './map_data';
 import { uiTooltipHtml } from './tooltipHtml';
+import {
+    utilHighlightEntity
+} from '../util';
 
 export function uiIssues(context) {
     var key = t('issues.key');
@@ -139,6 +142,20 @@ export function uiIssues(context) {
                         _map(d.entities, function(e) { return e.id; })
                     ));
                 }
+                // re-highlight the entities
+                d.entities.forEach(function(entity) {
+                    utilHighlightEntity(entity.id, true, context);
+                });
+            })
+            .on('mouseover', function(d) {
+                d.entities.forEach(function(entity) {
+                    utilHighlightEntity(entity.id, true, context);
+                });
+            })
+            .on('mouseout', function(d) {
+                d.entities.forEach(function(entity) {
+                    utilHighlightEntity(entity.id, false, context);
+                });
             });
 
         var label = enter