map importé qui fonctionne dans le répertoire map/

assets/map/map.php

@@ -1,81 +0,0 @@
-<style>
-    .hidden {
-        display: none;
-    }
-</style>
-
-<script type="text/javascript" src="assets/map/map.js"></script>
-
-<?php
-
-function get_map_info($selector)
-{
-    $sql = 'SELECT title, description FROM map_insa WHERE selector = ?';
-    $cursor = $this->conn->prepare($sql);
-    $cursor->execute([$selector]);
-    return $cursor->fetchAll(PDO::FETCH_ASSOC);
-}
-
-function get_map_selectors()
-{
-    $sql = 'SELECT selector FROM map_insa';
-    $cursor = $this->conn->prepare($sql);
-    $cursor->execute();
-    return $cursor->fetchAll(PDO::FETCH_ASSOC);
-}
-
-function save_map_info($selector, $info_json)
-{
-    $sql = 'DELETE FROM map_insa WHERE selector = ?';
-    $cursor = $this->conn->prepare($sql);
-    $cursor->execute([$selector]);
-    $sql = 'INSERT INTO map_insa (title, description, selector) VALUES (?, ?, ?)';
-    $cursor = $this->conn->prepare($sql);
-    $cursor->execute([$info_json['title'], $info_json['description'], $selector]);
-}
-
-function is_in_map($selector) {
-    $sql = 'SELECT selector FROM map_insa WHERE selector = ?';
-    $query = $this->conn->prepare($sql);
-    $query->execute([$selector]);
-    return $query->fetchAll(PDO::FETCH_ASSOC);
-}
-
-?>
-
-<div id="maps_button">
-    <button onclick="enable3DMap()" class="main-button">Map 3D</button>
-    <button onclick="enable2DMap()" class="main-button">Map 2D</button>
-</div>
-
-<section id="loading-screen">
-    <div class="loader"></div>
-</section>
-
-<div id="maps" class="">
-    <script src="assets/map/map3d.js" type="module"></script>
-
-    <div id="map" class="hidden">
-        <?php echo file_get_contents("assets/map/map.svg"); ?>
-        <canvas id="canvasID"></canvas>
-    </div>
-</div>
-
-<script>
-function enable3DMap() {
-    var map3d = document.querySelector('#maps #map3d');
-    var map = document.querySelector('#maps #map');
-
-    map3d.classList.add("hidden");
-    map.classList.add("hidden");
-    map3d.classList.remove("hidden");
-}
-
-function enable2DMap() {
-    var map3d = document.querySelector('#maps #map3d');
-    var map = document.querySelector('#maps #map');
-    map.classList.add("hidden");
-    map3d.classList.add("hidden");
-    map.classList.remove("hidden");
-}
-</script>

index.php

@@ -16,7 +16,7 @@ ob_start(); // Start reading html
         <p>
             Tu vas pouvoir trouver ici des informations générales sur ta semaine, comme
             <a href="planning.php">Le Planning</a>,
-            <a href="map.php">Le Plan Du Campus</a>, des détails sur
+            <a href="map/map.php">Le Plan Du Campus</a>, des détails sur
             <a href="parrainage.php">Le Parrainage</a>,
             ou encore des directives concernant ta magnifique <a href="blouse.php">Blouse</a>.
         </p>

map.php

@@ -1,6 +1,6 @@
 <?php
 ob_start(); // Start reading html
-//include "dao.php";
+require_once 'map/ajax.php';
 ?>
 <main>
     <h1>Le Plan</h1>
@@ -11,7 +11,64 @@ ob_start(); // Start reading html
         <strong>Clique sur un bâtiment pour voir les infos.</strong>
     </p>
     
