Added base for interactive map

assets/css/style.css

@@ -442,6 +442,10 @@ Full-Width Styles
     list-style: square;
 }
 
+#map {
+    height: 600px;
+}
+
 /*******************************************************************************
 Small Device Styles
 *******************************************************************************/

assets/scripts/map.js

@@ -0,0 +1,19 @@
+
+var hoverColor = "#c5a360";
+var normalColor = "#d9cfc7";
+
+function clicked(id){
+    $("#infoBox").load("includes/map_descriptions/" + id + ".html");
+    $('html, body').animate({
+        scrollTop: $("#infoBox").offset().top
+    }, 300);
+}
+
+function hover_in(id){
+    console.log(id);
+    $("#" + id).css("fill", hoverColor);
+}
+
+function hover_out(id){
+    $("#" + id).css("fill", normalColor);
+}

includes/map_descriptions/r7.html

@@ -0,0 +1 @@
+<h3>Le R7</h3>

includes/sidenav.html

@@ -5,6 +5,9 @@
         <a href="planning.php" id="planning" class="page-link"><span class="sidenav-content"><i
                 class="fas fa-calendar-alt sidenav-icon"></i> Le
             Planning</span></a>
+        <a href="map.php" id="map" class="page-link"><span class="sidenav-content"><i
+                class="fas fa-map sidenav-icon"></i> Le
+            Plan</span></a>
         <a href="parrainage.php" id="parrainage" class="page-link"><span class="sidenav-content"><i
                 class="fas fa-user-plus sidenav-icon"></i> Le
             Parrainage</span></a>

map.php

@@ -0,0 +1,21 @@
+<?php
+ob_start(); // Start reading html
+?>
+<h1>Le Plan</h1>
+<p>
+    Voici le plan de ton nouveau campus, que tu va connaitre par coeur en quelques jours. (fond de carte issue du site
+    <a
+            href="https://www.openstreetmap.org/#map=17/43.57103/1.46591">Open Street Map</a>
+</p>
+<?php echo file_get_contents("assets/images/map.svg"); ?>
+
+<h1>Informations</h1>
+<div id="infoBox">
+    <p>Clique sur un bâtiment pour afficher ses informations</p>
+</div>
+
+<script type="text/javascript" src="assets/scripts/map.js"></script>
+<?php
+$pageContent = ob_get_clean(); // Store html content in variable
+include("template.php"); // Display template with variable content
+?>