@model StoryIntelligenceProgressViewModel
@{
    ViewData["Title"] = "Review characters";
    const int previewLimit = 25;
    var characterCandidates = Model.CharacterReview.Candidates.Take(previewLimit).ToList();
    var hiddenCandidateCount = Math.Max(0, Model.CharacterReview.Candidates.Count - characterCandidates.Count);
}

<section class="onboarding-shell" aria-labelledby="story-character-title">
    <div class="onboarding-panel onboarding-review-panel story-review-page">
        <div class="onboarding-copy story-review-heading">
            <p class="eyebrow">Story Intelligence</p>
            <h1 id="story-character-title">Review Characters</h1>
            <p>Resolve character identity questions before reviewing the rest of the story intelligence.</p>
        </div>

        @if (TempData["OnboardingStoryIntelligenceError"] is string error)
        {
            <div class="alert alert-danger">@error</div>
        }
        @if (TempData["OnboardingStoryIntelligenceMessage"] is string message)
        {
            <div class="alert alert-success">@message</div>
        }

        <p class="onboarding-compact-status">
            @Model.CharacterReview.Candidates.Count.ToString("N0") candidate@(Model.CharacterReview.Candidates.Count == 1 ? string.Empty : "s")
            &middot; @Model.CharacterReview.ExistingMatchCount.ToString("N0") existing match@(Model.CharacterReview.ExistingMatchCount == 1 ? string.Empty : "es")
            &middot; @Model.CharacterReview.NewCandidateCount.ToString("N0") new or alias
            &middot; @Model.CharacterReview.AmbiguousCount.ToString("N0") ambiguous
            &middot; @Model.CharacterReview.GenericReferenceCount.ToString("N0") generic
        </p>

        <section class="story-review-chapter-list" aria-label="Character review">
            @if (Model.CharacterReview.Candidates.Count == 0)
            {
                <div class="story-review-note">
                    <strong>No character decisions are waiting.</strong>
                    <p class="mb-0">Characters are already up to date, or there were no character suggestions ready to import.</p>
                </div>
                <div class="onboarding-actions">
                    <a class="btn btn-outline-secondary" asp-action="StoryIntelligenceReviewCentre" asp-route-batchId="@Model.BatchID">Back to Review Centre</a>
                </div>
            }
            else
            {
                <div class="story-review-card-actions">
                    <button class="btn btn-outline-primary btn-sm" type="button" data-character-bulk="create-all">Create all</button>
                    <button class="btn btn-outline-secondary btn-sm" type="button" data-character-bulk="link-existing">Link existing matches</button>
                    <button class="btn btn-outline-secondary btn-sm" type="button" data-character-bulk="ignore-all">Ignore all</button>
                    <button class="btn btn-outline-secondary btn-sm" type="button" data-character-bulk="expand">Expand all</button>
                    <button class="btn btn-outline-secondary btn-sm" type="button" data-character-bulk="collapse">Collapse all</button>
                    @if (hiddenCandidateCount > 0)
                    {
                        <span class="story-review-page-status">Showing @characterCandidates.Count.ToString("N0") of @Model.CharacterReview.Candidates.Count.ToString("N0")</span>
                    }
                </div>

                <form asp-action="ImportStoryIntelligenceCharacters" method="post" data-character-review-form data-story-review-form>
                    <input type="hidden" name="BatchID" value="@Model.BatchID" />
                    <div class="story-character-card-grid">
                        @for (var i = 0; i < characterCandidates.Count; i++)
                        {
                            var candidate = characterCandidates[i];
                            <details class="story-character-card" open data-character-card>
                                <summary>
                                    <span>
                                        <strong>@candidate.CharacterName</strong>
                                        <small>@candidate.Classification &middot; @candidate.AppearsInScenes.ToString("N0") scene@(candidate.AppearsInScenes == 1 ? string.Empty : "s")</small>
                                    </span>
                                    <em>@candidate.Confidence</em>
                                </summary>

                                <input type="hidden" name="Characters[@i].Key" value="@candidate.Key" />

                                <div class="story-character-card__body" data-character-key="@candidate.Key" data-character-name="@candidate.CharacterName">
                                    <dl>
                                        <div><dt>First appearance</dt><dd>@Display(candidate.ExampleFirstAppearance)</dd></div>
                                        <div><dt>Possible aliases</dt><dd>@(candidate.PossibleAliases.Count == 0 ? "None detected" : string.Join(", ", candidate.PossibleAliases))</dd></div>
                                        @if (!string.IsNullOrWhiteSpace(candidate.NameIntelligenceWarning))
                                        {
                                            <div><dt>Name warning</dt><dd class="text-warning">@candidate.NameIntelligenceWarning</dd></div>
                                        }
                                        <div><dt>Existing match</dt><dd>@(candidate.ExistingCharacterName ?? "None")</dd></div>
                                    </dl>

                                    @if (candidate.IsExistingMatch)
                                    {
                                        <div class="story-review-note">
                                            <strong>Possible existing character</strong>
                                            <p>@candidate.CharacterName may already be @candidate.ExistingCharacterName. Choose whether to link them or create a separate character.</p>
                                        </div>
                                    }

                                    <fieldset class="story-character-actions">
                                        <legend>Decision</legend>
                                        <label>
                                            <input type="radio" name="Characters[@i].Action" value="@StoryIntelligenceCharacterImportActions.CreateNew" @(IsDefault(candidate, StoryIntelligenceCharacterImportActions.CreateNew) ? "checked" : string.Empty) data-character-action />
                                            Create new character
                                        </label>
                                        <label>
                                            <input type="radio" name="Characters[@i].Action" value="@StoryIntelligenceCharacterImportActions.LinkExisting" data-character-action @(candidate.CanLinkExisting ? string.Empty : "disabled") @(IsDefault(candidate, StoryIntelligenceCharacterImportActions.LinkExisting) ? "checked" : string.Empty) />
                                            Link existing character
                                        </label>
                                        <label>
                                            <input type="radio" name="Characters[@i].Action" value="@StoryIntelligenceCharacterImportActions.Alias" @(IsDefault(candidate, StoryIntelligenceCharacterImportActions.Alias) ? "checked" : string.Empty) data-character-action />
                                            Alias of another character
                                        </label>
                                        <label>
                                            <input type="radio" name="Characters[@i].Action" value="@StoryIntelligenceCharacterImportActions.Ignore" @(IsDefault(candidate, StoryIntelligenceCharacterImportActions.Ignore) ? "checked" : string.Empty) data-character-action />
                                            Ignore
                                        </label>
                                    </fieldset>

                                    <div data-character-existing-panel hidden>
                                        <label class="form-label" for="character-existing-@i">Existing character</label>
                                        <select id="character-existing-@i" class="form-select" name="Characters[@i].ExistingCharacterID" data-character-existing-target>
                                            <option value="">Choose character...</option>
                                            @foreach (var existing in candidate.ExistingCharacterOptions)
                                            {
                                                if (candidate.SelectedExistingCharacterID == existing.CharacterID)
                                                {
                                                    <option value="@existing.CharacterID" selected>@existing.CharacterName</option>
                                                }
                                                else
                                                {
                                                    <option value="@existing.CharacterID">@existing.CharacterName</option>
                                                }
                                            }
                                        </select>
                                    </div>

                                    <div data-character-import-name-panel>
                                        <label class="form-label" for="character-import-name-@i">Import name</label>
                                        <input id="character-import-name-@i" class="form-control" name="Characters[@i].ImportName" value="@candidate.ImportName" />
                                    </div>

                                    <div data-character-alias-panel hidden>
                                        <label class="form-label" for="character-alias-target-@i">Alias target</label>
                                        <p class="form-text">Treats both identities as the same physical character and keeps this manuscript name as an alias/reference.</p>
                                        <select id="character-alias-target-@i" class="form-select" name="Characters[@i].AliasTargetCharacterID" data-character-alias-target>
                                            <option value="">Choose character...</option>
                                            @foreach (var target in Model.CharacterReview.AliasTargetOptions)
                                            {
                                                <option value="@target.CharacterID" data-canonical="true">@target.CharacterName</option>
                                            }
                                        </select>
                                    </div>
                                </div>
                            </details>
                        }
                    </div>

                    <div class="onboarding-actions">
                        @if (hiddenCandidateCount > 0)
                        {
                            <span class="text-muted">Save this batch to continue with @hiddenCandidateCount.ToString("N0") more character decision@(hiddenCandidateCount == 1 ? string.Empty : "s").</span>
                        }
                        <a class="btn btn-outline-secondary" asp-action="StoryIntelligenceReviewCentre" asp-route-batchId="@Model.BatchID">Back to Review Centre</a>
                        <button class="btn btn-primary" type="submit" data-busy-label="Saving characters...">Save character decisions</button>
                    </div>
                </form>
            }
        </section>
    </div>
