Jump to content
  • Advertisement

Texture Movement. WebGL, TypeScript

8Observer8

1038 views

I made a simple example with checking of collision with right wall:

TextureMovement.gif

    private GameLoop(): void
    {
        this.Update();
        this.Draw();
        requestAnimationFrame(() => this.GameLoop());
    }

    private Update(): void
    {
        this._x += 2;

        // Check a collisiion with the right wall
        if (this._x > this._gl.canvas.width)
        {
            // Move an object to left wall
            this._x = 0;
        }

        mat4.identity(this._modelMatrix);
        mat4.translate(this._modelMatrix, this._modelMatrix, vec3.fromValues(this._x, this._y, 0));
        mat4.rotateZ(this._modelMatrix, this._modelMatrix, 0 * Math.PI / 180.0);
        mat4.scale(this._modelMatrix, this._modelMatrix, vec3.fromValues(32, 32, 1));
 
        let uModelMatrix = this._gl.getUniformLocation(this._program, "uModelMatrix");
        this._gl.uniformMatrix4fv(uModelMatrix, false, this._modelMatrix);
    }

    private Draw(): void
    {
        this._gl.clear(this._gl.COLOR_BUFFER_BIT);
        this._gl.drawArrays(this._gl.TRIANGLE_STRIP, 0, 4);
    }

 



0 Comments


Recommended Comments

There are no comments to display.

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Advertisement
×

Important Information

By using GameDev.net, you agree to our community Guidelines, Terms of Use, and Privacy Policy.

GameDev.net is your game development community. Create an account for your GameDev Portfolio and participate in the largest developer community in the games industry.

Sign me up!