@model PlotLineListViewModel
@{
    ViewData["Title"] = "Plot Lines";
    ViewData["ProjectSection"] = "Threads";
}

<nav class="breadcrumb-trail" aria-label="Breadcrumb">
    <a asp-controller="Projects" asp-action="Index">Projects</a>
    <a asp-controller="Projects" asp-action="Details" asp-route-id="@Model.Project.ProjectID">@Model.Project.ProjectName</a>
    <span>Plot lines</span>
</nav>

<partial name="_ProjectSectionNav" model="Model.Project" />

<div class="page-heading">
    <div>
        <p class="eyebrow"><a asp-controller="Projects" asp-action="Details" asp-route-id="@Model.Project.ProjectID">@Model.Project.ProjectName</a></p>
        <h1>Plot lines <help-icon key="plotLines.index" /></h1>
    </div>
    <div class="button-row">
        <a class="btn btn-primary" asp-action="Create" asp-route-projectId="@Model.Project.ProjectID">Add plot line</a>
    </div>
</div>

<section class="list-section">
    @if (!Model.PlotLines.Any())
    {
        <p class="muted">No plot lines yet. Add one to create the first timeline lane.</p>
    }
    else
    {
        <div class="table-responsive">
            <table class="table align-middle">
                <thead>
                    <tr>
                        <th>Colour</th>
                        <th>Name</th>
                        <th>Type</th>
                        <th>Importance</th>
                        <th>Book</th>
                        <th>Timeline</th>
                        <th></th>
                    </tr>
                </thead>
                <tbody>
                    @foreach (var plotLine in Model.PlotLines)
                    {
                        <tr>
                            <td><span class="colour-swatch" style="background:@plotLine.Colour"></span></td>
                            <td><a asp-action="Edit" asp-route-id="@plotLine.PlotLineID">@plotLine.PlotLineName</a></td>
                            <td>@plotLine.PlotLineTypeName</td>
                            <td>@plotLine.PlotImportanceName</td>
                            <td>@(plotLine.BookTitle ?? "Project-wide")</td>
                            <td>@(plotLine.IsVisibleOnTimeline ? "Visible" : "Hidden")</td>
                            <td class="text-end">
                                <a class="btn btn-outline-secondary btn-sm" asp-controller="Timeline" asp-action="Index" asp-route-ProjectID="@Model.Project.ProjectID" asp-route-FocusType="plotline" asp-route-FocusID="@plotLine.PlotLineID">Focus</a>
                                <a class="btn btn-outline-secondary btn-sm" asp-controller="PlotThreads" asp-action="Create" asp-route-projectId="@Model.Project.ProjectID" asp-route-plotLineId="@plotLine.PlotLineID">Add thread</a>
                                <a class="btn btn-outline-secondary btn-sm" asp-action="Edit" asp-route-id="@plotLine.PlotLineID">Edit</a>
                                <form asp-action="Archive" method="post" class="archive-button-form" data-confirm-message="Archive this plot line?&#10;&#10;This will hide it from active lists and timelines, but the data will be kept and can be restored later.">
                                    <input type="hidden" name="id" value="@plotLine.PlotLineID" />
                                    <input type="hidden" name="projectId" value="@Model.Project.ProjectID" />
                                    <button class="btn btn-outline-danger btn-sm" type="submit">Archive</button>
                                </form>
                            </td>
                        </tr>
                    }
                </tbody>
            </table>
        </div>
    }
</section>