Selector/Selector.MAUI/Pages/Now.razor

@page "/now"
@using Selector.SignalR;
@using System.Linq;
@implements IDisposable

<h1 class="text-center">Now</h1>

<div class="app text-center">

    <NowPlayingCard Track="@nowCache.LastPlaying?.Track" Episode="@nowCache.LastPlaying?.Episode" />
    <PlayCountCard Track="@nowCache.LastPlaying?.Track" Count="@nowCache.LastPlayCount" Username="@nowCache.LastPlayCount?.Username" />

    @if (nowCache.LastPlayCount?.AlbumCountData?.Count() > 3)
    {
        <div class="chart-card card">
            <RadzenChart>
                <RadzenLineSeries Smooth="@smooth" Data="@nowCache.LastPlayCount.ArtistCountData" CategoryProperty="TimeStamp" Title="Artist" ValueProperty="Value" Stroke="#598556" StrokeWidth="@strokeWidth">
                    <RadzenSeriesDataLabels Visible="@showDataLabels" />
                </RadzenLineSeries>
                <RadzenLineSeries Smooth="@smooth" Data="@nowCache.LastPlayCount.AlbumCountData" CategoryProperty="TimeStamp" Title="Album" ValueProperty="Value" Stroke="#a34c77" StrokeWidth="@strokeWidth">
                    <RadzenSeriesDataLabels Visible="@showDataLabels" />
                </RadzenLineSeries>
                <RadzenLineSeries Smooth="@smooth" Data="@nowCache.LastPlayCount.TrackCountData" CategoryProperty="TimeStamp" Title="Track" ValueProperty="Value" Stroke="#7a99c2" StrokeWidth="@strokeWidth">
                    <RadzenSeriesDataLabels Visible="@showDataLabels" />
                </RadzenLineSeries>
                <RadzenValueAxis>
                    <RadzenGridLines Visible="true" />
                </RadzenValueAxis>
                <RadzenCategoryAxis>
                    <RadzenGridLines Visible="true" />
                </RadzenCategoryAxis>
                <RadzenLegend Position="LegendPosition.Bottom" />
            </RadzenChart>
        </div>
    }

    @if (nowCache.LastPlayCount?.TrackCountData?.Count() > 3)
    {
        <div class="chart-card card">
            <h2>Track History</h2>
            <RadzenChart>
                <RadzenLineSeries Smooth="@smooth" Data="@nowCache.LastPlayCount.TrackCountData" CategoryProperty="TimeStamp" Title="Track" ValueProperty="Value" Stroke="#7a99c2" StrokeWidth="@strokeWidth">
                    <RadzenSeriesDataLabels Visible="@showDataLabels" />
                </RadzenLineSeries>
                <RadzenValueAxis>
                    <RadzenGridLines Visible="true" />
                </RadzenValueAxis>
                <RadzenCategoryAxis>
                    <RadzenGridLines Visible="true" />
                </RadzenCategoryAxis>
                <RadzenLegend Visible="false" />
            </RadzenChart>
        </div>
    }

    @if (nowCache.LastPlayCount?.AlbumCountData?.Count() > 3)
    {
        <div class="chart-card card">
            <h2>Album History</h2>
            <RadzenChart>
                <RadzenLineSeries Smooth="@smooth" Data="@nowCache.LastPlayCount.AlbumCountData" CategoryProperty="TimeStamp" Title="Album" ValueProperty="Value" Stroke="#a34c77" StrokeWidth="@strokeWidth">
                    <RadzenSeriesDataLabels Visible="@showDataLabels" />
                </RadzenLineSeries>
                <RadzenValueAxis>
                    <RadzenGridLines Visible="true" />
                </RadzenValueAxis>
                <RadzenCategoryAxis>
                    <RadzenGridLines Visible="true" />
                </RadzenCategoryAxis>
                <RadzenLegend Visible="false" />
            </RadzenChart>
        </div>
    }

    @if (nowCache.LastPlayCount?.ArtistCountData?.Count() > 3)
    {
        <div class="chart-card card">
            <h2>Artist History</h2>
            <RadzenChart>
                <RadzenLineSeries Smooth="@smooth" Data="@nowCache.LastPlayCount.ArtistCountData" CategoryProperty="TimeStamp" Title="Artist" ValueProperty="Value" Stroke="#598556" StrokeWidth="@strokeWidth">
                    <RadzenSeriesDataLabels Visible="@showDataLabels" />
                </RadzenLineSeries>
                <RadzenValueAxis>
                    <RadzenGridLines Visible="true" />
                </RadzenValueAxis>
                <RadzenCategoryAxis>
                    <RadzenGridLines Visible="true" />
                </RadzenCategoryAxis>
                <RadzenLegend Visible="false" />
            </RadzenChart>
        </div>
    }

</div>

<div class="v-space"></div>

@code {
    [Inject]
    private NowHubCache nowCache { get; set; }

    private bool smooth = true;
    private bool showDataLabels = false;
    private double strokeWidth = 5;

    protected override void OnInitialized()
    {
        nowCache.NewNowPlaying += OnNewPlaying;
        nowCache.NewCard += OnNewCard;
        nowCache.NewPlayCount += OnNewPlayCount;
        nowCache.NewAudioFeature += OnNewAudioFeature;
    }

    private void OnNewPlaying(object sender, EventArgs args)
    {
        Update();
    }

    private void OnNewCard(object sender, EventArgs args)
    {
        Update();
    }

    private void OnNewPlayCount(object sender, EventArgs args)
    {
        Update();
    }

    private void OnNewAudioFeature(object sender, EventArgs args)
    {
        Update();
    }

    public void Update()
    {
        Application.Current.Dispatcher.Dispatch(() =>
        {
            StateHasChanged();
        });
    }

    public void Dispose()
    {
        nowCache.NewNowPlaying -= OnNewPlaying;
        nowCache.NewCard -= OnNewCard;
        nowCache.NewPlayCount -= OnNewPlayCount;
        nowCache.NewAudioFeature -= OnNewAudioFeature;
    }
}