Browse Source

Renamed THREE.Supports to THREE.Detector, moved it to extras. Also cleaned up example title tags.

alteredq 14 năm trước cách đây
mục cha
commit
082da28c8e
44 tập tin đã thay đổi với 358 bổ sung156 xóa
  1. 0 2
      build/Three.js
  2. 0 2
      build/ThreeDebug.js
  3. 2 2
      build/ThreeExtras.js
  4. 2 3
      examples/geometry_colors.html
  5. 2 2
      examples/geometry_dynamic_gl.html
  6. 2 2
      examples/geometry_large_mesh.html
  7. 16 1
      examples/geometry_minecraft.html
  8. 9 2
      examples/geometry_minecraft_ao.html
  9. 5 4
      examples/geometry_terrain_fog_gl.html
  10. 5 4
      examples/geometry_terrain_gl.html
  11. 4 3
      examples/geometry_terrain_gl2.html
  12. 3 3
      examples/hdr.html
  13. 2 1
      examples/interactive_voxelpainter_gl.html
  14. 4 3
      examples/lights_pointlights_gl.html
  15. 2 1
      examples/lights_test.html
  16. 1 1
      examples/lines_colors_gl.html
  17. 2 2
      examples/lines_cubes_gl.html
  18. 2 2
      examples/lines_sphere_gl.html
  19. 2 3
      examples/materials_cars.html
  20. 244 0
      examples/materials_cars_camaro.html
  21. 3 4
      examples/materials_cubemap.html
  22. 2 3
      examples/materials_cubemap_balls_reflection.html
  23. 3 4
      examples/materials_cubemap_balls_refraction.html
  24. 3 4
      examples/materials_cubemap_escher.html
  25. 2 3
      examples/materials_cubemap_refraction.html
  26. 3 2
      examples/materials_gl.html
  27. 4 2
      examples/materials_grass.html
  28. 2 2
      examples/materials_multimaterials.html
  29. 2 2
      examples/materials_normalmap.html
  30. 2 2
      examples/materials_normalmap2.html
  31. 4 4
      examples/materials_shaders.html
  32. 2 2
      examples/materials_shaders_fresnel.html
  33. 2 2
      examples/obj_convert_test.html
  34. 1 1
      examples/particles_billboards_colors_gl.html
  35. 1 1
      examples/particles_billboards_gl.html
  36. 2 2
      examples/particles_random_gl.html
  37. 1 1
      examples/particles_sprites_gl.html
  38. 1 1
      examples/postprocessing.html
  39. 1 1
      examples/render_to_texture.html
  40. 2 2
      examples/scene_test.html
  41. 3 2
      examples/shader.html
  42. 2 3
      examples/shader2.html
  43. 0 62
      src/core/Supports.js
  44. 1 1
      utils/build.py

+ 0 - 2
build/Three.js

@@ -57,8 +57,6 @@ z:[this.vertices[0].position.z,this.vertices[0].position.z]};for(var c=1,e=this.
 this.boundingBox.z[1])this.boundingBox.z[1]=a.position.z}}},computeBoundingSphere:function(){for(var a=this.boundingSphere===null?0:this.boundingSphere.radius,c=0,e=this.vertices.length;c<e;c++)a=Math.max(a,this.vertices[c].position.length());this.boundingSphere={radius:a}},sortFacesByMaterial:function(){function a(r){var A=[];c=0;for(e=r.length;c<e;c++)r[c]==undefined?A.push("undefined"):A.push(r[c].toString());return A.join("_")}var c,e,g,i,j,b,s,m,p={};g=0;for(i=this.faces.length;g<i;g++){j=this.faces[g];
 b=j.materials;s=a(b);if(p[s]==undefined)p[s]={hash:s,counter:0};m=p[s].hash+"_"+p[s].counter;if(this.geometryChunks[m]==undefined)this.geometryChunks[m]={faces:[],materials:b,vertices:0};j=j instanceof THREE.Face3?3:4;if(this.geometryChunks[m].vertices+j>65535){p[s].counter+=1;m=p[s].hash+"_"+p[s].counter;if(this.geometryChunks[m]==undefined)this.geometryChunks[m]={faces:[],materials:b,vertices:0}}this.geometryChunks[m].faces.push(g);this.geometryChunks[m].vertices+=j}},toString:function(){return"THREE.Geometry ( vertices: "+
 this.vertices+", faces: "+this.faces+", uvs: "+this.uvs+" )"}};
-THREE.Supports={canvas:!!document.createElement("canvas").getContext,webgl:window.Uint8Array!=undefined,workers:!!window.Worker,addGetWebGLMessage:function(a){var c=document.body,e="oldie";if(a){if(a.parent!==undefined)c=a.parent;if(a.id!==undefined)e=a.id}a=document.createElement("center");var g=document.createElement("div");g.innerHTML='Sorry, your browser doesn\'t support <a href="http://khronos.org/webgl/wiki/Getting_a_WebGL_Implementation">WebGL</a><br/>\n<br/>\nPlease try in\n<a href="http://www.chromium.org/getting-involved/dev-channel">Chrome 9+</a> /\n<a href="http://www.mozilla.com/en-US/firefox/all-beta.html">Firefox 4+</a> /\n<a href="http://nightly.webkit.org/">Safari OSX 10.6+</a>';g.id=
-e;e=g.style;e.fontFamily="monospace";e.fontSize="13px";e.textAlign="center";e.background="#eee";e.color="#000";e.padding="1em";e.width="475px";e.margin="5em auto 0";a.appendChild(g);c.appendChild(a);return g}};
 THREE.Camera=function(a,c,e,g){this.fov=a;this.aspect=c;this.near=e;this.far=g;this.position=new THREE.Vector3;this.target={position:new THREE.Vector3};this.autoUpdateMatrix=true;this.projectionMatrix=null;this.matrix=new THREE.Matrix4;this.up=new THREE.Vector3(0,1,0);this.tmpVec=new THREE.Vector3;this.translateX=function(i){this.tmpVec.sub(this.target.position,this.position).normalize().multiplyScalar(i);this.tmpVec.crossSelf(this.up);this.position.addSelf(this.tmpVec);this.target.position.addSelf(this.tmpVec)};
 this.translateZ=function(i){this.tmpVec.sub(this.target.position,this.position).normalize().multiplyScalar(i);this.position.subSelf(this.tmpVec);this.target.position.subSelf(this.tmpVec)};this.updateMatrix=function(){this.matrix.lookAt(this.position,this.target.position,this.up)};this.updateProjectionMatrix=function(){this.projectionMatrix=THREE.Matrix4.makePerspective(this.fov,this.aspect,this.near,this.far)};this.updateProjectionMatrix()};
 THREE.Camera.prototype={toString:function(){return"THREE.Camera ( "+this.position+", "+this.target.position+" )"}};THREE.Light=function(a){this.color=new THREE.Color(a)};THREE.AmbientLight=function(a){THREE.Light.call(this,a)};THREE.AmbientLight.prototype=new THREE.Light;THREE.AmbientLight.prototype.constructor=THREE.AmbientLight;THREE.DirectionalLight=function(a,c){THREE.Light.call(this,a);this.position=new THREE.Vector3(0,1,0);this.intensity=c||1};THREE.DirectionalLight.prototype=new THREE.Light;

+ 0 - 2
build/ThreeDebug.js

