initial commit

master
Axel DE LA FUENTE 2 years ago
commit b09a991b47

@ -0,0 +1,5 @@
/.idea/modules.xml
/.idea/php.xml
/.idea/Projet-Tut-Generateur.iml
/.idea/vcs.xml
/.idea/workspace.xml

@ -0,0 +1,119 @@
<!doctype html>
<html lang="fr">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<link rel="stylesheet" href="Vues/css/bootstrap.css">
<link rel="stylesheet" href="Vues/css/style.css">
<title>Générateur de panorama</title>
</head>
<!-- MENU NAV #FFD700 -->
<body>
<nav class="navbar fixed-top navbar-expand-lg navbar-dark bg-dark">
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNavAltMarkup">
<div class="navbar-nav">
<div id="logo">
<img id="logo" src="Vues/photos/logo.png">
</div>
<a class="nav-item nav-link active" href="#accueil">Accueil</a>
<a class="nav-item nav-link active" href="#creation">Créer mon panorama</a>
<a class="nav-item nav-link active" href="#explications">Comment ça marche ?</a>
<a class="nav-item nav-link active" href="#exemples">Exemples</a>
</div>
</div>
</nav>
<br>
<!-- ACCUEIL -->
<section id="accueil">
<br/>
<div id="presentation">
<p><strong>Bienvenue sur notre générateur de panorama !</strong></p>
<p><strong>Créer sa propre visite virtuelle n'a jamais été aussi simple : </strong></p>
<p><strong>En 3 clics, découvrer vos photos 360° comme vous ne les avez jamais vues</strong></p>
<p><strong>Découvrer, explorer ... et partager des moments inoubliables</strong></p>
<div id="fleches">
<img id="logo" src="Vues/photos/fleches.png">
</div>
</div>
</section>
<br>
<br>
<br>
<!-- CREER SON PANORAMA -->
<section id="creation">
<form method="POST">
<div id="boutonCreer">
<button name="action" value="TUTORIEL" type="submit" class="btn btn-warning"><strong>Créer mon propre panorama</strong></button>
</div>
</form>
</section>
<br>
<br>
<br>
<!-- EXPLICATIONS -->
<section id="explications">
<img id="dd" src="Vues/photos/xpli.png">
</section>
<br>
<br>
<br>
<!-- EXEMPLES -->
<section id="exemples">
<div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel">
<ol class="carousel-indicators">
<li data-target="#carouselExampleIndicators" data-slide-to="0" class="active"></li>
<li data-target="#carouselExampleIndicators" data-slide-to="1"></li>
</ol>
<div class="carousel-inner">
<div class="carousel-item active">
<img src="Vues/photos/pano.png" class="d-block w-100" alt="...">
</div>
<div class="carousel-item">
<img src="Vues/photos/carte.png" class="d-block w-100" alt="...">
</div>
</div>
<a class="carousel-control-prev" href="#carouselExampleIndicators" role="button" data-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="carousel-control-next" href="#carouselExampleIndicators" role="button" data-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
</section>
<br>
<br>
<br>
<!-- FOOTER -->
<footer><p>FERRERE Clément - MOMMALIER Victor - PONCET Clara - VELUT Lucile </p> |<p> DUT Informatique de Clermont-Ferrand </p></footer>
<!-- SCRIPTS JS -->
<!-- <script src="js/jquery-3.4.1.min.js"></script>
<script src="js/popper.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/scroll-animate.js"></script> -->
</body>
</html>

@ -0,0 +1,45 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Carte</title>
<script src="https://aframe.io/releases/1.0.4/aframe.min.js"></script>
<script src="https://unpkg.com/aframe-slice9-component/dist/aframe-slice9-component.min.js"></script>
<script src="https://unpkg.com/aframe-look-at-component@0.5.1/dist/aframe-look-at-component.min.js"></script>
</head>
<body>
<form id="formulaireCarteJS" method="POST" action="index.php?action=SaveCarte">
<input id="nbElements" name="nbElements" type="text" value="0" hidden="hidden"/>
<input id="envoi" type="submit" value="SAVE" hidden="hidden"/>
</form>
<a-scene id="sceneCarte">
<a-sky id="skybox" src="#fondBlanc"></a-sky>
<a-assets>
<img id="logoJaune" src="vues/photos/logoJaune.png" alt=""/>
<img id="fondBlanc" src="vues/photos/fondBlanc.png" alt=""/>
</a-assets>
<a-assets>
<img id="photoCarte" src="photosUpload/<?php echo $laCarte->getChemin(); ?>" alt=""/>
</a-assets>
<a-entity id="cam" camera position="0 1.6 0" look-controls wasd-controls="enabled:false">
<a-entity cursor="fuse:true;fuseTimeout:2000"
geometry="primitive:ring;radiusInner:0.01;radiusOuter:0.02"
position="0 0 -1.8"
material="shader:flat;color:blue">
</a-entity>
</a-entity>
<a-plane position="-1.89574 1.6 -1.96425" src="#photoCarte" look-at="#cam" height="4" width="6" rotation="0 43.98317825991033 0">
</a-plane>
</a-scene>
</body>
<script type="module" src="vues/js/scriptCarte.js"></script>
</html>

@ -0,0 +1,74 @@
<!doctype html>
<html lang="fr">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<link rel="stylesheet" href="Vues/css/bootstrap.css">
<link rel="stylesheet" href="Vues/css/style.css">
<title>Générateur de panorama</title>
</head>
<!-- MENU NAV #FFD700 -->
<body >
<nav class="navbar fixed-top navbar-expand-lg navbar-dark bg-dark">
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNavAltMarkup">
<div class="navbar-nav">
<div id="logo">
<img id="logo" src="Vues/photos/logo.png">
</div>
<a class="nav-item nav-link active" href="index.php">Accueil</a>
</div>
</div>
<span class="text-white align-self-center align-content-lg-center"><?php echo Validation::val_texte($_SESSION['titre']);?></span>
</nav>
<br>
<div >
<div>
<form method="POST" enctype="multipart/form-data">
<br/>
<br/>
<br/>
<br/>
<div class="text-center" >
<h4 class="text-center text-white">Veuillez choisir l'image de départ de votre panorama:</h4>
<label>
<select name="photo1">
<?php
foreach ($_SESSION['photos'] as $photo){
?>
<option value="<?php echo $photo->getChemin();?>"><?php echo $photo->getChemin();?></option>
<?php
}
?>
</select>
</label>
</div>
<br/>
<br/>
<br/>
<br/>
<div class="text-center">
<div class="button-login">
<input class="btn btn-warning " type="submit" name="action" value="COMMENCER">
</div>
</div>
</form>
</div>
</div>
</body>
<footer class="align-bottom fixed-bottom"><p>FERRERE Clément - MOMMALIER Victor - PONCET Clara - VELUT Lucile </p> |<p> DUT Informatique de Clermont-Ferrand </p></footer>
</html>

@ -0,0 +1,181 @@
@font-face {
font-family: 'acherusgrotesque-regular';
src: url('../polices/acherusgrotesque-regular-webfont.woff2') format('woff2'),
url('../polices/acherusgrotesque-regular-webfont.woff') format('woff');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'maven';
src: url('../polices/mavenpro-regular-webfont.woff2') format('woff2'),
url('../polices/mavenpro-regular-webfont.woff') format('woff');
font-weight: normal;
font-style: normal;
}
body {
font-family:'acherusgrotesque-regular';
font-size: 19;
background-color: black;
padding-top: 9px;
}
#sauvegarderPano {
margin-top: 10%;
}
.navbar-dark .navbar-nav .nav-link:hover, .navbar-dark .navbar-nav .nav-link:focus {
color: #FFD700;
}
.soustitre {
font-size: 25px;
}
#etape1 {
text-align: center;
background-color: #FCD21C;
color:black;
padding-left: 10%;
padding-bottom: 2%;
padding-top: 2%;
}
#etape2 {
text-align: center;
background-color: #383434;
color:#FCD21C;
padding-left: 10%;
padding-bottom: 2%;
padding-top: 2%;
}
#etape3 {
text-align: center;
background-color: #FCD21C;
color:black;
padding-left: 10%;
padding-bottom: 2%;
padding-top: 2%;
}
#etape4 {
text-align: center;
background-color: #383434;
color:#FCD21C;
padding-left: 10%;
padding-bottom: 2%;
padding-top: 2%;
}
#etape5 {
text-align: center;
background-color: #383434;
padding-left: 10%;
padding-bottom: 2%;
padding-top: 2%;
}
#etape1 div {
text-align: center;
}
#accueil2 {
background-color: #FCD21C;
}
#accueil2 div {
text-align: center;
height: auto;
padding-bottom: 2%;
}
#boutonCreer{
display: block;
text-align: center;
margin-bottom: 7%;
}
.textsch img{
width: 300px;
}
#accueil {
background-color: #FCD21C;
}
#accueil div {
text-align: center;
}
#fleches img {
margin-top: 3%;
height: 120px;
width: 170px;
}
#caracteristiques {
background-color: #ddd9d9;
text-align: center;
}
#explications{
background-color: #303030;
height: 550px;
text-align: center;
}
a {
font:black;
text-decoration:none;
text-align:center;
}
#presentation{
height: 370px;
padding-top: 2%;
text-decoration: bold;
}
#logo img{
height:40px;
width: 40px;
}
#explications img {
height:500px;
}
footer {
color: #FFD700;
font-size:small;
text-align:center;
}
footer p {
display:inline-block;
padding-left: 5%;
padding-right: 5%;
padding-top: 1%;
}

@ -0,0 +1,49 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Panorama</title>
<script src="https://aframe.io/releases/1.0.4/aframe.min.js"></script>
<script src="https://unpkg.com/aframe-slice9-component/dist/aframe-slice9-component.min.js"></script>
<script src="https://unpkg.com/aframe-look-at-component@0.5.1/dist/aframe-look-at-component.min.js"></script>
<!--animation component script-->
<script src="https://unpkg.com/aframe-animation-component@^4.1.2/dist/aframe-animation-component.min.js"></script>
<script src="https://unpkg.com/aframe-look-at-component@0.5.1/dist/aframe-look-at-component.min.js"></script>
<script src="Vues/js/script.js"></script>
</head>
<body>
<form method="POST" action="index.php?action=SAVE" id="notreFormulaire">
<input id="nbElements" name="nbElements" type="text" value="0" hidden="hidden"/>
<input id="envoi" type="submit" value="SAVE" hidden="hidden"/>
</form>
<a-scene id="notreScene">
<a-assets>
<img id="photo1" src="photosUpload/<?php echo $photoEnCours->getChemin(); ?>" alt=""/>
</a-assets>
<a-sky id="skybox" src="#photo1"></a-sky>
<a-entity id="cam" camera position="0 1.6 0" look-controls>
<a-entity cursor="fuse:true;fuseTimeout:2000"
geometry="primitive:ring;radiusInner:0.01;radiusOuter:0.02"
position="0 0 -1.8"
material="shader:flat;color:blue"
animation__component="property:scale;to:2 2 2;
color:green;endEvents:mouseleave;
startEvents:mouseenter;dir:reverse;dur:200;loop:1">>
</a-entity>
</a-entity>
<a-entity id="spots" hotspots>
<a-entity id="group-photo1">
</a-entity>
</a-entity>
</a-scene>
</body>
</html>

@ -0,0 +1,25 @@
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="vues/css/bootstrap.css">
<link rel="stylesheet" href="vues/css/style.css">
<title>Erreur</title>
</head>
<body>
<h1> Erreur </h1>
<?php
if (isset($this->tableauErreur)) {
foreach ($this->tableauErreur as $value){
echo "<p>$value</p>";
}
}
?>
<button type="button" class="btn btn-dark" onclick="location.href='?'">Retour à l'accueil</button>
</body>
</html>

@ -0,0 +1,77 @@
<!doctype html>
<html lang="fr">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<link rel="stylesheet" href="Vues/css/bootstrap.css">
<link rel="stylesheet" href="Vues/css/style.css">
<title>Générateur de panorama</title>
</head>
<!-- MENU NAV #FFD700 -->
<body >
<nav class="navbar fixed-top navbar-expand-lg navbar-dark bg-dark">
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNavAltMarkup">
<div class="navbar-nav">
<div id="logo">
<img id="logo" src="Vues/photos/logo.png">
</div>
<a class="nav-item nav-link active" href="index.php">Accueil</a>
</div>
</div>
</nav>
<br>
<div >
<div>
<form method="POST" enctype="multipart/form-data">
<br/>
<br/>
<br/>
<br/>
<div class="text-center">
<h4 class="text-center text-white">Veuillez saisir le nom de votre projet:</h4>
<input class="btn btn-warning" type="text" placeholder="Mon Panorama" name="nomProjet" required/>
</div>
<br/>
<br/>
<br/>
<div class="text-center text-white">
<h4 class="text-center">Veuillez saisir vos images: (.png / .jpg)</h4>
<input class="btn btn-warning" type="file" placeholder="Mon Panorama" name="photos[]" multiple required>
<br/>
<?php
if (isset($this->tableauErreur)) {
if (!empty($this->tableauErreur)) {
echo "<p>$this->tableauErreur</p>";
}
}
?>
</div>
<br/>
<div class="text-center">
<div class="button-login">
<input class="btn btn-warning" type="submit" name="action" value="valider">
</div>
</div>
</form>
</div>
</div>
</body>
<footer class="align-bottom fixed-bottom"><p>FERRERE Clément - MOMMALIER Victor - PONCET Clara - VELUT Lucile </p> |<p> DUT Informatique de Clermont-Ferrand </p></footer>
</html>

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

@ -0,0 +1,131 @@
var div;
var text;
var string;
var monPanneau;
var coord;
var cle=0;
var form=document.getElementById("notreFormulaire");
var input;
var input2;
var lesElements;
window.addEventListener('keydown', (event) => {
switch(event.key) {
case 'p' : //CREATION D'UN PANNEAU
text = window.prompt("Veuillez rentrer le texte de votre panneau : ");
text = text.trim();
if (text != null) {
monPanneau = document.createElement("a-entity");
coord = {x: -2, y: 4, z: -10};
monPanneau.setAttribute("position", coord);
monPanneau.setAttribute("slice9", "width: 5; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: Vues/photos/tooltip.png");
monPanneau.setAttribute("look-at", "#cam");
monPanneau.setAttribute("class", "panneau");
let value = "value:" + text + ";wrap-count:15; width:5; align:center;zOffset:0.05";
monPanneau.setAttribute("text", value);
div = document.getElementById("notreScene");
div.appendChild(monPanneau);
}
break;
case 'n' : //CREATION D'UN POINT DE NAVIGATION
text = window.prompt("Veuillez rentrer le nom de l'image de destination (avec extension) : ");
monPanneau = document.createElement("a-image");
coord= {x: -2, y: 4, z:-10};
monPanneau.setAttribute("position",coord);
let chemin = "photosUpload/" + text;
monPanneau.setAttribute("id",chemin);
monPanneau.setAttribute("class", "point");
monPanneau.setAttribute("src","Vues/photos/fleche.png");
monPanneau.setAttribute("look-at","#cam");
div = document.getElementById("notreScene");
div.appendChild(monPanneau);
break;
case 'a' : //CHANGEMENT D'AXE
cle = (cle + 1) % 3;
break;
case 'h' : //AFFICHAGE DE L'AIDE MEMOIRE
window.alert("P : créer un panneau\n" +
"N : créer un point de navigation\n" +
"\n" +
"flèches (gauche et droite) : déplacer l'élément sur un axe\n" +
"A : changer d'axe\n" +
"\n" +
"J : passer à la photo suivante\n" +
"\n" +
"H : afficher l'aide mémoire pour les touches\n");
break;
case 'ArrowLeft' : //DEPLACEMENT SUR L'AXE CHOISI
div = document.getElementById("notreScene");
monPanneau = div.lastChild;
coord = monPanneau.getAttribute("position");
switch (cle) {
case 0 : coord["x"] -= 0.5;
break;
case 1 : coord["y"] -= 0.5;
break;
case 2 : coord["z"] -= 0.5;
break;
}
monPanneau.setAttribute("position",coord);
break;
case 'ArrowRight' : //DEPLACEMENT SUR L'AXE CHOISI
div = document.getElementById("notreScene");
monPanneau = div.lastChild;
coord = monPanneau.getAttribute("position");
switch (cle) {
case 0 : coord["x"] += 0.5;
break;
case 1 : coord["y"] += 0.5;
break;
case 2 : coord["z"] += 0.5;
break;
}
monPanneau.setAttribute("position",coord);
break;
case 'j' : //SAUVEGARDE DES ELEMENTS CREES
let nbElements = 0;
form=document.getElementById("notreFormulaire");
let panneaux = Array.from(document.getElementsByClassName("panneau"));
let points = Array.from(document.getElementsByClassName("point"));
lesElements = panneaux.concat(points);
let count = lesElements.length;
for (let i=0; i<count; i++) {
sauvegarde(lesElements[i],nbElements);
nbElements += 3;
}
let info = document.getElementById("nbElements");
info.setAttribute("value",nbElements.toString());
form.submit();
break;
default :
break;
}
function sauvegarde(item,nb){
form=document.getElementById("notreFormulaire");
input = document.createElement("input");
input.setAttribute("type","text");
input2 = document.createElement("input");
input2.setAttribute("type","text");
input2.setAttribute("name","item"+(nb));
if (item.className === "panneau") {
input.setAttribute("value",item.getAttribute("text").value);
input2.setAttribute("value","panneau");
}
else {
input.setAttribute("value",item.getAttribute("id"));
input2.setAttribute("value","point");
}
input.setAttribute("name","item"+(nb+1));
form.appendChild(input);
form.appendChild(input2);
input = document.createElement("input");
input.setAttribute("type","text");
coord=item.getAttribute("position");
coord = coord["x"] + " " + coord["y"] + " " + coord["z"];
input.setAttribute("value",coord);
input.setAttribute("name","item"+(nb+2));
form.appendChild(input);
}
})

@ -0,0 +1,102 @@
var div;
var text;
var string;
var monPanneau;
var coord;
var cle=0;
var form=document.getElementById("formulaireCarteJS");
var input;
window.addEventListener('keydown', (event) => {
switch(event.key) {
case 'n' : //CREATION D'UN POINT DE NAVIGATION
text = window.prompt("Veuillez rentrer le nom de l'image de destination (avec extension) : ");
monPanneau = document.createElement("a-image");
coord= {x: -1.5, y: 1.6, z:-2};
monPanneau.setAttribute("position",coord);
let chemin = "photosUpload/" + text;
monPanneau.setAttribute("id",chemin);
monPanneau.setAttribute("class", "point");
monPanneau.setAttribute("src","#logoJaune");
monPanneau.setAttribute("height","0.480");
monPanneau.setAttribute("width","0.300");
monPanneau.setAttribute("look-at","#cam");
div = document.getElementById("sceneCarte");
div.appendChild(monPanneau);
break;
case 'a' : //CHANGEMENT D'AXE
cle = (cle + 1) % 3;
break;
case 'ArrowLeft' : //DEPLACEMENT SUR L'AXE CHOISI
div = document.getElementById("sceneCarte");
monPanneau = div.lastChild;
coord = monPanneau.getAttribute("position");
switch (cle) {
case 0 : coord["x"] -= 0.25;
break;
case 1 : coord["y"] -= 0.25;
break;
case 2 : coord["z"] -= 0.25;
break;
}
monPanneau.setAttribute("position",coord);
break;
case 'ArrowRight' : //DEPLACEMENT SUR L'AXE CHOISI
div = document.getElementById("sceneCarte");
monPanneau = div.lastChild;
coord = monPanneau.getAttribute("position");
switch (cle) {
case 0 : coord["x"] += 0.25;
break;
case 1 : coord["y"] += 0.25;
break;
case 2 : coord["z"] += 0.25;
break;
}
monPanneau.setAttribute("position",coord);
break;
case 'j' : //SAUVEGARDE DES ELEMENTS CREES
let nbElements = 0;
form=document.getElementById("formulaireCarteJS");
let points = document.getElementsByClassName("point");
let count = points.length;
for (let i=0; i<count; i++) {
sauvegarde(points[i],nbElements);
nbElements += 2;
}
let info = document.getElementById("nbElements");
info.setAttribute("value",nbElements.toString());
form.submit();
break;
case 'h' : //AFFICHAGE DE L'AIDE MEMOIRE
window.alert("P : créer un panneau\n" +
"N : créer un point de navigation\n" +
"\n" +
"flèches (gauche et droite) : déplacer l'élément sur un axe\n" +
"A : changer d'axe\n" +
"\n" +
"J : passer à la photo suivante\n" +
"\n" +
"H : afficher l'aide mémoire pour les touches\n");
break;
default :
break;
}
function sauvegarde(item,nb){
form=document.getElementById("formulaireCarteJS");
input = document.createElement("input");
input.setAttribute("type","text");
input.setAttribute("value",item.getAttribute("id"));
input.setAttribute("name","item"+(nb));
form.appendChild(input);
input = document.createElement("input");
input.setAttribute("type","text");
coord=item.getAttribute("position");
coord = coord["x"] + " " + coord["y"] + " " + coord["z"];
input.setAttribute("value",coord);
input.setAttribute("name","item"+(nb+1));
form.appendChild(input);
}
})

