Added MiscUtils with THREE.requestAnimationFrame.

This is lifted from greggman's ThreeD http://code.google.com/p/threedlibrary/

Also modified ribbons example to show how to use this.

examples/ribbons_gl.html

@@ -37,11 +37,11 @@
 			<a href="http://github.com/mrdoob/three.js" target="_blank">three.js</a> - webgl ribbons example
 		</div>
 		
-		<script type="text/javascript" src="../build/ThreeExtrasRibbon.js"></script>		
+		<script type="text/javascript" src="../build/ThreeExtras.js"></script>
 		<script type="text/javascript" src="js/Stats.js"></script>
 
 		<script type="text/javascript">
-		
+
 			if ( ! THREE.Detector.webgl ) THREE.Detector.addGetWebGLMessage();
 
 			var container, stats;
@@ -53,15 +53,15 @@
 			var windowHalfX = window.innerWidth / 2;
 			var windowHalfY = window.innerHeight / 2;
 
-			var postprocessing = {			
+			var postprocessing = {
 				
 				enabled  : true
 				
 			};
 
 			init();
-			setInterval( loop, 1000 / 60 );
-
+			loop();
+			
 			function init() {
 
 				container = document.createElement( 'div' );
@@ -257,7 +257,9 @@
 			}			
 
 			function loop() {
-
+				
+				THREE.requestAnimationFrame( renderer.domElement, loop );
+				
 				var time = new Date().getTime() * 0.00005;
 				
 				camera.position.x += ( mouseX - camera.position.x ) * 0.036;
@@ -286,8 +288,6 @@
 					
 				}
 
-				//renderer.render( scene, camera );
-
 				if ( postprocessing.enabled ) {
 				
 					renderer.clear();
@@ -334,6 +334,7 @@
 				}
 
 				stats.update();
+				
 			}
 
 

src/extras/MiscUtils.js

@@ -0,0 +1,76 @@
+/**
+ * @author greggman / http://greggman.com/
+ */
+ 
+THREE.requestAnimationFrame = function( element, callback ) {
+
+	if ( ! THREE.requestAnimationFrameImpl_ ) {
+	
+		THREE.requestAnimationFrameImpl_ = function() {
+	  
+			var objects = [ element, window ];
+			
+			var functionNames = [
+				"requestAnimationFrame",
+				"webkitRequestAnimationFrame",
+				"mozRequestAnimationFrame",
+				"operaRequestAnimationFrame",
+				"requestAnimationFrame"
+			];
+	  
+			var functions = [
+			
+				function ( name ) {
+				
+					return function( element, callback ) {
+						
+								element[ name ].call( element, callback );
+						
+							};
+
+				},
+				
+			
+				function ( name ) {
+			  
+					return function( element, callback ) {
+						
+						window[ name ].call( window, callback );
+
+					};
+
+				}
+
+			];
+		  
+			for ( var ii = 0; ii < objects.length; ++ii ) {
+			
+				var obj = objects[ ii ];
+				for ( var jj = 0; jj < functionNames.length; ++jj ) {
+				
+					var functionName = functionNames[ jj ];
+					if ( obj[ functionName ] ) {
+				
+						console.log( "using ", functionName );
+						return functions[ ii ]( functionName );
+
+					}
+					
+				}
+
+			}
+			
+			console.log( "using window.setTimeout" );
+			
+			return function( element, callback ) {
+			
+			   window.setTimeout(callback, 1000 / 70);
+			   
+			};
+		
+		}();
+	}
+
+	THREE.requestAnimationFrameImpl_( element, callback );
+
+};

utils/build.py

@@ -82,6 +82,7 @@ EXTRAS_FILES = [
 'extras/Detector.js',
 'extras/GeometryUtils.js',
 'extras/ImageUtils.js',
+'extras/MiscUtils.js',
 'extras/SceneUtils.js',
 'extras/ShaderUtils.js',
 'extras/primitives/Cube.js',