@@ -57,8 +57,6 @@ z:[this.vertices[0].position.z,this.vertices[0].position.z]};for(var c=1,e=this.
 this.boundingBox.z[1])this.boundingBox.z[1]=a.position.z}}},computeBoundingSphere:function(){for(var a=this.boundingSphere===null?0:this.boundingSphere.radius,c=0,e=this.vertices.length;c<e;c++)a=Math.max(a,this.vertices[c].position.length());this.boundingSphere={radius:a}},sortFacesByMaterial:function(){function a(r){var A=[];c=0;for(e=r.length;c<e;c++)r[c]==undefined?A.push("undefined"):A.push(r[c].toString());return A.join("_")}var c,e,g,i,j,b,s,n,l={};g=0;for(i=this.faces.length;g<i;g++){j=this.faces[g];
 b=j.materials;s=a(b);if(l[s]==undefined)l[s]={hash:s,counter:0};n=l[s].hash+"_"+l[s].counter;if(this.geometryChunks[n]==undefined)this.geometryChunks[n]={faces:[],materials:b,vertices:0};j=j instanceof THREE.Face3?3:4;if(this.geometryChunks[n].vertices+j>65535){l[s].counter+=1;n=l[s].hash+"_"+l[s].counter;if(this.geometryChunks[n]==undefined)this.geometryChunks[n]={faces:[],materials:b,vertices:0}}this.geometryChunks[n].faces.push(g);this.geometryChunks[n].vertices+=j}},toString:function(){return"THREE.Geometry ( vertices: "+
 this.vertices+", faces: "+this.faces+", uvs: "+this.uvs+" )"}};
-THREE.Supports={canvas:!!document.createElement("canvas").getContext,webgl:window.Uint8Array!=undefined,workers:!!window.Worker,addGetWebGLMessage:function(a){var c=document.body,e="oldie";if(a){if(a.parent!==undefined)c=a.parent;if(a.id!==undefined)e=a.id}a=document.createElement("center");var g=document.createElement("div");g.innerHTML='Sorry, your browser doesn\'t support <a href="http://khronos.org/webgl/wiki/Getting_a_WebGL_Implementation">WebGL</a><br/>\n<br/>\nPlease try in\n<a href="http://www.chromium.org/getting-involved/dev-channel">Chrome 9+</a> /\n<a href="http://www.mozilla.com/en-US/firefox/all-beta.html">Firefox 4+</a> /\n<a href="http://nightly.webkit.org/">Safari OSX 10.6+</a>';g.id=
-e;e=g.style;e.fontFamily="monospace";e.fontSize="13px";e.textAlign="center";e.background="#eee";e.color="#000";e.padding="1em";e.width="475px";e.margin="5em auto 0";a.appendChild(g);c.appendChild(a);return g}};
 THREE.Camera=function(a,c,e,g){this.fov=a;this.aspect=c;this.near=e;this.far=g;this.position=new THREE.Vector3;this.target={position:new THREE.Vector3};this.autoUpdateMatrix=true;this.projectionMatrix=null;this.matrix=new THREE.Matrix4;this.up=new THREE.Vector3(0,1,0);this.tmpVec=new THREE.Vector3;this.translateX=function(i){this.tmpVec.sub(this.target.position,this.position).normalize().multiplyScalar(i);this.tmpVec.crossSelf(this.up);this.position.addSelf(this.tmpVec);this.target.position.addSelf(this.tmpVec)};
 this.translateZ=function(i){this.tmpVec.sub(this.target.position,this.position).normalize().multiplyScalar(i);this.position.subSelf(this.tmpVec);this.target.position.subSelf(this.tmpVec)};this.updateMatrix=function(){this.matrix.lookAt(this.position,this.target.position,this.up)};this.updateProjectionMatrix=function(){this.projectionMatrix=THREE.Matrix4.makePerspective(this.fov,this.aspect,this.near,this.far)};this.updateProjectionMatrix()};
 THREE.Camera.prototype={toString:function(){return"THREE.Camera ( "+this.position+", "+this.target.position+" )"}};THREE.Light=function(a){this.color=new THREE.Color(a)};THREE.AmbientLight=function(a){THREE.Light.call(this,a)};THREE.AmbientLight.prototype=new THREE.Light;THREE.AmbientLight.prototype.constructor=THREE.AmbientLight;THREE.DirectionalLight=function(a,c){THREE.Light.call(this,a);this.position=new THREE.Vector3(0,1,0);this.intensity=c||1};THREE.DirectionalLight.prototype=new THREE.Light;

+ 2 - 2
build/ThreeExtras.js

@@ -57,8 +57,6 @@ z:[this.vertices[0].position.z,this.vertices[0].position.z]};for(var c=1,d=this.
 this.boundingBox.z[1])this.boundingBox.z[1]=a.position.z}}},computeBoundingSphere:function(){for(var a=this.boundingSphere===null?0:this.boundingSphere.radius,c=0,d=this.vertices.length;c<d;c++)a=Math.max(a,this.vertices[c].position.length());this.boundingSphere={radius:a}},sortFacesByMaterial:function(){function a(o){var y=[];c=0;for(d=o.length;c<d;c++)o[c]==undefined?y.push("undefined"):y.push(o[c].toString());return y.join("_")}var c,d,e,j,g,b,m,k,n={};e=0;for(j=this.faces.length;e<j;e++){g=this.faces[e];
 b=g.materials;m=a(b);if(n[m]==undefined)n[m]={hash:m,counter:0};k=n[m].hash+"_"+n[m].counter;if(this.geometryChunks[k]==undefined)this.geometryChunks[k]={faces:[],materials:b,vertices:0};g=g instanceof THREE.Face3?3:4;if(this.geometryChunks[k].vertices+g>65535){n[m].counter+=1;k=n[m].hash+"_"+n[m].counter;if(this.geometryChunks[k]==undefined)this.geometryChunks[k]={faces:[],materials:b,vertices:0}}this.geometryChunks[k].faces.push(e);this.geometryChunks[k].vertices+=g}},toString:function(){return"THREE.Geometry ( vertices: "+
 this.vertices+", faces: "+this.faces+", uvs: "+this.uvs+" )"}};
