Lo primero que tendremos en nuestra página de juego es una comprobación de que el usuario se haya logueado:
<?php
session_start();
//Si no está definida la variable de sesión es que no se ha logueado, lo mandamos al login
if (empty($_SESSION['idUsuario'])){
header("location:login.php");
}
require_once("libreria.php");
//Recuperamos la puntuación para mostrarla
$puntuacion= getPuntuacion($_SESSION['idUsuario']);
?>
De paso recuperamos la puntuación (lo veremos más adelante).
La página de juego es una página muy sencilla con sólo html. La mecánica del juego la tenemos en el javascript. Puede ser algo como esto:
<div class="container" >
<div class="jumbotron">
<h1 class="display-1">Trivial. Bienvenido <?=$_SESSION['nombre']?></h1>
<p>¿Cual es tu cultura general? Puntuación: <span id="puntuacion"><?=$puntuacion?></span></p>
</div>
<div class="row">
<div class="col-12" id="mensaje" style="min-height: 70px;"></div>
</div>
<div class="row tablero">
<div class="col-12"><h1 id="pregunta" class="text-center">Bienvenido al trivial. Muy pronto preguntas</h1></div>
</div>
<div class="row my-4 tablero">
<div class="col-6 text-center"><button id="res1" class="btn btn-lg btn-success">.</button></div>
<div class="col-6 text-center"><button id="res2" class="btn btn-lg btn-success">.</button></div>
</div>
<div class="row tablero">
<div class="col-6 text-center"><button id="res3" class="btn btn-lg btn-success">.</button></div>
<div class="col-6 text-center"><button id="res4" class="btn btn-lg btn-success">.</button></div>
</div>
</div>
<script src="trivial.js" type="text/javascript"></script>
