fixed emit() event details for onreleased/onpicked, added TTS example (FR)

in-situ-instructions
Fabien Benetou 6 months ago
parent 5c09425e47
commit 58b1ec5d69
  1. 31
      index.html
  2. 2
      jxr-core.js

@ -8,12 +8,14 @@
<script src='dependencies/aframe-troika-text.min.js'></script> <script src='dependencies/aframe-troika-text.min.js'></script>
<script src='dependencies/webdav.js'></script> <script src='dependencies/webdav.js'></script>
<script src="https://cdn.jsdelivr.net/gh/c-frame/aframe-extras@7.1.0/dist/aframe-extras.min.js"></script> <script src="https://cdn.jsdelivr.net/gh/c-frame/aframe-extras@7.1.0/dist/aframe-extras.min.js"></script>
<script src='jxr-core.js?1234567'></script> <script src='jxr-core.js?123456'></script>
<script src='jxr-postitnote.js?13235'></script> <script src='jxr-postitnote.js?13235'></script>
</head> </head>
<body> <body>
<script> <script>
/* TODO : /* TODO :
- refactor to use emit('eventname', {eventdata:'data'}) for onreleased and onpicked rather than latest element
e.g newEl.setAttribute("onreleased", 'document.querySelector("['+generatorName+']").emit("check",{color:"'+color+'"})')
- insure scene setup, e.g starting position and orientation of environment and main character (until now assumed unchanged) - insure scene setup, e.g starting position and orientation of environment and main character (until now assumed unchanged)
- isolate emit('eventname', {test:0}) versus same with onreleased (which does NOT work) and same without event detail (which works) - isolate emit('eventname', {test:0}) versus same with onreleased (which does NOT work) and same without event detail (which works)
- add audio instructions - add audio instructions
@ -27,11 +29,19 @@
../content/voicesBigguJulia/continu.mp3 ../content/voicesBigguJulia/continu.mp3
../content/voicesBigguJulia/biggu-fem.mp3 ../content/voicesBigguJulia/biggu-fem.mp3
example : tts --text "Regarde la couleur, ecoute le son, et pince avec ta main droite chaque cube dans le meme ordre" --model_name "tts_models/fr/mai/tacotron2-DDC" --out_path story.wav
Regarde la couleur, ecoute le son, et pince avec ta main droite chaque cube dans le meme ordre
Aide-moi a atteindre le poisson a la sortie du labyrinthe. Pour cela trouve les instructions pour me faire avancer, il y a en 4. Avec ta main gauche pince la premiere lettre et je bougerais dans cette direction !
Oops, les formes sont toutes melangees. Merci de les remettre a leur place en faisant attention que chaque fois ai la bonne couleur, comme indique par la ligne du haut et la colonne de droite. Pour deplacer les formes colorees pince les avec ta main droite.
Oh non, les lettres de ton prenom ont ete melangees. Pince chacune avec ta main droite et pose les dans le cube dans le bon ordre
- reset (as done for fishinbowl) - reset (as done for fishinbowl)
- better menu (e.g target with onreleased) - better menu (e.g target with onreleased)
- fix maze/mazemap mismatch (causing emit() error on init) - fix maze/mazemap mismatch (causing emit() error on init)
- game ideas - game ideas
- art deco / art nouveau facade as puzzle mixed pieces - art deco / art nouveau facade as puzzle mixed pieces
- philosophical experimentation, cf https://video.benetou.fr/w/9KGbaxtAEx4JLnhAkwQKC1 featuring then the trolley problem
*/ */
AFRAME.registerComponent('startfunctions', { AFRAME.registerComponent('startfunctions', {
@ -42,8 +52,8 @@ AFRAME.registerComponent('startfunctions', {
let newEl = document.createElement('a-entity') let newEl = document.createElement('a-entity')
//let gamename = "checkers" //let gamename = "checkers"
//let gamename = "carcassone" //let gamename = "carcassone"
//let gamename = "simon" let gamename = "simon"
let gamename = "voxelpaint" //let gamename = "voxelpaint"
newEl.id = gamename newEl.id = gamename
newEl.setAttribute(gamename, "") newEl.setAttribute(gamename, "")
newEl.classList.add( "game" ) newEl.classList.add( "game" )
@ -193,12 +203,7 @@ AFRAME.registerComponent('simon', {
newEl.setAttribute("sound", "src:url("+notePrefix+(i+1)+noteSuffix+")") newEl.setAttribute("sound", "src:url("+notePrefix+(i+1)+noteSuffix+")")
newEl.setAttribute("position", ""+(i%2)*this.scale+" 1.1 "+j*this.scale) newEl.setAttribute("position", ""+(i%2)*this.scale+" 1.1 "+j*this.scale)
newEl.setAttribute("target","true") newEl.setAttribute("target","true")
newEl.setAttribute("onreleased", "document.querySelector('["+generatorName+"]').emit('check')") newEl.setAttribute("onreleased", 'document.querySelector("['+generatorName+']").emit("check",{color:"'+color+'"})')
// somehow unable to pass parameters via emit() ?!
//newEl.setAttribute("onreleased", "document.querySelector('["+generatorName+"]').emit('check', {'color':'red'})")
//newEl.setAttribute("onreleased", 'document.querySelector("[simon]").emit("check", {color: "red"})')
//newEl.setAttribute("onreleased", 'document.querySelector("[simon]").emit("check", {color: "green"})')
//newEl.setAttribute("onreleased", 'document.querySelector("['+generatorName+']").emit("check",{color:"'+color+'"})')
newEl.classList.add( generatorName ) newEl.classList.add( generatorName )
el.appendChild(newEl) el.appendChild(newEl)
if (i==1) j++ if (i==1) j++
@ -217,14 +222,10 @@ AFRAME.registerComponent('simon', {
setTimeout( _ => { document.querySelector("["+generatorName+"]").emit('playSequence') }, 1000) setTimeout( _ => { document.querySelector("["+generatorName+"]").emit('playSequence') }, 1000)
}, },
check: function (evt) { check: function (evt) {
let latest = selectedElements[selectedElements.length-1].element
// could also snap it back, e.g clear rotation, possibily use initially position // could also snap it back, e.g clear rotation, possibily use initially position
let generatorName = this.attrName let generatorName = this.attrName
let color = latest.getAttribute("color") this.userSeq.push(evt.detail.color)
//this.userSeq.push(evt.detail.color) let box = this.el.querySelector("a-box[color="+evt.detail.color+"]")
//let box = this.el.querySelector("a-box[color="+evt.detail.color+"]")
this.userSeq.push(color)
let box = this.el.querySelector("a-box[color="+color+"]")
box.components.sound.playSound() box.components.sound.playSound()
console.log ('seq:', this.sequence.at( this.userSeq.length-1) ,'user:', this.userSeq.at(-1) ) console.log ('seq:', this.sequence.at( this.userSeq.length-1) ,'user:', this.userSeq.at(-1) )
if (this.userSeq.at(-1) == this.sequence.at( this.userSeq.length-1) ){ if (this.userSeq.at(-1) == this.sequence.at( this.userSeq.length-1) ){

@ -241,6 +241,7 @@ AFRAME.registerComponent('pinchprimary', { // currently only 1 hand, the right o
// avoiding setOnDropFromAttribute() as it is not idiosyncratic and creates timing issues // avoiding setOnDropFromAttribute() as it is not idiosyncratic and creates timing issues
AFRAME.registerComponent('onreleased', { // changed from ondrop to be coherent with event name AFRAME.registerComponent('onreleased', { // changed from ondrop to be coherent with event name
schema: {default: ""}, // type: "string" forced to avoid object type guess parsing
// could support multi // could support multi
// could check if target component is already present on this.el, if not, add it as it's required // could check if target component is already present on this.el, if not, add it as it's required
events: { events: {
@ -257,6 +258,7 @@ AFRAME.registerComponent('onreleased', { // changed from ondrop to be coherent w
}) })
AFRAME.registerComponent('onpicked', { AFRAME.registerComponent('onpicked', {
schema: {default: ""}, // type: "string" forced to avoid object type guess parsing
// could support multi // could support multi
// could check if target component is already present on this.el, if not, add it as it's required // could check if target component is already present on this.el, if not, add it as it's required
events: { events: {

Loading…
Cancel
Save