UI/ReplayReactionPicker.razor
@using System
@using Sandbox
@using Sandbox.UI
@inherits Panel
@namespace BlockParty
@attribute [StyleSheet( "ReplayReactionPicker.razor.scss" )]

<root>
	@if ( Manager?.IsPlacingReaction == true )
	{
		<div class="picker">
			<label class="heading">REACT</label>
            @* <label class="hint">PLACE A REACTION AT THE CURRENT TIME</label> *@
			<div class="effects">
				@foreach ( var effect in ReplayReactionEffects.All )
				{
					<button class="effect @(Manager.ReactionEffect == effect.Id ? "selected" : "")"
						onclick=@(() => Select( effect.Id ))>
						<div class="art" style="background-image: url('@effect.ImagePath'); width: @(effect.Width * 3)px; height: @(effect.Height * 3)px;"></div>
					</button>
				}
			</div>
			@* <label class="hint">(REACTING AGAIN REPLACES PREVIOUS REACTION)</label> *@
			<button class="action" onclick=@Cancel>CANCEL</button>
		</div>
	}
</root>

@code
{
	public GameStage Stage { get; set; }
	private GameManager Manager => GameManager.Instance;
	private void Select( string id ) { Audio.PlaySfx( SfxType.MenuBlip ); Manager?.SelectReaction( id ); }
	private void Cancel() { Audio.PlaySfx( SfxType.MenuStart ); Manager?.CancelReaction(); }
	protected override int BuildHash() => HashCode.Combine( Manager?.IsPlacingReaction ?? false,
		Manager?.ReactionEffect, Manager?.CurrentReplayReactions?.Revision ?? 0 );
}