A Razor UI component (Notifications.razor) for the player HUD that renders a single notification from NotificationManager. It picks the notification and displays it in one of three zones (top-center, center, lower-center) with optional image, message text, color and extra CSS.
@namespace KOTH.UI
@using KOTH.Notification
@inherits Panel
@attribute [StyleSheet]
<root>
@if (notification != null && notification.Value.Zone == ENotificationZone.TopCenter)
{
<div class="notification-center-top" style="color: @notification.Value.Color; @notification.Value.Css">
<div class="notification-container">
@if (notification.Value.Image != null)
{
<img class="notification-image" src="@notification.Value.Image" />
}
<label class="notification">@notification.Value.Message</label>
</div>
</div>
}
@if (notification != null && notification.Value.Zone == ENotificationZone.Center)
{
<div class="notification-center" style="color: @notification.Value.Color; @notification.Value.Css">
<div class="notification-container">
@if (notification.Value.Image != null)
{
<img class="notification-image" src="@notification.Value.Image" />
}
<label class="notification" style="@notification.Value.Css">@notification.Value.Message</label>
</div>
</div>
}
@if (notification != null && notification.Value.Zone == ENotificationZone.LowerCenter)
{
<div class="notification-center-lower " style="color: @notification.Value.Color; @notification.Value.Css">
<div class="notification-container">
@if (notification.Value.Image != null)
{
<img class="notification-image" src="@notification.Value.Image" />
}
<label class="notification">@notification.Value.Message</label>
</div>
</div>
}
</root>
@code
{
public FNotification? notification => NotificationManager.Instance.GetNotification();
protected override int BuildHash()
{
if (notification == null)
return 0;
return HashCode.Combine(Time.Now);
}
}