Lectureplan/UWLecturePlan/Views/Lecture/Index.cshtml

@using System.Text.RegularExpressions
@using System.Globalization;
@model LecturesViewModel
@{
    ViewData["Title"] = "Vorlesungsplan";

    string GetBranchName(string branch)
    {
        Regex regex = new Regex(@".* - (.*)");

        var match = regex.Match(branch);
        if (match.Success)
        {
            return match.Groups[1].Value;
        }
        else
        {
            return branch;
        }
    }
}

@section Header {
    <search class="container-fluid">
        <form method="get" class=" mb-2">
            <div class="row g-1">
                <div class="order-1 col-6 col-sm-3 col-md-2 col-lg-2 col-xl-2 col-xxl-1">
                    <label for="Semester" class="form-label">Semester:</label>
                    <select asp-for="Semester" class="form-select">
                        @foreach (var semester in Model.Semesters)
                        {
                            <option value="@semester">
                                @semester
                            </option>
                        }
                    </select>
                </div>
                <div class="order-1  col-6 col-sm-3 col-md-3 col-lg-2 col-xl-2 col-xxl-2">
                    <label for="Date" class="form-label">Datum:</label>
                    <select asp-for="Date" class="form-select">
                        @foreach (var day in Model.Days)
                        {
                            if (@day.Key.ToString("dd.MM.yyyy") == Model.Date)
                            {
                                <option value="@day.Key.ToString("dd.MM.yyyy")" selected>
                                    @day.Key.ToString("ddd dd.MM.yyyy", CultureInfo.GetCultureInfo("de"))
                                </option>
                            }
                            else
                            {
                                <option value="@day.Key.ToString("dd.MM.yyyy")">
                                    @day.Key.ToString("ddd dd.MM.yyyy", CultureInfo.GetCultureInfo("de"))
                                </option>
                            }
                        }
                    </select>
                </div>
                <div class="order-1  col-12 col-sm-6 col-md-7 col-lg-3 col-xxl-2">
                    <label class="form-label" for="Location">Ort:</label>  <input type="text" asp-for="Location" class="form-control" />
                </div>
                <div class="order-1 col-12 col-sm-10 col-lg-4 col-xxl">
                    <label for="TypeFilter" class="form-label">Typ:</label>
                    <select type="text" asp-for="TypeFilter" class="form-select">
                        <option value="">Alle</option>
                        @foreach (var branch in Model.Types.OrderBy(x => GetBranchName(x)))
                        {
                            <option value="@branch">
                                @GetBranchName(branch)
                            </option>
                        }
                    </select>
                </div>
                <div class="col-12 col-xxl order-0 order-xxl-1 col-xxl-3">
                    <label for="Branch" class="form-label">Studiengang:</label>

                    <select type="text" asp-for="Branch" class="form-select">
                        <option value="">Alle</option>
                        @foreach (var branch in Model.Branches.OrderBy(x => GetBranchName(x)))
                        {
                            <option value="@branch">
                                @GetBranchName(branch)
                            </option>
                        }
                    </select>
                </div>

                <div class="order-1 col-12 col-sm-2 col-lg-1 align-self-end text-end">
                    <input type="submit" value="Filter" class="btn btn-primary w-100" />
                </div>
            </div>
        </form>
    </search>
}

<div class="container-fluid" id="lectures">
    <div class="accordion">
        @foreach (var time in Model.LectureEvents.GroupBy(x => x.From).OrderBy(x => x.Key))
        {
            string timeId = time.Key.ToString("HHmm");
            string timeHeader = $"header-{timeId}";
            string timeCollapse = $"collapse-{timeId}";
            string timeAccordion = $"accordion-{timeId}";
            <div class="accordion-item">
                <h2 id="@timeHeader" class="accordion-header">
                    <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#@timeCollapse" aria-expanded="false" aria-controls="@timeCollapse">
                        @time.Key.ToString("HH:mm")
                    </button>
                </h2>
                <div id="@timeCollapse" class="accordion-collapse collapse" aria-labelledby="@timeHeader">
                    <div class="accordion-body">
                        <div class="accordion accordion-flush" id="@timeAccordion">

                            @foreach (var eventItem in time.Distinct().OrderBy(x => x.Lecture.Title))
                            {
                                string eventId = $"{timeId}-{eventItem.Id}";
                                string eventHeader = $"header-{eventId}";
                                string eventCollapse = $"collapse-{eventId}";
                                <div class="accordion-item">
                                    <h3 id="@eventHeader" class="accordion-header">
                                        <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#@eventCollapse" aria-expanded="false" aria-controls="@eventCollapse">
                                            @Html.Raw(eventItem.Lecture.Title)
                                        </button>
                                    </h3>
                                    <div id="@eventCollapse" class="accordion-collapse collapse" aria-labelledby="@eventHeader" data-bs-parent="#@timeAccordion">
                                        <div class="accordion-body">
                                            <div class="time">
                                                <span>Zeitraum:</span>
                                                <time datetime="@eventItem.From.ToString("HH:mm")" class="fw-bolder">@eventItem.From.ToString("HH:mm")</time> - <time datetime="@eventItem.To.ToString("HH:mm")" class="fw-bolder">@eventItem.To.ToString("HH:mm")</time>
                                            </div>
                                            <div class="room">
                                                <span>Ort:</span>
                                                <address class="d-inline fw-bolder">@eventItem.Location</address>
                                            </div>
                                            <a href="@eventItem.Lecture.Url">@eventItem.Lecture.Url</a>
                                        </div>
                                    </div>
                                </div>
                            }
                        </div>
                    </div>
                </div>
            </div>
        }
    </div>
</div>


<noscript>
    <style>
        #lectures {
            display: none;
        }

        details {
        }

            details > :not(summary) {
                margin-left: 15px;
            }
    </style>
    @foreach (var time in Model.LectureEvents.GroupBy(x => x.From).OrderBy(x => x.Key))
    {
        <details>
            <summary>@time.Key.ToString("HH:mm")</summary>
            @foreach (var eventItem in time.Distinct().OrderBy(x => x.Lecture.Title))
            {
                <details class="lecture">
                    <summary class="title">@eventItem.Lecture.Title</summary>

                    <div class="time">Zeitraum: @eventItem.From.ToString("HH:mm") - @eventItem.To.ToString("HH:mm")</div>
                    <div class="room">Ort: @eventItem.Location</div>

                    <a href="@eventItem.Lecture.Url">@eventItem.Lecture.Url</a>

                </details>
            }

        </details>
    }
</noscript>