@model IEnumerable<SharedLibraryCore.Dtos.ServerInfo>
@using WebfrontCore.ViewModels

<div class="content mt-20 row">
    <div class="col-12 col-lg-9 col-xl-10 mt-0">
        <h2 class="content-title mb-0">Top Players</h2>
        <span class="text-muted">
            <color-code value="@(Model.FirstOrDefault(m => m.Endpoint == ViewBag.SelectedServerId)?.Name ?? ViewBag.Localization["WEBFRONT_STATS_INDEX_ALL_SERVERS"])"></color-code>
        </span>
        
        <div id="topPlayersContainer">
            @await Component.InvokeAsync("TopPlayers", new { count = 25, offset = 0, serverEndpoint = ViewBag.SelectedServerId })
        </div>
        <div class="text-center">
            <i id="loaderLoad" class="oi oi-chevron-bottom loader-load-more text-primary mt-5" aria-hidden="true"></i>
        </div>
    </div>

    <!-- side context menu -->
    @{
        var menuItems = new SideContextMenuItems
        {
            MenuTitle = "Game", Items = Model.Select(server => new SideContextMenuItem
            {
                IsLink = true,
                Reference = Url.Action("TopPlayers", "Stats", new { serverId = server.Endpoint }),
                Title = server.Name.StripColors(),
                IsActive = ViewBag.SelectedServerId == server.Endpoint
            }).Prepend(new SideContextMenuItem
            {
                IsLink = true,
                Reference = Url.Action("TopPlayers", "Stats"),
                Title = ViewBag.Localization["WEBFRONT_STATS_INDEX_ALL_SERVERS"],
                IsActive = ViewBag.SelectedServerId is null
            }).ToList()
        };
    }
    <partial name="_SideContextMenu" for="@menuItems"></partial>
</div>

@section scripts
{
    <environment include="Development">
        <script type="text/javascript" src="~/js/stats.js"></script>
    </environment>
    <script>initLoader('/Stats/GetTopPlayersAsync', '#topPlayersContainer', 25);</script>
}