Report on three.js camera and look at parameters

camera_reporter.js

/** @namespace */
var THREEg	= THREEg || {}

THREEg.CameraReporter	= function (){

	var msMin	= 100;
	var msMax	= 0;

	var container	= document.createElement( 'div' );
	container.style.cssText = 'width:150px;opacity:0.9;cursor:pointer';

	var msDiv	= document.createElement( 'div' );
	msDiv.style.cssText = 'padding:0 0 3px 3px;text-align:left;background-color:#200;';
	container.appendChild( msDiv );

	var msText	= document.createElement( 'div' );
	msText.style.cssText = 'color:#f00;font-family:Helvetica,Arial,sans-serif;font-size:9px;font-weight:bold;line-height:15px';
	msText.innerHTML= 'Camera stats';
	msDiv.appendChild( msText );
	
	var msTexts	= [];
	var nLines	= 6;
	for(var i = 0; i < nLines; i++){
		msTexts[i]	= document.createElement( 'div' );
		msTexts[i].style.cssText = 'color:#f00;background-color:#311;font-family:Helvetica,Arial,sans-serif;font-size:9px;font-weight:bold;line-height:15px';
		msDiv.appendChild( msTexts[i] );		
		msTexts[i].innerHTML= '-';
	}


	var lastTime	= Date.now();
	return {
		domElement: container,

		update: function(camera, lookAt){

			// refresh only 30time per second
			if( Date.now() - lastTime < 1000/30 )	return;
			lastTime	= Date.now()

			var i	= 0;
			msTexts[i++].textContent = "fov: " + camera.fov;
			msTexts[i++].textContent = "near: " + camera.near;
			msTexts[i++].textContent = "far: " + camera.far;
			msTexts[i++].textContent = "lookAt.x: "	+ lookAt.x;
			msTexts[i++].textContent = "lookAt.y: "	+ lookAt.y;
			msTexts[i++].textContent = "lookAt.z: "	+ lookAt.z;
		}
	}	
};