$

src/components/global/etablanalytics/etablanalytics.riot

@@ -2,10 +2,11 @@
     <style>
         etablanalytics {
             width: 65vw;
-            height: 33vh;
+            height: 31vh;
             max-height: 33vh;
             font-weight: bold;
             padding: 15px;
+            overflow: auto;
         }
     </style>
 

src/components/global/generalytics/generalytics.riot

@@ -2,10 +2,11 @@
     <style>
         #generalytics {
             width: 65vw;
-            height: 57vh;
+            height: 55vh;
             max-height: 57vh;
             font-weight: bold;
             padding: 2vw;
+            overflow: auto;
         }
 
         #generalytics

src/components/global/localisationpath/loc.riot

@@ -1,9 +1,3 @@
 <loc>
-    <script>
+    <p></p>
-        import * as riot from 'riot';
-    </script>
-
-    <style>
-    </style>
-    <p>BUT - PRODUCTION - Informatique</p>
 </loc>

src/components/global/selector/selector.riot

@@ -121,6 +121,7 @@
                 page: {
                     curIndex: 0, /* section n.0 -> n.2. */
                     cat: null,
+                    path: ["", "", ""],
                     name: [
                         "formation",
                         "filière de formation",
@@ -136,9 +137,14 @@
              * */
             previousPage(){
                 try {
+                    this.state.page.path[this.state.page.curIndex] = ""
+                    document.querySelector("loc p").innerText = `${ this.state.page.path[0] } / ${ this.state.page.path[1] } / ${ this.state.page.path[2] }`
+
                     if(this.state.page.curIndex-1 >= 0) {
                         if(this.state.page.curIndex === 0) {
                         } else if(this.state.page.curIndex === 1) {
+                            this.state.page.path[0] = ""
+                            console.log(this.state.page.path)
                             this.getDataSection0()
                         } else if(this.state.page.curIndex === 2) {
                             this.getDataSection1()
@@ -156,18 +162,20 @@
             /**
              * Aller a la section n+1.
              * @param event Choix fait par l'utilisateur a la section n.
-             * todo: Faire en sorte de refaire des calls api en fonction de la section choisit (this.getSpecFor(nom_formation:String) et this.getSpecPlusFor(nom_formation:String).
+             * todo: Faire en sorte de refaire des calls call en fonction de la section choisit (this.getSpecFor(nom_formation:String) et this.getSpecPlusFor(nom_formation:String).
              * */
             nextPage(event) {
                 try {
+                    this.state.page.path[this.state.page.curIndex] = event.target.textContent
+                    document.querySelector("loc p").innerText = `${ this.state.page.path[0] } / ${ this.state.page.path[1] } / ${ this.state.page.path[2] }`
+
                     if(this.state.page.curIndex+1 <= 3 ) {
                         if(this.state.page.curIndex === 0) {
                             this.state.page.cat = `${ event.target.textContent }`
                             this.getDataSection1()
                         } else if(this.state.page.curIndex === 1) {
                             this.getDataSection2(this.state.page.cat)
-                        } else if(this.state.page.curIndex === 2) {
+                        } else if(this.state.page.curIndex === 2) {}
-                        }
 
                         if(this.state.page.curIndex !== 2) { /* Sinon ca va aller trop loin a la section 2. */
                             this.update({ curIndex: this.state.page.curIndex++ })
@@ -260,12 +268,11 @@
             onBeforeMount() {
                 this.getDataSection0()
             },
-        };
+        }
     </script>
 
     <span if={ !this.state.data }>
         Chargement des données... <br />
-        <loader />
     </span>
 
     <div if={ this.state.data } id="selector">

src/pages/home.riot

@@ -38,6 +38,7 @@
 		import * as riot from "riot";
 
 		riot.mount("selector", document.getElementById("right"))
+		riot.mount("loc", document.getElementById("left"))
 		riot.mount("generalytics", document.getElementById("left"))
 		riot.mount("etablanalytics", document.getElementById("left"))
 	</script>
@@ -48,6 +49,7 @@
 		</div>
 
 		<div id="left">
+			<loc id="loc" />
 			<generalytics />
 			<etablanalytics />
 		</div>