<?php
use App\Core\Csrf;

$errors = $_SESSION['form_errors'] ?? [];
$old = $_SESSION['old'] ?? [];
unset($_SESSION['form_errors'], $_SESSION['old']);

function workshop_value(
    string $key,
    string $default = ''
): string {
    return htmlspecialchars(
        (string)($GLOBALS['old'][$key] ?? $default)
    );
}

$oldPublicIds = array_map(
    'intval',
    $old['public_ids'] ?? []
);
?>
<link
    rel="stylesheet"
    href="/public/assets/css/cda-v4-11-1.css"
>

<section class="page-intro">
    <div>
        <span class="page-kicker">
            Cours et ateliers
        </span>

        <h2>Nouveau cours</h2>

        <p>
            Sélectionnez Enfant, Adulte ou les deux.
            Le code ENF, ADU ou MIX sera généré
            automatiquement.
        </p>
    </div>

    <a
        class="button button-secondary"
        href="/public/ateliers"
    >
        Retour aux cours
    </a>
</section>

<?php if ($errors): ?>
<div class="alert alert-error">
    <ul>
        <?php foreach ($errors as $error): ?>
        <li>
            <?= htmlspecialchars((string)$error) ?>
        </li>
        <?php endforeach; ?>
    </ul>
</div>
<?php endif; ?>

<form
    method="post"
    action="/public/ateliers"
    class="v4-form"
