From 5673d84b3d19a2974fb5ec4c06358dbc876623aa Mon Sep 17 00:00:00 2001 From: Fabien Benetou Date: Mon, 18 Dec 2023 13:57:42 +0100 Subject: [PATCH] proper animations --- index.html | 68 +++++++++++++++++++++++++++++++++++++++--------------- 1 file changed, 49 insertions(+), 19 deletions(-) diff --git a/index.html b/index.html index ffb97f4..59d3559 100644 --- a/index.html +++ b/index.html @@ -92,21 +92,33 @@ function inspectModel(selectedModel){ return {animations:animations, bones:foundBones, skinnedMeshes: skinnedMeshes, morphTargets:morphTargets} } +function manualAnimate(selector="#biggu"){ + inspectModel( document.querySelector(selector).object3D ).animations[0].animations.map( (a,n) => + addNewNote('jxr document.querySelector('+selector+').setAttribute("animation-mixer", "clip:'+a.name+';loop:once")', '-1 '+(n/10+1)+' -1') + ) +} + function checkExerciseCompletion(targetNumber=2){ const instructions = document.querySelector("#instructions>a-troika-text") let counter = 0 + const mainCharacter = document.getElementById("biggu") + mainCharacter.addEventListener("animation-finished", _ => console.log('anim done')) Array.from( document.querySelector("#fishes").children ).map( f => { if (f.object3D.position.distanceTo( document.querySelector('#plate').object3D.position ) < .3 ) counter++ }) if (counter == targetNumber) { - instructions.setAttribute("value", "bravo Julia!") instructions.emit('win') - document.getElementById("biggu").setAttribute('animation-mixer', "clip:BigguAction_Yes;loop:once") + mainCharacter.setAttribute('animation-mixer', "clip:bigguaction_win;loop:once") + mainCharacter.addEventListener('animation-finished', _ => { + mainCharacter.setAttribute('animation-mixer', "clip:bigguaction_idle; loop:true;") + }) } else { - instructions.setAttribute("value", "presque Julia,\ncontinue...") instructions.emit('failed', {counter:counter}) - document.getElementById("biggu").setAttribute('animation-mixer', "clip:BigguAction_No;loop:once") - //document.getElementById("biggu").setAttribute('animation-mixer', "clip:BigguAction;loop:once") // t-pose - //document.getElementById("biggu").setAttribute('animation-mixer', "clip:BigguAction_PointL;loop:once") + mainCharacter.setAttribute('animation-mixer', "clip:bigguaction_yes;loop:once") + mainCharacter.addEventListener('animation-finished', _ => { + mainCharacter.setAttribute('animation-mixer', "clip:bigguaction_idle; loop:true;") + }) + // anims = [ "bigguaction_no", "Bigguaction_pl", "bigguaction_pr", "bigguaction_talk", "bigguaction_win", "bigguaction_win", "bigguaction_yes" ] + } } @@ -120,6 +132,8 @@ AFRAME.registerComponent('exercise', { first: {type: 'boolean', default: false}, }, init: function(){ + const mainCharacter = document.getElementById("biggu") + mainCharacter.setAttribute('animation-mixer', "clip:bigguaction_idle; loop:true;") const emittedExerciseId = this.el.id const instructions = document.querySelector("#instructions>a-troika-text") if (!this.data.first) @@ -128,6 +142,7 @@ AFRAME.registerComponent('exercise', { instructions.setAttribute("value", this.data.instructions ) instructions.addEventListener('win', _ => { instructions.setAttribute("value", this.data.win ) + // use whatever last exercise set, not correct // should setTimeout or let the player actively move on this.el.setAttribute('position', '0 0 9999') // must filter on id, making sure it's emited by matching excercise @@ -138,8 +153,8 @@ AFRAME.registerComponent('exercise', { } }) instructions.addEventListener('failed', ev => { - console.log(emittedExerciseId, this.id) instructions.setAttribute("value", this.data.failed ) + console.log(emittedExerciseId, this.id) }) // should be replaced by drawings or even scaled down models with "5" and arrow or hand model } @@ -164,6 +179,9 @@ AFRAME.registerComponent('exercise', { refresh-text-content-from-wiki-page="pagename:TestingPairCollaboration" --> + + + + + @@ -187,19 +216,19 @@ AFRAME.registerComponent('exercise', { align="center" color="black" position="0 0 .2"> - + - - - - - - + + + + + + - + - + @@ -210,8 +239,11 @@ AFRAME.registerComponent('exercise', { - + + + + @@ -230,8 +262,6 @@ AFRAME.registerComponent('exercise', { - -