========================================================= PROJET : PROGRAMMATION MICRO:BIT V2 (INTERFACE BLOCKLY)

Application web locale : on assemble des blocs, on lit la transcription MicroPython, on essaie le programme dans le simulateur, puis on telecharge un fichier .hex a glisser sur le lecteur MICROBIT.

---

1. STRUCTURE DU DOSSIER DU PROJET

---

Tous ces fichiers doivent rester ensemble dans le meme dossier :

• index.html (Interface, simulateur en Brython)

• un.js (Blocs, generateurs MicroPython, boite a outils)

• deux.js (Ecriture du programme dans le systeme de fichiers embarque)

• trois.js (Emballage au format Universal Hex)

• ia.js (Panneau IA : reconnaissance d'images et de sons, voir §19)

• tuto.js (Visite guidee de l'application, menu Aide, voir §20)

• firmware.hex (Image MicroPython officielle de la micro:bit)

• readme.txt (Ce fichier : affiche dans l'onglet Aide du panneau administrateur, §13)

• lancer_projet.bat (Demarrage du serveur local)

• app.py / app.spec (Version empaquetee en .exe avec PyInstaller)

• lib/ (Bibliotheques embarquees : Blockly, Brython, microbit-fs, microbit-universal-hex, TensorFlow.js et Teachable Machine dans lib/tm ; voir §12 et §19)

Rien a installer et aucune connexion Internet necessaire : depuis la V1.2, toutes les bibliotheques sont dans lib/ (avant, elles etaient chargees depuis des CDN).

---

2. COMMENT LANCER LE SERVEUR WEB LOCAL

---

Les navigateurs interdisent aux modules JavaScript de lire des fichiers locaux par un simple double-clic sur index.html. Il faut passer par un serveur web.

Le plus simple : double-cliquer sur lancer_projet.bat. Il se place tout seul dans le bon dossier, verifie les fichiers, demarre app.py et ouvre le navigateur.

A la main :

1. Ouvrir un terminal.
2. cd C:\chemin\vers\votre\dossier <-- indispensable
3. python app.py
4. Laisser la fenetre ouverte, puis ouvrir http://localhost:8000

IMPORTANT : passer par app.py, et non par "python -m http.server". Ce dernier n'envoie aucun en-tete de cache : le navigateur ressert alors un ancien index.html ou un.js apres modification, et on regarde la version precedente sans s'en apercevoir. app.py envoie Cache-Control: no-store, ce qui supprime le probleme.

Si un.js / deux.js / trois.js apparaissent en erreur 404 dans la console du navigateur, c'est que le serveur a ete lance depuis un autre dossier.

---

3. UTILISATION

---

• Panneau de gauche : les blocs. Le zoom se commande avec les trois boutons ronds de Blockly (recentrer, +, -) dessines dans le coin bas-droit de la zone de blocs, au-dessus de la corbeille (leurs icones, gris fonce, sont inversees en clair dans les themes sombres - regle CSS .blocklyZoom / .blocklyTrash dans index.html ; ils sont dessines dans le canevas, donc rognes si la fenetre est vraiment trop basse), et avec la molette. Le groupe "- 100 % + Ajuster" de la barre d'outils a ete retire a la demande de l'utilisateur (le code qui le pilotait reste, inoffensif : il ne trouve plus ses boutons ; l'ancienne fonction "Ajuster" = cadrer tous les blocs n'est donc plus accessible). La MOLETTE seule zoome (vers le haut = agrandir, vers le bas = reduire, autour du curseur ; Ctrl + molette aussi) ; on fait defiler en glissant le fond de l'espace ou avec les barres de defilement. Sur un pave tactile, le defilement a deux doigts zoome donc aussi. Le pincement fonctionne sur ecran tactile. Echelle de 0,3 a 3. "Ajuster" cadre les blocs presents, ou revient a 100 % si l'espace est vide.

  Les boutons "Code" et "Simulateur" de la barre du haut replient les deux panneaux de droite. C'est utile sur les categories aux blocs longs, comme Grove : le tiroir de la boite a outils est aussi large que son bloc le plus long, et peut ne laisser presque aucune place pour deposer les blocs. Replier un panneau rend cette largeur au canevas ; le zoom, lui, n'agit que sur les blocs deja poses, pas sur le tiroir.

  Bouton lune/soleil (a cote de "Simulateur") : bascule entre theme sombre (par defaut) et theme clair - barre d'outils, panneaux lateraux, panneau de code et panneau administrateur. Choix mémorisé d'une session a l'autre. Les couleurs "d'appareil" (sprites de robots, carte micro:bit, DEL) ne changent pas avec le theme : elles representent quelque chose de reel, comme les couleurs des boutons d'action.

  Bouton contraste (◐, juste a cote) : contraste normal ou eleve, independant du theme clair/sombre - les deux se combinent (sombre eleve = fond noir pur et texte blanc, clair eleve = fond blanc pur et texte noir, bordures plus epaisses). En contraste eleve, les blocs eux-memes passent aussi en noir a simple contour blanc, plutot que remplis de la couleur de leur categorie. Egalement memorise d'une session a l'autre.

• Panneau du milieu : le code MicroPython correspondant, mis a jour en direct.

  Les pilotes des modules Grove et des servomoteurs y sont REPLIES derriere une ligne du genre "pilote lcd1602 - 39 lignes", depliable d'un clic. Sur un programme LCD, cela ramene la transcription de 1470 a 144 caracteres : l'eleve voit son programme, pas la plomberie. Ce qui est deplie le reste quand on modifie les blocs.

This is the beginning of the README. Read the rest at the original. Read the full README ↗