Source: gfx/core/renderers/webgl/utils/Quad.js

/**
 * Helper class to create a quad
 *
 * @class
 * @param gl {WebGLRenderingContext} The gl context for this quad to use.
 */
function Quad(gl) {
  /*
   * the current WebGL drawing context
   *
   * @member {WebGLRenderingContext}
   */
  this.gl = gl;

//    this.textures = new TextureUvs();

    /**
     * An array of vertices
     *
     * @member {Float32Array}
     */
  this.vertices = new Float32Array([
    0,0,
    200,0,
    200,200,
    0,200,
  ]);

    /**
     * The Uvs of the quad
     *
     * @member {Float32Array}
     */
  this.uvs = new Float32Array([
    0,0,
    1,0,
    1,1,
    0,1,
  ]);

//    var white = (0xFFFFFF >> 16) + (0xFFFFFF & 0xff00) + ((0xFFFFFF & 0xff) << 16) + (1 * 255 << 24);
    // TODO convert this to a 32 unsigned int array
    /**
     * The color components of the triangles
     *
     * @member {Float32Array}
     */
  this.colors = new Float32Array([
    1,1,1,1,
    1,1,1,1,
    1,1,1,1,
    1,1,1,1,
  ]);

    /*
     * @member {Uint16Array} An array containing the indices of the vertices
     */
  this.indices = new Uint16Array([
    0, 1, 2, 0, 3, 2,
  ]);

    /*
     * @member {WebGLBuffer} The vertex buffer
     */
  this.vertexBuffer = gl.createBuffer();

    /*
     * @member {WebGLBuffer} The index buffer
     */
  this.indexBuffer = gl.createBuffer();

  gl.bindBuffer(gl.ARRAY_BUFFER, this.vertexBuffer);
  gl.bufferData(gl.ARRAY_BUFFER, (8 + 8 + 16) * 4, gl.DYNAMIC_DRAW);

  gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this.indexBuffer);
  gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, this.indices, gl.STATIC_DRAW);

  this.upload();
}

Quad.prototype.constructor = Quad;

/**
 * Maps two Rectangle to the quad
 * @param rect {PIXI.Rectangle} the first rectangle
 * @param rect2 {PIXI.Rectangle} the second rectangle
 */
Quad.prototype.map = function(rect, rect2) {
  var x = 0; // rect2.x / rect.width;
  var y = 0; // rect2.y / rect.height;

  this.uvs[0] = x;
  this.uvs[1] = y;

  this.uvs[2] = x + rect2.width / rect.width;
  this.uvs[3] = y;

  this.uvs[4] = x + rect2.width / rect.width;
  this.uvs[5] = y + rect2.height / rect.height;

  this.uvs[6] = x;
  this.uvs[7] = y + rect2.height / rect.height;

    // / -----
  x = rect2.x;
  y = rect2.y;

  this.vertices[0] = x;
  this.vertices[1] = y;

  this.vertices[2] = x + rect2.width;
  this.vertices[3] = y;

  this.vertices[4] = x + rect2.width;
  this.vertices[5] = y + rect2.height;

  this.vertices[6] = x;
  this.vertices[7] = y + rect2.height;

  this.upload();
};

/**
 * Binds the buffer and uploads the data
 */
Quad.prototype.upload = function() {
  var gl = this.gl;

    // TODO could probably be pushed into one upload!
  gl.bindBuffer(gl.ARRAY_BUFFER, this.vertexBuffer);

  gl.bufferSubData(gl.ARRAY_BUFFER, 0, this.vertices);

  gl.bufferSubData(gl.ARRAY_BUFFER, 8 * 4, this.uvs);

  gl.bufferSubData(gl.ARRAY_BUFFER, (8 + 8) * 4, this.colors);
};

Quad.prototype.destroy = function() {
  var gl = this.gl;

  gl.deleteBuffer(this.vertexBuffer);
  gl.deleteBuffer(this.indexBuffer);
};

module.exports = Quad;