La-Fabrik Editor Integration
✅ Integration Status: COMPLETED
L'éditeur est maintenant intégré à la route /editor du
projet La-Fabrik.
Fonctionnalités de l'éditeur
-
Routing React : React Router pour naviguer entre jeu et
éditeur
-
Chargement automatique : Recherche de
map.json dans public/
-
Upload de dossier : Si pas de map.json, possibilité
d'upload
-
Visualisation 3D : Canvas Three.js avec SceneData
-
Control de caméra :
- Mode debug : OrbitControls (rotation/pan/zoom)
- Mode player : FPS controller custom (WASD/ZQSD + souris)
- Sélection d'objets : Click sur cubes/modèles
- Transformations : Panneau avec boutons T/R/S
- Undo/Redo : Ctrl+Z / Ctrl+Y (compte affiché)
-
Export JSON : Bouton pour exporter map.json modifié
Structure de fichiers
src/components/editor/
├── EditorPage.tsx # Page route /editor
├── EditorViewer.tsx # Composant principal 3D
├── EditorCamera.tsx # Caméra (OrbitControls + useCameraMode)
├── EditorFPSController.tsx # Controller FPS custom
├── MapViewer.tsx # Visualisation map.json + modèles
├── EditorControls.tsx # Panneau latéral UI
├── types.ts # Types MapNode, SceneData, etc.
└── EditorPage.css # Styles scoped
À tester
-
Accéder à
/editor - devrait montrer erreur "map.json
introuvable"
- Uploader un dossier test avec map.json + models/
- Tester la visualisation 3D (cubes de test existent dans map.json)
- Tester le mode player (WASD + souris)
- Tester les transformations T/R/S
- Tester Undo/Redo (Ctrl+Z / Ctrl+Y)
- Tester export JSON (bouton "Export JSON")
- Naviguer vers
/ - retour au jeu original