diff --git a/R4.01_R4.A.10/td_tp/tp4/README.md b/R4.01_R4.A.10/td_tp/tp4/README.md
index 5175284..a5abef6 100644
--- a/R4.01_R4.A.10/td_tp/tp4/README.md
+++ b/R4.01_R4.A.10/td_tp/tp4/README.md
@@ -44,4 +44,57 @@ http.
The Godfather1972
```
+#### Ex2
+Le but, dans un premier temps, est d'écrire une interface, avec ajax, qui permette de joueur au jeu suivant :
+- On a une grille dans laquelle sont cachés des renards (on en connait le nombre initial).
+
+- A chaque tour, on choisit de tirer sur un case. On a l'alternative suivante :
+ - on tue un renard,
+ - on récupére les nombres de renards sur la grille sur la ligne, colonne et diagonales de la case.
+
+
+
+
+
+Le jeu utilise un serveur http à l'url suivante
+
+```
+https://dwarves.iut-fbleau.fr/foxes/foxes.php
+```
+
+Voici les urls du jeu :
+
+```
+https://dwarves.iut-fbleau.fr/foxes/foxes.php?new&size=10&foxes=10
+```
+
+initialise la partie , avec la taille de la grille et le nombre de renards
+dont la position est aléatoire (le script utilise des sessions de cinq minutes).
+
+La réponse normale, en json :
+
+```json
+{"status":"ok","foxes":10,"tries":0}
+```
+
+
+```
+https://dwarves.iut-fbleau.fr/foxes/foxes.php?X=1&Y=3
+```
+
+permet de tirer sur une case. Le serveur répond
+
+```json
+{"status":"ok","foxes":2,"tries":1}
+```
+
+`foxes` vaut -1 si le coup est gagnant, sinon donne le nombre de renards de la colonne, ligne et diagonales de la case.
+
+
+En cas de victoire, le status est `win`. En cas d'erreur, le status est `nok`.
+
+
+**Remarque**
+
+Ajouter l'option `credentials` à vos requêtes pour utiliser la session en cours.
diff --git a/R4.01_R4.A.10/td_tp/tp4/img/renard1.png b/R4.01_R4.A.10/td_tp/tp4/img/renard1.png
new file mode 100644
index 0000000..235b505
Binary files /dev/null and b/R4.01_R4.A.10/td_tp/tp4/img/renard1.png differ
diff --git a/R4.01_R4.A.10/td_tp/tp4/src/ex2/app.js b/R4.01_R4.A.10/td_tp/tp4/src/ex2/app.js
new file mode 100644
index 0000000..710865d
--- /dev/null
+++ b/R4.01_R4.A.10/td_tp/tp4/src/ex2/app.js
@@ -0,0 +1,36 @@
+import loader from './loader.js';
+const board = document.querySelector("div.board");
+const form = document.querySelector("form");
+const message = document.querySelector("#message");
+const ld = new loader(document.getElementById("loader"));
+
+let url = 'https://dwarves.iut-fbleau.fr/foxes/foxes.php';
+
+let foxes;
+let size;
+
+let newBoard = ( (size ) => {
+ let frag = document.createDocumentFragment();
+ for (let i = 0; i< size; i++){
+ let div = document.createElement("div");
+ for(let j = 0; j < size; j++){
+ let span = document.createElement("span");
+ span.dataset.num = size*i + j;
+ div.appendChild(span);
+ }
+ frag.appendChild(div);
+ }
+ board.replaceChildren(frag);
+})
+
+
+
+form.addEventListener("submit", (async (ev) => {
+ ev.preventDefault();
+ // TODO
+}))
+
+
+board.addEventListener("click", ( async (ev) => {
+ // TODO
+}))
diff --git a/R4.01_R4.A.10/td_tp/tp4/src/ex2/css/style.css b/R4.01_R4.A.10/td_tp/tp4/src/ex2/css/style.css
new file mode 100644
index 0000000..3012e5a
--- /dev/null
+++ b/R4.01_R4.A.10/td_tp/tp4/src/ex2/css/style.css
@@ -0,0 +1,54 @@
+article {
+ text-align : center;
+}
+.board > div {
+ display : flex;
+}
+article .board {
+ display : inline-block;
+}
+.board span {
+ display: inline-block;
+ vertical-align:baseline;
+ width: 50px;
+ height: 50px;
+ /*padding : 1em;*/
+ margin : 0.1em;
+ cursor: pointer;
+ border: 1px solid #444;
+ /*background: radial-gradient(rgb(150,250,150), #00ee00);*/
+}
+.board span:hover {
+ background: #3AB903;
+ background: radial-gradient(rgb(66, 255, 66), #065006);
+}
+
+.board span.on {
+ background: #009900;
+}
+
+div.is-loading {
+ position: fixed;
+ z-index: 999;
+ overflow: show;
+ margin: auto;
+ top: 0;
+ left: 0;
+ bottom: 0;
+ right: 0;
+}
+div.is-loading:after {
+ animation: spinAround 500ms infinite linear;
+ border: 2px solid hsl(0deg, 0%, 86%);
+ border-radius: 9999px;
+ border-right-color: transparent;
+ border-top-color: transparent;
+ content: "";
+ display: block;
+ position: relative;
+ top: calc(50% - 5em);
+ left: calc(50% - 5em);
+ width: 10em;
+ height: 10em;
+ border-width: 0.25em;
+}
diff --git a/R4.01_R4.A.10/td_tp/tp4/src/ex2/foxes.html b/R4.01_R4.A.10/td_tp/tp4/src/ex2/foxes.html
new file mode 100644
index 0000000..f61a9e3
--- /dev/null
+++ b/R4.01_R4.A.10/td_tp/tp4/src/ex2/foxes.html
@@ -0,0 +1,35 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
Foxes
+
Le but est de tuer tous les renards en minimisant le nombre de coups joués.
+