/**

* World.mathBox() – Create a mathbox-capable renderer inside a DOM element.

*/

tQuery.World.registerInstance('mathBox', function (element, options) {

element = element || document.body;

// Create threebox scene for WebGL

this.threeBox(element, options);

// Create overlay for labels / annotations

var overlay = new MathBox.Overlay();

element.appendChild(overlay.domElement);

overlay.domElement.style.position = 'absolute';

overlay.domElement.style.left = 0;

overlay.domElement.style.top = 0;

overlay.domElement.style.right = 0;

overlay.domElement.style.bottom = 0;

// Create mathbox stage

var mathbox = new MathBox.Stage(options, this, overlay);

var callback = function () {

mathbox.update();

};

this.tScene().add(mathbox);

// White background

this._renderer.setClearColorHex( 0xFFFFFF, 1 );

// Hook into rendering loop

mathbox.unhook = function () {

this.loop().unhookPreRender(callback)

}

this.loop().hookPreRender(callback);

if (!options.cameraControls) {

var camera = this.tCamera();

camera.position.x = 0;

camera.position.y = 0;

camera.position.z = options.orbit;

camera.lookAt(new THREE.Vector3(0, 0, 0));

}

return mathbox;

});