-THREE.Supports={canvas:!!document.createElement("canvas").getContext,webgl:window.Uint8Array!=undefined,workers:!!window.Worker,addGetWebGLMessage:function(a){var c=document.body,d="oldie";if(a){if(a.parent!==undefined)c=a.parent;if(a.id!==undefined)d=a.id}a=document.createElement("center");var e=document.createElement("div");e.innerHTML='Sorry, your browser doesn\'t support <a href="http://khronos.org/webgl/wiki/Getting_a_WebGL_Implementation">WebGL</a><br/>\n<br/>\nPlease try in\n<a href="http://www.chromium.org/getting-involved/dev-channel">Chrome 9+</a> /\n<a href="http://www.mozilla.com/en-US/firefox/all-beta.html">Firefox 4+</a> /\n<a href="http://nightly.webkit.org/">Safari OSX 10.6+</a>';e.id=
-d;d=e.style;d.fontFamily="monospace";d.fontSize="13px";d.textAlign="center";d.background="#eee";d.color="#000";d.padding="1em";d.width="475px";d.margin="5em auto 0";a.appendChild(e);c.appendChild(a);return e}};
 THREE.Camera=function(a,c,d,e){this.fov=a;this.aspect=c;this.near=d;this.far=e;this.position=new THREE.Vector3;this.target={position:new THREE.Vector3};this.autoUpdateMatrix=true;this.projectionMatrix=null;this.matrix=new THREE.Matrix4;this.up=new THREE.Vector3(0,1,0);this.tmpVec=new THREE.Vector3;this.translateX=function(j){this.tmpVec.sub(this.target.position,this.position).normalize().multiplyScalar(j);this.tmpVec.crossSelf(this.up);this.position.addSelf(this.tmpVec);this.target.position.addSelf(this.tmpVec)};
 this.translateZ=function(j){this.tmpVec.sub(this.target.position,this.position).normalize().multiplyScalar(j);this.position.subSelf(this.tmpVec);this.target.position.subSelf(this.tmpVec)};this.updateMatrix=function(){this.matrix.lookAt(this.position,this.target.position,this.up)};this.updateProjectionMatrix=function(){this.projectionMatrix=THREE.Matrix4.makePerspective(this.fov,this.aspect,this.near,this.far)};this.updateProjectionMatrix()};
 THREE.Camera.prototype={toString:function(){return"THREE.Camera ( "+this.position+", "+this.target.position+" )"}};THREE.Light=function(a){this.color=new THREE.Color(a)};THREE.AmbientLight=function(a){THREE.Light.call(this,a)};THREE.AmbientLight.prototype=new THREE.Light;THREE.AmbientLight.prototype.constructor=THREE.AmbientLight;THREE.DirectionalLight=function(a,c){THREE.Light.call(this,a);this.position=new THREE.Vector3(0,1,0);this.intensity=c||1};THREE.DirectionalLight.prototype=new THREE.Light;
@@ -230,6 +228,8 @@ THREE.Snippets.lights_pars_vertex,THREE.Snippets.color_pars_vertex,"void main()
 "void main() {",THREE.Snippets.color_vertex,"vec4 mvPosition = modelViewMatrix * vec4( position, 1.0 );\ngl_Position = projectionMatrix * mvPosition;\ngl_PointSize = size;\n}"].join("\n")}};THREE.RenderableObject=function(){this.z=this.object=null};
 THREE.RenderableFace3=function(){this.z=null;this.v1=new THREE.Vertex;this.v2=new THREE.Vertex;this.v3=new THREE.Vertex;this.centroidWorld=new THREE.Vector3;this.centroidScreen=new THREE.Vector3;this.normalWorld=new THREE.Vector3;this.vertexNormalsWorld=[];this.faceMaterials=this.meshMaterials=null;this.overdraw=false;this.uvs=[null,null,null]};THREE.RenderableParticle=function(){this.rotation=this.z=this.y=this.x=null;this.scale=new THREE.Vector2;this.materials=null};
 THREE.RenderableLine=function(){this.z=null;this.v1=new THREE.Vertex;this.v2=new THREE.Vertex;this.materials=null};
