ajout exo pour ceux qui ont fini le tp2

2025-04-02 09:09:05 +02:00 · 2025-04-02 09:09:05 +02:00 · 66085a9ddc
commit 66085a9ddc
parent f56154d10d
20 changed files with 130 additions and 0 deletions
--- a/R3.01/README.md
+++ b/R3.01/README.md
@ -32,6 +32,7 @@ Les notions suivantes seront abordées :
 | ------------------ | -------------------------------------------------------- | ------------------ |
 | 1 : 24/03 - 28/03| [Bases du langages](./cours/cm_bases_php.pdf)             | [tp1](./tp/tp1)       |
 | 2 : 03/04 - 07/04  | [Intéractions avec le client](./cours/cm_interaction_client_serveur.pdf)     | [tp2](./tp/tp2)       |
+| 3 : 10/04 - 14/04  | [PHP/MySQL](./cours/cm_extension_mysqli.pdf)            | [tp3](./tp/tp3)       |

 ## Les TPS

@ -41,4 +42,17 @@ permet de se familiariser avec le langage PHP.
 À chaque exercice correspond  un  sous répertoire avec
 des fichiers à compléter.

+#### TP2 : Intéractions avec le client, formulaires et PHP
+Le [tp2](./tp/tp2)
+aborde la récupération des données de formulaires avec PHP.
+À chaque exercice correspond  un  sous répertoire avec
+des fichiers à compléter.
+
+#### TP3 : PHP/Mysql
+Le [tp3](./tp/tp3)
+aborde l'interfaçage de php avec mysql, au moyen de l'extention 
+[mysqli](http://php.net/manual/fr/book.mysqli.php) de php.
+À chaque exercice correspond  un  sous répertoire avec
+des fichiers à compléter.
+

--- a/R3.01/tp/tp3/README.md
+++ b/R3.01/tp/tp3/README.md
@ -0,0 +1,40 @@
+# TP 3 : Passage de paramètres à un script,  PHP-MariaDB avec l'extension **mysqli**. 
+
+> Le style utilisé dans les sources est [picocss](https://picocss.com/).
+
+### Ex1.
+Le but est d'écrire un script php simulant le jeu de hasard pierre,
+feuille ciseaux (encore appelé chifoumi).
+<div align="center">
+<img src="./img/chifoumi.png">
+</div>
+
+Le joueur joue en cliquant sur l'icone représentant le coup qu'il
+a choisi. Celui-ci est un lien vers le même script, auquel est passé
+en GET un paramètre représentant son choix. Par exemple :
+
+```html
+<a href="?choice=0"><img href="rock.png"></a>
+<a href="?choice=1"><img href="paper.png"></a>
+<a href="?choice=2"><img href="scissors.png"></a>
+```
+Le script récupère le coup du joueur, fait un tirage aléatoire, et
+affiche les deux coups joués avec un message pour indiquer le
+résultat de la partie.
+
+Le code est organisé sommairement suivant le pattern `MVC`. Le script `index.php` fait office de contrôleur. 
+- il récupére le choix du joueur,
+- il fait jouer l'ordinateur (tirage aléatoire),
+- il calcule l'issue de la partie,
+- il affiche (include) les différentes parties de la vue finale, avec les variables nécessaires.
+
+Remarque : pour éviter un code trop verbeux au niveau des tests pour calculer le résultat d'une partie,
+vous pouvez utiliser un tableau pour représenter les règles du jeu. Par exemple,
+
+```php
+<?php
+// 0 rock, 1 paper, 2 scissors
+$rules = [ 0 => [ 0 => "Draw", 1 => "Loss", 2 => "Win"], ... ];
+```
+
+
--- a/R3.01/tp/tp3/chifoumi/css/style.css
+++ b/R3.01/tp/tp3/chifoumi/css/style.css
@ -0,0 +1,10 @@
+.center{
+	text-align:center;
+}
+.Win{
+color:#2E8B57;
+
+}
+.Loss{
+color:#FF6347;
+}
--- a/R3.01/tp/tp3/chifoumi/images/ciseaux.png
+++ b/R3.01/tp/tp3/chifoumi/images/ciseaux.png
--- a/R3.01/tp/tp3/chifoumi/images/feuille.png
+++ b/R3.01/tp/tp3/chifoumi/images/feuille.png
--- a/R3.01/tp/tp3/chifoumi/images/paper.png
+++ b/R3.01/tp/tp3/chifoumi/images/paper.png
--- a/R3.01/tp/tp3/chifoumi/images/pierre.png
+++ b/R3.01/tp/tp3/chifoumi/images/pierre.png
--- a/R3.01/tp/tp3/chifoumi/images/rock.png
+++ b/R3.01/tp/tp3/chifoumi/images/rock.png
--- a/R3.01/tp/tp3/chifoumi/images/scissors.png
+++ b/R3.01/tp/tp3/chifoumi/images/scissors.png
--- a/R3.01/tp/tp3/chifoumi/index.php
+++ b/R3.01/tp/tp3/chifoumi/index.php
@ -0,0 +1,20 @@
+<?php
+$images = ["rock.png","paper.png","scissors.png"];
+$isPlaying = true;
+
+$playerChoice = 0;
+$computerChoice = 1;
+
+$message = "Win";
+$class = "Win";
+
+$imagePlayer = $images[$playerChoice];
+$imageComputer = $images[$computerChoice];
+
+include './views/header.php';
+if ($isPlaying){
+	include './views/game.php';
+	include './views/message.php';
+}
+include './views/footer.php';
+?>
--- a/R3.01/tp/tp3/chifoumi/views/footer.php
+++ b/R3.01/tp/tp3/chifoumi/views/footer.php
@ -0,0 +1,3 @@
+		</main>
+	</body>
+</html>
--- a/R3.01/tp/tp3/chifoumi/views/game.php
+++ b/R3.01/tp/tp3/chifoumi/views/game.php
@ -0,0 +1,15 @@
+<div class="grid">
+	<article>
+		<header>Player</header>
+		<section class="center">
+			<img src="./images/<?php echo $imagePlayer;?>">
+		</section>
+	</article>
+	<article>
+		<header>Computer</header>
+		<section class="center">
+			<img src="./images/<?php echo $imageComputer;?>">
+		</section>
+	</article>
+</div>
+
--- a/R3.01/tp/tp3/chifoumi/views/header.php
+++ b/R3.01/tp/tp3/chifoumi/views/header.php
@ -0,0 +1,25 @@
+<!DOCTYPE html>
+<html lang="en">
+	<head>
+		<meta charset="UTF-8" >
+<link
+  rel="stylesheet"
+  href="https://cdn.jsdelivr.net/npm/@picocss/pico@2/css/pico.min.css"
+/>
+
+		<link rel="stylesheet" href="./css/style.css">
+		<title>Chifoumi</title>
+	</head>
+	<body>
+		<main class="container">
+
+			<h3>Rock Paper Scissors</h3>
+
+			<section class="center">
+				<p>Choose : </p>
+				<a href="?choice=0"><img width="100px" src="./images/rock.png"></a>
+				<a href="?choice=1"><img width="100px" src="./images/paper.png"></a>
+				<a href="?choice=2"><img width="100px" src="./images/scissors.png"></a>
+			</section>
+
+		
--- a/R3.01/tp/tp3/chifoumi/views/message.php
+++ b/R3.01/tp/tp3/chifoumi/views/message.php
@ -0,0 +1,3 @@
+<h2 class="center">
+	<span class="<?php echo $class;?>"><?php echo $message;?></span>
+</h2>
--- a/R3.01/tp/tp3/img/chifoumi.png
+++ b/R3.01/tp/tp3/img/chifoumi.png
--- a/R3.01/tp/tp3/img/db.gif
+++ b/R3.01/tp/tp3/img/db.gif
--- a/R3.01/tp/tp3/img/film.png
+++ b/R3.01/tp/tp3/img/film.png
--- a/R3.01/tp/tp3/img/film1.png
+++ b/R3.01/tp/tp3/img/film1.png
--- a/R3.01/tp/tp3/img/film2.png
+++ b/R3.01/tp/tp3/img/film2.png
--- a/R3.01/tp/tp3/img/film3.png
+++ b/R3.01/tp/tp3/img/film3.png