# C1-A03 — Trouve le trésor

import { ActivityHero } from "../../../src/components/ActivityHero";
import { ActivitySolution } from "../../../src/components/ActivitySolution";
import { BonusChallenge } from "../../../src/components/BonusChallenge";
import { CompletionCheck } from "../../../src/components/CompletionCheck";
import { GridMap } from "../../../src/components/GridMap";
import { Hint } from "../../../src/components/Hint";
import { PrintableVersion } from "../../../src/components/PrintableVersion";
import { StarterProject } from "../../../src/components/StarterProject";
import { StudentStep } from "../../../src/components/StudentStep";
import { TeacherAccess } from "../../../src/components/TeacherAccess";
import { TryIt } from "../../../src/components/TryIt";

<ActivityHero
  id="C1-A03"
  title="Trouve le trésor sur le quadrillage"
  cycle="1"
  level="Moyenne Section & Grande Section"
  duration="20 min"
  tool="Sans écran (Quadrillage papier ou au sol)"
  difficulty="Découverte"
  needsAdult={false}
  mission="Le petit explorateur veut ouvrir le coffre aux trésors ! Pose les flèches sur le chemin pour le guider sans toucher les arbres."
/>

<PrintableVersion
  pdfColorUrl="/downloads/c1-a03-trouve-le-tresor-couleur.pdf"
  pdfColorName="Fiche d'activité couleur A4 (avec quadrillage et cartes)"
  pdfBwUrl="/downloads/c1-a03-trouve-le-tresor-gris.pdf"
  pdfBwName="Fiche d'activité en niveaux de gris A4 (économe en encre)"
/>

<StarterProject
  title="Ton matériel de départ"
  type="paper"
  preparedItems={[
    "1 grille de quadrillage 4x4 cases avec l'explorateur en A1 et le coffre en D4",
    "2 arbres obstacles placés sur la carte en B2 et C3",
    "1 lot de 8 cartes-flèches à découper (Avancer vers la droite, Descendre, Monter, Reculer)",
    "1 pion explorateur et 1 pion coffre",
  ]}
/>

---

## 🗺️ La carte du trésor

Voici le quadrillage sur lequel ton explorateur doit se déplacer :

<div style={{ textAlign: "center", margin: "1rem 0" }}>
  <img
    src="/images/c1-a03-ile-au-tresor.svg"
    alt="Schéma illustré de l'île au trésor et séquence de flèches"
    style={{ maxWidth: "100%", height: "auto", borderRadius: "8px", border: "1px solid #e2e8f0" }}
  />
</div>

<GridMap
  cols={4}
  rows={4}
  start={[0, 0]}
  target={[3, 3]}
  obstacles={[
    [1, 1],
    [2, 2],
  ]}
  title="Carte de l'île aux trésors interactive (4x4 cases)"
  theme="treasure"
/>

---

## 🪜 Les étapes de ta mission

<StudentStep
  number={1}
  title="Repère le départ et l'arrivée"
  check="Mon pion est posé sur la case départ A1."
>
  Pose ton pion explorateur sur la case de départ (en haut à gauche, case A1). Regarde où se trouve
  la couronne du trésor (en bas à droite, case D4).
</StudentStep>

<StudentStep
  number={2}
  title="Repère les arbres obstacles"
  check="Je sais quelles cases sont interdites (B2 et C3)."
>
  Attention ! Deux grands arbres bloquent le passage en B2 et C3. Ton explorateur ne peut pas
  traverser ces cases. Il doit les contourner !
</StudentStep>

<StudentStep
  number={3}
  title="Pose les flèches sur ton chemin"
  check="Toutes mes flèches se touchent de gauche à droite."
>
  Prends tes cartes-flèches et pose-les dans l'ordre pour tracer la route : - Flèche vers la droite
  ➡️ pour avancer d'une case vers l'Est. - Flèche vers le bas ⬇️ pour descendre d'une case vers le
  Sud.
</StudentStep>

<StudentStep
  number={4}
  title="Déplace ton pion case par case"
  check="Chaque flèche correspond exactement à un déplacement d'une case."
