rebillar/site-accueil-insa
1
1
Fork 1
forked from vergnet/site-accueil-insa
Code Issues Pull requests Releases Wiki Activity

map finit

Browse source
This commit is contained in:
Baptiste Rebillard 2022-03-10 00:34:02 +01:00
parent 8821cc0313
commit ba8029e8b8
7 changed files with 58 additions and 125 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
map/ajax.php → assets/map/ajax.php
View file

@ -64,9 +64,9 @@ $desc = [
//c'est peu compréhensible mais l'ancien systeme (avant Baptiste Rébillard <- moi) utilisait inutilement une base de donnée //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 (isset($_GET['function'])) {
if ($_GET['function'] == "get_map_info") if (htmlspecialchars($_GET['function']) == "get_map_info")
get_map_info(); get_map_info();
elseif ($_GET['function'] == "get_map_selectors") elseif (htmlspecialchars($_GET['function']) == "get_map_selectors")
get_map_selectors(); get_map_selectors();
} }
@ -87,7 +87,7 @@ function get_map_selectors() {
function get_map_info() { function get_map_info() {
if (isset($_GET['selector'])) { if (isset($_GET['selector'])) {
$select = $_GET['selector']; $select = htmlspecialchars($_GET['selector']);
header('Content-Type: application/json'); header('Content-Type: application/json');

0
map/map2d.svg → assets/map/map2d.svg
View file

Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 565 KiB

After

Width:  |  Height:  |  Size: 565 KiB

0
map/map3D.glb → assets/map/map3D.glb
View file

4
map/script_map2d.js → assets/map/script_map2d.js
View file

@ -2,6 +2,8 @@
let hoverColor = "#e9b82f"; let hoverColor = "#e9b82f";
let normalColor = "#efbd95"; let normalColor = "#efbd95";
var rep2 = "assets/map/";
function get_name(id){ function get_name(id){
return id.replace("map-", ""); return id.replace("map-", "");
} }
@ -16,7 +18,7 @@ function clicked(elem){
'selector': get_name(elem.id), 'selector': get_name(elem.id),
}; };
return $.ajax({ return $.ajax({
url: 'ajax.php', url: rep2+'ajax.php',
data: object, data: object,
method: 'get' method: 'get'
}).done(function (data) { }).done(function (data) {

7
map/script_map3d.js → assets/map/script_map3d.js
View file

@ -3,6 +3,7 @@
* Code : Ronan Bonnet * Code : Ronan Bonnet
* *
*/ */
var rep = "assets/map/";
import * as THREE from 'https://cdn.jsdelivr.net/npm/three@0.119.1/build/three.module.js'; import * as THREE from 'https://cdn.jsdelivr.net/npm/three@0.119.1/build/three.module.js';
@ -84,7 +85,7 @@ function init() {
// //
var loader = new GLTFLoader(loadingManager); var loader = new GLTFLoader(loadingManager);
loader.load('map3D.glb', function(gltf) { loader.load(rep+'map3D.glb', function(gltf) {
var object = gltf.scene; var object = gltf.scene;
gltf.scene.scale.set( 2, 2, 2 ); gltf.scene.scale.set( 2, 2, 2 );
gltf.scene.position.x = 0; //Position (x = right+ left-) gltf.scene.position.x = 0; //Position (x = right+ left-)
@ -162,7 +163,7 @@ function getSelectors() {
'info': info, 'info': info,
} }
return $.ajax({ return $.ajax({
url: 'ajax.php', url: rep+'ajax.php',
data: object, data: object,
method: 'get', method: 'get',
success: function(data){ success: function(data){
@ -204,7 +205,7 @@ function handleClickOnBuilding(x,y) {
'selector': selector, 'selector': selector,
}; };
return $.ajax({ return $.ajax({
url: 'ajax.php', url: rep+'ajax.php',
data: object, data: object,
method: 'get' method: 'get'
}).done(function (data) { }).done(function (data) {

110
map.php
View file

@ -1,74 +1,59 @@
<?php <?php
ob_start(); // Start reading html ob_start(); // Start reading html
require_once 'map/ajax.php'; require_once 'assets/map/ajax.php';
?> ?>
<main>
<h1>Le Plan</h1>
<p>
Voici le plan de ton nouveau campus, que tu vas connaître par cœur en quelques jours !
</p>
<p>
<strong>Clique sur un bâtiment pour voir les infos.</strong>
</p>
<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> <script src="https://code.jquery.com/jquery-3.3.1.min.js"
.hidden { integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
display: none; crossorigin="anonymous"></script>
} <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-confirm/3.3.2/jquery-confirm.min.js"></script>
</style>
<style>
.hidden {
<div id="maps_button"> display: none;
<button onclick="enable3DMap()" class="main-button">Map 3D</button> }
<button onclick="enable2DMap()" class="main-button">Map 2D</button> </style>
</div>
<div id="maps_button">
<section id="loading-screen"> <button onclick="enable3DMap()" class="main-button">Map 3D</button>
<button onclick="enable2DMap()" class="main-button">Map 2D</button>
<div class="loader"></div> </div>
</section> <section id="loading-screen">
<div id="maps" class="">
<script src="map/script_map3d.js" type="module"></script> <div class="loader"></div>
<div id="map" class="hidden"> </section>
<?php echo file_get_contents("map/map2d.svg"); ?> <div id="maps" class="">
<canvas id="canvasID"></canvas> <script src="assets/map/script_map3d.js" type="module"></script>
</div>
</div> <div id="map" class="hidden">
<?php echo file_get_contents("assets/map/map2d.svg"); ?>
<canvas id="canvasID"></canvas>
<script> </div>
function enable3DMap() { </div>
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>
<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="assets/map/script_map2d.js"></script>
<p> <p>
Une petite note sur le numéro des salles : sur ton emploi du temps, le bâtiment est marqué en premier, et Une petite note sur le numéro des salles : sur ton emploi du temps, le bâtiment est marqué en premier, et
@ -83,6 +68,7 @@ function enable2DMap() {
Map</a>. Map</a>.
</p> </p>
</main> </main>
<?php <?php
$infopage = ["", "Plan", ob_get_clean(), "", "map"]; //relativepath, pagetitle, pagecontent, pagescript, pagename | cf structure/template.php ligne 2 à 6 $infopage = ["", "Plan", ob_get_clean(), "", "map"]; //relativepath, pagetitle, pagecontent, pagescript, pagename | cf structure/template.php ligne 2 à 6
include("structure/template.php"); include("structure/template.php");

56
map/map_init.php
View file

@ -1,56 +0,0 @@
<?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>