Merge branch 'main' of https://git.serveurtom.fr/Tom/24hducode

algo.js

@@ -0,0 +1,169 @@
+const Orientation = Object.freeze({
+    HAUT:   Symbol("haut"),
+    BAS:    Symbol("bas"),
+    GAUCHE: Symbol("gauche"),
+    DROITE: Symbol("droite")
+});
+
+
+class Noeud {
+    coordX;
+    coordY;
+    chemins;
+
+    constructor(coordX, coordY){
+        this.coordX = coordX;
+        this.coordY = coordY;
+        chemins = new Array();
+    }
+
+    addCheminPossible(chemin){
+        this.chemins.push(chemin)
+    }
+
+    getCheminsPossibles(){
+        return this.chemins
+    }
+}
+
+
+class ModeAutomatique {
+
+    cheminsPossibles = new Array(); // liste des listes de noeuds
+    noeudsVisites = new Array();
+
+    // valeurs pour la première position
+    posX=0;
+    posY=0;
+    rotation=HAUT;
+    
+    run(){
+        // TODO while find
+        this.analyseEnvironnement(); // met à jour ses connaissances (à dessiner au fur et à mesure ?)
+        this.move(); // récupère un chemin non encore parcourus en fonction de ses connaissances
+    }
+
+    //////////////////////////////////////// ANALYSE ENVIRONNEMENT
+
+    analyseEnvironnement(){
+        currentNode = getCaseAnalysee();
+
+        // SI case déjà visitée, alors on connait ses obstacles   
+        if (currentNode == null) {
+
+            // pour les 4 directions possibles
+            for (let i = 0; i < 4; i++) {
+                if (!isObstacleDevant(currentNode, rotation)){
+                    addCheminPossible(currentNode);
+                }
+                tourne(); // changement de l'angle de 90 degrés
+            }
+            this.noeudsVisites.push(currentNode);
+        }   
+    }
+
+    isObstacleDevant(){ 
+        // TODO
+        return true;
+    }
+
+    tourne(){
+        if(this.rotation = Orientation.HAUT){
+            //  TODO tourne
+            this.rotation = Orientation.GAUCHE;
+        } else if(this.rotation = Orientation.BAS){
+             //  TODO tourne
+             this.rotation = Orientation.GAUCHE;
+        }else if(this.rotation = Orientation.BAS){
+             //  TODO tourne
+             this.rotation = Orientation.DROITE;
+        }else if(this.rotation = Orientation.DROITE){
+             //  TODO tourne
+             this.rotation = Orientation.HAUT;
+        }
+    }
+
+    addCheminPossible(){
+        chemin = new Array();
+        if(this.rotation = Orientation.HAUT){
+            chemin.push(new Noeud(posX+1, posY));
+        } else if(this.rotation = Orientation.BAS){
+            chemin.push(new Noeud(posX-1, posY));
+        }else if(this.rotation = Orientation.GAUCHE){
+            chemin.push(new Noeud(posX, posY-1));
+        }else if(this.rotation = Orientation.DROITE){
+            chemin.push(new Noeud(posX, posY+1));
+        }
+        this.cheminsPossibles.push(chemin);
+    }
+
+    //////////////////////////////////////// MOVE
+
+    move(){
+        // on choisi le prochain noeud
+        nextNode = getNextNode();
+        // on met à jour la liste des chemins en ajoutant le noeud courant dans les chemins non choisis
+        updatePaths(nextNode);
+        // on met à jour les coordonnées
+        this.updateCoordonnees(nextNode);
+        // move
+        this.move(nextNode);
+    }
+
+    // parcours en profondeur : il s'agit de LIFOs
+    getNextNode(){
+        if (this.cheminsPossibles[this.cheminsPossibles.length - 1] > 0) {
+            // on récupère la dernière liste
+            cheminChoisi = this.cheminsPossibles[this.cheminsPossibles.length - 1];
+            // on récupère le dernier élément de cette liste
+            nodeChoisi = cheminChoisi[cheminChoisi.length - 1];
+            // on créé un nouveau noeud
+            return new Noeud(nodeChoisi.posX, nodeChoisi.posY);
+        }
+        return null;
+    }
+
+    updatePaths(nextNode){
+        nextNode = this.getCaseAnalysee();
+        // on ajoute le noeud visité à toutes les listes sauf la dernière
+        for (let i=0; i < this.cheminsPossibles -1; i++){
+            cheminPossible = this.cheminsPossibles[i];
+            if (nextNode == null){
+                // on ajoute le noeud en cours à la liste des noeuds visités
+                cheminPossible.push(nextNode);
+            } else {
+                // on vire le noeud visité de toutes les listes s'il a déjà été visité avant (on fait demi tour)
+                cheminPossible.pop();
+            }
+        }
+
+        // on supprime les listes vides
+        cheminsPossibles = cheminsPossibles.filter(function (el) {
+            return el.length > 0;
+         });        
+    }
+
+    updateCoordonnees() {
+        if(this.rotation = Orientation.HAUT){
+            this.posX++;
+        } else if(this.rotation = Orientation.BAS){
+            this.posX--;
+        }else if(this.rotation = Orientation.GAUCHE){
+            this.posY--;
+        }else if(this.rotation = Orientation.DROITE){
+            this.pos++;
+        }
+    }
+
+    /////////////////////////////////////// GETTERS
+
+    getCaseAnalysee(){
+        noeudsVisites.forEach((noeud) => {
+            if (noeud.posX == this.posX && noeud.posY == this.posY){
+                return noeud;
+            }
+        });
+        return null;
+    }
+}
+