>
  Fais avancer ton pion en suivant tes flèches une par une avec ton doigt pour vérifier qu'il arrive
  bien sur le trésor sans toucher aucun arbre.
</StudentStep>

---

## 🧪 Teste ton parcours

<TryIt expected="L'explorateur part de A1, contourne les arbres sans jamais entrer sur leur case, et termine exactement sur le coffre D4.">
  Fais tester ton chemin par un camarade : il déplace son pion en suivant uniquement tes flèches !
</TryIt>

---

## 💡 Indices progressifs

<Hint
  hints={[
    {
      level: 1,
      title: "Indice 1 — Par où commencer ?",
      content: (
        <p>
          Depuis la case départ A1, tu peux soit aller à droite vers B1 (➡️), soit descendre vers A2
          (⬇️). Les deux départs sont possibles !
        </p>
      ),
    },
    {
      level: 2,
      title: "Indice 2 — Combien de pas au total ?",
      content: (
        <p>
          Pour aller de A1 à D4, le chemin le plus direct compte <strong>6 déplacements</strong> au
          total : 3 flèches vers la droite (➡️ ➡️ ➡️) et 3 flèches vers le bas (⬇️ ⬇️ ⬇️).
        </p>
      ),
    },
    {
      level: 3,
      title: "Indice 3 — Un exemple de premier virage",
      content: (
        <p>
          Essaie ce début : ➡️ (droite vers B1) puis ➡️ (droite vers C1). Tu as dépassé le premier
          arbre par le haut !
        </p>
      ),
    },
  ]}
/>

---

## 🔍 Solution et explications

<ActivitySolution title="Voir les chemins réussis pour atteindre le trésor">

Il existe plusieurs chemins possibles pour réussir cette mission ! Voici les deux solutions les plus simples :

### Solution A : Le chemin par le haut (6 flèches)

On contourne le premier arbre par le haut, puis on descend :

1. ➡️ Droite (vers B1)
2. ➡️ Droite (vers C1)
3. ⬇️ Bas (vers C2)
4. ➡️ Droite (vers D2)
5. ⬇️ Bas (vers D3)
6. ⬇️ Bas (vers D4 - Trésor atteint !)

<GridMap
  cols={4}
  rows={4}
  start={[0, 0]}
  target={[3, 3]}
  obstacles={[
    [1, 1],
    [2, 2],
  ]}
  path={[
    [0, 0],
    [1, 0],
    [2, 0],
    [2, 1],
    [3, 1],
    [3, 2],
    [3, 3],
  ]}
  title="Tracé de la Solution A (Par le haut)"
  theme="treasure"
/>

### Solution B : Le chemin par le bas (6 flèches)

On descend d'abord le long de la colonne A, puis on traverse :

1. ⬇️ Bas (vers A2)
2. ⬇️ Bas (vers A3)
3. ➡️ Droite (vers B3)
4. ⬇️ Bas (vers B4)
5. ➡️ Droite (vers C4)
6. ➡️ Droite (vers D4 - Trésor atteint !)

</ActivitySolution>

---

## 🌟 Défi bonus

<BonusChallenge title="Défi bonus : Trouve un deuxième chemin différent !">
  <p>
    Tu as réussi avec 6 flèches ? Bravo ! Essaie maintenant de trouver un{" "}
    <strong>deuxième chemin différent</strong> qui mène aussi au trésor sans toucher les arbres.
  </p>
  <p>
    <em>Combien de flèches utilises-tu pour ce nouveau chemin ?</em>
  </p>
</BonusChallenge>

---

<CompletionCheck
  activityId="C1-A03"
  nextActivityUrl="/activites/cycle-1/c1-a04-corrige-le-chemin"
  nextActivityTitle="C1-A04 — Corrige le chemin"
  cycleUrl="/activites/cycle-1"
/>

<TeacherAccess
  lessonId="C1-S03"
  lessonTitle="Programmer un parcours sur quadrillage"
  lessonUrl="/cycle-1/c1-s03-programmer-un-parcours"
/>