{{-- Les photos de la page, par chantier (un retour de chantier par carte),
     ou toutes à la suite (« Mosaïque », $photos). Une photo : _tuile.

     Une vignette ouvre la photo dans le panneau de droite (lien `?photo=`,
     intercepté par js/phototheque.js) ; la loupe l'ouvre en grand
     (js/visionneuse.js), et la visionneuse défile sur toute la page. La case
     la met dans la sélection, que la barre du haut étiquette d'un coup.

     Une vidéo (reprise de digiKam) se lit dans la visionneuse comme une
     photo s'y regarde (`data-video`), et dans le panneau. --}}

@php
    $peutModifier = auth()->user()?->can('photos.edit');
    $peutTrier = auth()->user()?->can('photos.delete');
    $peutPublier = auth()->user()?->can('photos.publier');
    $ouverte = $photo?->id;
    $dansLaCorbeille = $filtres->vue === 'corbeille';
    // Cocher sert à étiqueter, publier ou jeter ; dans la corbeille, seulement à restaurer.
    $peutSelectionner = $dansLaCorbeille ? $peutTrier : ($peutModifier || $peutTrier || $peutPublier);
@endphp

<div class="d-flex flex-wrap align-items-center gap-2 mb-3">
    @foreach ($actifs as $actif)
        <a href="{{ $actif['url'] }}" data-fondu class="phototheque-actif" title="{{ __('Retirer ce filtre') }}">
            <span class="text-muted">{{ $actif['cle'] }}</span> {{ $actif['valeur'] }} <i class="bi bi-x" aria-hidden="true"></i>
        </a>
    @endforeach
    {{-- Par chantier, ou toutes à la suite : pour choisir parmi toutes les
         photos d'un modèle sans passer de carte en carte. Retenu pour la
         session (PhotoController::index). --}}
    <div class="btn-group btn-group-sm ms-auto phototheque-affichage" role="group" aria-label="{{ __('Affichage') }}">
        @foreach (['chantiers' => [__('Par chantier'), 'bi-collection'], 'mosaique' => [__('Mosaïque'), 'bi-grid-3x3-gap']] as $valeur => [$libelle, $icone])
            <a data-fondu href="{{ request()->fullUrlWithQuery(['affichage' => $valeur, 'page' => null, 'photo' => null]) }}"
                class="btn {{ $affichage === $valeur ? 'btn-primary' : 'btn-outline-primary' }}"
                @if ($affichage === $valeur) aria-current="true" @endif>
                <i class="bi {{ $icone }}" aria-hidden="true"></i> {{ $libelle }}
            </a>
        @endforeach
    </div>
</div>

@if ($peutSelectionner)
    {{-- La barre de sélection : cachée tant que rien n'est coché
         (js/phototheque.js). Les cases des vignettes s'y rattachent par
         `form="lot-etiquette"`, sans être dans le formulaire.

         Un seul formulaire, une seule adresse : le bouton cliqué dit le
         geste (`geste`), PhotoController::lot vérifie la permission.
         « Mettre à la corbeille » n'a pas besoin du nom d'étiquette, d'où
         `formnovalidate`. --}}
    <form id="lot-etiquette" method="POST" action="{{ route('photos.lot') }}"
        class="phototheque-selection mb-3" hidden data-selection>
        @csrf
        <strong data-selection-nombre></strong>
        @if ($dansLaCorbeille)
            <span class="flex-grow-1"></span>
            <button type="submit" name="geste" value="restaurer" class="btn btn-primary btn-sm text-nowrap">
                <i class="bi bi-arrow-counterclockwise" aria-hidden="true"></i> {{ __('Restaurer') }}
            </button>
        @else
            {{-- Un geste à la fois : on le choisit en tête de barre, seuls ses
                 champs s'affichent (js/phototheque.js, qui retient le dernier
                 choisi). La corbeille reste à part, au bout. --}}
            @php
                $gestes = array_filter([
                    'etiqueter' => $peutModifier ? __('Étiqueter') : null,
                    'rattacher' => $peutModifier ? __('Produit') : null,
                    'publier'   => $peutPublier ? __('Site vitrine') : null,
                ]);
            @endphp
            @if (count($gestes) > 1)
                <div class="btn-group btn-group-sm phototheque-gestes" role="group" aria-label="{{ __('Geste') }}">
                    @foreach ($gestes as $geste => $libelle)
                        <button type="button" class="btn btn-outline-primary {{ $loop->first ? 'active' : '' }}"
                            aria-pressed="{{ $loop->first ? 'true' : 'false' }}" data-geste-onglet="{{ $geste }}">{{ $libelle }}</button>
                    @endforeach
                </div>
            @endif
            @if ($peutModifier)
                {{-- Plusieurs étiquettes en un clic, choisies comme les
                     découpes d'une commande : le menu des étiquettes existantes
                     s'ouvre au-dessus du champ (la barre est en bas), filtre en
                     tapant, propose d'en créer une ; chaque choix devient une
                     pastille (`noms[]`). Ce qui reste tapé part aussi (`nom`).
                     Pas de `required` : js/phototheque.js refuse un envoi
                     vide, le serveur aussi. --}}
                <div class="phototheque-geste" data-geste-champs="etiqueter">
                    <div class="form-control form-control-sm phototheque-saisie" data-etiquettes data-etiquettes-haut>
                        <label class="visually-hidden" for="lot-nom">{{ __('Étiquettes') }}</label>
                        <input type="text" id="lot-nom" name="nom" maxlength="60" data-etiquettes-champ
                            autocomplete="off" placeholder="{{ __('Choisir ou taper une étiquette') }}">
                        <ul class="dc-menu dc-menu-haut" hidden></ul>
                    </div>
                    <button type="submit" name="geste" value="etiqueter" class="btn btn-primary btn-sm text-nowrap">{{ __('Étiqueter') }}</button>
                </div>
                {{-- Un modèle (ou une variation) et une couleur pour les photos
                     qui ne les disaient pas : un seul de chaque, choisis dans
                     le catalogue et les couleurs connues (js/phototheque-site.js,
                     `data-choix-un`). ProduitsALaMain complète sans doubler. --}}
                <div class="phototheque-geste" data-geste-champs="rattacher" hidden>
                    <div class="form-control form-control-sm phototheque-saisie" data-site data-choix="AC_CATALOGUE_PRODUITS" data-choix-nom="produit" data-choix-un
                        data-choix-vide="{{ __('Aucun modèle à ce nom') }}">
                        <label class="visually-hidden" for="lot-produit">{{ __('Modèle ou variation') }}</label>
                        <input type="text" id="lot-produit" data-site-champ autocomplete="off" placeholder="{{ __('Modèle : B-82, CLA…') }}">
                        <ul class="dc-menu dc-menu-haut" hidden></ul>
                    </div>
                    <div class="form-control form-control-sm phototheque-saisie" data-site data-choix="AC_COULEURS" data-choix-nom="couleur" data-choix-un
                        data-choix-vide="{{ __('Aucune couleur à ce nom') }}">
                        <label class="visually-hidden" for="lot-couleur">{{ __('Couleur') }}</label>
                        <input type="text" id="lot-couleur" data-site-champ autocomplete="off" placeholder="{{ __('Couleur : 7016, blanc…') }}">
                        <ul class="dc-menu dc-menu-haut" hidden></ul>
                    </div>
                    <button type="submit" name="geste" value="rattacher" formnovalidate data-choix-envoi class="btn btn-primary btn-sm text-nowrap">{{ __('Rattacher') }}</button>
                </div>
            @endif
            @if ($peutPublier)
                {{-- Les mêmes modèles du site que le panneau d'une photo
                     (js/phototheque-site.js), menu au-dessus ; ceux du
                     filtre Produit déjà posés. Ils s'ajoutent à ceux
                     qu'une photo avait (PhotoController::publierLot). --}}
                <div class="phototheque-geste phototheque-selection-site" data-geste-champs="publier" @if (count($gestes) > 1) hidden @endif>
                    <i class="bi bi-globe2" aria-hidden="true" title="{{ __('Site vitrine') }}"></i>
                    <div class="form-control form-control-sm phototheque-saisie" data-site>
                        @foreach ($siteDuFiltre as $choisi)
                            <span class="dc-chip">{{ $choisi['nom'] }}<input type="hidden" name="site[]" value="{{ $choisi['v'] }}"><button type="button" class="dc-retirer" aria-label="{{ __('Retirer :nom', ['nom' => $choisi['nom']]) }}">&times;</button></span>
                        @endforeach
                        <label class="visually-hidden" for="lot-site">{{ __('Modèle ou variation du site') }}</label>
                        <input type="text" id="lot-site" data-site-champ autocomplete="off" placeholder="{{ __('Modèle du site') }}">
                        <ul class="dc-menu dc-menu-haut" hidden></ul>
                    </div>
                    <button type="submit" name="geste" value="publier" formnovalidate data-choix-envoi class="btn btn-success btn-sm text-nowrap">{{ __('Publier sur le site') }}</button>
                </div>
            @endif
            <span class="flex-grow-1"></span>
            @if ($peutTrier)
                <button type="submit" name="geste" value="corbeille" formnovalidate class="btn btn-outline-danger btn-sm text-nowrap">
                    <i class="bi bi-trash3" aria-hidden="true"></i> {{ __('Corbeille') }}
                </button>
            @endif
        @endif
        <button type="button" class="btn btn-link btn-sm text-nowrap" data-selection-vider>{{ __('Désélectionner') }}</button>
    </form>
@endif

@if ($photos?->isNotEmpty())
    {{-- La mosaïque : toutes les photos à la suite, sans carte de chantier.
         Le client passe sous la photo, faute d'en-tête qui le dise. --}}
    <div class="card phototheque-carte">
        <div class="phototheque-tuiles">
            @foreach ($photos as $p)
                @php
                    $nomClient = $p->client?->libelle
                        ?? $p->client_nom
                        ?? ($p->client_id ? __('Client :id', ['id' => $p->client_id]) : __('Client inconnu'));
                @endphp
                @include('admin.photos._tuile', ['piedClient' => true])
            @endforeach
        </div>
    </div>

    {{ $photos->links() }}
@else
@forelse (($chantiers ?? collect()) as $chantier)
    @php
        $planning = $chantier['planning'];
        $premiere = $chantier['photos']->first();
        // Le client du planning ; une photo reprise de digiKam sans planning
        // a quand même le sien.
        $client = $planning?->client ?? $premiere->client;
        // Le client de la copie Gestan ; sinon l'étiquette de digiKam
        // (« RICHARD.B ») ; sinon son seul id.
        $nomClient = $client?->libelle
            ?? $premiere->client_nom
            ?? ($premiere->client_id ? __('Client :id', ['id' => $premiere->client_id]) : __('Client inconnu'));
        $produits = $chantier['photos']->flatMap->produits
            ->filter(fn ($p) => $p->modele || $p->type_id || $p->article)
            ->unique(fn ($p) => $p->commande_id ?: ($p->article ? 'a|' . $p->article : $p->modele . '|' . $p->couleur));
        $commandes = $produits->pluck('commande_id')->filter()->unique()->take(3);
        // Tous ceux qui ont envoyé des photos du chantier : à trois sur place,
        // chacun envoie les siennes.
        $auteur = $chantier['photos']
            ->map(fn ($p) => $p->user ? trim($p->user->prenom . ' ' . $p->user->nom) : $p->photographe)
            ->filter()->unique()->implode(', ');
        $nonVues = $dansLaCorbeille ? 0 : $chantier['photos']->filter(fn ($p) => !$p->estTraitee())->count();
    @endphp

    <article class="card phototheque-carte phototheque-chantier">
        <header class="phototheque-chantier-tete">
            {{-- Coche ou décoche les photos de la carte d'un coup, celles que
                 les filtres montrent ; à moitié cochée (tiret) quand une
                 partie l'est (js/phototheque.js). Pas de `name` : seules les
                 cases des photos partent avec le formulaire. --}}
            @if ($peutSelectionner)
                <input type="checkbox" class="form-check-input phototheque-coche-chantier"
                    title="{{ __('Sélectionner tout le chantier') }}"
                    aria-label="{{ trans_choice('Sélectionner la photo de ce chantier|Sélectionner les :n photos de ce chantier', $chantier['photos']->count(), ['n' => $chantier['photos']->count()]) }}">
            @endif
            <div class="me-auto">
                <h2 class="phototheque-chantier-titre">
                    @if ($premiere->client_id)
                        <a data-fondu href="{{ route('photos.index', ['client' => $premiere->client_id]) }}" title="{{ __('Toutes les photos de ce client') }}">{{ $nomClient }}</a>
                    @else
                        {{ $nomClient }}
                    @endif
                    @if ($premiere->ville)
                        <span class="text-muted fw-normal">· {{ \Illuminate\Support\Str::title(mb_strtolower($premiere->ville)) }}</span>
                    @endif
                </h2>
                <div class="small text-muted">
                    {{ collect([
                        $premiere->metier ? config("rapport_chantiers.types.{$premiere->metier}") : null,
                        $premiere->date_chantier?->translatedFormat('j M Y') . ($premiere->date_chantier ? ' · S' . $premiere->date_chantier->isoWeek() : ''),
                        $planning?->equipe?->nom,
                        \App\Services\Photos\Phototheque::compteDe($chantier['photos']) . ($auteur ? ' ' . __('de :nom', ['nom' => $auteur]) : ''),
                    ])->filter()->implode(' · ') }}
                </div>
            </div>
            @if ($produits->isNotEmpty())
                <div class="d-flex flex-wrap gap-1">
                    @foreach ($produits->take(4) as $produit)
                        <span class="phototheque-produit">
                            <span class="phototheque-pastille" style="background: {{ \App\Services\Photos\Phototheque::teinte($produit->couleur) ?? 'transparent' }}" aria-hidden="true"></span>
                            {{ collect([mb_strtoupper($produit->modele ?? '') ?: $produit->article, \App\Services\Photos\Phototheque::couleurCourte($produit->couleur)])->filter()->implode(' · ') }}
                        </span>
                    @endforeach
                </div>
            @endif
            <div class="d-flex flex-wrap gap-3 small">
                @if ($planning)
                    <a href="{{ route('plannings.show', $planning->id) }}">{{ __('Planning') }}</a>
                @endif
                @foreach ($commandes as $commande)
                    <a href="{{ route('commandes.show', $commande) }}">{{ __('Commande :n', ['n' => $commande]) }}</a>
                @endforeach
            </div>
            {{-- Le chantier sort de la file : tout son lot, pas seulement les
                 photos que les filtres montrent — c'est le chantier qu'on
                 déclare vu. --}}
            @if ($peutModifier && $nonVues)
                <form method="POST" action="{{ route('photos.traiter') }}" class="phototheque-traiter">
                    @csrf
                    <input type="hidden" name="lot" value="{{ $premiere->lot }}">
                    <button type="submit" class="btn btn-sm btn-success text-nowrap">
                        <i class="bi bi-check2-all" aria-hidden="true"></i> {{ __('Chantier traité') }}
                        <span class="opacity-75">({{ $nonVues }})</span>
                    </button>
                </form>
            @endif
        </header>

        <div class="phototheque-tuiles">
            @foreach ($chantier['photos'] as $p)
                @include('admin.photos._tuile')
            @endforeach
        </div>
    </article>
@empty
    <div class="card phototheque-carte">
        <div class="card-body py-5 text-center">
            @if ($filtres->vue === 'a-traiter' && !$actifs)
                <p class="mb-1 fw-semibold">{{ __('Tout est traité.') }}</p>
                <p class="text-muted small mb-3">{{ __('Les prochaines photos arriveront ici avec les retours de chantier.') }}</p>
            @elseif ($dansLaCorbeille && !$actifs)
                <p class="mb-1 fw-semibold">{{ __('La corbeille est vide.') }}</p>
            @else
                <p class="mb-1 fw-semibold">{{ __('Aucune photo ne passe ces filtres.') }}</p>
                <p class="text-muted small mb-3">{{ __('Les photos arrivent avec les retours de chantier remplis depuis le planning.') }}</p>
            @endif
            @if ($actifs)
                <a data-fondu href="{{ route('photos.index', array_filter(['vue' => $filtres->vue === 'toutes' ? null : $filtres->vue])) }}" class="btn btn-outline-primary btn-sm">{{ __('Tout effacer') }}</a>
            @endif
        </div>
    </div>
@endforelse

{{ $chantiers?->links() }}
@endif