OrbitReporter.js

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

THREEg.OrbitReporter	= function (){

	var msMin	= 100;
	var msMax	= 0;

	var container	= document.createElement( 'div' );
	container.style.cssText = 'width:100px;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= 'OrbitControl';
	msDiv.appendChild( msText );
	
	var msTexts	= [];
	var nLines	= 2;
	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(orbitControls){

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

			var i	= 0;
			//msTexts[i++].textContent = "==orbit control==";

			msTexts[i++].textContent = "Azimuthal: " + orbitControls.getAzimuthalAngle().toFixed(3);
			msTexts[i++].textContent = "Polar: "	+ orbitControls.getPolarAngle().toFixed(3);
		}
	}	
};