@ -0,0 +1,13 @@
window.addEventListener('keydown', (event) => {
if (event.key === 't') {
let element;
element = document.createElement('a');
element.setAttribute('href', 'Vues/resultat.php');
element.setAttribute('download', 'monpanorama.html');
element.click();
console.log("j'ai recu un t");
}
else {
console.log("j'ai recu autre chose");
}
});

@ -0,0 +1,13 @@
$(document).ready(function() {
$('body').on('click', '.navbar-nav a', function(e) {
$('a.active').removeClass('active');
var link = $(this);
link.addClass('active');
// Scroll animation
$('html, body').animate( { scrollTop: $(link.attr('href')).offset().top - 57 }, 750 );
return false;
});
//Scrollspy
$('body').scrollspy({ target: '#menu' });
});

@ -0,0 +1,46 @@
AFRAME.registerComponent('hotspots',{
init:function(){
this.el.addEventListener('reloadspots',function(evt){
//get the entire current spot group and scale it to 0
var currspotgroup=document.getElementById(evt.detail.currspots);
currspotgroup.setAttribute("scale","0 0 0");
//get the entire new spot group and scale it to 1
var newspotgroup=document.getElementById(evt.detail.newspots);
newspotgroup.setAttribute("scale","1 1 1");
var laCam = document.getElementById("cam");
laCam.setAttribute("rotation","0 0 0");
});
}
});
AFRAME.registerComponent('spot',{
schema:{
linkto:{type:"string",default:""},
spotgroup:{type:"string",default:""}
},
init:function(){
//add image source of hotspot icon
//make the icon look at the camera all the time
this.el.setAttribute("look-at","#cam");
var data=this.data;
this.el.addEventListener('click',function(){
//set the skybox source to the new image as per the spot
var sky=document.getElementById("skybox");
sky.setAttribute("src",data.linkto);
var spotcomp=document.getElementById("spots");
var currspots=this.parentElement.getAttribute("id");
//create event for spots component to change the spots data
spotcomp.emit('reloadspots',{newspots:data.spotgroup,currspots:currspots});
});
}
});

@ -0,0 +1,54 @@
<!doctype html>
<html lang="fr">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<link rel="stylesheet" href="Vues/css/bootstrap.css">
<link rel="stylesheet" href="Vues/css/style.css">
<title>Panorama finalisé</title>
</head>
<!-- MENU NAV #FFD700 -->
<body >
<nav class="navbar fixed-top navbar-expand-lg navbar-dark bg-dark">
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNavAltMarkup">
<div class="navbar-nav">
<div id="logo">
<img id="logo" src="Vues/photos/logo.png">
</div>
<a class="nav-item nav-link active" href="index.php">Accueil</a>
</div>
</div>
</nav>
<br>
<section id="accueil">
<div id="presentation"">
<p><strong>Bravo, votre panorama est terminé !</strong></p>
<p><strong>Vous pouvez maintenant le télécharger en cliquant sur le bouton ci-dessous. </strong></p>
<p><strong>Après l'avoir téléchargé, vous pourrez le visualiser via la page d'accueil en cliquant sur le bouton "Charger un panorama existant".</strong></p>
<div id="fleches">
<img id="logo" src="Vues/photos/fleches.png">
</div>
</div>
</section>
<br/>
<br/>
<br/>
<section id="creation">
<form method="POST">
<div id="boutonCreer">
<button name="action" value="boutonTelecharger" type="submit" class="btn btn-warning"><strong>Télécharger</strong></button>
</div>
</form>
</section>
<footer><p>FERRERE Clément - MOMMALIER Victor - PONCET Clara - VELUT Lucile </p> |<p> DUT Informatique de Clermont-Ferrand </p></footer>
</body>
</html>

@ -0,0 +1,70 @@
<!doctype html>
<html lang="fr">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<link rel="stylesheet" href="Vues/css/bootstrap.css">
<link rel="stylesheet" href="Vues/css/style.css">
<title>Générateur de panorama</title>
</head>
<!-- MENU NAV #FFD700 -->
<body >
<nav class="navbar fixed-top navbar-expand-lg navbar-dark bg-dark">
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNavAltMarkup">
<div class="navbar-nav">
<div id="logo">
<img id="logo" src="Vues/photos/logo.png">
</div>
<a class="nav-item nav-link active" href="index.php">Accueil</a>
</div>
</div>
</nav>
<br>
<div>
<div>
<form method="POST" action="index.php?action=ValiderCeChoix" enctype="multipart/form-data">
<br/>
<br/>
<br/>
<br/>
<div class="text-center text-white">
<h4 class="text-center">Veuillez selectionner l'image de fond de la carte: (.png / .jpg)</h4>
<input class="btn btn-warning" type="file" name="photoCarte" >
<br/>
<?php
if (isset($this->tableauErreur)) {
if (!empty($this->tableauErreur)) {
echo "<p>$this->tableauErreur</p>";
}
}
?>
</div>
<br/>
<div class="text-center">
<div class="button-login">
<input class="btn btn-warning" type="submit" name="action" value="ValiderCeChoix">
</div>
</div>
</form>
</div>
</div>
</body>
<footer class="align-bottom fixed-bottom"><p>FERRERE Clément - MOMMALIER Victor - PONCET Clara - VELUT Lucile </p> |<p> DUT Informatique de Clermont-Ferrand </p></footer>
</html>

Binary file not shown.

After

Width:  |  Height:  |  Size: 645 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 11 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 145 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 24 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 500 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 808 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 94 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 185 KiB

@ -0,0 +1,82 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Panorama</title>
<script src="https://aframe.io/releases/1.0.4/aframe.min.js"></script>
<script src="https://unpkg.com/aframe-slice9-component/dist/aframe-slice9-component.min.js"></script>
<script src="https://unpkg.com/aframe-look-at-component@0.5.1/dist/aframe-look-at-component.min.js"></script>
</head>
<body>
<a-scene>
<a-assets>
<img id="fleche" src="Vues/photos/fleche.png" height="357" width="367" alt=""/>
<img id="map" src="Vues/photos/map.png" height="256" width="256" alt=""/>
<img id="tooltip" src="Vues/photos/tooltip.png" height="256" width="256" alt=""/>
<?php
foreach ($lesPhotos as $photo) {
echo '<img id="' . $photo->sansExtension() . '" src="photosUpload/' . $photo->getChemin() . '" height="2688" width="5376" alt=""/>';
}
echo '<img id="' . $laCarte->sansExtension() . '" src="photosUpload/' . $laCarte->getChemin() . '" height="2688" width="5376" alt=""/>';
?>
</a-assets>
<a-sky id="skybox" src="#<?php echo $lesPhotos[0]->sansExtension(); ?>"></a-sky>
<a-entity id="cam" camera position="0 1.6 0" look-controls wasd-controls="enabled:false">
<a-entity cursor="fuse:true;fuseTimeout:2000"
geometry="primitive:ring;radiusInner:0.01;radiusOuter:0.02"
position="0 0 -1.8"
material="shader:flat;color:blue">
</a-entity>
</a-entity>
<a-entity id="spots" hotspots>
<?php
echo '<a-entity id="group-' . $lesPhotos[0]->sansExtension() . '" scale="1 1 1">';
echo '<a-image spot="linkto:#' . $laCarte->sansExtension() .
';spotgroup:group-' . $laCarte->sansExtension() . '"
position="-1 -3 -6" src="#map" look-at="#cam"></a-image>';
foreach ($lesPhotos[0]->panneau as $p){
echo '<a-entity slice9="width: 5; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: #tooltip"
text="' . $p->message . '" ;
look-at="#cam" position="' . $p->position . '"></a-entity>';
}
foreach ($lesPhotos[0]->pointNav as $nav) {
echo '<a-image spot="linkto:#' . $nav->sansExtension() .
';spotgroup:group-' . $nav->sansExtension() . '"
position="' . $nav->position . '" src="#fleche" look-at="#cam"></a-image>';
}
echo '</a-entity>';
for ($i = 1 ; $i < $nbPhotos ; $i++) {
echo '<a-entity id="group-' . $lesPhotos[$i]->sansExtension() . '" scale="0 0 0">';
echo '<a-image spot="linkto:#' . $laCarte->sansExtension() . ';spotgroup:group-' . $laCarte->sansExtension() . '"
position="-1 -3 -6" src="#map" look-at="#cam"></a-image>';
foreach ($lesPhotos[$i]->panneau as $p){
echo '<a-entity slice9="width: 5; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: #tooltip"
text="' . $p->message . '" ;
look-at="#cam" position="' . $p->position . '"></a-entity>';
}
foreach ($lesPhotos[$i]->pointNav as $nav) {
echo '<a-image spot="linkto:#' . $nav->sansExtension() . ';spotgroup:group-' . $nav->sansExtension() . '"
position="' . $nav->position . '" src="#fleche" look-at="#cam"></a-image>';
}
echo '</a-entity>';
}
echo '<a-entity id="group-' . $laCarte->sansExtension() . '" scale="0 0 0">';
foreach ($laCarte->pointNav as $nav) {
echo '<a-image spot="linkto:#' . $nav->sansExtension() . ';spotgroup:group-' . $nav->sansExtension() . '"
position="' . $nav->position . '" src="#fleche" look-at="#cam"></a-image>';
}
echo '</a-entity>';
?>
</a-entity>
</a-scene>
</body>
<script type="module" src="Vues/js/scriptTelechargement.js"></script>
</html>

@ -0,0 +1,92 @@
<!doctype html>
<html lang="fr">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<link rel="stylesheet" href="Vues/css/bootstrap.css">
<link rel="stylesheet" href="Vues/css/style.css">
<title>Tutoriel</title>
</head>
<!-- MENU NAV #FFD700 -->
<body >
<nav class="navbar fixed-top navbar-expand-lg navbar-dark bg-dark">
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNavAltMarkup">
<div class="navbar-nav">
<div id="logo">
<img id="logo" src="Vues/photos/logo.png">
</div>
<a class="nav-item nav-link active" href="index.php">Accueil</a>
</div>
</div>
</nav>
<br>
<section id="accueil2">
<div id="presentation">
<p class="soustitre"><strong>TUTORIEL</strong></p>
<p><strong>Comment faire mon propre panorama? </strong></p>
</div>
</section>
<br/>
<br/>
<br/>
<section id="etape1">
<div>
<p class="soustitre"><strong>ETAPE 1 : Créer un élément</strong></p>
<p><strong> Pour créer un panneau, il faut appuyer sur la touche : P .</strong></p>
<p><strong> Pour créer un point de navigation (flèche), il faut appuyer sur la touche : N .</strong></p>
<p><strong> NOTE : Si le panneau n'apparait pas, regarder derrière et autour de vous !</strong></p>
</div>
</section>
<br/><br/><br/>
<section id="etape2">
<div >
<p class="soustitre"><strong>ETAPE 2 : Placer son élément</strong></p>
<p><strong> Pour déplacer un panneau ou un point de navigation, il suffit d'appuyer sur les flèches droite et gauche.</strong></p>
<p><strong> On peut ensuite changer d'axe en appuyant sur la touche A , puis les flèches du clavier déplacerons l'objet sur un axe différent.</strong></p>
<p><strong> NOTE : Une fois que l'élément est placé, il n'est pas possible de revenir à l'élément précédent !</strong></p>
</div>
</section>
<br/>
<br/>
<br/>
<section id="etape3">
<div>
<p class="soustitre"><strong>ETAPE 3 : Passer à l'édition de la photo suivante</strong></p>
<p><strong> Pour passer à la photo suivante, appuyer sur la touche : J .</strong></p>
<p><strong> NOTE : Une fois que vous êtes passé à la photo suivante, vous ne pouvez pas revenir à la photo précédente !</strong></p>
</div>
</section>
<br/>
<br/>
<br/>
<section id="etape4">
<div>
<p class="soustitre"><strong>AIDE-MEMOIRE</strong></p>
<p><strong> A tout moment, pour vous rappeler les touches utiles, appuyer sur la touche H !</strong></p>
<p><strong> Ca y est, vous êtes formé !</strong></p>
</div>
</section>
<br/><br/><br/>
<section id="etape5">
<form method="POST">
<div id="boutonCreer">
<button name="action" value="formulaireAjoutPhotos" type="submit" class="btn btn-warning"><strong>Créer mon propre panorama</strong></button>
</div>
</form>
</div>
</section>
<footer><p>FERRERE Clément - MOMMALIER Victor - PONCET Clara - VELUT Lucile </p> |<p> DUT Informatique de Clermont-Ferrand </p></footer>
</body>
</html>

@ -0,0 +1,54 @@
<?php
class Autoload
{
private static $_instance = null;
public static function charger()
{
if(null !== self::$_instance) {
throw new RuntimeException(sprintf('%s is already started', __CLASS__));
}
self::$_instance = new self();
if(!spl_autoload_register(array(self::$_instance, '_autoload'), false)) {
throw RuntimeException(sprintf('%s : Could not start the autoload', __CLASS__));
}
}
public static function shutDown()
{
if(null !== self::$_instance) {
if(!spl_autoload_unregister(array(self::$_instance, '_autoload'))) {
throw new RuntimeException('Could not stop the autoload');
}
self::$_instance = null;
}
}
private static function _autoload($class)
{
global $chemin;
$filename = $class.'.php';
$dir =array('./','config/','controle/','modele/');
foreach ($dir as $d){
$file=$chemin.$d.$filename;
//echo $file;
if (file_exists($file))
{
include $file;
}
}
}
}
?>

@ -0,0 +1,17 @@
<?php
$chemin=__DIR__.'/../';
//Vues
$lesVues['accueil']='vues/accueil.php';
$lesVues['erreur']='vues/erreur.php';
$lesVues['form']='vues/formulaire.php';
$lesVues['formCarte']='vues/photoCarte.php';
$lesVues['panorama']='vues/choixPhoto.php';
$lesVues['debutpano']='vues/debutPano.php';
$lesVues['carte']='vues/carte.php';
$lesVues['fin']='vues/pageFin.php';
$lesVues['tuto']='vues/tutoriel.php';
$lesVues['resultat']='vues/resultat.php';
?>

@ -0,0 +1,438 @@
<?php
class ControleVisiteur
{
public $tableauErreur = array();
function __construct()
{
global $chemin, $lesVues;
$action = $_REQUEST['action'];
try {
switch ($action) {
case NULL:
$this->accueil();
break;
case "formulaireAjoutPhotos":
$this->formulaireAjout();
break;
case "valider" :
$this->validerFormulaire();
break;
case "ValiderCeChoix" :
$this->validerFormulaireCarte();
break;
case "TUTORIEL" :
$this->tuto();
break;
case "COMMENCER" :
$this->debutPano();
break;
case "SAVE" :
$this->boucle();
break;
case "SaveCarte" :
$this->saveCarte();
break;
case "boutonTelecharger" :
$this->generation();
break;
default:
$this->tableauErreur[] = "Mauvais appel php";
require($chemin . $lesVues['erreur']);
break;
}
} catch (Exception $e) {
$this->tableauErreur[] = "Erreur inattendue";
require($chemin . $lesVues['erreur']);
}
exit(0);
}
public function accueil()
{
global $chemin, $lesVues;
if (!empty($this->tableauErreur)) {
require($chemin . $lesVues['erreur']);
} else {
require($chemin . $lesVues['accueil']);
}
}
public function formulaireAjout() {
global $chemin, $lesVues;
require($chemin . $lesVues['form']);
}
public function validerFormulaire()
{
global $chemin, $lesVues;
$nomProjet=Validation::val_texte($_POST['nomProjet']);
echo $nomProjet;
if (!isset($nomProjet)) {
$this->tableauErreur='nom de projet invalide/vide';
}
$cpt = 0;
$maxFileSize = 20000000;
$fileExt = array('.jpg', '.png', '.jpeg');
$total_fichier_upload = count($_FILES['photos']['tmp_name']);
for ($i = 0; $i < $total_fichier_upload; $i++) {
$fileName = $_FILES['photos']['name'][$i];
$extFichierSubmit = "." . strtolower(substr(strrchr($fileName, "."), 1));
if (!in_array($extFichierSubmit, $fileExt)) {
$this->tableauErreur = $fileName . " : n'est pas une image au format .png, .jpg ou .jpeg";
require($chemin . $lesVues['form']);
break;
}
if ($maxFileSize < $_FILES['photos']['size'][$i]) {
$this->tableauErreur= $fileName . " : Fichier trop volumineux";
require($chemin . $lesVues['form']);
break;
} else {
if(!file_exists ( "photosUpload" )){
mkdir("photosUpload");
}
$fileName = "photosUpload/" . $fileName;
$reussi = move_uploaded_file($_FILES['photos']['tmp_name'][$i], $fileName);
if ($reussi) {
$cpt = $cpt +1;
}
}
}
if($cpt == $total_fichier_upload){
$dir_nom = __DIR__."/../photosUpload";
$dir = opendir($dir_nom) or die('Erreur de listage : le répertoire n\'existe pas');
$lesPhotos = [];
while(false !== ($element = readdir($dir))) {
if($element != '.' && $element != '..') {
$cheminPhoto = "";
$cheminPhoto .= $element;
$photo = new Photos($cheminPhoto);
$lesPhotos [] = $photo;
}
}
$_SESSION['photos']=$lesPhotos;
$_SESSION['titre']=$nomProjet;
closedir($dir);
require($chemin . $lesVues['panorama']);
}
}
public function formulaireAjoutPhotoCarte() {
global $chemin, $lesVues;
require($chemin . $lesVues['formCarte']);
}
public function validerFormulaireCarte()
{
global $chemin, $lesVues;
$maxFileSize = 20000000;
$fileExt = array('.jpg', '.png', '.jpeg');
$fileName = $_FILES['photoCarte']['name'];
$extFichierSubmit = "." . strtolower(substr(strrchr($fileName, "."), 1));
if (!in_array($extFichierSubmit, $fileExt)) {
$this->tableauErreur = $fileName . " : n'est pas une image au format .png, .jpg ou .jpeg";
require($chemin . $lesVues['formCarte']);
}
if ($maxFileSize < $_FILES['photoCarte']['size']) {
$this->tableauErreur = $fileName . " : Fichier trop volumineux";
require($chemin . $lesVues['formCarte']);
} else {
if (!file_exists("photosUpload")) {
mkdir("photosUpload");
}
$fileName = "photosUpload/" . $fileName;
$reussi = move_uploaded_file($_FILES['photoCarte']['tmp_name'], $fileName);
}
if ($reussi) {
$fileName = substr($fileName, strpos($fileName, "/")+1);
$carte = new Photos($fileName);
$_SESSION['carte'] = $carte;
$this->afficherCarte();
return;
}
$this->tableauErreur = $fileName . " : erreur création fichier";
require($chemin . $lesVues['formCarte']);
}
public function afficherCarte(){
global $chemin, $lesVues;
$laCarte = $_SESSION['carte'];
require($chemin.$lesVues['carte']);
}
public function debutPano()
{
global $chemin, $lesVues;
$lesPhotos=$_SESSION['photos'];
$cheminPhoto = filter_var($_POST['photo1'],FILTER_SANITIZE_STRING);
foreach ($lesPhotos as $p){
if($p->getChemin() == $cheminPhoto) {
$photoEnCours=$p;
}
}
$index=array_search($photoEnCours,$lesPhotos);
unset($lesPhotos[$index]);
array_unshift($lesPhotos,$photoEnCours);
$_SESSION['photos']=$lesPhotos;
require($chemin.$lesVues['debutpano']);
}
public function boucle(){
global $chemin, $lesVues;
$lesPhotos=$_SESSION['photos'];
if(!isset($_SESSION['compteur'])){ $_SESSION['compteur']=1;}
$indexPhoto = filter_var($_SESSION['compteur'],FILTER_SANITIZE_NUMBER_INT);
$photoTerminee = $lesPhotos[$indexPhoto-1];
$nbItem = filter_var($_POST['nbElements'],FILTER_SANITIZE_NUMBER_INT);
if ($nbItem != 0) {
for ($i=0 ; $i < $nbItem ; $i++) {
$nom = 'item'. $i;
$type = $_POST[$nom];
$i++;
$nom = 'item'. $i;
$valeur = filter_var($_POST[$nom],FILTER_SANITIZE_STRING);
$i++;
$nom = 'item'. $i;
$coord = filter_var($_POST[$nom],FILTER_SANITIZE_STRING);
if ($type == 'panneau') {
$panneau = new Panneau($valeur,$coord);
$photoTerminee->panneau[] = $panneau;
}
elseif ($type == 'point') {
$point = new PointDeNavigation($valeur,$coord);
$photoTerminee->pointNav[] = $point;
}
}
}
$lesPhotos[$indexPhoto-1] = $photoTerminee;
if($indexPhoto==count($lesPhotos)){
unset($_SESSION['compteur']);
$this->formulaireAjoutPhotoCarte();
return;
}
$photoEnCours=$lesPhotos[$indexPhoto];
$_SESSION['compteur'] = $indexPhoto + 1;
$_SESSION['photos'] = $lesPhotos;
require($chemin.$lesVues['debutpano']);
}
public function saveCarte() {
global $chemin, $lesVues;
$laCarte = $_SESSION['carte'];
$nbItem = filter_var($_POST['nbElements'],FILTER_SANITIZE_NUMBER_INT);
if ($nbItem != 0) {
for ($i=0 ; $i < $nbItem ; $i++) {
$nom = 'item'. $i;
$dest = $_POST[$nom];
$i++;
$nom = 'item'. $i;
$coord = filter_var($_POST[$nom],FILTER_SANITIZE_STRING);
$point = new PointDeNavigation($dest,$coord);
$laCarte->pointNav[] = $point;
}
}
$_SESSION['carte'] = $laCarte;
require($chemin . $lesVues['fin']);
}
public function tuto() {
global $chemin, $lesVues;
require($chemin . $lesVues['tuto']);
}
public function generation() {
global $chemin, $lesVues;
$lesPhotos = $_SESSION['photos'];
$nbPhotos = count($lesPhotos);
$laCarte = $_SESSION['carte'];
$entete = '<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Panorama</title>
<script src="https://aframe.io/releases/1.0.4/aframe.min.js"></script>
<script src="https://unpkg.com/aframe-slice9-component/dist/aframe-slice9-component.min.js"></script>
<script src="https://unpkg.com/aframe-look-at-component@0.5.1/dist/aframe-look-at-component.min.js"></script>
<script src="https://unpkg.com/aframe-animation-component@^4.1.2/dist/aframe-animation-component.min.js"></script>
<script src="js/spots.js"></script>
</head>
<body>
<a-scene>';
$asset = '<a-assets>
<img id="fleche" src="icones/fleche.png" height="357" width="367" alt=""/>
<img id="map" src="icones/map.png" height="256" width="256" alt=""/>
<img id="fondBlanc" src="icones/fondBlanc.png" height="256" width="256" alt=""/>
<img id="logoJaune" src="icones/logoJaune.png" alt=""/>';
foreach ($lesPhotos as $photo) {
$asset .= '<img id="' . $photo->sansExtension() . '" src="photos/' . $photo->getChemin() . '" height="2688" width="5376" alt=""/>';
}
$asset .= '<img id="' . $laCarte->sansExtension() . '" src="photos/' . $laCarte->getChemin() . '" height="400" width="800" alt=""/>';
$asset .= '</a-assets>';
$skyBox = '<a-sky id="skybox" src="#' . $lesPhotos[0]->sansExtension() . '"></a-sky>';
$camera = '<a-entity id="cam" camera position="0 1.6 0" look-controls wasd-controls="enabled:false">
<a-entity cursor="fuse:true;fuseTimeout:2000"
geometry="primitive:ring;radiusInner:0.01;radiusOuter:0.02"
position="0 0 -1.8"
material="shader:flat;color:blue">
</a-entity>
</a-entity>';
$lesGroupes = '<a-entity id="spots" hotspots>';
$lesGroupes .= '<a-entity id="group-' . $lesPhotos[0]->sansExtension() . '" scale="1 1 1">';
$lesGroupes .= '<a-image spot="linkto:#fondBlanc;spotgroup:group-fondBlanc"
position="-1 -3 -6" src="#map" look-at="#cam"></a-image>';
foreach ($lesPhotos[0]->panneau as $p){
$lesGroupes .= '<a-entity slice9="width: 5; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: icones/tooltip.png"
text="value:' . $p->message . ';wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="' . $p->position . '"></a-entity>';
}
foreach ($lesPhotos[0]->pointNav as $nav) {
$lesGroupes .= '<a-image spot="linkto:#' . $nav->sansExtension() .
';spotgroup:group-' . $nav->sansExtension() . '"
position="' . $nav->position . '" src="#fleche" look-at="#cam"></a-image>';
}
$lesGroupes .= '</a-entity>';
for ($i = 1 ; $i < $nbPhotos ; $i++) {
$lesGroupes .= '<a-entity id="group-' . $lesPhotos[$i]->sansExtension() . '" scale="0 0 0">';
$lesGroupes .= '<a-image spot="linkto:#fondBlanc;spotgroup:group-fondBlanc"
position="-1 -3 -6" src="#map" look-at="#cam"></a-image>';
foreach ($lesPhotos[$i]->panneau as $p){
$lesGroupes .= '<a-entity slice9="width: 5; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: icones/tooltip.png"
text="value:' . $p->message . ';wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="' . $p->position . '"></a-entity>';
}
foreach ($lesPhotos[$i]->pointNav as $nav) {
$lesGroupes .= '<a-image spot="linkto:#' . $nav->sansExtension() . ';spotgroup:group-' . $nav->sansExtension() . '"
position="' . $nav->position . '" src="#fleche" look-at="#cam"></a-image>';
}
$lesGroupes .= '</a-entity>';
}
$lesGroupes .= '<a-entity id="group-fondBlanc" scale="0 0 0">';
$lesGroupes .= '<a-plane position="-1.89574 1.6 -1.96425" src="#' . $laCarte->sansExtension() . '" look-at="#cam" height="4" width="6" rotation="0 43.98317825991033 0">
</a-plane>';
foreach ($laCarte->pointNav as $nav) {
$lesGroupes .= '<a-image spot="linkto:#' . $nav->sansExtension() . ';spotgroup:group-' . $nav->sansExtension() . '"
height="0.480" width="0.300" position="' . $nav->position . '" src="#logoJaune" look-at="#cam"></a-image>';
}
$lesGroupes .= '</a-entity>';
$lesGroupes .= '</a-entity>';
$fin = '</a-scene>
</body>
</html>';
$sauvegarde = $entete . $asset . $skyBox . $camera . $lesGroupes . $fin;
file_put_contents("index.html",$sauvegarde);
//CREATION DU FICHIER ZIP
$zip = new ZipArchive();
$ret = $zip->open(Validation::val_texte($_SESSION['titre']).'.zip', ZipArchive::CREATE | ZipArchive::OVERWRITE);
if ($ret !== TRUE) {
echo "A échoué avec le code d'erreur " . $ret;
} else {
//On ajoute les icones au fichier zip
$options = array('add_path' => 'icones/', 'remove_all_path' => TRUE);
$zip->addGlob('Vues/photos/fleche.png', GLOB_BRACE, $options);
$zip->addGlob('Vues/photos/fondBlanc.png', GLOB_BRACE, $options);
$zip->addGlob('Vues/photos/map.png', GLOB_BRACE, $options);
$zip->addGlob('Vues/photos/tooltip.png', GLOB_BRACE, $options);
$zip->addGlob('Vues/photos/logoJaune.png', GLOB_BRACE, $options);
//On ajoute le script JS
$options = array('add_path' => 'js/', 'remove_all_path' => TRUE);
$zip->addGlob('Vues/js/spots.js', GLOB_BRACE, $options);
//On ajoute les photos uploadées au fichier zip
$options = array('add_path' => 'photos/', 'remove_all_path' => TRUE);
$zip->addGlob('./photosUpload/*.{png,PNG,jpg,JPG}', GLOB_BRACE, $options);
//On ajoute le fichier résultat
$options = array('add_path' => ' ', 'remove_all_path' => TRUE);
$zip->addGlob('index.html', GLOB_BRACE, $options);
}
$zip->close();
$file = Validation::val_texte($_SESSION['titre']).'.zip';
if (file_exists($file)) {
ob_start();
header('Content-Description: File Transfer');
header('Content-Type: application/octet-stream');
header('Content-Disposition: attachment; filename="'.basename($file).'"');
header('Expires: 0');
header('Cache-Control: must-revalidate');
header('Pragma: public');
header('Content-Length: ' . filesize($file));
while (ob_get_level()) {
ob_end_clean();
}
readfile($file);
exit;
}
session_unset();
require($chemin . $lesVues['accueil']);
}
}

