Avancement Memory

Manque le js pour flip les cartes, dire qu'il a gagné, etc.
1 year ago · c3ab480257
parent c73cc60d80
commit c3ab480257
4 changed files with 79 additions and 5 deletions
--- a/Project/php/controller/AbsController.php
+++ b/Project/php/controller/AbsController.php
@ -60,19 +60,32 @@ abstract class AbsController
        }
    }
-    public function memory(): void{
+    public static function memory($match): void{
        global $twig;
        try{
-            $idVoc = Validation::filter_int($_GET['id'] ?? null);
+            $idVoc = Validation::filter_int($match['params']['id'] ?? null);
            $wordList = (new \gateway\TranslationGateway)->findByIdVoc($idVoc);
            $wordShuffle = array();
            $pairs = [];
            for ($i = 0; $i != count($wordList); $i += 1) {
                $wordShuffle[] = $word1 = $wordList[$i]->getWord1();
                $wordShuffle[] = $word2 = $wordList[$i]->getWord2();
                $pairs[] = [$word1, $word2];
            }
            shuffle($wordShuffle);
            echo $twig->render('memory.html', [
                'wordShuffle' => $wordShuffle,
                'pairs' => $pairs,
            ]);
        }
        catch (Exception $e){
            throw new Exception("Erreur");
        }
        echo $twig->render('memory.html');
    }
 }
--- a/Project/php/controller/FrontController.php
+++ b/Project/php/controller/FrontController.php
@ -40,6 +40,10 @@ class FrontController
                        $this->home();
                        break;
                    case 'memory':
                        AbsController::memory($match);
                        break;
                    case 'login':
                        $this->login();
                        break;
@ -93,6 +97,7 @@ class FrontController
    public function home(): void {
        global $twig;
        echo $twig->render('home.html');
        var_dump($_SESSION['roles']);
    }
    public function login(): void {
--- a/Project/php/css/memory.css
+++ b/Project/php/css/memory.css
@ -0,0 +1,37 @@
 body {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
    margin: 0;
    background-color: #f0f0f0;
 }
 #memory-game {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
 }
 .card {
    width: 100px;
    height: 100px;
    background-color: #fff;
    border: 2px solid #ccc;
    border-radius: 8px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 18px;
    cursor: pointer;
    transition: background-color 0.3s ease;
 }
 .card.flipped {
    background-color: #f0f0f0; /* Couleur de fond lorsqu'une carte est retournée */
 }
 .card.found {
    background-color: #8aff8a; /* Couleur de fond lorsqu'une paire est trouvée */
    cursor: default;
 }
--- a/Project/php/templates/memory.html
+++ b/Project/php/templates/memory.html
@ -0,0 +1,19 @@
 <!DOCTYPE html>
 <html lang="en">
 <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Memory Game</title>
    <link rel="stylesheet" href="../css/memory.css">
 </head>
 <body>
 <div id="memory-game">
    {% for word in wordShuffle %}
    <div class="card" data-word="{{ word }}">
        <span>{{ word }}</span>
    </div>
    {% endfor %}
 </div>
 </body>
 </html>