gl: WebGL context model: xModelGeometry fpt: bool (floating point texture support)
function xModelHandle(gl, model, fpt) {
    if (typeof (gl) == 'undefined' || typeof (model) == 'undefined' || typeof (fpt) == 'undefined') {
        throw 'WebGL context and geometry model must be specified';
    }

    this._gl = gl;
    this._model = model;
    this._fpt = fpt;

    /**
     * unique ID which can be used to identify this handle 
     */
    this.id = xModelHandle._instancesNum++;

    /**
     * indicates if this model should be used in a rendering loop or not.
     */
    this.stopped = false;

    this.count = model.indices.length;

    //data structure 
    this.vertexTexture = gl.createTexture();
    this.matrixTexture = gl.createTexture();
    this.styleTexture = gl.createTexture();
    this.stateStyleTexture = gl.createTexture();

    this.vertexTextureSize = 0;
    this.matrixTextureSize = 0;
    this.styleTextureSize = 0;

    this.normalBuffer = gl.createBuffer();
    this.indexBuffer = gl.createBuffer();
    this.productBuffer = gl.createBuffer();
    this.styleBuffer = gl.createBuffer();
    this.stateBuffer = gl.createBuffer();
    this.transformationBuffer = gl.createBuffer();

    //small texture which can be used to overwrite appearance of the products
    this.stateStyle = new Uint8Array(15 * 15 * 4);
    this._feedCompleted = false;

    this.region = model.regions[0];
    //set the most populated region
    model.regions.forEach(function (region) {
        if (region.population > this.region.population) {
            this.region = region;
        }
    }, this);
    //set default region if no region is defined. This shouldn't ever happen if model contains any geometry.
    if (typeof (this.region) == 'undefined') {
        this.region = {
            population: 1,
            centre: [0.0, 0.0, 0.0],
            bbox: [0.0, 0.0, 0.0, 10 * model.meter, 10 * model.meter, 10 * model.meter]
        }
    }
}