<?php
ob_start(); // Start reading html
//header('Location: construction.php');
?>



<main id ="reference">

    <div class="box-jaune">
        <span class="corners corners-top"></span>
        <span class="corners corners-bottom"></span>

        <div class="title">Carte de l'INSA - <span class="change-map-button animated" id="change-map-button">version : </span></div>

        <span class="circles circles-top"></span>
        <span class="circles circles-bottom"></span>
    </div>



    <div id="maps">

        <!-- content will be included in #map3d -->
        <?php include('assets/map/map3D.php') ?>

        <!-- content wil be in #map2d -->
        <?php include('assets/map/map2D.php') ?>
    </div>



    <!-- Note -->
    <section>

        <p>
            Une petite note sur le numéro des salles : sur ton emploi du temps, le bâtiment est marqué en premier, et
            ensuite le chiffre des centaines pour l'étage, et après à toi de trouver !
        </p>
        <p>
            Par exemple, GM 212, c'est au GM, deuxième étage.<br>
            Et si t'as Amphi 108, c'est au premier étage du STPI (c'est ton département et c'est là où il y a les amphis).
        </p>

        <p id="hint">
            Fond de carte issu du site <a href="https://www.openstreetmap.org/#map=17/43.57103/1.46591" class="link">Open Street Map</a>.
        </p>

    </section>

</main>

<!-- needed for showing custom alert, JE FERAI UN TRUC MAISON PLUS TARD TKT -->
<script src="//cdn.jsdelivr.net/npm/sweetalert2@11"></script>

<!--- Switch between 2D and 3d maps --->
<script defer>
    const Thatbutton = document.getElementById("change-map-button");
    Thatbutton.addEventListener("click", (e) => {
        document.body.classList.toggle("flat");
    })
</script>


<?php
$infopage = ["", "Plan", ob_get_clean(), "", "map"]; //relativepath, pagetitle, pagecontent, pagescript, pagename | cf structure/template.php ligne 2 à 6
include("structure/template.php");
?>