@ -0,0 +1,20 @@
<?php
class Validation
{
//Validation de l'action
static function val_action(string $action)
{
return filter_var($action, FILTER_SANITIZE_STRING);
}
//Validation texte
static function val_texte(string $texte)
{
return filter_var($texte, FILTER_SANITIZE_STRING);
}
}

@ -0,0 +1,21 @@
<html>
<body>
<?php
require_once(__DIR__.'/config/configuration.php');
//chargement autoloader pour autochargement des classes
require_once(__DIR__.'/config/Autoload.php');
Autoload::charger();
//début de la session
session_start();
$ctrl = new ControleVisiteur();
?>
</body>
</html>

@ -0,0 +1,14 @@
<?php
class Panneau
{
public string $position;
public string $message;
public function __construct(string $text, string $pos)
{
$this->message = $text;
$this->position = $pos;
}
}

@ -0,0 +1,24 @@
<?php
class Photos{
private string $chemin;
public array $panneau = [];
public array $pointNav = [];
public function __construct(string $chemin)
{
$this->chemin = $chemin;
}
public function getChemin() : string
{
return $this->chemin;
}
public function sansExtension() : string
{
$nom = substr($this->chemin, 0, strpos($this->chemin, "."));
return $nom;
}
}

@ -0,0 +1,20 @@
<?php
class PointDeNavigation
{
public string $position;
public string $destination;
public function __construct(string $dest, string $pos) {
$this->destination = $dest;
$this->position = $pos;
}
public function sansExtension() : string
{
$nom = substr($this->destination, 0, strpos($this->destination, "."));
$nom = substr($nom, strpos($this->destination, "/")+1);
return $nom;
}
}

@ -0,0 +1,7 @@
.idea/
Panorama/.idea/
Panorama/.idea/workspace.xml
*.xml

@ -0,0 +1,279 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Panorama</title>
<script src="https://aframe.io/releases/1.0.4/aframe.min.js"></script>
<script src="https://unpkg.com/aframe-slice9-component/dist/aframe-slice9-component.min.js"></script>
<script src="https://unpkg.com/aframe-look-at-component@0.5.1/dist/aframe-look-at-component.min.js"></script>
<!--animation component script-->
<script src="https://unpkg.com/aframe-animation-component@^4.1.2/dist/aframe-animation-component.min.js"></script>
<script src="scriptJS/spots.js"></script>
</head>
<body>
<a-scene id="notreScene" loading-screen="dotsColor:#FED700; backgroundColor: #303030">
<a-assets timeout="30000">
<!-- Toutes les scènes les utilisent -->
<img id="fleche" src="icones/fleche.png" height="357" width="367" alt=""/>
<img id="map" src="icones/map.png" height="256" width="256" alt=""/>
<a-sound id="boup" src="son/BOUP.mp3"></a-sound>
<!-- Bâtiment central entrée parking -->
<img id="accueilCentral" src="image/accueilCentral.jpg" height="2688" width="5376" alt=""/>
<img id="centreCentral" src="image/centreCentral.jpg" height="2688" width="5376" alt=""/>
<img id="devantBibliotheque" src="image/devantBibliotheque.jpg" height="2688" width="5376" alt=""/>
<img id="droitCentral" src="image/droitCentral.jpg" height="2688" width="5376" alt=""/>
<img id="coinCafet" src="image/coinCafet.JPG" height="2688" width="5376" alt=""/>
<img id="entreeCafet" src="image/entreeCafet.jpg" height="2688" width="5376" alt=""/>
<img id="cafet" src="image/cafet.jpg" height="2688" width="5376" alt=""/>
<img id="sandwich" src="image/sandwich.jpg" height="2688" width="5376" alt=""/>
</a-assets>
<a-sky id="skybox" src="#accueilCentral"></a-sky>
<a-entity id="cam" camera position="0 1.6 0" look-controls wasd-controls="enabled:false">
<a-entity cursor="fuse:true;fuseTimeout:2000"
geometry="primitive:ring;radiusInner:0.01;radiusOuter:0.02"
position="0 0 -1.8"
material="shader:flat;color:blue">
</a-entity>
</a-entity>
<a-entity id="spots" hotspots>
<!-- GROUPE CENTRAL -->
<a-entity id="group-accueilCentral">
<a-entity slice9="width: 5; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Cour;wrap-count:15; width:5; align:center;zOffset:0.05" ; look-at="#cam"
position="-4.37679 -1.061 7.2518"></a-entity>
<a-entity slice9="width: 5; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Bibliotheque et cafeteria;wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="-10.298 -1 1.112"></a-entity>
<a-entity slice9="width: 5; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Infirmerie et administration;wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="8.248 -0.804 6.951"></a-entity>
<a-image spot="linkto: #droitCentral; spotgroup: group-droitCentral"
position="-7.385 -1.65 0.73417" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:exterieurCentral.html; on:click"
position="2.99072 -2.46 -4.97548" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto:#centreCentral; spotgroup: group-centreCentral"
position="-4.37679 -2.46 7.25185" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="-4.7 0 -4.2" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-droitCentral" scale="0 0 0">
<a-entity slice9="width: 5; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Bibliotheque et cafeteria ;wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="-8.631 -0.3 0.481"></a-entity>
<a-entity slice9="width: 6; height: 3; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Departement GEA et salles d'anglais;wrap-count:15; width:5; align:center;zOffset:0.05"
; look-at="#cam" position="-3.604 -0.754 -9.348"></a-entity>
<a-entity slice9="width: 5; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Sortie;wrap-count:15; width:5; align:center;zOffset:0.05" ; look-at="#cam"
position="9.972 -1.121 6.725"></a-entity>
<a-image spot="linkto: #devantBibliotheque; spotgroup: group-devantBibliotheque"
position="-6.68105 -1.65 1.00882" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto: #accueilCentral; spotgroup: group-accueilCentral"
position="7.16276 -1.65 5.56906" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="0.8 -0.5 -6.8" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-centreCentral" scale="0 0 0">
<a-image spot="linkto: #accueilCentral; spotgroup: group-accueilCentral"
position="2 -1 10" look-at="#cam" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto: #devantBibliotheque; spotgroup: group-devantBibliotheque"
position="9.4 0 0" look-at="#cam" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="6 0 4.6" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-devantBibliotheque" scale="0 0 0">
<a-entity slice9="width: 5; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Bibliotheque;wrap-count:15; width:5; align:center;zOffset:0.05" ; look-at="#cam"
position="1.928 0.157 8.622"></a-entity>
<a-entity slice9="width: 5; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Cour;wrap-count:15; width:5; align:center;zOffset:0.05" ; look-at="#cam"
position="-8.448 -2.065 -7.040"></a-entity>
<a-entity slice9="width: 6; height: 3; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Cafeteria et sortie vers amphitheatres;wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="7.570 0.772 -3.315"></a-entity>
<a-entity slice9="width: 5; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Accueil batiment central;wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="-9.989 0.646 3.155"></a-entity>
<a-image spot="linkto: #coinCafet; spotgroup: group-coinCafet"
position="7.70431 -1.65 -0.61523" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto: #droitCentral; spotgroup: group-droitCentral"
position="-10.87405 -1.65 0.67964" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto: #centreCentral; spotgroup: group-centreCentral"
position="-6.15781 -2.63442 -5" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="2.4 0 -4.6" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-coinCafet" scale="0 0 0">
<a-entity slice9="width: 5; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Cafeteria ;wrap-count:15; width:5; align:center;zOffset:0.05" ; look-at="#cam"
position="7.779 -1.183 3.935"></a-entity>
<a-entity slice9="width: 5; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Sortie vers amphitheatres ;wrap-count:15; width:5; align:center;zOffset:0.05" ; look-at="#cam"
position="-5.694 -0.3 6.374"></a-entity>
<a-entity slice9="width: 5; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Bibliotheque et accueil ;wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="4.497 0.5 -4.625"></a-entity>
<a-image link="href:exterieurAmphi.html; on:click"
position="-4.67079 -1.65 5.53263" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto: #entreeCafet; spotgroup: group-entreeCafet"
position="4.35943 -1.65 3.59501" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto: #devantBibliotheque; spotgroup: group-devantBibliotheque"
position="5.02151 -1.65 -5.60137" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="-3.2 0 -3.8" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-entreeCafet" scale="0 0 0">
<a-entity slice9="width: 5; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Cafeteria : plats chauds ;wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="9.216 0.059 -2.446"></a-entity>
<a-entity slice9="width: 5; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Cafeteria : sandwichs;wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="-1.642 0.5 -8.530"></a-entity>
<a-image spot="linkto: #coinCafet; spotgroup:group-coinCafet"
position="0.80785 -2.27172 6.03043" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto: #cafet; spotgroup: group-cafet"
position="7.22524 -1.65 -1.28208" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto: #sandwich; spotgroup: group-sandwich"
position="-0.8 -1.65 -9.73296" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="-3.1 0 2.8" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-sandwich" scale="0 0 0">
<a-entity slice9="width: 5; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Vente sandwichs;wrap-count:15; width:5; align:center;zOffset:0.05" ; look-at="#cam"
position="7.675 0.170 4.792"></a-entity>
<a-image spot="linkto: #entreeCafet; spotgroup: group-entreeCafet"
position="-3.45167 -1.65 5.05973" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="-7 0 2.3" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-cafet" scale="0 0 0">
<a-image spot="linkto: #entreeCafet; spotgroup: group-entreeCafet"
position="6.05826 -1.65 3.84593" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="2.2 0 5.8" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
</a-entity>
</a-scene>
</body>
</html>

@ -0,0 +1,301 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Panorama</title>
<script src="https://aframe.io/releases/1.0.4/aframe.min.js"></script>
<script src="https://unpkg.com/aframe-slice9-component/dist/aframe-slice9-component.min.js"></script>
<script src="https://unpkg.com/aframe-look-at-component@0.5.1/dist/aframe-look-at-component.min.js"></script>
<!--animation component script-->
<script src="https://unpkg.com/aframe-animation-component@^4.1.2/dist/aframe-animation-component.min.js"></script>
<script src="scriptJS/spots.js"></script>
</head>
<body>
<a-scene id="notreScene" loading-screen="dotsColor:#FED700; backgroundColor: #303030">
<a-assets timeout="30000">
<!-- Toutes les scènes les utilisent -->
<img id="fleche" src="icones/fleche.png" height="357" width="367" alt=""/>
<img id="map" src="icones/map.png" height="256" width="256" alt=""/>
<a-sound id="boup" src="son/BOUP.mp3"></a-sound>
<!-- Bâtiment central entrée parking -->
<img id="coinCafet" src="image/coinCafet.JPG" height="2688" width="5376" alt=""/>
<img id="devantBibliotheque" src="image/devantBibliotheque.jpg" height="2688" width="5376" alt=""/>
<img id="entreeCafet" src="image/entreeCafet.jpg" height="2688" width="5376" alt=""/>
<img id="droitCentral" src="image/droitCentral.jpg" height="2688" width="5376" alt=""/>
<img id="centreCentral" src="image/centreCentral.jpg" height="2688" width="5376" alt=""/>
<img id="cafet" src="image/cafet.jpg" height="2688" width="5376" alt=""/>
<img id="sandwich" src="image/sandwich.jpg" height="2688" width="5376" alt=""/>
<img id="accueilCentral" src="image/accueilCentral.jpg" height="2688" width="5376" alt=""/>
</a-assets>
<a-sky id="skybox" src="#coinCafet"></a-sky>
<a-entity id="cam" camera position="0 1.6 0" look-controls wasd-controls="enabled:false">
<a-entity cursor="fuse:true;fuseTimeout:2000"
geometry="primitive:ring;radiusInner:0.01;radiusOuter:0.02"
position="0 0 -1.8"
material="shader:flat;color:blue">
</a-entity>
</a-entity>
<a-entity id="spots" hotspots>
<!-- GROUPE CENTRAL -->
<a-entity id="group-coinCafet">
<a-entity slice9="width: 5; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Cafeteria ;wrap-count:15; width:5; align:center;zOffset:0.05" ; look-at="#cam"
position="7.779 -1.183 3.935"></a-entity>
<a-entity slice9="width: 5; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Sortie vers amphitheatres ;wrap-count:15; width:5; align:center;zOffset:0.05" ; look-at="#cam"
position="-5.694 -0.3 6.374"></a-entity>
<a-entity slice9="width: 5; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Bibliotheque et accueil ;wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="4.497 0.5 -4.625"></a-entity>
<a-image link="href:exterieurAmphi.html; on:click"
position="-4.67079 -1.65 5.53263" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
<a-image spot="linkto: #entreeCafet; spotgroup: group-entreeCafet"
position="4.35943 -1.65 3.59501" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
<a-image spot="linkto: #devantBibliotheque; spotgroup: group-devantBibliotheque"
position="5.02151 -1.65 -5.60137" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
<a-image link="href:cartes.html; on:click"
position="-3.2 0 -3.8" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-devantBibliotheque" scale="0 0 0">
<a-entity slice9="width: 5; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Bibliotheque;wrap-count:15; width:5; align:center;zOffset:0.05" ; look-at="#cam"
position="1.928 0.157 8.622"></a-entity>
<a-entity slice9="width: 5; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Cour;wrap-count:15; width:5; align:center;zOffset:0.05" ; look-at="#cam"
position="-8.448 -2.065 -7.040"></a-entity>
<a-entity slice9="width: 6; height: 3; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Cafeteria et sortie vers amphitheatres;wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="7.570 0.772 -3.315"></a-entity>
<a-entity slice9="width: 5; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Accueil batiment central;wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="-9.989 0.646 3.155"></a-entity>
<a-image spot="linkto: #coinCafet; spotgroup: group-coinCafet"
position="7.70431 -1.65 -0.61523" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
<a-image spot="linkto: #droitCentral; spotgroup: group-droitCentral"
position="-10.87405 -1.65 0.67964" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
<a-image spot="linkto: #centreCentral; spotgroup: group-centreCentral"
position="-6.15781 -2.63442 -5" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
<a-image link="href:cartes.html; on:click"
position="2.4 0 -4.6" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-entreeCafet" scale="0 0 0">
<a-entity slice9="width: 5; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Cafeteria : plats chauds ;wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="9.216 0.059 -2.446"></a-entity>
<a-entity slice9="width: 5; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Cafeteria : sandwichs;wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="-1.642 0.5 -8.530"></a-entity>
<a-image spot="linkto: #coinCafet; spotgroup:group-coinCafet"
position="0.80785 -2.27172 6.03043" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
<a-image spot="linkto: #cafet; spotgroup: group-cafet"
position="7.22524 -1.65 -1.28208" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
<a-image spot="linkto: #sandwich; spotgroup: group-sandwich"
position="-0.8 -1.65 -9.73296" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
<a-image link="href:cartes.html; on:click"
position="-3.1 0 2.8" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-droitCentral" scale="0 0 0">
<a-entity slice9="width: 5; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Bibliotheque et cafeteria ;wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="-8.631 -0.3 0.481"></a-entity>
<a-entity slice9="width: 6; height: 3; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Departement GEA et salles d'anglais;wrap-count:15; width:5; align:center;zOffset:0.05"
; look-at="#cam" position="-3.604 -0.754 -9.348"></a-entity>
<a-entity slice9="width: 5; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Sortie;wrap-count:15; width:5; align:center;zOffset:0.05" ; look-at="#cam"
position="9.972 -1.121 6.725"></a-entity>
<a-image spot="linkto: #devantBibliotheque; spotgroup: group-devantBibliotheque"
position="-6.68105 -1.65 1.00882" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
<a-image spot="linkto: #accueilCentral; spotgroup: group-accueilCentral"
position="7.16276 -1.65 5.56906" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
<a-image link="href:cartes.html; on:click"
position="0.8 -0.5 -6.8" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-centreCentral" scale="0 0 0">
<a-image spot="linkto: #accueilCentral; spotgroup: group-accueilCentral"
position="2 -1 10" look-at="#cam" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
<a-image spot="linkto: #devantBibliotheque; spotgroup: group-devantBibliotheque"
position="9.4 0 0" look-at="#cam" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
<a-image link="href:cartes.html; on:click"
position="6 0 4.6" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-cafet" scale="0 0 0">
<a-image spot="linkto: #entreeCafet; spotgroup: group-entreeCafet"
position="6.05826 -1.65 3.84593" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
<a-image link="href:cartes.html; on:click"
position="2.2 0 5.8" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-sandwich" scale="0 0 0">
<a-entity slice9="width: 5; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Vente sandwichs;wrap-count:15; width:5; align:center;zOffset:0.05" ; look-at="#cam"
position="7.675 0.170 4.792"></a-entity>
<a-image spot="linkto: #entreeCafet; spotgroup: group-entreeCafet"
position="-3.45167 -1.65 5.05973" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="-7 0 2.3" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-accueilCentral" scale="0 0 0">
<a-entity slice9="width: 5; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Cour;wrap-count:15; width:5; align:center;zOffset:0.05" ; look-at="#cam"
position="-4.37679 -1.061 7.2518"></a-entity>
<a-entity slice9="width: 5; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Bibliotheque et cafeteria;wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="-10.298 -1 1.112"></a-entity>
<a-entity slice9="width: 5; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Infirmerie et administration;wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="8.248 -0.804 6.951"></a-entity>
<a-image link="href:exterieurCentral.html; on:click"
position="-7.385 -1.65 0.73417" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
<a-image spot="linkto: #exterieurCentral; spotgroup: group-exterieurCentral"
position="2.99072 -2.46 -4.97548" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
<a-image spot="linkto: #centreCentral; spotgroup: group-centreCentral"
position="-4.37679 -2.46 7.25185" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
<a-image link="href:cartes.html; on:click"
position="-4.7 0 -4.2" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
</a-entity>
</a-scene>
</body>
</html>

