utopiah
/
CEREMA
1
0
Fork 0
Code Issues 8 Pull Requests Packages Projects Releases Wiki Activity

more in depth portal and start button

Browse Source
master
Fabien Benetou 2 years ago
parent 04066d32a5
commit b107f524ca
2 changed files with 30 additions and 58 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 69
      index.html
  2. 19
      portail.html

69
index.html
Unescape View File

@ -195,16 +195,6 @@ for (var i=0;i<elevation_res;i++)
var queryElevation = 'https://api.open-elevation.com/api/v1/lookup'
// doesn't seem to have sufficient resolution, might use IGN instead
// animate water based on flood data
// done as animation on blue plane
// see simulation_data_example.json
// allow viewer to control the animation e.g restart, pause, change time
// seek on the set of animations
// modify environment to reflect time of day
// done as animation on point light
var buildingHeight = 6
var forceHeight = AFRAME.utils.getUrlParameter('height');
if ( forceHeight ) buildingHeight = Number( forceHeight )
@ -470,14 +460,6 @@ AFRAME.registerComponent('elevation', {
}
})
AFRAME.registerComponent('courbes', {
init: function () {
var el = this.el
console.log("elevation data from ign courbes.json file")
fetch("courbe_clipped.json" ).then(response => response.json()).then(data => curvesTo3DElements(data.features, el ) )
}
})
AFRAME.registerComponent('osm', {
init: function () {
var el = this.el
@ -628,13 +610,16 @@ var animationTime = 0 // this isn't exactly aligned with animations
loadedosmways = [];
function playSound(){
function playSound(param){
var entity = document.querySelector('[sound]');
entity.components.sound.playSound();
document.querySelector("a-entity[sound]").components.sound.playSound()
param.style.display = "none";
resetAnimations()
}
</script>
<button style="z-index: 1; position: absolute;" onclick="playSound()">Play sound</button>
<a-scene NOcourbes displaymodels forcestats>
<button style="z-index: 1; position: absolute; width:50%; margin: auto; text-align:center; top:45%; left:30%; height:30%;" onclick="playSound(this)">Demarrer l'experience</button>
<a-scene displaymodels forcestats>
<a-entity id="hotspots" hotspots ></a-entity>
<!-- Quest available only during event, otherwise cardboard -->
<a-entity id="leftHand" hand-tracking-controls="hand: left;"></a-entity>
@ -648,7 +633,9 @@ function playSound(){
<a-sound class="randomfx" autoplay="false" loop="false" src="src: url(Sounds/FX/CEREMA_CRACK_MAISON_04.mp3)"></a-sound>
<a-sound class="randomfx" autoplay="false" loop="false" src="src: url(Sounds/FX/CEREMA_SIRENNES_POMPIER.mp3)"></a-sound>
<a-sound class="randomfx" autoplay="false" loop="false" src="src: url(Sounds/FX/CEREMA_SIRENNE_COMMUNALE.mp3)"></a-sound>
<!-- a faire crescendo <a-sound autoplay="false" loop="true" src="src: url(CEREMA_BOUCLE_EAU.mp3)"></a-sound> -->
<a-entity sound="src: url(Sounds/FX/CEREMA_BOUCLE_EAU.mp3); loop:true; autoplay:false; volume:0;"
animation="property: sound.volume; from:0; to: 1; dur: 9000; easing: linear; loop: false;"
></a-entity>
<!-- consider time as HUD text display-->
<a-entity cursor="fuse: true; fuseTimeout: 500"
position="0 0 -1"
@ -668,44 +655,18 @@ function playSound(){
<a-entity position="-70 0 -42" osm id="osm"></a-entity>
<!--
<a-entity elevation id="elevation" visible="false"></a-entity>
Visuals/TEXTURE_BAT/TEXTURE_BAT_Base_Color.jpg
Visuals/TEXTURE_BAT/TEXTURE_TOIT_Normal_OpenGL.jpg
Visuals/TEXTURE_BAT/TEXTURE_BAT02_Base_Color.jpg
Visuals/TEXTURE_BAT/TEXTURE_SOL_Base_Color.jpg
Visuals/TEXTURE_BAT/TEXTURE_TOIT_Base_Color.jpg
Visuals/TEXTURE_BAT/TEXTURE_BAT02_Normal_OpenGL.jpg
Visuals/TEXTURE_BAT/TEXTURE_SOL_Normal_OpenGL.jpg
Visuals/TEXTURE_BAT/TEXTURE_BAT_Normal_OpenGL.jpg
Visuals/TEXTURE_EAU/Texture_eau_Base_Color.png
Visuals/TEXTURE_EAU/Texture_eau_Metallic.png
Visuals/TEXTURE_EAU/Texture_eau_Normal_OpenGL.png
Visuals/TEXTURE_EAU/Texture_eau_Roughness.png
Visuals/TEXTURE_EAU/Texture_eau_Height.png
Visuals/EXPORTS/EXPORTS_gltf/ModelsSolo/AA_Ruelle_route.glb
Visuals/EXPORTS/EXPORTS_gltf/ModelsSolo/AA_Ruelle_Boite01.glb
Visuals/EXPORTS/EXPORTS_gltf/ModelsSolo/AA_Ruelle_Trottoir.glb
Visuals/EXPORTS/EXPORTS_gltf/ModelsSolo/AA_Ruelle_Jardin.glb
Visuals/EXPORTS/EXPORTS_gltf/ModelsSolo/AA_Ruelle_Boite02.glb
Visuals/EXPORTS/EXPORTS_gltf/ModelsSolo/AA_Ruelle_Lampadaire.glb
Visuals/EXPORTS/EXPORTS_gltf/ModelsSolo/AA_Baquets_Haie.glb
Visuals/EXPORTS/EXPORTS_gltf/ModelsSolo/AA_Baquets_Barriere.glb
Visuals/EXPORTS/EXPORTS_gltf/AA_Citedesbaquets.glb
Visuals/EXPORTS/EXPORTS_gltf/AA_Ruelle_Arbre.glb
Visuals/EXPORTS/EXPORTS_gltf/AA_Ruelle_Buisson.glb
Visuals/EXPORTS/EXPORTS_gltf/AA_Quaidelaruelle.glb
live layers (deactivated by default)
material="src: https://wxs.ign.fr/ortho/geoportail/r/wms?LAYERS=ORTHOIMAGERY.ORTHOPHOTOS.BDORTHO&EXCEPTIONS=text/xml&FORMAT=image/jpeg&SERVICE=WMS&VERSION=1.3.0&REQUEST=GetMap&STYLES=&CRS=CRS:84&BBOX=0.470286,49.338484,0.556117,49.381417&WIDTH=4096&HEIGHT=4096; displacementScale: 20; displacementMap: https://wxs.ign.fr/altimetrie/geoportail/r/wms?LAYERS=ELEVATION.ELEVATIONGRIDCOVERAGE.HIGHRES&EXCEPTIONS=text/xml&FORMAT=image/jpeg&SERVICE=WMS&VERSION=1.3.0&REQUEST=GETMAP&STYLES=&CRS=CRS:84&BBOX=0.470286,49.338484,0.556117,49.381417&WIDTH=1024&HEIGHT=1024;" ></a-plane>
-->
<!-- offset on test data for easier vr testing -->
<a-gltf-model class="models_ruelle" visible="" position="-140.71021 0.73 -28.54369" scale="1.2 1.2 1.2" rotation="0 -111.8545396388247 0" gltf-model="Visuals/EXPORTS/EXPORTS_gltf/AA_Quaidelaruelle.glb" listosmways=""></a-gltf-model>
<a-gltf-model class="models_baquets" visible="" position="95.71286 -1.33294 -307.27021" scale="1.2 1.2 1.2" rotation="0 179.42402537639782 0" gltf-model="Visuals/EXPORTS/EXPORTS_gltf/AA_Citedesbaquets.glb" listosmways=""></a-gltf-model>
<a-plane id="landscape" position="0 -20 0" scale="10 10 10" rotation="-90 0 -90" width="100" height="100" geometry="segmentsHeight: 128; segmentsWidth: 128"
material="src: https://wxs.ign.fr/ortho/geoportail/r/wms?LAYERS=ORTHOIMAGERY.ORTHOPHOTOS.BDORTHO&EXCEPTIONS=text/xml&FORMAT=image/jpeg&SERVICE=WMS&VERSION=1.3.0&REQUEST=GetMap&STYLES=&CRS=CRS:84&BBOX=0.470286,49.338484,0.556117,49.381417&WIDTH=4096&HEIGHT=4096; displacementScale: 20; displacementMap: https://wxs.ign.fr/altimetrie/geoportail/r/wms?LAYERS=ELEVATION.ELEVATIONGRIDCOVERAGE.HIGHRES&EXCEPTIONS=text/xml&FORMAT=image/jpeg&SERVICE=WMS&VERSION=1.3.0&REQUEST=GETMAP&STYLES=&CRS=CRS:84&BBOX=0.470286,49.338484,0.556117,49.381417&WIDTH=1024&HEIGHT=1024;" ></a-plane>
<!-- somehow the displacement map does not seem to work anymore despite being accessible. Might have to rollback from git history. -->
material="src: ign_terrain_cached.jpg; displacementScale: 20; displacementMap: ign_elevation_cached.jpg;"></a-plane>
<a-plane id="watersim" cerema="" position="0 -50.25 0" rotation="-90 90 0" src="b1rwater0002.jpg"
<a-plane id="watersim" cerema="" position="0 -50.25 0" rotation="-90 90 0" src="Visuals/TEXTURE_EAU/Texture_eau_Base_Color.png"
material="displacementScale: 0.01; wireframe: false; displacementMap: ruelle_sim_data/crop_outpy_1.jpg"
geometry="segmentsHeight: 128; segmentsWidth: 128" scale="1000 1000 100"></a-plane>

19
portail.html
Unescape View File

@ -1,9 +1,17 @@
<html>
<img src="cerema_logo_horizontal.jpg" />
<h1>Les effets d'une crue de la Seine a Pont-Audemer</h1>
<h2>Experience par lieu</h2>
<ul>
<li><a target="_blank" class="experiencelinks" href="https://fabien.benetou.fr/pub/home/CEREMA/?">Quai de la Ruelle</a></li>
<li><a target="_blank" class="experiencelinks" href="https://fabien.benetou.fr/pub/home/CEREMA/?position=1">Les Baquets</a></li>
</ul>
<center>
<table><tr>
<td><a target="_blank" class="experiencetdnks" href="https://fabien.benetou.fr/pub/home/CEREMA/?">
<img src="ruelle_osm.png" width="300px"/><br><br>
<center>Quai de la Ruelle</center></a></td>
<td><a target="_blank" class="experiencetdnks" href="https://fabien.benetou.fr/pub/home/CEREMA/?position=1">
<img src="baquet_osm.png" width="300px"/><br><br>
<center>Les Baquets</center></a></td>
</tr></table>
</center>
<h2>Options</h2>
<ul>
@ -24,6 +32,9 @@
<h2>Documentation</h2>
Utiliser <a href="https://hmd.link">hmd.link</a> dans le navigateur Web du casque pour partager le lien genere ou <a href="https://fabien.benetou.fr/pub/home/CEREMA/portail.html">ce portail</a>.
<h2>Code</h2>
Disponible en open-source a <a href="https://git.benetou.fr/utopiah/CEREMA/">https://git.benetou.fr/utopiah/CEREMA/</a>
<br><br><hr><br><center>Conception immersive<br><img src="marelle.png" /></center>
<script>
var links = Array.from(document.querySelectorAll(".experiencelinks"))
function adjustHeight(param){

Write Preview
Loading…
Cancel
Save