Game Corner
Le but du TP est de créer un site donnant des informations sur des jeux vidéo
->
démo.
La liste des jeux et les informations affichées proviennent de la table games
contenue dans la BD
gamesdb
que nous avons utilisée dans le cours.
Le site est construit à l'aide d'une technique/classe
Template
incluant un header (fichier pages/header.php
)
et un footer (fichier pages/footer.php
).
Le site possède 2 pages de contenu : Games et Create.
Ressources
-
Il vous faut avoir créé la BD
gamesdb
:
si ce n'est pas déjà fait, la procédure de création est indiquée
ici
.
-
Une étude de la table
games
vous montrera que le champ image
contient
le nom du fichier image correspondant à la jaquette d'un jeu. Vous trouverez
dans le fichier php_tp05_uploads.zip
un dossier uploads
à mettre quelque part dans votre site :
il contient les images correspondantes
aux jeux (pré-créés) de la table games
.
-
L'image utilisée pour le fond du site est
geometric-triangle-neon-laser.jpg.
Games
La page Games est celle affichée au chargement (fichier pages/games_list.php
).
Elle liste les jeux contenus dans la table games
de gamesdb
.
La récupération de la liste des jeux sera réalisée au travers de la classe
gdb\GamesDB
et sa méthode getAllGames()
.
Le rendu des jeux sera généré par la classe
gdb\GameRenderer
et sa méthode
getHTML()
.
Ces 2 classes doivent être créées par vos soins et sont détaillées ci-après.
Create
Create propose un formulaire qui permet d'ajouter de nouveaux jeux dans la table games
.
Dans un site "réel", la page Create ne devrait être accessible qu'à des utilisateurs authentifiés
après une phase de type login afin d'éviter que n'importe-qui puisse insérer n'importe-quoi dans votre
base de données !
C'est pour cette raison que j'ai volontairement désactivé le traitement du formulaire de Create dans
la
démo du TP.
Etant donné que nous sommes ici dans le cadre d'un "simple" TP qui ne tournera que sur votre machine en
local, nous allons exceptionnellement nous passer d'implémenter cette importante protection.
La page Create est définie dans le fichier pages/game_form.php
dont le code utilise la classe
gdb\GameForm
(à créer).
La classe gdb\GameForm
contient les méthodes :
-
generateForm()
: génère le formulaire HTML permettant d'ajouter un jeu.
-
createGame($name, $description=null, $imgFile=null)
:
utilise la méthode createGame
de la classe
gdb\GameDB
(pour insérer un jeu dans la table games
et uploader
dans le dossier uploads
l'éventuelle image/jaquette fournie),
puis redirige l'utilisateur vers la page
Games.
Classe gdb\GamesDB
La classe gdb\GamesDB
utilise
PDO
pour interagir avec la BD
gamesdb
.
Cette classe possède :
-
Un constructeur qui initialise la connexion
PDO
à la BD
gamesdb
.
-
La méthode
getAllGames()
qui récupère la liste des jeux contenus dans
la table games
. Cette méthode utilise un
fetchAll
en mode PDO::FETCH_CLASS
pour caster les objets reçus en instances
de la classe
gdb\GameRenderer
.
NB : vous remarquerez que la liste des jeux est dans l'ordre alphabétique.
-
La méthode
createGame($name, $description=null, $imgFile=null)
qui insère un nouveau jeu dans la table games
et effectue un
upload
du fichier image/jaquette fourni par l'utilisateur dans le dossier uploads
.
Classe gdb\GameRenderer
La classe GameRenderer
est utilisée dans la méthode getAllGames()
de
gdb\GamesDB
lors du
fetchAll
en mode PDO::FETCH_CLASS
(cf. cours).
Cette classe possède une seule méthode nommée getHTML()
qui génère un rendu HTML pour
des objets représentant une entrée de la table games
.
getHTML()
utilise les champs :
-
name
: le nom du jeu rendu en "titre" de la fiche représentant le jeu.
-
description
: le texte contenu dans la fiche.
-
image
: le nom du fichier image correspondant à la jaquette du jeu et qui a été
uploadé lors de sa création grâce au formulaire de la page Create.
Les fichiers correspondants au champ image
se trouvent dans le dossier
uploads
. L'emplacement de ce dossier doit donc être utilisé par getHTML
dans la src
des balises img
qui affichent les jaquettes des jeux.
Démo
Game Corner :
cliquez sur "agrandir" pour mieux voir ---------------------->