@ -0,0 +1,631 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Panorama</title>
<script src="https://aframe.io/releases/1.0.4/aframe.min.js"></script>
<script src="https://unpkg.com/aframe-slice9-component/dist/aframe-slice9-component.min.js"></script>
<script src="https://unpkg.com/aframe-look-at-component@0.5.1/dist/aframe-look-at-component.min.js"></script>
<!--animation component script-->
<script src="https://unpkg.com/aframe-animation-component@^4.1.2/dist/aframe-animation-component.min.js"></script>
<script src="scriptJS/spots.js"></script>
</head>
<body>
<a-scene id="notreScene" loading-screen="dotsColor:#FED700; backgroundColor: #303030">
<a-assets timeout="30000">
<img id="fleche" src="icones/fleche.png" height="357" width="367" alt=""/>
<img id="map" src="icones/map.png" height="256" width="256" alt=""/>
<a-sound id="boup" src="son/BOUP.mp3"></a-sound>
<!-- Bat Info RDC
<img id="milieuA" src="image/milieuA.JPG" height="2688" width="5376" alt=""/>
<img id="escalierMilieuA" src="image/escalierMilieuA.JPG" height="2688" width="5376" alt=""/>
<img id="couloirA12" src="image/couloirA12.JPG" height="2688" width="5376" alt=""/>
<img id="A12" src="image/A12.JPG" height="2688" width="5376" alt=""/>
<img id="couloirA18A19" src="image/couloirA18A19.JPG" height="2688" width="5376" alt=""/>
<img id="A18" src="image/A18.JPG" height="2688" width="5376" alt=""/>
<img id="A19" src="image/A19.JPG" height="2688" width="5376" alt="">
<img id="couloirA21A22" src="image/couloirA21A22.JPG" height="2688" width="5376" alt=""/>
<img id="A21" src="image/A21.JPG" height="2688" width="5376" alt=""/>
<img id="A22" src="image/A22.JPG" height="2688" width="5376" alt=""/>
<img id="couloirA23" src="image/couloirA23.JPG" height="2688" width="5376" alt=""/>
<img id="A23" src="image/A23.JPG" height="2688" width="5376" alt=""/>
<img id="gaucheA" src="image/gaucheA.JPG" height="2688" width="5376" alt=""/>
-->
<!--Bat Info 1er étage-->
<img id="escalierMilieuA" src="image/escalierMilieuA.JPG" height="2688" width="5376" alt=""/>
<img id="escalierMilieuB" src="image/escalierMilieuB.JPG" height="2688" width="5376" alt=""/>
<img id="milieuB" src="image/milieuB.JPG" height="2688" width="5376" alt=""/>
<img id="B10" src="image/B10.JPG" height="2688" width="5376" alt=""/>
<img id="couloirB12" src="image/couloirB12.JPG" height="2688" width="5376" alt=""/>
<img id="secretariat" src="image/secretariat.JPG" height="2688" width="5376" alt=""/>
<img id="B12" src="image/B12.JPG" height="2688" width="5376" alt=""/>
<img id="couloirB14B17" src="image/couloirB14B17.JPG" height="2688" width="5376" alt=""/>
<img id="B14" src="image/B14.JPG" height="2688" width="5376" alt=""/>
<img id="B17" src="image/B17.JPG" height="2688" width="5376" alt=""/>
<img id="couloirB18B19" src="image/couloirB18B19.JPG" height="2688" width="5376" alt=""/>
<img id="B18" src="image/B18.JPG" height="2688" width="5376" alt=""/>
<img id="B19" src="image/B19.JPG" height="2688" width="5376" alt=""/>
<img id="couloirB20B21B22B23" src="image/couloirB20B21B22B23.JPG" height="2688" width="5376" alt=""/>
<img id="B20" src="image/B20.JPG" height="2688" width="5376" alt=""/>
<img id="B21" src="image/B21.JPG" height="2688" width="5376" alt=""/>
<img id="B22" src="image/B22.JPG" height="2688" width="5376" alt=""/>
<img id="B23" src="image/B23.JPG" height="2688" width="5376" alt=""/>
<img id="gaucheB" src="image/gaucheB.JPG" height="2688" width="5376" alt=""/>
<img id="escalierGaucheB" src="image/escalierGaucheB.JPG" height="2688" width="5376" alt=""/>
<img id="escalierGaucheA" src="image/escalierGaucheA.JPG" height="2688" width="5376" alt=""/>
<!-- Cartes
<img id="fondBlanc" src="image/fondBlanc.jpg" alt=""/>
<img id="batInfo" src="image/batInfo.jpg" alt=""/>
<img id="cartePrincipale" src="image/planPrincipal.jpg" alt=""/>
<img id="logoBleu" src="image/logoBleu.png" alt=""/>
<img id="logoVert" src="image/logoVert.png" alt=""/>
<img id="logoJaune" src="image/logoJaune.png" alt=""/>
<img id="logoRouge" src="image/logoRouge.png" alt=""/>
-->
</a-assets>
<a-sky id="skybox" src="#escalierMilieuA"></a-sky>
<a-entity id="cam" camera position="0 1.6 0" look-controls wasd-controls="enabled:false">
<a-entity cursor="fuse:true;fuseTimeout:2000"
geometry="primitive:ring;radiusInner:0.01;radiusOuter:0.02"
position="0 0 -1.8"
material="shader:flat;color:blue">
</a-entity>
</a-entity>
<a-entity id="spots" hotspots>
<!-- GROUPE B -->
<a-entity id="group-escalierMilieuA">
<a-entity slice9="width: 6; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:1er etage : couloir B;wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="-8.563 1.454 -1.324"></a-entity>
<a-image link="href:batInfoRDC.html; on:click"
position="0 -1.2 -5.4" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
<a-image spot="linkto: #escalierMilieuB; spotgroup: group-escalierMilieuB"
position="-6.2 -0.2 -1" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
<a-image link="href:cartes.html; on:click"
position="4 0 -3.9" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-escalierMilieuB" scale="0 0 0">
<a-entity slice9="width: 6; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Rez de chaussee : couloir A et sortie;wrap-count:15; width:5; align:center;zOffset:0.05"
; look-at="#cam" position="5.406 -1.2 3.923"></a-entity>
<a-entity slice9="width: 6; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:1er etage : couloir B;wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="-7.234 0.048 3.094"></a-entity>
<a-entity slice9="width: 6; height: 3; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:2eme etage : bureaux des professeurs;wrap-count:15; width:5; align:center;zOffset:0.05"
; look-at="#cam" position="0.199 0.569 8.327"></a-entity>
<a-image spot="linkto: #escalierMilieuA; spotgroup: group-escalierMilieuA"
position="3.59377 -2.53044 3.51972" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
<a-image spot="linkto: #milieuB; spotgroup: group-milieuB"
position="-3.93702 -0.36345 1.78281" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
<a-image link="href:cartes.html; on:click"
position="-2.5 0 -3.9" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-milieuB" scale="0 0 0">
<a-entity slice9="width: 6; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:B10-Salle de TP;wrap-count:15; width:5; align:center;zOffset:0.05" ; look-at="#cam"
position="-15 0.2 -1.825"></a-entity>
<a-entity slice9="width: 6; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Rez de chaussee : couloir A;wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="10 0.4 -15"></a-entity>
<a-entity slice9="width: 6; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Departement RT;wrap-count:15; width:5; align:center;zOffset:0.05" ; look-at="#cam"
position="-8.8 0.1 -7.259"></a-entity>
<a-entity slice9="width: 6; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Couloir B;wrap-count:15; width:5; align:center;zOffset:0.05" ; look-at="#cam"
position="9 0 6"></a-entity>
<a-image spot="linkto: #B10; spotgroup: group-B10"
position="-7.5 -0.12484 -1.41482" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
<a-image spot="linkto: #couloirB12; spotgroup: group-couloirB12"
position="4.40506 -0.17172 3.28099" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
<a-image spot="linkto: #escalierMilieuB; spotgroup: group-escalierMilieuB"
position="4.42694 -0.71457 -6.80564" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
<a-image link="href:cartes.html; on:click"
position="-2.5 0 4.7" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-B10" scale="0 0 0">
<a-image spot="linkto: #milieuB; spotgroup: group-milieuB"
position="5.64364 -0.45557 -7.09444" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
<a-image link="href:cartes.html; on:click"
position="-1 0 -6.8" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-couloirB12" scale="0 0 0">
<a-entity slice9="width: 6; height: 3; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Panneaux informatifs avec les emplois du temps des eleves;wrap-count:15; width:5; align:center;zOffset:0.05"
; look-at="#cam" position="-9 4 11"></a-entity>
<a-entity slice9="width: 5; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Secreteriat departement Informatique;wrap-count:15; width:5; align:center;zOffset:0.05"
; look-at="#cam" position="-6 2 -7"></a-entity>
<a-entity slice9="width: 6; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:B12-Salle de TP et de tutorat;wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="-0.320 1.716 8.479"></a-entity>
<a-entity slice9="width: 5; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Escalier vers rez de chaussee;wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="-15.5 -0.082 7.727"></a-entity>
<a-image spot="linkto: #B12; spotgroup: group-B12"
position="1.967 0.1291 5.53" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
<a-image spot="linkto: #secretariat; spotgroup: group-secretariat"
position="-1.97284 -0.27046 -6.4716" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
<a-image spot="linkto: #couloirB14B17; spotgroup: group-couloirB14B17"
position="6.25782 0.55436 -1.93283" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
<a-image spot="linkto: #milieuB; spotgroup: group-milieuB" position="-7.5138 -0.45557 2.28995"
look-at="#cam" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
<a-image link="href:cartes.html; on:click"
position="4.5 0 1.4" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-secretariat" scale="0 0 0">
<a-image spot="linkto: #couloirB12; spotgroup: group-couloirB12"
position="5.35987 0.61905 -4.96787" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
<a-image link="href:cartes.html; on:click"
position="-2.7 0 -4.3" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-B12" scale="0 0 0">
<a-image spot="linkto: #couloirB12; spotgroup: group-couloirB12"
position="-7.03551 0.90978 -2.52496" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
-
<a-image link="href:cartes.html; on:click"
position="-7.5 0.5 2" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-couloirB14B17" scale="0 0 0">
<a-image spot="linkto: #B14; spotgroup: group-B14"
position="-0.90702 0.04163 -7.62626" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
<a-image spot="linkto: #B17; spotgroup: group-B17"
position="3.83091 0.24606 6.95009" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
<a-image spot="linkto: #couloirB12; spotgroup: group-couloirB12"
position="5.60677 -0.32639 -1.27354" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
<a-image spot="linkto: #couloirB18B19; spotgroup: group-couloirB18B19"
position="-7.02752 -0.0323 1.52582" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
<a-image link="href:cartes.html; on:click"
position="-4.5 0 -2" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-B14" scale="0 0 0">
<a-image spot="linkto: #couloirB14B17; spotgroup: group-couloirB14B17"
position="4.3 1.2 4.5" look-at="#cam" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
<a-image link="href:cartes.html; on:click"
position="6.5 0 1.5" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-B17" scale="0 0 0">
<a-image spot="linkto: #couloirB14B17; spotgroup: group-couloirB14B17"
position="5.04639 0.08424 3.34307" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
<a-image link="href:cartes.html; on:click"
position="1 0 5" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-couloirB18B19" scale="0 0 0">
<a-entity slice9="width: 5; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:B18-Salle de TP;wrap-count:15; width:5; align:center;zOffset:0.05" ; look-at="#cam"
position="3.636 1.697 -0.932"></a-entity>
<a-entity slice9="width: 5; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:B19-Salle de TP;wrap-count:15; width:5; align:center;zOffset:0.05" ; look-at="#cam"
position="-7.5 1.8 -0.35"></a-entity>
<a-image spot="linkto: #B18; spotgroup: group-B18"
position="5.4 0.36694 -2.2" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
<a-image spot="linkto: #B19; spotgroup: group-B19"
position="-7.5 -0.78827 2.4102" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
<a-image spot="linkto: #couloirB14B17; spotgroup: group-couloirB14B17"
position="0.86101 -0.6179 8.32408" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
<a-image spot="linkto: #couloirB20B21B22B23; spotgroup: group-couloirB20B21B22B23"
position="-1.12476 -0.55508 -8.41463" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
<a-image link="href:cartes.html; on:click"
position="1.5 0 -4.3" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-B18" scale="0 0 0">
<a-image spot="linkto: #couloirB18B19; spotgroup: group-couloirB18B19"
position="5.87991 0.49525 4.74003" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
<a-image link="href:cartes.html; on:click"
position="2 0 6.5" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-B19" scale="0 0 0">
<a-image spot="linkto: #couloirB18B19; spotgroup: group-couloirB18B19"
position="6.02163 0.31623 -5.18968" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
<a-image link="href:cartes.html; on:click"
position="1.5 0 -6.5" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-couloirB20B21B22B23" scale="0 0 0">
<a-entity slice9="width: 5; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:B20-Salle de TP;wrap-count:15; width:5; align:center;zOffset:0.05" ; look-at="#cam"
position="-7.5 1.8 -6.3"></a-entity>
<a-image spot="linkto: #B20; spotgroup: group-B20"
position="-7.29631 -0.95567 -3.93664" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
<a-image spot="linkto: #B21; spotgroup: group-B21"
position="6.50126 0.53308 -0.61296" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
<a-image spot="linkto: #B22; spotgroup: group-B22"
position="-7.07326 -0.15 2.16576" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
<a-image spot="linkto: #B23; spotgroup: group-B23"
position="5.94954 -2.53945 5.15856" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
<a-image spot="linkto: #couloirB18B19; spotgroup: group-couloirB18B19"
position="-1.69818 -0.69224 -8.02194" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
<a-image spot="linkto: #gaucheB; spotgroup: group-gaucheB"
position="1.7196 -0.95799 8.0488" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
<a-image link="href:cartes.html; on:click"
position="-2.6 0 6.5" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-B20" scale="0 0 0">
<a-image spot="linkto: #couloirB20B21B22B23; spotgroup: group-couloirB20B21B22B23"
position="-7.75788 0.83569 -4.53381" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
<a-image link="href:cartes.html; on:click"
position="-7.2 0 0.35" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-B21" scale="0 0 0">
<a-image spot="linkto: #couloirB20B21B22B23; spotgroup: group-couloirB20B21B22B23"
position="6.73426 0.83569 6.77272" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
<a-image link="href:cartes.html; on:click"
position="9.3 0 2.4" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-B22" scale="0 0 0">
<a-image spot="linkto: #couloirB20B21B22B23; spotgroup: group-couloirB20B21B22B23"
position="6.21609 0.5484 6.40724" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
<a-image link="href:cartes.html; on:click"
position="6.4 0 2.15" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-B23" scale="0 0 0">
<a-image spot="linkto: #couloirB20B21B22B23; spotgroup: group-couloirB20B21B22B23"
position="6.23193 0.55887 -6.95401" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
<a-image spot="linkto: #gaucheB; spotgroup: group-gaucheB"
position="-7.20994 0.00435 -4.4561" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
<a-image link="href:cartes.html; on:click"
position="0.6 0 -9.7" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-gaucheB" scale="0 0 0">
<a-entity slice9="width: 6; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Escalier vers rez de chaussee;wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="-0.9 1.2 -10">
</a-entity>
<a-image spot="linkto: #B23; spotgroup: group-B23"
position="2.93583 -2.13579 6.11566" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
<a-image spot="linkto: #couloirB20B21B22B23; spotgroup: group-couloirB20B21B22B23"
position="7.62704 -1.45215 1.46904" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
<a-image spot="linkto: #escalierGaucheB; spotgroup: group-escalierGaucheB"
position="-0.05834 -2.67086 -5" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
<a-image link="href:cartes.html; on:click"
position="4.3 0 -3.3" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-escalierGaucheB" scale="0 0 0">
<a-image spot="linkto: #gaucheB; spotgroup: group-gaucheB"
position="1.06712 -2.93894 7.02546" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
<a-image spot="linkto: #escalierGaucheA; spotgroup: group-escalierGaucheA"
position="3.94315 -2.42705 -2.50985" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
<a-image link="href:cartes.html; on:click"
position="4.3 0 0.8" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-escalierGaucheA" scale="0 0 0">
<a-entity slice9="width: 4; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Escaliers vers etage 1 et 2;wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="-14 0 -5.000"></a-entity>
<a-entity slice9="width: 4; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Toilettes;wrap-count:15; width:5; align:center;zOffset:0.05" ; look-at="#cam"
position="-0.438 3 6.642"></a-entity>
<a-image link="href:batInfoRDCR.html; on:click"
position="1 -1.5 -5" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
<a-image spot="linkto:#escalierGaucheB;spotgroup:group-escalierGaucheB"
position="-5 0 -2.8" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
></a-image>
<a-image link="href:cartes.html; on:click"
position="-4.5 0 2" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
</a-entity>
</a-scene>
</body>
</html>

