@using System.Globalization;
@model CompositionQueryModel
@{
    string possessiveS = "\'s";

    ViewData["Title"] = $"{(Model.Username != null ? Model.Username + possessiveS : null)} Works";
}

@if (Model.Username != null)
{
    <h1 class="text-center">
        <a style="text-decoration: none" asp-controller="User" asp-action="Profile" asp-route-userId="@Model.UserId">@Model.Username</a>'s Works
    </h1>
}
else
{
    <h1 class="text-center">@ViewData["Title"]</h1>
}
<hr />
<form method="get">
    <div class="container">
        <div class="row">
            <div class="form-select">
                <label asp-for="SelectedGenres">Genres:</label>
                <select asp-for="SelectedGenres" class="form-control" multiple="true">
                    <option value="">All</option>
                    @foreach (GenreViewModel genre in Model.Genres.OrderBy(g => g.Name))
                    {
                        <option value="@genre.Id">@genre.Name</option>
                    }
                </select>
            </div>
            <div class="form-group col-md-3">
                <label asp-for="SearchTerm">Search term:</label>
                <input asp-for="SearchTerm" class="form-control" placeholder="Search term...">
            </div>
            <div class="form-group col-md-3">
                <div class="form-group">
                    <label asp-for="DateSorting">Sort by date:</label>
                    <select asp-for="DateSorting" class="form-control">
                        <option value="1">Newest first</option>
                        <option value="0">Oldest first</option>
                    </select>
                </div>
            </div>
            <div class="form-group col-md-3">
                <div class="form-group">
                    <label asp-for="RatingSorting">Sort by rating:</label>
                    <select asp-for="RatingSorting" class="form-control">
                        <option value="1">Top rated first</option>
                        <option value="0">Worst rated first</option>
                    </select>
                </div>
            </div>
            <input hidden asp-for="UserId" class="form-control" value="@Model.UserId">
            <div class="form-group col-md-3">
                <div class="form-group mt-4">
                    <input type="submit" value="Search" class="btn btn-primary" />
                </div>
            </div>
        </div>
    </div>
</form>
@{
    int previousPage = Model.CurrentPage - 1;

    if (previousPage < 1)
    {
        previousPage = 1;
    }

    double maxPage = Math.Ceiling((double)Model.CompositionsCount / Model.CompositionsPerPage);
}
<div class="container" style="margin-top: 1rem">
    <div class="row mb-5">
        <ul class="pagination justify-content-center">
            <li class="page-item">
                <a class="btn btn-primary @(Model.CurrentPage == 1 ? "disabled" : string.Empty)"
                   asp-controller="Composition"
                   asp-action="All"
                   asp-route-userId="@Model.UserId"
                   asp-route-currentPage="1"
                   asp-route-selectedGenres="@($"{(!Model.SelectedGenres.Any() ? "" : Model.SelectedGenres)}")"
                   asp-route-searchTerm="@Model.SearchTerm"
                   asp-route-dateSorting="@((int)Model.DateSorting)"
                   asp-route-ratingSorting="@((int)Model.RatingSorting)">@Html.Raw("<<")</a>
            </li>
            <li class="page-item">
                <a class="btn btn-primary @(Model.CurrentPage == 1 ? "disabled" : string.Empty)"
                   asp-controller="Composition"
                   asp-action="All"
                   asp-route-userId="@Model.UserId"
                   asp-route-currentPage="@previousPage"
                   asp-route-selectedGenres="@($"{(!Model.SelectedGenres.Any() ? "" : Model.SelectedGenres)}")"
                   asp-route-searchTerm="@Model.SearchTerm"
                   asp-route-dateSorting="@((int)Model.DateSorting)"
                   asp-route-ratingSorting="@((int)Model.RatingSorting)">
                    @Html.Raw("<")
                </a>
            </li>
            @if (Model.CurrentPage > 1)
            {
                <li class="page-item">
                    <a class="btn btn-primary"
                       asp-controller="Composition"
                       asp-action="All"
                       asp-route-userId="@Model.UserId"
                       asp-route-currentPage="@previousPage"
                       asp-route-selectedGenres="@($"{(!Model.SelectedGenres.Any() ? "" : Model.SelectedGenres)}")"
                       asp-route-searchTerm="@Model.SearchTerm"
                       asp-route-dateSorting="@((int)Model.DateSorting)"
                       asp-route-ratingSorting="@((int)Model.RatingSorting)">
                        @previousPage
                    </a>
                </li>
            }
            <li class="page-item" style="margin-left: 1rem; margin-right: 1rem">
                <p class="btn btn-info">@Model.CurrentPage</p>
            </li>
            @if (Model.CurrentPage < maxPage)
            {
                <li class="page-item">
                    <a class="btn btn-primary"
                       asp-controller="Composition"
                       asp-action="All"
                       asp-route-userId="@Model.UserId"
                       asp-route-currentPage="@(Model.CurrentPage + 1)"
                       asp-route-selectedGenres="@($"{(!Model.SelectedGenres.Any() ? "" : Model.SelectedGenres)}")"
                       asp-route-searchTerm="@Model.SearchTerm"
                       asp-route-dateSorting="@((int)Model.DateSorting)"
                       asp-route-ratingSorting="@((int)Model.RatingSorting)">
                        @(Model.CurrentPage + 1)
                    </a>
                </li>
            }
            @{
                bool shouldButtonBeDisabled = Model.CurrentPage == maxPage || !Model.Compositions.Any();
            }
            <li class="page-item">
                <a class="btn btn-primary @(shouldButtonBeDisabled ? "disabled" : string.Empty)"
                   asp-controller="Composition"
                   asp-action="All"
                   asp-route-userId="@Model.UserId"
                   asp-route-currentPage="@(Model.CurrentPage + 1)"
                   asp-route-selectedGenres="@($"{(!Model.SelectedGenres.Any() ? "" : Model.SelectedGenres)}")"
                   asp-route-searchTerm="@Model.SearchTerm"
                   asp-route-dateSorting="@((int)Model.DateSorting)"
                   asp-route-ratingSorting="@((int)Model.RatingSorting)">
                    @Html.Raw(">")
                </a>
            </li>
            <li class="page-item">
                <a class="btn btn-primary @(shouldButtonBeDisabled ? "disabled" : string.Empty)"
                   asp-controller="Composition"
                   asp-action="All"
                   asp-route-userId="@Model.UserId"
                   asp-route-currentPage="@maxPage"
                   asp-route-selectedGenres="@($"{(!Model.SelectedGenres.Any() ? "" : Model.SelectedGenres)}")"
                   asp-route-searchTerm="@Model.SearchTerm"
                   asp-route-dateSorting="@((int)Model.DateSorting)"
                   asp-route-ratingSorting="@((int)Model.RatingSorting)">
                    @Html.Raw(">>")
                </a>
            </li>
        </ul>
    </div>
</div>
@if (!Model.Compositions.Any())
{
    <h2 class="text-center">No compositions found with the given criteria!</h2>
}
else
{
    <div class="row row-cols-1 row-cols-md-3 g-4">

        @foreach (CompositionViewModel composition in Model.Compositions)
        {
            <div class="col">
                <partial name="_CompositionAllPartial" model="composition"></partial>
            </div>
        }

    </div>
}

@section Scripts{
    <partial name="_ValidationScriptsPartial" />
}