-    <?php include "assets/map/map.php"; ?> <!-- affichage de la map -->
+    
+<script src="https://code.jquery.com/jquery-3.3.1.min.js"
+        integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
+        crossorigin="anonymous"></script>
+<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-confirm/3.3.2/jquery-confirm.min.js"></script>
+
+<style>
+.hidden {
+    display: none;
+}
+</style>
+
+
+<div id="maps_button">
+    <button onclick="enable3DMap()" class="main-button">Map 3D</button>
+    <button onclick="enable2DMap()" class="main-button">Map 2D</button>
+</div>
+
+<section id="loading-screen">
+
+<div class="loader"></div>
+
+</section>
+<div id="maps" class="">
+    <script src="map/script_map3d.js" type="module"></script>
+
+    <div id="map" class="hidden">
+        <?php echo file_get_contents("map/map2d.svg"); ?>
+        <canvas id="canvasID"></canvas>
+    </div>
+</div>
+
+
+<script>
+function enable3DMap() {
+    var map3d = document.querySelector('#maps #map3d');
+    var map = document.querySelector('#maps #map');
+
+    map3d.classList.add("hidden");
+    map.classList.add("hidden");
+    map3d.classList.remove("hidden");
+}
+
+function enable2DMap() {
+    var map3d = document.querySelector('#maps #map3d');
+    var map = document.querySelector('#maps #map');
+    map.classList.add("hidden");
+    map3d.classList.add("hidden");
+    map.classList.remove("hidden");
+}
+</script>
+
+<script type="text/javascript" src="map/script_map2d.js"></script>
+
+
+
+
+
 
     <p>
         Une petite note sur le numéro des salles : sur ton emploi du temps, le bâtiment est marqué en premier, et

map/ajax.php