>
    <?= Csrf::field() ?>

    <section class="form-card">
        <header class="form-card-header">
            <div class="form-step">1</div>

            <div>
                <h3>
                    Pôle, discipline et public
                </h3>

                <p>
                    Le public peut être Enfant,
                    Adulte ou Mixte.
                </p>
            </div>

            <div class="form-icon">🎨</div>
        </header>

        <div class="course-code-preview">
            <span>Code automatique du cours</span>

            <strong id="courseCodePreview">
                PÔLE-DISCIPLINE-PUBLIC
            </strong>

            <small>
                ENF = enfant, ADU = adulte,
                MIX = enfant et adulte.
            </small>
        </div>

        <div class="form-grid grid-4">
            <label class="field">
                <span>Pôle *</span>

                <select
                    required
                    name="pole_id"
                    id="poleSelect"
                >
                    <option value="">
                        Choisir un pôle
                    </option>

                    <?php foreach ($poles as $pole): ?>
                    <option
                        value="<?= (int)$pole['id'] ?>"
                        data-code="<?= htmlspecialchars(
                            (string)$pole['code']
                        ) ?>"
                        <?= (int)($old['pole_id'] ?? 0)
                            === (int)$pole['id']
                            ? 'selected'
                            : '' ?>
                    >
                        <?= htmlspecialchars(
                            (string)$pole['libelle']
                        ) ?>
                    </option>
                    <?php endforeach; ?>
                </select>
            </label>

            <label class="field">
                <span>Discipline *</span>

                <select
                    required
                    name="discipline_id"
                    id="disciplineSelect"
                >
                    <option value="">
                        Choisir une discipline
                    </option>

                    <?php foreach (
                        $disciplines as $discipline
                    ): ?>
                    <option
                        value="<?= (int)$discipline['id'] ?>"
                        data-pole="<?= (int)$discipline['pole_id'] ?>"
                        data-code="<?= htmlspecialchars(
                            (string)$discipline['code']
                        ) ?>"
                        <?= (int)($old['discipline_id'] ?? 0)
                            === (int)$discipline['id']
                            ? 'selected'
                            : '' ?>
                    >
                        <?= htmlspecialchars(
                            (string)$discipline['libelle']
                        ) ?>
                    </option>
                    <?php endforeach; ?>
                </select>
            </label>

            <label
                class="field"
                style="grid-column: span 2"
            >
                <span>Libellé du cours *</span>

                <input
                    required
                    name="libelle"
                    value="<?= workshop_value('libelle') ?>"
                    placeholder="Trompette, Théâtre, Dessin…"
                >
            </label>
        </div>

        <div class="public-selection">
            <div class="public-selection-title">
                <div>
                    <strong>
                        Public(s) autorisé(s) *
                    </strong>

                    <span>
                        Au moins une case doit être cochée.
                    </span>
                </div>

                <b id="audienceBadge">Aucun public</b>
            </div>

            <div class="public-choice-grid">
                <?php foreach ($publics as $public): ?>
                <label
                    class="public-choice <?= $public['code'] === 'ENF'
                        ? 'child'
                        : 'adult' ?>"
                >
                    <input
                        type="checkbox"
                        name="public_ids[]"
                        value="<?= (int)$public['id'] ?>"
                        data-public-code="<?= htmlspecialchars(
                            (string)$public['code']
                        ) ?>"
                        <?= in_array(
                            (int)$public['id'],
                            $oldPublicIds,
                            true
                        ) ? 'checked' : '' ?>
                    >

                    <span class="public-icon">
                        <?= $public['code'] === 'ENF'
                            ? '🧒'
                            : '👤' ?>
                    </span>

                    <span>
                        <strong>
                            <?= htmlspecialchars(
                                (string)$public['libelle']
                            ) ?>
                        </strong>

                        <small>
                            Code :
                            <?= htmlspecialchars(
                                (string)$public['code']
                            ) ?>
                        </small>
                    </span>
                </label>
                <?php endforeach; ?>
            </div>
        </div>

        <div
            id="musicChildWarning"
            class="music-child-warning"
            hidden
        >
            <strong>
                Contrôle CE1 obligatoire
            </strong>

            <p>
                Pour tout participant enfant inscrit
                à un cours du pôle Musique,
                le niveau scolaire devra être
                au minimum CE1.
            </p>
        </div>
    </section>

    <section class="form-card">
        <header class="form-card-header">
            <div class="form-step pink">2</div>

            <div>
                <h3>Organisation du cours</h3>

                <p>
                    Ces informations seront utilisées
                    pour créer les groupes.
                </p>
            </div>

            <div class="form-icon pink">▦</div>
        </header>

        <div class="form-grid grid-4">
            <label class="field">
                <span>Type de cours</span>

                <select name="type_atelier">
                    <option value="individuel">
                        Individuel
                    </option>

                    <option value="collectif">
                        Collectif
                    </option>

                    <option value="ponctuel">
                        Ponctuel
                    </option>

                    <option value="stage">
                        Stage
                    </option>

                    <option value="master_class">
                        Master class
                    </option>
                </select>
            </label>

            <label class="field">
                <span>Durée standard</span>

                <input
                    type="number"
                    min="5"
                    step="5"
                    name="duree_standard_minutes"
                    value="<?= workshop_value(
                        'duree_standard_minutes'
                    ) ?>"
                    placeholder="60"
                >
            </label>

            <label class="field">
                <span>Capacité indicative</span>

                <input
                    type="number"
                    min="1"
                    name="capacite_max"
                    value="<?= workshop_value(
                        'capacite_max'
                    ) ?>"
                    placeholder="12"
                >
            </label>

            <label class="field">
                <span>Statut</span>

                <select name="statut">
                    <option value="brouillon">
                        Brouillon
                    </option>

                    <option value="ouvert">
                        Ouvert
                    </option>
                </select>
            </label>
        </div>

        <label
            class="field"
            style="margin-top: 16px"
        >
            <span>Description</span>

            <textarea
                name="description"
                rows="5"
            ><?= workshop_value('description') ?></textarea>
        </label>
    </section>

    <div class="sticky-actions">
        <a
            class="button button-secondary"
            href="/public/ateliers"
        >
            Annuler
        </a>

        <button
            class="button button-primary"
            type="submit"
        >
            Créer le cours
        </button>
    </div>
</form>

<script
    src="/public/assets/js/course-publics-v4111.js"
></script>