ui/bootstrap-5.3.3-dist/css/bootstrap.css

@@ -2454,7 +2454,8 @@ textarea.form-control-lg {
 }
 .form-switch .form-check-input {
   --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='rgba%280, 0, 0, 0.25%29'/%3e%3c/svg%3e");
-  width: 2em;
+  width: 4em;
+  height: 2em;
   margin-left: -2.5em;
   background-image: var(--bs-form-switch-bg);
   background-position: left center;
@@ -12055,3 +12056,66 @@ textarea.form-control-lg {
 }
 
 /*# sourceMappingURL=bootstrap.css.map */
+
+ /* The switch - the box around the slider */
+ .switch {
+  position: relative;
+  display: inline-block;
+  width: 60px;
+  height: 34px;
+}
+
+/* Hide default HTML checkbox */
+.switch input {
+  opacity: 0;
+  width: 0;
+  height: 0;
+}
+
+/* The slider */
+.slider {
+  position: absolute;
+  cursor: pointer;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background-color: #ccc;
+  -webkit-transition: .4s;
+  transition: .4s;
+}
+
+.slider:before {
+  position: absolute;
+  content: "";
+  height: 26px;
+  width: 26px;
+  left: 4px;
+  bottom: 4px;
+  background-color: white;
+  -webkit-transition: .4s;
+  transition: .4s;
+}
+
+input:checked + .slider {
+  background-color: #2196F3;
+}
+
+input:focus + .slider {
+  box-shadow: 0 0 1px #2196F3;
+}
+
+input:checked + .slider:before {
+  -webkit-transform: translateX(26px);
+  -ms-transform: translateX(26px);
+  transform: translateX(26px);
+}
+
+/* Rounded sliders */
+.slider.round {
+  border-radius: 34px;
+}
+
+.slider.round:before {
+  border-radius: 50%;
+} 

ui/index.html

@@ -27,7 +27,11 @@
         <br/>
 
         <p>Automatique</p>
-        <button>Mode Auto</button>
+        <div class="form-check-inline form-switch ">
+            <input class="form-check-input" type="checkbox" role="switch" id="flexSwitchCheckDefault">
+            <label class="form-check-label" for="flexSwitchCheckDefault">Mode Auto</label>
+        </div>
+        
     </body>
     <script src="./bootstrap-5.3.3-dist/js/bootstrap.js"></script>
 </html>