@extends('layouts.admin')

@section('title', 'Questions · '.$exam->name)

@php
    $config = [
        'exam' => ['id' => $exam->id, 'name' => $exam->name, 'status' => $exam->status->value, 'libraryId' => $exam->library_id],
        'canManage' => $canManage,
        'cases' => $cases,
        'questions' => $exam->questions->map(fn ($q) => \App\Http\Controllers\Admin\ExamQuestionController::serialise($q))->values(),
        'questionTypes' => $questionTypes,
        'allItemsText' => \App\Enums\QuestionType::ALL_ITEMS_TEXT,
        'csrf' => csrf_token(),
        'urls' => [
            'store' => route('admin.exams.questions.store', $exam),
            'update' => route('admin.exams.questions.update', [$exam, '__ID__']),
            'destroy' => route('admin.exams.questions.destroy', [$exam, '__ID__']),
            'reorder' => route('admin.exams.questions.reorder', $exam),
            'annotate' => route('admin.xray-annotations.editor', ['__CASE__', '__VIEW__']),
        ],
    ];
@endphp

@section('content')
    <x-ui.page-header title="Exam Questions" :back="route('admin.exams.show', $exam)">
        <x-slot:subtitle>
            <strong>{{ $exam->name }}</strong> &middot; <x-ui.status-badge :value="$exam->status" />
            &middot; Library: {{ $exam->library?->name ?? 'any case' }}
        </x-slot:subtitle>
        <x-slot:actions>
            <span id="builder-status" class="xrt-meta align-self-center"></span>
            @can('preview', $exam)
                <a class="btn btn-sm btn-outline-secondary" href="{{ route('admin.exams.preview', $exam) }}"><i class="bi bi-play-circle"></i> Preview</a>
            @endcan
            <a class="btn btn-sm btn-primary" href="{{ route('admin.exams.show', $exam) }}"><i class="bi bi-check-lg"></i> Done</a>
        </x-slot:actions>
    </x-ui.page-header>

    @unless ($canManage)
        <div class="alert alert-warning py-2">
            <i class="bi bi-lock me-1"></i>
            This exam is <strong>{{ $exam->status->value }}</strong>, so its question set is read-only.
            @if ($exam->isPublished()) Unpublish it from the exam page to make changes. @endif
        </div>
    @endunless

    <script type="application/json" id="exam-builder-config">@json($config)</script>

    <div class="row g-3">
        <div class="col-lg-5">
            <div class="xrt-card">
                <div class="xrt-card-header">
                    <span>Available Content <span class="badge text-bg-light" id="available-count">{{ count($cases) }}</span></span>
                </div>
                <div class="xrt-card-body">
                    <input class="form-control form-control-sm mb-2" id="content-search" placeholder="Search cases or items…" autocomplete="off">
                    <div class="xrt-meta mb-2">Add a whole case as an OK / NOT OK question, or one of its items as an object-location question. Items without a target on any view cannot be added yet.</div>
                    <div id="available-list" class="xrt-builder-list"></div>
                </div>
            </div>
        </div>

        <div class="col-lg-7">
            <div class="xrt-card">
                <div class="xrt-card-header">
                    <span>Selected Questions <span class="badge text-bg-light" id="selected-count">0</span></span>
                    <span class="xrt-meta">Total points: <strong id="selected-points">0</strong> @if ($canManage)&middot; drag to reorder @endif</span>
                </div>
                <div class="xrt-card-body">
                    <div id="selected-list" class="xrt-builder-list"></div>
                </div>
            </div>
        </div>
    </div>

    @include('admin.exams._question-modal')
@endsection

@push('scripts')
    <script src="@xrtAsset('js/exam-builder.js')"></script>
@endpush