@model IEnumerable<KernelRecordsMVC.Models.Release>

<div class="d-flex justify-content-between align-items-center mb-4">

    <div>
        <h1>Music Store</h1>
        <p class="text-muted">
            Browse CDs, vinyl records and cassettes.
        </p>
    </div>

</div>


<!-- SEARCH -->

<form asp-action="Index"
      method="get"
      class="row g-2 mb-4">

    <div class="col-md-6">

        <input type="text"
               name="search"
               value="@ViewBag.Search"
               class="form-control"
               placeholder="Search releases..." />

    </div>


    <div class="col-md-3">

        <select name="genre"
                class="form-select">

            <option value="">
                All genres
            </option>

            @foreach (var genre in ViewBag.Genres)
            {
                <option value="@genre"
                        selected="@(ViewBag.Genre == genre)">

                    @genre

                </option>
            }

        </select>

    </div>


    <div class="col-md-3">

        <button type="submit"
                class="btn btn-primary w-100">

            Search

        </button>

    </div>

</form>


<!-- RELEASES -->

<div class="row">

@foreach (var release in Model)
{
    <div class="col-md-4 mb-4">

        <div class="card h-100 shadow-sm">

            @if (!string.IsNullOrEmpty(release.CoverPhoto))
            {
                <img src="@release.CoverPhoto"
                     class="card-img-top"
                     style="height:300px; object-fit:cover;"
                     alt="@release.Title" />
            }

            <div class="card-body">

                <h4 class="card-title">
                    @release.Title
                </h4>

                <p class="text-muted mb-1">
                    @release.Genre
                </p>

                <p class="small">
                    @release.ReleaseDate.ToString("yyyy")
                </p>


                <!-- ARTISTS -->

                <p>

                    @string.Join(
                        ", ",
                        release.ReleaseArtists
                            .OrderBy(x => x.ReleaseOrdinal)
                            .Select(x => x.Artist.ArtistName)
                    )

                </p>


                <!-- AVAILABLE FORMATS -->

                <div class="mb-3">

                    @foreach (var product in release.Products)
                    {
                        <span class="badge bg-secondary me-1">

                            @product.Format

                        </span>
                    }

                </div>


                <a asp-action="Details"
                   asp-route-id="@release.ReleaseId"
                   class="btn btn-primary">

                    View Release

                </a>

            </div>

        </div>

    </div>
}

</div>