@ -0,0 +1,584 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Panorama</title>
<script src="https://aframe.io/releases/1.0.4/aframe.min.js"></script>
<script src="https://unpkg.com/aframe-slice9-component/dist/aframe-slice9-component.min.js"></script>
<script src="https://unpkg.com/aframe-look-at-component@0.5.1/dist/aframe-look-at-component.min.js"></script>
<!--animation component script-->
<script src="https://unpkg.com/aframe-animation-component@^4.1.2/dist/aframe-animation-component.min.js"></script>
<script src="scriptJS/spots.js"></script>
</head>
<body>
<a-scene id="notreScene" loading-screen="dotsColor:#FED700; backgroundColor: #303030">
<a-assets timeout="30000">
<img id="fleche" src="icones/fleche.png" height="357" width="367" alt=""/>
<img id="map" src="icones/map.png" height="256" width="256" alt=""/>
<a-sound id="boup" src="son/BOUP.mp3"></a-sound>
<!-- Bat Info RDC
<img id="milieuA" src="image/milieuA.JPG" height="2688" width="5376" alt=""/>
<img id="escalierMilieuA" src="image/escalierMilieuA.JPG" height="2688" width="5376" alt=""/>
<img id="couloirA12" src="image/couloirA12.JPG" height="2688" width="5376" alt=""/>
<img id="A12" src="image/A12.JPG" height="2688" width="5376" alt=""/>
<img id="couloirA18A19" src="image/couloirA18A19.JPG" height="2688" width="5376" alt=""/>
<img id="A18" src="image/A18.JPG" height="2688" width="5376" alt=""/>
<img id="A19" src="image/A19.JPG" height="2688" width="5376" alt="">
<img id="couloirA21A22" src="image/couloirA21A22.JPG" height="2688" width="5376" alt=""/>
<img id="A21" src="image/A21.JPG" height="2688" width="5376" alt=""/>
<img id="A22" src="image/A22.JPG" height="2688" width="5376" alt=""/>
<img id="couloirA23" src="image/couloirA23.JPG" height="2688" width="5376" alt=""/>
<img id="A23" src="image/A23.JPG" height="2688" width="5376" alt=""/>
<img id="gaucheA" src="image/gaucheA.JPG" height="2688" width="5376" alt=""/>
-->
<!--Bat Info 1er étage-->
<img id="escalierGaucheA" src="image/escalierGaucheA.JPG" height="2688" width="5376" alt=""/>
<img id="escalierGaucheB" src="image/escalierGaucheB.JPG" height="2688" width="5376" alt=""/>
<img id="gaucheB" src="image/gaucheB.JPG" height="2688" width="5376" alt=""/>
<img id="B23" src="image/B23.JPG" height="2688" width="5376" alt=""/>
<img id="B22" src="image/B22.JPG" height="2688" width="5376" alt=""/>
<img id="B21" src="image/B21.JPG" height="2688" width="5376" alt=""/>
<img id="B20" src="image/B20.JPG" height="2688" width="5376" alt=""/>
<img id="couloirB20B21B22B23" src="image/couloirB20B21B22B23.JPG" height="2688" width="5376" alt=""/>
<img id="B19" src="image/B19.JPG" height="2688" width="5376" alt=""/>
<img id="B18" src="image/B18.JPG" height="2688" width="5376" alt=""/>
<img id="couloirB18B19" src="image/couloirB18B19.JPG" height="2688" width="5376" alt=""/>
<img id="B17" src="image/B17.JPG" height="2688" width="5376" alt=""/>
<img id="B14" src="image/B14.JPG" height="2688" width="5376" alt=""/>
<img id="couloirB14B17" src="image/couloirB14B17.JPG" height="2688" width="5376" alt=""/>
<img id="B12" src="image/B12.JPG" height="2688" width="5376" alt=""/>
<img id="secretariat" src="image/secretariat.JPG" height="2688" width="5376" alt=""/>
<img id="couloirB12" src="image/couloirB12.JPG" height="2688" width="5376" alt=""/>
<img id="B10" src="image/B10.JPG" height="2688" width="5376" alt=""/>
<img id="milieuB" src="image/milieuB.JPG" height="2688" width="5376" alt=""/>
<img id="escalierMilieuB" src="image/escalierMilieuB.JPG" height="2688" width="5376" alt=""/>
<img id="escalierMilieuA" src="image/escalierMilieuA.JPG" height="2688" width="5376" alt=""/>
<!-- Cartes
<img id="fondBlanc" src="image/fondBlanc.jpg" alt=""/>
<img id="batInfo" src="image/batInfo.jpg" alt=""/>
<img id="cartePrincipale" src="image/planPrincipal.jpg" alt=""/>
<img id="logoBleu" src="image/logoBleu.png" alt=""/>
<img id="logoVert" src="image/logoVert.png" alt=""/>
<img id="logoJaune" src="image/logoJaune.png" alt=""/>
<img id="logoRouge" src="image/logoRouge.png" alt=""/>
-->
</a-assets>
<a-sky id="skybox" src="#escalierGaucheA"></a-sky>
<a-entity id="cam" camera position="0 1.6 0" look-controls wasd-controls="enabled:false">
<a-entity cursor="fuse:true;fuseTimeout:2000"
geometry="primitive:ring;radiusInner:0.01;radiusOuter:0.02"
position="0 0 -1.8"
material="shader:flat;color:blue">
</a-entity>
</a-entity>
<a-entity id="spots" hotspots>
<!-- GROUPE B -->
<a-entity id="group-escalierMilieuA" scale="0 0 0">
<a-entity slice9="width: 6; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:1er etage : couloir B;wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="-8.563 1.454 -1.324"></a-entity>
<a-image link="href:batInfoRDC.html; on:click"
position="0 -1.2 -5.4" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto: #escalierMilieuB; spotgroup: group-escalierMilieuB"
position="-6.2 -0.2 -1" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="4 0 -3.9" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-escalierMilieuB" scale="0 0 0">
<a-entity slice9="width: 6; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Rez de chaussee : couloir A et sortie;wrap-count:15; width:5; align:center;zOffset:0.05"
; look-at="#cam" position="5.406 -1.2 3.923"></a-entity>
<a-entity slice9="width: 6; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:1er etage : couloir B;wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="-7.234 0.048 3.094"></a-entity>
<a-entity slice9="width: 6; height: 3; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:2eme etage : bureaux des professeurs;wrap-count:15; width:5; align:center;zOffset:0.05"
; look-at="#cam" position="0.199 0.569 8.327"></a-entity>
<a-image spot="linkto: #escalierMilieuA; spotgroup: group-escalierMilieuA"
position="3.59377 -2.53044 3.51972" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto: #milieuB; spotgroup: group-milieuB"
position="-3.93702 -0.36345 1.78281" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="-2.5 0 -3.9" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-milieuB" scale="0 0 0">
<a-entity slice9="width: 6; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:B10-Salle de TP;wrap-count:15; width:5; align:center;zOffset:0.05" ; look-at="#cam"
position="-15 0.2 -1.825"></a-entity>
<a-entity slice9="width: 6; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Rez de chaussee : couloir A;wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="10 0.4 -15"></a-entity>
<a-entity slice9="width: 6; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Departement RT;wrap-count:15; width:5; align:center;zOffset:0.05" ; look-at="#cam"
position="-8.8 0.1 -7.259"></a-entity>
<a-entity slice9="width: 6; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Couloir B;wrap-count:15; width:5; align:center;zOffset:0.05" ; look-at="#cam"
position="9 0 6"></a-entity>
<a-image spot="linkto: #B10; spotgroup: group-B10"
position="-7.5 -0.12484 -1.41482" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto: #couloirB12; spotgroup: group-couloirB12"
position="4.40506 -0.17172 3.28099" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto: #escalierMilieuB; spotgroup: group-escalierMilieuB"
position="4.42694 -0.71457 -6.80564" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="-2.5 0 4.7" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-B10" scale="0 0 0">
<a-image spot="linkto: #milieuB; spotgroup: group-milieuB"
position="5.64364 -0.45557 -7.09444" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="-1 0 -6.8" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-couloirB12" scale="0 0 0">
<a-entity slice9="width: 6; height: 3; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Panneaux informatifs avec les emplois du temps des eleves;wrap-count:15; width:5; align:center;zOffset:0.05"
; look-at="#cam" position="-9 4 11"></a-entity>
<a-entity slice9="width: 5; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Secreteriat departement Informatique;wrap-count:15; width:5; align:center;zOffset:0.05"
; look-at="#cam" position="-6 2 -7"></a-entity>
<a-entity slice9="width: 6; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:B12-Salle de TP et de tutorat;wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="-0.320 1.716 8.479"></a-entity>
<a-entity slice9="width: 5; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Escalier vers rez de chaussee;wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="-15.5 -0.082 7.727"></a-entity>
<a-image spot="linkto: #B12; spotgroup: group-B12"
position="1.967 0.1291 5.53" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto: #secretariat; spotgroup: group-secretariat"
position="-1.97284 -0.27046 -6.4716" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto: #couloirB14B17; spotgroup: group-couloirB14B17"
position="6.25782 0.55436 -1.93283" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto: #milieuB; spotgroup: group-milieuB" position="-7.5138 -0.45557 2.28995"
look-at="#cam" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="4.5 0 1.4" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-secretariat" scale="0 0 0">
<a-image spot="linkto: #couloirB12; spotgroup: group-couloirB12"
position="5.35987 0.61905 -4.96787" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="-2.7 0 -4.3" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-B12" scale="0 0 0">
<a-image spot="linkto: #couloirB12; spotgroup: group-couloirB12"
position="-7.03551 0.90978 -2.52496" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
-
<a-image link="href:cartes.html; on:click"
position="-7.5 0.5 2" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-couloirB14B17" scale="0 0 0">
<a-image spot="linkto: #B14; spotgroup: group-B14"
position="-0.90702 0.04163 -7.62626" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto: #B17; spotgroup: group-B17"
position="3.83091 0.24606 6.95009" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto: #couloirB12; spotgroup: group-couloirB12"
position="5.60677 -0.32639 -1.27354" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto: #couloirB18B19; spotgroup: group-couloirB18B19"
position="-7.02752 -0.0323 1.52582" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="-4.5 0 -2" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-B14" scale="0 0 0">
<a-image spot="linkto: #couloirB14B17; spotgroup: group-couloirB14B17"
position="4.3 1.2 4.5" look-at="#cam" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="6.5 0 1.5" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-B17" scale="0 0 0">
<a-image spot="linkto: #couloirB14B17; spotgroup: group-couloirB14B17"
position="5.04639 0.08424 3.34307" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="1 0 5" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-couloirB18B19" scale="0 0 0">
<a-entity slice9="width: 5; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:B18-Salle de TP;wrap-count:15; width:5; align:center;zOffset:0.05" ; look-at="#cam"
position="3.636 1.697 -0.932"></a-entity>
<a-entity slice9="width: 5; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:B19-Salle de TP;wrap-count:15; width:5; align:center;zOffset:0.05" ; look-at="#cam"
position="-7.5 1.8 -0.35"></a-entity>
<a-image spot="linkto: #B18; spotgroup: group-B18"
position="5.4 0.36694 -2.2" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto: #B19; spotgroup: group-B19"
position="-7.5 -0.78827 2.4102" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto: #couloirB14B17; spotgroup: group-couloirB14B17"
position="0.86101 -0.6179 8.32408" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto: #couloirB20B21B22B23; spotgroup: group-couloirB20B21B22B23"
position="-1.12476 -0.55508 -8.41463" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="1.5 0 -4.3" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-B18" scale="0 0 0">
<a-image spot="linkto: #couloirB18B19; spotgroup: group-couloirB18B19"
position="5.87991 0.49525 4.74003" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="2 0 6.5" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-B19" scale="0 0 0">
<a-image spot="linkto: #couloirB18B19; spotgroup: group-couloirB18B19"
position="6.02163 0.31623 -5.18968" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="1.5 0 -6.5" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-couloirB20B21B22B23" scale="0 0 0">
<a-entity slice9="width: 5; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:B20-Salle de TP;wrap-count:15; width:5; align:center;zOffset:0.05" ; look-at="#cam"
position="-7.5 1.8 -6.3"></a-entity>
<a-image spot="linkto: #B20; spotgroup: group-B20"
position="-7.29631 -0.95567 -3.93664" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto: #B21; spotgroup: group-B21"
position="6.50126 0.53308 -0.61296" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto: #B22; spotgroup: group-B22"
position="-7.07326 -0.15 2.16576" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto: #B23; spotgroup: group-B23"
position="5.94954 -2.53945 5.15856" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto: #couloirB18B19; spotgroup: group-couloirB18B19"
position="-1.69818 -0.69224 -8.02194" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto: #gaucheB; spotgroup: group-gaucheB"
position="1.7196 -0.95799 8.0488" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="-2.6 0 6.5" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-B20" scale="0 0 0">
<a-image spot="linkto: #couloirB20B21B22B23; spotgroup: group-couloirB20B21B22B23"
position="-7.75788 0.83569 -4.53381" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="-7.2 0 0.35" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-B21" scale="0 0 0">
<a-image spot="linkto: #couloirB20B21B22B23; spotgroup: group-couloirB20B21B22B23"
position="6.73426 0.83569 6.77272" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="9.3 0 2.4" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-B22" scale="0 0 0">
<a-image spot="linkto: #couloirB20B21B22B23; spotgroup: group-couloirB20B21B22B23"
position="6.21609 0.5484 6.40724" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="6.4 0 2.15" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-B23" scale="0 0 0">
<a-image spot="linkto: #couloirB20B21B22B23; spotgroup: group-couloirB20B21B22B23"
position="6.23193 0.55887 -6.95401" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto: #gaucheB; spotgroup: group-gaucheB"
position="-7.20994 0.00435 -4.4561" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="0.6 0 -9.7" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-gaucheB" scale="0 0 0">
<a-entity slice9="width: 6; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Escalier vers rez de chaussee;wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="-0.9 1.2 -10">
</a-entity>
<a-image spot="linkto: #B23; spotgroup: group-B23"
position="2.93583 -2.13579 6.11566" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto: #couloirB20B21B22B23; spotgroup: group-couloirB20B21B22B23"
position="7.62704 -1.45215 1.46904" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto: #escalierGaucheB; spotgroup: group-escalierGaucheB"
position="-0.05834 -2.67086 -5" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="4.3 0 -3.3" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-escalierGaucheB" scale="0 0 0">
<a-image spot="linkto: #gaucheB; spotgroup: group-gaucheB"
position="1.06712 -2.93894 7.02546" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto: #escalierGaucheA; spotgroup: group-escalierGaucheA"
position="3.94315 -2.42705 -2.50985" look-at="#cam" src="#fleche" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="4.3 0 0.8" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-escalierGaucheA">
<a-entity slice9="width: 4; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Escaliers vers etage 1 et 2;wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="-14 0 -5.000"></a-entity>
<a-entity slice9="width: 4; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Toilettes;wrap-count:15; width:5; align:center;zOffset:0.05" ; look-at="#cam"
position="-0.438 3 6.642"></a-entity>
<a-image link="href:batInfoRDCR.html; on:click"
position="1 -1.5 -5" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto:#escalierGaucheB;spotgroup:group-escalierGaucheB"
position="-5 0 -2.8" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="-4.5 0 2" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
</a-entity>
</a-scene>
</body>
</html>

@ -0,0 +1,333 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Panorama</title>
<script src="https://aframe.io/releases/1.0.4/aframe.min.js"></script>
<script src="https://unpkg.com/aframe-slice9-component/dist/aframe-slice9-component.min.js"></script>
<script src="https://unpkg.com/aframe-look-at-component@0.5.1/dist/aframe-look-at-component.min.js"></script>
<!--animation component script-->
<script src="https://unpkg.com/aframe-animation-component@^4.1.2/dist/aframe-animation-component.min.js"></script>
<script src="scriptJS/spots.js"></script>
</head>
<body>
<a-scene id="notreScene" loading-screen="dotsColor:#FED700; backgroundColor: #303030">
<a-assets timeout="30000">
<img id="fleche" src="icones/fleche.png" height="357" width="367" alt=""/>
<img id="map" src="icones/map.png" height="256" width="256" alt=""/>
<a-sound id="boup" src="son/BOUP.mp3"></a-sound>
<!-- Bat Info RDC-->
<img id="milieuA" src="image/milieuA.JPG" height="2688" width="5376" alt=""/>
<img id="couloirA12" src="image/couloirA12.JPG" height="2688" width="5376" alt=""/>
<img id="A12" src="image/A12.JPG" height="2688" width="5376" alt=""/>
<img id="couloirA18A19" src="image/couloirA18A19.JPG" height="2688" width="5376" alt=""/>
<img id="A18" src="image/A18.JPG" height="2688" width="5376" alt=""/>
<img id="A19" src="image/A19.JPG" height="2688" width="5376" alt="">
<img id="couloirA21A22" src="image/couloirA21A22.JPG" height="2688" width="5376" alt=""/>
<img id="A21" src="image/A21.JPG" height="2688" width="5376" alt=""/>
<img id="A22" src="image/A22.JPG" height="2688" width="5376" alt=""/>
<img id="couloirA23" src="image/couloirA23.JPG" height="2688" width="5376" alt=""/>
<img id="A23" src="image/A23.JPG" height="2688" width="5376" alt=""/>
<img id="gaucheA" src="image/gaucheA.JPG" height="2688" width="5376" alt=""/>
<!-- Bat Info 1er étage
<img id="escalierGaucheA" src="image/escalierGaucheA.JPG" height="2688" width="5376" alt=""/>
<img id="B10" src="image/B10.JPG" height="2688" width="5376" alt=""/>
<img id="B12" src="image/B12.JPG" height="2688" width="5376" alt=""/>
<img id="B14" src="image/B14.JPG" height="2688" width="5376" alt=""/>
<img id="B17" src="image/B17.JPG" height="2688" width="5376" alt=""/>
<img id="B18" src="image/B18.JPG" height="2688" width="5376" alt=""/>
<img id="B19" src="image/B19.JPG" height="2688" width="5376" alt=""/>
<img id="B20" src="image/B20.JPG" height="2688" width="5376" alt=""/>
<img id="B21" src="image/B21.JPG" height="2688" width="5376" alt=""/>
<img id="B22" src="image/B22.JPG" height="2688" width="5376" alt=""/>
<img id="B23" src="image/B23.JPG" height="2688" width="5376" alt=""/>
<img id="couloirB12" src="image/couloirB12.JPG" height="2688" width="5376" alt=""/>
<img id="couloirB14B17" src="image/couloirB14B17.JPG" height="2688" width="5376" alt=""/>
<img id="couloirB18B19" src="image/couloirB18B19.JPG" height="2688" width="5376" alt=""/>
<img id="couloirB20B21B22B23" src="image/couloirB20B21B22B23.JPG" height="2688" width="5376" alt=""/>
<img id="escalierGaucheB" src="image/escalierGaucheB.JPG" height="2688" width="5376" alt=""/>
<img id="escalierMilieuB" src="image/escalierMilieuB.JPG" height="2688" width="5376" alt=""/>
<img id="gaucheB" src="image/gaucheB.JPG" height="2688" width="5376" alt=""/>
<img id="milieuB" src="image/milieuB.JPG" height="2688" width="5376" alt=""/>
<img id="secretariat" src="image/secretariat.JPG" height="2688" width="5376" alt=""/>
-->
<!-- Cartes
<img id="fondBlanc" src="image/fondBlanc.jpg" alt=""/>
<img id="batInfo" src="image/batInfo.jpg" alt=""/>
<img id="cartePrincipale" src="image/planPrincipal.jpg" alt=""/>
<img id="logoBleu" src="image/logoBleu.png" alt=""/>
<img id="logoVert" src="image/logoVert.png" alt=""/>
<img id="logoJaune" src="image/logoJaune.png" alt=""/>
<img id="logoRouge" src="image/logoRouge.png" alt=""/>
-->
</a-assets>
<a-sky id="skybox" src="#milieuA"></a-sky>
<a-entity id="cam" camera position="0 1.6 0" look-controls wasd-controls="enabled:false">
<a-entity cursor="fuse:true;fuseTimeout:2000"
geometry="primitive:ring;radiusInner:0.01;radiusOuter:0.02"
position="0 0 -1.8"
material="shader:flat;color:blue">
</a-entity>
</a-entity>
<a-entity id="spots" hotspots>
<!-- GROUPE A -->
<a-entity id="group-milieuA">
<a-entity slice9="width: 5; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Escalier;wrap-count:15; width:5; align:center;zOffset:0.05" ; look-at="#cam"
position="12.334 0 5.999"></a-entity>
<a-entity slice9="width: 5; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Couloir informatique (A);wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="0.369 0.4 10.419"></a-entity>
<a-entity slice9="width: 5; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Couloir RT;wrap-count:15; width:5; align:center;zOffset:0.05" ; look-at="#cam"
position="-5.060 -0.784 -14.613"></a-entity>
<a-image link="href:exterieurInfoMilieu.html; on:click"
position="7.9 -0.5 -1.58" src="#fleche" look-at="#cam" sound="src:#boup; on: click"></a-image>
<a-image spot="linkto:#couloirA12;spotgroup:group-couloirA12"
position="0.6 -0.8 8.9" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:batInfo1st.html; on:click"
position="9.9 -0.5 4.3" src="#fleche" look-at="#cam" sound="src:#boup; on: click"></a-image>
<a-image link="href:cartes.html; on:click"
position="-5.2 0 2.4" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-couloirA12" scale="0 0 0">
<a-entity slice9="width: 5; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:A12-Salle de TP;wrap-count:15; width:5; align:center;zOffset:0.05" ; look-at="#cam"
position="-7.5 1.8 -0.35"></a-entity>
<a-image spot="linkto:#A12;spotgroup:group-A12"
position="-5 -0.8 1" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto:#couloirA18A19;spotgroup:group-couloirA18A19"
position="1.6 -0.6 8.9" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
color="#FFFFFF"
></a-image>
<a-image spot="linkto:#milieuA;spotgroup:group-milieuA"
position="-1.2 -1 -7.5" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="-3.2 0 7" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-A12" scale="0 0 0">
<a-image spot="linkto:#couloirA12;spotgroup:group-couloirA12"
position="-7.5 -0.18 -0.7" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="-7 0.5 2.9" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-couloirA18A19" scale="0 0 0">
<a-entity slice9="width: 5; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:A19-Salle de TP libre service;wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="10.750 -0.336 2.441"></a-entity>
<a-entity slice9="width: 5; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:A18-Salle de TP;wrap-count:15; width:5; align:center;zOffset:0.05" ; look-at="#cam"
position="-7.5 1.8 -0.35"></a-entity>
<a-image spot="linkto:#A18;spotgroup:group-A18"
position="-4.2 0 -1.6" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto:#A19;spotgroup:group-A19"
position="4.6 0 2.6" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto:#couloirA12;spotgroup:group-couloirA12"
position="-0.8 -1 -6.7" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto:#couloirA21A22;spotgroup:group-couloirA21A22"
position="0.4 -0.8 8.9" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="-3.6 0 5" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-A18" scale="0 0 0">
<a-image spot="linkto:#couloirA18A19;spotgroup:group-couloirA18A19"
position="8.6 0 -1.2" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="5.8 0 -5.3" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-A19" scale="0 0 0">
<a-image spot="linkto:#couloirA18A19;spotgroup:group-couloirA18A19"
position="6.9 0 4.5" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="5.2 0 -0.5" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-couloirA21A22" scale="0 0 0">
<a-image spot="linkto:#A21;spotgroup:group-A21"
position="4.2 0.2 2.8" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto:#A22;spotgroup:group-A22"
position="-4.2 0.5 -2.6" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto:#couloirA18A19;spotgroup:group-couloirA18A19"
position="-0.4 -0.5 -7" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto:#couloirA23;spotgroup:group-couloirA23"
position="0 -1.2 6.6" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="-3.6 0 3.4" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-A21" scale="0 0 0">
<a-image spot="linkto:#couloirA21A22;spotgroup:group-couloirA21A22"
position="9 0.5 -4.3" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="4.3 0 -6.2" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-A22" scale="0 0 0">
<a-image spot="linkto:#couloirA21A22;spotgroup:group-couloirA21A22"
position="-8.6 0.5 0" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="-7 0 -2.2" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-couloirA23" scale="0 0 0">
<a-entity slice9="width: 5; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:A23-Salle de TP;wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="6.312 1.052 -0.047"></a-entity>
<a-image spot="linkto:#A23;spotgroup:group-A23"
position="5.4 0 0" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto:#couloirA21A22;spotgroup:group-couloirA21A22"
position="0.5 -0.6 -7.9" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto:#gaucheA;spotgroup:group-gaucheA"
position="-0.3 -0.5 7.8" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="-4.2 0 4.6" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-A23" scale="0 0 0">
<a-image spot="linkto:#couloirA23;spotgroup:group-couloirA23"
position="-6.2 0 9" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="-6.2 0 2.8" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
<a-entity id="group-gaucheA" scale="0 0 0">
<a-entity slice9="width: 5; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Sortie arriere du batiment;wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="-7.5 1.8 -5"></a-entity>
<a-entity slice9="width: 5; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Escaliers vers etages superieurs;wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="8.514 -0.832 -1.886"></a-entity>
<a-image spot="linkto:#couloirA23;spotgroup:group-couloirA23"
position="3.1 -1 6.6" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:batInfo1stR.html; on:click"
position="5.1 -1.2 -1.6" src="#fleche" look-at="#cam" sound="src:#boup; on: click"></a-image>
<a-image link="href:exterieurInfoGauche.html; on:click"
position="-2 -0.5 -3.8" src="#fleche" look-at="#cam" sound="src:#boup; on: click"></a-image>
<a-image link="href:cartes.html; on:click"
position="4.5 0 1.6" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
</a-entity>
</a-scene>
</body>
</html>