@@ -0,0 +1,111 @@
+<?php
+$selector = ['gymnase', 'bib', 'ru', 'csh', 'tp', 'stpi', 'gc', 'gpe', 'gp', 'gei', 'gm', 'exam', 'loge', 'laverie', 'gmm', 'r3', 'r4', 'r5', 'r6', 'r7', 'r1', 'r2', 'amicale', 'pk', 'trou'];
+
+
+//attention, les éléments sont dans l'ordre
+$title = [
+'Le gymnase et le synthe',
+'bib\'insa et cafet',
+'le ru',
+'Le CSH',
+'Le bâtiment des TPs',
+'Le STPI, amphi Riquet et amphi Vinci',
+'Le GC',
+'Le GPE',
+'Le GP',
+'Le GEI',
+'Le GM',
+'le âtiment des exams et labo AIME',
+'La loge',
+'La laverie',
+'Le GMM, CSN et amphi Fourrier',
+'Le R3',
+'Le R4',
+'Le R5',
+'Le R6',
+'Le R7',
+'Le R1',
+'Le R2',
+'L\'amicale',
+'Le PK',
+'Le trou'
+];
+
+$desc = [
+'Parce qu\'à l\'INSA on fait aussi du sport.',
+'Ton repère si tu aimes le travail de groupe.\n<br><br>\nEt juste dessous la cafét pour varier les plaisirs et pour te sauver le soir.',
+'Sympa, convivial, grand avant 12h13.',
+'LE bâtiment avec TOUTES tes matières préférées : en plus de l\'anglais et des autres langues enseignées à l\'INSA, on t\'y parle aussi d\'Expression, de Gestion, de Philo, de PPI...youpi !',
+'Nom bizarre pour un bâtiment mais tu y iras seulement pour les TP d\'Electrocinétique et d\'Optique\n',
+'Le bâtiment des salles de cours classiques, avec son bureau des stages, son administration des premières années, et...ses sous-sols.\n\nY\'a aussi l\'amphi Vinci (et ses 300 places, souvent occupées en même temps sauf étonnamment en gestion) et l\'amphi Riquet (pour Pierre-Paul, celui qui a initié la construction du canal, il est plus petit mais plus convivial).',
+'Ceux du R5-R6 sont contents de le voir dans l\'emploi du temps.\n\n(C\'est le Génie Civil.)',
+'Pour Génie des Procédés et Environnement, et pour de longues heures de chimie et de thermo avec ta belle blouse',
+'Le Génie Physique, pour quelques cours mais sans plus.',
+'C\'est le Génie Electronique et Informatique, où t\'iras peut-être quérir de l\'aide pour l\'Algo durant ton après-midi libre du jeudi.',
+'Entre autres pour les TP de TI (c\'est le Génie Mécanique)',
+'Seulement le lundi matin, pour t\'amuser devant ∫1/cos(x) dx\n<br><br>\n\nEt à côté y\'a le labo AIME.',
+'L\'Accueil et la loge du gardien.',
+'Et à côté la salle de danse et le lieu de réunion de la Junior INSA Services.',
+'Le GMM (Génie Mathématique et Modélisation), que tu ne devrais pas voir souvent cette année.\r\n<br><br>\r\nEt le CSN (Centre des Services Numériques) à côté, où tu iras peut-être pour réviser l\'Algo...\r\n<br><br>\r\nEt enfin, l\'Amphi Fourier, c\'est pour les réceptions, les pièces du CATIN, les concerts des Enfoiros et les spectacles de danse de tes camarades au second semestre !',
+'', //R3
+'', //R4
+'Ici on aime bien le calme',
+'Ici on aime bien le calme',
+'', //R7
+'', //R1
+'', //R2
+'L\'Amicale', 'C\'est l\'Association des élèves, à côté de quelques clubs. Si tu as besoin de quelque chose ce sera toujours là-bas.',
+'Le Ptit Kawa, mais PK c\'est mieux (Peks pour les intimes). Le bar de l\'INSA, idéal pour se reposer entre les cours en jouant à la coinche ou au mus, ou pour se détendre les mercredi soir grâce aux soirée PK !',
+'de ton...'
+];
+
+
+
+//c'est peu compréhensible mais l'ancien systeme (avant Baptiste Rébillard <- moi) utilisait inutilement une base de donnée
+
+if (isset($_GET['function'])) {
+    if ($_GET['function'] == "get_map_info")
+        get_map_info();
+    elseif ($_GET['function'] == "get_map_selectors")
+        get_map_selectors();
+}
+
+function get_map_selectors() {
+    header('Content-Type: application/json');
+
+    global $selector;
+
+    //début bidouille (l'idée est de faire un format json artificiellement)
+    echo "[";
+    for ($i=0; $i < count($selector)-1 ; $i++) { 
+         echo json_encode(array("selector" => $selector[$i])).",";
+    }
+    echo json_encode(array("selector" => $selector[count($selector)-1]))."]";
+    //fin bidouille
+}
+
+function get_map_info() {
+    if (isset($_GET['selector'])) {
+
+        $select = $_GET['selector'];
+
+        header('Content-Type: application/json');
+
+        //on passe les tableau en variable globale pour les utiliser dans la fonction
+        global $selector, $title, $desc;
+
+        //on va chercher le selector dans la table selector afin de récuperer la positon dans le tableau
+        $pos = array_search($select, $selector); 
+
+        $array_to_send = array("title" => $title[$pos], "description" => $desc[$pos]);
+
+        echo "[".json_encode($array_to_send)."]"; //il fallait rajouter des [] pour que ça marche
+    } else {
+        show_error();
+    }  
+}
+
+function show_error() {
+    echo "Échec : ";
+    var_dump($_GET);
+}

map/map2d.svg

@@ -5537,7 +5537,7 @@
          id="surface1">
         <path
            inkscape:connector-curvature="0"
-           id="path1660"
+           id="synthe"
            d="m 556.87646,1140.2552 62.73422,91.9973 52.91754,-37.2119 -62.73914,-91.7536 z m 0,0"
            style="fill:#a8deca;fill-opacity:1;fill-rule:evenodd;stroke:#26c78a;stroke-width:0.315;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-opacity:1" />
         <path

