Way of auto-highlighting a match?

[peterlondon1]

Hi Sergei,

In my UI using Bracketry I do some editing of a match when a user clicks on it. That editing necessitates re-loading the page with updated data, and I'd like to automatically re-highlight the element that had been tapped on, so that the user can see the update was done. The highlighting appears when you hover over a match.

Is there some easy way of getting that highlighting?

highlightContestantHistory() will highlight one player. I'd like to highlight both players in a match, together with the box around them (as in the attached screenshot)

thanks.

[sbachinin]

Hi, 1) do you really need to reload the page? Bracketry can re-render a specific match if you call applyMatchesUpdates 2) currently there is no concept of "highlighted match", only this border on hover. So there is no official way to do what you want. But some walkarounds are possible: a) a "live" match also has a border. So, if you don't use this functionality in a normal way, you can set { isLive: true } for a match that needs to be highlighted. (And set a border color via liveMatchBorderColor). b) you can apply a border manually, by setting css style in your js code. Something like:

const matchBodyEl = document.querySelector('.round-wrapper[round-index=0] .match-wrapper[match-order=0] .match-body')
matchBodyEl.style.border = "2px solid #ddd" // (perhaps with "!important")

Also, some editing mode in bracketry can be added in the future. But first I need to understand how much demand is there for such a feature.

[peterlondon1]

I will use the isLive: true workaround. That works for me and I would imagine few people need it for the actual "is live" functionality.

Thanks very much!