@ -0,0 +1,371 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Panorama</title>
<script src="https://aframe.io/releases/1.0.4/aframe.min.js"></script>
<script src="https://unpkg.com/aframe-slice9-component/dist/aframe-slice9-component.min.js"></script>
<script src="https://unpkg.com/aframe-look-at-component@0.5.1/dist/aframe-look-at-component.min.js"></script>
<!--animation component script-->
<script src="https://unpkg.com/aframe-animation-component@^4.1.2/dist/aframe-animation-component.min.js"></script>
<script src="scriptJS/spots.js"></script>
</head>
<body>
<a-scene id="notreScene" loading-screen="dotsColor:#FED700; backgroundColor: #303030">
<a-assets timeout="30000">
<img id="fleche" src="icones/fleche.png" height="357" width="367" alt=""/>
<img id="map" src="icones/map.png" height="256" width="256" alt=""/>
<a-sound id="boup" src="son/BOUP.mp3"></a-sound>
<!-- Bat Info RDC-->
<img id="gaucheA" src="image/gaucheA.JPG" height="2688" width="5376" alt=""/>
<img id="A23" src="image/A23.JPG" height="2688" width="5376" alt=""/>
<img id="couloirA23" src="image/couloirA23.JPG" height="2688" width="5376" alt=""/>
<img id="A22" src="image/A22.JPG" height="2688" width="5376" alt=""/>
<img id="A21" src="image/A21.JPG" height="2688" width="5376" alt=""/>
<img id="couloirA21A22" src="image/couloirA21A22.JPG" height="2688" width="5376" alt=""/>
<img id="A19" src="image/A19.JPG" height="2688" width="5376" alt="">
<img id="A18" src="image/A18.JPG" height="2688" width="5376" alt=""/>
<img id="couloirA18A19" src="image/couloirA18A19.JPG" height="2688" width="5376" alt=""/>
<img id="A12" src="image/A12.JPG" height="2688" width="5376" alt=""/>
<img id="couloirA12" src="image/couloirA12.JPG" height="2688" width="5376" alt=""/>
<img id="milieuA" src="image/milieuA.JPG" height="2688" width="5376" alt=""/>
<!-- Bat Info 1er étage
<img id="escalierGaucheA" src="image/escalierGaucheA.JPG" height="2688" width="5376" alt=""/>
<img id="B10" src="image/B10.JPG" height="2688" width="5376" alt=""/>
<img id="B12" src="image/B12.JPG" height="2688" width="5376" alt=""/>
<img id="B14" src="image/B14.JPG" height="2688" width="5376" alt=""/>
<img id="B17" src="image/B17.JPG" height="2688" width="5376" alt=""/>
<img id="B18" src="image/B18.JPG" height="2688" width="5376" alt=""/>
<img id="B19" src="image/B19.JPG" height="2688" width="5376" alt=""/>
<img id="B20" src="image/B20.JPG" height="2688" width="5376" alt=""/>
<img id="B21" src="image/B21.JPG" height="2688" width="5376" alt=""/>
<img id="B22" src="image/B22.JPG" height="2688" width="5376" alt=""/>
<img id="B23" src="image/B23.JPG" height="2688" width="5376" alt=""/>
<img id="couloirB12" src="image/couloirB12.JPG" height="2688" width="5376" alt=""/>
<img id="couloirB14B17" src="image/couloirB14B17.JPG" height="2688" width="5376" alt=""/>
<img id="couloirB18B19" src="image/couloirB18B19.JPG" height="2688" width="5376" alt=""/>
<img id="couloirB20B21B22B23" src="image/couloirB20B21B22B23.JPG" height="2688" width="5376" alt=""/>
<img id="escalierGaucheB" src="image/escalierGaucheB.JPG" height="2688" width="5376" alt=""/>
<img id="escalierMilieuB" src="image/escalierMilieuB.JPG" height="2688" width="5376" alt=""/>
<img id="gaucheB" src="image/gaucheB.JPG" height="2688" width="5376" alt=""/>
<img id="milieuB" src="image/milieuB.JPG" height="2688" width="5376" alt=""/>
<img id="secretariat" src="image/secretariat.JPG" height="2688" width="5376" alt=""/>
-->
<!-- Cartes
<img id="fondBlanc" src="image/fondBlanc.jpg" alt=""/>
<img id="batInfo" src="image/batInfo.jpg" alt=""/>
<img id="cartePrincipale" src="image/planPrincipal.jpg" alt=""/>
<img id="logoBleu" src="image/logoBleu.png" alt=""/>
<img id="logoVert" src="image/logoVert.png" alt=""/>
<img id="logoJaune" src="image/logoJaune.png" alt=""/>
<img id="logoRouge" src="image/logoRouge.png" alt=""/>
-->
</a-assets>
<a-sky id="skybox" src="#gaucheA"></a-sky>
<a-entity id="cam" camera position="0 1.6 0" look-controls wasd-controls="enabled:false">
<a-entity cursor="fuse:true;fuseTimeout:2000"
geometry="primitive:ring;radiusInner:0.01;radiusOuter:0.02"
position="0 0 -1.8"
material="shader:flat;color:blue">
</a-entity>
</a-entity>
<a-entity id="spots" hotspots>
<!-- GROUPE A -->
<a-entity id="group-milieuA" scale="0 0 0">
<a-entity slice9="width: 5; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Escalier;wrap-count:15; width:5; align:center;zOffset:0.05" ; look-at="#cam"
position="12.334 0 5.999"></a-entity>
<a-entity slice9="width: 5; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Couloir informatique (A);wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="0.369 0.4 10.419"></a-entity>
<a-entity slice9="width: 5; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Couloir RT;wrap-count:15; width:5; align:center;zOffset:0.05" ; look-at="#cam"
position="-5.060 -0.784 -14.613"></a-entity>
<a-image link="href:exterieurInfoMilieu.html; on:click"
position="7.9 -0.5 -1.58" src="#fleche" look-at="#cam" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto:#couloirA12;spotgroup:group-couloirA12"
position="0.6 -0.8 8.9" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:batInfo1st.html; on:click"
position="9.9 -0.5 4.3" src="#fleche" look-at="#cam" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="-5.2 0 2.4" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
color="#FFFFFF"
></a-image>
</a-entity>
<a-entity id="group-couloirA12" scale="0 0 0">
<a-entity slice9="width: 5; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:A12-Salle de TP;wrap-count:15; width:5; align:center;zOffset:0.05" ; look-at="#cam"
position="-7.5 1.8 -0.35"></a-entity>
<a-image spot="linkto:#A12;spotgroup:group-A12"
position="-5 -0.8 1" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto:#couloirA18A19;spotgroup:group-couloirA18A19"
position="1.6 -0.6 8.9" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto:#milieuA;spotgroup:group-milieuA"
position="-1.2 -1 -7.5" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="-3.2 0 7" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
color="#FFFFFF"
></a-image>
</a-entity>
<a-entity id="group-A12" scale="0 0 0">
<a-image spot="linkto:#couloirA12;spotgroup:group-couloirA12"
position="-7.5 -0.18 -0.7" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="-7 0.5 2.9" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
color="#FFFFFF"
></a-image>
</a-entity>
<a-entity id="group-couloirA18A19" scale="0 0 0">
<a-entity slice9="width: 5; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:A19-Salle de TP libre service;wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="10.750 -0.336 2.441"></a-entity>
<a-entity slice9="width: 5; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:A18-Salle de TP;wrap-count:15; width:5; align:center;zOffset:0.05" ; look-at="#cam"
position="-7.5 1.8 -0.35"></a-entity>
<a-image spot="linkto:#A18;spotgroup:group-A18"
position="-4.2 0 -1.6" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto:#A19;spotgroup:group-A19"
position="4.6 0 2.6" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto:#couloirA12;spotgroup:group-couloirA12"
position="-0.8 -1 -6.7" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto:#couloirA21A22;spotgroup:group-couloirA21A22"
position="0.4 -0.8 8.9" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="-3.6 0 5" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
color="#FFFFFF"
></a-image>
</a-entity>
<a-entity id="group-A18" scale="0 0 0">
<a-image spot="linkto:#couloirA18A19;spotgroup:group-couloirA18A19"
position="8.6 0 -1.2" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="5.8 0 -5.3" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
color="#FFFFFF"
></a-image>
</a-entity>
<a-entity id="group-A19" scale="0 0 0">
<a-image spot="linkto:#couloirA18A19;spotgroup:group-couloirA18A19"
position="6.9 0 4.5" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="5.2 0 -0.5" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
color="#FFFFFF"
></a-image>
</a-entity>
<a-entity id="group-couloirA21A22" scale="0 0 0">
<a-image spot="linkto:#A21;spotgroup:group-A21"
position="4.2 0.2 2.8" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto:#A22;spotgroup:group-A22"
position="-4.2 0.5 -2.6" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto:#couloirA18A19;spotgroup:group-couloirA18A19"
position="-0.4 -0.5 -7" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto:#couloirA23;spotgroup:group-couloirA23"
position="0 -1.2 6.6" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="-3.6 0 3.4" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
color="#FFFFFF"
></a-image>
</a-entity>
<a-entity id="group-A21" scale="0 0 0">
<a-image spot="linkto:#couloirA21A22;spotgroup:group-couloirA21A22"
position="9 0.5 -4.3" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="4.3 0 -6.2" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
color="#FFFFFF"
></a-image>
</a-entity>
<a-entity id="group-A22" scale="0 0 0">
<a-image spot="linkto:#couloirA21A22;spotgroup:group-couloirA21A22"
position="-8.6 0.5 0" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="-7 0 -2.2" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
color="#FFFFFF"
></a-image>
</a-entity>
<a-entity id="group-couloirA23" scale="0 0 0">
<a-entity slice9="width: 5; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:A23-Salle de TP;wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="6.312 1.052 -0.047"></a-entity>
<a-image spot="linkto:#A23;spotgroup:group-A23"
position="5.4 0 0" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto:#couloirA21A22;spotgroup:group-couloirA21A22"
position="0.5 -0.6 -7.9" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto:#gaucheA;spotgroup:group-gaucheA"
position="-0.3 -0.5 7.8" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="-4.2 0 4.6" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
color="#FFFFFF"
></a-image>
</a-entity>
<a-entity id="group-A23" scale="0 0 0">
<a-image spot="linkto:#couloirA23;spotgroup:group-couloirA23"
position="-6.2 0 9" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="-6.2 0 2.8" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
color="#FFFFFF"
></a-image>
</a-entity>
<a-entity id="group-gaucheA">
<a-entity slice9="width: 5; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Sortie arriere du batiment;wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="-7.5 1.8 -5"></a-entity>
<a-entity slice9="width: 5; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Escaliers vers etages superieurs;wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="8.514 -0.832 -1.886"></a-entity>
<a-image spot="linkto:#couloirA23;spotgroup:group-couloirA23"
position="3.1 -1 6.6" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:batInfo1stR.html; on:click"
position="5.1 -1.2 -1.6" src="#fleche" look-at="#cam" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:exterieurInfoGauche.html; on:click"
position="-2 -0.5 -3.8" src="#fleche" look-at="#cam" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="4.5 0 1.6" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
color="#FFFFFF"
></a-image>
</a-entity>
</a-entity>
</a-scene>
</body>
</html>

@ -0,0 +1,89 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Panorama</title>
<script src="https://aframe.io/releases/1.0.4/aframe.min.js"></script>
<script src="https://unpkg.com/aframe-slice9-component/dist/aframe-slice9-component.min.js"></script>
<script src="https://unpkg.com/aframe-look-at-component@0.5.1/dist/aframe-look-at-component.min.js"></script>
<!--animation component script-->
<script src="https://unpkg.com/aframe-animation-component@^4.1.2/dist/aframe-animation-component.min.js"></script>
<script src="scriptJS/spots.js"></script>
</head>
<body>
<a-scene id="notreScene" loading-screen="dotsColor:#FED700; backgroundColor: #303030">
<a-assets timeout="30000">
<!-- Cartes -->
<img id="fondBlanc" src="image/fondBlanc.jpg" alt=""/>
<img id="batInfo" src="image/batInfo.jpg" alt=""/>
<img id="cartePrincipale" src="image/planPrincipal.jpg" alt=""/>
<img id="logoBleu" src="image/logoBleu.png" alt=""/>
<img id="logoVert" src="image/logoVert.png" alt=""/>
<img id="logoJaune" src="image/logoJaune.png" alt=""/>
<img id="logoRouge" src="image/logoRouge.png" alt=""/>
<a-sound id="boup" src="son/BOUP.mp3"></a-sound>
</a-assets>
<a-sky id="skybox" src="#fondBlanc"></a-sky>
<a-entity id="cam" camera position="0 1.6 0" look-controls wasd-controls="enabled:false">
<a-entity cursor="fuse:true;fuseTimeout:2000"
geometry="primitive:ring;radiusInner:0.01;radiusOuter:0.02"
position="0 0 -1.8"
material="shader:flat;color:blue">
</a-entity>
</a-entity>
<a-entity id="spots" hotspots>
<!--Groupes Cartes-->
<a-entity id="group-cartePrincipale">
<a-plane position="-1.89574 1.6 -1.96425" src="#cartePrincipale" look-at="#cam" height="4" width="6"
material="" geometry="" rotation="0 43.98317825991033 0"></a-plane>
<a-image height="0.480" width="0.300" link="href:batCentral.html; on:click" look-at="#cam"
position="-0.852 1.275 -2.810" src="#logoVert" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #0CE2B8; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image height="0.480" width="0.300" link="href:exterieurParking.html; on:click" look-at="#cam"
position="-0.058 1.125 -3.527" src="#logoJaune" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #F9D22D; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image height="0.480" width="0.300" link="href:batCentralR.html; on:click" look-at="#cam"
position="-1.102 2.144 -2.342" src="#logoVert" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #0CE2B8; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image height="0.480" width="0.300" link="href:exterieurInfoGauche.html; on:click" look-at="#cam"
position="-0.86567 2.98873 -2.84189" src="#logoJaune" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #F9D22D; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image height="0.480" width="0.300" link="href:exterieurInfoMilieu.html; on:click" look-at="#cam"
position="-0.63693 2.00661 -3.01714" src="#logoJaune" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #F9D22D; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
</a-entity>
</a-entity>
</a-scene>
</body>
</html>