</section>

@section Scripts {
    <script>
        (() => {
            const form = document.querySelector("[data-character-review-form]");
            if (!form) return;

            const cards = () => Array.from(form.querySelectorAll("[data-character-card]"));
            const setAction = (card, action) => {
                const input = card.querySelector(`[data-character-action][value="${action}"]`);
                if (input) {
                    input.checked = true;
                    updateCard(card);
                }
            };
            const actionFor = (card) => card.querySelector("[data-character-action]:checked")?.value || "@StoryIntelligenceCharacterImportActions.CreateNew";
            const isCanonicalTarget = (card) => {
                const action = actionFor(card);
                return action !== "@StoryIntelligenceCharacterImportActions.Ignore" && action !== "@StoryIntelligenceCharacterImportActions.Alias";
            };
            const updateAliasTargets = () => {
                const allCards = cards();
                for (const card of allCards) {
                    const body = card.querySelector("[data-character-key]");
                    const ownKey = body?.getAttribute("data-character-key") || "";
                    const select = card.querySelector("[data-character-alias-target]");
                    if (!select) continue;

                    const previous = select.value;
                    for (const option of Array.from(select.options)) {
                        if (!option.value) continue;
                        if (option.dataset.canonical === "true") {
                            option.disabled = false;
                            continue;
                        }
                        const targetCard = allCards.find(item => item.querySelector("[data-character-key]")?.getAttribute("data-character-key") === option.value);
                        option.disabled = option.value === ownKey || !targetCard || !isCanonicalTarget(targetCard);
                    }
                    if (select.selectedOptions[0]?.disabled) {
                        select.value = "";
                    } else {
                        select.value = previous;
                    }
                }
            };
            const updateCard = (card) => {
                const action = actionFor(card);
                const namePanel = card.querySelector("[data-character-import-name-panel]");
                const aliasPanel = card.querySelector("[data-character-alias-panel]");
                const existingPanel = card.querySelector("[data-character-existing-panel]");
                if (namePanel) namePanel.hidden = action === "@StoryIntelligenceCharacterImportActions.Ignore" || action === "@StoryIntelligenceCharacterImportActions.Alias" || action === "@StoryIntelligenceCharacterImportActions.LinkExisting";
                if (existingPanel) existingPanel.hidden = action !== "@StoryIntelligenceCharacterImportActions.LinkExisting";
                if (aliasPanel) aliasPanel.hidden = action !== "@StoryIntelligenceCharacterImportActions.Alias";
                updateAliasTargets();
            };
            document.querySelectorAll("[data-character-bulk]").forEach(button => {
                button.addEventListener("click", () => {
                    const action = button.getAttribute("data-character-bulk");
                    if (action === "create-all") cards().forEach(card => setAction(card, "@StoryIntelligenceCharacterImportActions.CreateNew"));
                    if (action === "link-existing") cards().forEach(card => {
                        if (card.querySelector(`[data-character-action][value="@StoryIntelligenceCharacterImportActions.LinkExisting"]:not(:disabled)`)) {
                            setAction(card, "@StoryIntelligenceCharacterImportActions.LinkExisting");
                        }
                    });
                    if (action === "ignore-all") cards().forEach(card => setAction(card, "@StoryIntelligenceCharacterImportActions.Ignore"));
                    if (action === "expand") cards().forEach(card => card.open = true);
                    if (action === "collapse") cards().forEach(card => card.open = false);
                });
            });
            form.querySelectorAll("[data-character-action]").forEach(input => {
                input.addEventListener("change", () => updateCard(input.closest("[data-character-card]")));
            });
            cards().forEach(updateCard);
        })();
    </script>
    <script src="~/js/story-review-actions.js" asp-append-version="true"></script>
}

@functions {
    private static string Display(string? value) => string.IsNullOrWhiteSpace(value) ? "Not detected" : value;

    private static bool IsDefault(StoryIntelligenceCharacterReviewCandidateViewModel candidate, string action)
        => string.Equals(candidate.DefaultAction, action, StringComparison.OrdinalIgnoreCase);
}