From 1bbd496dfe128c9c103c5adf6b69258a41388e44 Mon Sep 17 00:00:00 2001 From: Quincy Morgan Date: Fri, 10 May 2019 10:18:46 -0400 Subject: [PATCH] When selecting an issue in the Issues pane, highlight the issue after selecting the feature Use the same behavior when selecting an issue in the commit sidebar as in the issues pane --- modules/core/validator.js | 23 +++++++++++++++++++++-- modules/ui/commit_warnings.js | 6 +----- modules/ui/entity_issues.js | 25 +++++++++++++++++-------- modules/ui/issues.js | 16 +--------------- 4 files changed, 40 insertions(+), 30 deletions(-) diff --git a/modules/core/validator.js b/modules/core/validator.js index 9ea87accf..80c3ed10b 100644 --- a/modules/core/validator.js +++ b/modules/core/validator.js @@ -1,6 +1,7 @@ import { dispatch as d3_dispatch } from 'd3-dispatch'; import { coreDifference } from './difference'; +import { modeSelect } from '../modes/select'; import { utilArrayGroupBy, utilCallWhenIdle, utilRebind } from '../util'; import { t } from '../util/locale'; import { validationIssueFix } from './validation/models'; @@ -8,7 +9,7 @@ import * as Validations from '../validations/index'; export function coreValidator(context) { - var dispatch = d3_dispatch('validated'); + var dispatch = d3_dispatch('validated', 'focusedIssue'); var validator = utilRebind({}, dispatch, 'on'); var _rules = {}; @@ -108,6 +109,24 @@ export function coreValidator(context) { }); }; + validator.focusIssue = function(issue) { + var extent = issue.extent(context.graph()); + + if (extent) { + var setZoom = Math.max(context.map().zoom(), 19); + context.map().centerZoomEase(extent.center(), setZoom); + + // select the first entity + if (issue.entityIds && issue.entityIds.length) { + window.setTimeout(function() { + var ids = issue.entityIds; + context.enter(modeSelect(context, [ids[0]])); + dispatch.call('focusedIssue', this, issue); + }, 250); // after ease + } + } + }; + validator.getIssuesBySeverity = function(options) { var groups = utilArrayGroupBy(validator.getIssues(options), 'severity'); @@ -121,7 +140,7 @@ export function coreValidator(context) { var issueIDs = _issuesByEntityID[entityID]; if (!issueIDs) return []; - var opts = options || {}; + var opts = options || {}; return Array.from(issueIDs) .map(function(id) { return _issuesByIssueID[id]; }) diff --git a/modules/ui/commit_warnings.js b/modules/ui/commit_warnings.js index 09d9cafd3..049cda400 100644 --- a/modules/ui/commit_warnings.js +++ b/modules/ui/commit_warnings.js @@ -1,5 +1,4 @@ import { t } from '../util/locale'; -import { modeSelect } from '../modes/select'; import { svgIcon } from '../svg/icon'; import { tooltip } from '../util/tooltip'; import { utilEntityOrMemberSelector } from '../util'; @@ -85,10 +84,7 @@ export function uiCommitWarnings(context) { .classed('hover', false); }) .on('click', function(d) { - if (d.entityIds && d.entityIds.length > 0) { - context.map().zoomTo(context.entity(d.entityIds[0])); - context.enter(modeSelect(context, d.entityIds)); - } + context.validator().focusIssue(d); }); } } diff --git a/modules/ui/entity_issues.js b/modules/ui/entity_issues.js index 004b4c8a5..7e396775c 100644 --- a/modules/ui/entity_issues.js +++ b/modules/ui/entity_issues.js @@ -12,12 +12,16 @@ export function uiEntityIssues(context) { var _entityID; // Refresh on validated events - context.validator().on('validated.entity_issues', function() { - _selection.selectAll('.disclosure-wrap-entity_issues') - .call(render); + context.validator() + .on('validated.entity_issues', function() { + _selection.selectAll('.disclosure-wrap-entity_issues') + .call(render); - update(); - }); + update(); + }) + .on('focusedIssue.entity_issues', function(issue) { + makeActiveIssue(issue.id); + }); function entityIssues(selection) { @@ -35,6 +39,12 @@ export function uiEntityIssues(context) { return context.validator().getEntityIssues(_entityID, { includeDisabledRules: true }); } + function makeActiveIssue(issueID) { + _activeIssueID = issueID; + _selection.selectAll('.issue-container') + .classed('active', function(d) { return d.id === _activeIssueID; }); + } + function update() { var issues = getIssues(); @@ -86,9 +96,8 @@ export function uiEntityIssues(context) { .append('div') .attr('class', 'issue-label') .on('click', function(d) { - _activeIssueID = d.id; // expand only the clicked item - selection.selectAll('.issue-container') - .classed('active', function(d) { return d.id === _activeIssueID; }); + + makeActiveIssue(d.id); // expand only the clicked item var extent = d.extent(context.graph()); if (extent) { diff --git a/modules/ui/issues.js b/modules/ui/issues.js index 90f973857..72129316b 100644 --- a/modules/ui/issues.js +++ b/modules/ui/issues.js @@ -7,7 +7,6 @@ import { tooltip } from '../util/tooltip'; import { actionNoop } from '../actions/noop'; import { geoSphericalDistance } from '../geo'; -import { modeSelect } from '../modes/select'; import { svgIcon } from '../svg/icon'; import { uiDisclosure } from './disclosure'; import { uiTooltipHtml } from './tooltipHtml'; @@ -84,20 +83,7 @@ export function uiIssues(context) { .append('li') .attr('class', function (d) { return 'issue severity-' + d.severity; }) .on('click', function(d) { - var extent = d.extent(context.graph()); - if (extent) { - var setZoom = Math.max(context.map().zoom(), 19); - context.map().centerZoomEase(extent.center(), setZoom); - - // select the first entity - if (d.entityIds && d.entityIds.length) { - window.setTimeout(function() { - var ids = d.entityIds; - context.enter(modeSelect(context, [ids[0]])); - utilHighlightEntities(ids, true, context); - }, 250); // after ease - } - } + context.validator().focusIssue(d); }) .on('mouseover', function(d) { utilHighlightEntities(d.entityIds, true, context);