@ -0,0 +1,280 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Panorama</title>
<script src="https://aframe.io/releases/1.0.4/aframe.min.js"></script>
<script src="https://unpkg.com/aframe-slice9-component/dist/aframe-slice9-component.min.js"></script>
<script src="https://unpkg.com/aframe-look-at-component@0.5.1/dist/aframe-look-at-component.min.js"></script>
<!--animation component script-->
<script src="https://unpkg.com/aframe-animation-component@^4.1.2/dist/aframe-animation-component.min.js"></script>
<script src="scriptJS/spots.js"></script>
</head>
<body>
<a-scene id="notreScene" loading-screen="dotsColor:#FED700; backgroundColor: #303030">
<a-assets timeout="30000">
<!-- Toutes les scènes les utilisent -->
<img id="fleche" src="icones/fleche.png" height="357" width="367" alt=""/>
<img id="map" src="icones/map.png" height="256" width="256" alt=""/>
<a-sound id="boup" src="son/BOUP.mp3"></a-sound>
<!-- Extérieur -->
<img id="exterieurCentral" src="image/exterieurCentral.jpg" height="2688" width="5376" alt=""/>
<img id="parking" src="image/parking.jpg" height="2688" width="5376" alt=""/>
<img id="exterieurMilieu" src="image/exterieurMilieu.JPG" height="2688" width="5376" alt=""/>
<img id="exterieurDroit" src="image/exterieurDroit.jpg" height="2688" width="5376" alt=""/>
<img id="croisementChemin" src="image/croisementChemin.JPG" height="2688" width="5376" alt=""/>
<img id="devantAmphi" src="image/devantAmphi.jpg" height="2688" width="5376" alt=""/>
<img id="coinGauche" src="image/coinGauche.JPG" height="2688" width="5376" alt=""/>
<img id="exterieurGauche" src="image/exterieurGauche.JPG" height="2688" width="5376" alt=""/>
</a-assets>
<a-sky id="skybox" src="#devantAmphi"></a-sky>
<a-entity id="cam" camera position="0 1.6 0" look-controls wasd-controls="enabled:false">
<a-entity cursor="fuse:true;fuseTimeout:2000"
geometry="primitive:ring;radiusInner:0.01;radiusOuter:0.02"
position="0 0 -1.8"
material="shader:flat;color:blue">
</a-entity>
</a-entity>
<a-entity id="spots" hotspots>
<!-- GROUPE EXTERIEUR -->
<a-entity id="group-devantAmphi">
<a-entity slice9="width: 5; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Departement Informatique ;wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="-7.560 -0.637 -11.469"></a-entity>
<a-entity slice9="width: 5; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Amphi A ;wrap-count:15; width:5; align:center;zOffset:0.05" ; look-at="#cam"
position="-5.271 -0.327 11.579"></a-entity>
<a-entity slice9="width: 5; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Amphi B;wrap-count:15; width:5; align:center;zOffset:0.05" ; look-at="#cam"
position="-11.571 -0.244 4.487"></a-entity>
<a-entity slice9="width: 5; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Entree arriere batiment central ;wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="9.304 0.992 -7.843"></a-entity>
<a-image spot="linkto:#croisementChemin;spotgroup:group-croisementChemin"
position="-6.239 -1.17 -7.336" src="#fleche" look-at="#cam" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:batCentralR.html; on:click"
position="8.139 -0.184 -6.7" src="#fleche" look-at="#cam" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="-7 0 -2.2" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
color="#FFFFFF"
></a-image>
</a-entity>
<a-entity id="group-croisementChemin" scale="0 0 0">
<a-entity slice9="width: 6.5; height: 3; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Amphi et entree arriere batiment central;wrap-count:15; width:5; align:center;zOffset:0.05"
; look-at="#cam" position="-16.350 1.5 1.414"></a-entity>
<a-entity slice9="width: 6.5; height: 3; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Departement biologie et entree arriere batiment informatique ;wrap-count:15; width:5; align:center;zOffset:0.05"
; look-at="#cam" position="-1.323 0.614 -19.618"></a-entity>
<a-image spot="linkto:#exterieurMilieu;spotgroup:group-exterieurMilieu"
position="0 -0.8 8" src="#fleche" look-at="#cam" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto:#devantAmphi;spotgroup:group-devantAmphi"
position="-8 0 0" src="#fleche" look-at="#cam" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto:#coinGauche;spotgroup:group-coinGauche"
position="0.167 -0.5 -10.8" src="#fleche" look-at="#cam" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="-6 0 -5.6" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
color="#FFFFFF"
></a-image>
</a-entity>
<a-entity id="group-exterieurMilieu" scale="0 0 0">
<a-entity slice9="width: 5; height: 3; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Entree principale batiment informatique et RT;wrap-count:15; width:5; align:center;zOffset:0.05"
; look-at="#cam" position="-8.346 1.154 7.389"></a-entity>
<a-entity slice9="width: 5; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Amphitheatres;wrap-count:15; width:5; align:center;zOffset:0.05" ; look-at="#cam"
position="6.213 1.120 10.868"></a-entity>
<a-image link="href:batInfoRDC.html; on:click"
position="-7 0 0.5" src="#fleche" look-at="#cam" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto:#croisementChemin;spotgroup:group-croisementChemin"
position="1.6 0 7.77" src="#fleche" look-at="#cam" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto:#parking;spotgroup:group-parking"
position="-1 0 -9" src="#fleche" look-at="#cam" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="-6 0 -5.6" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
color="#FFFFFF"
></a-image>
</a-entity>
<a-entity id="group-coinGauche" scale="0 0 0">
<a-entity slice9="width: 5; height: 3; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Entree arriere batiment informatique;wrap-count:15; width:5; align:center;zOffset:0.05"
; look-at="#cam" position="10.350 1.684 -3.803"></a-entity>
<a-entity slice9="width: 4; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Departement biologie ;wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="-10.8 0.163 -4.246"></a-entity>
<a-image spot="linkto:#croisementChemin;spotgroup:group-croisementChemin"
position="2.4 -0.17 15.36" src="#fleche" look-at="#cam" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto:#exterieurGauche;spotgroup:group-exterieurGauche"
position="13 -0.5 -1.6" src="#fleche" look-at="#cam" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="-6 0 -5.6" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
color="#FFFFFF"
></a-image>
</a-entity>
<a-entity id="group-exterieurGauche" scale="0 0 0">
<a-image spot="linkto:#coinGauche;spotgroup:group-coinGauche"
position="-3.128 -0.215 11.827" src="#fleche" look-at="#cam"
sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:batInfoRDCR.html; on:click"
position="9.5 0.272 2.8" src="#fleche" look-at="#cam" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="3.7 0 7.2" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
color="#FFFFFF"
></a-image>
</a-entity>
<a-entity id="group-parking" scale="0 0 0">
<a-entity slice9="width: 3; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Departement Informatique ; width:5; align:center;zOffset:0.05" ; look-at="#cam"
position="0.021 1.7 -5"></a-entity>
<a-entity slice9="width: 3; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Departement RT ; width:7; align:center;zOffset:0.05" ; look-at="#cam"
position="7 0.9 -7"></a-entity>
<a-entity slice9="width: 4; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Batiment central ; width:9; align:center;zOffset:0.05" ; look-at="#cam"
position="-11 0.636 -0.717"></a-entity>
<a-entity slice9="width: 6; height: 9; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png" text="value:Cette visite virtuelle a ete cree par Victor Mommalier, Clement Ferrere, Enzo Mazella,
Clara Poncet et Lucile Velut dans le cadre du projet tutore de deuxieme annee de DUT Informatique
;width:5;align:center;wrap-count:15;zOffset:0.05" ; look-at="#cam"
position="4.111 0.636 21.696"></a-entity>
<a-image spot="linkto: #exterieurMilieu; spotgroup: group-exterieurMilieu"
position="-1.78061 0 -9.74148" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto: #exterieurDroit; spotgroup: group-exterieurDroit"
position="4.1 0 -5.9" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto: #exterieurCentral; spotgroup: group-exterieurCentral"
position="-6.80577 0 1.25103" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="-6 0 -5.6" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
color="#FFFFFF"
></a-image>
</a-entity>
<a-entity id="group-exterieurCentral" scale="0 0 0">
<a-entity slice9="width: 6; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Entree du batiment central;wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="-10.571 3.779 5.809"></a-entity>
<a-image spot="linkto: #parking; spotgroup: group-parking"
position="-3.72751 0.89279 -6.31928" src="#fleche" look-at="#cam"
sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:batCentral.html; on:click"
position="-5.80567 0.71139 3.12434" src="#fleche" look-at="#cam"
sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="-7.3 0 -2.8" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
color="#FFFFFF"
></a-image>
</a-entity>
<a-entity id="group-exterieurDroit" scale="0 0 0">
<a-image spot="linkto: #parking; spotgroup: group-parking"
position="7.26916 1.13569 3.76474" src="#fleche" look-at="#cam"
sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="4.5 0 7.2" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
color="#FFFFFF"
></a-image>
</a-entity>
</a-entity>
</a-scene>
</body>
</html>

@ -0,0 +1,277 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Panorama</title>
<script src="https://aframe.io/releases/1.0.4/aframe.min.js"></script>
<script src="https://unpkg.com/aframe-slice9-component/dist/aframe-slice9-component.min.js"></script>
<script src="https://unpkg.com/aframe-look-at-component@0.5.1/dist/aframe-look-at-component.min.js"></script>
<!--animation component script-->
<script src="https://unpkg.com/aframe-animation-component@^4.1.2/dist/aframe-animation-component.min.js"></script>
<script src="scriptJS/spots.js"></script>
</head>
<body>
<a-scene id="notreScene" loading-screen="dotsColor:#FED700; backgroundColor: #303030">
<a-assets timeout="30000">
<!-- Toutes les scènes les utilisent -->
<img id="fleche" src="icones/fleche.png" height="357" width="367" alt=""/>
<img id="map" src="icones/map.png" height="256" width="256" alt=""/>
<a-sound id="boup" src="son/BOUP.mp3"></a-sound>
<!-- Extérieur -->
<img id="exterieurCentral" src="image/exterieurCentral.jpg" height="2688" width="5376" alt=""/>
<img id="parking" src="image/parking.jpg" height="2688" width="5376" alt=""/>
<img id="exterieurMilieu" src="image/exterieurMilieu.JPG" height="2688" width="5376" alt=""/>
<img id="exterieurDroit" src="image/exterieurDroit.jpg" height="2688" width="5376" alt=""/>
<img id="croisementChemin" src="image/croisementChemin.JPG" height="2688" width="5376" alt=""/>
<img id="devantAmphi" src="image/devantAmphi.jpg" height="2688" width="5376" alt=""/>
<img id="coinGauche" src="image/coinGauche.JPG" height="2688" width="5376" alt=""/>
<img id="exterieurGauche" src="image/exterieurGauche.JPG" height="2688" width="5376" alt=""/>
</a-assets>
<a-sky id="skybox" src="#exterieurCentral"></a-sky>
<a-entity id="cam" camera position="0 1.6 0" look-controls wasd-controls="enabled:false">
<a-entity cursor="fuse:true;fuseTimeout:2000"
geometry="primitive:ring;radiusInner:0.01;radiusOuter:0.02"
position="0 0 -1.8"
material="shader:flat;color:blue">
</a-entity>
</a-entity>
<a-entity id="spots" hotspots>
<!-- GROUPE EXTERIEUR -->
<a-entity id="group-exterieurCentral">
<a-entity slice9="width: 6; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Entree du batiment central;wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="-10.571 3.779 5.809"></a-entity>
<a-image spot="linkto: #parking; spotgroup: group-parking"
position="-3.72751 0.89279 -6.31928" src="#fleche" look-at="#cam"
sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:batCentral.html; on:click"
position="-5.80567 0.71139 3.12434" src="#fleche" look-at="#cam"
sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="-7.3 0 -2.8" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
color="#FFFFFF"
></a-image>
</a-entity>
<a-entity id="group-parking" scale="0 0 0">
<a-entity slice9="width: 3; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Departement Informatique ; width:5; align:center;zOffset:0.05" ; look-at="#cam"
position="0.021 1.7 -5"></a-entity>
<a-entity slice9="width: 3; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Departement RT ; width:7; align:center;zOffset:0.05" ; look-at="#cam"
position="7 0.9 -7"></a-entity>
<a-entity slice9="width: 4; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Batiment central ; width:9; align:center;zOffset:0.05" ; look-at="#cam"
position="-11 0.636 -0.717"></a-entity>
<a-entity slice9="width: 6; height: 9; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png" text="value:Cette visite virtuelle a ete cree par Victor Mommalier, Clement Ferrere, Enzo Mazella,
Clara Poncet et Lucile Velut dans le cadre du projet tutore de deuxieme annee de DUT Informatique
;width:5;align:center;wrap-count:15;zOffset:0.05" ; look-at="#cam"
position="4.111 0.636 21.696"></a-entity>
<a-image spot="linkto: #exterieurMilieu; spotgroup: group-exterieurMilieu"
position="-1.78061 0 -9.74148" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto: #exterieurDroit; spotgroup: group-exterieurDroit"
position="4.1 0 -5.9" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto: #exterieurCentral; spotgroup: group-exterieurCentral"
position="-6.80577 0 1.25103" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="-6 0 -5.6" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
color="#FFFFFF"
></a-image>
</a-entity>
<a-entity id="group-exterieurMilieu" scale="0 0 0">
<a-entity slice9="width: 5; height: 3; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Entree principale batiment informatique et RT;wrap-count:15; width:5; align:center;zOffset:0.05"
; look-at="#cam" position="-8.346 1.154 7.389"></a-entity>
<a-entity slice9="width: 5; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Amphitheatres;wrap-count:15; width:5; align:center;zOffset:0.05" ; look-at="#cam"
position="6.213 1.120 10.868"></a-entity>
<a-image link="href:batInfoRDC.html; on:click"
position="-7 0 0.5" src="#fleche" look-at="#cam" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto:#croisementChemin;spotgroup:group-croisementChemin"
position="1.6 0 7.77" src="#fleche" look-at="#cam" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto:#parking;spotgroup:group-parking"
position="-1 0 -9" src="#fleche" look-at="#cam" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="-6 0 -5.6" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
color="#FFFFFF"
></a-image>
</a-entity>
<a-entity id="group-exterieurDroit" scale="0 0 0">
<a-image spot="linkto: #parking; spotgroup: group-parking"
position="7.26916 1.13569 3.76474" src="#fleche" look-at="#cam"
sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="4.5 0 7.2" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
color="#FFFFFF"
></a-image>
</a-entity>
<a-entity id="group-croisementChemin" scale="0 0 0">
<a-entity slice9="width: 6.5; height: 3; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Amphi et entree arriere batiment central;wrap-count:15; width:5; align:center;zOffset:0.05"
; look-at="#cam" position="-16.350 1.5 1.414"></a-entity>
<a-entity slice9="width: 6.5; height: 3; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Departement biologie et entree arriere batiment informatique ;wrap-count:15; width:5; align:center;zOffset:0.05"
; look-at="#cam" position="-1.323 0.614 -19.618"></a-entity>
<a-image spot="linkto:#exterieurMilieu;spotgroup:group-exterieurMilieu"
position="0 -0.8 8" src="#fleche" look-at="#cam" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto:#devantAmphi;spotgroup:group-devantAmphi"
position="-8 0 0" src="#fleche" look-at="#cam" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto:#coinGauche;spotgroup:group-coinGauche"
position="0.167 -0.5 -10.8" src="#fleche" look-at="#cam" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="-6 0 -5.6" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
color="#FFFFFF"
></a-image>
</a-entity>
<a-entity id="group-devantAmphi" scale="0 0 0">
<a-entity slice9="width: 5; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Departement Informatique ;wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="-7.560 -0.637 -11.469"></a-entity>
<a-entity slice9="width: 5; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Amphi A ;wrap-count:15; width:5; align:center;zOffset:0.05" ; look-at="#cam"
position="-5.271 -0.327 11.579"></a-entity>
<a-entity slice9="width: 5; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Amphi B;wrap-count:15; width:5; align:center;zOffset:0.05" ; look-at="#cam"
position="-11.571 -0.244 4.487"></a-entity>
<a-entity slice9="width: 5; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Entree arriere batiment central ;wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="9.304 0.992 -7.843"></a-entity>
<a-image spot="linkto:#croisementChemin;spotgroup:group-croisementChemin"
position="-6.239 -1.17 -7.336" src="#fleche" look-at="#cam" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:batCentralR.html; on:click"
position="8.139 -0.184 -6.7" src="#fleche" look-at="#cam" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="-7 0 -2.2" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
color="#FFFFFF"
></a-image>
</a-entity>
<a-entity id="group-coinGauche" scale="0 0 0">
<a-entity slice9="width: 5; height: 3; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Entree arriere batiment informatique;wrap-count:15; width:5; align:center;zOffset:0.05"
; look-at="#cam" position="10.350 1.684 -3.803"></a-entity>
<a-entity slice9="width: 4; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Departement biologie ;wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="-10.8 0.163 -4.246"></a-entity>
<a-image spot="linkto:#croisementChemin;spotgroup:group-croisementChemin"
position="2.4 -0.17 15.36" src="#fleche" look-at="#cam" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto:#exterieurGauche;spotgroup:group-exterieurGauche"
position="13 -0.5 -1.6" src="#fleche" look-at="#cam" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="-6 0 -5.6" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
color="#FFFFFF"
></a-image>
</a-entity>
<a-entity id="group-exterieurGauche" scale="0 0 0">
<a-image spot="linkto:#coinGauche;spotgroup:group-coinGauche"
position="-3.128 -0.215 11.827" src="#fleche" look-at="#cam"
sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:batInfoRDCR.html; on:click"
position="9.5 0.272 2.8" src="#fleche" look-at="#cam" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="3.7 0 7.2" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
color="#FFFFFF"
></a-image>
</a-entity>
</a-entity>
</a-scene>
</body>
</html>

@ -0,0 +1,279 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Panorama</title>
<script src="https://aframe.io/releases/1.0.4/aframe.min.js"></script>
<script src="https://unpkg.com/aframe-slice9-component/dist/aframe-slice9-component.min.js"></script>
<script src="https://unpkg.com/aframe-look-at-component@0.5.1/dist/aframe-look-at-component.min.js"></script>
<!--animation component script-->
<script src="https://unpkg.com/aframe-animation-component@^4.1.2/dist/aframe-animation-component.min.js"></script>
<script src="scriptJS/spots.js"></script>
</head>
<body>
<a-scene id="notreScene" loading-screen="dotsColor:#FED700; backgroundColor: #303030">
<a-assets timeout="30000">
<!-- Toutes les scènes les utilisent -->
<img id="fleche" src="icones/fleche.png" height="357" width="367" alt=""/>
<img id="map" src="icones/map.png" height="256" width="256" alt=""/>
<a-sound id="boup" src="son/BOUP.mp3"></a-sound>
<!-- Extérieur -->
<img id="exterieurGauche" src="image/exterieurGauche.JPG" height="2688" width="5376" alt=""/>
<img id="coinGauche" src="image/coinGauche.JPG" height="2688" width="5376" alt=""/>
<img id="croisementChemin" src="image/croisementChemin.JPG" height="2688" width="5376" alt=""/>
<img id="exterieurMilieu" src="image/exterieurMilieu.JPG" height="2688" width="5376" alt=""/>
<img id="devantAmphi" src="image/devantAmphi.jpg" height="2688" width="5376" alt=""/>
<img id="parking" src="image/parking.jpg" height="2688" width="5376" alt=""/>
<img id="exterieurCentral" src="image/exterieurCentral.jpg" height="2688" width="5376" alt=""/>
<img id="exterieurDroit" src="image/exterieurDroit.jpg" height="2688" width="5376" alt=""/>
</a-assets>
<a-sky id="skybox" src="#exterieurGauche"></a-sky>
<a-entity id="cam" camera position="0 1.6 0" look-controls wasd-controls="enabled:false">
<a-entity cursor="fuse:true;fuseTimeout:2000"
geometry="primitive:ring;radiusInner:0.01;radiusOuter:0.02"
position="0 0 -1.8"
material="shader:flat;color:blue">
</a-entity>
</a-entity>
<a-entity id="spots" hotspots>
<!-- GROUPE EXTERIEUR -->
<a-entity id="group-devantAmphi" scale="0 0 0">
<a-entity slice9="width: 5; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Departement Informatique ;wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="-7.560 -0.637 -11.469"></a-entity>
<a-entity slice9="width: 5; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Amphi A ;wrap-count:15; width:5; align:center;zOffset:0.05" ; look-at="#cam"
position="-5.271 -0.327 11.579"></a-entity>
<a-entity slice9="width: 5; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Amphi B;wrap-count:15; width:5; align:center;zOffset:0.05" ; look-at="#cam"
position="-11.571 -0.244 4.487"></a-entity>
<a-entity slice9="width: 5; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Entree arriere batiment central ;wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="9.304 0.992 -7.843"></a-entity>
<a-image spot="linkto:#croisementChemin;spotgroup:group-croisementChemin"
position="-6.239 -1.17 -7.336" src="#fleche" look-at="#cam" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:batCentralR.html; on:click"
position="8.139 -0.184 -6.7" src="#fleche" look-at="#cam" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="-7 0 -2.2" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
color="#FFFFFF"
></a-image>
</a-entity>
<a-entity id="group-croisementChemin" scale="0 0 0">
<a-entity slice9="width: 6.5; height: 3; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Amphi et entree arriere batiment central;wrap-count:15; width:5; align:center;zOffset:0.05"
; look-at="#cam" position="-16.350 1.5 1.414"></a-entity>
<a-entity slice9="width: 6.5; height: 3; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Departement biologie et entree arriere batiment informatique ;wrap-count:15; width:5; align:center;zOffset:0.05"
; look-at="#cam" position="-1.323 0.614 -19.618"></a-entity>
<a-image spot="linkto:#exterieurMilieu;spotgroup:group-exterieurMilieu"
position="0 -0.8 8" src="#fleche" look-at="#cam" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto:#devantAmphi;spotgroup:group-devantAmphi"
position="-8 0 0" src="#fleche" look-at="#cam" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto:#coinGauche;spotgroup:group-coinGauche"
position="0.167 -0.5 -10.8" src="#fleche" look-at="#cam" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="-6 0 -5.6" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
color="#FFFFFF"
></a-image>
</a-entity>
<a-entity id="group-exterieurMilieu" scale="0 0 0">
<a-entity slice9="width: 5; height: 3; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Entree principale batiment informatique et RT;wrap-count:15; width:5; align:center;zOffset:0.05"
; look-at="#cam" position="-8.346 1.154 7.389"></a-entity>
<a-entity slice9="width: 5; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Amphitheatres;wrap-count:15; width:5; align:center;zOffset:0.05" ; look-at="#cam"
position="6.213 1.120 10.868"></a-entity>
<a-image link="href:batInfoRDC.html; on:click"
position="-7 0 0.5" src="#fleche" look-at="#cam" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto:#croisementChemin;spotgroup:group-croisementChemin"
position="1.6 0 7.77" src="#fleche" look-at="#cam" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto:#parking;spotgroup:group-parking"
position="-1 0 -9" src="#fleche" look-at="#cam" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="-6 0 -5.6" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
color="#FFFFFF"
></a-image>
</a-entity>
<a-entity id="group-coinGauche" scale="0 0 0">
<a-entity slice9="width: 5; height: 3; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Entree arriere batiment informatique;wrap-count:15; width:5; align:center;zOffset:0.05"
; look-at="#cam" position="10.350 1.684 -3.803"></a-entity>
<a-entity slice9="width: 4; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Departement biologie ;wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="-10.8 0.163 -4.246"></a-entity>
<a-image spot="linkto:#croisementChemin;spotgroup:group-croisementChemin"
position="2.4 -0.17 15.36" src="#fleche" look-at="#cam" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto:#exterieurGauche;spotgroup:group-exterieurGauche"
position="13 -0.5 -1.6" src="#fleche" look-at="#cam" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="-6 0 -5.6" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
color="#FFFFFF"
></a-image>
</a-entity>
<a-entity id="group-exterieurGauche">
<a-image spot="linkto:#coinGauche;spotgroup:group-coinGauche"
position="-3.128 -0.215 11.827" src="#fleche" look-at="#cam"
sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:batInfoRDCR.html; on:click"
position="9.5 0.272 2.8" src="#fleche" look-at="#cam" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="3.7 0 7.2" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
color="#FFFFFF"
></a-image>
</a-entity>
<a-entity id="group-parking" scale="0 0 0">
<a-entity slice9="width: 3; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Departement Informatique ; width:5; align:center;zOffset:0.05" ; look-at="#cam"
position="0.021 1.7 -5"></a-entity>
<a-entity slice9="width: 3; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Departement RT ; width:7; align:center;zOffset:0.05" ; look-at="#cam"
position="7 0.9 -7"></a-entity>
<a-entity slice9="width: 4; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Batiment central ; width:9; align:center;zOffset:0.05" ; look-at="#cam"
position="-11 0.636 -0.717"></a-entity>
<a-entity slice9="width: 6; height: 9; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png" text="value:Cette visite virtuelle a ete cree par Victor Mommalier, Clement Ferrere, Enzo Mazella,
Clara Poncet et Lucile Velut dans le cadre du projet tutore de deuxieme annee de DUT Informatique
;width:5;align:center;wrap-count:15;zOffset:0.05" ; look-at="#cam"
position="4.111 0.636 21.696"></a-entity>
<a-image spot="linkto: #exterieurMilieu; spotgroup: group-exterieurMilieu"
position="-1.78061 0 -9.74148" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto: #exterieurDroit; spotgroup: group-exterieurDroit"
position="4.1 0 -5.9" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto: #exterieurCentral; spotgroup: group-exterieurCentral"
position="-6.80577 0 1.25103" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="-6 0 -5.6" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
color="#FFFFFF"
></a-image>
</a-entity>
<a-entity id="group-exterieurCentral" scale="0 0 0">
<a-entity slice9="width: 6; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Entree du batiment central;wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="-10.571 3.779 5.809"></a-entity>
<a-image spot="linkto: #parking; spotgroup: group-parking"
position="-3.72751 0.89279 -6.31928" src="#fleche" look-at="#cam"
sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:batCentral.html; on:click"
position="-5.80567 0.71139 3.12434" src="#fleche" look-at="#cam"
sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="-7.3 0 -2.8" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
color="#FFFFFF"
></a-image>
</a-entity>
<a-entity id="group-exterieurDroit" scale="0 0 0">
<a-image spot="linkto: #parking; spotgroup: group-parking"
position="7.26916 1.13569 3.76474" src="#fleche" look-at="#cam"
sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="4.5 0 7.2" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
color="#FFFFFF"
></a-image>
</a-entity>
</a-entity>
</a-scene>
</body>
</html>

