instancing, moved sound to rig, http to https

master
Fabien Benetou 1 year ago
parent 68599638ab
commit 35ec84ca2a
  1. 62
      index.html
  2. 1
      portail.html

@ -1,9 +1,11 @@
<html>
<head>
<script src="https://aframe.io/releases/1.3.0/aframe.min.js"></script>
<script src="https://cdn.jsdelivr.net/gh/diarmidmackenzie/instanced-mesh@v0.6.0/src/instanced-mesh.min.js"></script>
</head>
<body>
<script>
if(window.location.protocol != 'https:') { location.href = location.href.replace("http://", "https://"); }
var simsrc = "simulations/initial_simulation_data/crop_outpy_"
var forceSimulationSource = AFRAME.utils.getUrlParameter('simsrc');
@ -12,6 +14,7 @@ if ( forceSimulationSource ) {
console.log(simsrc,"switched from default simulation to this one")
// sould also update the src of id="debug_sim_cerema" with a specific step, e.g 50
}
const desktopHeight = 2.5
const simext = ".jpg"
const simstart = 1
const simend = 95 // mostly correct as new simulations got to 96 steps
@ -61,9 +64,9 @@ var positionsCurated = [
offsetWatersimPosition: "-124.32254 0.78377 -46.41836", // TODO use
hotspots: [ "-134.62038 3 -13.29107", "-125.89544 3 -30.36393", "-119.72245 3 -49.78609", "-96.91944 3 -95.00968", "-90.17903 3 -109.1628", "-142.76086 3 11.1124"],
visualMarkerPositions:[
{position:"-124.32254 0.78377 -46.41836"},
{position:"-130.50386 0.78377 -30.91602"},
{position:"-137.62082 0.78377 -12.86285"},
{position:"-125.67578 0.78377 -46.72093"},
{position:"-132.39466 0.78377 -30.06373"},
{position:"-138.95986 0.78377 -13.43454"},
],
},
]
@ -337,7 +340,8 @@ function makeLamp( treedata, el){
tree.setAttribute("position", AFRAME.utils.coordinates.stringify(
pointFromCoordinates( {lat:treedata.lat, lon:treedata.lon} )
) )
tree.setAttribute("gltf-model", "Visuals/EXPORTS/EXPORTS_gltf/ModelsSolo/AA_Ruelle_Lampadaire.glb" )
//tree.setAttribute("gltf-model", "Visuals/EXPORTS/EXPORTS_gltf/ModelsSolo/AA_Ruelle_Lampadaire.glb" )
tree.setAttribute("instanced-mesh-member", "mesh:#meshlamp")
el.appendChild( tree )
}
@ -348,7 +352,8 @@ function makeTree( treedata, el){
tree.setAttribute("position", AFRAME.utils.coordinates.stringify(
pointFromCoordinates( {lat:treedata.lat, lon:treedata.lon} )
) )
tree.setAttribute("gltf-model", "Visuals/EXPORTS/EXPORTS_gltf/AA_Ruelle_Arbre.glb" )
//tree.setAttribute("gltf-model", "Visuals/EXPORTS/EXPORTS_gltf/AA_Ruelle_Arbre.glb" )
tree.setAttribute("instanced-mesh-member", "mesh:#meshtree")
el.appendChild( tree )
}
@ -501,7 +506,10 @@ AFRAME.registerComponent('teleport-via-cursor', {
var cam = document.querySelector("#camera-rig")
this.el.addEventListener('click', function (evt) {
var pos = el.getAttribute("position")
cam.setAttribute("position", pos.x + " 1.6 " + pos.z)
if (!AFRAME.utils.device.checkHeadsetConnected())
cam.setAttribute("position", pos.x + " " + desktopHeight + " " + pos.z)
else
cam.setAttribute("position", pos.x + " " + 1.6 + " " + pos.z)
// might want to blink too, e.g black sphere around the camera for .5s
});
this.el.addEventListener('fusing', function (evt) {
@ -625,15 +633,25 @@ var animationTime = 0 // this isn't exactly aligned with animations
loadedosmways = [];
function playSound(param){
function playSound(){
var entity = document.querySelector('[sound]');
entity.components.sound.playSound();
document.querySelector("a-entity[sound]").components.sound.playSound()
param.style.display = "none";
document.querySelector("#mainbutton").style.display = "none";
}
function startExperience(){
AFRAME.scenes[0].enterVR();
playSound();
resetAnimations()
if (!AFRAME.utils.device.checkHeadsetConnected()){
document.querySelector("#camera-rig").object3D.position.y = desktopHeight
// works only at the beginning, not after teleporting
}
}
</script>
<button id=mainbutton 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>
<button id=mainbutton style="z-index: 1; position: absolute; width:50%; margin: auto; text-align:center; top:45%; left:30%; height:30%;" onclick="startExperience()">Demarrer l'experience</button>
<a-scene displaymodels forcestats customdebug >
<a-entity id="hotspots" hotspots ></a-entity>
<a-entity id="watervisuals" watervisuals ></a-entity>
@ -641,17 +659,17 @@ function playSound(param){
<a-entity id="leftHand" hand-tracking-controls="hand: left;"></a-entity>
<a-entity id="rightHand" hand-tracking-controls="hand: right;"></a-entity>
<a-entity id="camera-rig" set-initial-camera-from-data>
<a-sound autoplay="false" loop="true" src="src: url(Sounds/AMBIANCES/CEREMA_AMB_VILLE.mp3)"></a-sound>
<a-sound class="randomfx" autoplay="false" loop="false" src="src: url(Sounds/FX/CEREMA_CRACK_MAISON_01.mp3)"></a-sound>
<a-sound class="randomfx" autoplay="false" loop="false" src="src: url(Sounds/FX/CEREMA_CRACK_MAISON_02.mp3)"></a-sound>
<a-sound class="randomfx" autoplay="false" loop="false" src="src: url(Sounds/FX/CEREMA_CRACK_MAISON_03.mp3)"></a-sound>
<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-entity position="0 -1.2 0" 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>
<a-entity camera look-controls hud>
<a-sound autoplay="false" loop="true" src="src: url(Sounds/AMBIANCES/CEREMA_AMB_VILLE.mp3)"></a-sound>
<a-sound class="randomfx" autoplay="false" loop="false" src="src: url(Sounds/FX/CEREMA_CRACK_MAISON_01.mp3)"></a-sound>
<a-sound class="randomfx" autoplay="false" loop="false" src="src: url(Sounds/FX/CEREMA_CRACK_MAISON_02.mp3)"></a-sound>
<a-sound class="randomfx" autoplay="false" loop="false" src="src: url(Sounds/FX/CEREMA_CRACK_MAISON_03.mp3)"></a-sound>
<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-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 -3"
@ -661,6 +679,8 @@ function playSound(param){
</a-entity>
<a-gltf-model resetanimations="" position="6 6 9" scale="100 100 100" rotation="29 -160 -10" gltf-model="Visuals/ASSETS_3D/AA_Reset.glb" opacity="1"></a-gltf-model>
</a-entity>
<a-entity id="meshlamp" gltf-model="Visuals/EXPORTS/EXPORTS_gltf/ModelsSolo/AA_Ruelle_Lampadaire.glb" instanced-mesh ></a-entity>
<a-entity id="meshtree" gltf-model="Visuals/EXPORTS/EXPORTS_gltf/AA_Ruelle_Arbre.glb" instanced-mesh ></a-entity>
<a-plane id="ground" visible=false position="0 -.5 0" rotation="-90 0 0" width="1000" height="1000" color="lightgrey"></a-plane>
<a-entity light="type: ambient; color: #BBB"></a-entity>
@ -672,10 +692,10 @@ function playSound(param){
<a-entity position="-70 0 -42" osm id="osm"></a-entity>
<!-- 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_ruelle" visible="" position="-139.95628 0.73 -34.3154" 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="33.17554 -1.33294 -293.0568" scale="1.2 1.2 1.2" rotation="0 170.2355012158848 0" gltf-model="Visuals/EXPORTS/EXPORTS_gltf/AA_Citedesbaquets.glb" listosmways=""></a-gltf-model>
<a-plane id="landscape" position="0 -12.5 0" scale="10 10 10" rotation="-90 0 -90" width="100" height="100" geometry="segmentsHeight: 128; segmentsWidth: 128"
material="src: ign_terrain_cached.jpg; displacementScale: 20; displacementMap: ign_elevation_cached.jpg;"></a-plane>
material="src: ign_terrain_cached.jpg; displacementScale: 10; displacementMap: ign_elevation_cached.jpg;"></a-plane>
<a-plane id="watersim" cerema="" position="0 -51.55 0" rotation="-90 90 0" src="Visuals/EAU/Eau_01.jpg"
material="displacementScale: 0.04; wireframe: false; displacementMap: "

@ -45,6 +45,7 @@
</ul>
<h2>Documentation</h2>
Utiliser <a href="https://www.oculus.com/open_url/?url=https://fabien.benetou.fr/pub/home/CEREMA/">ouvrir via Quest app</a>.<br/>
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>

Loading…
Cancel
Save