@if (this.Context is not null) {
Builds
@build.Name
@if (this.hoveredBuild is not null && this.showBuildSnippet) {
} } else { }
@using Daybreak.Shared.Models @using Daybreak.Shared.Models.Builds @using Microsoft.AspNetCore.Components.Web @inject IJSRuntime JSRuntime @code { private bool showBuildSnippet = false; private IBuildEntry? hoveredBuild; private DotNetObjectReference? dotNetRef; private ElementReference containerElement; private ClientBoundingRect boundingRect = new ClientBoundingRect(); private double snippetTop = 0; private double snippetLeft = 0; [Parameter] public required BuildComponentContext? Context { get; init; } [Parameter] public required Action OnBuildClicked { get; init; } [Parameter] public required Action OnLoadPlayerSingleBuildClicked { get; init; } [Parameter] public required Action OnLoadPlayerTeamBuildClicked { get; init; } protected override void OnInitialized() { this.dotNetRef = DotNetObjectReference.Create(this); } [JSInvokable] public void HoverComplete() { if (this.hoveredBuild is not null) { this.showBuildSnippet = true; this.StateHasChanged(); } } private void BuildClicked(IBuildEntry build) { this.OnBuildClicked(build); } private void LoadPlayerSingleBuildClicked() { this.OnLoadPlayerSingleBuildClicked(); } private void LoadPlayerTeamBuildClicked() { this.OnLoadPlayerTeamBuildClicked(); } private async void OnMouseEnter(IBuildEntry build, MouseEventArgs e) { if (this.dotNetRef is null) { return; } // Calculate position relative to the container this.boundingRect = await this.JSRuntime.GetBoundingClientRect(this.containerElement); this.snippetTop = e.ClientY - this.boundingRect.Top + 20; this.snippetLeft = e.ClientX - this.boundingRect.Left + 10; this.showBuildSnippet = false; this.hoveredBuild = null; await this.JSRuntime.HoverDelayStop(); await this.InvokeAsync(this.StateHasChanged); this.showBuildSnippet = false; this.hoveredBuild = build; await this.JSRuntime.HoverDelayStart(this.dotNetRef, nameof(this.HoverComplete)); await this.InvokeAsync(this.StateHasChanged); } private void OnMouseMove(MouseEventArgs e) { // Reposition the snippet while hovering so that it pops up at the current mouse position if (!this.showBuildSnippet) { this.snippetTop = e.ClientY - this.boundingRect.Top + 20; this.snippetLeft = e.ClientX - this.boundingRect.Left + 10; } } private async void CloseSnippet() { this.showBuildSnippet = false; this.hoveredBuild = null; await this.JSRuntime.HoverDelayStop(); } public void Dispose() { if (this.dotNetRef is not null && this.showBuildSnippet) { this.showBuildSnippet = false; this.hoveredBuild = null; } this.dotNetRef?.Dispose(); } }