Quaternion Animation Stopping point.

[JackFalcon]

Hello, 

      This may be a simple answer.

       A cube is rotating around the x axis with .addRotation(). 

      GOAL: detect when cube is flat on top, with z axis, to stop animation.

      So what are best ways to measure Quaternion rotation progress? And then stop the animation?

Thanks much,

 

[brianzinn]

If you can figure out how far you need to rotate before you start the animation, that might be easier.

var animationRotation = new Animation('myAnimation', 'rotation.y', 30,
    Animation.ANIMATIONTYPE_FLOAT, Animation.ANIMATIONLOOPMODE_CONSTANT)

var keys = []
keys.push({
    frame: 0,
    value: this.rotation.y
})

let newPositionY = this.isClockwise ? (Math.PI / 2) : (-(Math.PI / 2))

keys.push({
    frame: 30,
    value: this.rotation.y + newPositionY
})

animationRotation.setKeys(keys)
this.animations.push(animationRotation)

this.scene.beginAnimation(this, 0, 30, false, 1, () => {
   // after animation
});

Here I am rotating 90 degrees, but you can take current rotation and modulus PI / 2 to find the radians needed to be flat with z-axis.  If you are using a quaternion then you can do some crazy rolling animations - I haven't seen this documented anywhere, but you can rotate simultaneously on 2 axis.  I think you can set the Quaternion.RotationYawPitchRoll(0,?,?) to flatten with z axis.  If you make a PG I'm happy to give it a try.

var animationRotation = new Animation('arrowFlipRotation', 'rotationQuaternion', 30,
        Animation.ANIMATIONTYPE_QUATERNION, Animation.ANIMATIONLOOPMODE_CONSTANT)


    let startingQuaternion = (this.isClockwise === true)
        ? Quaternion.RotationYawPitchRoll(3 * (Math.PI / 4), Math.PI, 0)
        : Quaternion.RotationYawPitchRoll(Math.PI / 4, 0, 0)

    let destinationQuaternion = (this.isClockwise === true)
        ? Quaternion.RotationYawPitchRoll(Math.PI / 4, 0, 0)
        : Quaternion.RotationYawPitchRoll(3 * (Math.PI / 4), Math.PI, 0)

    this.rotationQuaternion = startingQuaternion

    var keys = []
    keys.push({
        frame: 0,
        value: this.rotationQuaternion
    })
    keys.push({
        frame: 30,
        value: destinationQuaternion
    })

    animationRotation.setKeys(keys)

    let easingFunction = new QuarticEase()
    easingFunction.setEasingMode(EasingFunction.EASINGMODE_EASEINOUT)

    animationRotation.setEasingFunction(easingFunction)
    this.animations.push(animationRotation)

    this.scene.beginAnimation(this, 0, 30, false, 1, () => {
        // done animation here
    })

 

[JackFalcon]

Nice, I'll give that a try... 

[JackFalcon]

Solved. Thanks @brianzinn

Will post solution.

[JackFalcon]

Stopping point for rotation animation, solution:

 /*****************************PLANET-FALLING-ANIMATION****************************/
            var orbitLimit = Math.PI / 2;  // total amount to rotate
            var deorbitRate = 0.6;         // amount to move each frame.
            var orbitCounter = 0;          // incremented amount across frames.
            var orbitRate = 0;             // calculation of orbit, based on direction.

            function animatePlanet(){
                //STOP-ORBIT-ANIMATION,
                if(orbitCounter>=orbitLimit){ //<---SOLUTION (radian-limit).
                    orbitCounter = 0;
                    return; //stop planet animation
                }else{ //ORBIT
                    //Calculate Orbit Heading.
                    if(rectHeading==='topnorth'){
                        orbitRate = -1*Math.PI/20;
                        orbitCounter += (-1* orbitRate) 
                    }else if (rectHeading==='topsouth'){
                        orbitRate = 1*Math.PI/20;
                        orbitCounter += orbitRate; 
                    }
                    //...
                }
                //ORBIT:
                    if(rectHeading==='topnorth'||rectHeading==='topsouth'){
                        world1.top.addRotation(orbitRate, 0, 0);
                        world1.north.addRotation(orbitRate, 0, 0);
                        world1.south.addRotation(orbitRate, 0, 0);
                        //...
                    }             
            }

 /*****************************END-PLANET-FALLING-ANIMATION****************************/

Description:  basic rotation interpolation. When applicable, render loop calls animatePlanet(), if radian-counter exceeds limit, animation stops, else it proceeds at given rate.

Context: this code is used to "orbit" a character around a planet, with the illusion of falling, Local Y of character stays constant. Single-Bevel-Cube shaped Planet orbits underneath.

The stopping-point keeps the world flat. It turned out to be  Math.PI / 2.

I do not understand why that number works, mathematically,  if someone can explain why Math.PI/2 rotates a cube to next face, that would be great!  

I keep incorrectly imagine it to be Math.PI/4... (?)

Cheers,

[GameMonetize]

hello! 360 degrees = 2PI

so 90 degrees = PI / 2

[JackFalcon]

Ah, makes sense!  I'd 'like'.... but used up daily allocation of 'likes' before 9am again.

 Maybe I can like it tomorrow.... : )

 jk. Thanks for tip.

 

[GameMonetize]

lol thanks