map/map_init.php

@@ -0,0 +1,56 @@
+<?php
+require_once 'ajax.php';
+?>
+
+<script src="https://code.jquery.com/jquery-3.3.1.min.js"
+        integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
+        crossorigin="anonymous"></script>
+<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-confirm/3.3.2/jquery-confirm.min.js"></script>
+
+<style>
+.hidden {
+    display: none;
+}
+</style>
+
+
+<div id="maps_button">
+    <button onclick="enable3DMap()" class="main-button">Map 3D</button>
+    <button onclick="enable2DMap()" class="main-button">Map 2D</button>
+</div>
+
+<section id="loading-screen">
+
+<div class="loader"></div>
+
+</section>
+<div id="maps" class="">
+    <script src="script_map3d.js" type="module"></script>
+
+    <div id="map" class="hidden">
+        <?php echo file_get_contents("map2d.svg"); ?>
+        <canvas id="canvasID"></canvas>
+    </div>
+</div>
+
+
+<script>
+function enable3DMap() {
+    var map3d = document.querySelector('#maps #map3d');
+    var map = document.querySelector('#maps #map');
+
+    map3d.classList.add("hidden");
+    map.classList.add("hidden");
+    map3d.classList.remove("hidden");
+}
+
+function enable2DMap() {
+    var map3d = document.querySelector('#maps #map3d');
+    var map = document.querySelector('#maps #map');
+    map.classList.add("hidden");
+    map3d.classList.add("hidden");
+    map.classList.remove("hidden");
+}
+</script>
+
+<script type="text/javascript" src="script_map2d.js"></script>

map/script_map2d.js

@@ -16,7 +16,7 @@ function clicked(elem){
                 'selector': get_name(elem.id),
             };
             return $.ajax({
-                url: 'ajax/read',
+                url: 'ajax.php',
                 data: object,
                 method: 'get'
             }).done(function (data) {

map/script_map3d.js

@@ -84,7 +84,7 @@ function init() {
   //
   var loader = new GLTFLoader(loadingManager);
 
-  loader.load('assets/map/map3D.glb', function(gltf) {
+  loader.load('map3D.glb', function(gltf) {
     var object = gltf.scene;				
     gltf.scene.scale.set( 2, 2, 2 );			   
     gltf.scene.position.x = 0;				    //Position (x = right+ left-) 
@@ -162,7 +162,7 @@ function getSelectors() {
     'info': info,
   }
   return $.ajax({
-      url: 'ajax/read',
+      url: 'ajax.php',
       data: object,
       method: 'get',
       success: function(data){
@@ -204,7 +204,7 @@ function handleClickOnBuilding(x,y) {
                   'selector': selector,
               };
               return $.ajax({
-                  url: 'ajax/read',
+                  url: 'ajax.php',
                   data: object,
                   method: 'get'
               }).done(function (data) {

script/db.php

@@ -8,5 +8,7 @@ function read_password()
     return trim($password);
 }
 
-$db = new PDO('mysql:host=127.0.0.1;dbname=accueil_insa','root', read_password());
+$host = "127.0.0.1";
+
+$db = new PDO('mysql:host='.$host.';dbname=accueil_insa','root', read_password());
 ?>

structure/template.php

@@ -4,8 +4,6 @@ $pagetitle = $infopage[1];     // titre de la page affiché dans la balise <titl
 $pagecontent = $infopage[2];   // contenu de la page qui se retrouve dans le <body>
 $pagescript = $infopage[3];    // contenu de la page qui doit se retrouver en dehors du <body>
 $pagename = $infopage[4];      // nom de la page exact servant à appeler le css (cf <link rel="stylesheet" ...> sur /structure/template.php). Ex : ceciestunepage.php => { $pagetitle = "Ceci est une page" et $pagename = "ceciestunepage" }
-
-require_once $relativepath.'script/db.php';
 ?>
 
 <!DOCTYPE html>