WebGL physics - collision detection

Hi there,

I’m making a 3D free kick game in WebGL, and I am having some problems with the physics engine / collision detection. Let me show you the phenomenon (runs in Chrome):

A correct rebound:


An incorrect rebound:


It seems that the ball does not get out of the colliding state, so when there is a check for collisions for the second time, the ball gets wrong velocity values.

The ball gets updated every 15 ms - index.html - line 305:

    if (elapsed > 15) {

Collision check can be found in ball.js and collision.js.

I’ve found that changing it to 10 ms sometimes solves the problem, but not in all cases. Feel free to ask if you need more information!

Please help me solve this! I’ve been stuck with this for a while :\

Finally i’ve found it out:

The ‘Adjust ball position if overlapping triangle’ code was wrong. It adjusted the ball, but in the wrong direction, so I had to negate that normal:

if ( vec3.length(sphereTriagDist) < this.radius ) {
    var scaledNorm = vec3.create();
    vec3.scale(tNorm, this.radius, scaledNorm);
    vec3.negate(scaledNorm, scaledNorm); //ADDED
    vec3.add(closePoint, scaledNorm, this.pos);

I’ve also set the update time to 10ms, because the source used a sphere radius of 0.5, and i’m using a radius of 0.1, so I need a lot more precision.

Actually the answer is here: http://gamedev.stackexchange.com/questions/11520/given-a-plane-and-a-point-how-can-i-determine-which-side-of-the-plane-the-point. I had to make the normals always point in the direction of the ball.

Scratch my last post, it’s wrong.