Texture Movement. WebGL, TypeScript

Published October 20, 2019
Advertisement

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 likes 0 comments

Comments

Nobody has left a comment. You can be the first!
You must log in to join the conversation.
Don't have a GameDev.net account? Sign up!
Advertisement