+THREE.Detector={canvas:!!document.createElement("canvas").getContext,webgl:window.Uint8Array!=undefined,workers:!!window.Worker,addGetWebGLMessage:function(a){var c=document.body,d="oldie";if(a){if(a.parent!==undefined)c=a.parent;if(a.id!==undefined)d=a.id}a=document.createElement("center");var e=document.createElement("div");e.innerHTML='Sorry, your browser doesn\'t support <a href="http://khronos.org/webgl/wiki/Getting_a_WebGL_Implementation">WebGL</a><br/>\n<br/>\nPlease try in\n<a href="http://www.google.com/chrome">Chrome 9+</a> /\n<a href="http://www.mozilla.com/en-US/firefox/all-beta.html">Firefox 4+</a> /\n<a href="http://nightly.webkit.org/">Safari OSX 10.6+</a>';e.id=
+d;d=e.style;d.fontFamily="monospace";d.fontSize="13px";d.textAlign="center";d.background="#eee";d.color="#000";d.padding="1em";d.width="475px";d.margin="5em auto 0";a.appendChild(e);c.appendChild(a);return e}};
 var GeometryUtils={merge:function(a,c){var d=c instanceof THREE.Mesh,e=a.vertices.length,j=d?c.geometry:c,g=a.vertices,b=j.vertices,m=a.faces,k=j.faces,n=a.uvs;j=j.uvs;d&&c.autoUpdateMatrix&&c.updateMatrix();for(var o=0,y=b.length;o<y;o++){var v=new THREE.Vertex(b[o].position.clone());d&&c.matrix.multiplyVector3(v.position);g.push(v)}o=0;for(y=k.length;o<y;o++){b=k[o];var q,z=b.vertexNormals;if(b instanceof THREE.Face3)q=new THREE.Face3(b.a+e,b.b+e,b.c+e);else if(b instanceof THREE.Face4)q=new THREE.Face4(b.a+
 e,b.b+e,b.c+e,b.d+e);q.centroid.copy(b.centroid);q.normal.copy(b.normal);d=0;for(g=z.length;d<g;d++){v=z[d];q.vertexNormals.push(v.clone())}q.materials=b.materials.slice();m.push(q)}o=0;for(y=j.length;o<y;o++){e=j[o];m=[];d=0;for(g=e.length;d<g;d++)m.push(new THREE.UV(e[d].u,e[d].v));n.push(m)}}},ImageUtils={loadTexture:function(a,c,d){var e=new Image;e.onload=function(){this.loaded=true;d&&d(this)};e.src=a;return new THREE.Texture(e,c)},loadArray:function(a,c){var d,e,j=[];d=j.loadCount=0;for(e=
 a.length;d<e;++d){j[d]=new Image;j[d].loaded=0;j[d].onload=function(){j.loadCount+=1;this.loaded=true;c&&c(this)};j[d].src=a[d]}return j}},SceneUtils={loadScene:function(a,c,d,e){a=new Worker(a);a.postMessage(0);a.onmessage=function(j){function g(){for(o in x.objects)if(!D.objects[o]){B=x.objects[o];if(h=D.geometries[B.geometry]){w=[];for(i=0;i<B.materials.length;i++)w[i]=D.materials[B.materials[i]];H=B.position;r=B.rotation;s=B.scale;object=new THREE.Mesh(h,w);object.position.set(H[0],H[1],H[2]);

+ 2 - 3
examples/geometry_colors.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - geometry - vertex colors</title>
+		<title>three.js - geometry - vertex colors - webgl</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -34,12 +34,11 @@
 		<div id="info"><a href="http://github.com/mrdoob/three.js" target="_blank">three.js</a> - vertex colors - webgl</div>
 
 		<script type="text/javascript" src="js/Stats.js"></script>
-
 		<script type="text/javascript" src="../build/ThreeExtras.js"></script>
 
 		<script type="text/javascript">
 
-			if ( ! THREE.Supports.webgl ) THREE.Supports.addGetWebGLMessage();
+			if ( ! THREE.Detector.webgl ) THREE.Detector.addGetWebGLMessage();
 
 			var container, stats;
 

+ 2 - 2
examples/geometry_dynamic_gl.html

@@ -44,9 +44,9 @@
 
 		<script type="text/javascript">
 
-			if ( ! THREE.Supports.webgl ) {
+			if ( ! THREE.Detector.webgl ) {
 			
-				THREE.Supports.addGetWebGLMessage();
+				THREE.Detector.addGetWebGLMessage();
 				document.getElementById( 'container' ).innerHTML = "";
 				
 			}

+ 2 - 2
examples/geometry_large_mesh.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - Large mesh test</title>
+		<title>three.js - geometry - large mesh - webgl</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -48,7 +48,7 @@
 
 		<script type="text/javascript" src="../src/extras/io/Loader.js"></script>
 		<script type="text/javascript" src="../src/extras/primitives/Sphere.js"></script>
-
+		
 		<script type="text/javascript" src="js/Stats.js"></script>
 
 		<script type="text/javascript">

+ 16 - 1
examples/geometry_minecraft.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - geometry - minecraft</title>
+		<title>three.js - geometry - minecraft - webgl</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -26,6 +26,13 @@
 				color: #a06851;
 			}
 
+			#oldie {
+				background:rgb(100,0,0) !important;
+				color:#fff !important;
+				margin-top:10em !important;
+			}
+			#oldie a { color:#fff }
+
 		</style>
 	</head>
 	<body>
@@ -39,9 +46,17 @@
 		<script type="text/javascript" src="../build/Three.js"></script>
 		<script type="text/javascript" src="../src/extras/GeometryUtils.js"></script>
 		<script type="text/javascript" src="../src/extras/primitives/Cube.js"></script>
+		<script type="text/javascript" src="../src/extras/Detector.js"></script>
 
 		<script type="text/javascript">
 
+			if ( ! THREE.Detector.webgl ) {
+				
+				THREE.Detector.addGetWebGLMessage();
+				document.getElementById( 'container' ).innerHTML = "";
+				
+			}
+
 			var container, stats;
 
 			var camera, scene, renderer;

+ 9 - 2
examples/geometry_minecraft_ao.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - geometry - minecraft - ao</title>
+		<title>three.js - geometry - minecraft - ao - webgl</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -27,6 +27,7 @@
 			#oldie {
 				background:rgb(100,0,0) !important;
 				color:#fff !important;
+				margin-top:10em !important;
 			}
 			#oldie a { color:#fff }
 
@@ -52,10 +53,16 @@
 		<script type="text/javascript" src="../build/Three.js"></script>
 		<script type="text/javascript" src="../src/extras/GeometryUtils.js"></script>
 		<script type="text/javascript" src="../src/extras/primitives/Cube.js"></script>
+		<script type="text/javascript" src="../src/extras/Detector.js"></script>
 
 		<script type="text/javascript">
 
-			if ( ! THREE.Supports.webgl ) THREE.Supports.addGetWebGLMessage();
+			if ( ! THREE.Detector.webgl ) {
+				
+				THREE.Detector.addGetWebGLMessage();
+				document.getElementById( 'container' ).innerHTML = "";
+				
+			}
 
 			var fogExp2 = true;
 			

+ 5 - 4
examples/geometry_terrain_fog_gl.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - geometry - webgl terrain + fog</title>
+		<title>three.js - geometry - terrain + fog - webgl</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -39,12 +39,13 @@
 		<script type="text/javascript" src="../build/Three.js"></script>
 		<script type="text/javascript" src="../src/extras/GeometryUtils.js"></script>
 		<script type="text/javascript" src="../src/extras/primitives/Plane.js"></script>
-
+		<script type="text/javascript" src="../src/extras/Detector.js"></script>
+		
 		<script type="text/javascript">
 
-			if ( ! THREE.Supports.webgl ) {
+			if ( ! THREE.Detector.webgl ) {
 				
-				THREE.Supports.addGetWebGLMessage();
+				THREE.Detector.addGetWebGLMessage();
 				document.getElementById( 'container' ).innerHTML = "";
 				
 			}

+ 5 - 4
examples/geometry_terrain_gl.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - geometry - webgl terrain</title>
+		<title>three.js - geometry - terrain - webgl</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -38,12 +38,13 @@
 
 		<script type="text/javascript" src="../build/Three.js"></script>
 		<script type="text/javascript" src="../src/extras/primitives/Plane.js"></script>
-
+		<script type="text/javascript" src="../src/extras/Detector.js"></script>
+		
 		<script type="text/javascript">
 
-			if ( ! THREE.Supports.webgl ) {
+			if ( ! THREE.Detector.webgl ) {
 				
-				THREE.Supports.addGetWebGLMessage();
+				THREE.Detector.addGetWebGLMessage();
 				document.getElementById( 'container' ).innerHTML = "";
 				
 			}

+ 4 - 3
examples/geometry_terrain_gl2.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - geometry - webgl terrain 2</title>
+		<title>three.js - geometry - terrain 2 - webgl</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -39,12 +39,13 @@
 
 		<script type="text/javascript" src="../build/Three.js"></script>
 		<script type="text/javascript" src="../src/extras/primitives/Plane.js"></script>
+		<script type="text/javascript" src="../src/extras/Detector.js"></script>
 
 		<script type="text/javascript">
 
-			if ( ! THREE.Supports.webgl ) {
+			if ( ! THREE.Detector.webgl ) {
 				
-				THREE.Supports.addGetWebGLMessage();
+				THREE.Detector.addGetWebGLMessage();
 				document.getElementById( 'container' ).innerHTML = "";
 				
 			}

+ 3 - 3
examples/hdr.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
     <head>
-        <title>three.js - HDR texture - webgl</title>
+        <title>three.js - materials - HDR texture - webgl</title>
         <meta charset="utf-8">
         <style type="text/css">
             body {
@@ -36,8 +36,8 @@
 			based on <a href="http://spidergl.org/example.php?id=13" target="_blank">SpiderGL</a>
 		</div>
 
-        <script type="text/javascript" src="js/Stats.js"></script>
         <script type="text/javascript" src="../build/ThreeExtras.js"></script>
+        <script type="text/javascript" src="js/Stats.js"></script>
 
 		
 		<!-- HDR fragment shader -->
@@ -93,7 +93,7 @@
 
         <script type="text/javascript">
 
-			if ( ! THREE.Supports.webgl ) THREE.Supports.addGetWebGLMessage();
+			if ( ! THREE.Detector.webgl ) THREE.Detector.addGetWebGLMessage();
 
             var container, stats;
 

+ 2 - 1
examples/interactive_voxelpainter_gl.html

@@ -21,12 +21,13 @@
 		<script type="text/javascript" src="../src/extras/primitives/Cube.js"></script>
 		<script type="text/javascript" src="../src/extras/primitives/Plane.js"></script>
 		<script type="text/javascript" src="../src/extras/ImageUtils.js"></script>
+		<script type="text/javascript" src="../src/extras/Detector.js"></script>
 
 		<script type="text/javascript" src="js/Stats.js"></script>
 
 		<script type="text/javascript">
 
-			if ( ! THREE.Supports.webgl ) THREE.Supports.addGetWebGLMessage();
+			if ( ! THREE.Detector.webgl ) THREE.Detector.addGetWebGLMessage();
 			
 			var container, stats;
 			var camera, scene, renderer;

+ 4 - 3
examples/lights_pointlights_gl.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - point light WebGL</title>
+		<title>three.js - lights - point lights - webgl</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -45,13 +45,14 @@
 		<script type="text/javascript" src="../build/Three.js"></script> 
 
 		<script type="text/javascript" src="../src/extras/io/Loader.js"></script>
-		<script type="text/javascript" src="../src/extras/primitives/Sphere.js"></script> 
+		<script type="text/javascript" src="../src/extras/primitives/Sphere.js"></script>
+		<script type="text/javascript" src="../src/extras/Detector.js"></script>
 
 		<script type="text/javascript" src="js/Stats.js"></script>
 
 		<script type="text/javascript">
 
-			if ( ! THREE.Supports.webgl ) THREE.Supports.addGetWebGLMessage();
+			if ( ! THREE.Detector.webgl ) THREE.Detector.addGetWebGLMessage();
 			
 			var camera, scene, renderer,
 			particle1, particle2, particle2,

+ 2 - 1
examples/lights_test.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - lights test</title>
+		<title>three.js - lights - point + directional - webgl</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 
@@ -42,6 +42,7 @@
 
 		<script type="text/javascript" src="../src/extras/io/Loader.js"></script>
 		<script type="text/javascript" src="../src/extras/primitives/Sphere.js"></script>
+		<script type="text/javascript" src="../src/extras/Detector.js"></script>
 
 		<script type="text/javascript" src="js/Stats.js"></script>
 

+ 1 - 1
examples/lines_colors_gl.html

@@ -48,7 +48,7 @@
 
 		<script type="text/javascript">
 		
-			if ( ! THREE.Supports.webgl ) THREE.Supports.addGetWebGLMessage();
+			if ( ! THREE.Detector.webgl ) THREE.Detector.addGetWebGLMessage();
 
 			var mouseX = 0, mouseY = 0,
 

+ 2 - 2
examples/lines_cubes_gl.html

@@ -43,12 +43,12 @@
 			[<a href="http://en.wikipedia.org/wiki/Hilbert_curve">Hilbert curve</a> thanks to <a href="http://www.openprocessing.org/visuals/?visualID=15599">Thomas Diewald</a>]
 		</div>
 
-		<script type="text/javascript" src="../build/Three.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.Supports.webgl ) THREE.Supports.addGetWebGLMessage();
+			if ( ! THREE.Detector.webgl ) THREE.Detector.addGetWebGLMessage();
 
 			var mouseX = 0, mouseY = 0,
 

+ 2 - 2
examples/lines_sphere_gl.html

@@ -42,12 +42,12 @@
 			<a href="http://github.com/mrdoob/three.js" target="_blank">three.js</a> - lines WebGL demo
 		</div>
 
-		<script type="text/javascript" src="../build/Three.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.Supports.webgl ) THREE.Supports.addGetWebGLMessage();
+			if ( ! THREE.Detector.webgl ) THREE.Detector.addGetWebGLMessage();
 
 			var SCREEN_WIDTH = window.innerWidth,
 				SCREEN_HEIGHT = window.innerHeight,

+ 2 - 3
examples/materials_cars.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - webgl reflection [cars]</title>
+		<title>three.js - materials - cube reflection [cars] - webgl</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -57,12 +57,11 @@
 		<div id="log"></div>
 
 		<script type="text/javascript" src="../build/ThreeExtras.js"></script>
-
 		<script type="text/javascript" src="js/Stats.js"></script>
 
 		<script type="text/javascript">
 
-			if ( ! THREE.Supports.webgl ) THREE.Supports.addGetWebGLMessage();
+			if ( ! THREE.Detector.webgl ) THREE.Detector.addGetWebGLMessage();
 			
 			var STATS_ENABLED = false;
 

+ 244 - 0
examples/materials_cars_camaro.html

@@ -0,0 +1,244 @@
+<!DOCTYPE HTML>
+<html lang="en">
+	<head>
+		<title>three.js - materials - cube reflection [camaro] - webgl</title>
+		<meta charset="utf-8">
+		<style type="text/css">
+			body {
+				background:#000;
+				color:#fff;
+				padding:0;
+				margin:0;
+				overflow:hidden;
+				font-family:georgia;
+				text-align:center;
+			}
+			h1 { }
+			a { color:skyblue }
+			canvas { pointer-events:none; z-index:10; position:relative; }
+			#log { position:absolute; top:50px; text-align:left; display:block; z-index:100 }
+			#d { text-align:center; margin:1em 0 -2.5em 0; z-index:0; position:relative; display:block }
+			#buttons { margin:0.5em 0 0 0 }
+			button { font-family:georgia; border:0; background:#222; color:#fff; padding:0.2em 0.5em; cursor:pointer; border-radius:3px }
+			button:hover { background:#333 }
+		</style>
+	</head>
+	
+	<body>
+		<div id="d">
+			<div id="info"><a href="http://github.com/mrdoob/three.js" target="_blank">three.js</a> - webgl cube reflection demo. chevrolet camaro by <a href="http://www.turbosquid.com/3d-models/blender-camaro/411348" target="_blank">dskfnwn</a></div>
+			
+			<div id="buttons"></div>
+		</div>
+		
+		<div id="log"></div>
+
+		<script type="text/javascript" src="../build/Three.js"></script> 
+
+		<script type="text/javascript" src="../src/extras/primitives/Sphere.js"></script>
+		<script type="text/javascript" src="../src/extras/ImageUtils.js"></script>
+		<script type="text/javascript" src="../src/extras/SceneUtils.js"></script>
+		<script type="text/javascript" src="../src/extras/io/Loader.js"></script>
+		<script type="text/javascript" src="../src/extras/Detector.js"></script>
+
+		<script type="text/javascript" src="js/Stats.js"></script>
+
+		<script type="text/javascript">
+
+			if ( ! THREE.Detector.webgl ) THREE.Detector.addGetWebGLMessage();
+			
+			var SCREEN_WIDTH = window.innerWidth;
+			var SCREEN_HEIGHT = window.innerHeight;
+
+			var container;
+			var stats;
+
+			var camera;
+			var scene;
+			var webglRenderer;
+
+			var lightMesh;
+			
+			var directionalLight, pointLight;
+			
+			var mouseX = 0;
+			var mouseY = 0;
+
+			var windowHalfX = window.innerWidth >> 1;
+			var windowHalfY = window.innerHeight >> 1;
+
+			document.addEventListener('mousemove', onDocumentMouseMove, false);
+
+			init();
+			
+			loop();
+						
+			setInterval(loop, 1000/60);
+			
+			function init() {
+
+				container = document.createElement('div');
+				document.body.appendChild(container);
+
+				camera = new THREE.Camera( 70, SCREEN_WIDTH / SCREEN_HEIGHT, 1, 100000 );
+				camera.position.z = 1000;
+				camera.updateMatrix();
+
+				scene = new THREE.Scene();
+				
+				// LIGHTS
+
+				var ambient = new THREE.AmbientLight( 0x555555 );
+				scene.addLight( ambient );
+
+				directionalLight = new THREE.DirectionalLight( 0xffffff );
+				directionalLight.position.x = 1;
+				directionalLight.position.y = 1;
+				directionalLight.position.z = 0.5;
+				directionalLight.position.normalize();
+				scene.addLight( directionalLight );
+
+				pointLight = new THREE.PointLight( 0xffaa00 );
+				pointLight.position.x = 0;
+				pointLight.position.y = 0;
+				pointLight.position.z = 0;
+				scene.addLight( pointLight );
+
+
+				sphere = new Sphere( 100, 16, 8, 1 );
+				lightMesh = new THREE.Mesh( sphere, new THREE.MeshBasicMaterial( { color: 0xffaa00 } ) );
+				lightMesh.scale.x = lightMesh.scale.y = lightMesh.scale.z = 0.05;
+				lightMesh.position = pointLight.position;
+				lightMesh.overdraw = true;
+				lightMesh.updateMatrix();
+				scene.addObject(lightMesh);
+
+
+				webglRenderer = new THREE.WebGLRenderer();
+				webglRenderer.setSize( SCREEN_WIDTH, SCREEN_HEIGHT );
+				webglRenderer.setFaceCulling( 0 );
+				container.appendChild( webglRenderer.domElement );
+
+				stats = new Stats();
+				stats.domElement.style.position = 'absolute';
+				stats.domElement.style.top = '0px';
+				stats.domElement.style.zIndex = 100;
+				container.appendChild( stats.domElement );
+
+				var r = "textures/cube/SwedishRoyalCastle/";
+				var urls = [ r + "px.jpg", r + "nx.jpg", 
+							 r + "py.jpg", r + "ny.jpg", 
+							 r + "pz.jpg", r + "nz.jpg" ];
+
+				var images = ImageUtils.loadArray( urls );
+				var textureCube = new THREE.Texture( images );
+				
+				var camaroMaterials = {
+					
+					body: 		[],
+					chrome: 	new THREE.MeshLambertMaterial( { color: 0xffffff, env_map: textureCube } ),
+					darkchrome: new THREE.MeshLambertMaterial( { color: 0x444444, env_map: textureCube } ),
+					glass:		new THREE.MeshBasicMaterial( { color: 0x223344, env_map: textureCube, opacity: 0.25, combine: THREE.MixOperation, reflectivity: 0.25 } ),
+					tire:       new THREE.MeshLambertMaterial( { color: 0x050505 } ),
+					interior:   new THREE.MeshPhongMaterial( { color: 0x050505, shininess: 20 } ),
+					black:      new THREE.MeshLambertMaterial( { color: 0x000000 } )
+					
+				}
+				
+				camaroMaterials.body.push( [ "Orange", new THREE.MeshLambertMaterial( { color: 0xff6600, env_map: textureCube, combine: THREE.MixOperation, reflectivity: 0.3 } ) ] );
+				camaroMaterials.body.push( [ "Blue", new THREE.MeshLambertMaterial( { color: 0x226699, env_map: textureCube, combine: THREE.MixOperation, reflectivity: 0.3 } ) ] );
+				camaroMaterials.body.push( [ "Red", new THREE.MeshLambertMaterial( { color: 0x660000, env_map: textureCube, combine: THREE.MixOperation, reflectivity: 0.5 } ) ] );
+				camaroMaterials.body.push( [ "Black", new THREE.MeshLambertMaterial( { color: 0x000000, env_map: textureCube, combine: THREE.MixOperation, reflectivity: 0.5 } ) ] );
+				camaroMaterials.body.push( [ "White", new THREE.MeshLambertMaterial( { color: 0xffffff, env_map: textureCube, combine: THREE.MixOperation, reflectivity: 0.5 } ) ] );
+				
+				camaroMaterials.body.push( [ "Carmine", new THREE.MeshPhongMaterial( { color: 0x770000, specular:0xffaaaa, env_map: textureCube, combine: THREE.MultiplyOperation } ) ] );
+				camaroMaterials.body.push( [ "Gold", new THREE.MeshPhongMaterial( { color: 0xaa9944, specular:0xbbaa99, shininess:50, env_map: textureCube, combine: THREE.MultiplyOperation } ) ] );
+				camaroMaterials.body.push( [ "Bronze", new THREE.MeshPhongMaterial( { color: 0x150505, specular:0xee6600, shininess:10, env_map: textureCube, combine: THREE.MixOperation, reflectivity: 0.5 } ) ] );
+				camaroMaterials.body.push( [ "Chrome", new THREE.MeshPhongMaterial( { color: 0xffffff, specular:0xffffff, env_map: textureCube, combine: THREE.MultiplyOperation } ) ] );
+
+				var loader = new THREE.Loader();
+				loader.loadBinary( { model: "obj/camaro/CamaroNoUv_bin.js", callback: function( geometry ) { createScene( geometry, camaroMaterials ) } } );
+				
+			}
+			
+			function $( id ) { return document.getElementById( id ) }
+			
+			
+			function createButtons( materials, geometry ) {
+
+				var i, src = "", parent = $( "buttons" );
+				
+				for( i = 0; i < materials.length; i++ ) {
+				
+					src += '<button id="m' + i + '">' + materials[ i ][ 0 ] + '</button>';
+					
+				}
+				
+				parent.innerHTML = src;
+
+				for( i = 0; i < materials.length; i++ ) {
+				
+					$( "m" + i ).counter = i;
+					$( "m" + i ).addEventListener( 'click', function() { geometry.materials[ 0 ][ 0 ] = materials[ this.counter ][ 1 ] }, false );
+
+				}
+
+			}
+
+			function createScene( geometry, materials ) {
+
+				var s = 75, m = new THREE.MeshFaceMaterial();
+				
+				geometry.materials[ 0 ][ 0 ] = materials.body[ 0 ][ 1 ]; 	// car body
+				geometry.materials[ 1 ][ 0 ] = materials.chrome; 			// wheels chrome
+				geometry.materials[ 2 ][ 0 ] = materials.chrome; 			// grille chrome
+				geometry.materials[ 3 ][ 0 ] = materials.darkchrome; 		// door lines
+				geometry.materials[ 4 ][ 0 ] = materials.glass; 			// windshield
+				geometry.materials[ 5 ][ 0 ] = materials.interior;          // interior
+				geometry.materials[ 6 ][ 0 ] = materials.tire;              // tire
+				geometry.materials[ 7 ][ 0 ] = materials.black;             // tireling
+				geometry.materials[ 8 ][ 0 ] = materials.black;             // behind grille
+				
+				SceneUtils.addMesh( scene, geometry, s, 0, 0, 0, 0.0, 1.0, 0.0, m );
+
+				createButtons( materials.body, geometry );
+
+			}
+
+			
+			function onDocumentMouseMove(event) {
+
+				mouseX = ( event.clientX - windowHalfX );
+				mouseY = ( event.clientY - windowHalfY );
+
+			}
+
+			var r = 0;
+			
+			function loop() {
+
+				camera.position.x += ( mouseX - camera.position.x ) * .05;
+				camera.position.y += ( - mouseY - camera.position.y ) * .05;
+
+				lightMesh.position.x = 1500 * Math.cos( r );
+				lightMesh.position.z = 1500 * Math.sin( r );
+
+				r += 0.01;
+
+				webglRenderer.render( scene, camera );
+
+				stats.update();
+
+			}
+
+			function log(text) {
+			
+				var e = document.getElementById("log");
+				e.innerHTML = text + "<br/>" + e.innerHTML;
+				
+			}
+			
+		</script>
+
+	</body>
+</html>

+ 3 - 4
examples/materials_cubemap.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - webgl cube reflection / refraction [Walt]</title>
+		<title>three.js - materials - cube reflection / refraction [Walt] - webgl</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -36,13 +36,12 @@
 
 		<pre id="log"></pre>
 
-		<script type="text/javascript" src="../build/ThreeExtras.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.Supports.webgl ) THREE.Supports.addGetWebGLMessage();
+			if ( ! THREE.Detector.webgl ) THREE.Detector.addGetWebGLMessage();
 			
 			var container, stats;
 

+ 2 - 3
examples/materials_cubemap_balls_reflection.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - webgl cube reflection [balls]</title>
+		<title>three.js - materials - cube reflection [balls] - webgl</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -35,12 +35,11 @@
 		<div id="info"><a href="http://github.com/mrdoob/three.js" target="_blank">three.js</a> - webgl cube reflection demo. skybox by <a href="http://ict.debevec.org/~debevec/" target="_blank">Paul Debevec</a></div>
 
 		<script type="text/javascript" src="../build/ThreeExtras.js"></script>
-
 		<script type="text/javascript" src="js/Stats.js"></script>
 
 		<script type="text/javascript">
 
-			if ( ! THREE.Supports.webgl ) THREE.Supports.addGetWebGLMessage();
+			if ( ! THREE.Detector.webgl ) THREE.Detector.addGetWebGLMessage();
 			
 			var statsEnabled = false;
 

+ 3 - 4
examples/materials_cubemap_balls_refraction.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - webgl cube refraction [balls]</title>
+		<title>three.js - materials - cube refraction [balls] - webgl</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -34,13 +34,12 @@
 	<body>
 		<div id="info"><a href="http://github.com/mrdoob/three.js" target="_blank">three.js</a> - webgl cube refraction demo. skybox by <a href="http://www.zfight.com/" target="_blank">Jochum Skoglund</a></div>
 
-		<script type="text/javascript" src="../build/ThreeExtras.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.Supports.webgl ) THREE.Supports.addGetWebGLMessage();
+			if ( ! THREE.Detector.webgl ) THREE.Detector.addGetWebGLMessage();
 			
 			var statsEnabled = false;
 

+ 3 - 4
examples/materials_cubemap_escher.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - webgl reflection [Escher]</title>
+		<title>three.js - materials - cube reflection [Escher] - webgl</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -32,13 +32,12 @@
 
 		<pre id="log"></pre>
 
-		<script type="text/javascript" src="../build/ThreeExtras.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.Supports.webgl ) THREE.Supports.addGetWebGLMessage();
+			if ( ! THREE.Detector.webgl ) THREE.Detector.addGetWebGLMessage();
 			
 			var statsEnabled = false;
 

+ 2 - 3
examples/materials_cubemap_refraction.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - webgl cube refraction [Lucy]</title>
+		<title>three.js - materials - cube refraction [Lucy] - webgl</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -36,12 +36,11 @@
 		<pre id="log"></pre>
 
 		<script type="text/javascript" src="../build/ThreeExtras.js"></script> 
-
 		<script type="text/javascript" src="js/Stats.js"></script>
 
 		<script type="text/javascript">
 
-			if ( ! THREE.Supports.webgl ) THREE.Supports.addGetWebGLMessage();
+			if ( ! THREE.Detector.webgl ) THREE.Detector.addGetWebGLMessage();
 			
 			var FLOOR = -250;
 

+ 3 - 2
examples/materials_gl.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - materials WebGL</title>
+		<title>three.js - materials - webgl</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -18,11 +18,12 @@
 		<pre id="log"></pre>
 
 		<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;
 
 			var camera, scene, renderer, objects;

+ 4 - 2
examples/materials_grass.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - grass</title>
+		<title>three.js - materials - grass - webgl</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -19,10 +19,12 @@
 	<body>
 		<script type="text/javascript" src="../build/Three.js"></script>
 		<script type="text/javascript" src="../src/extras/primitives/Plane.js"></script>
-
+		<script type="text/javascript" src="../src/extras/Detector.js"></script>
 
 		<script type="text/javascript">
 
+			if ( ! THREE.Detector.webgl ) THREE.Detector.addGetWebGLMessage();
+			
 			var camera, scene, renderer,
 			mesh, levels = [];
 

+ 2 - 2
examples/materials_multimaterials.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - multi-materials test</title>
+		<title>three.js - materials - multi-materials - webgl</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -33,7 +33,7 @@
 			<p>Model by <a href="http://sketchup.google.com/3dwarehouse/details?mid=2c6fd128fca34052adc5f5b98d513da1">Reallusion iClone</a>
 
 			<br/>
-			<p>Best viewed in Chrome 8/9 or Firefox 4 using WebGL renderer.
+			<p>Best viewed in Chrome 9 or Firefox 4 using WebGL renderer.
 			<p>Canvas renderer is very slow on anything other than Chrome.
 
 		</div>

+ 2 - 2
examples/materials_normalmap.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - webgl normal map</title>
+		<title>three.js - materials - normal map - webgl</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -58,7 +58,7 @@
 		
 		<script type="text/javascript">
 
-			if ( ! THREE.Supports.webgl ) THREE.Supports.addGetWebGLMessage();
+			if ( ! THREE.Detector.webgl ) THREE.Detector.addGetWebGLMessage();
 			
 			var statsEnabled = true;
 

+ 2 - 2
examples/materials_normalmap2.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - webgl normal map - lee perry-smith</title>
+		<title>three.js - materials - normal map [Lee Perry-Smith] - webgl</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -57,7 +57,7 @@
 
 		<script type="text/javascript">
 
-			if ( ! THREE.Supports.webgl ) THREE.Supports.addGetWebGLMessage();
+			if ( ! THREE.Detector.webgl ) THREE.Detector.addGetWebGLMessage();
 
 			var statsEnabled = true;
 

+ 4 - 4
examples/materials_shaders.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - Shader test</title>
+		<title>three.js - materials - shaders [Phong, Lambert] - webgl</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -25,16 +25,16 @@
 	
 	<body>
 		<div id="d">
-			<h1>Shader test</h1>
+			<h1>Blinn-Phong / Lambert materials</h1>
 
 			<span id="rcanvas" class="button inactive">2d canvas renderer</span>
 			<span id="rwebgl" class="button">WebGL renderer</span>
 			<br/>
 			
-			<p>Using a modified version of <a href="http://github.com/alteredq/three.js">Three.js</a> by mrdoob.
+			<p><a href="http://github.com/mrdoob/three.js">Three.js</a> example
 			
 			<br/>
-			<p>Best viewed in Chrome 8/9 or Firefox 4 using WebGL renderer.
+			<p>Best viewed in Chrome 9 or Firefox 4 using WebGL renderer.
 			<p>Canvas renderer is very slow on anything other than Chrome.
 			<p>Blinn-Phong shader only works in WebGL, canvas has only diffuse materials.
 		</div>

+ 2 - 2
examples/materials_shaders_fresnel.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - webgl fresnel</title>
+		<title>three.js - materials - shaders [Fresnel] - webgl</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -42,7 +42,7 @@
 		
 		<script type="text/javascript">
 
-			if ( ! THREE.Supports.webgl ) THREE.Supports.addGetWebGLMessage();
+			if ( ! THREE.Detector.webgl ) THREE.Detector.addGetWebGLMessage();
 
 			var statsEnabled = true;
 

+ 2 - 2
examples/obj_convert_test.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - OBJ converter test</title>
+		<title>three.js - io - OBJ converter - webgl</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -36,7 +36,7 @@
 			<p>Using a modified version of <a href="http://github.com/alteredq/three.js">Three.js</a> by mrdoob.
 
 			<br/>
-			<p>Best viewed in Chrome 8/9 or Firefox 4 using WebGL renderer.
+			<p>Best viewed in Chrome 9 or Firefox 4 using WebGL renderer.
 			<p>Canvas renderer is very slow on anything other than Chrome.
 		</div>
 

+ 1 - 1
examples/particles_billboards_colors_gl.html

@@ -41,7 +41,7 @@
 
 		<script type="text/javascript">
 		
-			if ( ! THREE.Supports.webgl ) THREE.Supports.addGetWebGLMessage();
+			if ( ! THREE.Detector.webgl ) THREE.Detector.addGetWebGLMessage();
 
 			var container, stats;
 			var camera, scene, renderer, particles, geometry, material, i, h, color, colors = [], sprite, size, x, y, z;

+ 1 - 1
examples/particles_billboards_gl.html

@@ -41,7 +41,7 @@
 
 		<script type="text/javascript">
 		
-			if ( ! THREE.Supports.webgl ) THREE.Supports.addGetWebGLMessage();
+			if ( ! THREE.Detector.webgl ) THREE.Detector.addGetWebGLMessage();
 
 			var container, stats;
 			var camera, scene, renderer, particles, geometry, material, i, h, color, sprite, size, x, y, z;

+ 2 - 2
examples/particles_random_gl.html

@@ -36,12 +36,12 @@
 			<a href="http://github.com/mrdoob/three.js" target="_blank">three.js</a> - webgl particles example
 		</div>
 
-		<script type="text/javascript" src="../build/Three.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.Supports.webgl ) THREE.Supports.addGetWebGLMessage();
+			if ( ! THREE.Detector.webgl ) THREE.Detector.addGetWebGLMessage();
 
 			var container, stats;
 			var camera, scene, renderer, particles, geometry, materials = [], parameters, i, h, color;

+ 1 - 1
examples/particles_sprites_gl.html

@@ -42,7 +42,7 @@
 
 		<script type="text/javascript">
 		
-			if ( ! THREE.Supports.webgl ) THREE.Supports.addGetWebGLMessage();
+			if ( ! THREE.Detector.webgl ) THREE.Detector.addGetWebGLMessage();
 
 			var container, stats;
 			var camera, scene, renderer, particles, geometry, materials = [], parameters, i, h, color, sprite, size;

+ 1 - 1
examples/postprocessing.html

@@ -64,7 +64,7 @@
 
         <script type="text/javascript">
 
-			if ( ! THREE.Supports.webgl ) THREE.Supports.addGetWebGLMessage();
+			if ( ! THREE.Detector.webgl ) THREE.Detector.addGetWebGLMessage();
 
             var container, stats;
 

+ 1 - 1
examples/render_to_texture.html

@@ -78,7 +78,7 @@
 
         <script type="text/javascript">
 
-			if ( ! THREE.Supports.webgl ) THREE.Supports.addGetWebGLMessage();
+			if ( ! THREE.Detector.webgl ) THREE.Detector.addGetWebGLMessage();
 			
             var container, stats;
 

+ 2 - 2
examples/scene_test.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - scene loader test</title>
+		<title>three.js - io - scene loader - webgl</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -154,7 +154,7 @@
 
 		<script type="text/javascript">
 
-			if ( ! THREE.Supports.webgl ) THREE.Supports.addGetWebGLMessage();
+			if ( ! THREE.Detector.webgl ) THREE.Detector.addGetWebGLMessage();
 			
 			var SCREEN_WIDTH = window.innerWidth;
 			var SCREEN_HEIGHT = window.innerHeight;

+ 3 - 2
examples/shader.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - shader</title>
+		<title>three.js - materials - shaders [Monjori] - webgl</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -39,6 +39,7 @@
 
 		<script type="text/javascript" src="../build/Three.js"></script>
 		<script type="text/javascript" src="../src/extras/primitives/Plane.js"></script>
+		<script type="text/javascript" src="../src/extras/Detector.js"></script>
 
 		<script id="vertex_shader" type="x-shader/x-vertex">
 			void main()
@@ -85,7 +86,7 @@
 
 		<script type="text/javascript">
 		
-			if ( ! THREE.Supports.webgl ) THREE.Supports.addGetWebGLMessage();
+			if ( ! THREE.Detector.webgl ) THREE.Detector.addGetWebGLMessage();
 
 			var container, stats;
 

+ 2 - 3
examples/shader2.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - shader materials</title>
+		<title>three.js - materials - shaders [custom] - webgl</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -36,7 +36,6 @@
 		<div id="info"><a href="http://github.com/mrdoob/three.js" target="_blank">three.js</a> - shader material demo. featuring <a href="http://www.pouet.net/prod.php?which=52761" target="_blank">Monjori by Mic</a></div> 
 
 		<script type="text/javascript" src="js/Stats.js"></script>
-
 		<script type="text/javascript" src="../build/ThreeExtras.js"></script>
 
 
@@ -169,7 +168,7 @@
 
 		<script type="text/javascript">
 
-			if ( ! THREE.Supports.webgl ) THREE.Supports.addGetWebGLMessage();
+			if ( ! THREE.Detector.webgl ) THREE.Detector.addGetWebGLMessage();
 			
 			var container, stats;
 

+ 0 - 62
src/core/Supports.js

@@ -1,62 +0,0 @@
-/**
- * @author alteredq / http://alteredqualia.com/
- */
- 
-THREE.Supports = {
-	
-	// supported features
-	
-	canvas	: !!document.createElement( 'canvas' ).getContext,
-	webgl	: window.Uint8Array != undefined,
-	workers : !!window.Worker,
-	
-	// helper methods
-	
-	addGetWebGLMessage: function( parameters ) {
-		
-		var parent = document.body,
-			id = "oldie" ;
-		
-		if ( parameters ) {
-			
-			if ( parameters.parent !== undefined ) parent  = parameters.parent;
-			if ( parameters.id !== undefined ) id  = parameters.id;
-			
-		}
-		
-		var html = [
-		
-		'Sorry, your browser doesn\'t support <a href="http://khronos.org/webgl/wiki/Getting_a_WebGL_Implementation">WebGL</a><br/>',
-		'<br/>',
-		'Please try in',
-		'<a href="http://www.chromium.org/getting-involved/dev-channel">Chrome 9+</a> /',
-		'<a href="http://www.mozilla.com/en-US/firefox/all-beta.html">Firefox 4+</a> /',
-		'<a href="http://nightly.webkit.org/">Safari OSX 10.6+</a>'
-		
-		].join("\n");
-		
-		var wrap = document.createElement( "center" ),
-			message = document.createElement( "div" );
-		
-		message.innerHTML = html;
-		message.id = id;
-		
-		var style = message.style;
-		
-		style.fontFamily = "monospace";
-		style.fontSize = "13px";
-		style.textAlign = "center";
-		style.background = "#eee";
-		style.color = "#000";
-		style.padding = "1em";
-		style.width = "475px";
-		style.margin = "5em auto 0";
-		
-		wrap.appendChild( message )
-		parent.appendChild( wrap );
-		
-		return message;
-
-	}
-	
-};

+ 1 - 1
utils/build.py

@@ -26,7 +26,6 @@ COMMON_FILES = [
 'core/Face4.js',
 'core/UV.js',
 'core/Geometry.js',
-'core/Supports.js',
 'cameras/Camera.js',
 'lights/Light.js',
 'lights/AmbientLight.js',
@@ -74,6 +73,7 @@ COMMON_FILES = [
 ]
 
 EXTRAS_FILES = [
+'extras/Detector.js',
 'extras/GeometryUtils.js',
 'extras/ImageUtils.js',
 'extras/SceneUtils.js',