adam/Paillasse
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

ajoute la surveillance d'examen (chantier vrai cockpit, dernière étape)

Browse source 
Une séance peut être lancée en mode examen avec une durée dédiée.
Réutilise le mécanisme d'expiration déjà en place (labs:expirer-sessions,
expire_a) plutôt que d'en construire un nouveau. Le navigateur de
l'élève signale les changements d'onglet et les sorties de plein écran
(evenements_examen : un type et un horodatage, rien d'autre - pas de
capture d'écran ni de webcam) ; le prof voit le compte par élève et le
temps restant dans le cockpit de sa classe et la salle d'attente.

Choix d'Adam après discussion des options (suivi chronométré simple /
+ détection d'onglet / + tentative de plein écran) : la troisième,
honnêtement présentée - un navigateur ne permet pas de vraiment
empêcher de sortir, seulement de le signaler.

Avec cette étape, les quatre fonctions fictives du tableau de bord
démo (quiz, devoirs, observations, examen) sont maintenant réelles.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
Adam Belkacemi 2026-10-14 00:35:52 +02:00
parent 954bb6ca6c
commit f2bca621cd
15 changed files with 392 additions and 11 deletions
Download patch file Download diff file Expand all files Collapse all files

44
portail/resources/views/seances/attente-eleve.blade.php
View file

@ -26,6 +26,13 @@
<p class="mt-4 font-semibold">Ton prof le voit et peut relancer. Cette page se mettra à jour toute seule.</p>
</div>
@elseif ($labSession->etat === $etats::ACTIF && $labSession->machines->isNotEmpty())
@if ($seance->mode_examen)
<div id="bandeau-examen" class="mb-4 flex flex-wrap items-center justify-between gap-3 rounded-2xl border border-[#A63D2A] bg-[#fce8e6] p-4">
<p class="font-extrabold">Mode examen · temps restant : <span id="temps-restant" class="font-mono">…</span></p>
<button type="button" id="bouton-plein-ecran" class="inline-flex h-10 items-center rounded-full bg-black px-4 font-bold text-white">Passer en plein écran</button>
</div>
<p class="mb-4 text-sm font-semibold text-[#5f6368]">Reste sur cette page : les changements d'onglet et les sorties du plein écran sont signalés à ton prof.</p>
@endif
<h1 class="mt-2 text-3xl font-extrabold tracking-tight">Tes machines</h1>
<div class="mt-4 flex gap-2" role="tablist">
@foreach ($labSession->machines as $i => $machine)
@ -96,6 +103,43 @@
@endforeach
});
</script>
@if ($seance->mode_examen)
<script nonce="{{ Vite::cspNonce() }}">
(function () {
var finA = new Date(@json($labSession->expire_a?->toIso8601String()));
var URL_EVENEMENT = @json(route('lab-sessions.evenements-examen', $labSession));
var CSRF = @json(csrf_token());
function signaler(type) {
fetch(URL_EVENEMENT, {
method: 'POST', keepalive: true,
headers: { 'X-CSRF-TOKEN': CSRF, 'Content-Type': 'application/json', Accept: 'application/json' },
body: JSON.stringify({ type: type }),
}).catch(function () {});
}
function mettreAJourTemps() {
var restantMs = finA - new Date();
var affichage = document.getElementById('temps-restant');
if (restantMs <= 0) { affichage.textContent = '0 min'; location.reload(); return; }
affichage.textContent = Math.ceil(restantMs / 60000) + ' min';
}
mettreAJourTemps();
setInterval(mettreAJourTemps, 10000);
document.getElementById('bouton-plein-ecran').addEventListener('click', function () {
if (document.documentElement.requestFullscreen) document.documentElement.requestFullscreen().catch(function () {});
});
document.addEventListener('visibilitychange', function () {
if (document.hidden) signaler('changement_onglet');
});
document.addEventListener('fullscreenchange', function () {
if (!document.fullscreenElement) signaler('sortie_plein_ecran');
});
})();
</script>
@endif
@else
<div class="py-20 text-center">
<h1 class="text-4xl font-extrabold tracking-tight">Cette séance est terminée pour toi</h1>

12
portail/resources/views/seances/attente.blade.php
View file

@ -8,7 +8,11 @@
<meta http-equiv="refresh" content="10">
<div class="mx-auto max-w-4xl px-5 py-14 lg:px-10">
<p class="font-mono text-sm font-semibold">{{ $seance->classe->nom }} · {{ $seance->lab->titre }}</p>
<h1 class="mt-1 text-4xl font-extrabold tracking-tight">Salle d'attente</h1>
<h1 class="mt-1 text-4xl font-extrabold tracking-tight">Salle d'attente
@if ($seance->mode_examen)
<span class="rounded-lg border border-[#A63D2A] bg-[#fce8e6] px-2 py-0.5 align-middle font-mono text-sm font-bold">Mode examen · {{ $seance->duree_examen_min }} min</span>
@endif
</h1>
<p class="mt-2 font-semibold">La page se rafraîchit toutes les 10 secondes.</p>
<p class="mt-4"><a href="{{ route('seances.visio.prof', $seance) }}" class="inline-flex h-11 items-center rounded-full bg-[#0b57d0] px-5 font-bold text-white">{{ $seance->visioOuverte() ? 'Retourner à la visio' : 'Visio de la classe' }}</a></p>
@ -38,6 +42,12 @@
</span>
@endif
<a href="{{ route('seances.console.prof.page', [$seance, $labSession]) }}" class="font-bold underline underline-offset-4">Voir sa console</a>
@if ($seance->mode_examen)
<span class="font-mono text-sm font-bold {{ $labSession->evenementsExamen->isNotEmpty() ? 'text-[#A63D2A]' : '' }}">{{ $labSession->evenementsExamen->count() }} sortie(s)</span>
@if ($labSession->minutesRestantes() !== null)
<span class="font-mono text-sm font-bold">{{ $labSession->minutesRestantes() }} min restantes</span>
@endif
@endif
@break
@case($etats::ECHEC)
<span class="rounded-lg border border-[#A63D2A] bg-[#fce8e6] px-3 py-1 font-mono text-sm font-bold" title="{{ $labSession->raison_echec }}">Échec du lancement (3 essais)</span>