68 lines
4.1 KiB
PHP
68 lines
4.1 KiB
PHP
|
@extends('layouts.vitrine')
|
||
|
|
|
||
|
|
@section('titre', $session->quiz->titre.' · en direct')
|
||
|
|
|
||
|
|
@php($etats = \App\Models\SessionQuiz::class)
|
||
|
|
|
||
|
|
@section('contenu')
|
||
|
|
<div class="mx-auto max-w-3xl px-5 py-14 lg:px-10">
|
||
|
|
<p class="font-mono text-sm font-semibold">{{ $session->quiz->classe->nom }}</p>
|
||
|
|
<h1 class="mt-1 text-4xl font-extrabold tracking-tight">{{ $session->quiz->titre }}</h1>
|
||
|
|
|
||
|
|
@if ($session->statut === $etats::TERMINEE)
|
||
|
|
<div class="mt-8 rounded-2xl border border-[#e3e5e8] bg-[#e6f4ea] p-8 text-center">
|
||
|
|
<p class="text-2xl font-extrabold">Quiz terminé.</p>
|
||
|
|
<a href="{{ route('mes-classes.quiz.show', [$session->quiz->classe, $session->quiz]) }}" class="mt-4 inline-flex h-11 items-center rounded-full bg-black px-5 font-bold text-white">Retour au quiz</a>
|
||
|
|
</div>
|
||
|
|
@elseif (! $session->questionCourante)
|
||
|
|
<div class="mt-8 rounded-2xl border border-[#e3e5e8] bg-white p-8 text-center">
|
||
|
|
<p class="text-xl font-semibold">Prêt à commencer ({{ $session->quiz->questions->count() }} question(s)).</p>
|
||
|
|
<form action="{{ route('sessions-quiz.suivante', $session) }}" method="post" class="mt-4">
|
||
|
|
@csrf
|
||
|
|
<button type="submit" class="inline-flex h-12 items-center rounded-full bg-black px-6 text-lg font-bold text-white">Commencer</button>
|
||
|
|
</form>
|
||
|
|
</div>
|
||
|
|
@else
|
||
|
|
@php($question = $session->questionCourante)
|
||
|
|
@php($numero = $session->quiz->questions->search(fn ($q) => $q->id === $question->id) + 1)
|
||
|
|
<div class="mt-8 rounded-2xl border border-[#e3e5e8] bg-white p-8">
|
||
|
|
<p class="font-mono text-sm font-semibold">Question {{ $numero }} / {{ $session->quiz->questions->count() }}</p>
|
||
|
|
<p class="mt-2 text-2xl font-extrabold">{{ $question->enonce }}</p>
|
||
|
|
@if ($question->type === \App\Models\QuestionQuiz::VRAI_FAUX)
|
||
|
|
<p class="mt-4 font-mono font-semibold">Bonne réponse : {{ $question->reponse_vrai_faux ? 'Vrai' : 'Faux' }}</p>
|
||
|
|
@else
|
||
|
|
<ul class="mt-4 grid gap-1 font-semibold">
|
||
|
|
@foreach ($question->choix as $choix)
|
||
|
|
<li class="{{ $choix->est_correct ? 'text-[#3C8A5A]' : '' }}">{{ $choix->est_correct ? '✓' : '·' }} {{ $choix->texte }}</li>
|
||
|
|
@endforeach
|
||
|
|
</ul>
|
||
|
|
@endif
|
||
|
|
|
||
|
|
<div class="mt-6 flex items-center gap-4 rounded-xl border border-[#dadce0] bg-[#f8f9fa] p-4">
|
||
|
|
<p class="font-mono text-lg font-bold"><span data-repondu>{{ $decompte['repondu'] }}</span> / {{ $total_eleves }} ont répondu</p>
|
||
|
|
<p class="font-mono text-lg font-bold text-[#3C8A5A]"><span data-correctes>{{ $decompte['correctes'] }}</span> correctes</p>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<form action="{{ route('sessions-quiz.suivante', $session) }}" method="post" class="mt-6">
|
||
|
|
@csrf
|
||
|
|
<button type="submit" class="inline-flex h-12 items-center rounded-full bg-black px-6 text-lg font-bold text-white">{{ $numero === $session->quiz->questions->count() ? 'Terminer' : 'Question suivante' }}</button>
|
||
|
|
</form>
|
||
|
|
</div>
|
||
|
|
@endif
|
||
|
|
</div>
|
||
|
|
<script nonce="{{ Vite::cspNonce() }}">
|
||
|
|
(function () {
|
||
|
|
var questionId = @json($session->question_quiz_courante_id);
|
||
|
|
setInterval(function () {
|
||
|
|
fetch('{{ route('sessions-quiz.etat', $session) }}', { headers: { 'Accept': 'application/json' } })
|
||
|
|
.then(function (r) { return r.json(); })
|
||
|
|
.then(function (e) {
|
||
|
|
if (e.question_id !== questionId || e.statut === 'terminee') { location.reload(); return; }
|
||
|
|
var r = document.querySelector('[data-repondu]'); if (r) r.textContent = e.decompte.repondu;
|
||
|
|
var c = document.querySelector('[data-correctes]'); if (c) c.textContent = e.decompte.correctes;
|
||
|
|
}).catch(function () {});
|
||
|
|
}, 2000);
|
||
|
|
})();
|
||
|
|
</script>
|
||
|
|
@endsection
|