@ -0,0 +1,280 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Panorama</title>
<script src="https://aframe.io/releases/1.0.4/aframe.min.js"></script>
<script src="https://unpkg.com/aframe-slice9-component/dist/aframe-slice9-component.min.js"></script>
<script src="https://unpkg.com/aframe-look-at-component@0.5.1/dist/aframe-look-at-component.min.js"></script>
<!--animation component script-->
<script src="https://unpkg.com/aframe-animation-component@^4.1.2/dist/aframe-animation-component.min.js"></script>
<script src="scriptJS/spots.js"></script>
</head>
<body>
<a-scene id="notreScene" loading-screen="dotsColor:#FED700; backgroundColor: #303030">
<a-assets timeout="30000">
<!-- Toutes les scènes les utilisent -->
<img id="fleche" src="icones/fleche.png" height="357" width="367" alt=""/>
<img id="map" src="icones/map.png" height="256" width="256" alt=""/>
<a-sound id="boup" src="son/BOUP.mp3"></a-sound>
<!-- Extérieur -->
<img id="exterieurMilieu" src="image/exterieurMilieu.JPG" height="2688" width="5376" alt=""/>
<img id="parking" src="image/parking.jpg" height="2688" width="5376" alt=""/>
<img id="croisementChemin" src="image/croisementChemin.JPG" height="2688" width="5376" alt=""/>
<img id="devantAmphi" src="image/devantAmphi.jpg" height="2688" width="5376" alt=""/>
<img id="exterieurCentral" src="image/exterieurCentral.jpg" height="2688" width="5376" alt=""/>
<img id="coinGauche" src="image/coinGauche.JPG" height="2688" width="5376" alt=""/>
<img id="exterieurGauche" src="image/exterieurGauche.JPG" height="2688" width="5376" alt=""/>
<img id="exterieurDroit" src="image/exterieurDroit.jpg" height="2688" width="5376" alt=""/>
</a-assets>
<a-sky id="skybox" src="#exterieurMilieu"></a-sky>
<a-entity id="cam" camera position="0 1.6 0" look-controls wasd-controls="enabled:false">
<a-entity cursor="fuse:true;fuseTimeout:2000"
geometry="primitive:ring;radiusInner:0.01;radiusOuter:0.02"
position="0 0 -1.8"
material="shader:flat;color:blue">
</a-entity>
</a-entity>
<a-entity id="spots" hotspots>
<!-- GROUPE EXTERIEUR -->
<a-entity id="group-devantAmphi" scale="0 0 0">
<a-entity slice9="width: 5; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Departement Informatique ;wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="-7.560 -0.637 -11.469"></a-entity>
<a-entity slice9="width: 5; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Amphi A ;wrap-count:15; width:5; align:center;zOffset:0.05" ; look-at="#cam"
position="-5.271 -0.327 11.579"></a-entity>
<a-entity slice9="width: 5; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Amphi B;wrap-count:15; width:5; align:center;zOffset:0.05" ; look-at="#cam"
position="-11.571 -0.244 4.487"></a-entity>
<a-entity slice9="width: 5; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Entree arriere batiment central ;wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="9.304 0.992 -7.843"></a-entity>
<a-image spot="linkto:#croisementChemin;spotgroup:group-croisementChemin"
position="-6.239 -1.17 -7.336" src="#fleche" look-at="#cam" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:batCentralR.html; on:click"
position="8.139 -0.184 -6.7" src="#fleche" look-at="#cam" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="-7 0 -2.2" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
color="#FFFFFF"
></a-image>
</a-entity>
<a-entity id="group-croisementChemin" scale="0 0 0">
<a-entity slice9="width: 6.5; height: 3; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Amphi et entree arriere batiment central;wrap-count:15; width:5; align:center;zOffset:0.05"
; look-at="#cam" position="-16.350 1.5 1.414"></a-entity>
<a-entity slice9="width: 6.5; height: 3; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Departement biologie et entree arriere batiment informatique ;wrap-count:15; width:5; align:center;zOffset:0.05"
; look-at="#cam" position="-1.323 0.614 -19.618"></a-entity>
<a-image spot="linkto:#exterieurMilieu;spotgroup:group-exterieurMilieu"
position="0 -0.8 8" src="#fleche" look-at="#cam" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto:#devantAmphi;spotgroup:group-devantAmphi"
position="-8 0 0" src="#fleche" look-at="#cam" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto:#coinGauche;spotgroup:group-coinGauche"
position="0.167 -0.5 -10.8" src="#fleche" look-at="#cam" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="-6 0 -5.6" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
color="#FFFFFF"
></a-image>
</a-entity>
<a-entity id="group-exterieurMilieu">
<a-entity slice9="width: 5; height: 3; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Entree principale batiment informatique et RT;wrap-count:15; width:5; align:center;zOffset:0.05"
; look-at="#cam" position="-8.346 1.154 7.389"></a-entity>
<a-entity slice9="width: 5; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Amphitheatres;wrap-count:15; width:5; align:center;zOffset:0.05" ; look-at="#cam"
position="6.213 1.120 10.868"></a-entity>
<a-image link="href:batInfoRDC.html; on:click"
position="-7 0 0.5" src="#fleche" look-at="#cam" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto:#croisementChemin;spotgroup:group-croisementChemin"
position="1.6 0 7.77" src="#fleche" look-at="#cam" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto:#parking;spotgroup:group-parking"
position="-1 0 -9" src="#fleche" look-at="#cam" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="-6 0 -5.6" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
color="#FFFFFF"
></a-image>
</a-entity>
<a-entity id="group-coinGauche" scale="0 0 0">
<a-entity slice9="width: 5; height: 3; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Entree arriere batiment informatique;wrap-count:15; width:5; align:center;zOffset:0.05"
; look-at="#cam" position="10.350 1.684 -3.803"></a-entity>
<a-entity slice9="width: 4; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Departement biologie ;wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="-10.8 0.163 -4.246"></a-entity>
<a-image spot="linkto:#croisementChemin;spotgroup:group-croisementChemin"
position="2.4 -0.17 15.36" src="#fleche" look-at="#cam" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto:#exterieurGauche;spotgroup:group-exterieurGauche"
position="13 -0.5 -1.6" src="#fleche" look-at="#cam" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="-6 0 -5.6" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
color="#FFFFFF"
></a-image>
</a-entity>
<a-entity id="group-exterieurGauche" scale="0 0 0">
<a-image spot="linkto:#coinGauche;spotgroup:group-coinGauche"
position="-3.128 -0.215 11.827" src="#fleche" look-at="#cam"
sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:batInfoRDCR.html; on:click"
position="9.5 0.272 2.8" src="#fleche" look-at="#cam" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="3.7 0 7.2" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
color="#FFFFFF"
></a-image>
</a-entity>
<a-entity id="group-parking" scale="0 0 0">
<a-entity slice9="width: 3; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Departement Informatique ; width:5; align:center;zOffset:0.05" ; look-at="#cam"
position="0.021 1.7 -5"></a-entity>
<a-entity slice9="width: 3; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Departement RT ; width:7; align:center;zOffset:0.05" ; look-at="#cam"
position="7 0.9 -7"></a-entity>
<a-entity slice9="width: 4; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Batiment central ; width:9; align:center;zOffset:0.05" ; look-at="#cam"
position="-11 0.636 -0.717"></a-entity>
<a-entity slice9="width: 6; height: 9; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png" text="value:Cette visite virtuelle a ete cree par Victor Mommalier, Clement Ferrere, Enzo Mazella,
Clara Poncet et Lucile Velut dans le cadre du projet tutore de deuxieme annee de DUT Informatique
;width:5;align:center;wrap-count:15;zOffset:0.05" ; look-at="#cam"
position="4.111 0.636 21.696"></a-entity>
<a-image spot="linkto: #exterieurMilieu; spotgroup: group-exterieurMilieu"
position="-1.78061 0 -9.74148" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto: #exterieurDroit; spotgroup: group-exterieurDroit"
position="4.1 0 -5.9" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto: #exterieurCentral; spotgroup: group-exterieurCentral"
position="-6.80577 0 1.25103" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="-6 0 -5.6" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
color="#FFFFFF"
></a-image>
</a-entity>
<a-entity id="group-exterieurCentral" scale="0 0 0">
<a-entity slice9="width: 6; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Entree du batiment central;wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="-10.571 3.779 5.809"></a-entity>
<a-image spot="linkto: #parking; spotgroup: group-parking"
position="-3.72751 0.89279 -6.31928" src="#fleche" look-at="#cam"
sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:batCentral.html; on:click"
position="-5.80567 0.71139 3.12434" src="#fleche" look-at="#cam"
sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="-7.3 0 -2.8" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
color="#FFFFFF"
></a-image>
</a-entity>
<a-entity id="group-exterieurDroit" scale="0 0 0">
<a-image spot="linkto: #parking; spotgroup: group-parking"
position="7.26916 1.13569 3.76474" src="#fleche" look-at="#cam"
sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="4.5 0 7.2" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
color="#FFFFFF"
></a-image>
</a-entity>
</a-entity>
</a-scene>
</body>
</html>

@ -0,0 +1,280 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Panorama</title>
<script src="https://aframe.io/releases/1.0.4/aframe.min.js"></script>
<script src="https://unpkg.com/aframe-slice9-component/dist/aframe-slice9-component.min.js"></script>
<script src="https://unpkg.com/aframe-look-at-component@0.5.1/dist/aframe-look-at-component.min.js"></script>
<!--animation component script-->
<script src="https://unpkg.com/aframe-animation-component@^4.1.2/dist/aframe-animation-component.min.js"></script>
<script src="scriptJS/spots.js"></script>
</head>
<body>
<a-scene id="notreScene" loading-screen="dotsColor:#FED700; backgroundColor: #303030">
<a-assets timeout="30000">
<!-- Toutes les scènes les utilisent -->
<img id="fleche" src="icones/fleche.png" height="357" width="367" alt=""/>
<img id="map" src="icones/map.png" height="256" width="256" alt=""/>
<a-sound id="boup" src="son/BOUP.mp3"></a-sound>
<!-- Extérieur -->
<img id="parking" src="image/parking.jpg" height="2688" width="5376" alt=""/>
<img id="exterieurMilieu" src="image/exterieurMilieu.JPG" height="2688" width="5376" alt=""/>
<img id="exterieurCentral" src="image/exterieurCentral.jpg" height="2688" width="5376" alt=""/>
<img id="exterieurDroit" src="image/exterieurDroit.jpg" height="2688" width="5376" alt=""/>
<img id="croisementChemin" src="image/croisementChemin.JPG" height="2688" width="5376" alt=""/>
<img id="devantAmphi" src="image/devantAmphi.jpg" height="2688" width="5376" alt=""/>
<img id="coinGauche" src="image/coinGauche.JPG" height="2688" width="5376" alt=""/>
<img id="exterieurGauche" src="image/exterieurGauche.JPG" height="2688" width="5376" alt=""/>
</a-assets>
<a-sky id="skybox" src="#parking"></a-sky>
<a-entity id="cam" camera position="0 1.6 0" look-controls wasd-controls="enabled:false">
<a-entity cursor="fuse:true;fuseTimeout:2000"
geometry="primitive:ring;radiusInner:0.01;radiusOuter:0.02"
position="0 0 -1.8"
material="shader:flat;color:blue">
</a-entity>
</a-entity>
<a-entity id="spots" hotspots>
<!-- GROUPE EXTERIEUR -->
<a-entity id="group-parking">
<a-entity slice9="width: 3; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Departement Informatique ; width:5; align:center;zOffset:0.05" ; look-at="#cam"
position="0.021 1.7 -5"></a-entity>
<a-entity slice9="width: 3; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Departement RT ; width:7; align:center;zOffset:0.05" ; look-at="#cam"
position="7 0.9 -7"></a-entity>
<a-entity slice9="width: 4; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Batiment central ; width:9; align:center;zOffset:0.05" ; look-at="#cam"
position="-11 0.636 -0.717"></a-entity>
<a-entity slice9="width: 6; height: 9; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png" text="value:Cette visite virtuelle a ete creee par Victor Mommalier, Clement Ferrere, Enzo Mazella,
Clara Poncet et Lucile Velut dans le cadre du projet tutore de deuxieme annee de DUT Informatique
;width:5;align:center;wrap-count:15;zOffset:0.05" ; look-at="#cam"
position="4.111 0.636 21.696"></a-entity>
<a-image spot="linkto: #exterieurMilieu; spotgroup: group-exterieurMilieu"
position="-1.78061 0 -9.74148" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto: #exterieurDroit; spotgroup: group-exterieurDroit"
position="4.1 0 -5.9" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto: #exterieurCentral; spotgroup: group-exterieurCentral"
position="-6.80577 0 1.25103" src="#fleche" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="-6 0 -5.6" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
color="#FFFFFF"
></a-image>
</a-entity>
<a-entity id="group-exterieurMilieu" scale="0 0 0">
<a-entity slice9="width: 5; height: 3; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Entree principale batiment informatique et RT;wrap-count:15; width:5; align:center;zOffset:0.05"
; look-at="#cam" position="-8.346 1.154 7.389"></a-entity>
<a-entity slice9="width: 5; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Amphitheatres;wrap-count:15; width:5; align:center;zOffset:0.05" ; look-at="#cam"
position="6.213 1.120 10.868"></a-entity>
<a-image link="href:batInfoRDC.html; on:click"
position="-7 0 0.5" src="#fleche" look-at="#cam" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto:#croisementChemin;spotgroup:group-croisementChemin"
position="1.6 0 7.77" src="#fleche" look-at="#cam" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto:#parking;spotgroup:group-parking"
position="-1 0 -9" src="#fleche" look-at="#cam" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="-6 0 -5.6" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
color="#FFFFFF"
></a-image>
</a-entity>
<a-entity id="group-exterieurCentral" scale="0 0 0">
<a-entity slice9="width: 6; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Entree du batiment central;wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="-10.571 3.779 5.809" ></a-entity>
<a-image spot="linkto: #parking; spotgroup: group-parking"
position="-3.72751 0.89279 -6.31928" src="#fleche" look-at="#cam"
sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:batCentral.html; on:click"
position="-5.80567 0.71139 3.12434" src="#fleche" look-at="#cam"
sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="-7.3 0 -2.8" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
color="#FFFFFF"
></a-image>
</a-entity>
<a-entity id="group-exterieurDroit" scale="0 0 0">
<a-image spot="linkto: #parking; spotgroup: group-parking"
position="7.26916 1.13569 3.76474" src="#fleche" look-at="#cam"
sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="4.5 0 7.2" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
color="#FFFFFF"
></a-image>
</a-entity>
<a-entity id="group-croisementChemin" scale="0 0 0">
<a-entity slice9="width: 6.5; height: 3; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Amphi et entree arriere batiment central;wrap-count:15; width:5; align:center;zOffset:0.05"
; look-at="#cam" position="-16.350 1.5 1.414"></a-entity>
<a-entity slice9="width: 6.5; height: 3; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Departement biologie et entree arriere batiment informatique ;wrap-count:15; width:5; align:center;zOffset:0.05"
; look-at="#cam" position="-1.323 0.614 -19.618"></a-entity>
<a-image spot="linkto:#exterieurMilieu;spotgroup:group-exterieurMilieu"
position="0 -0.8 8" src="#fleche" look-at="#cam" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto:#devantAmphi;spotgroup:group-devantAmphi"
position="-8 0 0" src="#fleche" look-at="#cam" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto:#coinGauche;spotgroup:group-coinGauche"
position="0.167 -0.5 -10.8" src="#fleche" look-at="#cam" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="-6 0 -5.6" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
color="#FFFFFF"
></a-image>
</a-entity>
<a-entity id="group-devantAmphi" scale="0 0 0">
<a-entity slice9="width: 5; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Departement Informatique ;wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="-7.560 -0.637 -11.469"></a-entity>
<a-entity slice9="width: 5; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Amphi A ;wrap-count:15; width:5; align:center;zOffset:0.05" ; look-at="#cam"
position="-5.271 -0.327 11.579"></a-entity>
<a-entity slice9="width: 5; height: 1; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Amphi B;wrap-count:15; width:5; align:center;zOffset:0.05" ; look-at="#cam"
position="-11.571 -0.244 4.487"></a-entity>
<a-entity slice9="width: 5; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Entree arriere batiment central ;wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="9.304 0.992 -7.843"></a-entity>
<a-image spot="linkto:#croisementChemin;spotgroup:group-croisementChemin"
position="-6.239 -1.17 -7.336" src="#fleche" look-at="#cam" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:batCentralR.html; on:click"
position="8.139 -0.184 -6.7" src="#fleche" look-at="#cam" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="-7 0 -2.2" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
color="#FFFFFF"
></a-image>
</a-entity>
<a-entity id="group-coinGauche" scale="0 0 0">
<a-entity slice9="width: 5; height: 3; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Entree arriere batiment informatique;wrap-count:15; width:5; align:center;zOffset:0.05"
; look-at="#cam" position="10.350 1.684 -3.803"></a-entity>
<a-entity slice9="width: 4; height: 2; left: 20; right: 43; top: 20; bottom: 43;src: tooltip.png"
text="value:Departement biologie ;wrap-count:15; width:5; align:center;zOffset:0.05" ;
look-at="#cam" position="-10.8 0.163 -4.246"></a-entity>
<a-image spot="linkto:#croisementChemin;spotgroup:group-croisementChemin"
position="2.4 -0.17 15.36" src="#fleche" look-at="#cam" sound="src:#boup; on: click"
color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image spot="linkto:#exterieurGauche;spotgroup:group-exterieurGauche"
position="13 -0.5 -1.6" src="#fleche" look-at="#cam" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="-6 0 -5.6" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
color="#FFFFFF"
></a-image>
</a-entity>
<a-entity id="group-exterieurGauche" scale="0 0 0">
<a-image spot="linkto:#coinGauche;spotgroup:group-coinGauche"
position="-3.128 -0.215 11.827" src="#fleche" look-at="#cam"
sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:batInfoRDCR.html; on:click"
position="9.5 0.272 2.8" src="#fleche" look-at="#cam" sound="src:#boup; on: click" color="#FFFFFF"
animation__ColorMouseEnter="property: color; to: #FED700; startEvents: mouseenter; dur: 300"
animation__ColorMouseLeave="property: color; to: #FFFFFF; startEvents: mouseleave; dur: 300"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"></a-image>
<a-image link="href:cartes.html; on:click"
position="3.7 0 7.2" src="#map" look-at="#cam" sound="src:#boup; on: click"
animation__ScaleMouseEnter="property: scale; to: 1.2 1.2 1.2; startEvents: mouseenter; dur: 300"
animation__ScaleMouseLeave="property: scale; to: 1 1 1; startEvents: mouseleave; dur: 300"
color="#FFFFFF"
></a-image>
</a-entity>
</a-entity>
</a-scene>
</body>
</html>

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.9 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 352 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 357 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 447 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 339 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 348 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 362 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 385 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 476 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 457 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 416 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 432 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 449 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 449 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 423 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 364 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 430 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 376 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 145 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 440 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 756 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 352 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 487 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 410 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 442 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 427 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 433 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 466 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 424 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 418 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 430 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 424 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 466 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 314 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 352 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 385 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 447 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 394 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 392 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 405 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 549 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 757 KiB

Some files were not shown because too many files have changed in this diff Show More

Loading…
Cancel
Save