Long story short, I know my coordinates are off and I believe my indices might be off.

I'm trying to render a simple 2d rectangle with a texture in webgl

here's the code I have for the vbo/ibo:

rectVertices.vertices = new Float32Array(
[
    -0.5, -0.5,  // Vertice 1, bottom /  left
     0.0,  0.0,  // UV 1

    -0.5,  0.5,  // Vertice 2,    top /  left
     0.0,  1.0,  // UV 2

     0.5,  0.5,  // Vertice 3,    top / right
     1.0,  1.0,  // UV 3

     0.5, -0.5,  // Vertice 4, bottom / right
     1.0,  0.0,  // UV 4
]);

rectVertices.indices = new Int16Array([
    1,2,3,1,3,4
]);


/* I'm assuming the vertices go like this

(-0.5, 0.5) ------ ( 0.5, 0.5)
            |    |
            |    |
(-0.5,-0.5) ------ ( 0.5,-0.5)

with the origin in the middle

and the texture coordinates go like this:

( 0.0, 1.0) ------ ( 1.0, 1.0)
            |    |
            |    |
( 0.0, 0.0) ------ ( 1.0, 0.0)

so as you can see I'm all messed up.

I'm also using:

gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, true);

*/

So, I need to know the origins.