浏览代码

Synced with mrdoob's main branch.

alteredq 14 年之前
父节点
当前提交
99dd3a411b
共有 100 个文件被更改,包括 8302 次插入3239 次删除
  1. 64 38
      README.md
  2. 302 231
      build/Three.js
  3. 0 231
      build/ThreeDebug.js
  4. 142 0
      build/custom/ThreeCanvas.js
  5. 78 0
      build/custom/ThreeDOM.js
  6. 17 0
      build/custom/ThreeExtras.js
  7. 135 0
      build/custom/ThreeSVG.js
  8. 200 0
      build/custom/ThreeWebGL.js
  9. 18 6
      examples/canvas_camera_orthographic.html
  10. 17 8
      examples/canvas_geometry_birds.html
  11. 15 8
      examples/canvas_geometry_cube.html
  12. 17 9
      examples/canvas_geometry_earth.html
  13. 202 0
      examples/canvas_geometry_hierarchy.html
  14. 8 7
      examples/canvas_geometry_panorama.html
  15. 6 3
      examples/canvas_geometry_panorama_fisheye.html
  16. 34 25
      examples/canvas_geometry_terrain.html
  17. 18 6
      examples/canvas_interactive_cubes.html
  18. 17 5
      examples/canvas_interactive_cubes_tween.html
  19. 17 6
      examples/canvas_interactive_voxelpainter.html
  20. 18 6
      examples/canvas_lights_pointlights.html
  21. 18 6
      examples/canvas_lights_pointlights_smooth.html
  22. 20 17
      examples/canvas_lines.html
  23. 22 19
      examples/canvas_lines_sphere.html
  24. 14 7
      examples/canvas_materials.html
  25. 17 11
      examples/canvas_materials_depth.html
  26. 15 5
      examples/canvas_materials_normal.html
  27. 16 4
      examples/canvas_materials_reflection.html
  28. 55 36
      examples/canvas_materials_video.html
  29. 14 4
      examples/canvas_particles_floor.html
  30. 15 6
      examples/canvas_particles_random.html
  31. 21 8
      examples/canvas_particles_sprites.html
  32. 14 5
      examples/canvas_particles_waves.html
  33. 215 0
      examples/canvas_performance.html
  34. 46 17
      examples/canvas_sandbox.html
  35. 0 216
      examples/hdr.html
  36. 143 0
      examples/js/CameraControl.js
  37. 23 23
      examples/js/Detector.js
  38. 22 0
      examples/js/RequestAnimationFrame.js
  39. 115 0
      examples/js/ShaderExtras.js
  40. 170 0
      examples/js/gui/gui.css
  41. 1051 0
      examples/js/gui/gui.full.js
  42. 34 0
      examples/js/gui/gui.min.js
  43. 22 33
      examples/misc_lights_test.html
  44. 18 16
      examples/misc_materials_multimaterials.html
  45. 275 0
      examples/misc_sound.html
  46. 43 23
      examples/misc_uqbiquity_test.html
  47. 0 281
      examples/render_to_texture.html
  48. 二进制
      examples/sounds/358232_j_s_song.mp3
  49. 二进制
      examples/sounds/358232_j_s_song.ogg
  50. 二进制
      examples/sounds/376737_Skullbeatz___Bad_Cat_Maste.mp3
  51. 二进制
      examples/sounds/376737_Skullbeatz___Bad_Cat_Maste.ogg
  52. 8 0
      examples/sounds/readme.txt
  53. 36 26
      examples/webgl_geometry_blenderexport_colors.html
  54. 32 21
      examples/webgl_geometry_colors.html
  55. 35 130
      examples/webgl_geometry_dynamic.html
  56. 203 0
      examples/webgl_geometry_hierarchy.html
  57. 281 0
      examples/webgl_geometry_hierarchy2.html
  58. 64 60
      examples/webgl_geometry_large_mesh.html
  59. 25 116
      examples/webgl_geometry_minecraft.html
  60. 38 135
      examples/webgl_geometry_minecraft_ao.html
  61. 26 77
      examples/webgl_geometry_terrain.html
  62. 25 77
      examples/webgl_geometry_terrain2.html
  63. 29 89
      examples/webgl_geometry_terrain_fog.html
  64. 225 0
      examples/webgl_hdr.html
  65. 52 44
      examples/webgl_interactive_voxelpainter.html
  66. 36 30
      examples/webgl_lights_pointlights.html
  67. 94 91
      examples/webgl_lines_colors.html
  68. 51 49
      examples/webgl_lines_cubes.html
  69. 39 39
      examples/webgl_lines_sphere.html
  70. 32 21
      examples/webgl_materials.html
  71. 25 16
      examples/webgl_materials_cars.html
  72. 58 64
      examples/webgl_materials_cars_camaro.html
  73. 31 25
      examples/webgl_materials_cubemap.html
  74. 24 17
      examples/webgl_materials_cubemap_balls_reflection.html
  75. 22 11
      examples/webgl_materials_cubemap_balls_refraction.html
  76. 22 15
      examples/webgl_materials_cubemap_escher.html
  77. 31 23
      examples/webgl_materials_cubemap_refraction.html
  78. 20 9
      examples/webgl_materials_grass.html
  79. 56 44
      examples/webgl_materials_normalmap.html
  80. 21 9
      examples/webgl_materials_normalmap2.html
  81. 61 63
      examples/webgl_materials_shaders.html
  82. 28 16
      examples/webgl_materials_shaders_fresnel.html
  83. 376 0
      examples/webgl_materials_video.html
  84. 21 18
      examples/webgl_objconvert_test.html
  85. 49 38
      examples/webgl_particles_billboards.html
  86. 47 36
      examples/webgl_particles_billboards_colors.html
  87. 54 42
      examples/webgl_particles_random.html
  88. 53 41
      examples/webgl_particles_sprites.html
  89. 217 0
      examples/webgl_performance.html
  90. 158 149
      examples/webgl_postprocessing.html
  91. 336 0
      examples/webgl_postprocessing_dof.html
  92. 369 0
      examples/webgl_ribbons.html
  93. 286 0
      examples/webgl_rtt.html
  94. 47 31
      examples/webgl_sandbox.html
  95. 138 123
      examples/webgl_scene_test.html
  96. 43 33
      examples/webgl_shader.html
  97. 76 64
      examples/webgl_shader2.html
  98. 297 0
      src/animation/Animation.js
  99. 98 0
      src/animation/AnimationHandler.js
  100. 164 21
      src/cameras/Camera.js

+ 64 - 38
README.md

@@ -14,43 +14,49 @@ More? [#three.js on irc.freenode.net](http://webchat.freenode.net/?channels=thre
 
 #### WebGL (Context 3D) ####
 
-[![shader](http://mrdoob.github.com/three.js/assets/examples/34_shader.png)](http://mrdoob.github.com/three.js/examples/shader.html)
-[![materials_normalmap2](http://mrdoob.github.com/three.js/assets/examples/33_materials_normalmap2.png)](http://mrdoob.github.com/three.js/examples/materials_normalmap2.html)
-[![materials_grass](http://mrdoob.github.com/three.js/assets/examples/32_materials_grass.png)](http://mrdoob.github.com/three.js/examples/materials_grass.html)
-[![materials_normalmap](http://mrdoob.github.com/three.js/assets/examples/31_materials_normalmap.png)](http://mrdoob.github.com/three.js/examples/materials_normalmap.html)
-[![geometry_terrain_gl](http://mrdoob.github.com/three.js/assets/examples/30_geometry_terrain_gl.png)](http://mrdoob.github.com/three.js/examples/geometry_terrain_gl.html)
-[![geometry_minecraft](http://mrdoob.github.com/three.js/assets/examples/29_geometry_minecraft.png)](http://mrdoob.github.com/three.js/examples/geometry_minecraft_ao.html)
-[![materials_shader_fresnel](http://mrdoob.github.com/three.js/assets/examples/28_materials_shaders_fresnel.png)](http://mrdoob.github.com/three.js/examples/materials_shaders_fresnel.html)
-[![materials_cars](http://mrdoob.github.com/three.js/assets/examples/25_materials_cars.png)](http://mrdoob.github.com/three.js/examples/materials_cars.html)
-[![materials_cubemap_refraction](http://mrdoob.github.com/three.js/assets/examples/18_materials_cubemap_refraction.png)](http://mrdoob.github.com/three.js/examples/materials_cubemap_refraction.html)
-[![materials_cubemap_balls_reflection](http://mrdoob.github.com/three.js/assets/examples/15_materials_cubemap_balls_reflection.png)](http://mrdoob.github.com/three.js/examples/materials_cubemap_balls_reflection.html)
-[![materials_cubemap_balls_refraction](http://mrdoob.github.com/three.js/assets/examples/16_materials_cubemap_balls_refraction.png)](http://mrdoob.github.com/three.js/examples/materials_cubemap_balls_refraction.html)
-[![materials_cubemap_escher](http://mrdoob.github.com/three.js/assets/examples/17_materials_cubemap_escher.png)](http://mrdoob.github.com/three.js/examples/materials_cubemap_escher.html)
-[![materials_cubemap](http://mrdoob.github.com/three.js/assets/examples/14_materials_cubemap.png)](http://mrdoob.github.com/three.js/examples/materials_cubemap.html)
-[![materials_gl](http://mrdoob.github.com/three.js/assets/examples/20_materials_gl.png)](http://mrdoob.github.com/three.js/examples/materials_gl.html)
-[![materials_shaders](http://mrdoob.github.com/three.js/assets/examples/23_materials_shaders.png)](http://mrdoob.github.com/three.js/examples/materials_shaders.html)
-[![large_mesh](http://mrdoob.github.com/three.js/assets/examples/12_large_mesh.png)](http://mrdoob.github.com/three.js/examples/geometry_large_mesh.html)
+[![video](http://mrdoob.github.com/three.js/assets/examples/40_video.png)](http://mrdoob.github.com/three.js/examples/webgl_materials_video.html)
+[![dof](http://mrdoob.github.com/three.js/assets/examples/39_dof.png)](http://mrdoob.github.com/three.js/examples/webgl_postprocessing_dof.html)
+[![ribbon](http://mrdoob.github.com/three.js/assets/examples/38_ribbon.png)](http://mrdoob.github.com/three.js/examples/webgl_ribbons.html)
+[![vertexcolors](http://mrdoob.github.com/three.js/assets/examples/37_vertexcolors.png)](http://mrdoob.github.com/three.js/examples/webgl_geometry_colors.html)
+[![particles](http://mrdoob.github.com/three.js/assets/examples/36_particles.png)](http://mrdoob.github.com/three.js/examples/webgl_particles_billboards_colors.html)
+[![lines](http://mrdoob.github.com/three.js/assets/examples/35_lines.png)](http://mrdoob.github.com/three.js/examples/webgl_lines_colors.html)
+[![shader](http://mrdoob.github.com/three.js/assets/examples/34_shader.png)](http://mrdoob.github.com/three.js/examples/webgl_shader.html)
+[![materials_normalmap2](http://mrdoob.github.com/three.js/assets/examples/33_materials_normalmap2.png)](http://mrdoob.github.com/three.js/examples/webgl_materials_normalmap2.html)
+[![materials_grass](http://mrdoob.github.com/three.js/assets/examples/32_materials_grass.png)](http://mrdoob.github.com/three.js/examples/webgl_materials_grass.html)
+[![materials_normalmap](http://mrdoob.github.com/three.js/assets/examples/31_materials_normalmap.png)](http://mrdoob.github.com/three.js/examples/webgl_materials_normalmap.html)
+[![geometry_terrain_gl](http://mrdoob.github.com/three.js/assets/examples/30_geometry_terrain_gl.png)](http://mrdoob.github.com/three.js/examples/webgl_geometry_terrain.html)
+[![geometry_minecraft](http://mrdoob.github.com/three.js/assets/examples/29_geometry_minecraft.png)](http://mrdoob.github.com/three.js/examples/webgl_geometry_minecraft_ao.html)
+[![materials_shader_fresnel](http://mrdoob.github.com/three.js/assets/examples/28_materials_shaders_fresnel.png)](http://mrdoob.github.com/three.js/examples/webgl_materials_shaders_fresnel.html)
+[![materials_cars](http://mrdoob.github.com/three.js/assets/examples/25_materials_cars.png)](http://mrdoob.github.com/three.js/examples/webgl_materials_cars.html)
+[![materials_cubemap_refraction](http://mrdoob.github.com/three.js/assets/examples/18_materials_cubemap_refraction.png)](http://mrdoob.github.com/three.js/examples/webgl_materials_cubemap_refraction.html)
+[![materials_cubemap_balls_reflection](http://mrdoob.github.com/three.js/assets/examples/15_materials_cubemap_balls_reflection.png)](http://mrdoob.github.com/three.js/examples/webgl_materials_cubemap_balls_reflection.html)
+[![materials_cubemap_balls_refraction](http://mrdoob.github.com/three.js/assets/examples/16_materials_cubemap_balls_refraction.png)](http://mrdoob.github.com/three.js/examples/webgl_materials_cubemap_balls_refraction.html)
+[![materials_cubemap_escher](http://mrdoob.github.com/three.js/assets/examples/17_materials_cubemap_escher.png)](http://mrdoob.github.com/three.js/examples/webgl_materials_cubemap_escher.html)
+[![materials_cubemap](http://mrdoob.github.com/three.js/assets/examples/14_materials_cubemap.png)](http://mrdoob.github.com/three.js/examples/webgl_materials_cubemap.html)
+[![materials_gl](http://mrdoob.github.com/three.js/assets/examples/20_materials_gl.png)](http://mrdoob.github.com/three.js/examples/webgl_materials.html)
+[![materials_shaders](http://mrdoob.github.com/three.js/assets/examples/23_materials_shaders.png)](http://mrdoob.github.com/three.js/examples/webgl_materials_shaders.html)
+[![large_mesh](http://mrdoob.github.com/three.js/assets/examples/12_large_mesh.png)](http://mrdoob.github.com/three.js/examples/webgl_geometry_large_mesh.html)
 
 
 #### Canvas (Context 2D) ####
 
-[![materials_reflection](http://mrdoob.github.com/three.js/assets/examples/27_materials_reflection.png)](http://mrdoob.github.com/three.js/examples/materials_reflection.html)
-[![materials](http://mrdoob.github.com/three.js/assets/examples/13_materials.png)](http://mrdoob.github.com/three.js/examples/materials.html)
-[![materials_depth](http://mrdoob.github.com/three.js/assets/examples/19_materials_depth.png)](http://mrdoob.github.com/three.js/examples/materials_depth.html)
-[![materials_normal](http://mrdoob.github.com/three.js/assets/examples/22_materials_normal.png)](http://mrdoob.github.com/three.js/examples/materials_normal.html)
-[![lights_pointlights](http://mrdoob.github.com/three.js/assets/examples/09_walthead.png)](http://mrdoob.github.com/three.js/examples/lights_pointlights.html)
-[![interactive_cubes](http://mrdoob.github.com/three.js/assets/examples/11_interactive.png)](http://mrdoob.github.com/three.js/examples/interactive_cubes.html)
-[![camera_ortographic](http://mrdoob.github.com/three.js/assets/examples/10_orthographic.png)](http://mrdoob.github.com/three.js/examples/camera_orthographic.html)
-[![geometry_birds](http://mrdoob.github.com/three.js/assets/examples/08_birds.png)](http://mrdoob.github.com/three.js/examples/geometry_birds.html)
-[![geometry_earth](http://mrdoob.github.com/three.js/assets/examples/07_earth.png)](http://mrdoob.github.com/three.js/examples/geometry_earth.html)
-[![geometry_terrain](http://mrdoob.github.com/three.js/assets/examples/06_terrain.png)](http://mrdoob.github.com/three.js/examples/geometry_terrain.html)
-[![materials_video](http://mrdoob.github.com/three.js/assets/examples/24_materials_video.png)](http://mrdoob.github.com/three.js/examples/materials_video.html)
-[![geometry_panorama](http://mrdoob.github.com/three.js/assets/examples/04_vr.png)](http://mrdoob.github.com/three.js/examples/geometry_panorama.html)
-[![geometry_cube](http://mrdoob.github.com/three.js/assets/examples/03_cube.png)](http://mrdoob.github.com/three.js/examples/geometry_cube.html)
-[![particles_sprites](http://mrdoob.github.com/three.js/assets/examples/26_particles_sprites.png)](http://mrdoob.github.com/three.js/examples/particles_sprites.html)
-[![particles_random](http://mrdoob.github.com/three.js/assets/examples/02_random.png)](http://mrdoob.github.com/three.js/examples/particles_random.html)
-[![particles_wave](http://mrdoob.github.com/three.js/assets/examples/01_waves.png)](http://mrdoob.github.com/three.js/examples/particles_waves.html)
-[![particles_floor](http://mrdoob.github.com/three.js/assets/examples/00_floor.png)](http://mrdoob.github.com/three.js/examples/particles_floor.html)
+[![materials_reflection](http://mrdoob.github.com/three.js/assets/examples/27_materials_reflection.png)](http://mrdoob.github.com/three.js/examples/canvas_materials_reflection.html)
+[![materials](http://mrdoob.github.com/three.js/assets/examples/13_materials.png)](http://mrdoob.github.com/three.js/examples/canvas_materials.html)
+[![materials_depth](http://mrdoob.github.com/three.js/assets/examples/19_materials_depth.png)](http://mrdoob.github.com/three.js/examples/canvas_materials_depth.html)
+[![materials_normal](http://mrdoob.github.com/three.js/assets/examples/22_materials_normal.png)](http://mrdoob.github.com/three.js/examples/canvas_materials_normal.html)
+[![lights_pointlights](http://mrdoob.github.com/three.js/assets/examples/09_walthead.png)](http://mrdoob.github.com/three.js/examples/canvas_lights_pointlights.html)
+[![interactive_cubes](http://mrdoob.github.com/three.js/assets/examples/11_interactive.png)](http://mrdoob.github.com/three.js/examples/canvas_interactive_cubes.html)
+[![camera_ortographic](http://mrdoob.github.com/three.js/assets/examples/10_orthographic.png)](http://mrdoob.github.com/three.js/examples/canvas_camera_orthographic.html)
+[![geometry_birds](http://mrdoob.github.com/three.js/assets/examples/08_birds.png)](http://mrdoob.github.com/three.js/examples/canvas_geometry_birds.html)
+[![geometry_earth](http://mrdoob.github.com/three.js/assets/examples/07_earth.png)](http://mrdoob.github.com/three.js/examples/canvas_geometry_earth.html)
+[![geometry_terrain](http://mrdoob.github.com/three.js/assets/examples/06_terrain.png)](http://mrdoob.github.com/three.js/examples/canvas_geometry_terrain.html)
+[![materials_video](http://mrdoob.github.com/three.js/assets/examples/24_materials_video.png)](http://mrdoob.github.com/three.js/examples/canvas_materials_video.html)
+[![geometry_panorama](http://mrdoob.github.com/three.js/assets/examples/04_vr.png)](http://mrdoob.github.com/three.js/examples/canvas_geometry_panorama.html)
+[![geometry_cube](http://mrdoob.github.com/three.js/assets/examples/03_cube.png)](http://mrdoob.github.com/three.js/examples/canvas_geometry_cube.html)
+[![particles_sprites](http://mrdoob.github.com/three.js/assets/examples/26_particles_sprites.png)](http://mrdoob.github.com/three.js/examples/canvas_particles_sprites.html)
+[![particles_random](http://mrdoob.github.com/three.js/assets/examples/02_random.png)](http://mrdoob.github.com/three.js/examples/canvas_particles_random.html)
+[![particles_wave](http://mrdoob.github.com/three.js/assets/examples/01_waves.png)](http://mrdoob.github.com/three.js/examples/canvas_particles_waves.html)
+[![particles_floor](http://mrdoob.github.com/three.js/assets/examples/00_floor.png)](http://mrdoob.github.com/three.js/examples/canvas_particles_floor.html)
 
 
 ### Featured projects ###
@@ -73,16 +79,16 @@ More? [#three.js on irc.freenode.net](http://webchat.freenode.net/?channels=thre
 
 Download the [minified library](http://mrdoob.github.com/three.js/build/Three.js) and include it in your html.
 
-	<script type="text/javascript" src="js/Three.js"></script>
+	<script src="js/Three.js"></script>
 
 This code creates a camera, then creates a scene object, adds a bunch of random particles in it, creates a &lt;canvas&gt; renderer and adds its viewport in the document.body element.
 
-	<script type="text/javascript">
+	<script>
 
 		var camera, scene, renderer;
 
 		init();
-		setInterval( loop, 1000 / 60 );
+		animate();
 
 		function init() {
 
@@ -91,7 +97,7 @@ This code creates a camera, then creates a scene object, adds a bunch of random
 
 			scene = new THREE.Scene();
 
-			for (var i = 0; i < 1000; i++) {
+			for ( var i = 0; i < 1000; i ++ ) {
 
 				var particle = new THREE.Particle( new THREE.ParticleCircleMaterial( { color: Math.random() * 0xffffff } ) );
 				particle.position.x = Math.random() * 2000 - 1000;
@@ -109,7 +115,14 @@ This code creates a camera, then creates a scene object, adds a bunch of random
 
 		}
 
-		function loop() {
+		function animate() {
+
+			requestAnimationFrame( animate );
+			render();
+
+		}
+
+		function render() {
 
 			renderer.render( scene, camera );
 
@@ -120,6 +133,19 @@ This code creates a camera, then creates a scene object, adds a bunch of random
 
 ### Change Log ###
 
+2011 02 26 - **r33** (190.451 KB, gzip: 46.278 KB)
+
+* Added `ParticleSystem` object to `WebGLRenderer` ([alteredq](http://github.com/alteredq))
+* Added `Line` support to `WebGLRenderer` ([alteredq](http://github.com/alteredq))
+* Added vertex colors support to `WebGLRenderer` ([alteredq](http://github.com/alteredq))
+* Added `Ribbon` object. ([alteredq](http://github.com/alteredq))
+* Added updateable textures support to `WebGLRenderer` ([alteredq](http://github.com/alteredq))
+* Added `Sound` object and `SoundRenderer`. ([empaempa](http://github.com/empaempa))
+* `LOD`, `Bone`, `SkinnedMesh` objects and hierarchy being developed. ([empaempa](http://github.com/empaempa))
+* Changed build setup (`Three.js` now includes everything. `Three*.js` inside `build/custom` folder) ([mrdoob](http://github.com/mrdoob))
+* Many internal changes.
+
+
 2010 12 31 - **r32** (89.301 KB, gzip: 21.351 KB)
 
 * `Scene` now supports `Fog` and `FogExp2`. `WebGLRenderer` only right now. ([alteredq](http://github.com/alteredq))

文件差异内容过多而无法显示
+ 302 - 231
build/Three.js


+ 0 - 231
build/ThreeDebug.js

@@ -1,231 +0,0 @@
-// ThreeDebug.js r32 - http://github.com/mrdoob/three.js
-var THREE=THREE||{};THREE.Color=function(a){this.autoUpdate=true;this.setHex(a)};
-THREE.Color.prototype={setRGB:function(a,c,d){this.r=a;this.g=c;this.b=d;if(this.autoUpdate){this.updateHex();this.updateStyleString()}},setHSV:function(a,c,d){var f,j,k,q,o,l;if(d==0)f=j=k=0;else{q=Math.floor(a*6);o=a*6-q;a=d*(1-c);l=d*(1-c*o);c=d*(1-c*(1-o));switch(q){case 1:f=l;j=d;k=a;break;case 2:f=a;j=d;k=c;break;case 3:f=a;j=l;k=d;break;case 4:f=c;j=a;k=d;break;case 5:f=d;j=a;k=l;break;case 6:case 0:f=d;j=c;k=a}}this.r=f;this.g=j;this.b=k;if(this.autoUpdate){this.updateHex();this.updateStyleString()}},
-setHex:function(a){this.hex=~~a&16777215;if(this.autoUpdate){this.updateRGBA();this.updateStyleString()}},updateHex:function(){this.hex=~~(this.r*255)<<16^~~(this.g*255)<<8^~~(this.b*255)},updateRGBA:function(){this.r=(this.hex>>16&255)/255;this.g=(this.hex>>8&255)/255;this.b=(this.hex&255)/255},updateStyleString:function(){this.__styleString="rgb("+~~(this.r*255)+","+~~(this.g*255)+","+~~(this.b*255)+")"},clone:function(){return new THREE.Color(this.hex)},toString:function(){return"THREE.Color ( r: "+
-this.r+", g: "+this.g+", b: "+this.b+", hex: "+this.hex+" )"}};THREE.Vector2=function(a,c){this.x=a||0;this.y=c||0};
-THREE.Vector2.prototype={set:function(a,c){this.x=a;this.y=c;return this},copy:function(a){this.x=a.x;this.y=a.y;return this},addSelf:function(a){this.x+=a.x;this.y+=a.y;return this},add:function(a,c){this.x=a.x+c.x;this.y=a.y+c.y;return this},subSelf:function(a){this.x-=a.x;this.y-=a.y;return this},sub:function(a,c){this.x=a.x-c.x;this.y=a.y-c.y;return this},multiplyScalar:function(a){this.x*=a;this.y*=a;return this},unit:function(){this.multiplyScalar(1/this.length());return this},length:function(){return Math.sqrt(this.x*
-this.x+this.y*this.y)},lengthSq:function(){return this.x*this.x+this.y*this.y},negate:function(){this.x=-this.x;this.y=-this.y;return this},clone:function(){return new THREE.Vector2(this.x,this.y)},toString:function(){return"THREE.Vector2 ("+this.x+", "+this.y+")"}};THREE.Vector3=function(a,c,d){this.x=a||0;this.y=c||0;this.z=d||0};
-THREE.Vector3.prototype={set:function(a,c,d){this.x=a;this.y=c;this.z=d;return this},copy:function(a){this.x=a.x;this.y=a.y;this.z=a.z;return this},add:function(a,c){this.x=a.x+c.x;this.y=a.y+c.y;this.z=a.z+c.z;return this},addSelf:function(a){this.x+=a.x;this.y+=a.y;this.z+=a.z;return this},addScalar:function(a){this.x+=a;this.y+=a;this.z+=a;return this},sub:function(a,c){this.x=a.x-c.x;this.y=a.y-c.y;this.z=a.z-c.z;return this},subSelf:function(a){this.x-=a.x;this.y-=a.y;this.z-=a.z;return this},
-cross:function(a,c){this.x=a.y*c.z-a.z*c.y;this.y=a.z*c.x-a.x*c.z;this.z=a.x*c.y-a.y*c.x;return this},crossSelf:function(a){var c=this.x,d=this.y,f=this.z;this.x=d*a.z-f*a.y;this.y=f*a.x-c*a.z;this.z=c*a.y-d*a.x;return this},multiply:function(a,c){this.x=a.x*c.x;this.y=a.y*c.y;this.z=a.z*c.z;return this},multiplySelf:function(a){this.x*=a.x;this.y*=a.y;this.z*=a.z;return this},multiplyScalar:function(a){this.x*=a;this.y*=a;this.z*=a;return this},divideSelf:function(a){this.x/=a.x;this.y/=a.y;this.z/=
-a.z;return this},divideScalar:function(a){this.x/=a;this.y/=a;this.z/=a;return this},dot:function(a){return this.x*a.x+this.y*a.y+this.z*a.z},distanceTo:function(a){var c=this.x-a.x,d=this.y-a.y;a=this.z-a.z;return Math.sqrt(c*c+d*d+a*a)},distanceToSquared:function(a){var c=this.x-a.x,d=this.y-a.y;a=this.z-a.z;return c*c+d*d+a*a},length:function(){return Math.sqrt(this.x*this.x+this.y*this.y+this.z*this.z)},lengthSq:function(){return this.x*this.x+this.y*this.y+this.z*this.z},negate:function(){this.x=
--this.x;this.y=-this.y;this.z=-this.z;return this},normalize:function(){var a=Math.sqrt(this.x*this.x+this.y*this.y+this.z*this.z);a>0?this.multiplyScalar(1/a):this.set(0,0,0);return this},setLength:function(a){return this.normalize().multiplyScalar(a)},isZero:function(){return Math.abs(this.x)<1.0E-4&&Math.abs(this.y)<1.0E-4&&Math.abs(this.z)<1.0E-4},clone:function(){return new THREE.Vector3(this.x,this.y,this.z)},toString:function(){return"THREE.Vector3 ( "+this.x+", "+this.y+", "+this.z+" )"}};
-THREE.Vector4=function(a,c,d,f){this.x=a||0;this.y=c||0;this.z=d||0;this.w=f||1};
-THREE.Vector4.prototype={set:function(a,c,d,f){this.x=a;this.y=c;this.z=d;this.w=f;return this},copy:function(a){this.x=a.x;this.y=a.y;this.z=a.z;this.w=a.w||1;return this},add:function(a,c){this.x=a.x+c.x;this.y=a.y+c.y;this.z=a.z+c.z;this.w=a.w+c.w;return this},addSelf:function(a){this.x+=a.x;this.y+=a.y;this.z+=a.z;this.w+=a.w;return this},sub:function(a,c){this.x=a.x-c.x;this.y=a.y-c.y;this.z=a.z-c.z;this.w=a.w-c.w;return this},subSelf:function(a){this.x-=a.x;this.y-=a.y;this.z-=a.z;this.w-=a.w;
-return this},multiplyScalar:function(a){this.x*=a;this.y*=a;this.z*=a;this.w*=a;return this},divideScalar:function(a){this.x/=a;this.y/=a;this.z/=a;this.w/=a;return this},lerpSelf:function(a,c){this.x+=(a.x-this.x)*c;this.y+=(a.y-this.y)*c;this.z+=(a.z-this.z)*c;this.w+=(a.w-this.w)*c},clone:function(){return new THREE.Vector4(this.x,this.y,this.z,this.w)},toString:function(){return"THREE.Vector4 ("+this.x+", "+this.y+", "+this.z+", "+this.w+")"}};
-THREE.Ray=function(a,c){this.origin=a||new THREE.Vector3;this.direction=c||new THREE.Vector3};
-THREE.Ray.prototype={intersectScene:function(a){var c,d,f=a.objects,j=[];a=0;for(c=f.length;a<c;a++){d=f[a];if(d instanceof THREE.Mesh)j=j.concat(this.intersectObject(d))}j.sort(function(k,q){return k.distance-q.distance});return j},intersectObject:function(a){function c(I,s,O,C){C=C.clone().subSelf(s);O=O.clone().subSelf(s);var b=I.clone().subSelf(s);I=C.dot(C);s=C.dot(O);C=C.dot(b);var R=O.dot(O);O=O.dot(b);b=1/(I*R-s*s);R=(R*C-s*O)*b;I=(I*O-s*C)*b;return R>0&&I>0&&R+I<1}var d,f,j,k,q,o,l,m,z,y,
-v,x=a.geometry,F=x.vertices,H=[];d=0;for(f=x.faces.length;d<f;d++){j=x.faces[d];y=this.origin.clone();v=this.direction.clone();k=a.matrix.multiplyVector3(F[j.a].position.clone());q=a.matrix.multiplyVector3(F[j.b].position.clone());o=a.matrix.multiplyVector3(F[j.c].position.clone());l=j instanceof THREE.Face4?a.matrix.multiplyVector3(F[j.d].position.clone()):null;m=a.rotationMatrix.multiplyVector3(j.normal.clone());z=v.dot(m);if(z<0){m=m.dot((new THREE.Vector3).sub(k,y))/z;y=y.addSelf(v.multiplyScalar(m));
-if(j instanceof THREE.Face3){if(c(y,k,q,o)){j={distance:this.origin.distanceTo(y),point:y,face:j,object:a};H.push(j)}}else if(j instanceof THREE.Face4)if(c(y,k,q,l)||c(y,q,o,l)){j={distance:this.origin.distanceTo(y),point:y,face:j,object:a};H.push(j)}}}return H}};
-THREE.Rectangle=function(){function a(){k=f-c;q=j-d}var c,d,f,j,k,q,o=true;this.getX=function(){return c};this.getY=function(){return d};this.getWidth=function(){return k};this.getHeight=function(){return q};this.getLeft=function(){return c};this.getTop=function(){return d};this.getRight=function(){return f};this.getBottom=function(){return j};this.set=function(l,m,z,y){o=false;c=l;d=m;f=z;j=y;a()};this.addPoint=function(l,m){if(o){o=false;c=l;d=m;f=l;j=m}else{c=c<l?c:l;d=d<m?d:m;f=f>l?f:l;j=j>m?
-j:m}a()};this.add3Points=function(l,m,z,y,v,x){if(o){o=false;c=l<z?l<v?l:v:z<v?z:v;d=m<y?m<x?m:x:y<x?y:x;f=l>z?l>v?l:v:z>v?z:v;j=m>y?m>x?m:x:y>x?y:x}else{c=l<z?l<v?l<c?l:c:v<c?v:c:z<v?z<c?z:c:v<c?v:c;d=m<y?m<x?m<d?m:d:x<d?x:d:y<x?y<d?y:d:x<d?x:d;f=l>z?l>v?l>f?l:f:v>f?v:f:z>v?z>f?z:f:v>f?v:f;j=m>y?m>x?m>j?m:j:x>j?x:j:y>x?y>j?y:j:x>j?x:j}a()};this.addRectangle=function(l){if(o){o=false;c=l.getLeft();d=l.getTop();f=l.getRight();j=l.getBottom()}else{c=c<l.getLeft()?c:l.getLeft();d=d<l.getTop()?d:l.getTop();
-f=f>l.getRight()?f:l.getRight();j=j>l.getBottom()?j:l.getBottom()}a()};this.inflate=function(l){c-=l;d-=l;f+=l;j+=l;a()};this.minSelf=function(l){c=c>l.getLeft()?c:l.getLeft();d=d>l.getTop()?d:l.getTop();f=f<l.getRight()?f:l.getRight();j=j<l.getBottom()?j:l.getBottom();a()};this.instersects=function(l){return Math.min(f,l.getRight())-Math.max(c,l.getLeft())>=0&&Math.min(j,l.getBottom())-Math.max(d,l.getTop())>=0};this.empty=function(){o=true;j=f=d=c=0;a()};this.isEmpty=function(){return o};this.toString=
-function(){return"THREE.Rectangle ( left: "+c+", right: "+f+", top: "+d+", bottom: "+j+", width: "+k+", height: "+q+" )"}};THREE.Matrix3=function(){this.m=[]};THREE.Matrix3.prototype={transpose:function(){var a,c=this.m;a=c[1];c[1]=c[3];c[3]=a;a=c[2];c[2]=c[6];c[6]=a;a=c[5];c[5]=c[7];c[7]=a;return this},transposeIntoArray:function(a){var c=this.m;a[0]=c[0];a[1]=c[3];a[2]=c[6];a[3]=c[1];a[4]=c[4];a[5]=c[7];a[6]=c[2];a[7]=c[5];a[8]=c[8];return this}};
-THREE.Matrix4=function(a,c,d,f,j,k,q,o,l,m,z,y,v,x,F,H){this.n11=a||1;this.n12=c||0;this.n13=d||0;this.n14=f||0;this.n21=j||0;this.n22=k||1;this.n23=q||0;this.n24=o||0;this.n31=l||0;this.n32=m||0;this.n33=z||1;this.n34=y||0;this.n41=v||0;this.n42=x||0;this.n43=F||0;this.n44=H||1;this.flat=Array(16);this.m33=new THREE.Matrix3};
-THREE.Matrix4.prototype={identity:function(){this.n11=1;this.n21=this.n14=this.n13=this.n12=0;this.n22=1;this.n32=this.n31=this.n24=this.n23=0;this.n33=1;this.n43=this.n42=this.n41=this.n34=0;this.n44=1;return this},set:function(a,c,d,f,j,k,q,o,l,m,z,y,v,x,F,H){this.n11=a;this.n12=c;this.n13=d;this.n14=f;this.n21=j;this.n22=k;this.n23=q;this.n24=o;this.n31=l;this.n32=m;this.n33=z;this.n34=y;this.n41=v;this.n42=x;this.n43=F;this.n44=H;return this},copy:function(a){this.n11=a.n11;this.n12=a.n12;this.n13=
-a.n13;this.n14=a.n14;this.n21=a.n21;this.n22=a.n22;this.n23=a.n23;this.n24=a.n24;this.n31=a.n31;this.n32=a.n32;this.n33=a.n33;this.n34=a.n34;this.n41=a.n41;this.n42=a.n42;this.n43=a.n43;this.n44=a.n44;return this},lookAt:function(a,c,d){var f=THREE.Matrix4.__tmpVec1,j=THREE.Matrix4.__tmpVec2,k=THREE.Matrix4.__tmpVec3;k.sub(a,c).normalize();f.cross(d,k).normalize();j.cross(k,f).normalize();this.n11=f.x;this.n12=f.y;this.n13=f.z;this.n14=-f.dot(a);this.n21=j.x;this.n22=j.y;this.n23=j.z;this.n24=-j.dot(a);
-this.n31=k.x;this.n32=k.y;this.n33=k.z;this.n34=-k.dot(a);this.n43=this.n42=this.n41=0;this.n44=1;return this},multiplyVector3:function(a){var c=a.x,d=a.y,f=a.z,j=1/(this.n41*c+this.n42*d+this.n43*f+this.n44);a.x=(this.n11*c+this.n12*d+this.n13*f+this.n14)*j;a.y=(this.n21*c+this.n22*d+this.n23*f+this.n24)*j;a.z=(this.n31*c+this.n32*d+this.n33*f+this.n34)*j;return a},multiplyVector4:function(a){var c=a.x,d=a.y,f=a.z,j=a.w;a.x=this.n11*c+this.n12*d+this.n13*f+this.n14*j;a.y=this.n21*c+this.n22*d+this.n23*
-f+this.n24*j;a.z=this.n31*c+this.n32*d+this.n33*f+this.n34*j;a.w=this.n41*c+this.n42*d+this.n43*f+this.n44*j;return a},crossVector:function(a){var c=new THREE.Vector4;c.x=this.n11*a.x+this.n12*a.y+this.n13*a.z+this.n14*a.w;c.y=this.n21*a.x+this.n22*a.y+this.n23*a.z+this.n24*a.w;c.z=this.n31*a.x+this.n32*a.y+this.n33*a.z+this.n34*a.w;c.w=a.w?this.n41*a.x+this.n42*a.y+this.n43*a.z+this.n44*a.w:1;return c},multiply:function(a,c){var d=a.n11,f=a.n12,j=a.n13,k=a.n14,q=a.n21,o=a.n22,l=a.n23,m=a.n24,z=a.n31,
-y=a.n32,v=a.n33,x=a.n34,F=a.n41,H=a.n42,I=a.n43,s=a.n44,O=c.n11,C=c.n12,b=c.n13,R=c.n14,$=c.n21,Q=c.n22,J=c.n23,X=c.n24,G=c.n31,U=c.n32,M=c.n33,D=c.n34,K=c.n41,ca=c.n42,N=c.n43,aa=c.n44;this.n11=d*O+f*$+j*G+k*K;this.n12=d*C+f*Q+j*U+k*ca;this.n13=d*b+f*J+j*M+k*N;this.n14=d*R+f*X+j*D+k*aa;this.n21=q*O+o*$+l*G+m*K;this.n22=q*C+o*Q+l*U+m*ca;this.n23=q*b+o*J+l*M+m*N;this.n24=q*R+o*X+l*D+m*aa;this.n31=z*O+y*$+v*G+x*K;this.n32=z*C+y*Q+v*U+x*ca;this.n33=z*b+y*J+v*M+x*N;this.n34=z*R+y*X+v*D+x*aa;this.n41=
-F*O+H*$+I*G+s*K;this.n42=F*C+H*Q+I*U+s*ca;this.n43=F*b+H*J+I*M+s*N;this.n44=F*R+H*X+I*D+s*aa;return this},multiplyToArray:function(a,c,d){var f=a.n11,j=a.n12,k=a.n13,q=a.n14,o=a.n21,l=a.n22,m=a.n23,z=a.n24,y=a.n31,v=a.n32,x=a.n33,F=a.n34,H=a.n41,I=a.n42,s=a.n43;a=a.n44;var O=c.n11,C=c.n12,b=c.n13,R=c.n14,$=c.n21,Q=c.n22,J=c.n23,X=c.n24,G=c.n31,U=c.n32,M=c.n33,D=c.n34,K=c.n41,ca=c.n42,N=c.n43;c=c.n44;this.n11=f*O+j*$+k*G+q*K;this.n12=f*C+j*Q+k*U+q*ca;this.n13=f*b+j*J+k*M+q*N;this.n14=f*R+j*X+k*D+q*
-c;this.n21=o*O+l*$+m*G+z*K;this.n22=o*C+l*Q+m*U+z*ca;this.n23=o*b+l*J+m*M+z*N;this.n24=o*R+l*X+m*D+z*c;this.n31=y*O+v*$+x*G+F*K;this.n32=y*C+v*Q+x*U+F*ca;this.n33=y*b+v*J+x*M+F*N;this.n34=y*R+v*X+x*D+F*c;this.n41=H*O+I*$+s*G+a*K;this.n42=H*C+I*Q+s*U+a*ca;this.n43=H*b+I*J+s*M+a*N;this.n44=H*R+I*X+s*D+a*c;d[0]=this.n11;d[1]=this.n21;d[2]=this.n31;d[3]=this.n41;d[4]=this.n12;d[5]=this.n22;d[6]=this.n32;d[7]=this.n42;d[8]=this.n13;d[9]=this.n23;d[10]=this.n33;d[11]=this.n43;d[12]=this.n14;d[13]=this.n24;
-d[14]=this.n34;d[15]=this.n44;return this},multiplySelf:function(a){var c=this.n11,d=this.n12,f=this.n13,j=this.n14,k=this.n21,q=this.n22,o=this.n23,l=this.n24,m=this.n31,z=this.n32,y=this.n33,v=this.n34,x=this.n41,F=this.n42,H=this.n43,I=this.n44,s=a.n11,O=a.n21,C=a.n31,b=a.n41,R=a.n12,$=a.n22,Q=a.n32,J=a.n42,X=a.n13,G=a.n23,U=a.n33,M=a.n43,D=a.n14,K=a.n24,ca=a.n34;a=a.n44;this.n11=c*s+d*O+f*C+j*b;this.n12=c*R+d*$+f*Q+j*J;this.n13=c*X+d*G+f*U+j*M;this.n14=c*D+d*K+f*ca+j*a;this.n21=k*s+q*O+o*C+l*
-b;this.n22=k*R+q*$+o*Q+l*J;this.n23=k*X+q*G+o*U+l*M;this.n24=k*D+q*K+o*ca+l*a;this.n31=m*s+z*O+y*C+v*b;this.n32=m*R+z*$+y*Q+v*J;this.n33=m*X+z*G+y*U+v*M;this.n34=m*D+z*K+y*ca+v*a;this.n41=x*s+F*O+H*C+I*b;this.n42=x*R+F*$+H*Q+I*J;this.n43=x*X+F*G+H*U+I*M;this.n44=x*D+F*K+H*ca+I*a;return this},multiplyScalar:function(a){this.n11*=a;this.n12*=a;this.n13*=a;this.n14*=a;this.n21*=a;this.n22*=a;this.n23*=a;this.n24*=a;this.n31*=a;this.n32*=a;this.n33*=a;this.n34*=a;this.n41*=a;this.n42*=a;this.n43*=a;this.n44*=
-a;return this},determinant:function(){var a=this.n11,c=this.n12,d=this.n13,f=this.n14,j=this.n21,k=this.n22,q=this.n23,o=this.n24,l=this.n31,m=this.n32,z=this.n33,y=this.n34,v=this.n41,x=this.n42,F=this.n43,H=this.n44;return f*q*m*v-d*o*m*v-f*k*z*v+c*o*z*v+d*k*y*v-c*q*y*v-f*q*l*x+d*o*l*x+f*j*z*x-a*o*z*x-d*j*y*x+a*q*y*x+f*k*l*F-c*o*l*F-f*j*m*F+a*o*m*F+c*j*y*F-a*k*y*F-d*k*l*H+c*q*l*H+d*j*m*H-a*q*m*H-c*j*z*H+a*k*z*H},transpose:function(){function a(c,d,f){var j=c[d];c[d]=c[f];c[f]=j}a(this,"n21","n12");
-a(this,"n31","n13");a(this,"n32","n23");a(this,"n41","n14");a(this,"n42","n24");a(this,"n43","n34");return this},clone:function(){var a=new THREE.Matrix4;a.n11=this.n11;a.n12=this.n12;a.n13=this.n13;a.n14=this.n14;a.n21=this.n21;a.n22=this.n22;a.n23=this.n23;a.n24=this.n24;a.n31=this.n31;a.n32=this.n32;a.n33=this.n33;a.n34=this.n34;a.n41=this.n41;a.n42=this.n42;a.n43=this.n43;a.n44=this.n44;return a},flatten:function(){var a=this.flat;a[0]=this.n11;a[1]=this.n21;a[2]=this.n31;a[3]=this.n41;a[4]=this.n12;
-a[5]=this.n22;a[6]=this.n32;a[7]=this.n42;a[8]=this.n13;a[9]=this.n23;a[10]=this.n33;a[11]=this.n43;a[12]=this.n14;a[13]=this.n24;a[14]=this.n34;a[15]=this.n44;return a},flattenToArray:function(a){a[0]=this.n11;a[1]=this.n21;a[2]=this.n31;a[3]=this.n41;a[4]=this.n12;a[5]=this.n22;a[6]=this.n32;a[7]=this.n42;a[8]=this.n13;a[9]=this.n23;a[10]=this.n33;a[11]=this.n43;a[12]=this.n14;a[13]=this.n24;a[14]=this.n34;a[15]=this.n44;return a},setTranslation:function(a,c,d){this.set(1,0,0,a,0,1,0,c,0,0,1,d,
-0,0,0,1);return this},setScale:function(a,c,d){this.set(a,0,0,0,0,c,0,0,0,0,d,0,0,0,0,1);return this},setRotX:function(a){var c=Math.cos(a);a=Math.sin(a);this.set(1,0,0,0,0,c,-a,0,0,a,c,0,0,0,0,1);return this},setRotY:function(a){var c=Math.cos(a);a=Math.sin(a);this.set(c,0,a,0,0,1,0,0,-a,0,c,0,0,0,0,1);return this},setRotZ:function(a){var c=Math.cos(a);a=Math.sin(a);this.set(c,-a,0,0,a,c,0,0,0,0,1,0,0,0,0,1);return this},setRotAxis:function(a,c){var d=Math.cos(c),f=Math.sin(c),j=1-d,k=a.x,q=a.y,
-o=a.z,l=j*k,m=j*q;this.set(l*k+d,l*q-f*o,l*o+f*q,0,l*q+f*o,m*q+d,m*o-f*k,0,l*o-f*q,m*o+f*k,j*o*o+d,0,0,0,0,1);return this},toString:function(){return"| "+this.n11+" "+this.n12+" "+this.n13+" "+this.n14+" |\n| "+this.n21+" "+this.n22+" "+this.n23+" "+this.n24+" |\n| "+this.n31+" "+this.n32+" "+this.n33+" "+this.n34+" |\n| "+this.n41+" "+this.n42+" "+this.n43+" "+this.n44+" |"}};THREE.Matrix4.translationMatrix=function(a,c,d){var f=new THREE.Matrix4;f.setTranslation(a,c,d);return f};
-THREE.Matrix4.scaleMatrix=function(a,c,d){var f=new THREE.Matrix4;f.setScale(a,c,d);return f};THREE.Matrix4.rotationXMatrix=function(a){var c=new THREE.Matrix4;c.setRotX(a);return c};THREE.Matrix4.rotationYMatrix=function(a){var c=new THREE.Matrix4;c.setRotY(a);return c};THREE.Matrix4.rotationZMatrix=function(a){var c=new THREE.Matrix4;c.setRotZ(a);return c};THREE.Matrix4.rotationAxisAngleMatrix=function(a,c){var d=new THREE.Matrix4;d.setRotAxis(a,c);return d};
-THREE.Matrix4.makeInvert=function(a){var c=a.n11,d=a.n12,f=a.n13,j=a.n14,k=a.n21,q=a.n22,o=a.n23,l=a.n24,m=a.n31,z=a.n32,y=a.n33,v=a.n34,x=a.n41,F=a.n42,H=a.n43,I=a.n44,s=new THREE.Matrix4;s.n11=o*v*F-l*y*F+l*z*H-q*v*H-o*z*I+q*y*I;s.n12=j*y*F-f*v*F-j*z*H+d*v*H+f*z*I-d*y*I;s.n13=f*l*F-j*o*F+j*q*H-d*l*H-f*q*I+d*o*I;s.n14=j*o*z-f*l*z-j*q*y+d*l*y+f*q*v-d*o*v;s.n21=l*y*x-o*v*x-l*m*H+k*v*H+o*m*I-k*y*I;s.n22=f*v*x-j*y*x+j*m*H-c*v*H-f*m*I+c*y*I;s.n23=j*o*x-f*l*x-j*k*H+c*l*H+f*k*I-c*o*I;s.n24=f*l*m-j*o*m+
-j*k*y-c*l*y-f*k*v+c*o*v;s.n31=q*v*x-l*z*x+l*m*F-k*v*F-q*m*I+k*z*I;s.n32=j*z*x-d*v*x-j*m*F+c*v*F+d*m*I-c*z*I;s.n33=f*l*x-j*q*x+j*k*F-c*l*F-d*k*I+c*q*I;s.n34=j*q*m-d*l*m-j*k*z+c*l*z+d*k*v-c*q*v;s.n41=o*z*x-q*y*x-o*m*F+k*y*F+q*m*H-k*z*H;s.n42=d*y*x-f*z*x+f*m*F-c*y*F-d*m*H+c*z*H;s.n43=f*q*x-d*o*x-f*k*F+c*o*F+d*k*H-c*q*H;s.n44=d*o*m-f*q*m+f*k*z-c*o*z-d*k*y+c*q*y;s.multiplyScalar(1/a.determinant());return s};
-THREE.Matrix4.makeInvert3x3=function(a){var c=a.m33,d=c.m,f=a.n33*a.n22-a.n32*a.n23,j=-a.n33*a.n21+a.n31*a.n23,k=a.n32*a.n21-a.n31*a.n22,q=-a.n33*a.n12+a.n32*a.n13,o=a.n33*a.n11-a.n31*a.n13,l=-a.n32*a.n11+a.n31*a.n12,m=a.n23*a.n12-a.n22*a.n13,z=-a.n23*a.n11+a.n21*a.n13,y=a.n22*a.n11-a.n21*a.n12;a=a.n11*f+a.n21*q+a.n31*m;if(a==0)throw"matrix not invertible";a=1/a;d[0]=a*f;d[1]=a*j;d[2]=a*k;d[3]=a*q;d[4]=a*o;d[5]=a*l;d[6]=a*m;d[7]=a*z;d[8]=a*y;return c};
-THREE.Matrix4.makeFrustum=function(a,c,d,f,j,k){var q,o,l;q=new THREE.Matrix4;o=2*j/(c-a);l=2*j/(f-d);a=(c+a)/(c-a);d=(f+d)/(f-d);f=-(k+j)/(k-j);j=-2*k*j/(k-j);q.n11=o;q.n12=0;q.n13=a;q.n14=0;q.n21=0;q.n22=l;q.n23=d;q.n24=0;q.n31=0;q.n32=0;q.n33=f;q.n34=j;q.n41=0;q.n42=0;q.n43=-1;q.n44=0;return q};THREE.Matrix4.makePerspective=function(a,c,d,f){var j;a=d*Math.tan(a*Math.PI/360);j=-a;return THREE.Matrix4.makeFrustum(j*c,a*c,j,a,d,f)};
-THREE.Matrix4.makeOrtho=function(a,c,d,f,j,k){var q,o,l,m;q=new THREE.Matrix4;o=c-a;l=d-f;m=k-j;a=(c+a)/o;d=(d+f)/l;j=(k+j)/m;q.n11=2/o;q.n12=0;q.n13=0;q.n14=-a;q.n21=0;q.n22=2/l;q.n23=0;q.n24=-d;q.n31=0;q.n32=0;q.n33=-2/m;q.n34=-j;q.n41=0;q.n42=0;q.n43=0;q.n44=1;return q};THREE.Matrix4.__tmpVec1=new THREE.Vector3;THREE.Matrix4.__tmpVec2=new THREE.Vector3;THREE.Matrix4.__tmpVec3=new THREE.Vector3;
-THREE.Vertex=function(a,c){this.position=a||new THREE.Vector3;this.positionWorld=new THREE.Vector3;this.positionScreen=new THREE.Vector4;this.normal=c||new THREE.Vector3;this.normalWorld=new THREE.Vector3;this.normalScreen=new THREE.Vector3;this.tangent=new THREE.Vector4;this.__visible=true};THREE.Vertex.prototype={toString:function(){return"THREE.Vertex ( position: "+this.position+", normal: "+this.normal+" )"}};
-THREE.Face3=function(a,c,d,f,j){this.a=a;this.b=c;this.c=d;this.centroid=new THREE.Vector3;this.normal=f instanceof THREE.Vector3?f:new THREE.Vector3;this.vertexNormals=f instanceof Array?f:[];this.materials=j instanceof Array?j:[j]};THREE.Face3.prototype={toString:function(){return"THREE.Face3 ( "+this.a+", "+this.b+", "+this.c+" )"}};
-THREE.Face4=function(a,c,d,f,j,k){this.a=a;this.b=c;this.c=d;this.d=f;this.centroid=new THREE.Vector3;this.normal=j instanceof THREE.Vector3?j:new THREE.Vector3;this.vertexNormals=j instanceof Array?j:[];this.materials=k instanceof Array?k:[k]};THREE.Face4.prototype={toString:function(){return"THREE.Face4 ( "+this.a+", "+this.b+", "+this.c+" "+this.d+" )"}};THREE.UV=function(a,c){this.u=a||0;this.v=c||0};
-THREE.UV.prototype={copy:function(a){this.u=a.u;this.v=a.v},toString:function(){return"THREE.UV ("+this.u+", "+this.v+")"}};THREE.Geometry=function(){this.vertices=[];this.faces=[];this.uvs=[];this.uvs2=[];this.colors=[];this.boundingSphere=this.boundingBox=null;this.geometryChunks={};this.hasTangents=false};
-THREE.Geometry.prototype={computeCentroids:function(){var a,c,d;a=0;for(c=this.faces.length;a<c;a++){d=this.faces[a];d.centroid.set(0,0,0);if(d instanceof THREE.Face3){d.centroid.addSelf(this.vertices[d.a].position);d.centroid.addSelf(this.vertices[d.b].position);d.centroid.addSelf(this.vertices[d.c].position);d.centroid.divideScalar(3)}else if(d instanceof THREE.Face4){d.centroid.addSelf(this.vertices[d.a].position);d.centroid.addSelf(this.vertices[d.b].position);d.centroid.addSelf(this.vertices[d.c].position);
-d.centroid.addSelf(this.vertices[d.d].position);d.centroid.divideScalar(4)}}},computeFaceNormals:function(a){var c,d,f,j,k,q,o=new THREE.Vector3,l=new THREE.Vector3;f=0;for(j=this.vertices.length;f<j;f++){k=this.vertices[f];k.normal.set(0,0,0)}f=0;for(j=this.faces.length;f<j;f++){k=this.faces[f];if(a&&k.vertexNormals.length){o.set(0,0,0);c=0;for(d=k.normal.length;c<d;c++)o.addSelf(k.vertexNormals[c]);o.divideScalar(3)}else{c=this.vertices[k.a];d=this.vertices[k.b];q=this.vertices[k.c];o.sub(q.position,
-d.position);l.sub(c.position,d.position);o.crossSelf(l)}o.isZero()||o.normalize();k.normal.copy(o)}},computeVertexNormals:function(){var a,c,d,f;if(this.__tmpVertices==undefined){f=this.__tmpVertices=Array(this.vertices.length);a=0;for(c=this.vertices.length;a<c;a++)f[a]=new THREE.Vector3;a=0;for(c=this.faces.length;a<c;a++){d=this.faces[a];if(d instanceof THREE.Face3)d.vertexNormals=[new THREE.Vector3,new THREE.Vector3,new THREE.Vector3];else if(d instanceof THREE.Face4)d.vertexNormals=[new THREE.Vector3,
-new THREE.Vector3,new THREE.Vector3,new THREE.Vector3]}}else{f=this.__tmpVertices;a=0;for(c=this.vertices.length;a<c;a++)f[a].set(0,0,0)}a=0;for(c=this.faces.length;a<c;a++){d=this.faces[a];if(d instanceof THREE.Face3){f[d.a].addSelf(d.normal);f[d.b].addSelf(d.normal);f[d.c].addSelf(d.normal)}else if(d instanceof THREE.Face4){f[d.a].addSelf(d.normal);f[d.b].addSelf(d.normal);f[d.c].addSelf(d.normal);f[d.d].addSelf(d.normal)}}a=0;for(c=this.vertices.length;a<c;a++)f[a].normalize();a=0;for(c=this.faces.length;a<
-c;a++){d=this.faces[a];if(d instanceof THREE.Face3){d.vertexNormals[0].copy(f[d.a]);d.vertexNormals[1].copy(f[d.b]);d.vertexNormals[2].copy(f[d.c])}else if(d instanceof THREE.Face4){d.vertexNormals[0].copy(f[d.a]);d.vertexNormals[1].copy(f[d.b]);d.vertexNormals[2].copy(f[d.c]);d.vertexNormals[3].copy(f[d.d])}}},computeTangents:function(){function a(D,K,ca,N,aa,e,i){k=D.vertices[K].position;q=D.vertices[ca].position;o=D.vertices[N].position;l=j[aa];m=j[e];z=j[i];y=q.x-k.x;v=o.x-k.x;x=q.y-k.y;F=o.y-
-k.y;H=q.z-k.z;I=o.z-k.z;s=m.u-l.u;O=z.u-l.u;C=m.v-l.v;b=z.v-l.v;R=1/(s*b-O*C);J.set((b*y-C*v)*R,(b*x-C*F)*R,(b*H-C*I)*R);X.set((s*v-O*y)*R,(s*F-O*x)*R,(s*I-O*H)*R);$[K].addSelf(J);$[ca].addSelf(J);$[N].addSelf(J);Q[K].addSelf(X);Q[ca].addSelf(X);Q[N].addSelf(X)}var c,d,f,j,k,q,o,l,m,z,y,v,x,F,H,I,s,O,C,b,R,$=[],Q=[],J=new THREE.Vector3,X=new THREE.Vector3,G=new THREE.Vector3,U=new THREE.Vector3,M=new THREE.Vector3;c=0;for(d=this.vertices.length;c<d;c++){$[c]=new THREE.Vector3;Q[c]=new THREE.Vector3}c=
-0;for(d=this.faces.length;c<d;c++){f=this.faces[c];j=this.uvs[c];if(f instanceof THREE.Face3){a(this,f.a,f.b,f.c,0,1,2);this.vertices[f.a].normal.copy(f.vertexNormals[0]);this.vertices[f.b].normal.copy(f.vertexNormals[1]);this.vertices[f.c].normal.copy(f.vertexNormals[2])}else if(f instanceof THREE.Face4){a(this,f.a,f.b,f.c,0,1,2);a(this,f.a,f.b,f.d,0,1,3);this.vertices[f.a].normal.copy(f.vertexNormals[0]);this.vertices[f.b].normal.copy(f.vertexNormals[1]);this.vertices[f.c].normal.copy(f.vertexNormals[2]);
-this.vertices[f.d].normal.copy(f.vertexNormals[3])}}c=0;for(d=this.vertices.length;c<d;c++){M.copy(this.vertices[c].normal);f=$[c];G.copy(f);G.subSelf(M.multiplyScalar(M.dot(f))).normalize();U.cross(this.vertices[c].normal,f);f=U.dot(Q[c]);f=f<0?-1:1;this.vertices[c].tangent.set(G.x,G.y,G.z,f)}this.hasTangents=true},computeBoundingBox:function(){var a;if(this.vertices.length>0){this.boundingBox={x:[this.vertices[0].position.x,this.vertices[0].position.x],y:[this.vertices[0].position.y,this.vertices[0].position.y],
-z:[this.vertices[0].position.z,this.vertices[0].position.z]};for(var c=1,d=this.vertices.length;c<d;c++){a=this.vertices[c];if(a.position.x<this.boundingBox.x[0])this.boundingBox.x[0]=a.position.x;else if(a.position.x>this.boundingBox.x[1])this.boundingBox.x[1]=a.position.x;if(a.position.y<this.boundingBox.y[0])this.boundingBox.y[0]=a.position.y;else if(a.position.y>this.boundingBox.y[1])this.boundingBox.y[1]=a.position.y;if(a.position.z<this.boundingBox.z[0])this.boundingBox.z[0]=a.position.z;else if(a.position.z>
-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(z){var y=[];c=0;for(d=z.length;c<d;c++)z[c]==undefined?y.push("undefined"):y.push(z[c].toString());return y.join("_")}var c,d,f,j,k,q,o,l,m={};f=0;for(j=this.faces.length;f<j;f++){k=this.faces[f];
-q=k.materials;o=a(q);if(m[o]==undefined)m[o]={hash:o,counter:0};l=m[o].hash+"_"+m[o].counter;if(this.geometryChunks[l]==undefined)this.geometryChunks[l]={faces:[],materials:q,vertices:0};k=k instanceof THREE.Face3?3:4;if(this.geometryChunks[l].vertices+k>65535){m[o].counter+=1;l=m[o].hash+"_"+m[o].counter;if(this.geometryChunks[l]==undefined)this.geometryChunks[l]={faces:[],materials:q,vertices:0}}this.geometryChunks[l].faces.push(f);this.geometryChunks[l].vertices+=k}},toString:function(){return"THREE.Geometry ( vertices: "+
-this.vertices+", faces: "+this.faces+", uvs: "+this.uvs+" )"}};
-THREE.Camera=function(a,c,d,f){this.fov=a;this.aspect=c;this.near=d;this.far=f;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;
-THREE.DirectionalLight.prototype.constructor=THREE.DirectionalLight;THREE.PointLight=function(a,c){THREE.Light.call(this,a);this.position=new THREE.Vector3;this.intensity=c||1};THREE.PointLight.prototype=new THREE.Light;THREE.PointLight.prototype.constructor=THREE.PointLight;
-THREE.Object3D=function(){this.id=THREE.Object3DCounter.value++;this.position=new THREE.Vector3;this.rotation=new THREE.Vector3;this.scale=new THREE.Vector3(1,1,1);this.matrix=new THREE.Matrix4;this.matrixWorld=new THREE.Matrix4;this.rotationMatrix=new THREE.Matrix4;this.tmpMatrix=new THREE.Matrix4;this.screen=new THREE.Vector3;this.visible=this.autoUpdateMatrix=true;this.children=[]};
-THREE.Object3D.prototype={addChild:function(a){this.children.indexOf(a)===-1&&this.children.push(a)},removeChild:function(a){a=this.children.indexOf(a);a!==-1&&this.children.splice(a,1)},updateMatrix:function(){var a=this.position,c=this.rotation,d=this.scale,f=this.matrix,j=this.rotationMatrix,k=this.tmpMatrix;f.setTranslation(a.x,a.y,a.z);j.setRotX(c.x);c.y!=0&&j.multiplySelf(k.setRotY(c.y));c.z!=0&&j.multiplySelf(k.setRotZ(c.z));f.multiplySelf(j);if(d.x!=0||d.y!=0||d.z!=0)f.multiplySelf(k.setScale(d.x,
-d.y,d.z))}};THREE.Object3DCounter={value:0};THREE.Particle=function(a){THREE.Object3D.call(this);this.materials=a instanceof Array?a:[a];this.autoUpdateMatrix=false};THREE.Particle.prototype=new THREE.Object3D;THREE.Particle.prototype.constructor=THREE.Particle;THREE.ParticleSystem=function(a,c){THREE.Object3D.call(this);this.geometry=a;this.materials=c instanceof Array?c:[c];this.sortParticles=false};THREE.ParticleSystem.prototype=new THREE.Object3D;THREE.ParticleSystem.prototype.constructor=THREE.ParticleSystem;
-THREE.Line=function(a,c,d){THREE.Object3D.call(this);this.geometry=a;this.materials=c instanceof Array?c:[c];this.type=d!=undefined?d:THREE.LineStrip};THREE.LineStrip=0;THREE.LinePieces=1;THREE.Line.prototype=new THREE.Object3D;THREE.Line.prototype.constructor=THREE.Line;THREE.Mesh=function(a,c){THREE.Object3D.call(this);this.geometry=a;this.materials=c instanceof Array?c:[c];this.overdraw=this.doubleSided=this.flipSided=false;this.geometry.boundingSphere||this.geometry.computeBoundingSphere()};
-THREE.Mesh.prototype=new THREE.Object3D;THREE.Mesh.prototype.constructor=THREE.Mesh;THREE.FlatShading=0;THREE.SmoothShading=1;THREE.NormalBlending=0;THREE.AdditiveBlending=1;THREE.SubtractiveBlending=2;THREE.BillboardBlending=3;
-THREE.LineBasicMaterial=function(a){this.id=THREE.LineBasicMaterialCounter.value++;this.color=new THREE.Color(16777215);this.opacity=1;this.blending=THREE.NormalBlending;this.depth_test=true;this.linewidth=1;this.linejoin=this.linecap="round";this.vertex_colors=false;if(a){a.color!==undefined&&this.color.setHex(a.color);if(a.opacity!==undefined)this.opacity=a.opacity;if(a.blending!==undefined)this.blending=a.blending;if(a.depth_test!==undefined)this.depth_test=a.depth_test;if(a.linewidth!==undefined)this.linewidth=
-a.linewidth;if(a.linecap!==undefined)this.linecap=a.linecap;if(a.linejoin!==undefined)this.linejoin=a.linejoin;if(a.vertex_colors!==undefined)this.vertex_colors=a.vertex_colors}};
-THREE.LineBasicMaterial.prototype={toString:function(){return"THREE.LineBasicMaterial (<br/>id: "+this.id+"<br/>color: "+this.color+"<br/>opacity: "+this.opacity+"<br/>blending: "+this.blending+"<br/>depth_test: "+this.depth_test+"<br/>linewidth: "+this.linewidth+"<br/>linecap: "+this.linecap+"<br/>linejoin: "+this.linejoin+"<br/>vertex_colors: "+this.vertex_colors+"<br/>)"}};THREE.LineBasicMaterialCounter={value:0};
-THREE.MeshBasicMaterial=function(a){this.id=THREE.MeshBasicMaterialCounter.value++;this.color=new THREE.Color(16777215);this.opacity=1;this.env_map=this.light_map=this.map=null;this.combine=THREE.MultiplyOperation;this.reflectivity=1;this.refraction_ratio=0.98;this.fog=true;this.shading=THREE.SmoothShading;this.blending=THREE.NormalBlending;this.depth_test=true;this.wireframe=false;this.wireframe_linewidth=1;this.wireframe_linejoin=this.wireframe_linecap="round";this.vertex_colors=false;if(a){a.color!==
-undefined&&this.color.setHex(a.color);if(a.opacity!==undefined)this.opacity=a.opacity;if(a.map!==undefined)this.map=a.map;if(a.light_map!==undefined)this.light_map=a.light_map;if(a.env_map!==undefined)this.env_map=a.env_map;if(a.combine!==undefined)this.combine=a.combine;if(a.reflectivity!==undefined)this.reflectivity=a.reflectivity;if(a.refraction_ratio!==undefined)this.refraction_ratio=a.refraction_ratio;if(a.fog!==undefined)this.fog=a.fog;if(a.shading!==undefined)this.shading=a.shading;if(a.blending!==
-undefined)this.blending=a.blending;if(a.depth_test!==undefined)this.depth_test=a.depth_test;if(a.wireframe!==undefined)this.wireframe=a.wireframe;if(a.wireframe_linewidth!==undefined)this.wireframe_linewidth=a.wireframe_linewidth;if(a.wireframe_linecap!==undefined)this.wireframe_linecap=a.wireframe_linecap;if(a.wireframe_linejoin!==undefined)this.wireframe_linejoin=a.wireframe_linejoin;if(a.vertex_colors!==undefined)this.vertex_colors=a.vertex_colors}};
-THREE.MeshBasicMaterial.prototype={toString:function(){return"THREE.MeshBasicMaterial (<br/>id: "+this.id+"<br/>color: "+this.color+"<br/>opacity: "+this.opacity+"<br/>map: "+this.map+"<br/>light_map: "+this.light_map+"<br/>env_map: "+this.env_map+"<br/>combine: "+this.combine+"<br/>reflectivity: "+this.reflectivity+"<br/>refraction_ratio: "+this.refraction_ratio+"<br/>blending: "+this.blending+"<br/>depth_test: "+this.depth_test+"<br/>wireframe: "+this.wireframe+"<br/>wireframe_linewidth: "+this.wireframe_linewidth+
-"<br/>wireframe_linecap: "+this.wireframe_linecap+"<br/>wireframe_linejoin: "+this.wireframe_linejoin+"<br/>vertex_colors: "+this.vertex_colors+"<br/>)"}};THREE.MeshBasicMaterialCounter={value:0};
-THREE.MeshLambertMaterial=function(a){this.id=THREE.MeshLambertMaterialCounter.value++;this.color=new THREE.Color(16777215);this.opacity=1;this.env_map=this.light_map=this.map=null;this.combine=THREE.MultiplyOperation;this.reflectivity=1;this.refraction_ratio=0.98;this.fog=true;this.shading=THREE.SmoothShading;this.blending=THREE.NormalBlending;this.depth_test=true;this.wireframe=false;this.wireframe_linewidth=1;this.wireframe_linejoin=this.wireframe_linecap="round";this.vertex_colors=false;if(a){a.color!==
-undefined&&this.color.setHex(a.color);if(a.opacity!==undefined)this.opacity=a.opacity;if(a.map!==undefined)this.map=a.map;if(a.light_map!==undefined)this.light_map=a.light_map;if(a.env_map!==undefined)this.env_map=a.env_map;if(a.combine!==undefined)this.combine=a.combine;if(a.reflectivity!==undefined)this.reflectivity=a.reflectivity;if(a.refraction_ratio!==undefined)this.refraction_ratio=a.refraction_ratio;if(a.fog!==undefined)this.fog=a.fog;if(a.shading!==undefined)this.shading=a.shading;if(a.blending!==
-undefined)this.blending=a.blending;if(a.depth_test!==undefined)this.depth_test=a.depth_test;if(a.wireframe!==undefined)this.wireframe=a.wireframe;if(a.wireframe_linewidth!==undefined)this.wireframe_linewidth=a.wireframe_linewidth;if(a.wireframe_linecap!==undefined)this.wireframe_linecap=a.wireframe_linecap;if(a.wireframe_linejoin!==undefined)this.wireframe_linejoin=a.wireframe_linejoin;if(a.vertex_colors!==undefined)this.vertex_colors=a.vertex_colors}};
-THREE.MeshLambertMaterial.prototype={toString:function(){return"THREE.MeshLambertMaterial (<br/>id: "+this.id+"<br/>color: "+this.color+"<br/>opacity: "+this.opacity+"<br/>map: "+this.map+"<br/>light_map: "+this.light_map+"<br/>env_map: "+this.env_map+"<br/>combine: "+this.combine+"<br/>reflectivity: "+this.reflectivity+"<br/>refraction_ratio: "+this.refraction_ratio+"<br/>shading: "+this.shading+"<br/>blending: "+this.blending+"<br/>depth_test: "+this.depth_test+"<br/>wireframe: "+this.wireframe+
-"<br/>wireframe_linewidth: "+this.wireframe_linewidth+"<br/>wireframe_linecap: "+this.wireframe_linecap+"<br/>wireframe_linejoin: "+this.wireframe_linejoin+"<br/>vertex_colors: "+this.vertex_colors+"<br/> )"}};THREE.MeshLambertMaterialCounter={value:0};
-THREE.MeshPhongMaterial=function(a){this.id=THREE.MeshPhongMaterialCounter.value++;this.color=new THREE.Color(16777215);this.ambient=new THREE.Color(328965);this.specular=new THREE.Color(1118481);this.shininess=30;this.opacity=1;this.env_map=this.light_map=this.map=null;this.combine=THREE.MultiplyOperation;this.reflectivity=1;this.refraction_ratio=0.98;this.fog=true;this.shading=THREE.SmoothShading;this.blending=THREE.NormalBlending;this.depth_test=true;this.wireframe=false;this.wireframe_linewidth=
-1;this.wireframe_linejoin=this.wireframe_linecap="round";this.vertex_colors=false;if(a){if(a.color!==undefined)this.color=new THREE.Color(a.color);if(a.ambient!==undefined)this.ambient=new THREE.Color(a.ambient);if(a.specular!==undefined)this.specular=new THREE.Color(a.specular);if(a.shininess!==undefined)this.shininess=a.shininess;if(a.opacity!==undefined)this.opacity=a.opacity;if(a.light_map!==undefined)this.light_map=a.light_map;if(a.map!==undefined)this.map=a.map;if(a.env_map!==undefined)this.env_map=
-a.env_map;if(a.combine!==undefined)this.combine=a.combine;if(a.reflectivity!==undefined)this.reflectivity=a.reflectivity;if(a.refraction_ratio!==undefined)this.refraction_ratio=a.refraction_ratio;if(a.fog!==undefined)this.fog=a.fog;if(a.shading!==undefined)this.shading=a.shading;if(a.blending!==undefined)this.blending=a.blending;if(a.depth_test!==undefined)this.depth_test=a.depth_test;if(a.wireframe!==undefined)this.wireframe=a.wireframe;if(a.wireframe_linewidth!==undefined)this.wireframe_linewidth=
-a.wireframe_linewidth;if(a.wireframe_linecap!==undefined)this.wireframe_linecap=a.wireframe_linecap;if(a.wireframe_linejoin!==undefined)this.wireframe_linejoin=a.wireframe_linejoin;if(a.vertex_colors!==undefined)this.vertex_colors=a.vertex_colors}};
-THREE.MeshPhongMaterial.prototype={toString:function(){return"THREE.MeshPhongMaterial (<br/>id: "+this.id+"<br/>color: "+this.color+"<br/>ambient: "+this.ambient+"<br/>specular: "+this.specular+"<br/>shininess: "+this.shininess+"<br/>opacity: "+this.opacity+"<br/>map: "+this.map+"<br/>env_map: "+this.env_map+"<br/>combine: "+this.combine+"<br/>reflectivity: "+this.reflectivity+"<br/>refraction_ratio: "+this.refraction_ratio+"<br/>shading: "+this.shading+"<br/>blending: "+this.blending+"<br/>depth_test: "+
-this.depth_test+"<br/>wireframe: "+this.wireframe+"<br/>wireframe_linewidth: "+this.wireframe_linewidth+"<br/>wireframe_linecap: "+this.wireframe_linecap+"<br/>wireframe_linejoin: "+this.wireframe_linejoin+"<br/>vertex_colors: "+this.vertex_colors+"<br/>)"}};THREE.MeshPhongMaterialCounter={value:0};
-THREE.MeshDepthMaterial=function(a){this.id=THREE.MeshDepthMaterialCounter.value++;this.opacity=1;this.shading=THREE.SmoothShading;this.blending=THREE.NormalBlending;this.depth_test=true;this.wireframe=false;this.wireframe_linewidth=1;if(a){if(a.opacity!==undefined)this.opacity=a.opacity;if(a.shading!==undefined)this.shading=a.shading;if(a.blending!==undefined)this.blending=a.blending;if(a.depth_test!==undefined)this.depth_test=a.depth_test;if(a.wireframe!==undefined)this.wireframe=a.wireframe;if(a.wireframe_linewidth!==
-undefined)this.wireframe_linewidth=a.wireframe_linewidth}};THREE.MeshDepthMaterial.prototype={toString:function(){return"THREE.MeshDepthMaterial (<br/>id: "+this.id+"<br/>opacity: "+this.opacity+"<br/>blending: "+this.blending+"<br/>depth_test: "+this.depth_test+"<br/>wireframe: "+this.wireframe+"<br/>wireframe_linewidth: "+this.wireframe_linewidth+"<br/>)"}};THREE.MeshDepthMaterialCounter={value:0};
-THREE.MeshNormalMaterial=function(a){this.id=THREE.MeshNormalMaterialCounter.value++;this.opacity=1;this.shading=THREE.FlatShading;this.blending=THREE.NormalBlending;this.depth_test=true;this.wireframe=false;this.wireframe_linewidth=1;if(a){if(a.opacity!==undefined)this.opacity=a.opacity;if(a.shading!==undefined)this.shading=a.shading;if(a.blending!==undefined)this.blending=a.blending;if(a.depth_test!==undefined)this.depth_test=a.depth_test;if(a.wireframe!==undefined)this.wireframe=a.wireframe;if(a.wireframe_linewidth!==
-undefined)this.wireframe_linewidth=a.wireframe_linewidth}};THREE.MeshNormalMaterial.prototype={toString:function(){return"THREE.MeshNormalMaterial (<br/>id: "+this.id+"<br/>opacity: "+this.opacity+"<br/>blending: "+this.blending+"<br/>depth_test: "+this.depth_test+"<br/>wireframe: "+this.wireframe+"<br/>wireframe_linewidth: "+this.wireframe_linewidth+"<br/>)"}};THREE.MeshNormalMaterialCounter={value:0};THREE.MeshFaceMaterial=function(){};THREE.MeshFaceMaterial.prototype={toString:function(){return"THREE.MeshFaceMaterial"}};
-THREE.MeshShaderMaterial=function(a){this.id=THREE.MeshShaderMaterialCounter.value++;this.vertex_shader=this.fragment_shader="void main() {}";this.uniforms={};this.opacity=1;this.shading=THREE.SmoothShading;this.blending=THREE.NormalBlending;this.depth_test=true;this.wireframe=false;this.wireframe_linewidth=1;this.wireframe_linejoin=this.wireframe_linecap="round";this.vertex_colors=false;if(a){if(a.fragment_shader!==undefined)this.fragment_shader=a.fragment_shader;if(a.vertex_shader!==undefined)this.vertex_shader=
-a.vertex_shader;if(a.uniforms!==undefined)this.uniforms=a.uniforms;if(a.opacity!==undefined)this.opacity=a.opacity;if(a.shading!==undefined)this.shading=a.shading;if(a.blending!==undefined)this.blending=a.blending;if(a.depth_test!==undefined)this.depth_test=a.depth_test;if(a.wireframe!==undefined)this.wireframe=a.wireframe;if(a.wireframe_linewidth!==undefined)this.wireframe_linewidth=a.wireframe_linewidth;if(a.wireframe_linecap!==undefined)this.wireframe_linecap=a.wireframe_linecap;if(a.wireframe_linejoin!==
-undefined)this.wireframe_linejoin=a.wireframe_linejoin;if(a.vertex_colors!==undefined)this.vertex_colors=a.vertex_colors}};
-THREE.MeshShaderMaterial.prototype={toString:function(){return"THREE.MeshShaderMaterial (<br/>id: "+this.id+"<br/>blending: "+this.blending+"<br/>depth_test: "+this.depth_test+"<br/>wireframe: "+this.wireframe+"<br/>wireframe_linewidth: "+this.wireframe_linewidth+"<br/>wireframe_linecap: "+this.wireframe_linecap+"<br/>wireframe_linejoin: "+this.wireframe_linejoin+"<br/>vertex_colors: "+this.vertex_colors+"<br/>)"}};THREE.MeshShaderMaterialCounter={value:0};
-THREE.ParticleBasicMaterial=function(a){this.id=THREE.ParticleBasicMaterialCounter.value++;this.color=new THREE.Color(16777215);this.opacity=1;this.map=null;this.size=1;this.blending=THREE.NormalBlending;this.depth_test=true;this.offset=new THREE.Vector2;this.vertex_colors=false;if(a){a.color!==undefined&&this.color.setHex(a.color);if(a.opacity!==undefined)this.opacity=a.opacity;if(a.map!==undefined)this.map=a.map;if(a.size!==undefined)this.size=a.size;if(a.blending!==undefined)this.blending=a.blending;
-if(a.depth_test!==undefined)this.depth_test=a.depth_test;if(a.vertex_colors!==undefined)this.vertex_colors=a.vertex_colors}};THREE.ParticleBasicMaterial.prototype={toString:function(){return"THREE.ParticleBasicMaterial (<br/>id: "+this.id+"<br/>color: "+this.color+"<br/>opacity: "+this.opacity+"<br/>map: "+this.map+"<br/>size: "+this.size+"<br/>blending: "+this.blending+"<br/>depth_test: "+this.depth_test+"<br/>vertex_colors: "+this.vertex_colors+"<br/>)"}};THREE.ParticleBasicMaterialCounter={value:0};
-THREE.ParticleCircleMaterial=function(a){this.color=new THREE.Color(16777215);this.opacity=1;this.blending=THREE.NormalBlending;if(a){a.color!==undefined&&this.color.setHex(a.color);if(a.opacity!==undefined)this.opacity=a.opacity;if(a.blending!==undefined)this.blending=a.blending}};THREE.ParticleCircleMaterial.prototype={toString:function(){return"THREE.ParticleCircleMaterial (<br/>color: "+this.color+"<br/>opacity: "+this.opacity+"<br/>blending: "+this.blending+"<br/>)"}};
-THREE.ParticleDOMMaterial=function(a){this.domElement=a};THREE.ParticleDOMMaterial.prototype={toString:function(){return"THREE.ParticleDOMMaterial ( domElement: "+this.domElement+" )"}};THREE.Texture=function(a,c,d,f,j,k){this.image=a;this.mapping=c!==undefined?c:new THREE.UVMapping;this.wrap_s=d!==undefined?d:THREE.ClampToEdgeWrapping;this.wrap_t=f!==undefined?f:THREE.ClampToEdgeWrapping;this.mag_filter=j!==undefined?j:THREE.LinearFilter;this.min_filter=k!==undefined?k:THREE.LinearMipMapLinearFilter};
-THREE.Texture.prototype={clone:function(){return new THREE.Texture(this.image,this.mapping,this.wrap_s,this.wrap_t,this.mag_filter,this.min_filter)},toString:function(){return"THREE.Texture (<br/>image: "+this.image+"<br/>wrap_s: "+this.wrap_s+"<br/>wrap_t: "+this.wrap_t+"<br/>mag_filter: "+this.mag_filter+"<br/>min_filter: "+this.min_filter+"<br/>)"}};THREE.MultiplyOperation=0;THREE.MixOperation=1;THREE.RepeatWrapping=0;THREE.ClampToEdgeWrapping=1;THREE.MirroredRepeatWrapping=2;
-THREE.NearestFilter=3;THREE.NearestMipMapNearestFilter=4;THREE.NearestMipMapLinearFilter=5;THREE.LinearFilter=6;THREE.LinearMipMapNearestFilter=7;THREE.LinearMipMapLinearFilter=8;THREE.ByteType=9;THREE.UnsignedByteType=10;THREE.ShortType=11;THREE.UnsignedShortType=12;THREE.IntType=13;THREE.UnsignedIntType=14;THREE.FloatType=15;THREE.AlphaFormat=16;THREE.RGBFormat=17;THREE.RGBAFormat=18;THREE.LuminanceFormat=19;THREE.LuminanceAlphaFormat=20;
-THREE.RenderTarget=function(a,c,d){this.width=a;this.height=c;d=d||{};this.wrap_s=d.wrap_s!==undefined?d.wrap_s:THREE.ClampToEdgeWrapping;this.wrap_t=d.wrap_t!==undefined?d.wrap_t:THREE.ClampToEdgeWrapping;this.mag_filter=d.mag_filter!==undefined?d.mag_filter:THREE.LinearFilter;this.min_filter=d.min_filter!==undefined?d.min_filter:THREE.LinearMipMapLinearFilter;this.format=d.format!==undefined?d.format:THREE.RGBFormat;this.type=d.type!==undefined?d.type:THREE.UnsignedByteType};
-var Uniforms={clone:function(a){var c,d,f,j={};for(c in a){j[c]={};for(d in a[c]){f=a[c][d];j[c][d]=f instanceof THREE.Color||f instanceof THREE.Vector3||f instanceof THREE.Texture?f.clone():f}}return j},merge:function(a){var c,d,f,j={};for(c=0;c<a.length;c++){f=this.clone(a[c]);for(d in f)j[d]=f[d]}return j}};THREE.CubeReflectionMapping=function(){};THREE.CubeRefractionMapping=function(){};THREE.LatitudeReflectionMapping=function(){};THREE.LatitudeRefractionMapping=function(){};
-THREE.SphericalReflectionMapping=function(){};THREE.SphericalRefractionMapping=function(){};THREE.UVMapping=function(){};
-THREE.Scene=function(){this.objects=[];this.lights=[];this.fog=null;this.addObject=function(a){this.objects.indexOf(a)===-1&&this.objects.push(a)};this.removeObject=function(a){a=this.objects.indexOf(a);a!==-1&&this.objects.splice(a,1)};this.addLight=function(a){this.lights.indexOf(a)===-1&&this.lights.push(a)};this.removeLight=function(a){a=this.lights.indexOf(a);a!==-1&&this.lights.splice(a,1)};this.toString=function(){return"THREE.Scene ( "+this.objects+" )"}};
-THREE.Fog=function(a,c,d){this.color=new THREE.Color(a);this.near=c||1;this.far=d||1E3};THREE.FogExp2=function(a,c){this.color=new THREE.Color(a);this.density=c||2.5E-4};
-THREE.Projector=function(){function a(Q,J){return J.z-Q.z}function c(Q,J){var X=0,G=1,U=Q.z+Q.w,M=J.z+J.w,D=-Q.z+Q.w,K=-J.z+J.w;if(U>=0&&M>=0&&D>=0&&K>=0)return true;else if(U<0&&M<0||D<0&&K<0)return false;else{if(U<0)X=Math.max(X,U/(U-M));else if(M<0)G=Math.min(G,U/(U-M));if(D<0)X=Math.max(X,D/(D-K));else if(K<0)G=Math.min(G,D/(D-K));if(G<X)return false;else{Q.lerpSelf(J,X);J.lerpSelf(Q,1-G);return true}}}var d,f,j=[],k,q,o,l=[],m,z,y=[],v,x,F=[],H=new THREE.Vector4,I=new THREE.Vector4,s=new THREE.Matrix4,
-O=new THREE.Matrix4,C=[],b=new THREE.Vector4,R=new THREE.Vector4,$;this.projectObjects=function(Q,J,X){var G=[],U,M;f=0;s.multiply(J.projectionMatrix,J.matrix);C[0]=new THREE.Vector4(s.n41-s.n11,s.n42-s.n12,s.n43-s.n13,s.n44-s.n14);C[1]=new THREE.Vector4(s.n41+s.n11,s.n42+s.n12,s.n43+s.n13,s.n44+s.n14);C[2]=new THREE.Vector4(s.n41+s.n21,s.n42+s.n22,s.n43+s.n23,s.n44+s.n24);C[3]=new THREE.Vector4(s.n41-s.n21,s.n42-s.n22,s.n43-s.n23,s.n44-s.n24);C[4]=new THREE.Vector4(s.n41-s.n31,s.n42-s.n32,s.n43-
-s.n33,s.n44-s.n34);C[5]=new THREE.Vector4(s.n41+s.n31,s.n42+s.n32,s.n43+s.n33,s.n44+s.n34);J=0;for(U=C.length;J<U;J++){M=C[J];M.divideScalar(Math.sqrt(M.x*M.x+M.y*M.y+M.z*M.z))}U=Q.objects;Q=0;for(J=U.length;Q<J;Q++){M=U[Q];var D;if(!(D=!M.visible)){if(D=M instanceof THREE.Mesh){a:{D=void 0;for(var K=M.position,ca=-M.geometry.boundingSphere.radius*Math.max(M.scale.x,Math.max(M.scale.y,M.scale.z)),N=0;N<6;N++){D=C[N].x*K.x+C[N].y*K.y+C[N].z*K.z+C[N].w;if(D<=ca){D=false;break a}}D=true}D=!D}D=D}if(!D){d=
-j[f]=j[f]||new THREE.RenderableObject;H.copy(M.position);s.multiplyVector3(H);d.object=M;d.z=H.z;G.push(d);f++}}X&&G.sort(a);return G};this.projectScene=function(Q,J,X){var G=[],U=J.near,M=J.far,D,K,ca,N,aa,e,i,n,h,g,t,w,u,r,p,B;o=z=x=0;J.autoUpdateMatrix&&J.updateMatrix();s.multiply(J.projectionMatrix,J.matrix);e=this.projectObjects(Q,J,true);Q=0;for(D=e.length;Q<D;Q++){i=e[Q].object;if(i.visible){i.autoUpdateMatrix&&i.updateMatrix();n=i.matrix;h=i.rotationMatrix;g=i.materials;t=i.overdraw;if(i instanceof
-THREE.Mesh){w=i.geometry;u=w.vertices;K=0;for(ca=u.length;K<ca;K++){r=u[K];r.positionWorld.copy(r.position);n.multiplyVector3(r.positionWorld);N=r.positionScreen;N.copy(r.positionWorld);s.multiplyVector4(N);N.x/=N.w;N.y/=N.w;r.__visible=N.z>U&&N.z<M}w=w.faces;K=0;for(ca=w.length;K<ca;K++){r=w[K];if(r instanceof THREE.Face3){N=u[r.a];aa=u[r.b];p=u[r.c];if(N.__visible&&aa.__visible&&p.__visible)if(i.doubleSided||i.flipSided!=(p.positionScreen.x-N.positionScreen.x)*(aa.positionScreen.y-N.positionScreen.y)-
-(p.positionScreen.y-N.positionScreen.y)*(aa.positionScreen.x-N.positionScreen.x)<0){k=l[o]=l[o]||new THREE.RenderableFace3;k.v1.positionWorld.copy(N.positionWorld);k.v2.positionWorld.copy(aa.positionWorld);k.v3.positionWorld.copy(p.positionWorld);k.v1.positionScreen.copy(N.positionScreen);k.v2.positionScreen.copy(aa.positionScreen);k.v3.positionScreen.copy(p.positionScreen);k.normalWorld.copy(r.normal);h.multiplyVector3(k.normalWorld);k.centroidWorld.copy(r.centroid);n.multiplyVector3(k.centroidWorld);
-k.centroidScreen.copy(k.centroidWorld);s.multiplyVector3(k.centroidScreen);p=r.vertexNormals;$=k.vertexNormalsWorld;N=0;for(aa=p.length;N<aa;N++){B=$[N]=$[N]||new THREE.Vector3;B.copy(p[N]);h.multiplyVector3(B)}k.z=k.centroidScreen.z;k.meshMaterials=g;k.faceMaterials=r.materials;k.overdraw=t;if(i.geometry.uvs[K]){k.uvs[0]=i.geometry.uvs[K][0];k.uvs[1]=i.geometry.uvs[K][1];k.uvs[2]=i.geometry.uvs[K][2]}G.push(k);o++}}else if(r instanceof THREE.Face4){N=u[r.a];aa=u[r.b];p=u[r.c];B=u[r.d];if(N.__visible&&
-aa.__visible&&p.__visible&&B.__visible)if(i.doubleSided||i.flipSided!=((B.positionScreen.x-N.positionScreen.x)*(aa.positionScreen.y-N.positionScreen.y)-(B.positionScreen.y-N.positionScreen.y)*(aa.positionScreen.x-N.positionScreen.x)<0||(aa.positionScreen.x-p.positionScreen.x)*(B.positionScreen.y-p.positionScreen.y)-(aa.positionScreen.y-p.positionScreen.y)*(B.positionScreen.x-p.positionScreen.x)<0)){k=l[o]=l[o]||new THREE.RenderableFace3;k.v1.positionWorld.copy(N.positionWorld);k.v2.positionWorld.copy(aa.positionWorld);
-k.v3.positionWorld.copy(B.positionWorld);k.v1.positionScreen.copy(N.positionScreen);k.v2.positionScreen.copy(aa.positionScreen);k.v3.positionScreen.copy(B.positionScreen);k.normalWorld.copy(r.normal);h.multiplyVector3(k.normalWorld);k.centroidWorld.copy(r.centroid);n.multiplyVector3(k.centroidWorld);k.centroidScreen.copy(k.centroidWorld);s.multiplyVector3(k.centroidScreen);k.z=k.centroidScreen.z;k.meshMaterials=g;k.faceMaterials=r.materials;k.overdraw=t;if(i.geometry.uvs[K]){k.uvs[0]=i.geometry.uvs[K][0];
-k.uvs[1]=i.geometry.uvs[K][1];k.uvs[2]=i.geometry.uvs[K][3]}G.push(k);o++;q=l[o]=l[o]||new THREE.RenderableFace3;q.v1.positionWorld.copy(aa.positionWorld);q.v2.positionWorld.copy(p.positionWorld);q.v3.positionWorld.copy(B.positionWorld);q.v1.positionScreen.copy(aa.positionScreen);q.v2.positionScreen.copy(p.positionScreen);q.v3.positionScreen.copy(B.positionScreen);q.normalWorld.copy(k.normalWorld);q.centroidWorld.copy(k.centroidWorld);q.centroidScreen.copy(k.centroidScreen);q.z=q.centroidScreen.z;
-q.meshMaterials=g;q.faceMaterials=r.materials;q.overdraw=t;if(i.geometry.uvs[K]){q.uvs[0]=i.geometry.uvs[K][1];q.uvs[1]=i.geometry.uvs[K][2];q.uvs[2]=i.geometry.uvs[K][3]}G.push(q);o++}}}}else if(i instanceof THREE.Line){O.multiply(s,n);u=i.geometry.vertices;r=u[0];r.positionScreen.copy(r.position);O.multiplyVector4(r.positionScreen);K=1;for(ca=u.length;K<ca;K++){N=u[K];N.positionScreen.copy(N.position);O.multiplyVector4(N.positionScreen);aa=u[K-1];b.copy(N.positionScreen);R.copy(aa.positionScreen);
-if(c(b,R)){b.multiplyScalar(1/b.w);R.multiplyScalar(1/R.w);m=y[z]=y[z]||new THREE.RenderableLine;m.v1.positionScreen.copy(b);m.v2.positionScreen.copy(R);m.z=Math.max(b.z,R.z);m.materials=i.materials;G.push(m);z++}}}else if(i instanceof THREE.Particle){I.set(i.position.x,i.position.y,i.position.z,1);s.multiplyVector4(I);I.z/=I.w;if(I.z>0&&I.z<1){v=F[x]=F[x]||new THREE.RenderableParticle;v.x=I.x/I.w;v.y=I.y/I.w;v.z=I.z;v.rotation=i.rotation.z;v.scale.x=i.scale.x*Math.abs(v.x-(I.x+J.projectionMatrix.n11)/
-(I.w+J.projectionMatrix.n14));v.scale.y=i.scale.y*Math.abs(v.y-(I.y+J.projectionMatrix.n22)/(I.w+J.projectionMatrix.n24));v.materials=i.materials;G.push(v);x++}}}}X&&G.sort(a);return G};this.unprojectVector=function(Q,J){var X=THREE.Matrix4.makeInvert(J.matrix);X.multiplySelf(THREE.Matrix4.makeInvert(J.projectionMatrix));X.multiplyVector3(Q);return Q}};
-THREE.DOMRenderer=function(){THREE.Renderer.call(this);var a=null,c=new THREE.Projector,d,f,j,k;this.domElement=document.createElement("div");this.setSize=function(q,o){d=q;f=o;j=d/2;k=f/2};this.render=function(q,o){var l,m,z,y,v,x,F,H;a=c.projectScene(q,o);l=0;for(m=a.length;l<m;l++){v=a[l];if(v instanceof THREE.RenderableParticle){F=v.x*j+j;H=v.y*k+k;z=0;for(y=v.material.length;z<y;z++){x=v.material[z];if(x instanceof THREE.ParticleDOMMaterial){x=x.domElement;x.style.left=F+"px";x.style.top=H+"px"}}}}}};
-THREE.CanvasRenderer=function(){function a(W){if(v!=W)m.globalAlpha=v=W}function c(W){if(x!=W){switch(W){case THREE.NormalBlending:m.globalCompositeOperation="source-over";break;case THREE.AdditiveBlending:m.globalCompositeOperation="lighter";break;case THREE.SubtractiveBlending:m.globalCompositeOperation="darker"}x=W}}var d=null,f=new THREE.Projector,j=document.createElement("canvas"),k,q,o,l,m=j.getContext("2d"),z=new THREE.Color(0),y=0,v=1,x=0,F=null,H=null,I=1,s,O,C,b,R,$,Q,J,X,G=new THREE.Color,
-U=new THREE.Color,M=new THREE.Color,D=new THREE.Color,K=new THREE.Color,ca,N,aa,e,i,n,h,g,t,w=new THREE.Rectangle,u=new THREE.Rectangle,r=new THREE.Rectangle,p=false,B=new THREE.Color,V=new THREE.Color,da=new THREE.Color,ea=new THREE.Color,ia=Math.PI*2,S=new THREE.Vector3,Y,pa,P,ka,oa,wa,fa=16;Y=document.createElement("canvas");Y.width=Y.height=2;pa=Y.getContext("2d");pa.fillStyle="rgba(0,0,0,1)";pa.fillRect(0,0,2,2);P=pa.getImageData(0,0,2,2);ka=P.data;oa=document.createElement("canvas");oa.width=
-oa.height=fa;wa=oa.getContext("2d");wa.translate(-fa/2,-fa/2);wa.scale(fa,fa);fa--;this.domElement=j;this.sortElements=this.sortObjects=this.autoClear=true;this.setSize=function(W,ba){k=W;q=ba;o=k/2;l=q/2;j.width=k;j.height=q;w.set(-o,-l,o,l);v=1;x=0;H=F=null;I=1};this.setClearColor=function(W,ba){z=W;y=ba;u.set(-o,-l,o,l);m.setTransform(1,0,0,-1,o,l);this.clear()};this.setClearColorHex=function(W,ba){z.setHex(W);y=ba;u.set(-o,-l,o,l);m.setTransform(1,0,0,-1,o,l);this.clear()};this.clear=function(){m.setTransform(1,
-0,0,-1,o,l);if(!u.isEmpty()){u.inflate(1);u.minSelf(w);if(z.hex==0&&y==0)m.clearRect(u.getX(),u.getY(),u.getWidth(),u.getHeight());else{c(THREE.NormalBlending);a(1);m.fillStyle="rgba("+Math.floor(z.r*255)+","+Math.floor(z.g*255)+","+Math.floor(z.b*255)+","+y+")";m.fillRect(u.getX(),u.getY(),u.getWidth(),u.getHeight())}u.empty()}};this.render=function(W,ba){function Ca(A){var Z,T,E,L=A.lights;V.setRGB(0,0,0);da.setRGB(0,0,0);ea.setRGB(0,0,0);A=0;for(Z=L.length;A<Z;A++){T=L[A];E=T.color;if(T instanceof
-THREE.AmbientLight){V.r+=E.r;V.g+=E.g;V.b+=E.b}else if(T instanceof THREE.DirectionalLight){da.r+=E.r;da.g+=E.g;da.b+=E.b}else if(T instanceof THREE.PointLight){ea.r+=E.r;ea.g+=E.g;ea.b+=E.b}}}function qa(A,Z,T,E){var L,ha,ra,xa,za=A.lights;A=0;for(L=za.length;A<L;A++){ha=za[A];ra=ha.color;xa=ha.intensity;if(ha instanceof THREE.DirectionalLight){ha=T.dot(ha.position)*xa;if(ha>0){E.r+=ra.r*ha;E.g+=ra.g*ha;E.b+=ra.b*ha}}else if(ha instanceof THREE.PointLight){S.sub(ha.position,Z);S.normalize();ha=T.dot(S)*
-xa;if(ha>0){E.r+=ra.r*ha;E.g+=ra.g*ha;E.b+=ra.b*ha}}}}function la(A,Z,T){if(T.opacity!=0){a(T.opacity);c(T.blending);var E,L,ha,ra,xa,za;if(T instanceof THREE.ParticleBasicMaterial){if(T.map&&T.map.image.loaded){ra=T.map.image;xa=ra.width>>1;za=ra.height>>1;L=Z.scale.x*o;ha=Z.scale.y*l;T=L*xa;E=ha*za;r.set(A.x-T,A.y-E,A.x+T,A.y+E);if(!w.instersects(r))return;m.save();m.translate(A.x,A.y);m.rotate(-Z.rotation);m.scale(L,-ha);m.translate(-xa,-za);m.drawImage(ra,0,0);m.restore()}m.beginPath();m.moveTo(A.x-
-10,A.y);m.lineTo(A.x+10,A.y);m.moveTo(A.x,A.y-10);m.lineTo(A.x,A.y+10);m.closePath();m.strokeStyle="rgb(255,255,0)";m.stroke()}else if(T instanceof THREE.ParticleCircleMaterial){if(p){B.r=V.r+da.r+ea.r;B.g=V.g+da.g+ea.g;B.b=V.b+da.b+ea.b;G.r=T.color.r*B.r;G.g=T.color.g*B.g;G.b=T.color.b*B.b;G.updateStyleString()}else G.__styleString=T.color.__styleString;T=Z.scale.x*o;E=Z.scale.y*l;r.set(A.x-T,A.y-E,A.x+T,A.y+E);if(w.instersects(r)){L=G.__styleString;if(H!=L)m.fillStyle=H=L;m.save();m.translate(A.x,
-A.y);m.rotate(-Z.rotation);m.scale(T,E);m.beginPath();m.arc(0,0,1,0,ia,true);m.closePath();m.fill();m.restore()}}}}function na(A,Z,T,E){if(E.opacity!=0){a(E.opacity);c(E.blending);m.beginPath();m.moveTo(A.positionScreen.x,A.positionScreen.y);m.lineTo(Z.positionScreen.x,Z.positionScreen.y);m.closePath();if(E instanceof THREE.LineBasicMaterial){G.__styleString=E.color.__styleString;A=E.linewidth;if(I!=A)m.lineWidth=I=A;A=G.__styleString;if(F!=A)m.strokeStyle=F=A;m.stroke();r.inflate(E.linewidth*2)}}}
-function Ja(A,Z,T,E,L,ha){if(L.opacity!=0){a(L.opacity);c(L.blending);b=A.positionScreen.x;R=A.positionScreen.y;$=Z.positionScreen.x;Q=Z.positionScreen.y;J=T.positionScreen.x;X=T.positionScreen.y;m.beginPath();m.moveTo(b,R);m.lineTo($,Q);m.lineTo(J,X);m.lineTo(b,R);m.closePath();if(L instanceof THREE.MeshBasicMaterial)if(L.map)L.map.image.loaded&&L.map.mapping instanceof THREE.UVMapping&&ga(b,R,$,Q,J,X,L.map.image,E.uvs[0].u,E.uvs[0].v,E.uvs[1].u,E.uvs[1].v,E.uvs[2].u,E.uvs[2].v);else if(L.env_map){if(L.env_map.image.loaded)if(L.env_map.mapping instanceof
-THREE.SphericalReflectionMapping){A=ba.matrix;S.copy(E.vertexNormalsWorld[0]);e=(S.x*A.n11+S.y*A.n12+S.z*A.n13)*0.5+0.5;i=-(S.x*A.n21+S.y*A.n22+S.z*A.n23)*0.5+0.5;S.copy(E.vertexNormalsWorld[1]);n=(S.x*A.n11+S.y*A.n12+S.z*A.n13)*0.5+0.5;h=-(S.x*A.n21+S.y*A.n22+S.z*A.n23)*0.5+0.5;S.copy(E.vertexNormalsWorld[2]);g=(S.x*A.n11+S.y*A.n12+S.z*A.n13)*0.5+0.5;t=-(S.x*A.n21+S.y*A.n22+S.z*A.n23)*0.5+0.5;ga(b,R,$,Q,J,X,L.env_map.image,e,i,n,h,g,t)}}else L.wireframe?Da(L.color.__styleString,L.wireframe_linewidth):
-va(L.color.__styleString);else if(L instanceof THREE.MeshLambertMaterial){if(L.map&&!L.wireframe){L.map.mapping instanceof THREE.UVMapping&&ga(b,R,$,Q,J,X,L.map.image,E.uvs[0].u,E.uvs[0].v,E.uvs[1].u,E.uvs[1].v,E.uvs[2].u,E.uvs[2].v);c(THREE.SubtractiveBlending)}if(p)if(!L.wireframe&&L.shading==THREE.SmoothShading&&E.vertexNormalsWorld.length==3){U.r=M.r=D.r=V.r;U.g=M.g=D.g=V.g;U.b=M.b=D.b=V.b;qa(ha,E.v1.positionWorld,E.vertexNormalsWorld[0],U);qa(ha,E.v2.positionWorld,E.vertexNormalsWorld[1],M);
-qa(ha,E.v3.positionWorld,E.vertexNormalsWorld[2],D);K.r=(M.r+D.r)*0.5;K.g=(M.g+D.g)*0.5;K.b=(M.b+D.b)*0.5;aa=ma(U,M,D,K);ga(b,R,$,Q,J,X,aa,0,0,1,0,0,1)}else{B.r=V.r;B.g=V.g;B.b=V.b;qa(ha,E.centroidWorld,E.normalWorld,B);G.r=L.color.r*B.r;G.g=L.color.g*B.g;G.b=L.color.b*B.b;G.updateStyleString();L.wireframe?Da(G.__styleString,L.wireframe_linewidth):va(G.__styleString)}else L.wireframe?Da(L.color.__styleString,L.wireframe_linewidth):va(L.color.__styleString)}else if(L instanceof THREE.MeshDepthMaterial){ca=
-ba.near;N=ba.far;U.r=U.g=U.b=1-Aa(A.positionScreen.z,ca,N);M.r=M.g=M.b=1-Aa(Z.positionScreen.z,ca,N);D.r=D.g=D.b=1-Aa(T.positionScreen.z,ca,N);K.r=(M.r+D.r)*0.5;K.g=(M.g+D.g)*0.5;K.b=(M.b+D.b)*0.5;aa=ma(U,M,D,K);ga(b,R,$,Q,J,X,aa,0,0,1,0,0,1)}else if(L instanceof THREE.MeshNormalMaterial){G.r=ta(E.normalWorld.x);G.g=ta(E.normalWorld.y);G.b=ta(E.normalWorld.z);G.updateStyleString();L.wireframe?Da(G.__styleString,L.wireframe_linewidth):va(G.__styleString)}}}function Da(A,Z){if(F!=A)m.strokeStyle=F=
-A;if(I!=Z)m.lineWidth=I=Z;m.stroke();r.inflate(Z*2)}function va(A){if(H!=A)m.fillStyle=H=A;m.fill()}function ga(A,Z,T,E,L,ha,ra,xa,za,Ga,Ba,Ha,Oa){var Ea,Ia;Ea=ra.width-1;Ia=ra.height-1;xa*=Ea;za*=Ia;Ga*=Ea;Ba*=Ia;Ha*=Ea;Oa*=Ia;T-=A;E-=Z;L-=A;ha-=Z;Ga-=xa;Ba-=za;Ha-=xa;Oa-=za;Ea=Ga*Oa-Ha*Ba;if(Ea!=0){Ia=1/Ea;Ea=(Oa*T-Ba*L)*Ia;Ba=(Oa*E-Ba*ha)*Ia;T=(Ga*L-Ha*T)*Ia;E=(Ga*ha-Ha*E)*Ia;A=A-Ea*xa-T*za;Z=Z-Ba*xa-E*za;m.save();m.transform(Ea,Ba,T,E,A,Z);m.clip();m.drawImage(ra,0,0);m.restore()}}function ma(A,
-Z,T,E){var L=~~(A.r*255),ha=~~(A.g*255);A=~~(A.b*255);var ra=~~(Z.r*255),xa=~~(Z.g*255);Z=~~(Z.b*255);var za=~~(T.r*255),Ga=~~(T.g*255);T=~~(T.b*255);var Ba=~~(E.r*255),Ha=~~(E.g*255);E=~~(E.b*255);ka[0]=L<0?0:L>255?255:L;ka[1]=ha<0?0:ha>255?255:ha;ka[2]=A<0?0:A>255?255:A;ka[4]=ra<0?0:ra>255?255:ra;ka[5]=xa<0?0:xa>255?255:xa;ka[6]=Z<0?0:Z>255?255:Z;ka[8]=za<0?0:za>255?255:za;ka[9]=Ga<0?0:Ga>255?255:Ga;ka[10]=T<0?0:T>255?255:T;ka[12]=Ba<0?0:Ba>255?255:Ba;ka[13]=Ha<0?0:Ha>255?255:Ha;ka[14]=E<0?0:E>
-255?255:E;pa.putImageData(P,0,0);wa.drawImage(Y,0,0);return oa}function Aa(A,Z,T){A=(A-Z)/(T-Z);return A*A*(3-2*A)}function ta(A){A=(A+1)*0.5;return A<0?0:A>1?1:A}function La(A,Z){var T=Z.x-A.x,E=Z.y-A.y,L=1/Math.sqrt(T*T+E*E);T*=L;E*=L;Z.x+=T;Z.y+=E;A.x-=T;A.y-=E}var ua,Ma,ja,ya,Fa,Ka,Na,sa;this.autoClear?this.clear():m.setTransform(1,0,0,-1,o,l);d=f.projectScene(W,ba,this.sortElements);m.fillStyle="rgba( 0, 255, 255, 0.5 )";m.fillRect(w.getX(),w.getY(),w.getWidth(),w.getHeight());(p=W.lights.length>
-0)&&Ca(W);ua=0;for(Ma=d.length;ua<Ma;ua++){ja=d[ua];r.empty();if(ja instanceof THREE.RenderableParticle){s=ja;s.x*=o;s.y*=l;ya=0;for(Fa=ja.materials.length;ya<Fa;ya++)la(s,ja,ja.materials[ya],W)}else if(ja instanceof THREE.RenderableLine){s=ja.v1;O=ja.v2;s.positionScreen.x*=o;s.positionScreen.y*=l;O.positionScreen.x*=o;O.positionScreen.y*=l;r.addPoint(s.positionScreen.x,s.positionScreen.y);r.addPoint(O.positionScreen.x,O.positionScreen.y);if(w.instersects(r)){ya=0;for(Fa=ja.materials.length;ya<Fa;)na(s,
-O,ja,ja.materials[ya++],W)}}else if(ja instanceof THREE.RenderableFace3){s=ja.v1;O=ja.v2;C=ja.v3;s.positionScreen.x*=o;s.positionScreen.y*=l;O.positionScreen.x*=o;O.positionScreen.y*=l;C.positionScreen.x*=o;C.positionScreen.y*=l;if(ja.overdraw){La(s.positionScreen,O.positionScreen);La(O.positionScreen,C.positionScreen);La(C.positionScreen,s.positionScreen)}r.add3Points(s.positionScreen.x,s.positionScreen.y,O.positionScreen.x,O.positionScreen.y,C.positionScreen.x,C.positionScreen.y);if(w.instersects(r)){ya=
-0;for(Fa=ja.meshMaterials.length;ya<Fa;){sa=ja.meshMaterials[ya++];if(sa instanceof THREE.MeshFaceMaterial){Ka=0;for(Na=ja.faceMaterials.length;Ka<Na;)(sa=ja.faceMaterials[Ka++])&&Ja(s,O,C,ja,sa,W)}else Ja(s,O,C,ja,sa,W)}}}u.addRectangle(r)}m.lineWidth=1;m.strokeStyle="rgba( 255, 0, 0, 0.5 )";m.strokeRect(u.getX(),u.getY(),u.getWidth(),u.getHeight());m.setTransform(1,0,0,1,0,0)}};
-THREE.SVGRenderer=function(){function a(e,i,n){var h,g,t,w;h=0;for(g=e.lights.length;h<g;h++){t=e.lights[h];if(t instanceof THREE.DirectionalLight){w=i.normalWorld.dot(t.position)*t.intensity;if(w>0){n.r+=t.color.r*w;n.g+=t.color.g*w;n.b+=t.color.b*w}}else if(t instanceof THREE.PointLight){X.sub(t.position,i.centroidWorld);X.normalize();w=i.normalWorld.dot(X)*t.intensity;if(w>0){n.r+=t.color.r*w;n.g+=t.color.g*w;n.b+=t.color.b*w}}}}function c(e,i,n,h,g,t){D=f(K++);D.setAttribute("d","M "+e.positionScreen.x+
-" "+e.positionScreen.y+" L "+i.positionScreen.x+" "+i.positionScreen.y+" L "+n.positionScreen.x+","+n.positionScreen.y+"z");if(g instanceof THREE.MeshBasicMaterial)C.__styleString=g.color.__styleString;else if(g instanceof THREE.MeshLambertMaterial)if(O){b.r=R.r;b.g=R.g;b.b=R.b;a(t,h,b);C.r=g.color.r*b.r;C.g=g.color.g*b.g;C.b=g.color.b*b.b;C.updateStyleString()}else C.__styleString=g.color.__styleString;else if(g instanceof THREE.MeshDepthMaterial){J=1-g.__2near/(g.__farPlusNear-h.z*g.__farMinusNear);
-C.setRGB(J,J,J)}else g instanceof THREE.MeshNormalMaterial&&C.setRGB(j(h.normalWorld.x),j(h.normalWorld.y),j(h.normalWorld.z));g.wireframe?D.setAttribute("style","fill: none; stroke: "+C.__styleString+"; stroke-width: "+g.wireframe_linewidth+"; stroke-opacity: "+g.opacity+"; stroke-linecap: "+g.wireframe_linecap+"; stroke-linejoin: "+g.wireframe_linejoin):D.setAttribute("style","fill: "+C.__styleString+"; fill-opacity: "+g.opacity);o.appendChild(D)}function d(e,i,n,h,g,t,w){D=f(K++);D.setAttribute("d",
-"M "+e.positionScreen.x+" "+e.positionScreen.y+" L "+i.positionScreen.x+" "+i.positionScreen.y+" L "+n.positionScreen.x+","+n.positionScreen.y+" L "+h.positionScreen.x+","+h.positionScreen.y+"z");if(t instanceof THREE.MeshBasicMaterial)C.__styleString=t.color.__styleString;else if(t instanceof THREE.MeshLambertMaterial)if(O){b.r=R.r;b.g=R.g;b.b=R.b;a(w,g,b);C.r=t.color.r*b.r;C.g=t.color.g*b.g;C.b=t.color.b*b.b;C.updateStyleString()}else C.__styleString=t.color.__styleString;else if(t instanceof THREE.MeshDepthMaterial){J=
-1-t.__2near/(t.__farPlusNear-g.z*t.__farMinusNear);C.setRGB(J,J,J)}else t instanceof THREE.MeshNormalMaterial&&C.setRGB(j(g.normalWorld.x),j(g.normalWorld.y),j(g.normalWorld.z));t.wireframe?D.setAttribute("style","fill: none; stroke: "+C.__styleString+"; stroke-width: "+t.wireframe_linewidth+"; stroke-opacity: "+t.opacity+"; stroke-linecap: "+t.wireframe_linecap+"; stroke-linejoin: "+t.wireframe_linejoin):D.setAttribute("style","fill: "+C.__styleString+"; fill-opacity: "+t.opacity);o.appendChild(D)}
-function f(e){if(G[e]==null){G[e]=document.createElementNS("http://www.w3.org/2000/svg","path");aa==0&&G[e].setAttribute("shape-rendering","crispEdges");return G[e]}return G[e]}function j(e){return e<0?Math.min((1+e)*0.5,0.5):0.5+Math.min(e*0.5,0.5)}var k=null,q=new THREE.Projector,o=document.createElementNS("http://www.w3.org/2000/svg","svg"),l,m,z,y,v,x,F,H,I=new THREE.Rectangle,s=new THREE.Rectangle,O=false,C=new THREE.Color(16777215),b=new THREE.Color(16777215),R=new THREE.Color(0),$=new THREE.Color(0),
-Q=new THREE.Color(0),J,X=new THREE.Vector3,G=[],U=[],M=[],D,K,ca,N,aa=1;this.domElement=o;this.sortElements=this.sortObjects=this.autoClear=true;this.setQuality=function(e){switch(e){case "high":aa=1;break;case "low":aa=0}};this.setSize=function(e,i){l=e;m=i;z=l/2;y=m/2;o.setAttribute("viewBox",-z+" "+-y+" "+l+" "+m);o.setAttribute("width",l);o.setAttribute("height",m);I.set(-z,-y,z,y)};this.clear=function(){for(;o.childNodes.length>0;)o.removeChild(o.childNodes[0])};this.render=function(e,i){var n,
-h,g,t,w,u,r,p;this.autoClear&&this.clear();k=q.projectScene(e,i,this.sortElements);N=ca=K=0;if(O=e.lights.length>0){r=e.lights;R.setRGB(0,0,0);$.setRGB(0,0,0);Q.setRGB(0,0,0);n=0;for(h=r.length;n<h;n++){g=r[n];t=g.color;if(g instanceof THREE.AmbientLight){R.r+=t.r;R.g+=t.g;R.b+=t.b}else if(g instanceof THREE.DirectionalLight){$.r+=t.r;$.g+=t.g;$.b+=t.b}else if(g instanceof THREE.PointLight){Q.r+=t.r;Q.g+=t.g;Q.b+=t.b}}}n=0;for(h=k.length;n<h;n++){r=k[n];s.empty();if(r instanceof THREE.RenderableParticle){v=
-r;v.x*=z;v.y*=-y;g=0;for(t=r.materials.length;g<t;g++)if(p=r.materials[g]){w=v;u=r;p=p;var B=ca++;if(U[B]==null){U[B]=document.createElementNS("http://www.w3.org/2000/svg","circle");aa==0&&U[B].setAttribute("shape-rendering","crispEdges")}D=U[B];D.setAttribute("cx",w.x);D.setAttribute("cy",w.y);D.setAttribute("r",u.scale.x*z);if(p instanceof THREE.ParticleCircleMaterial){if(O){b.r=R.r+$.r+Q.r;b.g=R.g+$.g+Q.g;b.b=R.b+$.b+Q.b;C.r=p.color.r*b.r;C.g=p.color.g*b.g;C.b=p.color.b*b.b;C.updateStyleString()}else C=
-p.color;D.setAttribute("style","fill: "+C.__styleString)}o.appendChild(D)}}else if(r instanceof THREE.RenderableLine){v=r.v1;x=r.v2;v.positionScreen.x*=z;v.positionScreen.y*=-y;x.positionScreen.x*=z;x.positionScreen.y*=-y;s.addPoint(v.positionScreen.x,v.positionScreen.y);s.addPoint(x.positionScreen.x,x.positionScreen.y);if(I.instersects(s)){g=0;for(t=r.materials.length;g<t;)if(p=r.materials[g++]){w=v;u=x;p=p;B=N++;if(M[B]==null){M[B]=document.createElementNS("http://www.w3.org/2000/svg","line");aa==
-0&&M[B].setAttribute("shape-rendering","crispEdges")}D=M[B];D.setAttribute("x1",w.positionScreen.x);D.setAttribute("y1",w.positionScreen.y);D.setAttribute("x2",u.positionScreen.x);D.setAttribute("y2",u.positionScreen.y);if(p instanceof THREE.LineBasicMaterial){C.__styleString=p.color.__styleString;D.setAttribute("style","fill: none; stroke: "+C.__styleString+"; stroke-width: "+p.linewidth+"; stroke-opacity: "+p.opacity+"; stroke-linecap: "+p.linecap+"; stroke-linejoin: "+p.linejoin);o.appendChild(D)}}}}else if(r instanceof
-THREE.RenderableFace3){v=r.v1;x=r.v2;F=r.v3;v.positionScreen.x*=z;v.positionScreen.y*=-y;x.positionScreen.x*=z;x.positionScreen.y*=-y;F.positionScreen.x*=z;F.positionScreen.y*=-y;s.addPoint(v.positionScreen.x,v.positionScreen.y);s.addPoint(x.positionScreen.x,x.positionScreen.y);s.addPoint(F.positionScreen.x,F.positionScreen.y);if(I.instersects(s)){g=0;for(t=r.meshMaterials.length;g<t;){p=r.meshMaterials[g++];if(p instanceof THREE.MeshFaceMaterial){w=0;for(u=r.faceMaterials.length;w<u;)(p=r.faceMaterials[w++])&&
-c(v,x,F,r,p,e)}else p&&c(v,x,F,r,p,e)}}}else if(r instanceof THREE.RenderableFace4){v=r.v1;x=r.v2;F=r.v3;H=r.v4;v.positionScreen.x*=z;v.positionScreen.y*=-y;x.positionScreen.x*=z;x.positionScreen.y*=-y;F.positionScreen.x*=z;F.positionScreen.y*=-y;H.positionScreen.x*=z;H.positionScreen.y*=-y;s.addPoint(v.positionScreen.x,v.positionScreen.y);s.addPoint(x.positionScreen.x,x.positionScreen.y);s.addPoint(F.positionScreen.x,F.positionScreen.y);s.addPoint(H.positionScreen.x,H.positionScreen.y);if(I.instersects(s)){g=
-0;for(t=r.meshMaterials.length;g<t;){p=r.meshMaterials[g++];if(p instanceof THREE.MeshFaceMaterial){w=0;for(u=r.faceMaterials.length;w<u;)(p=r.faceMaterials[w++])&&d(v,x,F,H,r,p,e)}else p&&d(v,x,F,H,r,p,e)}}}}}};
-THREE.WebGLRenderer=function(a){function c(e,i,n){var h,g,t,w=e.vertices,u=w.length,r=e.colors,p=r.length,B=e.__vertexArray,V=e.__colorArray,da=e.__sortArray,ea=e.__dirtyVertices,ia=e.__dirtyColors;if(n.sortParticles){U.multiplySelf(n.matrixWorld);for(h=0;h<u;h++){g=w[h].position;K.copy(g);U.multiplyVector3(K);da[h]=[K.z,h]}da.sort(function(S,Y){return Y[0]-S[0]});for(h=0;h<u;h++){g=w[da[h][1]].position;t=h*3;B[t]=g.x;B[t+1]=g.y;B[t+2]=g.z}for(h=0;h<p;h++){t=h*3;color=r[da[h][1]];V[t]=color.r;V[t+
-1]=color.g;V[t+2]=color.b}}else{if(ea)for(h=0;h<u;h++){g=w[h].position;t=h*3;B[t]=g.x;B[t+1]=g.y;B[t+2]=g.z}if(ia)for(h=0;h<p;h++){color=r[h];t=h*3;V[t]=color.r;V[t+1]=color.g;V[t+2]=color.b}}if(ea||n.sortParticles){b.bindBuffer(b.ARRAY_BUFFER,e.__webGLVertexBuffer);b.bufferData(b.ARRAY_BUFFER,B,i)}if(ia||n.sortParticles){b.bindBuffer(b.ARRAY_BUFFER,e.__webGLColorBuffer);b.bufferData(b.ARRAY_BUFFER,V,i)}}function d(e,i){e.fragment_shader=i.fragment_shader;e.vertex_shader=i.vertex_shader;e.uniforms=
-Uniforms.clone(i.uniforms)}function f(e,i){if(!e.__webGLVertexBuffer)e.__webGLVertexBuffer=b.createBuffer();if(!e.__webGLNormalBuffer)e.__webGLNormalBuffer=b.createBuffer();if(e.hasPos){b.bindBuffer(b.ARRAY_BUFFER,e.__webGLVertexBuffer);b.bufferData(b.ARRAY_BUFFER,e.positionArray,b.DYNAMIC_DRAW);b.enableVertexAttribArray(i.attributes.position);b.vertexAttribPointer(i.attributes.position,3,b.FLOAT,false,0,0)}if(e.hasNormal){b.bindBuffer(b.ARRAY_BUFFER,e.__webGLNormalBuffer);b.bufferData(b.ARRAY_BUFFER,
-e.normalArray,b.DYNAMIC_DRAW);b.enableVertexAttribArray(i.attributes.normal);b.vertexAttribPointer(i.attributes.normal,3,b.FLOAT,false,0,0)}b.drawArrays(b.TRIANGLES,0,e.count);e.count=0}function j(e){if(Q!=e.doubleSided){e.doubleSided?b.disable(b.CULL_FACE):b.enable(b.CULL_FACE);Q=e.doubleSided}if(J!=e.flipSided){e.flipSided?b.frontFace(b.CW):b.frontFace(b.CCW);J=e.flipSided}}function k(e){G[0].set(e.n41-e.n11,e.n42-e.n12,e.n43-e.n13,e.n44-e.n14);G[1].set(e.n41+e.n11,e.n42+e.n12,e.n43+e.n13,e.n44+
-e.n14);G[2].set(e.n41+e.n21,e.n42+e.n22,e.n43+e.n23,e.n44+e.n24);G[3].set(e.n41-e.n21,e.n42-e.n22,e.n43-e.n23,e.n44-e.n24);G[4].set(e.n41-e.n31,e.n42-e.n32,e.n43-e.n33,e.n44-e.n34);G[5].set(e.n41+e.n31,e.n42+e.n32,e.n43+e.n33,e.n44+e.n34);var i;for(e=0;e<5;e++){i=G[e];i.divideScalar(Math.sqrt(i.x*i.x+i.y*i.y+i.z*i.z))}}function q(e){for(var i=e.matrix,n=-e.geometry.boundingSphere.radius*Math.max(e.scale.x,Math.max(e.scale.y,e.scale.z)),h=0;h<6;h++){e=G[h].x*i.n14+G[h].y*i.n24+G[h].z*i.n34+G[h].w;
-if(e<=n)return false}return true}function o(e,i){e.list[e.count]=i;e.count+=1}function l(e){var i,n,h=e.object,g=e.opaque,t=e.transparent;t.count=0;e=g.count=0;for(i=h.materials.length;e<i;e++){n=h.materials[e];n.opacity&&n.opacity<1||n.blending!=THREE.NormalBlending?o(t,n):o(g,n)}}function m(e){var i,n,h,g,t=e.object,w=e.buffer,u=e.opaque,r=e.transparent;r.count=0;e=u.count=0;for(h=t.materials.length;e<h;e++){i=t.materials[e];if(i instanceof THREE.MeshFaceMaterial){i=0;for(n=w.materials.length;i<
-n;i++)if(g=w.materials[i])g.opacity&&g.opacity<1||g.blending!=THREE.NormalBlending?o(r,g):o(u,g)}else{g=i;g.opacity&&g.opacity<1||g.blending!=THREE.NormalBlending?o(r,g):o(u,g)}}}function z(e){var i,n,h,g=e.children;i=0;for(n=g.length;i<n;i++){h=g[i];h.autoUpdateMatrix&&h.updateMatrix();h.matrixWorld.multiply(e.matrixWorld,h.matrix);z(h)}}function y(e,i){var n,h,g=i.children;n=0;for(h=g.length;n<h;n++){child=g[n];v(e,child,false);y(e,child)}}function v(e,i,n){var h,g,t;g=i.geometry;if(e.__webGLObjectsMap[i.id]==
-undefined){e.__webGLObjectsMap[i.id]={};i._modelViewMatrix=new THREE.Matrix4;i._normalMatrixArray=new Float32Array(9);i._modelViewMatrixArray=new Float32Array(16);i._objectMatrixArray=new Float32Array(16);i.matrix.flattenToArray(i._objectMatrixArray)}t=e.__webGLObjectsMap[i.id];objlist=e.__webGLObjects;if(i instanceof THREE.Mesh){for(h in g.geometryChunks){e=g.geometryChunks[h];if(!e.__webGLVertexBuffer){var w=e;w.__webGLVertexBuffer=b.createBuffer();w.__webGLNormalBuffer=b.createBuffer();w.__webGLTangentBuffer=
-b.createBuffer();w.__webGLColorBuffer=b.createBuffer();w.__webGLUVBuffer=b.createBuffer();w.__webGLUV2Buffer=b.createBuffer();w.__webGLFaceBuffer=b.createBuffer();w.__webGLLineBuffer=b.createBuffer();w=e;var u=i,r=void 0,p=void 0,B=0,V=0,da=0,ea=u.geometry.faces,ia=w.faces;r=0;for(p=ia.length;r<p;r++){fi=ia[r];face=ea[fi];if(face instanceof THREE.Face3){B+=3;V+=1;da+=3}else if(face instanceof THREE.Face4){B+=4;V+=2;da+=4}}w.__vertexArray=new Float32Array(B*3);w.__normalArray=new Float32Array(B*3);
-w.__tangentArray=new Float32Array(B*4);w.__colorArray=new Float32Array(B*3);w.__uvArray=new Float32Array(B*2);w.__uv2Array=new Float32Array(B*2);w.__faceArray=new Uint16Array(V*3);w.__lineArray=new Uint16Array(da*2);p=r=w;u=u;B=void 0;ea=void 0;var S=void 0,Y=void 0;S=void 0;ia=false;B=0;for(ea=u.materials.length;B<ea;B++){S=u.materials[B];if(S instanceof THREE.MeshFaceMaterial){S=0;for(Y=p.materials.length;S<Y;S++)if(p.materials[S]&&p.materials[S].shading!=undefined&&p.materials[S].shading==THREE.SmoothShading){ia=
-true;break}}else if(S&&S.shading!=undefined&&S.shading==THREE.SmoothShading){ia=true;break}if(ia)break}r.__needsSmoothNormals=ia;w.__webGLFaceCount=V*3;w.__webGLLineCount=da*2;g.__dirtyVertices=true;g.__dirtyElements=true;g.__dirtyUvs=true;g.__dirtyNormals=true;g.__dirtyTangents=true;g.__dirtyColors=true}if(g.__dirtyVertices||g.__dirtyElements||g.__dirtyUvs||g.__dirtyNormals||g.__dirtyColors||g.__dirtyTangents){w=e;V=b.DYNAMIC_DRAW;da=void 0;r=void 0;var pa=void 0,P=void 0,ka=void 0,oa=void 0,wa=
-void 0;pa=void 0;var fa=void 0,W=void 0,ba=void 0,Ca=void 0;fa=void 0;W=void 0;ba=void 0;P=void 0;fa=void 0;W=void 0;ba=void 0;Ca=void 0;P=void 0;oa=void 0;ka=void 0;wa=void 0;var qa=Y=S=ia=ea=B=u=p=0,la=0,na=w.__vertexArray,Ja=w.__uvArray,Da=w.__uv2Array,va=w.__normalArray,ga=w.__tangentArray,ma=w.__colorArray,Aa=w.__faceArray,ta=w.__lineArray,La=w.__needsSmoothNormals,ua=i.geometry,Ma=ua.__dirtyVertices,ja=ua.__dirtyElements,ya=ua.__dirtyUvs,Fa=ua.__dirtyNormals,Ka=ua.__dirtyTangents,Na=ua.__dirtyColors,
-sa=ua.vertices,A=w.faces,Z=ua.faces,T=ua.uvs,E=ua.uvs2,L=ua.colors;da=0;for(r=A.length;da<r;da++){pa=A[da];P=Z[pa];wa=T[pa];pa=E[pa];ka=P.vertexNormals;oa=P.normal;if(P instanceof THREE.Face3){if(Ma){fa=sa[P.a].position;W=sa[P.b].position;ba=sa[P.c].position;na[u]=fa.x;na[u+1]=fa.y;na[u+2]=fa.z;na[u+3]=W.x;na[u+4]=W.y;na[u+5]=W.z;na[u+6]=ba.x;na[u+7]=ba.y;na[u+8]=ba.z;u+=9}if(Na&&L.length){fa=L[P.a];W=L[P.b];ba=L[P.c];ma[la]=fa.r;ma[la+1]=fa.g;ma[la+2]=fa.b;ma[la+3]=W.r;ma[la+4]=W.g;ma[la+5]=W.b;
-ma[la+6]=ba.r;ma[la+7]=ba.g;ma[la+8]=ba.b;la+=9}if(Ka&&ua.hasTangents){fa=sa[P.a].tangent;W=sa[P.b].tangent;ba=sa[P.c].tangent;ga[Y]=fa.x;ga[Y+1]=fa.y;ga[Y+2]=fa.z;ga[Y+3]=fa.w;ga[Y+4]=W.x;ga[Y+5]=W.y;ga[Y+6]=W.z;ga[Y+7]=W.w;ga[Y+8]=ba.x;ga[Y+9]=ba.y;ga[Y+10]=ba.z;ga[Y+11]=ba.w;Y+=12}if(Fa)if(ka.length==3&&La)for(P=0;P<3;P++){oa=ka[P];va[S]=oa.x;va[S+1]=oa.y;va[S+2]=oa.z;S+=3}else for(P=0;P<3;P++){va[S]=oa.x;va[S+1]=oa.y;va[S+2]=oa.z;S+=3}if(ya&&wa)for(P=0;P<3;P++){ka=wa[P];Ja[B]=ka.u;Ja[B+1]=ka.v;
-B+=2}if(ya&&pa)for(P=0;P<3;P++){wa=pa[P];Da[ea]=wa.u;Da[ea+1]=wa.v;ea+=2}if(ja){Aa[ia]=p;Aa[ia+1]=p+1;Aa[ia+2]=p+2;ia+=3;ta[qa]=p;ta[qa+1]=p+1;ta[qa+2]=p;ta[qa+3]=p+2;ta[qa+4]=p+1;ta[qa+5]=p+2;qa+=6;p+=3}}else if(P instanceof THREE.Face4){if(Ma){fa=sa[P.a].position;W=sa[P.b].position;ba=sa[P.c].position;Ca=sa[P.d].position;na[u]=fa.x;na[u+1]=fa.y;na[u+2]=fa.z;na[u+3]=W.x;na[u+4]=W.y;na[u+5]=W.z;na[u+6]=ba.x;na[u+7]=ba.y;na[u+8]=ba.z;na[u+9]=Ca.x;na[u+10]=Ca.y;na[u+11]=Ca.z;u+=12}if(Na&&L.length){fa=
-L[P.a];W=L[P.b];ba=L[P.c];Ca=L[P.d];ma[la]=fa.r;ma[la+1]=fa.g;ma[la+2]=fa.b;ma[la+3]=W.r;ma[la+4]=W.g;ma[la+5]=W.b;ma[la+6]=ba.r;ma[la+7]=ba.g;ma[la+8]=ba.b;ma[la+9]=Ca.r;ma[la+10]=Ca.g;ma[la+11]=Ca.b;la+=12}if(Ka&&ua.hasTangents){fa=sa[P.a].tangent;W=sa[P.b].tangent;ba=sa[P.c].tangent;P=sa[P.d].tangent;ga[Y]=fa.x;ga[Y+1]=fa.y;ga[Y+2]=fa.z;ga[Y+3]=fa.w;ga[Y+4]=W.x;ga[Y+5]=W.y;ga[Y+6]=W.z;ga[Y+7]=W.w;ga[Y+8]=ba.x;ga[Y+9]=ba.y;ga[Y+10]=ba.z;ga[Y+11]=ba.w;ga[Y+12]=P.x;ga[Y+13]=P.y;ga[Y+14]=P.z;ga[Y+
-15]=P.w;Y+=16}if(Fa)if(ka.length==4&&La)for(P=0;P<4;P++){oa=ka[P];va[S]=oa.x;va[S+1]=oa.y;va[S+2]=oa.z;S+=3}else for(P=0;P<4;P++){va[S]=oa.x;va[S+1]=oa.y;va[S+2]=oa.z;S+=3}if(ya&&wa)for(P=0;P<4;P++){ka=wa[P];Ja[B]=ka.u;Ja[B+1]=ka.v;B+=2}if(ya&&pa)for(P=0;P<4;P++){wa=pa[P];Da[ea]=wa.u;Da[ea+1]=wa.v;ea+=2}if(ja){Aa[ia]=p;Aa[ia+1]=p+1;Aa[ia+2]=p+2;Aa[ia+3]=p;Aa[ia+4]=p+2;Aa[ia+5]=p+3;ia+=6;ta[qa]=p;ta[qa+1]=p+1;ta[qa+2]=p;ta[qa+3]=p+3;ta[qa+4]=p+1;ta[qa+5]=p+2;ta[qa+6]=p+2;ta[qa+7]=p+3;qa+=8;p+=4}}}if(Ma){b.bindBuffer(b.ARRAY_BUFFER,
-w.__webGLVertexBuffer);b.bufferData(b.ARRAY_BUFFER,na,V)}if(Na&&L.length){b.bindBuffer(b.ARRAY_BUFFER,w.__webGLColorBuffer);b.bufferData(b.ARRAY_BUFFER,ma,V)}if(Fa){b.bindBuffer(b.ARRAY_BUFFER,w.__webGLNormalBuffer);b.bufferData(b.ARRAY_BUFFER,va,V)}if(Ka&&ua.hasTangents){b.bindBuffer(b.ARRAY_BUFFER,w.__webGLTangentBuffer);b.bufferData(b.ARRAY_BUFFER,ga,V)}if(ya&&B>0){b.bindBuffer(b.ARRAY_BUFFER,w.__webGLUVBuffer);b.bufferData(b.ARRAY_BUFFER,Ja,V)}if(ya&&ea>0){b.bindBuffer(b.ARRAY_BUFFER,w.__webGLUV2Buffer);
-b.bufferData(b.ARRAY_BUFFER,Da,V)}if(ja){b.bindBuffer(b.ELEMENT_ARRAY_BUFFER,w.__webGLFaceBuffer);b.bufferData(b.ELEMENT_ARRAY_BUFFER,Aa,V);b.bindBuffer(b.ELEMENT_ARRAY_BUFFER,w.__webGLLineBuffer);b.bufferData(b.ELEMENT_ARRAY_BUFFER,ta,V)}}x(objlist,t,h,e,i,n)}g.__dirtyVertices=false;g.__dirtyElements=false;g.__dirtyUvs=false;g.__dirtyNormals=false;g.__dirtyTangents=false;g.__dirtyColors=false}else if(i instanceof THREE.Line){if(!g.__webGLVertexBuffer){g.__webGLVertexBuffer=b.createBuffer();g.__webGLColorBuffer=
-b.createBuffer();h=g.vertices.length;g.__vertexArray=new Float32Array(h*3);g.__colorArray=new Float32Array(h*3);g.__webGLLineCount=h;g.__dirtyVertices=true;g.__dirtyColors=true}if(g.__dirtyVertices||g.__dirtyColors){h=b.DYNAMIC_DRAW;u=g.vertices;w=g.colors;B=u.length;V=w.length;ea=g.__vertexArray;da=g.__colorArray;ia=g.__dirtyColors;if(g.__dirtyVertices){for(r=0;r<B;r++){p=u[r].position;e=r*3;ea[e]=p.x;ea[e+1]=p.y;ea[e+2]=p.z}b.bindBuffer(b.ARRAY_BUFFER,g.__webGLVertexBuffer);b.bufferData(b.ARRAY_BUFFER,
-ea,h)}if(ia){for(r=0;r<V;r++){color=w[r];e=r*3;da[e]=color.r;da[e+1]=color.g;da[e+2]=color.b}b.bindBuffer(b.ARRAY_BUFFER,g.__webGLColorBuffer);b.bufferData(b.ARRAY_BUFFER,da,h)}}x(objlist,t,0,g,i,n);g.__dirtyVertices=false;g.__dirtyColors=false}else if(i instanceof THREE.ParticleSystem){if(!g.__webGLVertexBuffer){g.__webGLVertexBuffer=b.createBuffer();g.__webGLColorBuffer=b.createBuffer();h=g.vertices.length;g.__vertexArray=new Float32Array(h*3);g.__colorArray=new Float32Array(h*3);g.__sortArray=
-[];g.__webGLParticleCount=h;g.__dirtyVertices=true;g.__dirtyColors=true}if(g.__dirtyVertices||g.__dirtyColors||i.sortParticles)c(g,b.DYNAMIC_DRAW,i,camera);x(objlist,t,0,g,i,n);g.__dirtyVertices=false;g.__dirtyColors=false}else if(i instanceof THREE.MarchingCubes)if(t[0]==undefined){e.__webGLObjectsImmediate.push({object:i,opaque:{list:[],count:0},transparent:{list:[],count:0},root:n});t[0]=1}}function x(e,i,n,h,g,t){if(i[n]==undefined){e.push({buffer:h,object:g,opaque:{list:[],count:0},transparent:{list:[],
-count:0},root:t});i[n]=1}}function F(e,i){e._modelViewMatrix.multiplyToArray(i.matrix,e.matrixWorld,e._modelViewMatrixArray);e._normalMatrix=THREE.Matrix4.makeInvert3x3(e._modelViewMatrix).transposeIntoArray(e._normalMatrixArray)}function H(e){if(e!=X){switch(e){case THREE.AdditiveBlending:b.blendEquation(b.FUNC_ADD);b.blendFunc(b.ONE,b.ONE);break;case THREE.SubtractiveBlending:b.blendFunc(b.DST_COLOR,b.ZERO);break;case THREE.BillboardBlending:b.blendEquation(b.FUNC_ADD);b.blendFunc(b.SRC_ALPHA,b.ONE_MINUS_SRC_ALPHA);
-break;default:b.blendEquation(b.FUNC_ADD);b.blendFunc(b.ONE,b.ONE_MINUS_SRC_ALPHA)}X=e}}function I(e,i){if(e&&!e.__webGLFramebuffer){e.__webGLFramebuffer=b.createFramebuffer();e.__webGLRenderbuffer=b.createRenderbuffer();e.__webGLTexture=b.createTexture();b.bindRenderbuffer(b.RENDERBUFFER,e.__webGLRenderbuffer);b.renderbufferStorage(b.RENDERBUFFER,b.DEPTH_COMPONENT16,e.width,e.height);b.bindTexture(b.TEXTURE_2D,e.__webGLTexture);b.texParameteri(b.TEXTURE_2D,b.TEXTURE_WRAP_S,O(e.wrap_s));b.texParameteri(b.TEXTURE_2D,
-b.TEXTURE_WRAP_T,O(e.wrap_t));b.texParameteri(b.TEXTURE_2D,b.TEXTURE_MAG_FILTER,O(e.mag_filter));b.texParameteri(b.TEXTURE_2D,b.TEXTURE_MIN_FILTER,O(e.min_filter));b.texImage2D(b.TEXTURE_2D,0,O(e.format),e.width,e.height,0,O(e.format),O(e.type),null);b.bindFramebuffer(b.FRAMEBUFFER,e.__webGLFramebuffer);b.framebufferTexture2D(b.FRAMEBUFFER,b.COLOR_ATTACHMENT0,b.TEXTURE_2D,e.__webGLTexture,0);b.framebufferRenderbuffer(b.FRAMEBUFFER,b.DEPTH_ATTACHMENT,b.RENDERBUFFER,e.__webGLRenderbuffer);b.bindTexture(b.TEXTURE_2D,
-null);b.bindRenderbuffer(b.RENDERBUFFER,null);b.bindFramebuffer(b.FRAMEBUFFER,null)}var n,h,g;if(e){n=e.__webGLFramebuffer;h=e.width;g=e.height}else{n=null;h=C.width;g=C.height}if(n!=$){b.bindFramebuffer(b.FRAMEBUFFER,n);b.viewport(0,0,h,g);i&&b.clear(b.COLOR_BUFFER_BIT|b.DEPTH_BUFFER_BIT);$=n}}function s(e,i){var n;if(e=="fragment")n=b.createShader(b.FRAGMENT_SHADER);else if(e=="vertex")n=b.createShader(b.VERTEX_SHADER);b.shaderSource(n,i);b.compileShader(n);if(!b.getShaderParameter(n,b.COMPILE_STATUS)){alert(b.getShaderInfoLog(n));
-return null}return n}function O(e){switch(e){case THREE.RepeatWrapping:return b.REPEAT;case THREE.ClampToEdgeWrapping:return b.CLAMP_TO_EDGE;case THREE.MirroredRepeatWrapping:return b.MIRRORED_REPEAT;case THREE.NearestFilter:return b.NEAREST;case THREE.NearestMipMapNearestFilter:return b.NEAREST_MIPMAP_NEAREST;case THREE.NearestMipMapLinearFilter:return b.NEAREST_MIPMAP_LINEAR;case THREE.LinearFilter:return b.LINEAR;case THREE.LinearMipMapNearestFilter:return b.LINEAR_MIPMAP_NEAREST;case THREE.LinearMipMapLinearFilter:return b.LINEAR_MIPMAP_LINEAR;
-case THREE.ByteType:return b.BYTE;case THREE.UnsignedByteType:return b.UNSIGNED_BYTE;case THREE.ShortType:return b.SHORT;case THREE.UnsignedShortType:return b.UNSIGNED_SHORT;case THREE.IntType:return b.INT;case THREE.UnsignedShortType:return b.UNSIGNED_INT;case THREE.FloatType:return b.FLOAT;case THREE.AlphaFormat:return b.ALPHA;case THREE.RGBFormat:return b.RGB;case THREE.RGBAFormat:return b.RGBA;case THREE.LuminanceFormat:return b.LUMINANCE;case THREE.LuminanceAlphaFormat:return b.LUMINANCE_ALPHA}return 0}
-var C=document.createElement("canvas"),b,R=null,$=null,Q=null,J=null,X=null,G=[new THREE.Vector4,new THREE.Vector4,new THREE.Vector4,new THREE.Vector4,new THREE.Vector4,new THREE.Vector4],U=new THREE.Matrix4,M=new Float32Array(16),D=new Float32Array(16),K=new THREE.Vector4,ca=true,N=new THREE.Color(0),aa=0;if(a){if(a.antialias!==undefined)ca=a.antialias;a.clearColor!==undefined&&N.setHex(a.clearColor);if(a.clearAlpha!==undefined)aa=a.clearAlpha}this.domElement=C;this.autoClear=true;(function(e,i,
-n){try{b=C.getContext("experimental-webgl",{antialias:e})}catch(h){console.log(h)}if(!b){alert("WebGL not supported");throw"cannot create webgl context";}b.clearColor(0,0,0,1);b.clearDepth(1);b.enable(b.DEPTH_TEST);b.depthFunc(b.LEQUAL);b.frontFace(b.CCW);b.cullFace(b.BACK);b.enable(b.CULL_FACE);b.enable(b.BLEND);b.blendFunc(b.ONE,b.ONE_MINUS_SRC_ALPHA);b.clearColor(i.r,i.g,i.b,n);_cullEnabled=true})(ca,N,aa);this.context=b;this.lights={ambient:[0,0,0],directional:{length:0,colors:[],positions:[]},
-point:{length:0,colors:[],positions:[]}};this.setSize=function(e,i){C.width=e;C.height=i;b.viewport(0,0,C.width,C.height)};this.setClearColorHex=function(e,i){var n=new THREE.Color(e);b.clearColor(n.r,n.g,n.b,i)};this.setClearColor=function(e,i){b.clearColor(e.r,e.g,e.b,i)};this.clear=function(){b.clear(b.COLOR_BUFFER_BIT|b.DEPTH_BUFFER_BIT)};this.setupLights=function(e,i){var n,h,g,t=0,w=0,u=0,r,p,B,V=this.lights,da=V.directional.colors,ea=V.directional.positions,ia=V.point.colors,S=V.point.positions,
-Y=0,pa=0;n=g=g=0;for(h=i.length;n<h;n++){g=i[n];r=g.color;p=g.position;B=g.intensity;if(g instanceof THREE.AmbientLight){t+=r.r;w+=r.g;u+=r.b}else if(g instanceof THREE.DirectionalLight){g=Y*3;da[g]=r.r*B;da[g+1]=r.g*B;da[g+2]=r.b*B;ea[g]=p.x;ea[g+1]=p.y;ea[g+2]=p.z;Y+=1}else if(g instanceof THREE.PointLight){g=pa*3;ia[g]=r.r*B;ia[g+1]=r.g*B;ia[g+2]=r.b*B;S[g]=p.x;S[g+1]=p.y;S[g+2]=p.z;pa+=1}}for(n=Y*3;n<da.length;n++)da[n]=0;for(n=pa*3;n<ia.length;n++)ia[n]=0;V.point.length=pa;V.directional.length=
-Y;V.ambient[0]=t;V.ambient[1]=w;V.ambient[2]=u};this.initMaterial=function(e,i,n){var h,g;if(e instanceof THREE.MeshDepthMaterial)d(e,THREE.ShaderLib.depth);else if(e instanceof THREE.MeshNormalMaterial)d(e,THREE.ShaderLib.normal);else if(e instanceof THREE.MeshBasicMaterial)d(e,THREE.ShaderLib.basic);else if(e instanceof THREE.MeshLambertMaterial)d(e,THREE.ShaderLib.lambert);else if(e instanceof THREE.MeshPhongMaterial)d(e,THREE.ShaderLib.phong);else if(e instanceof THREE.LineBasicMaterial)d(e,THREE.ShaderLib.basic);
-else e instanceof THREE.ParticleBasicMaterial&&d(e,THREE.ShaderLib.particle_basic);var t,w,u,r;g=u=r=0;for(t=i.length;g<t;g++){w=i[g];w instanceof THREE.DirectionalLight&&u++;w instanceof THREE.PointLight&&r++}if(r+u<=4){i=u;r=r}else{i=Math.ceil(4*u/(r+u));r=4-i}g={directional:i,point:r};r=e.fragment_shader;i=e.vertex_shader;t={fog:n,map:e.map,env_map:e.env_map,light_map:e.light_map,vertex_colors:e.vertex_colors,maxDirLights:g.directional,maxPointLights:g.point};n=b.createProgram();g=["#ifdef GL_ES\nprecision highp float;\n#endif",
-"#define MAX_DIR_LIGHTS "+t.maxDirLights,"#define MAX_POINT_LIGHTS "+t.maxPointLights,t.fog?"#define USE_FOG":"",t.fog instanceof THREE.FogExp2?"#define FOG_EXP2":"",t.map?"#define USE_MAP":"",t.env_map?"#define USE_ENVMAP":"",t.light_map?"#define USE_LIGHTMAP":"",t.vertex_colors?"#define USE_COLOR":"","uniform mat4 viewMatrix;\nuniform vec3 cameraPosition;\n"].join("\n");t=[b.getParameter(b.MAX_VERTEX_TEXTURE_IMAGE_UNITS)>0?"#define VERTEX_TEXTURES":"","#define MAX_DIR_LIGHTS "+t.maxDirLights,"#define MAX_POINT_LIGHTS "+
-t.maxPointLights,t.map?"#define USE_MAP":"",t.env_map?"#define USE_ENVMAP":"",t.light_map?"#define USE_LIGHTMAP":"",t.vertex_colors?"#define USE_COLOR":"","uniform mat4 objectMatrix;\nuniform mat4 modelViewMatrix;\nuniform mat4 projectionMatrix;\nuniform mat4 viewMatrix;\nuniform mat3 normalMatrix;\nuniform vec3 cameraPosition;\nattribute vec3 position;\nattribute vec3 normal;\nattribute vec3 color;\nattribute vec2 uv;\nattribute vec2 uv2;\n"].join("\n");b.attachShader(n,s("fragment",g+r));b.attachShader(n,
-s("vertex",t+i));b.linkProgram(n);b.getProgramParameter(n,b.LINK_STATUS)||alert("Could not initialise shaders\nVALIDATE_STATUS: "+b.getProgramParameter(n,b.VALIDATE_STATUS)+", gl error ["+b.getError()+"]");n.uniforms={};n.attributes={};e.program=n;n=["viewMatrix","modelViewMatrix","projectionMatrix","normalMatrix","objectMatrix","cameraPosition"];for(h in e.uniforms)n.push(h);h=e.program;r=0;for(i=n.length;r<i;r++){g=n[r];h.uniforms[g]=b.getUniformLocation(h,g)}e=e.program;h=["position","normal",
-"uv","uv2","tangent","color"];n=0;for(r=h.length;n<r;n++){i=h[n];e.attributes[i]=b.getAttribLocation(e,i)}};this.setProgram=function(e,i,n,h,g){h.program||this.initMaterial(h,i,n);var t=h.program,w=t.uniforms,u=h.uniforms;if(t!=R){b.useProgram(t);R=t;b.uniformMatrix4fv(w.projectionMatrix,false,M)}if(n&&(h instanceof THREE.MeshBasicMaterial||h instanceof THREE.MeshLambertMaterial||h instanceof THREE.MeshPhongMaterial||h instanceof THREE.LineBasicMaterial||h instanceof THREE.ParticleBasicMaterial)){u.fogColor.value.setHex(n.color.hex);
-if(n instanceof THREE.Fog){u.fogNear.value=n.near;u.fogFar.value=n.far}else if(n instanceof THREE.FogExp2)u.fogDensity.value=n.density}if(h instanceof THREE.MeshPhongMaterial||h instanceof THREE.MeshLambertMaterial){this.setupLights(t,i);i=this.lights;u.enableLighting.value=i.directional.length+i.point.length;u.ambientLightColor.value=i.ambient;u.directionalLightColor.value=i.directional.colors;u.directionalLightDirection.value=i.directional.positions;u.pointLightColor.value=i.point.colors;u.pointLightPosition.value=
-i.point.positions}if(h instanceof THREE.MeshBasicMaterial||h instanceof THREE.MeshLambertMaterial||h instanceof THREE.MeshPhongMaterial){u.diffuse.value.setRGB(h.color.r*h.opacity,h.color.g*h.opacity,h.color.b*h.opacity);u.opacity.value=h.opacity;u.map.texture=h.map;u.light_map.texture=h.light_map;u.env_map.texture=h.env_map;u.reflectivity.value=h.reflectivity;u.refraction_ratio.value=h.refraction_ratio;u.combine.value=h.combine;u.useRefract.value=h.env_map&&h.env_map.mapping instanceof THREE.CubeRefractionMapping}if(h instanceof
-THREE.LineBasicMaterial){u.diffuse.value.setRGB(h.color.r*h.opacity,h.color.g*h.opacity,h.color.b*h.opacity);u.opacity.value=h.opacity}else if(h instanceof THREE.ParticleBasicMaterial){u.psColor.value.setRGB(h.color.r*h.opacity,h.color.g*h.opacity,h.color.b*h.opacity);u.opacity.value=h.opacity;u.size.value=h.size;u.map.texture=h.map}else if(h instanceof THREE.MeshPhongMaterial){u.ambient.value.setRGB(h.ambient.r,h.ambient.g,h.ambient.b);u.specular.value.setRGB(h.specular.r,h.specular.g,h.specular.b);
-u.shininess.value=h.shininess}else if(h instanceof THREE.MeshDepthMaterial){u.mNear.value=e.near;u.mFar.value=e.far;u.opacity.value=h.opacity}else if(h instanceof THREE.MeshNormalMaterial)u.opacity.value=h.opacity;var r,p,B;for(r in u)if(B=t.uniforms[r]){n=u[r];p=n.type;i=n.value;if(p=="i")b.uniform1i(B,i);else if(p=="f")b.uniform1f(B,i);else if(p=="fv1")b.uniform1fv(B,i);else if(p=="fv")b.uniform3fv(B,i);else if(p=="v2")b.uniform2f(B,i.x,i.y);else if(p=="v3")b.uniform3f(B,i.x,i.y,i.z);else if(p==
-"c")b.uniform3f(B,i.r,i.g,i.b);else if(p=="t"){b.uniform1i(B,i);if(n=n.texture)if(n.image instanceof Array&&n.image.length==6){n=n;i=i;if(n.image.length==6){if(!n.image.__webGLTextureCube&&!n.image.__cubeMapInitialized&&n.image.loadCount==6){n.image.__webGLTextureCube=b.createTexture();b.bindTexture(b.TEXTURE_CUBE_MAP,n.image.__webGLTextureCube);b.texParameteri(b.TEXTURE_CUBE_MAP,b.TEXTURE_WRAP_S,b.CLAMP_TO_EDGE);b.texParameteri(b.TEXTURE_CUBE_MAP,b.TEXTURE_WRAP_T,b.CLAMP_TO_EDGE);b.texParameteri(b.TEXTURE_CUBE_MAP,
-b.TEXTURE_MAG_FILTER,b.LINEAR);b.texParameteri(b.TEXTURE_CUBE_MAP,b.TEXTURE_MIN_FILTER,b.LINEAR_MIPMAP_LINEAR);for(p=0;p<6;++p)b.texImage2D(b.TEXTURE_CUBE_MAP_POSITIVE_X+p,0,b.RGBA,b.RGBA,b.UNSIGNED_BYTE,n.image[p]);b.generateMipmap(b.TEXTURE_CUBE_MAP);b.bindTexture(b.TEXTURE_CUBE_MAP,null);n.image.__cubeMapInitialized=true}b.activeTexture(b.TEXTURE0+i);b.bindTexture(b.TEXTURE_CUBE_MAP,n.image.__webGLTextureCube)}}else{n=n;i=i;if(!n.__webGLTexture&&n.image.loaded){n.__webGLTexture=b.createTexture();
-b.bindTexture(b.TEXTURE_2D,n.__webGLTexture);b.texImage2D(b.TEXTURE_2D,0,b.RGBA,b.RGBA,b.UNSIGNED_BYTE,n.image);b.texParameteri(b.TEXTURE_2D,b.TEXTURE_WRAP_S,O(n.wrap_s));b.texParameteri(b.TEXTURE_2D,b.TEXTURE_WRAP_T,O(n.wrap_t));b.texParameteri(b.TEXTURE_2D,b.TEXTURE_MAG_FILTER,O(n.mag_filter));b.texParameteri(b.TEXTURE_2D,b.TEXTURE_MIN_FILTER,O(n.min_filter));b.generateMipmap(b.TEXTURE_2D);b.bindTexture(b.TEXTURE_2D,null)}b.activeTexture(b.TEXTURE0+i);b.bindTexture(b.TEXTURE_2D,n.__webGLTexture)}}}b.uniformMatrix4fv(w.modelViewMatrix,
-false,g._modelViewMatrixArray);b.uniformMatrix3fv(w.normalMatrix,false,g._normalMatrixArray);if(h instanceof THREE.MeshShaderMaterial||h instanceof THREE.MeshPhongMaterial||h.env_map)b.uniform3f(w.cameraPosition,e.position.x,e.position.y,e.position.z);if(h instanceof THREE.MeshShaderMaterial||h.env_map)b.uniformMatrix4fv(w.objectMatrix,false,g._objectMatrixArray);if(h instanceof THREE.MeshPhongMaterial||h instanceof THREE.MeshLambertMaterial||h instanceof THREE.MeshShaderMaterial)b.uniformMatrix4fv(w.viewMatrix,
-false,D);return t};this.renderBuffer=function(e,i,n,h,g,t){e=this.setProgram(e,i,n,h,t).attributes;b.bindBuffer(b.ARRAY_BUFFER,g.__webGLVertexBuffer);b.vertexAttribPointer(e.position,3,b.FLOAT,false,0,0);b.enableVertexAttribArray(e.position);if(e.color>=0){b.bindBuffer(b.ARRAY_BUFFER,g.__webGLColorBuffer);b.vertexAttribPointer(e.color,3,b.FLOAT,false,0,0);b.enableVertexAttribArray(e.color)}if(e.normal>=0){b.bindBuffer(b.ARRAY_BUFFER,g.__webGLNormalBuffer);b.vertexAttribPointer(e.normal,3,b.FLOAT,
-false,0,0);b.enableVertexAttribArray(e.normal)}if(e.tangent>=0){b.bindBuffer(b.ARRAY_BUFFER,g.__webGLTangentBuffer);b.vertexAttribPointer(e.tangent,4,b.FLOAT,false,0,0);b.enableVertexAttribArray(e.tangent)}if(e.uv>=0)if(g.__webGLUVBuffer){b.bindBuffer(b.ARRAY_BUFFER,g.__webGLUVBuffer);b.vertexAttribPointer(e.uv,2,b.FLOAT,false,0,0);b.enableVertexAttribArray(e.uv)}else b.disableVertexAttribArray(e.uv);if(e.uv2>=0)if(g.__webGLUV2Buffer){b.bindBuffer(b.ARRAY_BUFFER,g.__webGLUV2Buffer);b.vertexAttribPointer(e.uv2,
-2,b.FLOAT,false,0,0);b.enableVertexAttribArray(e.uv2)}else b.disableVertexAttribArray(e.uv2);if(t instanceof THREE.Mesh)if(h.wireframe){b.lineWidth(h.wireframe_linewidth);b.bindBuffer(b.ELEMENT_ARRAY_BUFFER,g.__webGLLineBuffer);b.drawElements(b.LINES,g.__webGLLineCount,b.UNSIGNED_SHORT,0)}else{b.bindBuffer(b.ELEMENT_ARRAY_BUFFER,g.__webGLFaceBuffer);b.drawElements(b.TRIANGLES,g.__webGLFaceCount,b.UNSIGNED_SHORT,0)}else if(t instanceof THREE.Line){t=t.type==THREE.LineStrip?b.LINE_STRIP:b.LINES;b.lineWidth(h.linewidth);
-b.drawArrays(t,0,g.__webGLLineCount)}else t instanceof THREE.ParticleSystem&&b.drawArrays(b.POINTS,0,g.__webGLParticleCount)};this.render=function(e,i,n,h){var g,t,w,u,r,p,B,V=e.lights,da=e.fog;i.autoUpdateMatrix&&i.updateMatrix();i.matrix.flattenToArray(D);i.projectionMatrix.flattenToArray(M);U.multiply(i.projectionMatrix,i.matrix);k(U);this.initWebGLObjects(e,i);I(n,h!==undefined?h:true);this.autoClear&&this.clear();u=e.__webGLObjects.length;for(h=0;h<u;h++){g=e.__webGLObjects[h];p=g.object;if(p.visible){if(g.root){p.autoUpdateMatrix&&
-p.updateMatrix();p.matrixWorld.copy(p.matrix);z(p)}if(!(p instanceof THREE.Mesh)||q(p)){p.matrixWorld.flattenToArray(p._objectMatrixArray);F(p,i);m(g);g.render=true}else g.render=false}else g.render=false}r=e.__webGLObjectsImmediate.length;for(h=0;h<r;h++){g=e.__webGLObjectsImmediate[h];p=g.object;if(p.visible){if(p.autoUpdateMatrix){p.updateMatrix();p.matrixWorld.copy(p.matrix);p.matrixWorld.flattenToArray(p._objectMatrixArray)}F(p,i);l(g)}}H(THREE.NormalBlending);for(h=0;h<u;h++){g=e.__webGLObjects[h];
-if(g.render){p=g.object;B=g.buffer;w=g.opaque;j(p);for(g=0;g<w.count;g++){material=w.list[g];this.setDepthTest(material.depth_test);this.renderBuffer(i,V,da,material,B,p)}}}for(h=0;h<r;h++){g=e.__webGLObjectsImmediate[h];p=g.object;if(p.visible){w=g.opaque;j(p);for(g=0;g<w.count;g++){material=w.list[g];this.setDepthTest(material.depth_test);t=this.setProgram(i,V,da,material,p);p.render(function(ea){f(ea,t)})}}}for(h=0;h<u;h++){g=e.__webGLObjects[h];if(g.render){p=g.object;B=g.buffer;w=g.transparent;
-j(p);for(g=0;g<w.count;g++){material=w.list[g];H(material.blending);this.setDepthTest(material.depth_test);this.renderBuffer(i,V,da,material,B,p)}}}for(h=0;h<r;h++){g=e.__webGLObjectsImmediate[h];p=g.object;if(p.visible){w=g.transparent;j(p);for(g=0;g<w.count;g++){material=w.list[g];H(material.blending);this.setDepthTest(material.depth_test);t=this.setProgram(i,V,da,material,p);p.render(function(ea){f(ea,t)})}}}if(n&&n.min_filter!==THREE.NearestFilter&&n.min_filter!==THREE.LinearFilter){b.bindTexture(b.TEXTURE_2D,
-n.__webGLTexture);b.generateMipmap(b.TEXTURE_2D);b.bindTexture(b.TEXTURE_2D,null)}};this.initWebGLObjects=function(e){var i,n,h;if(!e.__webGLObjects){e.__webGLObjects=[];e.__webGLObjectsMap={};e.__webGLObjectsImmediate=[]}i=0;for(n=e.objects.length;i<n;i++){h=e.objects[i];v(e,h,true);y(e,h)}};this.removeObject=function(e,i){var n,h;for(n=e.__webGLObjects.length-1;n>=0;n--){h=e.__webGLObjects[n].object;i==h&&e.__webGLObjects.splice(n,1)}};this.setDepthTest=function(e){e?b.enable(b.DEPTH_TEST):b.disable(b.DEPTH_TEST)};
-this.setFaceCulling=function(e,i){if(e){!i||i=="ccw"?b.frontFace(b.CCW):b.frontFace(b.CW);if(e=="back")b.cullFace(b.BACK);else e=="front"?b.cullFace(b.FRONT):b.cullFace(b.FRONT_AND_BACK);b.enable(b.CULL_FACE)}else b.disable(b.CULL_FACE)};this.supportsVertexTextures=function(){return b.getParameter(b.MAX_VERTEX_TEXTURE_IMAGE_UNITS)>0}};
-THREE.Snippets={fog_pars_fragment:"#ifdef USE_FOG\nuniform vec3 fogColor;\n#ifdef FOG_EXP2\nuniform float fogDensity;\n#else\nuniform float fogNear;\nuniform float fogFar;\n#endif\n#endif",fog_fragment:"#ifdef USE_FOG\nfloat depth = gl_FragCoord.z / gl_FragCoord.w;\n#ifdef FOG_EXP2\nconst float LOG2 = 1.442695;\nfloat fogFactor = exp2( - fogDensity * fogDensity * depth * depth * LOG2 );\nfogFactor = 1.0 - clamp( fogFactor, 0.0, 1.0 );\n#else\nfloat fogFactor = smoothstep( fogNear, fogFar, depth );\n#endif\ngl_FragColor = mix( gl_FragColor, vec4( fogColor, gl_FragColor.w ), fogFactor );\n#endif",
-envmap_pars_fragment:"#ifdef USE_ENVMAP\nvarying vec3 vReflect;\nuniform float reflectivity;\nuniform samplerCube env_map;\nuniform int combine;\n#endif",envmap_fragment:"#ifdef USE_ENVMAP\nvec4 cubeColor = textureCube( env_map, vec3( -vReflect.x, vReflect.yz ) );\nif ( combine == 1 ) {\ngl_FragColor = vec4( mix( gl_FragColor.xyz, cubeColor.xyz, reflectivity ), opacity );\n} else {\ngl_FragColor = gl_FragColor * cubeColor;\n}\n#endif",envmap_pars_vertex:"#ifdef USE_ENVMAP\nvarying vec3 vReflect;\nuniform float refraction_ratio;\nuniform bool useRefract;\n#endif",
-envmap_vertex:"#ifdef USE_ENVMAP\nvec4 mPosition = objectMatrix * vec4( position, 1.0 );\nvec3 nWorld = mat3( objectMatrix[0].xyz, objectMatrix[1].xyz, objectMatrix[2].xyz ) * normal;\nif ( useRefract ) {\nvReflect = refract( normalize( mPosition.xyz - cameraPosition ), normalize( nWorld.xyz ), refraction_ratio );\n} else {\nvReflect = reflect( normalize( mPosition.xyz - cameraPosition ), normalize( nWorld.xyz ) );\n}\n#endif",map_particle_pars_fragment:"#ifdef USE_MAP\nuniform sampler2D map;\n#endif",
-map_particle_fragment:"#ifdef USE_MAP\ngl_FragColor = gl_FragColor * texture2D( map, gl_PointCoord );\n#endif",map_pars_fragment:"#ifdef USE_MAP\nvarying vec2 vUv;\nuniform sampler2D map;\n#endif",map_pars_vertex:"#ifdef USE_MAP\nvarying vec2 vUv;\n#endif",map_fragment:"#ifdef USE_MAP\ngl_FragColor = gl_FragColor * texture2D( map, vUv );\n#endif",map_vertex:"#ifdef USE_MAP\nvUv = uv;\n#endif",lightmap_pars_fragment:"#ifdef USE_LIGHTMAP\nvarying vec2 vUv2;\nuniform sampler2D light_map;\n#endif",lightmap_pars_vertex:"#ifdef USE_LIGHTMAP\nvarying vec2 vUv2;\n#endif",
-lightmap_fragment:"#ifdef USE_LIGHTMAP\ngl_FragColor = gl_FragColor * texture2D( light_map, vUv2 );\n#endif",lightmap_vertex:"#ifdef USE_LIGHTMAP\nvUv2 = uv2;\n#endif",lights_pars_vertex:"uniform bool enableLighting;\nuniform vec3 ambientLightColor;\n#if MAX_DIR_LIGHTS > 0\nuniform vec3 directionalLightColor[ MAX_DIR_LIGHTS ];\nuniform vec3 directionalLightDirection[ MAX_DIR_LIGHTS ];\n#endif\n#if MAX_POINT_LIGHTS > 0\nuniform vec3 pointLightColor[ MAX_POINT_LIGHTS ];\nuniform vec3 pointLightPosition[ MAX_POINT_LIGHTS ];\n#ifdef PHONG\nvarying vec3 vPointLightVector[ MAX_POINT_LIGHTS ];\n#endif\n#endif",
-lights_vertex:"if ( !enableLighting ) {\nvLightWeighting = vec3( 1.0 );\n} else {\nvLightWeighting = ambientLightColor;\n#if MAX_DIR_LIGHTS > 0\nfor( int i = 0; i < MAX_DIR_LIGHTS; i++ ) {\nvec4 lDirection = viewMatrix * vec4( directionalLightDirection[ i ], 0.0 );\nfloat directionalLightWeighting = max( dot( transformedNormal, normalize( lDirection.xyz ) ), 0.0 );\nvLightWeighting += directionalLightColor[ i ] * directionalLightWeighting;\n}\n#endif\n#if MAX_POINT_LIGHTS > 0\nfor( int i = 0; i < MAX_POINT_LIGHTS; i++ ) {\nvec4 lPosition = viewMatrix * vec4( pointLightPosition[ i ], 1.0 );\nvec3 pointLightVector = normalize( lPosition.xyz - mvPosition.xyz );\nfloat pointLightWeighting = max( dot( transformedNormal, pointLightVector ), 0.0 );\nvLightWeighting += pointLightColor[ i ] * pointLightWeighting;\n#ifdef PHONG\nvPointLightVector[ i ] = pointLightVector;\n#endif\n}\n#endif\n}",
-lights_pars_fragment:"#if MAX_DIR_LIGHTS > 0\nuniform vec3 directionalLightDirection[ MAX_DIR_LIGHTS ];\n#endif\n#if MAX_POINT_LIGHTS > 0\nvarying vec3 vPointLightVector[ MAX_POINT_LIGHTS ];\n#endif\nvarying vec3 vViewPosition;\nvarying vec3 vNormal;",lights_fragment:"vec3 normal = normalize( vNormal );\nvec3 viewPosition = normalize( vViewPosition );\nvec4 mColor = vec4( diffuse, opacity );\nvec4 mSpecular = vec4( specular, opacity );\n#if MAX_POINT_LIGHTS > 0\nvec4 pointDiffuse  = vec4( 0.0 );\nvec4 pointSpecular = vec4( 0.0 );\nfor( int i = 0; i < MAX_POINT_LIGHTS; i++ ) {\nvec3 pointVector = normalize( vPointLightVector[ i ] );\nvec3 pointHalfVector = normalize( vPointLightVector[ i ] + vViewPosition );\nfloat pointDotNormalHalf = dot( normal, pointHalfVector );\nfloat pointDiffuseWeight = max( dot( normal, pointVector ), 0.0 );\nfloat pointSpecularWeight = 0.0;\nif ( pointDotNormalHalf >= 0.0 )\npointSpecularWeight = pow( pointDotNormalHalf, shininess );\npointDiffuse  += mColor * pointDiffuseWeight;\npointSpecular += mSpecular * pointSpecularWeight;\n}\n#endif\n#if MAX_DIR_LIGHTS > 0\nvec4 dirDiffuse  = vec4( 0.0 );\nvec4 dirSpecular = vec4( 0.0 );\nfor( int i = 0; i < MAX_DIR_LIGHTS; i++ ) {\nvec4 lDirection = viewMatrix * vec4( directionalLightDirection[ i ], 0.0 );\nvec3 dirVector = normalize( lDirection.xyz );\nvec3 dirHalfVector = normalize( lDirection.xyz + vViewPosition );\nfloat dirDotNormalHalf = dot( normal, dirHalfVector );\nfloat dirDiffuseWeight = max( dot( normal, dirVector ), 0.0 );\nfloat dirSpecularWeight = 0.0;\nif ( dirDotNormalHalf >= 0.0 )\ndirSpecularWeight = pow( dirDotNormalHalf, shininess );\ndirDiffuse  += mColor * dirDiffuseWeight;\ndirSpecular += mSpecular * dirSpecularWeight;\n}\n#endif\nvec4 totalLight = vec4( ambient, opacity );\n#if MAX_DIR_LIGHTS > 0\ntotalLight += dirDiffuse + dirSpecular;\n#endif\n#if MAX_POINT_LIGHTS > 0\ntotalLight += pointDiffuse + pointSpecular;\n#endif\ngl_FragColor = gl_FragColor * totalLight;",
-color_pars_fragment:"#ifdef USE_COLOR\nvarying vec3 vColor;\n#endif",color_fragment:"#ifdef USE_COLOR\ngl_FragColor = gl_FragColor * vec4( vColor, opacity );\n#endif",color_pars_vertex:"#ifdef USE_COLOR\nvarying vec3 vColor;\n#endif",color_vertex:"#ifdef USE_COLOR\nvColor = color;\n#endif"};
-THREE.UniformsLib={common:{diffuse:{type:"c",value:new THREE.Color(15658734)},opacity:{type:"f",value:1},map:{type:"t",value:0,texture:null},light_map:{type:"t",value:2,texture:null},env_map:{type:"t",value:1,texture:null},useRefract:{type:"i",value:0},reflectivity:{type:"f",value:1},refraction_ratio:{type:"f",value:0.98},combine:{type:"i",value:0},fogDensity:{type:"f",value:2.5E-4},fogNear:{type:"f",value:1},fogFar:{type:"f",value:2E3},fogColor:{type:"c",value:new THREE.Color(16777215)}},lights:{enableLighting:{type:"i",
-value:1},ambientLightColor:{type:"fv",value:[]},directionalLightDirection:{type:"fv",value:[]},directionalLightColor:{type:"fv",value:[]},pointLightPosition:{type:"fv",value:[]},pointLightColor:{type:"fv",value:[]}},particle:{psColor:{type:"c",value:new THREE.Color(15658734)},opacity:{type:"f",value:1},size:{type:"f",value:1},map:{type:"t",value:0,texture:null},fogDensity:{type:"f",value:2.5E-4},fogNear:{type:"f",value:1},fogFar:{type:"f",value:2E3},fogColor:{type:"c",value:new THREE.Color(16777215)}}};
-THREE.ShaderLib={depth:{uniforms:{mNear:{type:"f",value:1},mFar:{type:"f",value:2E3},opacity:{type:"f",value:1}},fragment_shader:"uniform float mNear;\nuniform float mFar;\nuniform float opacity;\nvoid main() {\nfloat depth = gl_FragCoord.z / gl_FragCoord.w;\nfloat color = 1.0 - smoothstep( mNear, mFar, depth );\ngl_FragColor = vec4( vec3( color ), opacity );\n}",vertex_shader:"void main() {\ngl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );\n}"},normal:{uniforms:{opacity:{type:"f",
-value:1}},fragment_shader:"uniform float opacity;\nvarying vec3 vNormal;\nvoid main() {\ngl_FragColor = vec4( 0.5 * normalize( vNormal ) + 0.5, opacity );\n}",vertex_shader:"varying vec3 vNormal;\nvoid main() {\nvec4 mvPosition = modelViewMatrix * vec4( position, 1.0 );\nvNormal = normalize( normalMatrix * normal );\ngl_Position = projectionMatrix * mvPosition;\n}"},basic:{uniforms:THREE.UniformsLib.common,fragment_shader:["uniform vec3 diffuse;\nuniform float opacity;",THREE.Snippets.color_pars_fragment,
-THREE.Snippets.map_pars_fragment,THREE.Snippets.lightmap_pars_fragment,THREE.Snippets.envmap_pars_fragment,THREE.Snippets.fog_pars_fragment,"void main() {\ngl_FragColor = vec4( diffuse, opacity );",THREE.Snippets.map_fragment,THREE.Snippets.lightmap_fragment,THREE.Snippets.color_fragment,THREE.Snippets.envmap_fragment,THREE.Snippets.fog_fragment,"}"].join("\n"),vertex_shader:[THREE.Snippets.map_pars_vertex,THREE.Snippets.lightmap_pars_vertex,THREE.Snippets.envmap_pars_vertex,THREE.Snippets.color_pars_vertex,
-"void main() {\nvec4 mvPosition = modelViewMatrix * vec4( position, 1.0 );",THREE.Snippets.map_vertex,THREE.Snippets.lightmap_vertex,THREE.Snippets.envmap_vertex,THREE.Snippets.color_vertex,"gl_Position = projectionMatrix * mvPosition;\n}"].join("\n")},lambert:{uniforms:Uniforms.merge([THREE.UniformsLib.common,THREE.UniformsLib.lights]),fragment_shader:["uniform vec3 diffuse;\nuniform float opacity;\nvarying vec3 vLightWeighting;",THREE.Snippets.color_pars_fragment,THREE.Snippets.map_pars_fragment,
-THREE.Snippets.lightmap_pars_fragment,THREE.Snippets.envmap_pars_fragment,THREE.Snippets.fog_pars_fragment,"void main() {\ngl_FragColor = vec4( diffuse, opacity );\ngl_FragColor = gl_FragColor * vec4( vLightWeighting, 1.0 );",THREE.Snippets.map_fragment,THREE.Snippets.lightmap_fragment,THREE.Snippets.color_fragment,THREE.Snippets.envmap_fragment,THREE.Snippets.fog_fragment,"}"].join("\n"),vertex_shader:["varying vec3 vLightWeighting;",THREE.Snippets.map_pars_vertex,THREE.Snippets.lightmap_pars_vertex,
-THREE.Snippets.envmap_pars_vertex,THREE.Snippets.lights_pars_vertex,THREE.Snippets.color_pars_vertex,"void main() {\nvec4 mvPosition = modelViewMatrix * vec4( position, 1.0 );",THREE.Snippets.map_vertex,THREE.Snippets.lightmap_vertex,THREE.Snippets.envmap_vertex,THREE.Snippets.color_vertex,"vec3 transformedNormal = normalize( normalMatrix * normal );",THREE.Snippets.lights_vertex,"gl_Position = projectionMatrix * mvPosition;\n}"].join("\n")},phong:{uniforms:Uniforms.merge([THREE.UniformsLib.common,
-THREE.UniformsLib.lights,{ambient:{type:"c",value:new THREE.Color(328965)},specular:{type:"c",value:new THREE.Color(1118481)},shininess:{type:"f",value:30}}]),fragment_shader:["uniform vec3 diffuse;\nuniform float opacity;\nuniform vec3 ambient;\nuniform vec3 specular;\nuniform float shininess;\nvarying vec3 vLightWeighting;",THREE.Snippets.color_pars_fragment,THREE.Snippets.map_pars_fragment,THREE.Snippets.lightmap_pars_fragment,THREE.Snippets.envmap_pars_fragment,THREE.Snippets.fog_pars_fragment,
-THREE.Snippets.lights_pars_fragment,"void main() {\ngl_FragColor = vec4( vLightWeighting, 1.0 );",THREE.Snippets.lights_fragment,THREE.Snippets.map_fragment,THREE.Snippets.lightmap_fragment,THREE.Snippets.color_fragment,THREE.Snippets.envmap_fragment,THREE.Snippets.fog_fragment,"}"].join("\n"),vertex_shader:["#define PHONG\nvarying vec3 vLightWeighting;\nvarying vec3 vViewPosition;\nvarying vec3 vNormal;",THREE.Snippets.map_pars_vertex,THREE.Snippets.lightmap_pars_vertex,THREE.Snippets.envmap_pars_vertex,
-THREE.Snippets.lights_pars_vertex,THREE.Snippets.color_pars_vertex,"void main() {\nvec4 mvPosition = modelViewMatrix * vec4( position, 1.0 );",THREE.Snippets.map_vertex,THREE.Snippets.lightmap_vertex,THREE.Snippets.envmap_vertex,THREE.Snippets.color_vertex,"#ifndef USE_ENVMAP\nvec4 mPosition = objectMatrix * vec4( position, 1.0 );\n#endif\nvViewPosition = cameraPosition - mPosition.xyz;\nvec3 transformedNormal = normalize( normalMatrix * normal );\nvNormal = transformedNormal;",THREE.Snippets.lights_vertex,
-"gl_Position = projectionMatrix * mvPosition;\n}"].join("\n")},particle_basic:{uniforms:THREE.UniformsLib.particle,fragment_shader:["uniform vec3 psColor;\nuniform float opacity;",THREE.Snippets.color_pars_fragment,THREE.Snippets.map_particle_pars_fragment,THREE.Snippets.fog_pars_fragment,"void main() {\ngl_FragColor = vec4( psColor, opacity );",THREE.Snippets.map_particle_fragment,THREE.Snippets.color_fragment,THREE.Snippets.fog_fragment,"}"].join("\n"),vertex_shader:["uniform float size;",THREE.Snippets.color_pars_vertex,
-"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};

+ 142 - 0
build/custom/ThreeCanvas.js

@@ -0,0 +1,142 @@
+// ThreeCanvas.js r33 - http://github.com/mrdoob/three.js
+var THREE=THREE||{};THREE.Color=function(a){this.setHex(a)};
+THREE.Color.prototype={autoUpdate:!0,setRGB:function(a,b,c){this.r=a;this.g=b;this.b=c;if(this.autoUpdate){this.updateHex();this.updateStyleString()}},setHSV:function(a,b,c){var d,f,e,h,j,g;if(c==0)d=f=e=0;else{h=Math.floor(a*6);j=a*6-h;a=c*(1-b);g=c*(1-b*j);b=c*(1-b*(1-j));switch(h){case 1:d=g;f=c;e=a;break;case 2:d=a;f=c;e=b;break;case 3:d=a;f=g;e=c;break;case 4:d=b;f=a;e=c;break;case 5:d=c;f=a;e=g;break;case 6:case 0:d=c;f=b;e=a}}this.r=d;this.g=f;this.b=e;if(this.autoUpdate){this.updateHex();
+this.updateStyleString()}},setHex:function(a){this.hex=~~a&16777215;if(this.autoUpdate){this.updateRGBA();this.updateStyleString()}},updateHex:function(){this.hex=~~(this.r*255)<<16^~~(this.g*255)<<8^~~(this.b*255)},updateRGBA:function(){this.r=(this.hex>>16&255)/255;this.g=(this.hex>>8&255)/255;this.b=(this.hex&255)/255},updateStyleString:function(){this.__styleString="rgb("+~~(this.r*255)+","+~~(this.g*255)+","+~~(this.b*255)+")"},clone:function(){return new THREE.Color(this.hex)},toString:function(){return"THREE.Color ( r: "+
+this.r+", g: "+this.g+", b: "+this.b+", hex: "+this.hex+" )"}};THREE.Vector2=function(a,b){this.set(a||0,b||0)};
+THREE.Vector2.prototype={set:function(a,b){this.x=a;this.y=b;return this},copy:function(a){this.set(a.x,a.y);return this},addSelf:function(a){this.set(this.x+a.x,this.y+a.y);return this},add:function(a,b){this.set(a.x+b.x,a.y+b.y);return this},subSelf:function(a){this.set(this.x-a.x,this.y-a.y);return this},sub:function(a,b){this.set(a.x-b.x,a.y-b.y);return this},multiplyScalar:function(a){this.set(this.x*a,this.y*a);return this},negate:function(){this.set(-this.x,-this.y);return this},unit:function(){this.multiplyScalar(1/
+this.length());return this},length:function(){return Math.sqrt(this.lengthSq())},lengthSq:function(){return this.x*this.x+this.y*this.y},clone:function(){return new THREE.Vector2(this.x,this.y)},toString:function(){return"THREE.Vector2 ("+this.x+", "+this.y+")"}};THREE.Vector3=function(a,b,c){this.set(a||0,b||0,c||0)};
+THREE.Vector3.prototype={set:function(a,b,c){this.x=a;this.y=b;this.z=c;return this},copy:function(a){this.set(a.x,a.y,a.z);return this},add:function(a,b){this.set(a.x+b.x,a.y+b.y,a.z+b.z);return this},addSelf:function(a){this.set(this.x+a.x,this.y+a.y,this.z+a.z);return this},addScalar:function(a){this.set(this.x+a,this.y+a,this.z+a);return this},sub:function(a,b){this.set(a.x-b.x,a.y-b.y,a.z-b.z);return this},subSelf:function(a){this.set(this.x-a.x,this.y-a.y,this.z-a.z);return this},cross:function(a,
+b){this.set(a.y*b.z-a.z*b.y,a.z*b.x-a.x*b.z,a.x*b.y-a.y*b.x);return this},crossSelf:function(a){var b=this.x,c=this.y,d=this.z;this.set(c*a.z-d*a.y,d*a.x-b*a.z,b*a.y-c*a.x);return this},multiply:function(a,b){this.set(a.x*b.x,a.y*b.y,a.z*b.z);return this},multiplySelf:function(a){this.set(this.x*a.x,this.y*a.y,this.z*a.z);return this},multiplyScalar:function(a){this.set(this.x*a,this.y*a,this.z*a);return this},divideSelf:function(a){this.set(this.x/a.x,this.y/a.y,this.z/a.z);return this},divideScalar:function(a){this.set(this.x/
+a,this.y/a,this.z/a);return this},negate:function(){this.set(-this.x,-this.y,-this.z);return this},dot:function(a){return this.x*a.x+this.y*a.y+this.z*a.z},distanceTo:function(a){return Math.sqrt(this.distanceToSquared(a))},distanceToSquared:function(a){var b=this.x-a.x,c=this.y-a.y;a=this.z-a.z;return b*b+c*c+a*a},length:function(){return Math.sqrt(this.lengthSq())},lengthSq:function(){return this.x*this.x+this.y*this.y+this.z*this.z},lengthManhattan:function(){return this.x+this.y+this.z},normalize:function(){var a=
+this.length();a>0?this.multiplyScalar(1/a):this.set(0,0,0);return this},setLength:function(a){return this.normalize().multiplyScalar(a)},isZero:function(){return Math.abs(this.x)<1.0E-4&&Math.abs(this.y)<1.0E-4&&Math.abs(this.z)<1.0E-4},clone:function(){return new THREE.Vector3(this.x,this.y,this.z)},toString:function(){return"THREE.Vector3 ( "+this.x+", "+this.y+", "+this.z+" )"}};THREE.Vector4=function(a,b,c,d){this.set(a||0,b||0,c||0,d||1)};
+THREE.Vector4.prototype={set:function(a,b,c,d){this.x=a;this.y=b;this.z=c;this.w=d;return this},copy:function(a){this.set(a.x,a.y,a.z,a.w||1);return this},add:function(a,b){this.set(a.x+b.x,a.y+b.y,a.z+b.z,a.w+b.w);return this},addSelf:function(a){this.set(this.x+a.x,this.y+a.y,this.z+a.z,this.w+a.w);return this},sub:function(a,b){this.set(a.x-b.x,a.y-b.y,a.z-b.z,a.w-b.w);return this},subSelf:function(a){this.set(this.x-a.x,this.y-a.y,this.z-a.z,this.w-a.w);return this},multiplyScalar:function(a){this.set(this.x*
+a,this.y*a,this.z*a,this.w*a);return this},divideScalar:function(a){this.set(this.x/a,this.y/a,this.z/a,this.w/a);return this},lerpSelf:function(a,b){this.set(this.x+(a.x-this.x)*b,this.y+(a.y-this.y)*b,this.z+(a.z-this.z)*b,this.w+(a.w-this.w)*b)},clone:function(){return new THREE.Vector4(this.x,this.y,this.z,this.w)},toString:function(){return"THREE.Vector4 ("+this.x+", "+this.y+", "+this.z+", "+this.w+")"}};THREE.Ray=function(a,b){this.origin=a||new THREE.Vector3;this.direction=b||new THREE.Vector3};
+THREE.Ray.prototype={intersectScene:function(a){var b,c,d=a.objects,f=[];a=0;for(b=d.length;a<b;a++){c=d[a];c instanceof THREE.Mesh&&(f=f.concat(this.intersectObject(c)))}f.sort(function(e,h){return e.distance-h.distance});return f},intersectObject:function(a){function b(r,k,D,C){C=C.clone().subSelf(k);D=D.clone().subSelf(k);var I=r.clone().subSelf(k);r=C.dot(C);k=C.dot(D);C=C.dot(I);var F=D.dot(D);D=D.dot(I);I=1/(r*F-k*k);F=(F*C-k*D)*I;r=(r*D-k*C)*I;return F>0&&r>0&&F+r<1}var c,d,f,e,h,j,g,i,m,n,
+o,q=a.geometry,s=q.vertices,t=[];c=0;for(d=q.faces.length;c<d;c++){f=q.faces[c];n=this.origin.clone();o=this.direction.clone();g=a.matrixWorld;e=g.multiplyVector3(s[f.a].position.clone());h=g.multiplyVector3(s[f.b].position.clone());j=g.multiplyVector3(s[f.c].position.clone());g=f instanceof THREE.Face4?g.multiplyVector3(s[f.d].position.clone()):null;i=a.matrixRotation.multiplyVector3(f.normal.clone());m=o.dot(i);if(m<0){i=i.dot((new THREE.Vector3).sub(e,n))/m;n=n.addSelf(o.multiplyScalar(i));if(f instanceof
+THREE.Face3){if(b(n,e,h,j)){f={distance:this.origin.distanceTo(n),point:n,face:f,object:a};t.push(f)}}else if(f instanceof THREE.Face4&&(b(n,e,h,g)||b(n,h,j,g))){f={distance:this.origin.distanceTo(n),point:n,face:f,object:a};t.push(f)}}}return t}};
+THREE.Rectangle=function(){function a(){e=d-b;h=f-c}var b,c,d,f,e,h,j=!0;this.getX=function(){return b};this.getY=function(){return c};this.getWidth=function(){return e};this.getHeight=function(){return h};this.getLeft=function(){return b};this.getTop=function(){return c};this.getRight=function(){return d};this.getBottom=function(){return f};this.set=function(g,i,m,n){j=!1;b=g;c=i;d=m;f=n;a()};this.addPoint=function(g,i){if(j){j=!1;b=g;c=i;d=g;f=i}else{b=b<g?b:g;c=c<i?c:i;d=d>g?d:g;f=f>i?f:i}a()};
+this.add3Points=function(g,i,m,n,o,q){if(j){j=!1;b=g<m?g<o?g:o:m<o?m:o;c=i<n?i<q?i:q:n<q?n:q;d=g>m?g>o?g:o:m>o?m:o;f=i>n?i>q?i:q:n>q?n:q}else{b=g<m?g<o?g<b?g:b:o<b?o:b:m<o?m<b?m:b:o<b?o:b;c=i<n?i<q?i<c?i:c:q<c?q:c:n<q?n<c?n:c:q<c?q:c;d=g>m?g>o?g>d?g:d:o>d?o:d:m>o?m>d?m:d:o>d?o:d;f=i>n?i>q?i>f?i:f:q>f?q:f:n>q?n>f?n:f:q>f?q:f}a()};this.addRectangle=function(g){if(j){j=!1;b=g.getLeft();c=g.getTop();d=g.getRight();f=g.getBottom()}else{b=b<g.getLeft()?b:g.getLeft();c=c<g.getTop()?c:g.getTop();d=d>g.getRight()?
+d:g.getRight();f=f>g.getBottom()?f:g.getBottom()}a()};this.inflate=function(g){b-=g;c-=g;d+=g;f+=g;a()};this.minSelf=function(g){b=b>g.getLeft()?b:g.getLeft();c=c>g.getTop()?c:g.getTop();d=d<g.getRight()?d:g.getRight();f=f<g.getBottom()?f:g.getBottom();a()};this.instersects=function(g){return Math.min(d,g.getRight())-Math.max(b,g.getLeft())>=0&&Math.min(f,g.getBottom())-Math.max(c,g.getTop())>=0};this.empty=function(){j=!0;f=d=c=b=0;a()};this.isEmpty=function(){return j};this.toString=function(){return"THREE.Rectangle ( left: "+
+b+", right: "+d+", top: "+c+", bottom: "+f+", width: "+e+", height: "+h+" )"}};THREE.Matrix3=function(){this.m=[]};THREE.Matrix3.prototype={transpose:function(){var a,b=this.m;a=b[1];b[1]=b[3];b[3]=a;a=b[2];b[2]=b[6];b[6]=a;a=b[5];b[5]=b[7];b[7]=a;return this},transposeIntoArray:function(a){var b=this.m;a[0]=b[0];a[1]=b[3];a[2]=b[6];a[3]=b[1];a[4]=b[4];a[5]=b[7];a[6]=b[2];a[7]=b[5];a[8]=b[8];return this}};
+THREE.Matrix4=function(a,b,c,d,f,e,h,j,g,i,m,n,o,q,s,t){this.set(a||1,b||0,c||0,d||0,f||0,e||1,h||0,j||0,g||0,i||0,m||1,n||0,o||0,q||0,s||0,t||1);this.flat=Array(16);this.m33=new THREE.Matrix3};
+THREE.Matrix4.prototype={set:function(a,b,c,d,f,e,h,j,g,i,m,n,o,q,s,t){this.n11=a;this.n12=b;this.n13=c;this.n14=d;this.n21=f;this.n22=e;this.n23=h;this.n24=j;this.n31=g;this.n32=i;this.n33=m;this.n34=n;this.n41=o;this.n42=q;this.n43=s;this.n44=t;return this},identity:function(){this.set(1,0,0,0,0,1,0,0,0,0,1,0,0,0,0,1);return this},copy:function(a){this.set(a.n11,a.n12,a.n13,a.n14,a.n21,a.n22,a.n23,a.n24,a.n31,a.n32,a.n33,a.n34,a.n41,a.n42,a.n43,a.n44);return this},lookAt:function(a,b,c){var d=THREE.Matrix4.__tmpVec1,
+f=THREE.Matrix4.__tmpVec2,e=THREE.Matrix4.__tmpVec3;e.sub(a,b).normalize();d.cross(c,e).normalize();f.cross(e,d).normalize();this.n11=d.x;this.n12=d.y;this.n13=d.z;this.n14=-d.dot(a);this.n21=f.x;this.n22=f.y;this.n23=f.z;this.n24=-f.dot(a);this.n31=e.x;this.n32=e.y;this.n33=e.z;this.n34=-e.dot(a);this.n43=this.n42=this.n41=0;this.n44=1;return this},multiplyVector3:function(a){var b=a.x,c=a.y,d=a.z,f=1/(this.n41*b+this.n42*c+this.n43*d+this.n44);a.x=(this.n11*b+this.n12*c+this.n13*d+this.n14)*f;a.y=
+(this.n21*b+this.n22*c+this.n23*d+this.n24)*f;a.z=(this.n31*b+this.n32*c+this.n33*d+this.n34)*f;return a},multiplyVector3OnlyZ:function(a){var b=a.x,c=a.y;a=a.z;return(this.n31*b+this.n32*c+this.n33*a+this.n34)*(1/(this.n41*b+this.n42*c+this.n43*a+this.n44))},multiplyVector4:function(a){var b=a.x,c=a.y,d=a.z,f=a.w;a.x=this.n11*b+this.n12*c+this.n13*d+this.n14*f;a.y=this.n21*b+this.n22*c+this.n23*d+this.n24*f;a.z=this.n31*b+this.n32*c+this.n33*d+this.n34*f;a.w=this.n41*b+this.n42*c+this.n43*d+this.n44*
+f;return a},crossVector:function(a){var b=new THREE.Vector4;b.x=this.n11*a.x+this.n12*a.y+this.n13*a.z+this.n14*a.w;b.y=this.n21*a.x+this.n22*a.y+this.n23*a.z+this.n24*a.w;b.z=this.n31*a.x+this.n32*a.y+this.n33*a.z+this.n34*a.w;b.w=a.w?this.n41*a.x+this.n42*a.y+this.n43*a.z+this.n44*a.w:1;return b},multiply:function(a,b){var c=a.n11,d=a.n12,f=a.n13,e=a.n14,h=a.n21,j=a.n22,g=a.n23,i=a.n24,m=a.n31,n=a.n32,o=a.n33,q=a.n34,s=a.n41,t=a.n42,r=a.n43,k=a.n44,D=b.n11,C=b.n12,I=b.n13,F=b.n14,N=b.n21,A=b.n22,
+w=b.n23,K=b.n24,u=b.n31,L=b.n32,E=b.n33,y=b.n34;this.n11=c*D+d*N+f*u;this.n12=c*C+d*A+f*L;this.n13=c*I+d*w+f*E;this.n14=c*F+d*K+f*y+e;this.n21=h*D+j*N+g*u;this.n22=h*C+j*A+g*L;this.n23=h*I+j*w+g*E;this.n24=h*F+j*K+g*y+i;this.n31=m*D+n*N+o*u;this.n32=m*C+n*A+o*L;this.n33=m*I+n*w+o*E;this.n34=m*F+n*K+o*y+q;this.n41=s*D+t*N+r*u;this.n42=s*C+t*A+r*L;this.n43=s*I+t*w+r*E;this.n44=s*F+t*K+r*y+k;return this},multiplyToArray:function(a,b,c){var d=a.n11,f=a.n12,e=a.n13,h=a.n14,j=a.n21,g=a.n22,i=a.n23,m=a.n24,
+n=a.n31,o=a.n32,q=a.n33,s=a.n34,t=a.n41,r=a.n42,k=a.n43;a=a.n44;var D=b.n11,C=b.n12,I=b.n13,F=b.n14,N=b.n21,A=b.n22,w=b.n23,K=b.n24,u=b.n31,L=b.n32,E=b.n33,y=b.n34,B=b.n41,T=b.n42,x=b.n43;b=b.n44;this.n11=d*D+f*N+e*u+h*B;this.n12=d*C+f*A+e*L+h*T;this.n13=d*I+f*w+e*E+h*x;this.n14=d*F+f*K+e*y+h*b;this.n21=j*D+g*N+i*u+m*B;this.n22=j*C+g*A+i*L+m*T;this.n23=j*I+g*w+i*E+m*x;this.n24=j*F+g*K+i*y+m*b;this.n31=n*D+o*N+q*u+s*B;this.n32=n*C+o*A+q*L+s*T;this.n33=n*I+o*w+q*E+s*x;this.n34=n*F+o*K+q*y+s*b;this.n41=
+t*D+r*N+k*u+a*B;this.n42=t*C+r*A+k*L+a*T;this.n43=t*I+r*w+k*E+a*x;this.n44=t*F+r*K+k*y+a*b;c[0]=this.n11;c[1]=this.n21;c[2]=this.n31;c[3]=this.n41;c[4]=this.n12;c[5]=this.n22;c[6]=this.n32;c[7]=this.n42;c[8]=this.n13;c[9]=this.n23;c[10]=this.n33;c[11]=this.n43;c[12]=this.n14;c[13]=this.n24;c[14]=this.n34;c[15]=this.n44;return this},multiplySelf:function(a){var b=this.n11,c=this.n12,d=this.n13,f=this.n14,e=this.n21,h=this.n22,j=this.n23,g=this.n24,i=this.n31,m=this.n32,n=this.n33,o=this.n34,q=this.n41,
+s=this.n42,t=this.n43,r=this.n44,k=a.n11,D=a.n21,C=a.n31,I=a.n12,F=a.n22,N=a.n32,A=a.n13,w=a.n23,K=a.n33,u=a.n14,L=a.n24;a=a.n34;this.n11=b*k+c*D+d*C;this.n12=b*I+c*F+d*N;this.n13=b*A+c*w+d*K;this.n14=b*u+c*L+d*a+f;this.n21=e*k+h*D+j*C;this.n22=e*I+h*F+j*N;this.n23=e*A+h*w+j*K;this.n24=e*u+h*L+j*a+g;this.n31=i*k+m*D+n*C;this.n32=i*I+m*F+n*N;this.n33=i*A+m*w+n*K;this.n34=i*u+m*L+n*a+o;this.n41=q*k+s*D+t*C;this.n42=q*I+s*F+t*N;this.n43=q*A+s*w+t*K;this.n44=q*u+s*L+t*a+r;return this},multiplyScalar:function(a){this.n11*=
+a;this.n12*=a;this.n13*=a;this.n14*=a;this.n21*=a;this.n22*=a;this.n23*=a;this.n24*=a;this.n31*=a;this.n32*=a;this.n33*=a;this.n34*=a;this.n41*=a;this.n42*=a;this.n43*=a;this.n44*=a;return this},determinant:function(){var a=this.n11,b=this.n12,c=this.n13,d=this.n14,f=this.n21,e=this.n22,h=this.n23,j=this.n24,g=this.n31,i=this.n32,m=this.n33,n=this.n34,o=this.n41,q=this.n42,s=this.n43,t=this.n44;return d*h*i*o-c*j*i*o-d*e*m*o+b*j*m*o+c*e*n*o-b*h*n*o-d*h*g*q+c*j*g*q+d*f*m*q-a*j*m*q-c*f*n*q+a*h*n*q+
+d*e*g*s-b*j*g*s-d*f*i*s+a*j*i*s+b*f*n*s-a*e*n*s-c*e*g*t+b*h*g*t+c*f*i*t-a*h*i*t-b*f*m*t+a*e*m*t},transpose:function(){function a(b,c,d){var f=b[c];b[c]=b[d];b[d]=f}a(this,"n21","n12");a(this,"n31","n13");a(this,"n32","n23");a(this,"n41","n14");a(this,"n42","n24");a(this,"n43","n34");return this},clone:function(){var a=new THREE.Matrix4;a.n11=this.n11;a.n12=this.n12;a.n13=this.n13;a.n14=this.n14;a.n21=this.n21;a.n22=this.n22;a.n23=this.n23;a.n24=this.n24;a.n31=this.n31;a.n32=this.n32;a.n33=this.n33;
+a.n34=this.n34;a.n41=this.n41;a.n42=this.n42;a.n43=this.n43;a.n44=this.n44;return a},flatten:function(){this.flattenToArray(this.flat);return this.flat},flattenToArray:function(a){a[0]=this.n11;a[1]=this.n21;a[2]=this.n31;a[3]=this.n41;a[4]=this.n12;a[5]=this.n22;a[6]=this.n32;a[7]=this.n42;a[8]=this.n13;a[9]=this.n23;a[10]=this.n33;a[11]=this.n43;a[12]=this.n14;a[13]=this.n24;a[14]=this.n34;a[15]=this.n44;return a},flattenToArrayOffset:function(a,b){a[b]=this.n11;a[b+1]=this.n21;a[b+2]=this.n31;
+a[b+3]=this.n41;a[b+4]=this.n12;a[b+5]=this.n22;a[b+6]=this.n32;a[b+7]=this.n42;a[b+8]=this.n13;a[b+9]=this.n23;a[b+10]=this.n33;a[b+11]=this.n43;a[b+12]=this.n14;a[b+13]=this.n24;a[b+14]=this.n34;a[b+15]=this.n44;return a},setTranslation:function(a,b,c){this.set(1,0,0,a,0,1,0,b,0,0,1,c,0,0,0,1);return this},setScale:function(a,b,c){this.set(a,0,0,0,0,b,0,0,0,0,c,0,0,0,0,1);return this},setRotX:function(a){var b=Math.cos(a);a=Math.sin(a);this.set(1,0,0,0,0,b,-a,0,0,a,b,0,0,0,0,1);return this},setRotY:function(a){var b=
+Math.cos(a);a=Math.sin(a);this.set(b,0,a,0,0,1,0,0,-a,0,b,0,0,0,0,1);return this},setRotZ:function(a){var b=Math.cos(a);a=Math.sin(a);this.set(b,-a,0,0,a,b,0,0,0,0,1,0,0,0,0,1);return this},setRotAxis:function(a,b){var c=Math.cos(b),d=Math.sin(b),f=1-c,e=a.x,h=a.y,j=a.z,g=f*e,i=f*h;this.set(g*e+c,g*h-d*j,g*j+d*h,0,g*h+d*j,i*h+c,i*j-d*e,0,g*j-d*h,i*j+d*e,f*j*j+c,0,0,0,0,1);return this},setPosition:function(a){this.n14=a.x;this.n24=a.y;this.n34=a.z;return this},setRotationFromEuler:function(a){var b=
+a.x,c=a.y,d=a.z;a=Math.cos(b);b=Math.sin(b);var f=Math.cos(c);c=Math.sin(c);var e=Math.cos(d);d=Math.sin(d);var h=a*c,j=b*c;this.n11=f*e;this.n12=-f*d;this.n13=c;this.n21=j*e+a*d;this.n22=-j*d+a*e;this.n23=-b*f;this.n31=-h*e+b*d;this.n32=h*d+b*e;this.n33=a*f},setRotationFromQuaternion:function(a){var b=a.x,c=a.y,d=a.z,f=a.w,e=b+b,h=c+c,j=d+d;a=b*e;var g=b*h;b*=j;var i=c*h;c*=j;d*=j;e*=f;h*=f;f*=j;this.n11=1-(i+d);this.n12=g-f;this.n13=b+h;this.n21=g+f;this.n22=1-(a+d);this.n23=c-e;this.n31=b-h;this.n32=
+c+e;this.n33=1-(a+i)},scale:function(a){var b=a.x,c=a.y;a=a.z;this.n11*=b;this.n12*=c;this.n13*=a;this.n21*=b;this.n22*=c;this.n23*=a;this.n31*=b;this.n32*=c;this.n33*=a;this.n41*=b;this.n42*=c;this.n43*=a;return this},toString:function(){return"| "+this.n11+" "+this.n12+" "+this.n13+" "+this.n14+" |\n| "+this.n21+" "+this.n22+" "+this.n23+" "+this.n24+" |\n| "+this.n31+" "+this.n32+" "+this.n33+" "+this.n34+" |\n| "+this.n41+" "+this.n42+" "+this.n43+" "+this.n44+" |"}};
+THREE.Matrix4.translationMatrix=function(a,b,c){var d=new THREE.Matrix4;d.setTranslation(a,b,c);return d};THREE.Matrix4.scaleMatrix=function(a,b,c){var d=new THREE.Matrix4;d.setScale(a,b,c);return d};THREE.Matrix4.rotationXMatrix=function(a){var b=new THREE.Matrix4;b.setRotX(a);return b};THREE.Matrix4.rotationYMatrix=function(a){var b=new THREE.Matrix4;b.setRotY(a);return b};THREE.Matrix4.rotationZMatrix=function(a){var b=new THREE.Matrix4;b.setRotZ(a);return b};
+THREE.Matrix4.rotationAxisAngleMatrix=function(a,b){var c=new THREE.Matrix4;c.setRotAxis(a,b);return c};
+THREE.Matrix4.makeInvert=function(a,b){var c=a.n11,d=a.n12,f=a.n13,e=a.n14,h=a.n21,j=a.n22,g=a.n23,i=a.n24,m=a.n31,n=a.n32,o=a.n33,q=a.n34,s=a.n41,t=a.n42,r=a.n43,k=a.n44;b===undefined&&(b=new THREE.Matrix4);b.n11=g*q*t-i*o*t+i*n*r-j*q*r-g*n*k+j*o*k;b.n12=e*o*t-f*q*t-e*n*r+d*q*r+f*n*k-d*o*k;b.n13=f*i*t-e*g*t+e*j*r-d*i*r-f*j*k+d*g*k;b.n14=e*g*n-f*i*n-e*j*o+d*i*o+f*j*q-d*g*q;b.n21=i*o*s-g*q*s-i*m*r+h*q*r+g*m*k-h*o*k;b.n22=f*q*s-e*o*s+e*m*r-c*q*r-f*m*k+c*o*k;b.n23=e*g*s-f*i*s-e*h*r+c*i*r+f*h*k-c*g*k;
+b.n24=f*i*m-e*g*m+e*h*o-c*i*o-f*h*q+c*g*q;b.n31=j*q*s-i*n*s+i*m*t-h*q*t-j*m*k+h*n*k;b.n32=e*n*s-d*q*s-e*m*t+c*q*t+d*m*k-c*n*k;b.n33=f*i*s-e*j*s+e*h*t-c*i*t-d*h*k+c*j*k;b.n34=e*j*m-d*i*m-e*h*n+c*i*n+d*h*q-c*j*q;b.n41=g*n*s-j*o*s-g*m*t+h*o*t+j*m*r-h*n*r;b.n42=d*o*s-f*n*s+f*m*t-c*o*t-d*m*r+c*n*r;b.n43=f*j*s-d*g*s-f*h*t+c*g*t+d*h*r-c*j*r;b.n44=d*g*m-f*j*m+f*h*n-c*g*n-d*h*o+c*j*o;b.multiplyScalar(1/a.determinant());return b};
+THREE.Matrix4.makeInvert3x3=function(a){var b=a.m33,c=b.m,d=a.n33*a.n22-a.n32*a.n23,f=-a.n33*a.n21+a.n31*a.n23,e=a.n32*a.n21-a.n31*a.n22,h=-a.n33*a.n12+a.n32*a.n13,j=a.n33*a.n11-a.n31*a.n13,g=-a.n32*a.n11+a.n31*a.n12,i=a.n23*a.n12-a.n22*a.n13,m=-a.n23*a.n11+a.n21*a.n13,n=a.n22*a.n11-a.n21*a.n12;a=a.n11*d+a.n21*h+a.n31*i;if(a==0)throw"matrix not invertible";a=1/a;c[0]=a*d;c[1]=a*f;c[2]=a*e;c[3]=a*h;c[4]=a*j;c[5]=a*g;c[6]=a*i;c[7]=a*m;c[8]=a*n;return b};
+THREE.Matrix4.makeFrustum=function(a,b,c,d,f,e){var h;h=new THREE.Matrix4;h.n11=2*f/(b-a);h.n12=0;h.n13=(b+a)/(b-a);h.n14=0;h.n21=0;h.n22=2*f/(d-c);h.n23=(d+c)/(d-c);h.n24=0;h.n31=0;h.n32=0;h.n33=-(e+f)/(e-f);h.n34=-2*e*f/(e-f);h.n41=0;h.n42=0;h.n43=-1;h.n44=0;return h};THREE.Matrix4.makePerspective=function(a,b,c,d){var f;a=c*Math.tan(a*Math.PI/360);f=-a;return THREE.Matrix4.makeFrustum(f*b,a*b,f,a,c,d)};
+THREE.Matrix4.makeOrtho=function(a,b,c,d,f,e){var h,j,g,i;h=new THREE.Matrix4;j=b-a;g=c-d;i=e-f;h.n11=2/j;h.n12=0;h.n13=0;h.n14=-((b+a)/j);h.n21=0;h.n22=2/g;h.n23=0;h.n24=-((c+d)/g);h.n31=0;h.n32=0;h.n33=-2/i;h.n34=-((e+f)/i);h.n41=0;h.n42=0;h.n43=0;h.n44=1;return h};THREE.Matrix4.__tmpVec1=new THREE.Vector3;THREE.Matrix4.__tmpVec2=new THREE.Vector3;THREE.Matrix4.__tmpVec3=new THREE.Vector3;
+THREE.Object3D=function(){this.id=THREE.Object3DCounter.value++;this.parent=undefined;this.children=[];this.position=new THREE.Vector3;this.positionScreen=new THREE.Vector4;this.rotation=new THREE.Vector3;this.scale=new THREE.Vector3(1,1,1);this.matrix=new THREE.Matrix4;this.matrixWorld=new THREE.Matrix4;this.matrixRotation=new THREE.Matrix4;this.matrixRotationWorld=new THREE.Matrix4;this.matrixNeedsUpdate=!0;this.matrixAutoUpdate=!0;this.quaternion=new THREE.Quaternion;this.useQuaternion=!1;this.boundRadius=
+0;this.boundRadiusScale=1;this.visible=!0};
+THREE.Object3D.prototype={addChild:function(a){if(this.children.indexOf(a)===-1){a.parent!==undefined&&a.parent.removeChild(a);a.parent=this;this.children.push(a)}},removeChild:function(a){var b=this.children.indexOf(a);if(b!==-1){a.parent=undefined;this.children.splice(b,1)}},updateMatrix:function(){this.matrix.setPosition(this.position);this.useQuaternion?this.matrixRotation.setRotationFromQuaternion(this.quaternion):this.matrixRotation.setRotationFromEuler(this.rotation);this.matrix.n11=this.matrixRotation.n11;
+this.matrix.n12=this.matrixRotation.n12;this.matrix.n13=this.matrixRotation.n13;this.matrix.n21=this.matrixRotation.n21;this.matrix.n22=this.matrixRotation.n22;this.matrix.n23=this.matrixRotation.n23;this.matrix.n31=this.matrixRotation.n31;this.matrix.n32=this.matrixRotation.n32;this.matrix.n33=this.matrixRotation.n33;if(this.scale.x!==1||this.scale.y!==1||this.scale.z!==1){this.matrix.scale(this.scale);this.boundRadiusScale=Math.max(this.scale.x,Math.max(this.scale.y,this.scale.z))}return!0},update:function(a,
+b,c){if(this.visible){this.matrixAutoUpdate&&(b|=this.updateMatrix());if(b||this.matrixNeedsUpdate){a?this.matrixWorld.multiply(a,this.matrix):this.matrixWorld.copy(this.matrix);this.matrixNeedsUpdate=!1;b=!0}a=0;for(var d=this.children.length;a<d;a++)this.children[a].update(this.matrixWorld,b,c)}}};THREE.Object3DCounter={value:0};
+THREE.Vertex=function(a,b){this.position=a||new THREE.Vector3;this.positionWorld=new THREE.Vector3;this.positionScreen=new THREE.Vector4;this.normal=b||new THREE.Vector3;this.normalWorld=new THREE.Vector3;this.normalScreen=new THREE.Vector3;this.tangent=new THREE.Vector4;this.__visible=!0};THREE.Vertex.prototype={toString:function(){return"THREE.Vertex ( position: "+this.position+", normal: "+this.normal+" )"}};
+THREE.Face3=function(a,b,c,d,f){this.a=a;this.b=b;this.c=c;this.centroid=new THREE.Vector3;this.normal=d instanceof THREE.Vector3?d:new THREE.Vector3;this.vertexNormals=d instanceof Array?d:[];this.materials=f instanceof Array?f:[f]};THREE.Face3.prototype={toString:function(){return"THREE.Face3 ( "+this.a+", "+this.b+", "+this.c+" )"}};
+THREE.Face4=function(a,b,c,d,f,e){this.a=a;this.b=b;this.c=c;this.d=d;this.centroid=new THREE.Vector3;this.normal=f instanceof THREE.Vector3?f:new THREE.Vector3;this.vertexNormals=f instanceof Array?f:[];this.materials=e instanceof Array?e:[e]};THREE.Face4.prototype={toString:function(){return"THREE.Face4 ( "+this.a+", "+this.b+", "+this.c+" "+this.d+" )"}};THREE.UV=function(a,b){this.set(a||0,b||0)};
+THREE.UV.prototype={set:function(a,b){this.u=a;this.v=b;return this},copy:function(a){this.set(a.u,a.v);return this},toString:function(){return"THREE.UV ("+this.u+", "+this.v+")"}};THREE.Geometry=function(){this.id="Geometry"+THREE.GeometryIdCounter++;this.vertices=[];this.faces=[];this.uvs=[];this.uvs2=[];this.colors=[];this.skinWeights=[];this.skinIndices=[];this.boundingSphere=this.boundingBox=null;this.geometryChunks={};this.hasTangents=!1};
+THREE.Geometry.prototype={computeCentroids:function(){var a,b,c;a=0;for(b=this.faces.length;a<b;a++){c=this.faces[a];c.centroid.set(0,0,0);if(c instanceof THREE.Face3){c.centroid.addSelf(this.vertices[c.a].position);c.centroid.addSelf(this.vertices[c.b].position);c.centroid.addSelf(this.vertices[c.c].position);c.centroid.divideScalar(3)}else if(c instanceof THREE.Face4){c.centroid.addSelf(this.vertices[c.a].position);c.centroid.addSelf(this.vertices[c.b].position);c.centroid.addSelf(this.vertices[c.c].position);
+c.centroid.addSelf(this.vertices[c.d].position);c.centroid.divideScalar(4)}}},computeFaceNormals:function(a){var b,c,d,f,e,h,j=new THREE.Vector3,g=new THREE.Vector3;d=0;for(f=this.vertices.length;d<f;d++){e=this.vertices[d];e.normal.set(0,0,0)}d=0;for(f=this.faces.length;d<f;d++){e=this.faces[d];if(a&&e.vertexNormals.length){j.set(0,0,0);b=0;for(c=e.normal.length;b<c;b++)j.addSelf(e.vertexNormals[b]);j.divideScalar(3)}else{b=this.vertices[e.a];c=this.vertices[e.b];h=this.vertices[e.c];j.sub(h.position,
+c.position);g.sub(b.position,c.position);j.crossSelf(g)}j.isZero()||j.normalize();e.normal.copy(j)}},computeVertexNormals:function(){var a,b,c,d;if(this.__tmpVertices==undefined){d=this.__tmpVertices=Array(this.vertices.length);a=0;for(b=this.vertices.length;a<b;a++)d[a]=new THREE.Vector3;a=0;for(b=this.faces.length;a<b;a++){c=this.faces[a];if(c instanceof THREE.Face3)c.vertexNormals=[new THREE.Vector3,new THREE.Vector3,new THREE.Vector3];else if(c instanceof THREE.Face4)c.vertexNormals=[new THREE.Vector3,
+new THREE.Vector3,new THREE.Vector3,new THREE.Vector3]}}else{d=this.__tmpVertices;a=0;for(b=this.vertices.length;a<b;a++)d[a].set(0,0,0)}a=0;for(b=this.faces.length;a<b;a++){c=this.faces[a];if(c instanceof THREE.Face3){d[c.a].addSelf(c.normal);d[c.b].addSelf(c.normal);d[c.c].addSelf(c.normal)}else if(c instanceof THREE.Face4){d[c.a].addSelf(c.normal);d[c.b].addSelf(c.normal);d[c.c].addSelf(c.normal);d[c.d].addSelf(c.normal)}}a=0;for(b=this.vertices.length;a<b;a++)d[a].normalize();a=0;for(b=this.faces.length;a<
+b;a++){c=this.faces[a];if(c instanceof THREE.Face3){c.vertexNormals[0].copy(d[c.a]);c.vertexNormals[1].copy(d[c.b]);c.vertexNormals[2].copy(d[c.c])}else if(c instanceof THREE.Face4){c.vertexNormals[0].copy(d[c.a]);c.vertexNormals[1].copy(d[c.b]);c.vertexNormals[2].copy(d[c.c]);c.vertexNormals[3].copy(d[c.d])}}},computeTangents:function(){function a(y,B,T,x,P,Y,J){e=y.vertices[B].position;h=y.vertices[T].position;j=y.vertices[x].position;g=f[P];i=f[Y];m=f[J];n=h.x-e.x;o=j.x-e.x;q=h.y-e.y;s=j.y-e.y;
+t=h.z-e.z;r=j.z-e.z;k=i.u-g.u;D=m.u-g.u;C=i.v-g.v;I=m.v-g.v;F=1/(k*I-D*C);w.set((I*n-C*o)*F,(I*q-C*s)*F,(I*t-C*r)*F);K.set((k*o-D*n)*F,(k*s-D*q)*F,(k*r-D*t)*F);N[B].addSelf(w);N[T].addSelf(w);N[x].addSelf(w);A[B].addSelf(K);A[T].addSelf(K);A[x].addSelf(K)}var b,c,d,f,e,h,j,g,i,m,n,o,q,s,t,r,k,D,C,I,F,N=[],A=[],w=new THREE.Vector3,K=new THREE.Vector3,u=new THREE.Vector3,L=new THREE.Vector3,E=new THREE.Vector3;b=0;for(c=this.vertices.length;b<c;b++){N[b]=new THREE.Vector3;A[b]=new THREE.Vector3}b=0;
+for(c=this.faces.length;b<c;b++){d=this.faces[b];f=this.uvs[b];if(d instanceof THREE.Face3){a(this,d.a,d.b,d.c,0,1,2);this.vertices[d.a].normal.copy(d.vertexNormals[0]);this.vertices[d.b].normal.copy(d.vertexNormals[1]);this.vertices[d.c].normal.copy(d.vertexNormals[2])}else if(d instanceof THREE.Face4){a(this,d.a,d.b,d.c,0,1,2);a(this,d.a,d.b,d.d,0,1,3);this.vertices[d.a].normal.copy(d.vertexNormals[0]);this.vertices[d.b].normal.copy(d.vertexNormals[1]);this.vertices[d.c].normal.copy(d.vertexNormals[2]);
+this.vertices[d.d].normal.copy(d.vertexNormals[3])}}b=0;for(c=this.vertices.length;b<c;b++){E.copy(this.vertices[b].normal);d=N[b];u.copy(d);u.subSelf(E.multiplyScalar(E.dot(d))).normalize();L.cross(this.vertices[b].normal,d);d=L.dot(A[b]);d=d<0?-1:1;this.vertices[b].tangent.set(u.x,u.y,u.z,d)}this.hasTangents=!0},computeBoundingBox:function(){var a;if(this.vertices.length>0){this.boundingBox={x:[this.vertices[0].position.x,this.vertices[0].position.x],y:[this.vertices[0].position.y,this.vertices[0].position.y],
+z:[this.vertices[0].position.z,this.vertices[0].position.z]};for(var b=1,c=this.vertices.length;b<c;b++){a=this.vertices[b];if(a.position.x<this.boundingBox.x[0])this.boundingBox.x[0]=a.position.x;else if(a.position.x>this.boundingBox.x[1])this.boundingBox.x[1]=a.position.x;if(a.position.y<this.boundingBox.y[0])this.boundingBox.y[0]=a.position.y;else if(a.position.y>this.boundingBox.y[1])this.boundingBox.y[1]=a.position.y;if(a.position.z<this.boundingBox.z[0])this.boundingBox.z[0]=a.position.z;else if(a.position.z>
+this.boundingBox.z[1])this.boundingBox.z[1]=a.position.z}}},computeBoundingSphere:function(){for(var a=this.boundingSphere===null?0:this.boundingSphere.radius,b=0,c=this.vertices.length;b<c;b++)a=Math.max(a,this.vertices[b].position.length());this.boundingSphere={radius:a}},sortFacesByMaterial:function(){function a(m){var n=[];b=0;for(c=m.length;b<c;b++)m[b]==undefined?n.push("undefined"):n.push(m[b].id);return n.join("_")}var b,c,d,f,e,h,j,g,i={};d=0;for(f=this.faces.length;d<f;d++){e=this.faces[d];
+h=e.materials;j=a(h);i[j]==undefined&&(i[j]={hash:j,counter:0});g=i[j].hash+"_"+i[j].counter;this.geometryChunks[g]==undefined&&(this.geometryChunks[g]={faces:[],materials:h,vertices:0});e=e instanceof THREE.Face3?3:4;if(this.geometryChunks[g].vertices+e>65535){i[j].counter+=1;g=i[j].hash+"_"+i[j].counter;this.geometryChunks[g]==undefined&&(this.geometryChunks[g]={faces:[],materials:h,vertices:0})}this.geometryChunks[g].faces.push(d);this.geometryChunks[g].vertices+=e}},toString:function(){return"THREE.Geometry ( vertices: "+
+this.vertices+", faces: "+this.faces+", uvs: "+this.uvs+" )"}};THREE.GeometryIdCounter=0;
+THREE.Camera=function(a,b,c,d,f){THREE.Object3D.call(this);this.fov=a||50;this.aspect=b||1;this.near=c||0.1;this.far=d||2E3;this.screenCenterY=this.screenCenterX=0;this.target=f||new THREE.Object3D;this.useTarget=!0;this.up=new THREE.Vector3(0,1,0);this.inverseMatrix=new THREE.Matrix4;this.projectionMatrix=null;this.tmpVec=new THREE.Vector3;this.translateX=function(e,h){this.tmpVec.sub(this.target.position,this.position).normalize().multiplyScalar(e);this.tmpVec.crossSelf(this.up);if(h)this.tmpVec.y=
+0;this.position.addSelf(this.tmpVec);this.target.position.addSelf(this.tmpVec)};this.translateZ=function(e,h){this.tmpVec.sub(this.target.position,this.position).normalize().multiplyScalar(e);if(h)this.tmpVec.y=0;this.position.subSelf(this.tmpVec);this.target.position.subSelf(this.tmpVec)};this.updateProjectionMatrix()};THREE.Camera.prototype=new THREE.Object3D;THREE.Camera.prototype.constructor=THREE.Camera;THREE.Camera.prototype.supr=THREE.Object3D.prototype;
+THREE.Camera.prototype.updateProjectionMatrix=function(){this.projectionMatrix=THREE.Matrix4.makePerspective(this.fov,this.aspect,this.near,this.far)};
+THREE.Camera.prototype.update=function(a,b,c){if(this.useTarget){this.matrix.lookAt(this.position,this.target.position,this.up);a?this.matrixWorld.multiply(a,this.matrix):this.matrixWorld.copy(this.matrix);THREE.Matrix4.makeInvert(this.matrixWorld,this.inverseMatrix);b=!0}else{this.matrixAutoUpdate&&(b|=this.updateMatrix());if(b||this.matrixNeedsUpdate){a?this.matrixWorld.multiply(a,this.matrix):this.matrixWorld.copy(this.matrix);this.matrixNeedsUpdate=!1;b=!0;THREE.Matrix4.makeInvert(this.matrixWorld,
+this.inverseMatrix)}}for(a=0;a<this.children.length;a++)this.children[a].update(this.matrixWorld,b,c)};
+THREE.Camera.prototype.frustumContains=function(a){var b=a.matrixWorld.n14,c=a.matrixWorld.n24,d=a.matrixWorld.n34,f=this.inverseMatrix,e=a.boundRadius*a.boundRadiusScale,h=f.n31*b+f.n32*c+f.n33*d+f.n34;if(h-e>-this.near)return!1;if(h+e<-this.far)return!1;h-=e;var j=this.projectionMatrix,g=1/(j.n43*h),i=g*this.screenCenterX,m=(f.n11*b+f.n12*c+f.n13*d+f.n14)*j.n11*i;e=j.n11*e*i;if(m+e<-this.screenCenterX)return!1;if(m-e>this.screenCenterX)return!1;b=(f.n21*b+f.n22*c+f.n23*d+f.n24)*j.n22*g*this.screenCenterY;
+if(b+e<-this.screenCenterY)return!1;if(b-e>this.screenCenterY)return!1;a.positionScreen.set(m,b,h,e);return!0};THREE.Light=function(a){THREE.Object3D.call(this);this.color=new THREE.Color(a)};THREE.Light.prototype=new THREE.Object3D;THREE.Light.prototype.constructor=THREE.Light;THREE.Light.prototype.supr=THREE.Object3D.prototype;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,b){THREE.Light.call(this,a);this.position=new THREE.Vector3(0,1,0);this.intensity=b||1};THREE.DirectionalLight.prototype=new THREE.Light;THREE.DirectionalLight.prototype.constructor=THREE.DirectionalLight;THREE.PointLight=function(a,b){THREE.Light.call(this,a);this.position=new THREE.Vector3;this.intensity=b||1};THREE.PointLight.prototype=new THREE.Light;THREE.PointLight.prototype.constructor=THREE.PointLight;THREE.FlatShading=0;THREE.SmoothShading=1;
+THREE.NormalBlending=0;THREE.AdditiveBlending=1;THREE.SubtractiveBlending=2;THREE.BillboardBlending=3;THREE.ReverseSubtractiveBlending=4;THREE.MaterialCounter={value:0};THREE.CubeReflectionMapping=function(){};THREE.CubeRefractionMapping=function(){};THREE.LatitudeReflectionMapping=function(){};THREE.LatitudeRefractionMapping=function(){};THREE.SphericalReflectionMapping=function(){};THREE.SphericalRefractionMapping=function(){};THREE.UVMapping=function(){};
+THREE.LineBasicMaterial=function(a){this.id=THREE.MaterialCounter.value++;this.color=new THREE.Color(16777215);this.opacity=1;this.blending=THREE.NormalBlending;this.depth_test=!0;this.linewidth=1;this.linejoin=this.linecap="round";this.vertex_colors=!1;if(a){a.color!==undefined&&this.color.setHex(a.color);if(a.opacity!==undefined)this.opacity=a.opacity;if(a.blending!==undefined)this.blending=a.blending;if(a.depth_test!==undefined)this.depth_test=a.depth_test;if(a.linewidth!==undefined)this.linewidth=
+a.linewidth;if(a.linecap!==undefined)this.linecap=a.linecap;if(a.linejoin!==undefined)this.linejoin=a.linejoin;if(a.vertex_colors!==undefined)this.vertex_colors=a.vertex_colors}};
+THREE.LineBasicMaterial.prototype={toString:function(){return"THREE.LineBasicMaterial (<br/>id: "+this.id+"<br/>color: "+this.color+"<br/>opacity: "+this.opacity+"<br/>blending: "+this.blending+"<br/>depth_test: "+this.depth_test+"<br/>linewidth: "+this.linewidth+"<br/>linecap: "+this.linecap+"<br/>linejoin: "+this.linejoin+"<br/>vertex_colors: "+this.vertex_colors+"<br/>)"}};
+THREE.MeshBasicMaterial=function(a){this.id=THREE.MaterialCounter.value++;this.color=new THREE.Color(16777215);this.opacity=1;this.env_map=this.light_map=this.map=null;this.combine=THREE.MultiplyOperation;this.reflectivity=1;this.refraction_ratio=0.98;this.fog=!0;this.shading=THREE.SmoothShading;this.blending=THREE.NormalBlending;this.depth_test=!0;this.wireframe=!1;this.wireframe_linewidth=1;this.wireframe_linejoin=this.wireframe_linecap="round";this.vertex_colors=!1;this.skinning=!1;if(a){a.color!==
+undefined&&this.color.setHex(a.color);if(a.opacity!==undefined)this.opacity=a.opacity;if(a.map!==undefined)this.map=a.map;if(a.light_map!==undefined)this.light_map=a.light_map;if(a.env_map!==undefined)this.env_map=a.env_map;if(a.combine!==undefined)this.combine=a.combine;if(a.reflectivity!==undefined)this.reflectivity=a.reflectivity;if(a.refraction_ratio!==undefined)this.refraction_ratio=a.refraction_ratio;if(a.fog!==undefined)this.fog=a.fog;if(a.shading!==undefined)this.shading=a.shading;if(a.blending!==
+undefined)this.blending=a.blending;if(a.depth_test!==undefined)this.depth_test=a.depth_test;if(a.wireframe!==undefined)this.wireframe=a.wireframe;if(a.wireframe_linewidth!==undefined)this.wireframe_linewidth=a.wireframe_linewidth;if(a.wireframe_linecap!==undefined)this.wireframe_linecap=a.wireframe_linecap;if(a.wireframe_linejoin!==undefined)this.wireframe_linejoin=a.wireframe_linejoin;if(a.vertex_colors!==undefined)this.vertex_colors=a.vertex_colors;if(a.skinning!==undefined)this.skinning=a.skinning}};
+THREE.MeshBasicMaterial.prototype={toString:function(){return"THREE.MeshBasicMaterial (<br/>id: "+this.id+"<br/>color: "+this.color+"<br/>opacity: "+this.opacity+"<br/>map: "+this.map+"<br/>light_map: "+this.light_map+"<br/>env_map: "+this.env_map+"<br/>combine: "+this.combine+"<br/>reflectivity: "+this.reflectivity+"<br/>refraction_ratio: "+this.refraction_ratio+"<br/>blending: "+this.blending+"<br/>depth_test: "+this.depth_test+"<br/>wireframe: "+this.wireframe+"<br/>wireframe_linewidth: "+this.wireframe_linewidth+
+"<br/>wireframe_linecap: "+this.wireframe_linecap+"<br/>wireframe_linejoin: "+this.wireframe_linejoin+"<br/>vertex_colors: "+this.vertex_colors+"<br/>skinning: "+this.skinning+"<br/>)"}};
+THREE.MeshLambertMaterial=function(a){this.id=THREE.MaterialCounter.value++;this.color=new THREE.Color(16777215);this.opacity=1;this.env_map=this.light_map=this.map=null;this.combine=THREE.MultiplyOperation;this.reflectivity=1;this.refraction_ratio=0.98;this.fog=!0;this.shading=THREE.SmoothShading;this.blending=THREE.NormalBlending;this.depth_test=!0;this.wireframe=!1;this.wireframe_linewidth=1;this.wireframe_linejoin=this.wireframe_linecap="round";this.vertex_colors=!1;this.skinning=!1;if(a){a.color!==
+undefined&&this.color.setHex(a.color);if(a.opacity!==undefined)this.opacity=a.opacity;if(a.map!==undefined)this.map=a.map;if(a.light_map!==undefined)this.light_map=a.light_map;if(a.env_map!==undefined)this.env_map=a.env_map;if(a.combine!==undefined)this.combine=a.combine;if(a.reflectivity!==undefined)this.reflectivity=a.reflectivity;if(a.refraction_ratio!==undefined)this.refraction_ratio=a.refraction_ratio;if(a.fog!==undefined)this.fog=a.fog;if(a.shading!==undefined)this.shading=a.shading;if(a.blending!==
+undefined)this.blending=a.blending;if(a.depth_test!==undefined)this.depth_test=a.depth_test;if(a.wireframe!==undefined)this.wireframe=a.wireframe;if(a.wireframe_linewidth!==undefined)this.wireframe_linewidth=a.wireframe_linewidth;if(a.wireframe_linecap!==undefined)this.wireframe_linecap=a.wireframe_linecap;if(a.wireframe_linejoin!==undefined)this.wireframe_linejoin=a.wireframe_linejoin;if(a.vertex_colors!==undefined)this.vertex_colors=a.vertex_colors;if(a.skinning!==undefined)this.skinning=a.skinning}};
+THREE.MeshLambertMaterial.prototype={toString:function(){return"THREE.MeshLambertMaterial (<br/>id: "+this.id+"<br/>color: "+this.color+"<br/>opacity: "+this.opacity+"<br/>map: "+this.map+"<br/>light_map: "+this.light_map+"<br/>env_map: "+this.env_map+"<br/>combine: "+this.combine+"<br/>reflectivity: "+this.reflectivity+"<br/>refraction_ratio: "+this.refraction_ratio+"<br/>shading: "+this.shading+"<br/>blending: "+this.blending+"<br/>depth_test: "+this.depth_test+"<br/>wireframe: "+this.wireframe+
+"<br/>wireframe_linewidth: "+this.wireframe_linewidth+"<br/>wireframe_linecap: "+this.wireframe_linecap+"<br/>wireframe_linejoin: "+this.wireframe_linejoin+"<br/>vertex_colors: "+this.vertex_colors+"<br/>skinning: "+this.skinning+"<br/> )"}};
+THREE.MeshPhongMaterial=function(a){this.id=THREE.MaterialCounter.value++;this.color=new THREE.Color(16777215);this.ambient=new THREE.Color(328965);this.specular=new THREE.Color(1118481);this.shininess=30;this.opacity=1;this.env_map=this.light_map=this.map=null;this.combine=THREE.MultiplyOperation;this.reflectivity=1;this.refraction_ratio=0.98;this.fog=!0;this.shading=THREE.SmoothShading;this.blending=THREE.NormalBlending;this.depth_test=!0;this.wireframe=!1;this.wireframe_linewidth=1;this.wireframe_linejoin=
+this.wireframe_linecap="round";this.vertex_colors=!1;this.skinning=!1;if(a){if(a.color!==undefined)this.color=new THREE.Color(a.color);if(a.ambient!==undefined)this.ambient=new THREE.Color(a.ambient);if(a.specular!==undefined)this.specular=new THREE.Color(a.specular);if(a.shininess!==undefined)this.shininess=a.shininess;if(a.opacity!==undefined)this.opacity=a.opacity;if(a.light_map!==undefined)this.light_map=a.light_map;if(a.map!==undefined)this.map=a.map;if(a.env_map!==undefined)this.env_map=a.env_map;
+if(a.combine!==undefined)this.combine=a.combine;if(a.reflectivity!==undefined)this.reflectivity=a.reflectivity;if(a.refraction_ratio!==undefined)this.refraction_ratio=a.refraction_ratio;if(a.fog!==undefined)this.fog=a.fog;if(a.shading!==undefined)this.shading=a.shading;if(a.blending!==undefined)this.blending=a.blending;if(a.depth_test!==undefined)this.depth_test=a.depth_test;if(a.wireframe!==undefined)this.wireframe=a.wireframe;if(a.wireframe_linewidth!==undefined)this.wireframe_linewidth=a.wireframe_linewidth;
+if(a.wireframe_linecap!==undefined)this.wireframe_linecap=a.wireframe_linecap;if(a.wireframe_linejoin!==undefined)this.wireframe_linejoin=a.wireframe_linejoin;if(a.vertex_colors!==undefined)this.vertex_colors=a.vertex_colors;if(a.skinning!==undefined)this.skinning=a.skinning}};
+THREE.MeshPhongMaterial.prototype={toString:function(){return"THREE.MeshPhongMaterial (<br/>id: "+this.id+"<br/>color: "+this.color+"<br/>ambient: "+this.ambient+"<br/>specular: "+this.specular+"<br/>shininess: "+this.shininess+"<br/>opacity: "+this.opacity+"<br/>map: "+this.map+"<br/>env_map: "+this.env_map+"<br/>combine: "+this.combine+"<br/>reflectivity: "+this.reflectivity+"<br/>refraction_ratio: "+this.refraction_ratio+"<br/>shading: "+this.shading+"<br/>blending: "+this.blending+"<br/>depth_test: "+
+this.depth_test+"<br/>wireframe: "+this.wireframe+"<br/>wireframe_linewidth: "+this.wireframe_linewidth+"<br/>wireframe_linecap: "+this.wireframe_linecap+"<br/>wireframe_linejoin: "+this.wireframe_linejoin+"<br/>vertex_colors: "+this.vertex_colors+"<br/>skinning: "+this.skinning+"<br/>)"}};
+THREE.MeshDepthMaterial=function(a){this.id=THREE.MaterialCounter.value++;this.opacity=1;this.shading=THREE.SmoothShading;this.blending=THREE.NormalBlending;this.depth_test=!0;this.wireframe=!1;this.wireframe_linewidth=1;if(a){if(a.opacity!==undefined)this.opacity=a.opacity;if(a.shading!==undefined)this.shading=a.shading;if(a.blending!==undefined)this.blending=a.blending;if(a.depth_test!==undefined)this.depth_test=a.depth_test;if(a.wireframe!==undefined)this.wireframe=a.wireframe;if(a.wireframe_linewidth!==
+undefined)this.wireframe_linewidth=a.wireframe_linewidth}};THREE.MeshDepthMaterial.prototype={toString:function(){return"THREE.MeshDepthMaterial (<br/>id: "+this.id+"<br/>opacity: "+this.opacity+"<br/>blending: "+this.blending+"<br/>depth_test: "+this.depth_test+"<br/>wireframe: "+this.wireframe+"<br/>wireframe_linewidth: "+this.wireframe_linewidth+"<br/>)"}};
+THREE.MeshNormalMaterial=function(a){this.id=THREE.MaterialCounter.value++;this.opacity=1;this.shading=THREE.FlatShading;this.blending=THREE.NormalBlending;this.depth_test=!0;this.wireframe=!1;this.wireframe_linewidth=1;if(a){if(a.opacity!==undefined)this.opacity=a.opacity;if(a.shading!==undefined)this.shading=a.shading;if(a.blending!==undefined)this.blending=a.blending;if(a.depth_test!==undefined)this.depth_test=a.depth_test;if(a.wireframe!==undefined)this.wireframe=a.wireframe;if(a.wireframe_linewidth!==
+undefined)this.wireframe_linewidth=a.wireframe_linewidth}};THREE.MeshNormalMaterial.prototype={toString:function(){return"THREE.MeshNormalMaterial (<br/>id: "+this.id+"<br/>opacity: "+this.opacity+"<br/>blending: "+this.blending+"<br/>depth_test: "+this.depth_test+"<br/>wireframe: "+this.wireframe+"<br/>wireframe_linewidth: "+this.wireframe_linewidth+"<br/>)"}};THREE.MeshFaceMaterial=function(){};THREE.MeshFaceMaterial.prototype={toString:function(){return"THREE.MeshFaceMaterial"}};
+THREE.ParticleBasicMaterial=function(a){this.id=THREE.MaterialCounter.value++;this.color=new THREE.Color(16777215);this.opacity=1;this.map=null;this.size=1;this.blending=THREE.NormalBlending;this.depth_test=!0;this.offset=new THREE.Vector2;this.vertex_colors=!1;if(a){a.color!==undefined&&this.color.setHex(a.color);if(a.opacity!==undefined)this.opacity=a.opacity;if(a.map!==undefined)this.map=a.map;if(a.size!==undefined)this.size=a.size;if(a.blending!==undefined)this.blending=a.blending;if(a.depth_test!==
+undefined)this.depth_test=a.depth_test;if(a.vertex_colors!==undefined)this.vertex_colors=a.vertex_colors}};THREE.ParticleBasicMaterial.prototype={toString:function(){return"THREE.ParticleBasicMaterial (<br/>id: "+this.id+"<br/>color: "+this.color+"<br/>opacity: "+this.opacity+"<br/>map: "+this.map+"<br/>size: "+this.size+"<br/>blending: "+this.blending+"<br/>depth_test: "+this.depth_test+"<br/>vertex_colors: "+this.vertex_colors+"<br/>)"}};
+THREE.ParticleCircleMaterial=function(a){this.id=THREE.MaterialCounter.value++;this.color=new THREE.Color(16777215);this.opacity=1;this.blending=THREE.NormalBlending;if(a){a.color!==undefined&&this.color.setHex(a.color);if(a.opacity!==undefined)this.opacity=a.opacity;if(a.blending!==undefined)this.blending=a.blending}};
+THREE.ParticleCircleMaterial.prototype={toString:function(){return"THREE.ParticleCircleMaterial (<br/>color: "+this.color+"<br/>opacity: "+this.opacity+"<br/>blending: "+this.blending+"<br/>)"}};
+THREE.Texture=function(a,b,c,d,f,e){this.image=a;this.mapping=b!==undefined?b:new THREE.UVMapping;this.wrap_s=c!==undefined?c:THREE.ClampToEdgeWrapping;this.wrap_t=d!==undefined?d:THREE.ClampToEdgeWrapping;this.mag_filter=f!==undefined?f:THREE.LinearFilter;this.min_filter=e!==undefined?e:THREE.LinearMipMapLinearFilter;this.needsUpdate=!1};
+THREE.Texture.prototype={clone:function(){return new THREE.Texture(this.image,this.mapping,this.wrap_s,this.wrap_t,this.mag_filter,this.min_filter)},toString:function(){return"THREE.Texture (<br/>image: "+this.image+"<br/>wrap_s: "+this.wrap_s+"<br/>wrap_t: "+this.wrap_t+"<br/>mag_filter: "+this.mag_filter+"<br/>min_filter: "+this.min_filter+"<br/>)"}};THREE.MultiplyOperation=0;THREE.MixOperation=1;THREE.RepeatWrapping=0;THREE.ClampToEdgeWrapping=1;THREE.MirroredRepeatWrapping=2;
+THREE.NearestFilter=3;THREE.NearestMipMapNearestFilter=4;THREE.NearestMipMapLinearFilter=5;THREE.LinearFilter=6;THREE.LinearMipMapNearestFilter=7;THREE.LinearMipMapLinearFilter=8;THREE.ByteType=9;THREE.UnsignedByteType=10;THREE.ShortType=11;THREE.UnsignedShortType=12;THREE.IntType=13;THREE.UnsignedIntType=14;THREE.FloatType=15;THREE.AlphaFormat=16;THREE.RGBFormat=17;THREE.RGBAFormat=18;THREE.LuminanceFormat=19;THREE.LuminanceAlphaFormat=20;
+THREE.Particle=function(a){THREE.Object3D.call(this);this.materials=a instanceof Array?a:[a];this.matrixAutoUpdate=!1};THREE.Particle.prototype=new THREE.Object3D;THREE.Particle.prototype.constructor=THREE.Particle;THREE.Line=function(a,b,c){THREE.Object3D.call(this);this.geometry=a;this.materials=b instanceof Array?b:[b];this.type=c!=undefined?c:THREE.LineStrip};THREE.LineStrip=0;THREE.LinePieces=1;THREE.Line.prototype=new THREE.Object3D;THREE.Line.prototype.constructor=THREE.Line;
+THREE.Mesh=function(a,b){THREE.Object3D.call(this);this.geometry=a;this.materials=b&&b.length?b:[b];this.flipSided=!1;this.doubleSided=!1;this.overdraw=!1;if(this.geometry){this.geometry.boundingSphere||this.geometry.computeBoundingSphere();this.boundRadius=a.boundingSphere.radius}};THREE.Mesh.prototype=new THREE.Object3D;THREE.Mesh.prototype.constructor=THREE.Mesh;THREE.Mesh.prototype.supr=THREE.Object3D.prototype;
+THREE.Scene=function(){THREE.Object3D.call(this);this.objects=[];this.lights=[];this.sounds=[];this.fog=null;this.matrixAutoUpdate=!1};THREE.Scene.prototype=new THREE.Object3D;THREE.Scene.prototype.constructor=THREE.Scene;THREE.Scene.prototype.supr=THREE.Object3D.prototype;THREE.Scene.prototype.addChild=function(a){this.supr.addChild.call(this,a);this.addChildRecurse(a)};
+THREE.Scene.prototype.addChildRecurse=function(a){if(a instanceof THREE.Light)this.lights.indexOf(a)===-1&&this.lights.push(a);else if(a instanceof THREE.Sound)this.sounds.indexOf(a)===-1&&this.sounds.push(a);else a instanceof THREE.Camera||a instanceof THREE.Bone||this.objects.indexOf(a)===-1&&this.objects.push(a);for(var b=0;b<a.children.length;b++)this.addChildRecurse(a.children[b])};THREE.Scene.prototype.removeChild=function(a){this.supr.removeChild.call(this,a);this.removeChildRecurse(a)};
+THREE.Scene.prototype.removeChildRecurse=function(a){if(a instanceof THREE.Light){var b=this.lights.indexOf(a);b!==-1&&this.lights.splice(b,1)}else if(a instanceof THREE.Sound){b=this.sounds.indexOf(a);b!==-1&&this.sounds.splice(b,1)}else if(!(a instanceof THREE.Camera)){b=this.objects.indexOf(a);b!==-1&&this.objects.splice(b,1)}for(b=0;b<a.children.length;b++)this.removeChildRecurse(a.children[b])};THREE.Scene.prototype.addObject=THREE.Scene.prototype.addChild;
+THREE.Scene.prototype.removeObject=THREE.Scene.prototype.removeChild;THREE.Scene.prototype.addLight=THREE.Scene.prototype.addChild;THREE.Scene.prototype.removeLight=THREE.Scene.prototype.removeChild;
+THREE.Projector=function(){function a(A,w){return w.z-A.z}function b(A,w){var K=0,u=1,L=A.z+A.w,E=w.z+w.w,y=-A.z+A.w,B=-w.z+w.w;if(L>=0&&E>=0&&y>=0&&B>=0)return!0;else if(L<0&&E<0||y<0&&B<0)return!1;else{if(L<0)K=Math.max(K,L/(L-E));else E<0&&(u=Math.min(u,L/(L-E)));if(y<0)K=Math.max(K,y/(y-B));else B<0&&(u=Math.min(u,y/(y-B)));if(u<K)return!1;else{A.lerpSelf(w,K);w.lerpSelf(A,1-u);return!0}}}var c,d,f=[],e,h,j,g=[],i,m,n=[],o,q,s=[],t=new THREE.Vector4,r=new THREE.Vector4,k=new THREE.Matrix4,D=new THREE.Matrix4,
+C=[new THREE.Vector4,new THREE.Vector4,new THREE.Vector4,new THREE.Vector4,new THREE.Vector4,new THREE.Vector4],I=new THREE.Vector4,F=new THREE.Vector4,N;this.projectObjects=function(A,w,K){w=[];var u,L,E;d=0;L=A.objects;A=0;for(u=L.length;A<u;A++){E=L[A];var y;if(!(y=!E.visible))if(y=E instanceof THREE.Mesh){a:{y=void 0;for(var B=E.matrixWorld,T=-E.geometry.boundingSphere.radius*Math.max(E.scale.x,Math.max(E.scale.y,E.scale.z)),x=0;x<6;x++){y=C[x].x*B.n14+C[x].y*B.n24+C[x].z*B.n34+C[x].w;if(y<=T){y=
+!1;break a}}y=!0}y=!y}if(!y){c=f[d]=f[d]||new THREE.RenderableObject;t.copy(E.position);k.multiplyVector3(t);c.object=E;c.z=t.z;w.push(c);d++}}K&&w.sort(a);return w};this.projectScene=function(A,w,K){var u=[],L=w.near,E=w.far,y,B,T,x,P,Y,J,ja,ka,la,ma,$,O,H,U,Q;j=m=q=0;w.matrixAutoUpdate&&w.update();k.multiply(w.projectionMatrix,w.matrixWorld);C[0].set(k.n41-k.n11,k.n42-k.n12,k.n43-k.n13,k.n44-k.n14);C[1].set(k.n41+k.n11,k.n42+k.n12,k.n43+k.n13,k.n44+k.n14);C[2].set(k.n41+k.n21,k.n42+k.n22,k.n43+
+k.n23,k.n44+k.n24);C[3].set(k.n41-k.n21,k.n42-k.n22,k.n43-k.n23,k.n44-k.n24);C[4].set(k.n41-k.n31,k.n42-k.n32,k.n43-k.n33,k.n44-k.n34);C[5].set(k.n41+k.n31,k.n42+k.n32,k.n43+k.n33,k.n44+k.n34);for(y=0;y<6;y++){Y=C[y];Y.divideScalar(Math.sqrt(Y.x*Y.x+Y.y*Y.y+Y.z*Y.z))}A.update(undefined,!1,w);Y=this.projectObjects(A,w,!0);A=0;for(y=Y.length;A<y;A++){J=Y[A].object;if(J.visible){J.matrixAutoUpdate&&J.updateMatrix();ja=J.matrixWorld;ma=J.matrixRotation;ka=J.materials;la=J.overdraw;if(J instanceof THREE.Mesh){$=
+J.geometry;O=$.vertices;B=0;for(T=O.length;B<T;B++){H=O[B];H.positionWorld.copy(H.position);ja.multiplyVector3(H.positionWorld);x=H.positionScreen;x.copy(H.positionWorld);k.multiplyVector4(x);x.x/=x.w;x.y/=x.w;H.__visible=x.z>L&&x.z<E}$=$.faces;B=0;for(T=$.length;B<T;B++){H=$[B];if(H instanceof THREE.Face3){x=O[H.a];P=O[H.b];U=O[H.c];if(x.__visible&&P.__visible&&U.__visible&&(J.doubleSided||J.flipSided!=(U.positionScreen.x-x.positionScreen.x)*(P.positionScreen.y-x.positionScreen.y)-(U.positionScreen.y-
+x.positionScreen.y)*(P.positionScreen.x-x.positionScreen.x)<0)){e=g[j]=g[j]||new THREE.RenderableFace3;e.v1.positionWorld.copy(x.positionWorld);e.v2.positionWorld.copy(P.positionWorld);e.v3.positionWorld.copy(U.positionWorld);e.v1.positionScreen.copy(x.positionScreen);e.v2.positionScreen.copy(P.positionScreen);e.v3.positionScreen.copy(U.positionScreen);e.normalWorld.copy(H.normal);ma.multiplyVector3(e.normalWorld);e.centroidWorld.copy(H.centroid);ja.multiplyVector3(e.centroidWorld);e.centroidScreen.copy(e.centroidWorld);
+k.multiplyVector3(e.centroidScreen);U=H.vertexNormals;N=e.vertexNormalsWorld;x=0;for(P=U.length;x<P;x++){Q=N[x]=N[x]||new THREE.Vector3;Q.copy(U[x]);ma.multiplyVector3(Q)}e.z=e.centroidScreen.z;e.meshMaterials=ka;e.faceMaterials=H.materials;e.overdraw=la;if(J.geometry.uvs[B]){e.uvs[0]=J.geometry.uvs[B][0];e.uvs[1]=J.geometry.uvs[B][1];e.uvs[2]=J.geometry.uvs[B][2]}u.push(e);j++}}else if(H instanceof THREE.Face4){x=O[H.a];P=O[H.b];U=O[H.c];Q=O[H.d];if(x.__visible&&P.__visible&&U.__visible&&Q.__visible&&
+(J.doubleSided||J.flipSided!=((Q.positionScreen.x-x.positionScreen.x)*(P.positionScreen.y-x.positionScreen.y)-(Q.positionScreen.y-x.positionScreen.y)*(P.positionScreen.x-x.positionScreen.x)<0||(P.positionScreen.x-U.positionScreen.x)*(Q.positionScreen.y-U.positionScreen.y)-(P.positionScreen.y-U.positionScreen.y)*(Q.positionScreen.x-U.positionScreen.x)<0))){e=g[j]=g[j]||new THREE.RenderableFace3;e.v1.positionWorld.copy(x.positionWorld);e.v2.positionWorld.copy(P.positionWorld);e.v3.positionWorld.copy(Q.positionWorld);
+e.v1.positionScreen.copy(x.positionScreen);e.v2.positionScreen.copy(P.positionScreen);e.v3.positionScreen.copy(Q.positionScreen);e.normalWorld.copy(H.normal);ma.multiplyVector3(e.normalWorld);e.centroidWorld.copy(H.centroid);ja.multiplyVector3(e.centroidWorld);e.centroidScreen.copy(e.centroidWorld);k.multiplyVector3(e.centroidScreen);e.z=e.centroidScreen.z;e.meshMaterials=ka;e.faceMaterials=H.materials;e.overdraw=la;if(J.geometry.uvs[B]){e.uvs[0]=J.geometry.uvs[B][0];e.uvs[1]=J.geometry.uvs[B][1];
+e.uvs[2]=J.geometry.uvs[B][3]}u.push(e);j++;h=g[j]=g[j]||new THREE.RenderableFace3;h.v1.positionWorld.copy(P.positionWorld);h.v2.positionWorld.copy(U.positionWorld);h.v3.positionWorld.copy(Q.positionWorld);h.v1.positionScreen.copy(P.positionScreen);h.v2.positionScreen.copy(U.positionScreen);h.v3.positionScreen.copy(Q.positionScreen);h.normalWorld.copy(e.normalWorld);h.centroidWorld.copy(e.centroidWorld);h.centroidScreen.copy(e.centroidScreen);h.z=h.centroidScreen.z;h.meshMaterials=ka;h.faceMaterials=
+H.materials;h.overdraw=la;if(J.geometry.uvs[B]){h.uvs[0]=J.geometry.uvs[B][1];h.uvs[1]=J.geometry.uvs[B][2];h.uvs[2]=J.geometry.uvs[B][3]}u.push(h);j++}}}}else if(J instanceof THREE.Line){D.multiply(k,ja);O=J.geometry.vertices;H=O[0];H.positionScreen.copy(H.position);D.multiplyVector4(H.positionScreen);B=1;for(T=O.length;B<T;B++){x=O[B];x.positionScreen.copy(x.position);D.multiplyVector4(x.positionScreen);P=O[B-1];I.copy(x.positionScreen);F.copy(P.positionScreen);if(b(I,F)){I.multiplyScalar(1/I.w);
+F.multiplyScalar(1/F.w);i=n[m]=n[m]||new THREE.RenderableLine;i.v1.positionScreen.copy(I);i.v2.positionScreen.copy(F);i.z=Math.max(I.z,F.z);i.materials=J.materials;u.push(i);m++}}}else if(J instanceof THREE.Particle){r.set(J.position.x,J.position.y,J.position.z,1);k.multiplyVector4(r);r.z/=r.w;if(r.z>0&&r.z<1){o=s[q]=s[q]||new THREE.RenderableParticle;o.x=r.x/r.w;o.y=r.y/r.w;o.z=r.z;o.rotation=J.rotation.z;o.scale.x=J.scale.x*Math.abs(o.x-(r.x+w.projectionMatrix.n11)/(r.w+w.projectionMatrix.n14));
+o.scale.y=J.scale.y*Math.abs(o.y-(r.y+w.projectionMatrix.n22)/(r.w+w.projectionMatrix.n24));o.materials=J.materials;u.push(o);q++}}}}K&&u.sort(a);return u};this.unprojectVector=function(A,w){var K=THREE.Matrix4.makeInvert(w.matrixWorld);K.multiplySelf(THREE.Matrix4.makeInvert(w.projectionMatrix));K.multiplyVector3(A);return A}};
+THREE.CanvasRenderer=function(){function a(V){if(o!=V)i.globalAlpha=o=V}function b(V){if(q!=V){switch(V){case THREE.NormalBlending:i.globalCompositeOperation="source-over";break;case THREE.AdditiveBlending:i.globalCompositeOperation="lighter";break;case THREE.SubtractiveBlending:i.globalCompositeOperation="darker"}q=V}}var c=null,d=new THREE.Projector,f=document.createElement("canvas"),e,h,j,g,i=f.getContext("2d"),m=new THREE.Color(0),n=0,o=1,q=0,s=null,t=null,r=1,k,D,C,I,F,N,A,w,K,u=new THREE.Color,
+L=new THREE.Color,E=new THREE.Color,y=new THREE.Color,B=new THREE.Color,T,x,P,Y,J,ja,ka,la,ma,$=new THREE.Rectangle,O=new THREE.Rectangle,H=new THREE.Rectangle,U=!1,Q=new THREE.Color,aa=new THREE.Color,na=new THREE.Color,oa=new THREE.Color,La=Math.PI*2,R=new THREE.Vector3,ra,sa,Ca,ba,ta,xa,pa=16;ra=document.createElement("canvas");ra.width=ra.height=2;sa=ra.getContext("2d");sa.fillStyle="rgba(0,0,0,1)";sa.fillRect(0,0,2,2);Ca=sa.getImageData(0,0,2,2);ba=Ca.data;ta=document.createElement("canvas");
+ta.width=ta.height=pa;xa=ta.getContext("2d");xa.translate(-pa/2,-pa/2);xa.scale(pa,pa);pa--;this.domElement=f;this.autoClear=!0;this.sortObjects=!0;this.sortElements=!0;this.setSize=function(V,da){e=V;h=da;j=e/2;g=h/2;f.width=e;f.height=h;$.set(-j,-g,j,g);o=1;q=0;t=s=null;r=1};this.setClearColor=function(V,da){m=V;n=da;O.set(-j,-g,j,g);i.setTransform(1,0,0,-1,j,g);this.clear()};this.setClearColorHex=function(V,da){m.setHex(V);n=da;O.set(-j,-g,j,g);i.setTransform(1,0,0,-1,j,g);this.clear()};this.clear=
+function(){i.setTransform(1,0,0,-1,j,g);if(!O.isEmpty()){O.inflate(1);O.minSelf($);if(m.hex==0&&n==0)i.clearRect(O.getX(),O.getY(),O.getWidth(),O.getHeight());else{b(THREE.NormalBlending);a(1);i.fillStyle="rgba("+Math.floor(m.r*255)+","+Math.floor(m.g*255)+","+Math.floor(m.b*255)+","+n+")";i.fillRect(O.getX(),O.getY(),O.getWidth(),O.getHeight())}O.empty()}};this.render=function(V,da){function Ma(l){var G,z,p,v=l.lights;aa.setRGB(0,0,0);na.setRGB(0,0,0);oa.setRGB(0,0,0);l=0;for(G=v.length;l<G;l++){z=
+v[l];p=z.color;if(z instanceof THREE.AmbientLight){aa.r+=p.r;aa.g+=p.g;aa.b+=p.b}else if(z instanceof THREE.DirectionalLight){na.r+=p.r;na.g+=p.g;na.b+=p.b}else if(z instanceof THREE.PointLight){oa.r+=p.r;oa.g+=p.g;oa.b+=p.b}}}function ya(l,G,z,p){var v,M,W,X,Z=l.lights;l=0;for(v=Z.length;l<v;l++){M=Z[l];W=M.color;X=M.intensity;if(M instanceof THREE.DirectionalLight){M=z.dot(M.position)*X;if(M>0){p.r+=W.r*M;p.g+=W.g*M;p.b+=W.b*M}}else if(M instanceof THREE.PointLight){R.sub(M.position,G);R.normalize();
+M=z.dot(R)*X;if(M>0){p.r+=W.r*M;p.g+=W.g*M;p.b+=W.b*M}}}}function Na(l,G,z){if(z.opacity!=0){a(z.opacity);b(z.blending);var p,v,M,W,X,Z;if(z instanceof THREE.ParticleBasicMaterial){if(z.map){W=z.map.image;X=W.width>>1;Z=W.height>>1;v=G.scale.x*j;M=G.scale.y*g;z=v*X;p=M*Z;H.set(l.x-z,l.y-p,l.x+z,l.y+p);if($.instersects(H)){i.save();i.translate(l.x,l.y);i.rotate(-G.rotation);i.scale(v,-M);i.translate(-X,-Z);i.drawImage(W,0,0);i.restore()}}}else if(z instanceof THREE.ParticleCircleMaterial){if(U){Q.r=
+aa.r+na.r+oa.r;Q.g=aa.g+na.g+oa.g;Q.b=aa.b+na.b+oa.b;u.r=z.color.r*Q.r;u.g=z.color.g*Q.g;u.b=z.color.b*Q.b;u.updateStyleString()}else u.__styleString=z.color.__styleString;z=G.scale.x*j;p=G.scale.y*g;H.set(l.x-z,l.y-p,l.x+z,l.y+p);if($.instersects(H)){v=u.__styleString;if(t!=v)i.fillStyle=t=v;i.save();i.translate(l.x,l.y);i.rotate(-G.rotation);i.scale(z,p);i.beginPath();i.arc(0,0,1,0,La,!0);i.closePath();i.fill();i.restore()}}}}function Oa(l,G,z,p){if(p.opacity!=0){a(p.opacity);b(p.blending);i.beginPath();
+i.moveTo(l.positionScreen.x,l.positionScreen.y);i.lineTo(G.positionScreen.x,G.positionScreen.y);i.closePath();if(p instanceof THREE.LineBasicMaterial){u.__styleString=p.color.__styleString;l=p.linewidth;if(r!=l)i.lineWidth=r=l;l=u.__styleString;if(s!=l)i.strokeStyle=s=l;i.stroke();H.inflate(p.linewidth*2)}}}function Ha(l,G,z,p,v,M){if(v.opacity!=0){a(v.opacity);b(v.blending);I=l.positionScreen.x;F=l.positionScreen.y;N=G.positionScreen.x;A=G.positionScreen.y;w=z.positionScreen.x;K=z.positionScreen.y;
+i.beginPath();i.moveTo(I,F);i.lineTo(N,A);i.lineTo(w,K);i.lineTo(I,F);i.closePath();if(v instanceof THREE.MeshBasicMaterial)if(v.map)v.map.mapping instanceof THREE.UVMapping&&ua(I,F,N,A,w,K,v.map.image,p.uvs[0].u,p.uvs[0].v,p.uvs[1].u,p.uvs[1].v,p.uvs[2].u,p.uvs[2].v);else if(v.env_map){if(v.env_map.mapping instanceof THREE.SphericalReflectionMapping){l=da.matrixWorld;R.copy(p.vertexNormalsWorld[0]);Y=(R.x*l.n11+R.y*l.n12+R.z*l.n13)*0.5+0.5;J=-(R.x*l.n21+R.y*l.n22+R.z*l.n23)*0.5+0.5;R.copy(p.vertexNormalsWorld[1]);
+ja=(R.x*l.n11+R.y*l.n12+R.z*l.n13)*0.5+0.5;ka=-(R.x*l.n21+R.y*l.n22+R.z*l.n23)*0.5+0.5;R.copy(p.vertexNormalsWorld[2]);la=(R.x*l.n11+R.y*l.n12+R.z*l.n13)*0.5+0.5;ma=-(R.x*l.n21+R.y*l.n22+R.z*l.n23)*0.5+0.5;ua(I,F,N,A,w,K,v.env_map.image,Y,J,ja,ka,la,ma)}}else v.wireframe?za(v.color.__styleString,v.wireframe_linewidth):Aa(v.color.__styleString);else if(v instanceof THREE.MeshLambertMaterial){if(v.map&&!v.wireframe){v.map.mapping instanceof THREE.UVMapping&&ua(I,F,N,A,w,K,v.map.image,p.uvs[0].u,p.uvs[0].v,
+p.uvs[1].u,p.uvs[1].v,p.uvs[2].u,p.uvs[2].v);b(THREE.SubtractiveBlending)}if(U)if(!v.wireframe&&v.shading==THREE.SmoothShading&&p.vertexNormalsWorld.length==3){L.r=E.r=y.r=aa.r;L.g=E.g=y.g=aa.g;L.b=E.b=y.b=aa.b;ya(M,p.v1.positionWorld,p.vertexNormalsWorld[0],L);ya(M,p.v2.positionWorld,p.vertexNormalsWorld[1],E);ya(M,p.v3.positionWorld,p.vertexNormalsWorld[2],y);B.r=(E.r+y.r)*0.5;B.g=(E.g+y.g)*0.5;B.b=(E.b+y.b)*0.5;P=Ia(L,E,y,B);ua(I,F,N,A,w,K,P,0,0,1,0,0,1)}else{Q.r=aa.r;Q.g=aa.g;Q.b=aa.b;ya(M,p.centroidWorld,
+p.normalWorld,Q);u.r=v.color.r*Q.r;u.g=v.color.g*Q.g;u.b=v.color.b*Q.b;u.updateStyleString();v.wireframe?za(u.__styleString,v.wireframe_linewidth):Aa(u.__styleString)}else v.wireframe?za(v.color.__styleString,v.wireframe_linewidth):Aa(v.color.__styleString)}else if(v instanceof THREE.MeshDepthMaterial){T=da.near;x=da.far;L.r=L.g=L.b=1-Da(l.positionScreen.z,T,x);E.r=E.g=E.b=1-Da(G.positionScreen.z,T,x);y.r=y.g=y.b=1-Da(z.positionScreen.z,T,x);B.r=(E.r+y.r)*0.5;B.g=(E.g+y.g)*0.5;B.b=(E.b+y.b)*0.5;P=
+Ia(L,E,y,B);ua(I,F,N,A,w,K,P,0,0,1,0,0,1)}else if(v instanceof THREE.MeshNormalMaterial){u.r=Ea(p.normalWorld.x);u.g=Ea(p.normalWorld.y);u.b=Ea(p.normalWorld.z);u.updateStyleString();v.wireframe?za(u.__styleString,v.wireframe_linewidth):Aa(u.__styleString)}}}function za(l,G){if(s!=l)i.strokeStyle=s=l;if(r!=G)i.lineWidth=r=G;i.stroke();H.inflate(G*2)}function Aa(l){if(t!=l)i.fillStyle=t=l;i.fill()}function ua(l,G,z,p,v,M,W,X,Z,ga,ca,ha,va){var ea,ia;ea=W.width-1;ia=W.height-1;X*=ea;Z*=ia;ga*=ea;ca*=
+ia;ha*=ea;va*=ia;z-=l;p-=G;v-=l;M-=G;ga-=X;ca-=Z;ha-=X;va-=Z;ea=ga*va-ha*ca;if(ea!=0){ia=1/ea;ea=(va*z-ca*v)*ia;ca=(va*p-ca*M)*ia;z=(ga*v-ha*z)*ia;p=(ga*M-ha*p)*ia;l=l-ea*X-z*Z;G=G-ca*X-p*Z;i.save();i.transform(ea,ca,z,p,l,G);i.clip();i.drawImage(W,0,0);i.restore()}}function Ia(l,G,z,p){var v=~~(l.r*255),M=~~(l.g*255);l=~~(l.b*255);var W=~~(G.r*255),X=~~(G.g*255);G=~~(G.b*255);var Z=~~(z.r*255),ga=~~(z.g*255);z=~~(z.b*255);var ca=~~(p.r*255),ha=~~(p.g*255);p=~~(p.b*255);ba[0]=v<0?0:v>255?255:v;ba[1]=
+M<0?0:M>255?255:M;ba[2]=l<0?0:l>255?255:l;ba[4]=W<0?0:W>255?255:W;ba[5]=X<0?0:X>255?255:X;ba[6]=G<0?0:G>255?255:G;ba[8]=Z<0?0:Z>255?255:Z;ba[9]=ga<0?0:ga>255?255:ga;ba[10]=z<0?0:z>255?255:z;ba[12]=ca<0?0:ca>255?255:ca;ba[13]=ha<0?0:ha>255?255:ha;ba[14]=p<0?0:p>255?255:p;sa.putImageData(Ca,0,0);xa.drawImage(ra,0,0);return ta}function Da(l,G,z){l=(l-G)/(z-G);return l*l*(3-2*l)}function Ea(l){l=(l+1)*0.5;return l<0?0:l>1?1:l}function Fa(l,G){var z=G.x-l.x,p=G.y-l.y,v=1/Math.sqrt(z*z+p*p);z*=v;p*=v;G.x+=
+z;G.y+=p;l.x-=z;l.y-=p}var Ba,Ja,S,fa,qa,Ga,Ka,wa;this.autoClear?this.clear():i.setTransform(1,0,0,-1,j,g);c=d.projectScene(V,da,this.sortElements);(U=V.lights.length>0)&&Ma(V);Ba=0;for(Ja=c.length;Ba<Ja;Ba++){S=c[Ba];H.empty();if(S instanceof THREE.RenderableParticle){k=S;k.x*=j;k.y*=g;fa=0;for(qa=S.materials.length;fa<qa;fa++)Na(k,S,S.materials[fa],V)}else if(S instanceof THREE.RenderableLine){k=S.v1;D=S.v2;k.positionScreen.x*=j;k.positionScreen.y*=g;D.positionScreen.x*=j;D.positionScreen.y*=g;
+H.addPoint(k.positionScreen.x,k.positionScreen.y);H.addPoint(D.positionScreen.x,D.positionScreen.y);if($.instersects(H)){fa=0;for(qa=S.materials.length;fa<qa;)Oa(k,D,S,S.materials[fa++],V)}}else if(S instanceof THREE.RenderableFace3){k=S.v1;D=S.v2;C=S.v3;k.positionScreen.x*=j;k.positionScreen.y*=g;D.positionScreen.x*=j;D.positionScreen.y*=g;C.positionScreen.x*=j;C.positionScreen.y*=g;if(S.overdraw){Fa(k.positionScreen,D.positionScreen);Fa(D.positionScreen,C.positionScreen);Fa(C.positionScreen,k.positionScreen)}H.add3Points(k.positionScreen.x,
+k.positionScreen.y,D.positionScreen.x,D.positionScreen.y,C.positionScreen.x,C.positionScreen.y);if($.instersects(H)){fa=0;for(qa=S.meshMaterials.length;fa<qa;){wa=S.meshMaterials[fa++];if(wa instanceof THREE.MeshFaceMaterial){Ga=0;for(Ka=S.faceMaterials.length;Ga<Ka;)(wa=S.faceMaterials[Ga++])&&Ha(k,D,C,S,wa,V)}else Ha(k,D,C,S,wa,V)}}}O.addRectangle(H)}i.setTransform(1,0,0,1,0,0)}};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=!1;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};

+ 78 - 0
build/custom/ThreeDOM.js

@@ -0,0 +1,78 @@
+// ThreeDOM.js r33 - http://github.com/mrdoob/three.js
+var THREE=THREE||{};THREE.Color=function(a){this.setHex(a)};
+THREE.Color.prototype={autoUpdate:!0,setRGB:function(a,b,c){this.r=a;this.g=b;this.b=c;if(this.autoUpdate){this.updateHex();this.updateStyleString()}},setHSV:function(a,b,c){var e,d,f,g,i,h;if(c==0)e=d=f=0;else{g=Math.floor(a*6);i=a*6-g;a=c*(1-b);h=c*(1-b*i);b=c*(1-b*(1-i));switch(g){case 1:e=h;d=c;f=a;break;case 2:e=a;d=c;f=b;break;case 3:e=a;d=h;f=c;break;case 4:e=b;d=a;f=c;break;case 5:e=c;d=a;f=h;break;case 6:case 0:e=c;d=b;f=a}}this.r=e;this.g=d;this.b=f;if(this.autoUpdate){this.updateHex();
+this.updateStyleString()}},setHex:function(a){this.hex=~~a&16777215;if(this.autoUpdate){this.updateRGBA();this.updateStyleString()}},updateHex:function(){this.hex=~~(this.r*255)<<16^~~(this.g*255)<<8^~~(this.b*255)},updateRGBA:function(){this.r=(this.hex>>16&255)/255;this.g=(this.hex>>8&255)/255;this.b=(this.hex&255)/255},updateStyleString:function(){this.__styleString="rgb("+~~(this.r*255)+","+~~(this.g*255)+","+~~(this.b*255)+")"},clone:function(){return new THREE.Color(this.hex)},toString:function(){return"THREE.Color ( r: "+
+this.r+", g: "+this.g+", b: "+this.b+", hex: "+this.hex+" )"}};THREE.Vector2=function(a,b){this.set(a||0,b||0)};
+THREE.Vector2.prototype={set:function(a,b){this.x=a;this.y=b;return this},copy:function(a){this.set(a.x,a.y);return this},addSelf:function(a){this.set(this.x+a.x,this.y+a.y);return this},add:function(a,b){this.set(a.x+b.x,a.y+b.y);return this},subSelf:function(a){this.set(this.x-a.x,this.y-a.y);return this},sub:function(a,b){this.set(a.x-b.x,a.y-b.y);return this},multiplyScalar:function(a){this.set(this.x*a,this.y*a);return this},negate:function(){this.set(-this.x,-this.y);return this},unit:function(){this.multiplyScalar(1/
+this.length());return this},length:function(){return Math.sqrt(this.lengthSq())},lengthSq:function(){return this.x*this.x+this.y*this.y},clone:function(){return new THREE.Vector2(this.x,this.y)},toString:function(){return"THREE.Vector2 ("+this.x+", "+this.y+")"}};THREE.Vector3=function(a,b,c){this.set(a||0,b||0,c||0)};
+THREE.Vector3.prototype={set:function(a,b,c){this.x=a;this.y=b;this.z=c;return this},copy:function(a){this.set(a.x,a.y,a.z);return this},add:function(a,b){this.set(a.x+b.x,a.y+b.y,a.z+b.z);return this},addSelf:function(a){this.set(this.x+a.x,this.y+a.y,this.z+a.z);return this},addScalar:function(a){this.set(this.x+a,this.y+a,this.z+a);return this},sub:function(a,b){this.set(a.x-b.x,a.y-b.y,a.z-b.z);return this},subSelf:function(a){this.set(this.x-a.x,this.y-a.y,this.z-a.z);return this},cross:function(a,
+b){this.set(a.y*b.z-a.z*b.y,a.z*b.x-a.x*b.z,a.x*b.y-a.y*b.x);return this},crossSelf:function(a){var b=this.x,c=this.y,e=this.z;this.set(c*a.z-e*a.y,e*a.x-b*a.z,b*a.y-c*a.x);return this},multiply:function(a,b){this.set(a.x*b.x,a.y*b.y,a.z*b.z);return this},multiplySelf:function(a){this.set(this.x*a.x,this.y*a.y,this.z*a.z);return this},multiplyScalar:function(a){this.set(this.x*a,this.y*a,this.z*a);return this},divideSelf:function(a){this.set(this.x/a.x,this.y/a.y,this.z/a.z);return this},divideScalar:function(a){this.set(this.x/
+a,this.y/a,this.z/a);return this},negate:function(){this.set(-this.x,-this.y,-this.z);return this},dot:function(a){return this.x*a.x+this.y*a.y+this.z*a.z},distanceTo:function(a){return Math.sqrt(this.distanceToSquared(a))},distanceToSquared:function(a){var b=this.x-a.x,c=this.y-a.y;a=this.z-a.z;return b*b+c*c+a*a},length:function(){return Math.sqrt(this.lengthSq())},lengthSq:function(){return this.x*this.x+this.y*this.y+this.z*this.z},lengthManhattan:function(){return this.x+this.y+this.z},normalize:function(){var a=
+this.length();a>0?this.multiplyScalar(1/a):this.set(0,0,0);return this},setLength:function(a){return this.normalize().multiplyScalar(a)},isZero:function(){return Math.abs(this.x)<1.0E-4&&Math.abs(this.y)<1.0E-4&&Math.abs(this.z)<1.0E-4},clone:function(){return new THREE.Vector3(this.x,this.y,this.z)},toString:function(){return"THREE.Vector3 ( "+this.x+", "+this.y+", "+this.z+" )"}};THREE.Vector4=function(a,b,c,e){this.set(a||0,b||0,c||0,e||1)};
+THREE.Vector4.prototype={set:function(a,b,c,e){this.x=a;this.y=b;this.z=c;this.w=e;return this},copy:function(a){this.set(a.x,a.y,a.z,a.w||1);return this},add:function(a,b){this.set(a.x+b.x,a.y+b.y,a.z+b.z,a.w+b.w);return this},addSelf:function(a){this.set(this.x+a.x,this.y+a.y,this.z+a.z,this.w+a.w);return this},sub:function(a,b){this.set(a.x-b.x,a.y-b.y,a.z-b.z,a.w-b.w);return this},subSelf:function(a){this.set(this.x-a.x,this.y-a.y,this.z-a.z,this.w-a.w);return this},multiplyScalar:function(a){this.set(this.x*
+a,this.y*a,this.z*a,this.w*a);return this},divideScalar:function(a){this.set(this.x/a,this.y/a,this.z/a,this.w/a);return this},lerpSelf:function(a,b){this.set(this.x+(a.x-this.x)*b,this.y+(a.y-this.y)*b,this.z+(a.z-this.z)*b,this.w+(a.w-this.w)*b)},clone:function(){return new THREE.Vector4(this.x,this.y,this.z,this.w)},toString:function(){return"THREE.Vector4 ("+this.x+", "+this.y+", "+this.z+", "+this.w+")"}};THREE.Ray=function(a,b){this.origin=a||new THREE.Vector3;this.direction=b||new THREE.Vector3};
+THREE.Ray.prototype={intersectScene:function(a){var b,c,e=a.objects,d=[];a=0;for(b=e.length;a<b;a++){c=e[a];c instanceof THREE.Mesh&&(d=d.concat(this.intersectObject(c)))}d.sort(function(f,g){return f.distance-g.distance});return d},intersectObject:function(a){function b(r,k,B,x){x=x.clone().subSelf(k);B=B.clone().subSelf(k);var F=r.clone().subSelf(k);r=x.dot(x);k=x.dot(B);x=x.dot(F);var G=B.dot(B);B=B.dot(F);F=1/(r*G-k*k);G=(G*x-k*B)*F;r=(r*B-k*x)*F;return G>0&&r>0&&G+r<1}var c,e,d,f,g,i,h,j,m,n,
+l,o=a.geometry,p=o.vertices,q=[];c=0;for(e=o.faces.length;c<e;c++){d=o.faces[c];n=this.origin.clone();l=this.direction.clone();h=a.matrixWorld;f=h.multiplyVector3(p[d.a].position.clone());g=h.multiplyVector3(p[d.b].position.clone());i=h.multiplyVector3(p[d.c].position.clone());h=d instanceof THREE.Face4?h.multiplyVector3(p[d.d].position.clone()):null;j=a.matrixRotation.multiplyVector3(d.normal.clone());m=l.dot(j);if(m<0){j=j.dot((new THREE.Vector3).sub(f,n))/m;n=n.addSelf(l.multiplyScalar(j));if(d instanceof
+THREE.Face3){if(b(n,f,g,i)){d={distance:this.origin.distanceTo(n),point:n,face:d,object:a};q.push(d)}}else if(d instanceof THREE.Face4&&(b(n,f,g,h)||b(n,g,i,h))){d={distance:this.origin.distanceTo(n),point:n,face:d,object:a};q.push(d)}}}return q}};
+THREE.Rectangle=function(){function a(){f=e-b;g=d-c}var b,c,e,d,f,g,i=!0;this.getX=function(){return b};this.getY=function(){return c};this.getWidth=function(){return f};this.getHeight=function(){return g};this.getLeft=function(){return b};this.getTop=function(){return c};this.getRight=function(){return e};this.getBottom=function(){return d};this.set=function(h,j,m,n){i=!1;b=h;c=j;e=m;d=n;a()};this.addPoint=function(h,j){if(i){i=!1;b=h;c=j;e=h;d=j}else{b=b<h?b:h;c=c<j?c:j;e=e>h?e:h;d=d>j?d:j}a()};
+this.add3Points=function(h,j,m,n,l,o){if(i){i=!1;b=h<m?h<l?h:l:m<l?m:l;c=j<n?j<o?j:o:n<o?n:o;e=h>m?h>l?h:l:m>l?m:l;d=j>n?j>o?j:o:n>o?n:o}else{b=h<m?h<l?h<b?h:b:l<b?l:b:m<l?m<b?m:b:l<b?l:b;c=j<n?j<o?j<c?j:c:o<c?o:c:n<o?n<c?n:c:o<c?o:c;e=h>m?h>l?h>e?h:e:l>e?l:e:m>l?m>e?m:e:l>e?l:e;d=j>n?j>o?j>d?j:d:o>d?o:d:n>o?n>d?n:d:o>d?o:d}a()};this.addRectangle=function(h){if(i){i=!1;b=h.getLeft();c=h.getTop();e=h.getRight();d=h.getBottom()}else{b=b<h.getLeft()?b:h.getLeft();c=c<h.getTop()?c:h.getTop();e=e>h.getRight()?
+e:h.getRight();d=d>h.getBottom()?d:h.getBottom()}a()};this.inflate=function(h){b-=h;c-=h;e+=h;d+=h;a()};this.minSelf=function(h){b=b>h.getLeft()?b:h.getLeft();c=c>h.getTop()?c:h.getTop();e=e<h.getRight()?e:h.getRight();d=d<h.getBottom()?d:h.getBottom();a()};this.instersects=function(h){return Math.min(e,h.getRight())-Math.max(b,h.getLeft())>=0&&Math.min(d,h.getBottom())-Math.max(c,h.getTop())>=0};this.empty=function(){i=!0;d=e=c=b=0;a()};this.isEmpty=function(){return i};this.toString=function(){return"THREE.Rectangle ( left: "+
+b+", right: "+e+", top: "+c+", bottom: "+d+", width: "+f+", height: "+g+" )"}};THREE.Matrix3=function(){this.m=[]};THREE.Matrix3.prototype={transpose:function(){var a,b=this.m;a=b[1];b[1]=b[3];b[3]=a;a=b[2];b[2]=b[6];b[6]=a;a=b[5];b[5]=b[7];b[7]=a;return this},transposeIntoArray:function(a){var b=this.m;a[0]=b[0];a[1]=b[3];a[2]=b[6];a[3]=b[1];a[4]=b[4];a[5]=b[7];a[6]=b[2];a[7]=b[5];a[8]=b[8];return this}};
+THREE.Matrix4=function(a,b,c,e,d,f,g,i,h,j,m,n,l,o,p,q){this.set(a||1,b||0,c||0,e||0,d||0,f||1,g||0,i||0,h||0,j||0,m||1,n||0,l||0,o||0,p||0,q||1);this.flat=Array(16);this.m33=new THREE.Matrix3};
+THREE.Matrix4.prototype={set:function(a,b,c,e,d,f,g,i,h,j,m,n,l,o,p,q){this.n11=a;this.n12=b;this.n13=c;this.n14=e;this.n21=d;this.n22=f;this.n23=g;this.n24=i;this.n31=h;this.n32=j;this.n33=m;this.n34=n;this.n41=l;this.n42=o;this.n43=p;this.n44=q;return this},identity:function(){this.set(1,0,0,0,0,1,0,0,0,0,1,0,0,0,0,1);return this},copy:function(a){this.set(a.n11,a.n12,a.n13,a.n14,a.n21,a.n22,a.n23,a.n24,a.n31,a.n32,a.n33,a.n34,a.n41,a.n42,a.n43,a.n44);return this},lookAt:function(a,b,c){var e=THREE.Matrix4.__tmpVec1,
+d=THREE.Matrix4.__tmpVec2,f=THREE.Matrix4.__tmpVec3;f.sub(a,b).normalize();e.cross(c,f).normalize();d.cross(f,e).normalize();this.n11=e.x;this.n12=e.y;this.n13=e.z;this.n14=-e.dot(a);this.n21=d.x;this.n22=d.y;this.n23=d.z;this.n24=-d.dot(a);this.n31=f.x;this.n32=f.y;this.n33=f.z;this.n34=-f.dot(a);this.n43=this.n42=this.n41=0;this.n44=1;return this},multiplyVector3:function(a){var b=a.x,c=a.y,e=a.z,d=1/(this.n41*b+this.n42*c+this.n43*e+this.n44);a.x=(this.n11*b+this.n12*c+this.n13*e+this.n14)*d;a.y=
+(this.n21*b+this.n22*c+this.n23*e+this.n24)*d;a.z=(this.n31*b+this.n32*c+this.n33*e+this.n34)*d;return a},multiplyVector3OnlyZ:function(a){var b=a.x,c=a.y;a=a.z;return(this.n31*b+this.n32*c+this.n33*a+this.n34)*(1/(this.n41*b+this.n42*c+this.n43*a+this.n44))},multiplyVector4:function(a){var b=a.x,c=a.y,e=a.z,d=a.w;a.x=this.n11*b+this.n12*c+this.n13*e+this.n14*d;a.y=this.n21*b+this.n22*c+this.n23*e+this.n24*d;a.z=this.n31*b+this.n32*c+this.n33*e+this.n34*d;a.w=this.n41*b+this.n42*c+this.n43*e+this.n44*
+d;return a},crossVector:function(a){var b=new THREE.Vector4;b.x=this.n11*a.x+this.n12*a.y+this.n13*a.z+this.n14*a.w;b.y=this.n21*a.x+this.n22*a.y+this.n23*a.z+this.n24*a.w;b.z=this.n31*a.x+this.n32*a.y+this.n33*a.z+this.n34*a.w;b.w=a.w?this.n41*a.x+this.n42*a.y+this.n43*a.z+this.n44*a.w:1;return b},multiply:function(a,b){var c=a.n11,e=a.n12,d=a.n13,f=a.n14,g=a.n21,i=a.n22,h=a.n23,j=a.n24,m=a.n31,n=a.n32,l=a.n33,o=a.n34,p=a.n41,q=a.n42,r=a.n43,k=a.n44,B=b.n11,x=b.n12,F=b.n13,G=b.n14,I=b.n21,v=b.n22,
+t=b.n23,C=b.n24,z=b.n31,D=b.n32,E=b.n33,y=b.n34;this.n11=c*B+e*I+d*z;this.n12=c*x+e*v+d*D;this.n13=c*F+e*t+d*E;this.n14=c*G+e*C+d*y+f;this.n21=g*B+i*I+h*z;this.n22=g*x+i*v+h*D;this.n23=g*F+i*t+h*E;this.n24=g*G+i*C+h*y+j;this.n31=m*B+n*I+l*z;this.n32=m*x+n*v+l*D;this.n33=m*F+n*t+l*E;this.n34=m*G+n*C+l*y+o;this.n41=p*B+q*I+r*z;this.n42=p*x+q*v+r*D;this.n43=p*F+q*t+r*E;this.n44=p*G+q*C+r*y+k;return this},multiplyToArray:function(a,b,c){var e=a.n11,d=a.n12,f=a.n13,g=a.n14,i=a.n21,h=a.n22,j=a.n23,m=a.n24,
+n=a.n31,l=a.n32,o=a.n33,p=a.n34,q=a.n41,r=a.n42,k=a.n43;a=a.n44;var B=b.n11,x=b.n12,F=b.n13,G=b.n14,I=b.n21,v=b.n22,t=b.n23,C=b.n24,z=b.n31,D=b.n32,E=b.n33,y=b.n34,u=b.n41,L=b.n42,s=b.n43;b=b.n44;this.n11=e*B+d*I+f*z+g*u;this.n12=e*x+d*v+f*D+g*L;this.n13=e*F+d*t+f*E+g*s;this.n14=e*G+d*C+f*y+g*b;this.n21=i*B+h*I+j*z+m*u;this.n22=i*x+h*v+j*D+m*L;this.n23=i*F+h*t+j*E+m*s;this.n24=i*G+h*C+j*y+m*b;this.n31=n*B+l*I+o*z+p*u;this.n32=n*x+l*v+o*D+p*L;this.n33=n*F+l*t+o*E+p*s;this.n34=n*G+l*C+o*y+p*b;this.n41=
+q*B+r*I+k*z+a*u;this.n42=q*x+r*v+k*D+a*L;this.n43=q*F+r*t+k*E+a*s;this.n44=q*G+r*C+k*y+a*b;c[0]=this.n11;c[1]=this.n21;c[2]=this.n31;c[3]=this.n41;c[4]=this.n12;c[5]=this.n22;c[6]=this.n32;c[7]=this.n42;c[8]=this.n13;c[9]=this.n23;c[10]=this.n33;c[11]=this.n43;c[12]=this.n14;c[13]=this.n24;c[14]=this.n34;c[15]=this.n44;return this},multiplySelf:function(a){var b=this.n11,c=this.n12,e=this.n13,d=this.n14,f=this.n21,g=this.n22,i=this.n23,h=this.n24,j=this.n31,m=this.n32,n=this.n33,l=this.n34,o=this.n41,
+p=this.n42,q=this.n43,r=this.n44,k=a.n11,B=a.n21,x=a.n31,F=a.n12,G=a.n22,I=a.n32,v=a.n13,t=a.n23,C=a.n33,z=a.n14,D=a.n24;a=a.n34;this.n11=b*k+c*B+e*x;this.n12=b*F+c*G+e*I;this.n13=b*v+c*t+e*C;this.n14=b*z+c*D+e*a+d;this.n21=f*k+g*B+i*x;this.n22=f*F+g*G+i*I;this.n23=f*v+g*t+i*C;this.n24=f*z+g*D+i*a+h;this.n31=j*k+m*B+n*x;this.n32=j*F+m*G+n*I;this.n33=j*v+m*t+n*C;this.n34=j*z+m*D+n*a+l;this.n41=o*k+p*B+q*x;this.n42=o*F+p*G+q*I;this.n43=o*v+p*t+q*C;this.n44=o*z+p*D+q*a+r;return this},multiplyScalar:function(a){this.n11*=
+a;this.n12*=a;this.n13*=a;this.n14*=a;this.n21*=a;this.n22*=a;this.n23*=a;this.n24*=a;this.n31*=a;this.n32*=a;this.n33*=a;this.n34*=a;this.n41*=a;this.n42*=a;this.n43*=a;this.n44*=a;return this},determinant:function(){var a=this.n11,b=this.n12,c=this.n13,e=this.n14,d=this.n21,f=this.n22,g=this.n23,i=this.n24,h=this.n31,j=this.n32,m=this.n33,n=this.n34,l=this.n41,o=this.n42,p=this.n43,q=this.n44;return e*g*j*l-c*i*j*l-e*f*m*l+b*i*m*l+c*f*n*l-b*g*n*l-e*g*h*o+c*i*h*o+e*d*m*o-a*i*m*o-c*d*n*o+a*g*n*o+
+e*f*h*p-b*i*h*p-e*d*j*p+a*i*j*p+b*d*n*p-a*f*n*p-c*f*h*q+b*g*h*q+c*d*j*q-a*g*j*q-b*d*m*q+a*f*m*q},transpose:function(){function a(b,c,e){var d=b[c];b[c]=b[e];b[e]=d}a(this,"n21","n12");a(this,"n31","n13");a(this,"n32","n23");a(this,"n41","n14");a(this,"n42","n24");a(this,"n43","n34");return this},clone:function(){var a=new THREE.Matrix4;a.n11=this.n11;a.n12=this.n12;a.n13=this.n13;a.n14=this.n14;a.n21=this.n21;a.n22=this.n22;a.n23=this.n23;a.n24=this.n24;a.n31=this.n31;a.n32=this.n32;a.n33=this.n33;
+a.n34=this.n34;a.n41=this.n41;a.n42=this.n42;a.n43=this.n43;a.n44=this.n44;return a},flatten:function(){this.flattenToArray(this.flat);return this.flat},flattenToArray:function(a){a[0]=this.n11;a[1]=this.n21;a[2]=this.n31;a[3]=this.n41;a[4]=this.n12;a[5]=this.n22;a[6]=this.n32;a[7]=this.n42;a[8]=this.n13;a[9]=this.n23;a[10]=this.n33;a[11]=this.n43;a[12]=this.n14;a[13]=this.n24;a[14]=this.n34;a[15]=this.n44;return a},flattenToArrayOffset:function(a,b){a[b]=this.n11;a[b+1]=this.n21;a[b+2]=this.n31;
+a[b+3]=this.n41;a[b+4]=this.n12;a[b+5]=this.n22;a[b+6]=this.n32;a[b+7]=this.n42;a[b+8]=this.n13;a[b+9]=this.n23;a[b+10]=this.n33;a[b+11]=this.n43;a[b+12]=this.n14;a[b+13]=this.n24;a[b+14]=this.n34;a[b+15]=this.n44;return a},setTranslation:function(a,b,c){this.set(1,0,0,a,0,1,0,b,0,0,1,c,0,0,0,1);return this},setScale:function(a,b,c){this.set(a,0,0,0,0,b,0,0,0,0,c,0,0,0,0,1);return this},setRotX:function(a){var b=Math.cos(a);a=Math.sin(a);this.set(1,0,0,0,0,b,-a,0,0,a,b,0,0,0,0,1);return this},setRotY:function(a){var b=
+Math.cos(a);a=Math.sin(a);this.set(b,0,a,0,0,1,0,0,-a,0,b,0,0,0,0,1);return this},setRotZ:function(a){var b=Math.cos(a);a=Math.sin(a);this.set(b,-a,0,0,a,b,0,0,0,0,1,0,0,0,0,1);return this},setRotAxis:function(a,b){var c=Math.cos(b),e=Math.sin(b),d=1-c,f=a.x,g=a.y,i=a.z,h=d*f,j=d*g;this.set(h*f+c,h*g-e*i,h*i+e*g,0,h*g+e*i,j*g+c,j*i-e*f,0,h*i-e*g,j*i+e*f,d*i*i+c,0,0,0,0,1);return this},setPosition:function(a){this.n14=a.x;this.n24=a.y;this.n34=a.z;return this},setRotationFromEuler:function(a){var b=
+a.x,c=a.y,e=a.z;a=Math.cos(b);b=Math.sin(b);var d=Math.cos(c);c=Math.sin(c);var f=Math.cos(e);e=Math.sin(e);var g=a*c,i=b*c;this.n11=d*f;this.n12=-d*e;this.n13=c;this.n21=i*f+a*e;this.n22=-i*e+a*f;this.n23=-b*d;this.n31=-g*f+b*e;this.n32=g*e+b*f;this.n33=a*d},setRotationFromQuaternion:function(a){var b=a.x,c=a.y,e=a.z,d=a.w,f=b+b,g=c+c,i=e+e;a=b*f;var h=b*g;b*=i;var j=c*g;c*=i;e*=i;f*=d;g*=d;d*=i;this.n11=1-(j+e);this.n12=h-d;this.n13=b+g;this.n21=h+d;this.n22=1-(a+e);this.n23=c-f;this.n31=b-g;this.n32=
+c+f;this.n33=1-(a+j)},scale:function(a){var b=a.x,c=a.y;a=a.z;this.n11*=b;this.n12*=c;this.n13*=a;this.n21*=b;this.n22*=c;this.n23*=a;this.n31*=b;this.n32*=c;this.n33*=a;this.n41*=b;this.n42*=c;this.n43*=a;return this},toString:function(){return"| "+this.n11+" "+this.n12+" "+this.n13+" "+this.n14+" |\n| "+this.n21+" "+this.n22+" "+this.n23+" "+this.n24+" |\n| "+this.n31+" "+this.n32+" "+this.n33+" "+this.n34+" |\n| "+this.n41+" "+this.n42+" "+this.n43+" "+this.n44+" |"}};
+THREE.Matrix4.translationMatrix=function(a,b,c){var e=new THREE.Matrix4;e.setTranslation(a,b,c);return e};THREE.Matrix4.scaleMatrix=function(a,b,c){var e=new THREE.Matrix4;e.setScale(a,b,c);return e};THREE.Matrix4.rotationXMatrix=function(a){var b=new THREE.Matrix4;b.setRotX(a);return b};THREE.Matrix4.rotationYMatrix=function(a){var b=new THREE.Matrix4;b.setRotY(a);return b};THREE.Matrix4.rotationZMatrix=function(a){var b=new THREE.Matrix4;b.setRotZ(a);return b};
+THREE.Matrix4.rotationAxisAngleMatrix=function(a,b){var c=new THREE.Matrix4;c.setRotAxis(a,b);return c};
+THREE.Matrix4.makeInvert=function(a,b){var c=a.n11,e=a.n12,d=a.n13,f=a.n14,g=a.n21,i=a.n22,h=a.n23,j=a.n24,m=a.n31,n=a.n32,l=a.n33,o=a.n34,p=a.n41,q=a.n42,r=a.n43,k=a.n44;b===undefined&&(b=new THREE.Matrix4);b.n11=h*o*q-j*l*q+j*n*r-i*o*r-h*n*k+i*l*k;b.n12=f*l*q-d*o*q-f*n*r+e*o*r+d*n*k-e*l*k;b.n13=d*j*q-f*h*q+f*i*r-e*j*r-d*i*k+e*h*k;b.n14=f*h*n-d*j*n-f*i*l+e*j*l+d*i*o-e*h*o;b.n21=j*l*p-h*o*p-j*m*r+g*o*r+h*m*k-g*l*k;b.n22=d*o*p-f*l*p+f*m*r-c*o*r-d*m*k+c*l*k;b.n23=f*h*p-d*j*p-f*g*r+c*j*r+d*g*k-c*h*k;
+b.n24=d*j*m-f*h*m+f*g*l-c*j*l-d*g*o+c*h*o;b.n31=i*o*p-j*n*p+j*m*q-g*o*q-i*m*k+g*n*k;b.n32=f*n*p-e*o*p-f*m*q+c*o*q+e*m*k-c*n*k;b.n33=d*j*p-f*i*p+f*g*q-c*j*q-e*g*k+c*i*k;b.n34=f*i*m-e*j*m-f*g*n+c*j*n+e*g*o-c*i*o;b.n41=h*n*p-i*l*p-h*m*q+g*l*q+i*m*r-g*n*r;b.n42=e*l*p-d*n*p+d*m*q-c*l*q-e*m*r+c*n*r;b.n43=d*i*p-e*h*p-d*g*q+c*h*q+e*g*r-c*i*r;b.n44=e*h*m-d*i*m+d*g*n-c*h*n-e*g*l+c*i*l;b.multiplyScalar(1/a.determinant());return b};
+THREE.Matrix4.makeInvert3x3=function(a){var b=a.m33,c=b.m,e=a.n33*a.n22-a.n32*a.n23,d=-a.n33*a.n21+a.n31*a.n23,f=a.n32*a.n21-a.n31*a.n22,g=-a.n33*a.n12+a.n32*a.n13,i=a.n33*a.n11-a.n31*a.n13,h=-a.n32*a.n11+a.n31*a.n12,j=a.n23*a.n12-a.n22*a.n13,m=-a.n23*a.n11+a.n21*a.n13,n=a.n22*a.n11-a.n21*a.n12;a=a.n11*e+a.n21*g+a.n31*j;if(a==0)throw"matrix not invertible";a=1/a;c[0]=a*e;c[1]=a*d;c[2]=a*f;c[3]=a*g;c[4]=a*i;c[5]=a*h;c[6]=a*j;c[7]=a*m;c[8]=a*n;return b};
+THREE.Matrix4.makeFrustum=function(a,b,c,e,d,f){var g;g=new THREE.Matrix4;g.n11=2*d/(b-a);g.n12=0;g.n13=(b+a)/(b-a);g.n14=0;g.n21=0;g.n22=2*d/(e-c);g.n23=(e+c)/(e-c);g.n24=0;g.n31=0;g.n32=0;g.n33=-(f+d)/(f-d);g.n34=-2*f*d/(f-d);g.n41=0;g.n42=0;g.n43=-1;g.n44=0;return g};THREE.Matrix4.makePerspective=function(a,b,c,e){var d;a=c*Math.tan(a*Math.PI/360);d=-a;return THREE.Matrix4.makeFrustum(d*b,a*b,d,a,c,e)};
+THREE.Matrix4.makeOrtho=function(a,b,c,e,d,f){var g,i,h,j;g=new THREE.Matrix4;i=b-a;h=c-e;j=f-d;g.n11=2/i;g.n12=0;g.n13=0;g.n14=-((b+a)/i);g.n21=0;g.n22=2/h;g.n23=0;g.n24=-((c+e)/h);g.n31=0;g.n32=0;g.n33=-2/j;g.n34=-((f+d)/j);g.n41=0;g.n42=0;g.n43=0;g.n44=1;return g};THREE.Matrix4.__tmpVec1=new THREE.Vector3;THREE.Matrix4.__tmpVec2=new THREE.Vector3;THREE.Matrix4.__tmpVec3=new THREE.Vector3;
+THREE.Object3D=function(){this.id=THREE.Object3DCounter.value++;this.parent=undefined;this.children=[];this.position=new THREE.Vector3;this.positionScreen=new THREE.Vector4;this.rotation=new THREE.Vector3;this.scale=new THREE.Vector3(1,1,1);this.matrix=new THREE.Matrix4;this.matrixWorld=new THREE.Matrix4;this.matrixRotation=new THREE.Matrix4;this.matrixRotationWorld=new THREE.Matrix4;this.matrixNeedsUpdate=!0;this.matrixAutoUpdate=!0;this.quaternion=new THREE.Quaternion;this.useQuaternion=!1;this.boundRadius=
+0;this.boundRadiusScale=1;this.visible=!0};
+THREE.Object3D.prototype={addChild:function(a){if(this.children.indexOf(a)===-1){a.parent!==undefined&&a.parent.removeChild(a);a.parent=this;this.children.push(a)}},removeChild:function(a){var b=this.children.indexOf(a);if(b!==-1){a.parent=undefined;this.children.splice(b,1)}},updateMatrix:function(){this.matrix.setPosition(this.position);this.useQuaternion?this.matrixRotation.setRotationFromQuaternion(this.quaternion):this.matrixRotation.setRotationFromEuler(this.rotation);this.matrix.n11=this.matrixRotation.n11;
+this.matrix.n12=this.matrixRotation.n12;this.matrix.n13=this.matrixRotation.n13;this.matrix.n21=this.matrixRotation.n21;this.matrix.n22=this.matrixRotation.n22;this.matrix.n23=this.matrixRotation.n23;this.matrix.n31=this.matrixRotation.n31;this.matrix.n32=this.matrixRotation.n32;this.matrix.n33=this.matrixRotation.n33;if(this.scale.x!==1||this.scale.y!==1||this.scale.z!==1){this.matrix.scale(this.scale);this.boundRadiusScale=Math.max(this.scale.x,Math.max(this.scale.y,this.scale.z))}return!0},update:function(a,
+b,c){if(this.visible){this.matrixAutoUpdate&&(b|=this.updateMatrix());if(b||this.matrixNeedsUpdate){a?this.matrixWorld.multiply(a,this.matrix):this.matrixWorld.copy(this.matrix);this.matrixNeedsUpdate=!1;b=!0}a=0;for(var e=this.children.length;a<e;a++)this.children[a].update(this.matrixWorld,b,c)}}};THREE.Object3DCounter={value:0};
+THREE.Vertex=function(a,b){this.position=a||new THREE.Vector3;this.positionWorld=new THREE.Vector3;this.positionScreen=new THREE.Vector4;this.normal=b||new THREE.Vector3;this.normalWorld=new THREE.Vector3;this.normalScreen=new THREE.Vector3;this.tangent=new THREE.Vector4;this.__visible=!0};THREE.Vertex.prototype={toString:function(){return"THREE.Vertex ( position: "+this.position+", normal: "+this.normal+" )"}};
+THREE.Face3=function(a,b,c,e,d){this.a=a;this.b=b;this.c=c;this.centroid=new THREE.Vector3;this.normal=e instanceof THREE.Vector3?e:new THREE.Vector3;this.vertexNormals=e instanceof Array?e:[];this.materials=d instanceof Array?d:[d]};THREE.Face3.prototype={toString:function(){return"THREE.Face3 ( "+this.a+", "+this.b+", "+this.c+" )"}};
+THREE.Face4=function(a,b,c,e,d,f){this.a=a;this.b=b;this.c=c;this.d=e;this.centroid=new THREE.Vector3;this.normal=d instanceof THREE.Vector3?d:new THREE.Vector3;this.vertexNormals=d instanceof Array?d:[];this.materials=f instanceof Array?f:[f]};THREE.Face4.prototype={toString:function(){return"THREE.Face4 ( "+this.a+", "+this.b+", "+this.c+" "+this.d+" )"}};THREE.UV=function(a,b){this.set(a||0,b||0)};
+THREE.UV.prototype={set:function(a,b){this.u=a;this.v=b;return this},copy:function(a){this.set(a.u,a.v);return this},toString:function(){return"THREE.UV ("+this.u+", "+this.v+")"}};
+THREE.Camera=function(a,b,c,e,d){THREE.Object3D.call(this);this.fov=a||50;this.aspect=b||1;this.near=c||0.1;this.far=e||2E3;this.screenCenterY=this.screenCenterX=0;this.target=d||new THREE.Object3D;this.useTarget=!0;this.up=new THREE.Vector3(0,1,0);this.inverseMatrix=new THREE.Matrix4;this.projectionMatrix=null;this.tmpVec=new THREE.Vector3;this.translateX=function(f,g){this.tmpVec.sub(this.target.position,this.position).normalize().multiplyScalar(f);this.tmpVec.crossSelf(this.up);if(g)this.tmpVec.y=
+0;this.position.addSelf(this.tmpVec);this.target.position.addSelf(this.tmpVec)};this.translateZ=function(f,g){this.tmpVec.sub(this.target.position,this.position).normalize().multiplyScalar(f);if(g)this.tmpVec.y=0;this.position.subSelf(this.tmpVec);this.target.position.subSelf(this.tmpVec)};this.updateProjectionMatrix()};THREE.Camera.prototype=new THREE.Object3D;THREE.Camera.prototype.constructor=THREE.Camera;THREE.Camera.prototype.supr=THREE.Object3D.prototype;
+THREE.Camera.prototype.updateProjectionMatrix=function(){this.projectionMatrix=THREE.Matrix4.makePerspective(this.fov,this.aspect,this.near,this.far)};
+THREE.Camera.prototype.update=function(a,b,c){if(this.useTarget){this.matrix.lookAt(this.position,this.target.position,this.up);a?this.matrixWorld.multiply(a,this.matrix):this.matrixWorld.copy(this.matrix);THREE.Matrix4.makeInvert(this.matrixWorld,this.inverseMatrix);b=!0}else{this.matrixAutoUpdate&&(b|=this.updateMatrix());if(b||this.matrixNeedsUpdate){a?this.matrixWorld.multiply(a,this.matrix):this.matrixWorld.copy(this.matrix);this.matrixNeedsUpdate=!1;b=!0;THREE.Matrix4.makeInvert(this.matrixWorld,
+this.inverseMatrix)}}for(a=0;a<this.children.length;a++)this.children[a].update(this.matrixWorld,b,c)};
+THREE.Camera.prototype.frustumContains=function(a){var b=a.matrixWorld.n14,c=a.matrixWorld.n24,e=a.matrixWorld.n34,d=this.inverseMatrix,f=a.boundRadius*a.boundRadiusScale,g=d.n31*b+d.n32*c+d.n33*e+d.n34;if(g-f>-this.near)return!1;if(g+f<-this.far)return!1;g-=f;var i=this.projectionMatrix,h=1/(i.n43*g),j=h*this.screenCenterX,m=(d.n11*b+d.n12*c+d.n13*e+d.n14)*i.n11*j;f=i.n11*f*j;if(m+f<-this.screenCenterX)return!1;if(m-f>this.screenCenterX)return!1;b=(d.n21*b+d.n22*c+d.n23*e+d.n24)*i.n22*h*this.screenCenterY;
+if(b+f<-this.screenCenterY)return!1;if(b-f>this.screenCenterY)return!1;a.positionScreen.set(m,b,g,f);return!0};THREE.ParticleDOMMaterial=function(a){this.id=THREE.MaterialCounter.value++;this.domElement=a};THREE.ParticleDOMMaterial.prototype={toString:function(){return"THREE.ParticleDOMMaterial ( domElement: "+this.domElement+" )"}};THREE.Particle=function(a){THREE.Object3D.call(this);this.materials=a instanceof Array?a:[a];this.matrixAutoUpdate=!1};THREE.Particle.prototype=new THREE.Object3D;
+THREE.Particle.prototype.constructor=THREE.Particle;THREE.Scene=function(){THREE.Object3D.call(this);this.objects=[];this.lights=[];this.sounds=[];this.fog=null;this.matrixAutoUpdate=!1};THREE.Scene.prototype=new THREE.Object3D;THREE.Scene.prototype.constructor=THREE.Scene;THREE.Scene.prototype.supr=THREE.Object3D.prototype;THREE.Scene.prototype.addChild=function(a){this.supr.addChild.call(this,a);this.addChildRecurse(a)};
+THREE.Scene.prototype.addChildRecurse=function(a){if(a instanceof THREE.Light)this.lights.indexOf(a)===-1&&this.lights.push(a);else if(a instanceof THREE.Sound)this.sounds.indexOf(a)===-1&&this.sounds.push(a);else a instanceof THREE.Camera||a instanceof THREE.Bone||this.objects.indexOf(a)===-1&&this.objects.push(a);for(var b=0;b<a.children.length;b++)this.addChildRecurse(a.children[b])};THREE.Scene.prototype.removeChild=function(a){this.supr.removeChild.call(this,a);this.removeChildRecurse(a)};
+THREE.Scene.prototype.removeChildRecurse=function(a){if(a instanceof THREE.Light){var b=this.lights.indexOf(a);b!==-1&&this.lights.splice(b,1)}else if(a instanceof THREE.Sound){b=this.sounds.indexOf(a);b!==-1&&this.sounds.splice(b,1)}else if(!(a instanceof THREE.Camera)){b=this.objects.indexOf(a);b!==-1&&this.objects.splice(b,1)}for(b=0;b<a.children.length;b++)this.removeChildRecurse(a.children[b])};THREE.Scene.prototype.addObject=THREE.Scene.prototype.addChild;
+THREE.Scene.prototype.removeObject=THREE.Scene.prototype.removeChild;THREE.Scene.prototype.addLight=THREE.Scene.prototype.addChild;THREE.Scene.prototype.removeLight=THREE.Scene.prototype.removeChild;
+THREE.Projector=function(){function a(v,t){return t.z-v.z}function b(v,t){var C=0,z=1,D=v.z+v.w,E=t.z+t.w,y=-v.z+v.w,u=-t.z+t.w;if(D>=0&&E>=0&&y>=0&&u>=0)return!0;else if(D<0&&E<0||y<0&&u<0)return!1;else{if(D<0)C=Math.max(C,D/(D-E));else E<0&&(z=Math.min(z,D/(D-E)));if(y<0)C=Math.max(C,y/(y-u));else u<0&&(z=Math.min(z,y/(y-u)));if(z<C)return!1;else{v.lerpSelf(t,C);t.lerpSelf(v,1-z);return!0}}}var c,e,d=[],f,g,i,h=[],j,m,n=[],l,o,p=[],q=new THREE.Vector4,r=new THREE.Vector4,k=new THREE.Matrix4,B=new THREE.Matrix4,
+x=[new THREE.Vector4,new THREE.Vector4,new THREE.Vector4,new THREE.Vector4,new THREE.Vector4,new THREE.Vector4],F=new THREE.Vector4,G=new THREE.Vector4,I;this.projectObjects=function(v,t,C){t=[];var z,D,E;e=0;D=v.objects;v=0;for(z=D.length;v<z;v++){E=D[v];var y;if(!(y=!E.visible))if(y=E instanceof THREE.Mesh){a:{y=void 0;for(var u=E.matrixWorld,L=-E.geometry.boundingSphere.radius*Math.max(E.scale.x,Math.max(E.scale.y,E.scale.z)),s=0;s<6;s++){y=x[s].x*u.n14+x[s].y*u.n24+x[s].z*u.n34+x[s].w;if(y<=L){y=
+!1;break a}}y=!0}y=!y}if(!y){c=d[e]=d[e]||new THREE.RenderableObject;q.copy(E.position);k.multiplyVector3(q);c.object=E;c.z=q.z;t.push(c);e++}}C&&t.sort(a);return t};this.projectScene=function(v,t,C){var z=[],D=t.near,E=t.far,y,u,L,s,H,N,w,P,Q,R,S,O,K,A,J,M;i=m=o=0;t.matrixAutoUpdate&&t.update();k.multiply(t.projectionMatrix,t.matrixWorld);x[0].set(k.n41-k.n11,k.n42-k.n12,k.n43-k.n13,k.n44-k.n14);x[1].set(k.n41+k.n11,k.n42+k.n12,k.n43+k.n13,k.n44+k.n14);x[2].set(k.n41+k.n21,k.n42+k.n22,k.n43+k.n23,
+k.n44+k.n24);x[3].set(k.n41-k.n21,k.n42-k.n22,k.n43-k.n23,k.n44-k.n24);x[4].set(k.n41-k.n31,k.n42-k.n32,k.n43-k.n33,k.n44-k.n34);x[5].set(k.n41+k.n31,k.n42+k.n32,k.n43+k.n33,k.n44+k.n34);for(y=0;y<6;y++){N=x[y];N.divideScalar(Math.sqrt(N.x*N.x+N.y*N.y+N.z*N.z))}v.update(undefined,!1,t);N=this.projectObjects(v,t,!0);v=0;for(y=N.length;v<y;v++){w=N[v].object;if(w.visible){w.matrixAutoUpdate&&w.updateMatrix();P=w.matrixWorld;S=w.matrixRotation;Q=w.materials;R=w.overdraw;if(w instanceof THREE.Mesh){O=
+w.geometry;K=O.vertices;u=0;for(L=K.length;u<L;u++){A=K[u];A.positionWorld.copy(A.position);P.multiplyVector3(A.positionWorld);s=A.positionScreen;s.copy(A.positionWorld);k.multiplyVector4(s);s.x/=s.w;s.y/=s.w;A.__visible=s.z>D&&s.z<E}O=O.faces;u=0;for(L=O.length;u<L;u++){A=O[u];if(A instanceof THREE.Face3){s=K[A.a];H=K[A.b];J=K[A.c];if(s.__visible&&H.__visible&&J.__visible&&(w.doubleSided||w.flipSided!=(J.positionScreen.x-s.positionScreen.x)*(H.positionScreen.y-s.positionScreen.y)-(J.positionScreen.y-
+s.positionScreen.y)*(H.positionScreen.x-s.positionScreen.x)<0)){f=h[i]=h[i]||new THREE.RenderableFace3;f.v1.positionWorld.copy(s.positionWorld);f.v2.positionWorld.copy(H.positionWorld);f.v3.positionWorld.copy(J.positionWorld);f.v1.positionScreen.copy(s.positionScreen);f.v2.positionScreen.copy(H.positionScreen);f.v3.positionScreen.copy(J.positionScreen);f.normalWorld.copy(A.normal);S.multiplyVector3(f.normalWorld);f.centroidWorld.copy(A.centroid);P.multiplyVector3(f.centroidWorld);f.centroidScreen.copy(f.centroidWorld);
+k.multiplyVector3(f.centroidScreen);J=A.vertexNormals;I=f.vertexNormalsWorld;s=0;for(H=J.length;s<H;s++){M=I[s]=I[s]||new THREE.Vector3;M.copy(J[s]);S.multiplyVector3(M)}f.z=f.centroidScreen.z;f.meshMaterials=Q;f.faceMaterials=A.materials;f.overdraw=R;if(w.geometry.uvs[u]){f.uvs[0]=w.geometry.uvs[u][0];f.uvs[1]=w.geometry.uvs[u][1];f.uvs[2]=w.geometry.uvs[u][2]}z.push(f);i++}}else if(A instanceof THREE.Face4){s=K[A.a];H=K[A.b];J=K[A.c];M=K[A.d];if(s.__visible&&H.__visible&&J.__visible&&M.__visible&&
+(w.doubleSided||w.flipSided!=((M.positionScreen.x-s.positionScreen.x)*(H.positionScreen.y-s.positionScreen.y)-(M.positionScreen.y-s.positionScreen.y)*(H.positionScreen.x-s.positionScreen.x)<0||(H.positionScreen.x-J.positionScreen.x)*(M.positionScreen.y-J.positionScreen.y)-(H.positionScreen.y-J.positionScreen.y)*(M.positionScreen.x-J.positionScreen.x)<0))){f=h[i]=h[i]||new THREE.RenderableFace3;f.v1.positionWorld.copy(s.positionWorld);f.v2.positionWorld.copy(H.positionWorld);f.v3.positionWorld.copy(M.positionWorld);
+f.v1.positionScreen.copy(s.positionScreen);f.v2.positionScreen.copy(H.positionScreen);f.v3.positionScreen.copy(M.positionScreen);f.normalWorld.copy(A.normal);S.multiplyVector3(f.normalWorld);f.centroidWorld.copy(A.centroid);P.multiplyVector3(f.centroidWorld);f.centroidScreen.copy(f.centroidWorld);k.multiplyVector3(f.centroidScreen);f.z=f.centroidScreen.z;f.meshMaterials=Q;f.faceMaterials=A.materials;f.overdraw=R;if(w.geometry.uvs[u]){f.uvs[0]=w.geometry.uvs[u][0];f.uvs[1]=w.geometry.uvs[u][1];f.uvs[2]=
+w.geometry.uvs[u][3]}z.push(f);i++;g=h[i]=h[i]||new THREE.RenderableFace3;g.v1.positionWorld.copy(H.positionWorld);g.v2.positionWorld.copy(J.positionWorld);g.v3.positionWorld.copy(M.positionWorld);g.v1.positionScreen.copy(H.positionScreen);g.v2.positionScreen.copy(J.positionScreen);g.v3.positionScreen.copy(M.positionScreen);g.normalWorld.copy(f.normalWorld);g.centroidWorld.copy(f.centroidWorld);g.centroidScreen.copy(f.centroidScreen);g.z=g.centroidScreen.z;g.meshMaterials=Q;g.faceMaterials=A.materials;
+g.overdraw=R;if(w.geometry.uvs[u]){g.uvs[0]=w.geometry.uvs[u][1];g.uvs[1]=w.geometry.uvs[u][2];g.uvs[2]=w.geometry.uvs[u][3]}z.push(g);i++}}}}else if(w instanceof THREE.Line){B.multiply(k,P);K=w.geometry.vertices;A=K[0];A.positionScreen.copy(A.position);B.multiplyVector4(A.positionScreen);u=1;for(L=K.length;u<L;u++){s=K[u];s.positionScreen.copy(s.position);B.multiplyVector4(s.positionScreen);H=K[u-1];F.copy(s.positionScreen);G.copy(H.positionScreen);if(b(F,G)){F.multiplyScalar(1/F.w);G.multiplyScalar(1/
+G.w);j=n[m]=n[m]||new THREE.RenderableLine;j.v1.positionScreen.copy(F);j.v2.positionScreen.copy(G);j.z=Math.max(F.z,G.z);j.materials=w.materials;z.push(j);m++}}}else if(w instanceof THREE.Particle){r.set(w.position.x,w.position.y,w.position.z,1);k.multiplyVector4(r);r.z/=r.w;if(r.z>0&&r.z<1){l=p[o]=p[o]||new THREE.RenderableParticle;l.x=r.x/r.w;l.y=r.y/r.w;l.z=r.z;l.rotation=w.rotation.z;l.scale.x=w.scale.x*Math.abs(l.x-(r.x+t.projectionMatrix.n11)/(r.w+t.projectionMatrix.n14));l.scale.y=w.scale.y*
+Math.abs(l.y-(r.y+t.projectionMatrix.n22)/(r.w+t.projectionMatrix.n24));l.materials=w.materials;z.push(l);o++}}}}C&&z.sort(a);return z};this.unprojectVector=function(v,t){var C=THREE.Matrix4.makeInvert(t.matrixWorld);C.multiplySelf(THREE.Matrix4.makeInvert(t.projectionMatrix));C.multiplyVector3(v);return v}};
+THREE.DOMRenderer=function(){THREE.Renderer.call(this);var a=null,b=new THREE.Projector,c,e,d,f;this.domElement=document.createElement("div");this.setSize=function(g,i){c=g;e=i;d=c/2;f=e/2};this.render=function(g,i){var h,j,m,n,l,o,p,q;a=b.projectScene(g,i);h=0;for(j=a.length;h<j;h++){l=a[h];if(l instanceof THREE.RenderableParticle){p=l.x*d+d;q=l.y*f+f;m=0;for(n=l.material.length;m<n;m++){o=l.material[m];if(o instanceof THREE.ParticleDOMMaterial){o=o.domElement;o.style.left=p+"px";o.style.top=q+"px"}}}}}};
+THREE.RenderableParticle=function(){this.rotation=this.z=this.y=this.x=null;this.scale=new THREE.Vector2;this.materials=null};

文件差异内容过多而无法显示
+ 17 - 0
build/custom/ThreeExtras.js


+ 135 - 0
build/custom/ThreeSVG.js

@@ -0,0 +1,135 @@
+// ThreeSVG.js r33 - http://github.com/mrdoob/three.js
+var THREE=THREE||{};THREE.Color=function(a){this.setHex(a)};
+THREE.Color.prototype={autoUpdate:!0,setRGB:function(a,b,c){this.r=a;this.g=b;this.b=c;if(this.autoUpdate){this.updateHex();this.updateStyleString()}},setHSV:function(a,b,c){var d,e,f,g,i,h;if(c==0)d=e=f=0;else{g=Math.floor(a*6);i=a*6-g;a=c*(1-b);h=c*(1-b*i);b=c*(1-b*(1-i));switch(g){case 1:d=h;e=c;f=a;break;case 2:d=a;e=c;f=b;break;case 3:d=a;e=h;f=c;break;case 4:d=b;e=a;f=c;break;case 5:d=c;e=a;f=h;break;case 6:case 0:d=c;e=b;f=a}}this.r=d;this.g=e;this.b=f;if(this.autoUpdate){this.updateHex();
+this.updateStyleString()}},setHex:function(a){this.hex=~~a&16777215;if(this.autoUpdate){this.updateRGBA();this.updateStyleString()}},updateHex:function(){this.hex=~~(this.r*255)<<16^~~(this.g*255)<<8^~~(this.b*255)},updateRGBA:function(){this.r=(this.hex>>16&255)/255;this.g=(this.hex>>8&255)/255;this.b=(this.hex&255)/255},updateStyleString:function(){this.__styleString="rgb("+~~(this.r*255)+","+~~(this.g*255)+","+~~(this.b*255)+")"},clone:function(){return new THREE.Color(this.hex)},toString:function(){return"THREE.Color ( r: "+
+this.r+", g: "+this.g+", b: "+this.b+", hex: "+this.hex+" )"}};THREE.Vector2=function(a,b){this.set(a||0,b||0)};
+THREE.Vector2.prototype={set:function(a,b){this.x=a;this.y=b;return this},copy:function(a){this.set(a.x,a.y);return this},addSelf:function(a){this.set(this.x+a.x,this.y+a.y);return this},add:function(a,b){this.set(a.x+b.x,a.y+b.y);return this},subSelf:function(a){this.set(this.x-a.x,this.y-a.y);return this},sub:function(a,b){this.set(a.x-b.x,a.y-b.y);return this},multiplyScalar:function(a){this.set(this.x*a,this.y*a);return this},negate:function(){this.set(-this.x,-this.y);return this},unit:function(){this.multiplyScalar(1/
+this.length());return this},length:function(){return Math.sqrt(this.lengthSq())},lengthSq:function(){return this.x*this.x+this.y*this.y},clone:function(){return new THREE.Vector2(this.x,this.y)},toString:function(){return"THREE.Vector2 ("+this.x+", "+this.y+")"}};THREE.Vector3=function(a,b,c){this.set(a||0,b||0,c||0)};
+THREE.Vector3.prototype={set:function(a,b,c){this.x=a;this.y=b;this.z=c;return this},copy:function(a){this.set(a.x,a.y,a.z);return this},add:function(a,b){this.set(a.x+b.x,a.y+b.y,a.z+b.z);return this},addSelf:function(a){this.set(this.x+a.x,this.y+a.y,this.z+a.z);return this},addScalar:function(a){this.set(this.x+a,this.y+a,this.z+a);return this},sub:function(a,b){this.set(a.x-b.x,a.y-b.y,a.z-b.z);return this},subSelf:function(a){this.set(this.x-a.x,this.y-a.y,this.z-a.z);return this},cross:function(a,
+b){this.set(a.y*b.z-a.z*b.y,a.z*b.x-a.x*b.z,a.x*b.y-a.y*b.x);return this},crossSelf:function(a){var b=this.x,c=this.y,d=this.z;this.set(c*a.z-d*a.y,d*a.x-b*a.z,b*a.y-c*a.x);return this},multiply:function(a,b){this.set(a.x*b.x,a.y*b.y,a.z*b.z);return this},multiplySelf:function(a){this.set(this.x*a.x,this.y*a.y,this.z*a.z);return this},multiplyScalar:function(a){this.set(this.x*a,this.y*a,this.z*a);return this},divideSelf:function(a){this.set(this.x/a.x,this.y/a.y,this.z/a.z);return this},divideScalar:function(a){this.set(this.x/
+a,this.y/a,this.z/a);return this},negate:function(){this.set(-this.x,-this.y,-this.z);return this},dot:function(a){return this.x*a.x+this.y*a.y+this.z*a.z},distanceTo:function(a){return Math.sqrt(this.distanceToSquared(a))},distanceToSquared:function(a){var b=this.x-a.x,c=this.y-a.y;a=this.z-a.z;return b*b+c*c+a*a},length:function(){return Math.sqrt(this.lengthSq())},lengthSq:function(){return this.x*this.x+this.y*this.y+this.z*this.z},lengthManhattan:function(){return this.x+this.y+this.z},normalize:function(){var a=
+this.length();a>0?this.multiplyScalar(1/a):this.set(0,0,0);return this},setLength:function(a){return this.normalize().multiplyScalar(a)},isZero:function(){return Math.abs(this.x)<1.0E-4&&Math.abs(this.y)<1.0E-4&&Math.abs(this.z)<1.0E-4},clone:function(){return new THREE.Vector3(this.x,this.y,this.z)},toString:function(){return"THREE.Vector3 ( "+this.x+", "+this.y+", "+this.z+" )"}};THREE.Vector4=function(a,b,c,d){this.set(a||0,b||0,c||0,d||1)};
+THREE.Vector4.prototype={set:function(a,b,c,d){this.x=a;this.y=b;this.z=c;this.w=d;return this},copy:function(a){this.set(a.x,a.y,a.z,a.w||1);return this},add:function(a,b){this.set(a.x+b.x,a.y+b.y,a.z+b.z,a.w+b.w);return this},addSelf:function(a){this.set(this.x+a.x,this.y+a.y,this.z+a.z,this.w+a.w);return this},sub:function(a,b){this.set(a.x-b.x,a.y-b.y,a.z-b.z,a.w-b.w);return this},subSelf:function(a){this.set(this.x-a.x,this.y-a.y,this.z-a.z,this.w-a.w);return this},multiplyScalar:function(a){this.set(this.x*
+a,this.y*a,this.z*a,this.w*a);return this},divideScalar:function(a){this.set(this.x/a,this.y/a,this.z/a,this.w/a);return this},lerpSelf:function(a,b){this.set(this.x+(a.x-this.x)*b,this.y+(a.y-this.y)*b,this.z+(a.z-this.z)*b,this.w+(a.w-this.w)*b)},clone:function(){return new THREE.Vector4(this.x,this.y,this.z,this.w)},toString:function(){return"THREE.Vector4 ("+this.x+", "+this.y+", "+this.z+", "+this.w+")"}};THREE.Ray=function(a,b){this.origin=a||new THREE.Vector3;this.direction=b||new THREE.Vector3};
+THREE.Ray.prototype={intersectScene:function(a){var b,c,d=a.objects,e=[];a=0;for(b=d.length;a<b;a++){c=d[a];c instanceof THREE.Mesh&&(e=e.concat(this.intersectObject(c)))}e.sort(function(f,g){return f.distance-g.distance});return e},intersectObject:function(a){function b(t,j,H,p){p=p.clone().subSelf(j);H=H.clone().subSelf(j);var y=t.clone().subSelf(j);t=p.dot(p);j=p.dot(H);p=p.dot(y);var C=H.dot(H);H=H.dot(y);y=1/(t*C-j*j);C=(C*p-j*H)*y;t=(t*H-j*p)*y;return C>0&&t>0&&C+t<1}var c,d,e,f,g,i,h,k,n,m,
+l,o=a.geometry,q=o.vertices,s=[];c=0;for(d=o.faces.length;c<d;c++){e=o.faces[c];m=this.origin.clone();l=this.direction.clone();h=a.matrixWorld;f=h.multiplyVector3(q[e.a].position.clone());g=h.multiplyVector3(q[e.b].position.clone());i=h.multiplyVector3(q[e.c].position.clone());h=e instanceof THREE.Face4?h.multiplyVector3(q[e.d].position.clone()):null;k=a.matrixRotation.multiplyVector3(e.normal.clone());n=l.dot(k);if(n<0){k=k.dot((new THREE.Vector3).sub(f,m))/n;m=m.addSelf(l.multiplyScalar(k));if(e instanceof
+THREE.Face3){if(b(m,f,g,i)){e={distance:this.origin.distanceTo(m),point:m,face:e,object:a};s.push(e)}}else if(e instanceof THREE.Face4&&(b(m,f,g,h)||b(m,g,i,h))){e={distance:this.origin.distanceTo(m),point:m,face:e,object:a};s.push(e)}}}return s}};
+THREE.Rectangle=function(){function a(){f=d-b;g=e-c}var b,c,d,e,f,g,i=!0;this.getX=function(){return b};this.getY=function(){return c};this.getWidth=function(){return f};this.getHeight=function(){return g};this.getLeft=function(){return b};this.getTop=function(){return c};this.getRight=function(){return d};this.getBottom=function(){return e};this.set=function(h,k,n,m){i=!1;b=h;c=k;d=n;e=m;a()};this.addPoint=function(h,k){if(i){i=!1;b=h;c=k;d=h;e=k}else{b=b<h?b:h;c=c<k?c:k;d=d>h?d:h;e=e>k?e:k}a()};
+this.add3Points=function(h,k,n,m,l,o){if(i){i=!1;b=h<n?h<l?h:l:n<l?n:l;c=k<m?k<o?k:o:m<o?m:o;d=h>n?h>l?h:l:n>l?n:l;e=k>m?k>o?k:o:m>o?m:o}else{b=h<n?h<l?h<b?h:b:l<b?l:b:n<l?n<b?n:b:l<b?l:b;c=k<m?k<o?k<c?k:c:o<c?o:c:m<o?m<c?m:c:o<c?o:c;d=h>n?h>l?h>d?h:d:l>d?l:d:n>l?n>d?n:d:l>d?l:d;e=k>m?k>o?k>e?k:e:o>e?o:e:m>o?m>e?m:e:o>e?o:e}a()};this.addRectangle=function(h){if(i){i=!1;b=h.getLeft();c=h.getTop();d=h.getRight();e=h.getBottom()}else{b=b<h.getLeft()?b:h.getLeft();c=c<h.getTop()?c:h.getTop();d=d>h.getRight()?
+d:h.getRight();e=e>h.getBottom()?e:h.getBottom()}a()};this.inflate=function(h){b-=h;c-=h;d+=h;e+=h;a()};this.minSelf=function(h){b=b>h.getLeft()?b:h.getLeft();c=c>h.getTop()?c:h.getTop();d=d<h.getRight()?d:h.getRight();e=e<h.getBottom()?e:h.getBottom();a()};this.instersects=function(h){return Math.min(d,h.getRight())-Math.max(b,h.getLeft())>=0&&Math.min(e,h.getBottom())-Math.max(c,h.getTop())>=0};this.empty=function(){i=!0;e=d=c=b=0;a()};this.isEmpty=function(){return i};this.toString=function(){return"THREE.Rectangle ( left: "+
+b+", right: "+d+", top: "+c+", bottom: "+e+", width: "+f+", height: "+g+" )"}};THREE.Matrix3=function(){this.m=[]};THREE.Matrix3.prototype={transpose:function(){var a,b=this.m;a=b[1];b[1]=b[3];b[3]=a;a=b[2];b[2]=b[6];b[6]=a;a=b[5];b[5]=b[7];b[7]=a;return this},transposeIntoArray:function(a){var b=this.m;a[0]=b[0];a[1]=b[3];a[2]=b[6];a[3]=b[1];a[4]=b[4];a[5]=b[7];a[6]=b[2];a[7]=b[5];a[8]=b[8];return this}};
+THREE.Matrix4=function(a,b,c,d,e,f,g,i,h,k,n,m,l,o,q,s){this.set(a||1,b||0,c||0,d||0,e||0,f||1,g||0,i||0,h||0,k||0,n||1,m||0,l||0,o||0,q||0,s||1);this.flat=Array(16);this.m33=new THREE.Matrix3};
+THREE.Matrix4.prototype={set:function(a,b,c,d,e,f,g,i,h,k,n,m,l,o,q,s){this.n11=a;this.n12=b;this.n13=c;this.n14=d;this.n21=e;this.n22=f;this.n23=g;this.n24=i;this.n31=h;this.n32=k;this.n33=n;this.n34=m;this.n41=l;this.n42=o;this.n43=q;this.n44=s;return this},identity:function(){this.set(1,0,0,0,0,1,0,0,0,0,1,0,0,0,0,1);return this},copy:function(a){this.set(a.n11,a.n12,a.n13,a.n14,a.n21,a.n22,a.n23,a.n24,a.n31,a.n32,a.n33,a.n34,a.n41,a.n42,a.n43,a.n44);return this},lookAt:function(a,b,c){var d=THREE.Matrix4.__tmpVec1,
+e=THREE.Matrix4.__tmpVec2,f=THREE.Matrix4.__tmpVec3;f.sub(a,b).normalize();d.cross(c,f).normalize();e.cross(f,d).normalize();this.n11=d.x;this.n12=d.y;this.n13=d.z;this.n14=-d.dot(a);this.n21=e.x;this.n22=e.y;this.n23=e.z;this.n24=-e.dot(a);this.n31=f.x;this.n32=f.y;this.n33=f.z;this.n34=-f.dot(a);this.n43=this.n42=this.n41=0;this.n44=1;return this},multiplyVector3:function(a){var b=a.x,c=a.y,d=a.z,e=1/(this.n41*b+this.n42*c+this.n43*d+this.n44);a.x=(this.n11*b+this.n12*c+this.n13*d+this.n14)*e;a.y=
+(this.n21*b+this.n22*c+this.n23*d+this.n24)*e;a.z=(this.n31*b+this.n32*c+this.n33*d+this.n34)*e;return a},multiplyVector3OnlyZ:function(a){var b=a.x,c=a.y;a=a.z;return(this.n31*b+this.n32*c+this.n33*a+this.n34)*(1/(this.n41*b+this.n42*c+this.n43*a+this.n44))},multiplyVector4:function(a){var b=a.x,c=a.y,d=a.z,e=a.w;a.x=this.n11*b+this.n12*c+this.n13*d+this.n14*e;a.y=this.n21*b+this.n22*c+this.n23*d+this.n24*e;a.z=this.n31*b+this.n32*c+this.n33*d+this.n34*e;a.w=this.n41*b+this.n42*c+this.n43*d+this.n44*
+e;return a},crossVector:function(a){var b=new THREE.Vector4;b.x=this.n11*a.x+this.n12*a.y+this.n13*a.z+this.n14*a.w;b.y=this.n21*a.x+this.n22*a.y+this.n23*a.z+this.n24*a.w;b.z=this.n31*a.x+this.n32*a.y+this.n33*a.z+this.n34*a.w;b.w=a.w?this.n41*a.x+this.n42*a.y+this.n43*a.z+this.n44*a.w:1;return b},multiply:function(a,b){var c=a.n11,d=a.n12,e=a.n13,f=a.n14,g=a.n21,i=a.n22,h=a.n23,k=a.n24,n=a.n31,m=a.n32,l=a.n33,o=a.n34,q=a.n41,s=a.n42,t=a.n43,j=a.n44,H=b.n11,p=b.n12,y=b.n13,C=b.n14,L=b.n21,z=b.n22,
+v=b.n23,I=b.n24,E=b.n31,K=b.n32,J=b.n33,u=b.n34;this.n11=c*H+d*L+e*E;this.n12=c*p+d*z+e*K;this.n13=c*y+d*v+e*J;this.n14=c*C+d*I+e*u+f;this.n21=g*H+i*L+h*E;this.n22=g*p+i*z+h*K;this.n23=g*y+i*v+h*J;this.n24=g*C+i*I+h*u+k;this.n31=n*H+m*L+l*E;this.n32=n*p+m*z+l*K;this.n33=n*y+m*v+l*J;this.n34=n*C+m*I+l*u+o;this.n41=q*H+s*L+t*E;this.n42=q*p+s*z+t*K;this.n43=q*y+s*v+t*J;this.n44=q*C+s*I+t*u+j;return this},multiplyToArray:function(a,b,c){var d=a.n11,e=a.n12,f=a.n13,g=a.n14,i=a.n21,h=a.n22,k=a.n23,n=a.n24,
+m=a.n31,l=a.n32,o=a.n33,q=a.n34,s=a.n41,t=a.n42,j=a.n43;a=a.n44;var H=b.n11,p=b.n12,y=b.n13,C=b.n14,L=b.n21,z=b.n22,v=b.n23,I=b.n24,E=b.n31,K=b.n32,J=b.n33,u=b.n34,D=b.n41,S=b.n42,x=b.n43;b=b.n44;this.n11=d*H+e*L+f*E+g*D;this.n12=d*p+e*z+f*K+g*S;this.n13=d*y+e*v+f*J+g*x;this.n14=d*C+e*I+f*u+g*b;this.n21=i*H+h*L+k*E+n*D;this.n22=i*p+h*z+k*K+n*S;this.n23=i*y+h*v+k*J+n*x;this.n24=i*C+h*I+k*u+n*b;this.n31=m*H+l*L+o*E+q*D;this.n32=m*p+l*z+o*K+q*S;this.n33=m*y+l*v+o*J+q*x;this.n34=m*C+l*I+o*u+q*b;this.n41=
+s*H+t*L+j*E+a*D;this.n42=s*p+t*z+j*K+a*S;this.n43=s*y+t*v+j*J+a*x;this.n44=s*C+t*I+j*u+a*b;c[0]=this.n11;c[1]=this.n21;c[2]=this.n31;c[3]=this.n41;c[4]=this.n12;c[5]=this.n22;c[6]=this.n32;c[7]=this.n42;c[8]=this.n13;c[9]=this.n23;c[10]=this.n33;c[11]=this.n43;c[12]=this.n14;c[13]=this.n24;c[14]=this.n34;c[15]=this.n44;return this},multiplySelf:function(a){var b=this.n11,c=this.n12,d=this.n13,e=this.n14,f=this.n21,g=this.n22,i=this.n23,h=this.n24,k=this.n31,n=this.n32,m=this.n33,l=this.n34,o=this.n41,
+q=this.n42,s=this.n43,t=this.n44,j=a.n11,H=a.n21,p=a.n31,y=a.n12,C=a.n22,L=a.n32,z=a.n13,v=a.n23,I=a.n33,E=a.n14,K=a.n24;a=a.n34;this.n11=b*j+c*H+d*p;this.n12=b*y+c*C+d*L;this.n13=b*z+c*v+d*I;this.n14=b*E+c*K+d*a+e;this.n21=f*j+g*H+i*p;this.n22=f*y+g*C+i*L;this.n23=f*z+g*v+i*I;this.n24=f*E+g*K+i*a+h;this.n31=k*j+n*H+m*p;this.n32=k*y+n*C+m*L;this.n33=k*z+n*v+m*I;this.n34=k*E+n*K+m*a+l;this.n41=o*j+q*H+s*p;this.n42=o*y+q*C+s*L;this.n43=o*z+q*v+s*I;this.n44=o*E+q*K+s*a+t;return this},multiplyScalar:function(a){this.n11*=
+a;this.n12*=a;this.n13*=a;this.n14*=a;this.n21*=a;this.n22*=a;this.n23*=a;this.n24*=a;this.n31*=a;this.n32*=a;this.n33*=a;this.n34*=a;this.n41*=a;this.n42*=a;this.n43*=a;this.n44*=a;return this},determinant:function(){var a=this.n11,b=this.n12,c=this.n13,d=this.n14,e=this.n21,f=this.n22,g=this.n23,i=this.n24,h=this.n31,k=this.n32,n=this.n33,m=this.n34,l=this.n41,o=this.n42,q=this.n43,s=this.n44;return d*g*k*l-c*i*k*l-d*f*n*l+b*i*n*l+c*f*m*l-b*g*m*l-d*g*h*o+c*i*h*o+d*e*n*o-a*i*n*o-c*e*m*o+a*g*m*o+
+d*f*h*q-b*i*h*q-d*e*k*q+a*i*k*q+b*e*m*q-a*f*m*q-c*f*h*s+b*g*h*s+c*e*k*s-a*g*k*s-b*e*n*s+a*f*n*s},transpose:function(){function a(b,c,d){var e=b[c];b[c]=b[d];b[d]=e}a(this,"n21","n12");a(this,"n31","n13");a(this,"n32","n23");a(this,"n41","n14");a(this,"n42","n24");a(this,"n43","n34");return this},clone:function(){var a=new THREE.Matrix4;a.n11=this.n11;a.n12=this.n12;a.n13=this.n13;a.n14=this.n14;a.n21=this.n21;a.n22=this.n22;a.n23=this.n23;a.n24=this.n24;a.n31=this.n31;a.n32=this.n32;a.n33=this.n33;
+a.n34=this.n34;a.n41=this.n41;a.n42=this.n42;a.n43=this.n43;a.n44=this.n44;return a},flatten:function(){this.flattenToArray(this.flat);return this.flat},flattenToArray:function(a){a[0]=this.n11;a[1]=this.n21;a[2]=this.n31;a[3]=this.n41;a[4]=this.n12;a[5]=this.n22;a[6]=this.n32;a[7]=this.n42;a[8]=this.n13;a[9]=this.n23;a[10]=this.n33;a[11]=this.n43;a[12]=this.n14;a[13]=this.n24;a[14]=this.n34;a[15]=this.n44;return a},flattenToArrayOffset:function(a,b){a[b]=this.n11;a[b+1]=this.n21;a[b+2]=this.n31;
+a[b+3]=this.n41;a[b+4]=this.n12;a[b+5]=this.n22;a[b+6]=this.n32;a[b+7]=this.n42;a[b+8]=this.n13;a[b+9]=this.n23;a[b+10]=this.n33;a[b+11]=this.n43;a[b+12]=this.n14;a[b+13]=this.n24;a[b+14]=this.n34;a[b+15]=this.n44;return a},setTranslation:function(a,b,c){this.set(1,0,0,a,0,1,0,b,0,0,1,c,0,0,0,1);return this},setScale:function(a,b,c){this.set(a,0,0,0,0,b,0,0,0,0,c,0,0,0,0,1);return this},setRotX:function(a){var b=Math.cos(a);a=Math.sin(a);this.set(1,0,0,0,0,b,-a,0,0,a,b,0,0,0,0,1);return this},setRotY:function(a){var b=
+Math.cos(a);a=Math.sin(a);this.set(b,0,a,0,0,1,0,0,-a,0,b,0,0,0,0,1);return this},setRotZ:function(a){var b=Math.cos(a);a=Math.sin(a);this.set(b,-a,0,0,a,b,0,0,0,0,1,0,0,0,0,1);return this},setRotAxis:function(a,b){var c=Math.cos(b),d=Math.sin(b),e=1-c,f=a.x,g=a.y,i=a.z,h=e*f,k=e*g;this.set(h*f+c,h*g-d*i,h*i+d*g,0,h*g+d*i,k*g+c,k*i-d*f,0,h*i-d*g,k*i+d*f,e*i*i+c,0,0,0,0,1);return this},setPosition:function(a){this.n14=a.x;this.n24=a.y;this.n34=a.z;return this},setRotationFromEuler:function(a){var b=
+a.x,c=a.y,d=a.z;a=Math.cos(b);b=Math.sin(b);var e=Math.cos(c);c=Math.sin(c);var f=Math.cos(d);d=Math.sin(d);var g=a*c,i=b*c;this.n11=e*f;this.n12=-e*d;this.n13=c;this.n21=i*f+a*d;this.n22=-i*d+a*f;this.n23=-b*e;this.n31=-g*f+b*d;this.n32=g*d+b*f;this.n33=a*e},setRotationFromQuaternion:function(a){var b=a.x,c=a.y,d=a.z,e=a.w,f=b+b,g=c+c,i=d+d;a=b*f;var h=b*g;b*=i;var k=c*g;c*=i;d*=i;f*=e;g*=e;e*=i;this.n11=1-(k+d);this.n12=h-e;this.n13=b+g;this.n21=h+e;this.n22=1-(a+d);this.n23=c-f;this.n31=b-g;this.n32=
+c+f;this.n33=1-(a+k)},scale:function(a){var b=a.x,c=a.y;a=a.z;this.n11*=b;this.n12*=c;this.n13*=a;this.n21*=b;this.n22*=c;this.n23*=a;this.n31*=b;this.n32*=c;this.n33*=a;this.n41*=b;this.n42*=c;this.n43*=a;return this},toString:function(){return"| "+this.n11+" "+this.n12+" "+this.n13+" "+this.n14+" |\n| "+this.n21+" "+this.n22+" "+this.n23+" "+this.n24+" |\n| "+this.n31+" "+this.n32+" "+this.n33+" "+this.n34+" |\n| "+this.n41+" "+this.n42+" "+this.n43+" "+this.n44+" |"}};
+THREE.Matrix4.translationMatrix=function(a,b,c){var d=new THREE.Matrix4;d.setTranslation(a,b,c);return d};THREE.Matrix4.scaleMatrix=function(a,b,c){var d=new THREE.Matrix4;d.setScale(a,b,c);return d};THREE.Matrix4.rotationXMatrix=function(a){var b=new THREE.Matrix4;b.setRotX(a);return b};THREE.Matrix4.rotationYMatrix=function(a){var b=new THREE.Matrix4;b.setRotY(a);return b};THREE.Matrix4.rotationZMatrix=function(a){var b=new THREE.Matrix4;b.setRotZ(a);return b};
+THREE.Matrix4.rotationAxisAngleMatrix=function(a,b){var c=new THREE.Matrix4;c.setRotAxis(a,b);return c};
+THREE.Matrix4.makeInvert=function(a,b){var c=a.n11,d=a.n12,e=a.n13,f=a.n14,g=a.n21,i=a.n22,h=a.n23,k=a.n24,n=a.n31,m=a.n32,l=a.n33,o=a.n34,q=a.n41,s=a.n42,t=a.n43,j=a.n44;b===undefined&&(b=new THREE.Matrix4);b.n11=h*o*s-k*l*s+k*m*t-i*o*t-h*m*j+i*l*j;b.n12=f*l*s-e*o*s-f*m*t+d*o*t+e*m*j-d*l*j;b.n13=e*k*s-f*h*s+f*i*t-d*k*t-e*i*j+d*h*j;b.n14=f*h*m-e*k*m-f*i*l+d*k*l+e*i*o-d*h*o;b.n21=k*l*q-h*o*q-k*n*t+g*o*t+h*n*j-g*l*j;b.n22=e*o*q-f*l*q+f*n*t-c*o*t-e*n*j+c*l*j;b.n23=f*h*q-e*k*q-f*g*t+c*k*t+e*g*j-c*h*j;
+b.n24=e*k*n-f*h*n+f*g*l-c*k*l-e*g*o+c*h*o;b.n31=i*o*q-k*m*q+k*n*s-g*o*s-i*n*j+g*m*j;b.n32=f*m*q-d*o*q-f*n*s+c*o*s+d*n*j-c*m*j;b.n33=e*k*q-f*i*q+f*g*s-c*k*s-d*g*j+c*i*j;b.n34=f*i*n-d*k*n-f*g*m+c*k*m+d*g*o-c*i*o;b.n41=h*m*q-i*l*q-h*n*s+g*l*s+i*n*t-g*m*t;b.n42=d*l*q-e*m*q+e*n*s-c*l*s-d*n*t+c*m*t;b.n43=e*i*q-d*h*q-e*g*s+c*h*s+d*g*t-c*i*t;b.n44=d*h*n-e*i*n+e*g*m-c*h*m-d*g*l+c*i*l;b.multiplyScalar(1/a.determinant());return b};
+THREE.Matrix4.makeInvert3x3=function(a){var b=a.m33,c=b.m,d=a.n33*a.n22-a.n32*a.n23,e=-a.n33*a.n21+a.n31*a.n23,f=a.n32*a.n21-a.n31*a.n22,g=-a.n33*a.n12+a.n32*a.n13,i=a.n33*a.n11-a.n31*a.n13,h=-a.n32*a.n11+a.n31*a.n12,k=a.n23*a.n12-a.n22*a.n13,n=-a.n23*a.n11+a.n21*a.n13,m=a.n22*a.n11-a.n21*a.n12;a=a.n11*d+a.n21*g+a.n31*k;if(a==0)throw"matrix not invertible";a=1/a;c[0]=a*d;c[1]=a*e;c[2]=a*f;c[3]=a*g;c[4]=a*i;c[5]=a*h;c[6]=a*k;c[7]=a*n;c[8]=a*m;return b};
+THREE.Matrix4.makeFrustum=function(a,b,c,d,e,f){var g;g=new THREE.Matrix4;g.n11=2*e/(b-a);g.n12=0;g.n13=(b+a)/(b-a);g.n14=0;g.n21=0;g.n22=2*e/(d-c);g.n23=(d+c)/(d-c);g.n24=0;g.n31=0;g.n32=0;g.n33=-(f+e)/(f-e);g.n34=-2*f*e/(f-e);g.n41=0;g.n42=0;g.n43=-1;g.n44=0;return g};THREE.Matrix4.makePerspective=function(a,b,c,d){var e;a=c*Math.tan(a*Math.PI/360);e=-a;return THREE.Matrix4.makeFrustum(e*b,a*b,e,a,c,d)};
+THREE.Matrix4.makeOrtho=function(a,b,c,d,e,f){var g,i,h,k;g=new THREE.Matrix4;i=b-a;h=c-d;k=f-e;g.n11=2/i;g.n12=0;g.n13=0;g.n14=-((b+a)/i);g.n21=0;g.n22=2/h;g.n23=0;g.n24=-((c+d)/h);g.n31=0;g.n32=0;g.n33=-2/k;g.n34=-((f+e)/k);g.n41=0;g.n42=0;g.n43=0;g.n44=1;return g};THREE.Matrix4.__tmpVec1=new THREE.Vector3;THREE.Matrix4.__tmpVec2=new THREE.Vector3;THREE.Matrix4.__tmpVec3=new THREE.Vector3;
+THREE.Object3D=function(){this.id=THREE.Object3DCounter.value++;this.parent=undefined;this.children=[];this.position=new THREE.Vector3;this.positionScreen=new THREE.Vector4;this.rotation=new THREE.Vector3;this.scale=new THREE.Vector3(1,1,1);this.matrix=new THREE.Matrix4;this.matrixWorld=new THREE.Matrix4;this.matrixRotation=new THREE.Matrix4;this.matrixRotationWorld=new THREE.Matrix4;this.matrixNeedsUpdate=!0;this.matrixAutoUpdate=!0;this.quaternion=new THREE.Quaternion;this.useQuaternion=!1;this.boundRadius=
+0;this.boundRadiusScale=1;this.visible=!0};
+THREE.Object3D.prototype={addChild:function(a){if(this.children.indexOf(a)===-1){a.parent!==undefined&&a.parent.removeChild(a);a.parent=this;this.children.push(a)}},removeChild:function(a){var b=this.children.indexOf(a);if(b!==-1){a.parent=undefined;this.children.splice(b,1)}},updateMatrix:function(){this.matrix.setPosition(this.position);this.useQuaternion?this.matrixRotation.setRotationFromQuaternion(this.quaternion):this.matrixRotation.setRotationFromEuler(this.rotation);this.matrix.n11=this.matrixRotation.n11;
+this.matrix.n12=this.matrixRotation.n12;this.matrix.n13=this.matrixRotation.n13;this.matrix.n21=this.matrixRotation.n21;this.matrix.n22=this.matrixRotation.n22;this.matrix.n23=this.matrixRotation.n23;this.matrix.n31=this.matrixRotation.n31;this.matrix.n32=this.matrixRotation.n32;this.matrix.n33=this.matrixRotation.n33;if(this.scale.x!==1||this.scale.y!==1||this.scale.z!==1){this.matrix.scale(this.scale);this.boundRadiusScale=Math.max(this.scale.x,Math.max(this.scale.y,this.scale.z))}return!0},update:function(a,
+b,c){if(this.visible){this.matrixAutoUpdate&&(b|=this.updateMatrix());if(b||this.matrixNeedsUpdate){a?this.matrixWorld.multiply(a,this.matrix):this.matrixWorld.copy(this.matrix);this.matrixNeedsUpdate=!1;b=!0}a=0;for(var d=this.children.length;a<d;a++)this.children[a].update(this.matrixWorld,b,c)}}};THREE.Object3DCounter={value:0};
+THREE.Vertex=function(a,b){this.position=a||new THREE.Vector3;this.positionWorld=new THREE.Vector3;this.positionScreen=new THREE.Vector4;this.normal=b||new THREE.Vector3;this.normalWorld=new THREE.Vector3;this.normalScreen=new THREE.Vector3;this.tangent=new THREE.Vector4;this.__visible=!0};THREE.Vertex.prototype={toString:function(){return"THREE.Vertex ( position: "+this.position+", normal: "+this.normal+" )"}};
+THREE.Face3=function(a,b,c,d,e){this.a=a;this.b=b;this.c=c;this.centroid=new THREE.Vector3;this.normal=d instanceof THREE.Vector3?d:new THREE.Vector3;this.vertexNormals=d instanceof Array?d:[];this.materials=e instanceof Array?e:[e]};THREE.Face3.prototype={toString:function(){return"THREE.Face3 ( "+this.a+", "+this.b+", "+this.c+" )"}};
+THREE.Face4=function(a,b,c,d,e,f){this.a=a;this.b=b;this.c=c;this.d=d;this.centroid=new THREE.Vector3;this.normal=e instanceof THREE.Vector3?e:new THREE.Vector3;this.vertexNormals=e instanceof Array?e:[];this.materials=f instanceof Array?f:[f]};THREE.Face4.prototype={toString:function(){return"THREE.Face4 ( "+this.a+", "+this.b+", "+this.c+" "+this.d+" )"}};THREE.UV=function(a,b){this.set(a||0,b||0)};
+THREE.UV.prototype={set:function(a,b){this.u=a;this.v=b;return this},copy:function(a){this.set(a.u,a.v);return this},toString:function(){return"THREE.UV ("+this.u+", "+this.v+")"}};THREE.Geometry=function(){this.id="Geometry"+THREE.GeometryIdCounter++;this.vertices=[];this.faces=[];this.uvs=[];this.uvs2=[];this.colors=[];this.skinWeights=[];this.skinIndices=[];this.boundingSphere=this.boundingBox=null;this.geometryChunks={};this.hasTangents=!1};
+THREE.Geometry.prototype={computeCentroids:function(){var a,b,c;a=0;for(b=this.faces.length;a<b;a++){c=this.faces[a];c.centroid.set(0,0,0);if(c instanceof THREE.Face3){c.centroid.addSelf(this.vertices[c.a].position);c.centroid.addSelf(this.vertices[c.b].position);c.centroid.addSelf(this.vertices[c.c].position);c.centroid.divideScalar(3)}else if(c instanceof THREE.Face4){c.centroid.addSelf(this.vertices[c.a].position);c.centroid.addSelf(this.vertices[c.b].position);c.centroid.addSelf(this.vertices[c.c].position);
+c.centroid.addSelf(this.vertices[c.d].position);c.centroid.divideScalar(4)}}},computeFaceNormals:function(a){var b,c,d,e,f,g,i=new THREE.Vector3,h=new THREE.Vector3;d=0;for(e=this.vertices.length;d<e;d++){f=this.vertices[d];f.normal.set(0,0,0)}d=0;for(e=this.faces.length;d<e;d++){f=this.faces[d];if(a&&f.vertexNormals.length){i.set(0,0,0);b=0;for(c=f.normal.length;b<c;b++)i.addSelf(f.vertexNormals[b]);i.divideScalar(3)}else{b=this.vertices[f.a];c=this.vertices[f.b];g=this.vertices[f.c];i.sub(g.position,
+c.position);h.sub(b.position,c.position);i.crossSelf(h)}i.isZero()||i.normalize();f.normal.copy(i)}},computeVertexNormals:function(){var a,b,c,d;if(this.__tmpVertices==undefined){d=this.__tmpVertices=Array(this.vertices.length);a=0;for(b=this.vertices.length;a<b;a++)d[a]=new THREE.Vector3;a=0;for(b=this.faces.length;a<b;a++){c=this.faces[a];if(c instanceof THREE.Face3)c.vertexNormals=[new THREE.Vector3,new THREE.Vector3,new THREE.Vector3];else if(c instanceof THREE.Face4)c.vertexNormals=[new THREE.Vector3,
+new THREE.Vector3,new THREE.Vector3,new THREE.Vector3]}}else{d=this.__tmpVertices;a=0;for(b=this.vertices.length;a<b;a++)d[a].set(0,0,0)}a=0;for(b=this.faces.length;a<b;a++){c=this.faces[a];if(c instanceof THREE.Face3){d[c.a].addSelf(c.normal);d[c.b].addSelf(c.normal);d[c.c].addSelf(c.normal)}else if(c instanceof THREE.Face4){d[c.a].addSelf(c.normal);d[c.b].addSelf(c.normal);d[c.c].addSelf(c.normal);d[c.d].addSelf(c.normal)}}a=0;for(b=this.vertices.length;a<b;a++)d[a].normalize();a=0;for(b=this.faces.length;a<
+b;a++){c=this.faces[a];if(c instanceof THREE.Face3){c.vertexNormals[0].copy(d[c.a]);c.vertexNormals[1].copy(d[c.b]);c.vertexNormals[2].copy(d[c.c])}else if(c instanceof THREE.Face4){c.vertexNormals[0].copy(d[c.a]);c.vertexNormals[1].copy(d[c.b]);c.vertexNormals[2].copy(d[c.c]);c.vertexNormals[3].copy(d[c.d])}}},computeTangents:function(){function a(u,D,S,x,N,F,A){f=u.vertices[D].position;g=u.vertices[S].position;i=u.vertices[x].position;h=e[N];k=e[F];n=e[A];m=g.x-f.x;l=i.x-f.x;o=g.y-f.y;q=i.y-f.y;
+s=g.z-f.z;t=i.z-f.z;j=k.u-h.u;H=n.u-h.u;p=k.v-h.v;y=n.v-h.v;C=1/(j*y-H*p);v.set((y*m-p*l)*C,(y*o-p*q)*C,(y*s-p*t)*C);I.set((j*l-H*m)*C,(j*q-H*o)*C,(j*t-H*s)*C);L[D].addSelf(v);L[S].addSelf(v);L[x].addSelf(v);z[D].addSelf(I);z[S].addSelf(I);z[x].addSelf(I)}var b,c,d,e,f,g,i,h,k,n,m,l,o,q,s,t,j,H,p,y,C,L=[],z=[],v=new THREE.Vector3,I=new THREE.Vector3,E=new THREE.Vector3,K=new THREE.Vector3,J=new THREE.Vector3;b=0;for(c=this.vertices.length;b<c;b++){L[b]=new THREE.Vector3;z[b]=new THREE.Vector3}b=0;
+for(c=this.faces.length;b<c;b++){d=this.faces[b];e=this.uvs[b];if(d instanceof THREE.Face3){a(this,d.a,d.b,d.c,0,1,2);this.vertices[d.a].normal.copy(d.vertexNormals[0]);this.vertices[d.b].normal.copy(d.vertexNormals[1]);this.vertices[d.c].normal.copy(d.vertexNormals[2])}else if(d instanceof THREE.Face4){a(this,d.a,d.b,d.c,0,1,2);a(this,d.a,d.b,d.d,0,1,3);this.vertices[d.a].normal.copy(d.vertexNormals[0]);this.vertices[d.b].normal.copy(d.vertexNormals[1]);this.vertices[d.c].normal.copy(d.vertexNormals[2]);
+this.vertices[d.d].normal.copy(d.vertexNormals[3])}}b=0;for(c=this.vertices.length;b<c;b++){J.copy(this.vertices[b].normal);d=L[b];E.copy(d);E.subSelf(J.multiplyScalar(J.dot(d))).normalize();K.cross(this.vertices[b].normal,d);d=K.dot(z[b]);d=d<0?-1:1;this.vertices[b].tangent.set(E.x,E.y,E.z,d)}this.hasTangents=!0},computeBoundingBox:function(){var a;if(this.vertices.length>0){this.boundingBox={x:[this.vertices[0].position.x,this.vertices[0].position.x],y:[this.vertices[0].position.y,this.vertices[0].position.y],
+z:[this.vertices[0].position.z,this.vertices[0].position.z]};for(var b=1,c=this.vertices.length;b<c;b++){a=this.vertices[b];if(a.position.x<this.boundingBox.x[0])this.boundingBox.x[0]=a.position.x;else if(a.position.x>this.boundingBox.x[1])this.boundingBox.x[1]=a.position.x;if(a.position.y<this.boundingBox.y[0])this.boundingBox.y[0]=a.position.y;else if(a.position.y>this.boundingBox.y[1])this.boundingBox.y[1]=a.position.y;if(a.position.z<this.boundingBox.z[0])this.boundingBox.z[0]=a.position.z;else if(a.position.z>
+this.boundingBox.z[1])this.boundingBox.z[1]=a.position.z}}},computeBoundingSphere:function(){for(var a=this.boundingSphere===null?0:this.boundingSphere.radius,b=0,c=this.vertices.length;b<c;b++)a=Math.max(a,this.vertices[b].position.length());this.boundingSphere={radius:a}},sortFacesByMaterial:function(){function a(n){var m=[];b=0;for(c=n.length;b<c;b++)n[b]==undefined?m.push("undefined"):m.push(n[b].id);return m.join("_")}var b,c,d,e,f,g,i,h,k={};d=0;for(e=this.faces.length;d<e;d++){f=this.faces[d];
+g=f.materials;i=a(g);k[i]==undefined&&(k[i]={hash:i,counter:0});h=k[i].hash+"_"+k[i].counter;this.geometryChunks[h]==undefined&&(this.geometryChunks[h]={faces:[],materials:g,vertices:0});f=f instanceof THREE.Face3?3:4;if(this.geometryChunks[h].vertices+f>65535){k[i].counter+=1;h=k[i].hash+"_"+k[i].counter;this.geometryChunks[h]==undefined&&(this.geometryChunks[h]={faces:[],materials:g,vertices:0})}this.geometryChunks[h].faces.push(d);this.geometryChunks[h].vertices+=f}},toString:function(){return"THREE.Geometry ( vertices: "+
+this.vertices+", faces: "+this.faces+", uvs: "+this.uvs+" )"}};THREE.GeometryIdCounter=0;
+THREE.Camera=function(a,b,c,d,e){THREE.Object3D.call(this);this.fov=a||50;this.aspect=b||1;this.near=c||0.1;this.far=d||2E3;this.screenCenterY=this.screenCenterX=0;this.target=e||new THREE.Object3D;this.useTarget=!0;this.up=new THREE.Vector3(0,1,0);this.inverseMatrix=new THREE.Matrix4;this.projectionMatrix=null;this.tmpVec=new THREE.Vector3;this.translateX=function(f,g){this.tmpVec.sub(this.target.position,this.position).normalize().multiplyScalar(f);this.tmpVec.crossSelf(this.up);if(g)this.tmpVec.y=
+0;this.position.addSelf(this.tmpVec);this.target.position.addSelf(this.tmpVec)};this.translateZ=function(f,g){this.tmpVec.sub(this.target.position,this.position).normalize().multiplyScalar(f);if(g)this.tmpVec.y=0;this.position.subSelf(this.tmpVec);this.target.position.subSelf(this.tmpVec)};this.updateProjectionMatrix()};THREE.Camera.prototype=new THREE.Object3D;THREE.Camera.prototype.constructor=THREE.Camera;THREE.Camera.prototype.supr=THREE.Object3D.prototype;
+THREE.Camera.prototype.updateProjectionMatrix=function(){this.projectionMatrix=THREE.Matrix4.makePerspective(this.fov,this.aspect,this.near,this.far)};
+THREE.Camera.prototype.update=function(a,b,c){if(this.useTarget){this.matrix.lookAt(this.position,this.target.position,this.up);a?this.matrixWorld.multiply(a,this.matrix):this.matrixWorld.copy(this.matrix);THREE.Matrix4.makeInvert(this.matrixWorld,this.inverseMatrix);b=!0}else{this.matrixAutoUpdate&&(b|=this.updateMatrix());if(b||this.matrixNeedsUpdate){a?this.matrixWorld.multiply(a,this.matrix):this.matrixWorld.copy(this.matrix);this.matrixNeedsUpdate=!1;b=!0;THREE.Matrix4.makeInvert(this.matrixWorld,
+this.inverseMatrix)}}for(a=0;a<this.children.length;a++)this.children[a].update(this.matrixWorld,b,c)};
+THREE.Camera.prototype.frustumContains=function(a){var b=a.matrixWorld.n14,c=a.matrixWorld.n24,d=a.matrixWorld.n34,e=this.inverseMatrix,f=a.boundRadius*a.boundRadiusScale,g=e.n31*b+e.n32*c+e.n33*d+e.n34;if(g-f>-this.near)return!1;if(g+f<-this.far)return!1;g-=f;var i=this.projectionMatrix,h=1/(i.n43*g),k=h*this.screenCenterX,n=(e.n11*b+e.n12*c+e.n13*d+e.n14)*i.n11*k;f=i.n11*f*k;if(n+f<-this.screenCenterX)return!1;if(n-f>this.screenCenterX)return!1;b=(e.n21*b+e.n22*c+e.n23*d+e.n24)*i.n22*h*this.screenCenterY;
+if(b+f<-this.screenCenterY)return!1;if(b-f>this.screenCenterY)return!1;a.positionScreen.set(n,b,g,f);return!0};THREE.Light=function(a){THREE.Object3D.call(this);this.color=new THREE.Color(a)};THREE.Light.prototype=new THREE.Object3D;THREE.Light.prototype.constructor=THREE.Light;THREE.Light.prototype.supr=THREE.Object3D.prototype;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,b){THREE.Light.call(this,a);this.position=new THREE.Vector3(0,1,0);this.intensity=b||1};THREE.DirectionalLight.prototype=new THREE.Light;THREE.DirectionalLight.prototype.constructor=THREE.DirectionalLight;THREE.PointLight=function(a,b){THREE.Light.call(this,a);this.position=new THREE.Vector3;this.intensity=b||1};THREE.PointLight.prototype=new THREE.Light;THREE.PointLight.prototype.constructor=THREE.PointLight;THREE.FlatShading=0;THREE.SmoothShading=1;
+THREE.NormalBlending=0;THREE.AdditiveBlending=1;THREE.SubtractiveBlending=2;THREE.BillboardBlending=3;THREE.ReverseSubtractiveBlending=4;THREE.MaterialCounter={value:0};
+THREE.LineBasicMaterial=function(a){this.id=THREE.MaterialCounter.value++;this.color=new THREE.Color(16777215);this.opacity=1;this.blending=THREE.NormalBlending;this.depth_test=!0;this.linewidth=1;this.linejoin=this.linecap="round";this.vertex_colors=!1;if(a){a.color!==undefined&&this.color.setHex(a.color);if(a.opacity!==undefined)this.opacity=a.opacity;if(a.blending!==undefined)this.blending=a.blending;if(a.depth_test!==undefined)this.depth_test=a.depth_test;if(a.linewidth!==undefined)this.linewidth=
+a.linewidth;if(a.linecap!==undefined)this.linecap=a.linecap;if(a.linejoin!==undefined)this.linejoin=a.linejoin;if(a.vertex_colors!==undefined)this.vertex_colors=a.vertex_colors}};
+THREE.LineBasicMaterial.prototype={toString:function(){return"THREE.LineBasicMaterial (<br/>id: "+this.id+"<br/>color: "+this.color+"<br/>opacity: "+this.opacity+"<br/>blending: "+this.blending+"<br/>depth_test: "+this.depth_test+"<br/>linewidth: "+this.linewidth+"<br/>linecap: "+this.linecap+"<br/>linejoin: "+this.linejoin+"<br/>vertex_colors: "+this.vertex_colors+"<br/>)"}};
+THREE.MeshBasicMaterial=function(a){this.id=THREE.MaterialCounter.value++;this.color=new THREE.Color(16777215);this.opacity=1;this.env_map=this.light_map=this.map=null;this.combine=THREE.MultiplyOperation;this.reflectivity=1;this.refraction_ratio=0.98;this.fog=!0;this.shading=THREE.SmoothShading;this.blending=THREE.NormalBlending;this.depth_test=!0;this.wireframe=!1;this.wireframe_linewidth=1;this.wireframe_linejoin=this.wireframe_linecap="round";this.vertex_colors=!1;this.skinning=!1;if(a){a.color!==
+undefined&&this.color.setHex(a.color);if(a.opacity!==undefined)this.opacity=a.opacity;if(a.map!==undefined)this.map=a.map;if(a.light_map!==undefined)this.light_map=a.light_map;if(a.env_map!==undefined)this.env_map=a.env_map;if(a.combine!==undefined)this.combine=a.combine;if(a.reflectivity!==undefined)this.reflectivity=a.reflectivity;if(a.refraction_ratio!==undefined)this.refraction_ratio=a.refraction_ratio;if(a.fog!==undefined)this.fog=a.fog;if(a.shading!==undefined)this.shading=a.shading;if(a.blending!==
+undefined)this.blending=a.blending;if(a.depth_test!==undefined)this.depth_test=a.depth_test;if(a.wireframe!==undefined)this.wireframe=a.wireframe;if(a.wireframe_linewidth!==undefined)this.wireframe_linewidth=a.wireframe_linewidth;if(a.wireframe_linecap!==undefined)this.wireframe_linecap=a.wireframe_linecap;if(a.wireframe_linejoin!==undefined)this.wireframe_linejoin=a.wireframe_linejoin;if(a.vertex_colors!==undefined)this.vertex_colors=a.vertex_colors;if(a.skinning!==undefined)this.skinning=a.skinning}};
+THREE.MeshBasicMaterial.prototype={toString:function(){return"THREE.MeshBasicMaterial (<br/>id: "+this.id+"<br/>color: "+this.color+"<br/>opacity: "+this.opacity+"<br/>map: "+this.map+"<br/>light_map: "+this.light_map+"<br/>env_map: "+this.env_map+"<br/>combine: "+this.combine+"<br/>reflectivity: "+this.reflectivity+"<br/>refraction_ratio: "+this.refraction_ratio+"<br/>blending: "+this.blending+"<br/>depth_test: "+this.depth_test+"<br/>wireframe: "+this.wireframe+"<br/>wireframe_linewidth: "+this.wireframe_linewidth+
+"<br/>wireframe_linecap: "+this.wireframe_linecap+"<br/>wireframe_linejoin: "+this.wireframe_linejoin+"<br/>vertex_colors: "+this.vertex_colors+"<br/>skinning: "+this.skinning+"<br/>)"}};
+THREE.MeshLambertMaterial=function(a){this.id=THREE.MaterialCounter.value++;this.color=new THREE.Color(16777215);this.opacity=1;this.env_map=this.light_map=this.map=null;this.combine=THREE.MultiplyOperation;this.reflectivity=1;this.refraction_ratio=0.98;this.fog=!0;this.shading=THREE.SmoothShading;this.blending=THREE.NormalBlending;this.depth_test=!0;this.wireframe=!1;this.wireframe_linewidth=1;this.wireframe_linejoin=this.wireframe_linecap="round";this.vertex_colors=!1;this.skinning=!1;if(a){a.color!==
+undefined&&this.color.setHex(a.color);if(a.opacity!==undefined)this.opacity=a.opacity;if(a.map!==undefined)this.map=a.map;if(a.light_map!==undefined)this.light_map=a.light_map;if(a.env_map!==undefined)this.env_map=a.env_map;if(a.combine!==undefined)this.combine=a.combine;if(a.reflectivity!==undefined)this.reflectivity=a.reflectivity;if(a.refraction_ratio!==undefined)this.refraction_ratio=a.refraction_ratio;if(a.fog!==undefined)this.fog=a.fog;if(a.shading!==undefined)this.shading=a.shading;if(a.blending!==
+undefined)this.blending=a.blending;if(a.depth_test!==undefined)this.depth_test=a.depth_test;if(a.wireframe!==undefined)this.wireframe=a.wireframe;if(a.wireframe_linewidth!==undefined)this.wireframe_linewidth=a.wireframe_linewidth;if(a.wireframe_linecap!==undefined)this.wireframe_linecap=a.wireframe_linecap;if(a.wireframe_linejoin!==undefined)this.wireframe_linejoin=a.wireframe_linejoin;if(a.vertex_colors!==undefined)this.vertex_colors=a.vertex_colors;if(a.skinning!==undefined)this.skinning=a.skinning}};
+THREE.MeshLambertMaterial.prototype={toString:function(){return"THREE.MeshLambertMaterial (<br/>id: "+this.id+"<br/>color: "+this.color+"<br/>opacity: "+this.opacity+"<br/>map: "+this.map+"<br/>light_map: "+this.light_map+"<br/>env_map: "+this.env_map+"<br/>combine: "+this.combine+"<br/>reflectivity: "+this.reflectivity+"<br/>refraction_ratio: "+this.refraction_ratio+"<br/>shading: "+this.shading+"<br/>blending: "+this.blending+"<br/>depth_test: "+this.depth_test+"<br/>wireframe: "+this.wireframe+
+"<br/>wireframe_linewidth: "+this.wireframe_linewidth+"<br/>wireframe_linecap: "+this.wireframe_linecap+"<br/>wireframe_linejoin: "+this.wireframe_linejoin+"<br/>vertex_colors: "+this.vertex_colors+"<br/>skinning: "+this.skinning+"<br/> )"}};
+THREE.MeshPhongMaterial=function(a){this.id=THREE.MaterialCounter.value++;this.color=new THREE.Color(16777215);this.ambient=new THREE.Color(328965);this.specular=new THREE.Color(1118481);this.shininess=30;this.opacity=1;this.env_map=this.light_map=this.map=null;this.combine=THREE.MultiplyOperation;this.reflectivity=1;this.refraction_ratio=0.98;this.fog=!0;this.shading=THREE.SmoothShading;this.blending=THREE.NormalBlending;this.depth_test=!0;this.wireframe=!1;this.wireframe_linewidth=1;this.wireframe_linejoin=
+this.wireframe_linecap="round";this.vertex_colors=!1;this.skinning=!1;if(a){if(a.color!==undefined)this.color=new THREE.Color(a.color);if(a.ambient!==undefined)this.ambient=new THREE.Color(a.ambient);if(a.specular!==undefined)this.specular=new THREE.Color(a.specular);if(a.shininess!==undefined)this.shininess=a.shininess;if(a.opacity!==undefined)this.opacity=a.opacity;if(a.light_map!==undefined)this.light_map=a.light_map;if(a.map!==undefined)this.map=a.map;if(a.env_map!==undefined)this.env_map=a.env_map;
+if(a.combine!==undefined)this.combine=a.combine;if(a.reflectivity!==undefined)this.reflectivity=a.reflectivity;if(a.refraction_ratio!==undefined)this.refraction_ratio=a.refraction_ratio;if(a.fog!==undefined)this.fog=a.fog;if(a.shading!==undefined)this.shading=a.shading;if(a.blending!==undefined)this.blending=a.blending;if(a.depth_test!==undefined)this.depth_test=a.depth_test;if(a.wireframe!==undefined)this.wireframe=a.wireframe;if(a.wireframe_linewidth!==undefined)this.wireframe_linewidth=a.wireframe_linewidth;
+if(a.wireframe_linecap!==undefined)this.wireframe_linecap=a.wireframe_linecap;if(a.wireframe_linejoin!==undefined)this.wireframe_linejoin=a.wireframe_linejoin;if(a.vertex_colors!==undefined)this.vertex_colors=a.vertex_colors;if(a.skinning!==undefined)this.skinning=a.skinning}};
+THREE.MeshPhongMaterial.prototype={toString:function(){return"THREE.MeshPhongMaterial (<br/>id: "+this.id+"<br/>color: "+this.color+"<br/>ambient: "+this.ambient+"<br/>specular: "+this.specular+"<br/>shininess: "+this.shininess+"<br/>opacity: "+this.opacity+"<br/>map: "+this.map+"<br/>env_map: "+this.env_map+"<br/>combine: "+this.combine+"<br/>reflectivity: "+this.reflectivity+"<br/>refraction_ratio: "+this.refraction_ratio+"<br/>shading: "+this.shading+"<br/>blending: "+this.blending+"<br/>depth_test: "+
+this.depth_test+"<br/>wireframe: "+this.wireframe+"<br/>wireframe_linewidth: "+this.wireframe_linewidth+"<br/>wireframe_linecap: "+this.wireframe_linecap+"<br/>wireframe_linejoin: "+this.wireframe_linejoin+"<br/>vertex_colors: "+this.vertex_colors+"<br/>skinning: "+this.skinning+"<br/>)"}};
+THREE.MeshDepthMaterial=function(a){this.id=THREE.MaterialCounter.value++;this.opacity=1;this.shading=THREE.SmoothShading;this.blending=THREE.NormalBlending;this.depth_test=!0;this.wireframe=!1;this.wireframe_linewidth=1;if(a){if(a.opacity!==undefined)this.opacity=a.opacity;if(a.shading!==undefined)this.shading=a.shading;if(a.blending!==undefined)this.blending=a.blending;if(a.depth_test!==undefined)this.depth_test=a.depth_test;if(a.wireframe!==undefined)this.wireframe=a.wireframe;if(a.wireframe_linewidth!==
+undefined)this.wireframe_linewidth=a.wireframe_linewidth}};THREE.MeshDepthMaterial.prototype={toString:function(){return"THREE.MeshDepthMaterial (<br/>id: "+this.id+"<br/>opacity: "+this.opacity+"<br/>blending: "+this.blending+"<br/>depth_test: "+this.depth_test+"<br/>wireframe: "+this.wireframe+"<br/>wireframe_linewidth: "+this.wireframe_linewidth+"<br/>)"}};
+THREE.MeshNormalMaterial=function(a){this.id=THREE.MaterialCounter.value++;this.opacity=1;this.shading=THREE.FlatShading;this.blending=THREE.NormalBlending;this.depth_test=!0;this.wireframe=!1;this.wireframe_linewidth=1;if(a){if(a.opacity!==undefined)this.opacity=a.opacity;if(a.shading!==undefined)this.shading=a.shading;if(a.blending!==undefined)this.blending=a.blending;if(a.depth_test!==undefined)this.depth_test=a.depth_test;if(a.wireframe!==undefined)this.wireframe=a.wireframe;if(a.wireframe_linewidth!==
+undefined)this.wireframe_linewidth=a.wireframe_linewidth}};THREE.MeshNormalMaterial.prototype={toString:function(){return"THREE.MeshNormalMaterial (<br/>id: "+this.id+"<br/>opacity: "+this.opacity+"<br/>blending: "+this.blending+"<br/>depth_test: "+this.depth_test+"<br/>wireframe: "+this.wireframe+"<br/>wireframe_linewidth: "+this.wireframe_linewidth+"<br/>)"}};THREE.MeshFaceMaterial=function(){};THREE.MeshFaceMaterial.prototype={toString:function(){return"THREE.MeshFaceMaterial"}};
+THREE.ParticleBasicMaterial=function(a){this.id=THREE.MaterialCounter.value++;this.color=new THREE.Color(16777215);this.opacity=1;this.map=null;this.size=1;this.blending=THREE.NormalBlending;this.depth_test=!0;this.offset=new THREE.Vector2;this.vertex_colors=!1;if(a){a.color!==undefined&&this.color.setHex(a.color);if(a.opacity!==undefined)this.opacity=a.opacity;if(a.map!==undefined)this.map=a.map;if(a.size!==undefined)this.size=a.size;if(a.blending!==undefined)this.blending=a.blending;if(a.depth_test!==
+undefined)this.depth_test=a.depth_test;if(a.vertex_colors!==undefined)this.vertex_colors=a.vertex_colors}};THREE.ParticleBasicMaterial.prototype={toString:function(){return"THREE.ParticleBasicMaterial (<br/>id: "+this.id+"<br/>color: "+this.color+"<br/>opacity: "+this.opacity+"<br/>map: "+this.map+"<br/>size: "+this.size+"<br/>blending: "+this.blending+"<br/>depth_test: "+this.depth_test+"<br/>vertex_colors: "+this.vertex_colors+"<br/>)"}};
+THREE.ParticleCircleMaterial=function(a){this.id=THREE.MaterialCounter.value++;this.color=new THREE.Color(16777215);this.opacity=1;this.blending=THREE.NormalBlending;if(a){a.color!==undefined&&this.color.setHex(a.color);if(a.opacity!==undefined)this.opacity=a.opacity;if(a.blending!==undefined)this.blending=a.blending}};
+THREE.ParticleCircleMaterial.prototype={toString:function(){return"THREE.ParticleCircleMaterial (<br/>color: "+this.color+"<br/>opacity: "+this.opacity+"<br/>blending: "+this.blending+"<br/>)"}};THREE.Particle=function(a){THREE.Object3D.call(this);this.materials=a instanceof Array?a:[a];this.matrixAutoUpdate=!1};THREE.Particle.prototype=new THREE.Object3D;THREE.Particle.prototype.constructor=THREE.Particle;
+THREE.Line=function(a,b,c){THREE.Object3D.call(this);this.geometry=a;this.materials=b instanceof Array?b:[b];this.type=c!=undefined?c:THREE.LineStrip};THREE.LineStrip=0;THREE.LinePieces=1;THREE.Line.prototype=new THREE.Object3D;THREE.Line.prototype.constructor=THREE.Line;
+THREE.Mesh=function(a,b){THREE.Object3D.call(this);this.geometry=a;this.materials=b&&b.length?b:[b];this.flipSided=!1;this.doubleSided=!1;this.overdraw=!1;if(this.geometry){this.geometry.boundingSphere||this.geometry.computeBoundingSphere();this.boundRadius=a.boundingSphere.radius}};THREE.Mesh.prototype=new THREE.Object3D;THREE.Mesh.prototype.constructor=THREE.Mesh;THREE.Mesh.prototype.supr=THREE.Object3D.prototype;
+THREE.Scene=function(){THREE.Object3D.call(this);this.objects=[];this.lights=[];this.sounds=[];this.fog=null;this.matrixAutoUpdate=!1};THREE.Scene.prototype=new THREE.Object3D;THREE.Scene.prototype.constructor=THREE.Scene;THREE.Scene.prototype.supr=THREE.Object3D.prototype;THREE.Scene.prototype.addChild=function(a){this.supr.addChild.call(this,a);this.addChildRecurse(a)};
+THREE.Scene.prototype.addChildRecurse=function(a){if(a instanceof THREE.Light)this.lights.indexOf(a)===-1&&this.lights.push(a);else if(a instanceof THREE.Sound)this.sounds.indexOf(a)===-1&&this.sounds.push(a);else a instanceof THREE.Camera||a instanceof THREE.Bone||this.objects.indexOf(a)===-1&&this.objects.push(a);for(var b=0;b<a.children.length;b++)this.addChildRecurse(a.children[b])};THREE.Scene.prototype.removeChild=function(a){this.supr.removeChild.call(this,a);this.removeChildRecurse(a)};
+THREE.Scene.prototype.removeChildRecurse=function(a){if(a instanceof THREE.Light){var b=this.lights.indexOf(a);b!==-1&&this.lights.splice(b,1)}else if(a instanceof THREE.Sound){b=this.sounds.indexOf(a);b!==-1&&this.sounds.splice(b,1)}else if(!(a instanceof THREE.Camera)){b=this.objects.indexOf(a);b!==-1&&this.objects.splice(b,1)}for(b=0;b<a.children.length;b++)this.removeChildRecurse(a.children[b])};THREE.Scene.prototype.addObject=THREE.Scene.prototype.addChild;
+THREE.Scene.prototype.removeObject=THREE.Scene.prototype.removeChild;THREE.Scene.prototype.addLight=THREE.Scene.prototype.addChild;THREE.Scene.prototype.removeLight=THREE.Scene.prototype.removeChild;
+THREE.Projector=function(){function a(z,v){return v.z-z.z}function b(z,v){var I=0,E=1,K=z.z+z.w,J=v.z+v.w,u=-z.z+z.w,D=-v.z+v.w;if(K>=0&&J>=0&&u>=0&&D>=0)return!0;else if(K<0&&J<0||u<0&&D<0)return!1;else{if(K<0)I=Math.max(I,K/(K-J));else J<0&&(E=Math.min(E,K/(K-J)));if(u<0)I=Math.max(I,u/(u-D));else D<0&&(E=Math.min(E,u/(u-D)));if(E<I)return!1;else{z.lerpSelf(v,I);v.lerpSelf(z,1-E);return!0}}}var c,d,e=[],f,g,i,h=[],k,n,m=[],l,o,q=[],s=new THREE.Vector4,t=new THREE.Vector4,j=new THREE.Matrix4,H=new THREE.Matrix4,
+p=[new THREE.Vector4,new THREE.Vector4,new THREE.Vector4,new THREE.Vector4,new THREE.Vector4,new THREE.Vector4],y=new THREE.Vector4,C=new THREE.Vector4,L;this.projectObjects=function(z,v,I){v=[];var E,K,J;d=0;K=z.objects;z=0;for(E=K.length;z<E;z++){J=K[z];var u;if(!(u=!J.visible))if(u=J instanceof THREE.Mesh){a:{u=void 0;for(var D=J.matrixWorld,S=-J.geometry.boundingSphere.radius*Math.max(J.scale.x,Math.max(J.scale.y,J.scale.z)),x=0;x<6;x++){u=p[x].x*D.n14+p[x].y*D.n24+p[x].z*D.n34+p[x].w;if(u<=S){u=
+!1;break a}}u=!0}u=!u}if(!u){c=e[d]=e[d]||new THREE.RenderableObject;s.copy(J.position);j.multiplyVector3(s);c.object=J;c.z=s.z;v.push(c);d++}}I&&v.sort(a);return v};this.projectScene=function(z,v,I){var E=[],K=v.near,J=v.far,u,D,S,x,N,F,A,O,Q,B,w,M,P,r,G,R;i=n=o=0;v.matrixAutoUpdate&&v.update();j.multiply(v.projectionMatrix,v.matrixWorld);p[0].set(j.n41-j.n11,j.n42-j.n12,j.n43-j.n13,j.n44-j.n14);p[1].set(j.n41+j.n11,j.n42+j.n12,j.n43+j.n13,j.n44+j.n14);p[2].set(j.n41+j.n21,j.n42+j.n22,j.n43+j.n23,
+j.n44+j.n24);p[3].set(j.n41-j.n21,j.n42-j.n22,j.n43-j.n23,j.n44-j.n24);p[4].set(j.n41-j.n31,j.n42-j.n32,j.n43-j.n33,j.n44-j.n34);p[5].set(j.n41+j.n31,j.n42+j.n32,j.n43+j.n33,j.n44+j.n34);for(u=0;u<6;u++){F=p[u];F.divideScalar(Math.sqrt(F.x*F.x+F.y*F.y+F.z*F.z))}z.update(undefined,!1,v);F=this.projectObjects(z,v,!0);z=0;for(u=F.length;z<u;z++){A=F[z].object;if(A.visible){A.matrixAutoUpdate&&A.updateMatrix();O=A.matrixWorld;w=A.matrixRotation;Q=A.materials;B=A.overdraw;if(A instanceof THREE.Mesh){M=
+A.geometry;P=M.vertices;D=0;for(S=P.length;D<S;D++){r=P[D];r.positionWorld.copy(r.position);O.multiplyVector3(r.positionWorld);x=r.positionScreen;x.copy(r.positionWorld);j.multiplyVector4(x);x.x/=x.w;x.y/=x.w;r.__visible=x.z>K&&x.z<J}M=M.faces;D=0;for(S=M.length;D<S;D++){r=M[D];if(r instanceof THREE.Face3){x=P[r.a];N=P[r.b];G=P[r.c];if(x.__visible&&N.__visible&&G.__visible&&(A.doubleSided||A.flipSided!=(G.positionScreen.x-x.positionScreen.x)*(N.positionScreen.y-x.positionScreen.y)-(G.positionScreen.y-
+x.positionScreen.y)*(N.positionScreen.x-x.positionScreen.x)<0)){f=h[i]=h[i]||new THREE.RenderableFace3;f.v1.positionWorld.copy(x.positionWorld);f.v2.positionWorld.copy(N.positionWorld);f.v3.positionWorld.copy(G.positionWorld);f.v1.positionScreen.copy(x.positionScreen);f.v2.positionScreen.copy(N.positionScreen);f.v3.positionScreen.copy(G.positionScreen);f.normalWorld.copy(r.normal);w.multiplyVector3(f.normalWorld);f.centroidWorld.copy(r.centroid);O.multiplyVector3(f.centroidWorld);f.centroidScreen.copy(f.centroidWorld);
+j.multiplyVector3(f.centroidScreen);G=r.vertexNormals;L=f.vertexNormalsWorld;x=0;for(N=G.length;x<N;x++){R=L[x]=L[x]||new THREE.Vector3;R.copy(G[x]);w.multiplyVector3(R)}f.z=f.centroidScreen.z;f.meshMaterials=Q;f.faceMaterials=r.materials;f.overdraw=B;if(A.geometry.uvs[D]){f.uvs[0]=A.geometry.uvs[D][0];f.uvs[1]=A.geometry.uvs[D][1];f.uvs[2]=A.geometry.uvs[D][2]}E.push(f);i++}}else if(r instanceof THREE.Face4){x=P[r.a];N=P[r.b];G=P[r.c];R=P[r.d];if(x.__visible&&N.__visible&&G.__visible&&R.__visible&&
+(A.doubleSided||A.flipSided!=((R.positionScreen.x-x.positionScreen.x)*(N.positionScreen.y-x.positionScreen.y)-(R.positionScreen.y-x.positionScreen.y)*(N.positionScreen.x-x.positionScreen.x)<0||(N.positionScreen.x-G.positionScreen.x)*(R.positionScreen.y-G.positionScreen.y)-(N.positionScreen.y-G.positionScreen.y)*(R.positionScreen.x-G.positionScreen.x)<0))){f=h[i]=h[i]||new THREE.RenderableFace3;f.v1.positionWorld.copy(x.positionWorld);f.v2.positionWorld.copy(N.positionWorld);f.v3.positionWorld.copy(R.positionWorld);
+f.v1.positionScreen.copy(x.positionScreen);f.v2.positionScreen.copy(N.positionScreen);f.v3.positionScreen.copy(R.positionScreen);f.normalWorld.copy(r.normal);w.multiplyVector3(f.normalWorld);f.centroidWorld.copy(r.centroid);O.multiplyVector3(f.centroidWorld);f.centroidScreen.copy(f.centroidWorld);j.multiplyVector3(f.centroidScreen);f.z=f.centroidScreen.z;f.meshMaterials=Q;f.faceMaterials=r.materials;f.overdraw=B;if(A.geometry.uvs[D]){f.uvs[0]=A.geometry.uvs[D][0];f.uvs[1]=A.geometry.uvs[D][1];f.uvs[2]=
+A.geometry.uvs[D][3]}E.push(f);i++;g=h[i]=h[i]||new THREE.RenderableFace3;g.v1.positionWorld.copy(N.positionWorld);g.v2.positionWorld.copy(G.positionWorld);g.v3.positionWorld.copy(R.positionWorld);g.v1.positionScreen.copy(N.positionScreen);g.v2.positionScreen.copy(G.positionScreen);g.v3.positionScreen.copy(R.positionScreen);g.normalWorld.copy(f.normalWorld);g.centroidWorld.copy(f.centroidWorld);g.centroidScreen.copy(f.centroidScreen);g.z=g.centroidScreen.z;g.meshMaterials=Q;g.faceMaterials=r.materials;
+g.overdraw=B;if(A.geometry.uvs[D]){g.uvs[0]=A.geometry.uvs[D][1];g.uvs[1]=A.geometry.uvs[D][2];g.uvs[2]=A.geometry.uvs[D][3]}E.push(g);i++}}}}else if(A instanceof THREE.Line){H.multiply(j,O);P=A.geometry.vertices;r=P[0];r.positionScreen.copy(r.position);H.multiplyVector4(r.positionScreen);D=1;for(S=P.length;D<S;D++){x=P[D];x.positionScreen.copy(x.position);H.multiplyVector4(x.positionScreen);N=P[D-1];y.copy(x.positionScreen);C.copy(N.positionScreen);if(b(y,C)){y.multiplyScalar(1/y.w);C.multiplyScalar(1/
+C.w);k=m[n]=m[n]||new THREE.RenderableLine;k.v1.positionScreen.copy(y);k.v2.positionScreen.copy(C);k.z=Math.max(y.z,C.z);k.materials=A.materials;E.push(k);n++}}}else if(A instanceof THREE.Particle){t.set(A.position.x,A.position.y,A.position.z,1);j.multiplyVector4(t);t.z/=t.w;if(t.z>0&&t.z<1){l=q[o]=q[o]||new THREE.RenderableParticle;l.x=t.x/t.w;l.y=t.y/t.w;l.z=t.z;l.rotation=A.rotation.z;l.scale.x=A.scale.x*Math.abs(l.x-(t.x+v.projectionMatrix.n11)/(t.w+v.projectionMatrix.n14));l.scale.y=A.scale.y*
+Math.abs(l.y-(t.y+v.projectionMatrix.n22)/(t.w+v.projectionMatrix.n24));l.materials=A.materials;E.push(l);o++}}}}I&&E.sort(a);return E};this.unprojectVector=function(z,v){var I=THREE.Matrix4.makeInvert(v.matrixWorld);I.multiplySelf(THREE.Matrix4.makeInvert(v.projectionMatrix));I.multiplyVector3(z);return z}};
+THREE.SVGRenderer=function(){function a(F,A,O){var Q,B,w,M;Q=0;for(B=F.lights.length;Q<B;Q++){w=F.lights[Q];if(w instanceof THREE.DirectionalLight){M=A.normalWorld.dot(w.position)*w.intensity;if(M>0){O.r+=w.color.r*M;O.g+=w.color.g*M;O.b+=w.color.b*M}}else if(w instanceof THREE.PointLight){I.sub(w.position,A.centroidWorld);I.normalize();M=A.normalWorld.dot(I)*w.intensity;if(M>0){O.r+=w.color.r*M;O.g+=w.color.g*M;O.b+=w.color.b*M}}}}function b(F,A,O,Q,B,w){u=d(D++);u.setAttribute("d","M "+F.positionScreen.x+
+" "+F.positionScreen.y+" L "+A.positionScreen.x+" "+A.positionScreen.y+" L "+O.positionScreen.x+","+O.positionScreen.y+"z");if(B instanceof THREE.MeshBasicMaterial)p.__styleString=B.color.__styleString;else if(B instanceof THREE.MeshLambertMaterial)if(H){y.r=C.r;y.g=C.g;y.b=C.b;a(w,Q,y);p.r=B.color.r*y.r;p.g=B.color.g*y.g;p.b=B.color.b*y.b;p.updateStyleString()}else p.__styleString=B.color.__styleString;else if(B instanceof THREE.MeshDepthMaterial){v=1-B.__2near/(B.__farPlusNear-Q.z*B.__farMinusNear);
+p.setRGB(v,v,v)}else B instanceof THREE.MeshNormalMaterial&&p.setRGB(e(Q.normalWorld.x),e(Q.normalWorld.y),e(Q.normalWorld.z));B.wireframe?u.setAttribute("style","fill: none; stroke: "+p.__styleString+"; stroke-width: "+B.wireframe_linewidth+"; stroke-opacity: "+B.opacity+"; stroke-linecap: "+B.wireframe_linecap+"; stroke-linejoin: "+B.wireframe_linejoin):u.setAttribute("style","fill: "+p.__styleString+"; fill-opacity: "+B.opacity);i.appendChild(u)}function c(F,A,O,Q,B,w,M){u=d(D++);u.setAttribute("d",
+"M "+F.positionScreen.x+" "+F.positionScreen.y+" L "+A.positionScreen.x+" "+A.positionScreen.y+" L "+O.positionScreen.x+","+O.positionScreen.y+" L "+Q.positionScreen.x+","+Q.positionScreen.y+"z");if(w instanceof THREE.MeshBasicMaterial)p.__styleString=w.color.__styleString;else if(w instanceof THREE.MeshLambertMaterial)if(H){y.r=C.r;y.g=C.g;y.b=C.b;a(M,B,y);p.r=w.color.r*y.r;p.g=w.color.g*y.g;p.b=w.color.b*y.b;p.updateStyleString()}else p.__styleString=w.color.__styleString;else if(w instanceof THREE.MeshDepthMaterial){v=
+1-w.__2near/(w.__farPlusNear-B.z*w.__farMinusNear);p.setRGB(v,v,v)}else w instanceof THREE.MeshNormalMaterial&&p.setRGB(e(B.normalWorld.x),e(B.normalWorld.y),e(B.normalWorld.z));w.wireframe?u.setAttribute("style","fill: none; stroke: "+p.__styleString+"; stroke-width: "+w.wireframe_linewidth+"; stroke-opacity: "+w.opacity+"; stroke-linecap: "+w.wireframe_linecap+"; stroke-linejoin: "+w.wireframe_linejoin):u.setAttribute("style","fill: "+p.__styleString+"; fill-opacity: "+w.opacity);i.appendChild(u)}
+function d(F){if(E[F]==null){E[F]=document.createElementNS("http://www.w3.org/2000/svg","path");N==0&&E[F].setAttribute("shape-rendering","crispEdges")}return E[F]}function e(F){return F<0?Math.min((1+F)*0.5,0.5):0.5+Math.min(F*0.5,0.5)}var f=null,g=new THREE.Projector,i=document.createElementNS("http://www.w3.org/2000/svg","svg"),h,k,n,m,l,o,q,s,t=new THREE.Rectangle,j=new THREE.Rectangle,H=!1,p=new THREE.Color(16777215),y=new THREE.Color(16777215),C=new THREE.Color(0),L=new THREE.Color(0),z=new THREE.Color(0),
+v,I=new THREE.Vector3,E=[],K=[],J=[],u,D,S,x,N=1;this.domElement=i;this.autoClear=!0;this.sortObjects=!0;this.sortElements=!0;this.setQuality=function(F){switch(F){case "high":N=1;break;case "low":N=0}};this.setSize=function(F,A){h=F;k=A;n=h/2;m=k/2;i.setAttribute("viewBox",-n+" "+-m+" "+h+" "+k);i.setAttribute("width",h);i.setAttribute("height",k);t.set(-n,-m,n,m)};this.clear=function(){for(;i.childNodes.length>0;)i.removeChild(i.childNodes[0])};this.render=function(F,A){var O,Q,B,w,M,P,r,G;this.autoClear&&
+this.clear();f=g.projectScene(F,A,this.sortElements);x=S=D=0;if(H=F.lights.length>0){r=F.lights;C.setRGB(0,0,0);L.setRGB(0,0,0);z.setRGB(0,0,0);O=0;for(Q=r.length;O<Q;O++){B=r[O];w=B.color;if(B instanceof THREE.AmbientLight){C.r+=w.r;C.g+=w.g;C.b+=w.b}else if(B instanceof THREE.DirectionalLight){L.r+=w.r;L.g+=w.g;L.b+=w.b}else if(B instanceof THREE.PointLight){z.r+=w.r;z.g+=w.g;z.b+=w.b}}}O=0;for(Q=f.length;O<Q;O++){r=f[O];j.empty();if(r instanceof THREE.RenderableParticle){l=r;l.x*=n;l.y*=-m;B=0;
+for(w=r.materials.length;B<w;B++)if(G=r.materials[B]){M=l;P=r;var R=S++;if(K[R]==null){K[R]=document.createElementNS("http://www.w3.org/2000/svg","circle");N==0&&K[R].setAttribute("shape-rendering","crispEdges")}u=K[R];u.setAttribute("cx",M.x);u.setAttribute("cy",M.y);u.setAttribute("r",P.scale.x*n);if(G instanceof THREE.ParticleCircleMaterial){if(H){y.r=C.r+L.r+z.r;y.g=C.g+L.g+z.g;y.b=C.b+L.b+z.b;p.r=G.color.r*y.r;p.g=G.color.g*y.g;p.b=G.color.b*y.b;p.updateStyleString()}else p=G.color;u.setAttribute("style",
+"fill: "+p.__styleString)}i.appendChild(u)}}else if(r instanceof THREE.RenderableLine){l=r.v1;o=r.v2;l.positionScreen.x*=n;l.positionScreen.y*=-m;o.positionScreen.x*=n;o.positionScreen.y*=-m;j.addPoint(l.positionScreen.x,l.positionScreen.y);j.addPoint(o.positionScreen.x,o.positionScreen.y);if(t.instersects(j)){B=0;for(w=r.materials.length;B<w;)if(G=r.materials[B++]){M=l;P=o;R=x++;if(J[R]==null){J[R]=document.createElementNS("http://www.w3.org/2000/svg","line");N==0&&J[R].setAttribute("shape-rendering",
+"crispEdges")}u=J[R];u.setAttribute("x1",M.positionScreen.x);u.setAttribute("y1",M.positionScreen.y);u.setAttribute("x2",P.positionScreen.x);u.setAttribute("y2",P.positionScreen.y);if(G instanceof THREE.LineBasicMaterial){p.__styleString=G.color.__styleString;u.setAttribute("style","fill: none; stroke: "+p.__styleString+"; stroke-width: "+G.linewidth+"; stroke-opacity: "+G.opacity+"; stroke-linecap: "+G.linecap+"; stroke-linejoin: "+G.linejoin);i.appendChild(u)}}}}else if(r instanceof THREE.RenderableFace3){l=
+r.v1;o=r.v2;q=r.v3;l.positionScreen.x*=n;l.positionScreen.y*=-m;o.positionScreen.x*=n;o.positionScreen.y*=-m;q.positionScreen.x*=n;q.positionScreen.y*=-m;j.addPoint(l.positionScreen.x,l.positionScreen.y);j.addPoint(o.positionScreen.x,o.positionScreen.y);j.addPoint(q.positionScreen.x,q.positionScreen.y);if(t.instersects(j)){B=0;for(w=r.meshMaterials.length;B<w;){G=r.meshMaterials[B++];if(G instanceof THREE.MeshFaceMaterial){M=0;for(P=r.faceMaterials.length;M<P;)(G=r.faceMaterials[M++])&&b(l,o,q,r,
+G,F)}else G&&b(l,o,q,r,G,F)}}}else if(r instanceof THREE.RenderableFace4){l=r.v1;o=r.v2;q=r.v3;s=r.v4;l.positionScreen.x*=n;l.positionScreen.y*=-m;o.positionScreen.x*=n;o.positionScreen.y*=-m;q.positionScreen.x*=n;q.positionScreen.y*=-m;s.positionScreen.x*=n;s.positionScreen.y*=-m;j.addPoint(l.positionScreen.x,l.positionScreen.y);j.addPoint(o.positionScreen.x,o.positionScreen.y);j.addPoint(q.positionScreen.x,q.positionScreen.y);j.addPoint(s.positionScreen.x,s.positionScreen.y);if(t.instersects(j)){B=
+0;for(w=r.meshMaterials.length;B<w;){G=r.meshMaterials[B++];if(G instanceof THREE.MeshFaceMaterial){M=0;for(P=r.faceMaterials.length;M<P;)(G=r.faceMaterials[M++])&&c(l,o,q,s,r,G,F)}else G&&c(l,o,q,s,r,G,F)}}}}}};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=!1;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};

+ 200 - 0
build/custom/ThreeWebGL.js

@@ -0,0 +1,200 @@
+// ThreeWebGL.js r33 - http://github.com/mrdoob/three.js
+var THREE=THREE||{};THREE.Color=function(a){this.setHex(a)};
+THREE.Color.prototype={autoUpdate:!0,setRGB:function(a,c,d){this.r=a;this.g=c;this.b=d;if(this.autoUpdate){this.updateHex();this.updateStyleString()}},setHSV:function(a,c,d){var f,g,j,k,o,i;if(d==0)f=g=j=0;else{k=Math.floor(a*6);o=a*6-k;a=d*(1-c);i=d*(1-c*o);c=d*(1-c*(1-o));switch(k){case 1:f=i;g=d;j=a;break;case 2:f=a;g=d;j=c;break;case 3:f=a;g=i;j=d;break;case 4:f=c;g=a;j=d;break;case 5:f=d;g=a;j=i;break;case 6:case 0:f=d;g=c;j=a}}this.r=f;this.g=g;this.b=j;if(this.autoUpdate){this.updateHex();
+this.updateStyleString()}},setHex:function(a){this.hex=~~a&16777215;if(this.autoUpdate){this.updateRGBA();this.updateStyleString()}},updateHex:function(){this.hex=~~(this.r*255)<<16^~~(this.g*255)<<8^~~(this.b*255)},updateRGBA:function(){this.r=(this.hex>>16&255)/255;this.g=(this.hex>>8&255)/255;this.b=(this.hex&255)/255},updateStyleString:function(){this.__styleString="rgb("+~~(this.r*255)+","+~~(this.g*255)+","+~~(this.b*255)+")"},clone:function(){return new THREE.Color(this.hex)},toString:function(){return"THREE.Color ( r: "+
+this.r+", g: "+this.g+", b: "+this.b+", hex: "+this.hex+" )"}};THREE.Vector2=function(a,c){this.set(a||0,c||0)};
+THREE.Vector2.prototype={set:function(a,c){this.x=a;this.y=c;return this},copy:function(a){this.set(a.x,a.y);return this},addSelf:function(a){this.set(this.x+a.x,this.y+a.y);return this},add:function(a,c){this.set(a.x+c.x,a.y+c.y);return this},subSelf:function(a){this.set(this.x-a.x,this.y-a.y);return this},sub:function(a,c){this.set(a.x-c.x,a.y-c.y);return this},multiplyScalar:function(a){this.set(this.x*a,this.y*a);return this},negate:function(){this.set(-this.x,-this.y);return this},unit:function(){this.multiplyScalar(1/
+this.length());return this},length:function(){return Math.sqrt(this.lengthSq())},lengthSq:function(){return this.x*this.x+this.y*this.y},clone:function(){return new THREE.Vector2(this.x,this.y)},toString:function(){return"THREE.Vector2 ("+this.x+", "+this.y+")"}};THREE.Vector3=function(a,c,d){this.set(a||0,c||0,d||0)};
+THREE.Vector3.prototype={set:function(a,c,d){this.x=a;this.y=c;this.z=d;return this},copy:function(a){this.set(a.x,a.y,a.z);return this},add:function(a,c){this.set(a.x+c.x,a.y+c.y,a.z+c.z);return this},addSelf:function(a){this.set(this.x+a.x,this.y+a.y,this.z+a.z);return this},addScalar:function(a){this.set(this.x+a,this.y+a,this.z+a);return this},sub:function(a,c){this.set(a.x-c.x,a.y-c.y,a.z-c.z);return this},subSelf:function(a){this.set(this.x-a.x,this.y-a.y,this.z-a.z);return this},cross:function(a,
+c){this.set(a.y*c.z-a.z*c.y,a.z*c.x-a.x*c.z,a.x*c.y-a.y*c.x);return this},crossSelf:function(a){var c=this.x,d=this.y,f=this.z;this.set(d*a.z-f*a.y,f*a.x-c*a.z,c*a.y-d*a.x);return this},multiply:function(a,c){this.set(a.x*c.x,a.y*c.y,a.z*c.z);return this},multiplySelf:function(a){this.set(this.x*a.x,this.y*a.y,this.z*a.z);return this},multiplyScalar:function(a){this.set(this.x*a,this.y*a,this.z*a);return this},divideSelf:function(a){this.set(this.x/a.x,this.y/a.y,this.z/a.z);return this},divideScalar:function(a){this.set(this.x/
+a,this.y/a,this.z/a);return this},negate:function(){this.set(-this.x,-this.y,-this.z);return this},dot:function(a){return this.x*a.x+this.y*a.y+this.z*a.z},distanceTo:function(a){return Math.sqrt(this.distanceToSquared(a))},distanceToSquared:function(a){var c=this.x-a.x,d=this.y-a.y;a=this.z-a.z;return c*c+d*d+a*a},length:function(){return Math.sqrt(this.lengthSq())},lengthSq:function(){return this.x*this.x+this.y*this.y+this.z*this.z},lengthManhattan:function(){return this.x+this.y+this.z},normalize:function(){var a=
+this.length();a>0?this.multiplyScalar(1/a):this.set(0,0,0);return this},setLength:function(a){return this.normalize().multiplyScalar(a)},isZero:function(){return Math.abs(this.x)<1.0E-4&&Math.abs(this.y)<1.0E-4&&Math.abs(this.z)<1.0E-4},clone:function(){return new THREE.Vector3(this.x,this.y,this.z)},toString:function(){return"THREE.Vector3 ( "+this.x+", "+this.y+", "+this.z+" )"}};THREE.Vector4=function(a,c,d,f){this.set(a||0,c||0,d||0,f||1)};
+THREE.Vector4.prototype={set:function(a,c,d,f){this.x=a;this.y=c;this.z=d;this.w=f;return this},copy:function(a){this.set(a.x,a.y,a.z,a.w||1);return this},add:function(a,c){this.set(a.x+c.x,a.y+c.y,a.z+c.z,a.w+c.w);return this},addSelf:function(a){this.set(this.x+a.x,this.y+a.y,this.z+a.z,this.w+a.w);return this},sub:function(a,c){this.set(a.x-c.x,a.y-c.y,a.z-c.z,a.w-c.w);return this},subSelf:function(a){this.set(this.x-a.x,this.y-a.y,this.z-a.z,this.w-a.w);return this},multiplyScalar:function(a){this.set(this.x*
+a,this.y*a,this.z*a,this.w*a);return this},divideScalar:function(a){this.set(this.x/a,this.y/a,this.z/a,this.w/a);return this},lerpSelf:function(a,c){this.set(this.x+(a.x-this.x)*c,this.y+(a.y-this.y)*c,this.z+(a.z-this.z)*c,this.w+(a.w-this.w)*c)},clone:function(){return new THREE.Vector4(this.x,this.y,this.z,this.w)},toString:function(){return"THREE.Vector4 ("+this.x+", "+this.y+", "+this.z+", "+this.w+")"}};THREE.Ray=function(a,c){this.origin=a||new THREE.Vector3;this.direction=c||new THREE.Vector3};
+THREE.Ray.prototype={intersectScene:function(a){var c,d,f=a.objects,g=[];a=0;for(c=f.length;a<c;a++){d=f[a];d instanceof THREE.Mesh&&(g=g.concat(this.intersectObject(d)))}g.sort(function(j,k){return j.distance-k.distance});return g},intersectObject:function(a){function c(K,J,R,L){L=L.clone().subSelf(J);R=R.clone().subSelf(J);var P=K.clone().subSelf(J);K=L.dot(L);J=L.dot(R);L=L.dot(P);var b=R.dot(R);R=R.dot(P);P=1/(K*b-J*J);b=(b*L-J*R)*P;K=(K*R-J*L)*P;return b>0&&K>0&&b+K<1}var d,f,g,j,k,o,i,t,w,x,
+z,A=a.geometry,E=A.vertices,H=[];d=0;for(f=A.faces.length;d<f;d++){g=A.faces[d];x=this.origin.clone();z=this.direction.clone();i=a.matrixWorld;j=i.multiplyVector3(E[g.a].position.clone());k=i.multiplyVector3(E[g.b].position.clone());o=i.multiplyVector3(E[g.c].position.clone());i=g instanceof THREE.Face4?i.multiplyVector3(E[g.d].position.clone()):null;t=a.matrixRotation.multiplyVector3(g.normal.clone());w=z.dot(t);if(w<0){t=t.dot((new THREE.Vector3).sub(j,x))/w;x=x.addSelf(z.multiplyScalar(t));if(g instanceof
+THREE.Face3){if(c(x,j,k,o)){g={distance:this.origin.distanceTo(x),point:x,face:g,object:a};H.push(g)}}else if(g instanceof THREE.Face4&&(c(x,j,k,i)||c(x,k,o,i))){g={distance:this.origin.distanceTo(x),point:x,face:g,object:a};H.push(g)}}}return H}};
+THREE.Rectangle=function(){function a(){j=f-c;k=g-d}var c,d,f,g,j,k,o=!0;this.getX=function(){return c};this.getY=function(){return d};this.getWidth=function(){return j};this.getHeight=function(){return k};this.getLeft=function(){return c};this.getTop=function(){return d};this.getRight=function(){return f};this.getBottom=function(){return g};this.set=function(i,t,w,x){o=!1;c=i;d=t;f=w;g=x;a()};this.addPoint=function(i,t){if(o){o=!1;c=i;d=t;f=i;g=t}else{c=c<i?c:i;d=d<t?d:t;f=f>i?f:i;g=g>t?g:t}a()};
+this.add3Points=function(i,t,w,x,z,A){if(o){o=!1;c=i<w?i<z?i:z:w<z?w:z;d=t<x?t<A?t:A:x<A?x:A;f=i>w?i>z?i:z:w>z?w:z;g=t>x?t>A?t:A:x>A?x:A}else{c=i<w?i<z?i<c?i:c:z<c?z:c:w<z?w<c?w:c:z<c?z:c;d=t<x?t<A?t<d?t:d:A<d?A:d:x<A?x<d?x:d:A<d?A:d;f=i>w?i>z?i>f?i:f:z>f?z:f:w>z?w>f?w:f:z>f?z:f;g=t>x?t>A?t>g?t:g:A>g?A:g:x>A?x>g?x:g:A>g?A:g}a()};this.addRectangle=function(i){if(o){o=!1;c=i.getLeft();d=i.getTop();f=i.getRight();g=i.getBottom()}else{c=c<i.getLeft()?c:i.getLeft();d=d<i.getTop()?d:i.getTop();f=f>i.getRight()?
+f:i.getRight();g=g>i.getBottom()?g:i.getBottom()}a()};this.inflate=function(i){c-=i;d-=i;f+=i;g+=i;a()};this.minSelf=function(i){c=c>i.getLeft()?c:i.getLeft();d=d>i.getTop()?d:i.getTop();f=f<i.getRight()?f:i.getRight();g=g<i.getBottom()?g:i.getBottom();a()};this.instersects=function(i){return Math.min(f,i.getRight())-Math.max(c,i.getLeft())>=0&&Math.min(g,i.getBottom())-Math.max(d,i.getTop())>=0};this.empty=function(){o=!0;g=f=d=c=0;a()};this.isEmpty=function(){return o};this.toString=function(){return"THREE.Rectangle ( left: "+
+c+", right: "+f+", top: "+d+", bottom: "+g+", width: "+j+", height: "+k+" )"}};THREE.Matrix3=function(){this.m=[]};THREE.Matrix3.prototype={transpose:function(){var a,c=this.m;a=c[1];c[1]=c[3];c[3]=a;a=c[2];c[2]=c[6];c[6]=a;a=c[5];c[5]=c[7];c[7]=a;return this},transposeIntoArray:function(a){var c=this.m;a[0]=c[0];a[1]=c[3];a[2]=c[6];a[3]=c[1];a[4]=c[4];a[5]=c[7];a[6]=c[2];a[7]=c[5];a[8]=c[8];return this}};
+THREE.Matrix4=function(a,c,d,f,g,j,k,o,i,t,w,x,z,A,E,H){this.set(a||1,c||0,d||0,f||0,g||0,j||1,k||0,o||0,i||0,t||0,w||1,x||0,z||0,A||0,E||0,H||1);this.flat=Array(16);this.m33=new THREE.Matrix3};
+THREE.Matrix4.prototype={set:function(a,c,d,f,g,j,k,o,i,t,w,x,z,A,E,H){this.n11=a;this.n12=c;this.n13=d;this.n14=f;this.n21=g;this.n22=j;this.n23=k;this.n24=o;this.n31=i;this.n32=t;this.n33=w;this.n34=x;this.n41=z;this.n42=A;this.n43=E;this.n44=H;return this},identity:function(){this.set(1,0,0,0,0,1,0,0,0,0,1,0,0,0,0,1);return this},copy:function(a){this.set(a.n11,a.n12,a.n13,a.n14,a.n21,a.n22,a.n23,a.n24,a.n31,a.n32,a.n33,a.n34,a.n41,a.n42,a.n43,a.n44);return this},lookAt:function(a,c,d){var f=THREE.Matrix4.__tmpVec1,
+g=THREE.Matrix4.__tmpVec2,j=THREE.Matrix4.__tmpVec3;j.sub(a,c).normalize();f.cross(d,j).normalize();g.cross(j,f).normalize();this.n11=f.x;this.n12=f.y;this.n13=f.z;this.n14=-f.dot(a);this.n21=g.x;this.n22=g.y;this.n23=g.z;this.n24=-g.dot(a);this.n31=j.x;this.n32=j.y;this.n33=j.z;this.n34=-j.dot(a);this.n43=this.n42=this.n41=0;this.n44=1;return this},multiplyVector3:function(a){var c=a.x,d=a.y,f=a.z,g=1/(this.n41*c+this.n42*d+this.n43*f+this.n44);a.x=(this.n11*c+this.n12*d+this.n13*f+this.n14)*g;a.y=
+(this.n21*c+this.n22*d+this.n23*f+this.n24)*g;a.z=(this.n31*c+this.n32*d+this.n33*f+this.n34)*g;return a},multiplyVector3OnlyZ:function(a){var c=a.x,d=a.y;a=a.z;return(this.n31*c+this.n32*d+this.n33*a+this.n34)*(1/(this.n41*c+this.n42*d+this.n43*a+this.n44))},multiplyVector4:function(a){var c=a.x,d=a.y,f=a.z,g=a.w;a.x=this.n11*c+this.n12*d+this.n13*f+this.n14*g;a.y=this.n21*c+this.n22*d+this.n23*f+this.n24*g;a.z=this.n31*c+this.n32*d+this.n33*f+this.n34*g;a.w=this.n41*c+this.n42*d+this.n43*f+this.n44*
+g;return a},crossVector:function(a){var c=new THREE.Vector4;c.x=this.n11*a.x+this.n12*a.y+this.n13*a.z+this.n14*a.w;c.y=this.n21*a.x+this.n22*a.y+this.n23*a.z+this.n24*a.w;c.z=this.n31*a.x+this.n32*a.y+this.n33*a.z+this.n34*a.w;c.w=a.w?this.n41*a.x+this.n42*a.y+this.n43*a.z+this.n44*a.w:1;return c},multiply:function(a,c){var d=a.n11,f=a.n12,g=a.n13,j=a.n14,k=a.n21,o=a.n22,i=a.n23,t=a.n24,w=a.n31,x=a.n32,z=a.n33,A=a.n34,E=a.n41,H=a.n42,K=a.n43,J=a.n44,R=c.n11,L=c.n12,P=c.n13,b=c.n14,aa=c.n21,ba=c.n22,
+ca=c.n23,ga=c.n24,da=c.n31,ja=c.n32,na=c.n33,$=c.n34;this.n11=d*R+f*aa+g*da;this.n12=d*L+f*ba+g*ja;this.n13=d*P+f*ca+g*na;this.n14=d*b+f*ga+g*$+j;this.n21=k*R+o*aa+i*da;this.n22=k*L+o*ba+i*ja;this.n23=k*P+o*ca+i*na;this.n24=k*b+o*ga+i*$+t;this.n31=w*R+x*aa+z*da;this.n32=w*L+x*ba+z*ja;this.n33=w*P+x*ca+z*na;this.n34=w*b+x*ga+z*$+A;this.n41=E*R+H*aa+K*da;this.n42=E*L+H*ba+K*ja;this.n43=E*P+H*ca+K*na;this.n44=E*b+H*ga+K*$+J;return this},multiplyToArray:function(a,c,d){var f=a.n11,g=a.n12,j=a.n13,k=a.n14,
+o=a.n21,i=a.n22,t=a.n23,w=a.n24,x=a.n31,z=a.n32,A=a.n33,E=a.n34,H=a.n41,K=a.n42,J=a.n43;a=a.n44;var R=c.n11,L=c.n12,P=c.n13,b=c.n14,aa=c.n21,ba=c.n22,ca=c.n23,ga=c.n24,da=c.n31,ja=c.n32,na=c.n33,$=c.n34,qa=c.n41,va=c.n42,wa=c.n43;c=c.n44;this.n11=f*R+g*aa+j*da+k*qa;this.n12=f*L+g*ba+j*ja+k*va;this.n13=f*P+g*ca+j*na+k*wa;this.n14=f*b+g*ga+j*$+k*c;this.n21=o*R+i*aa+t*da+w*qa;this.n22=o*L+i*ba+t*ja+w*va;this.n23=o*P+i*ca+t*na+w*wa;this.n24=o*b+i*ga+t*$+w*c;this.n31=x*R+z*aa+A*da+E*qa;this.n32=x*L+z*
+ba+A*ja+E*va;this.n33=x*P+z*ca+A*na+E*wa;this.n34=x*b+z*ga+A*$+E*c;this.n41=H*R+K*aa+J*da+a*qa;this.n42=H*L+K*ba+J*ja+a*va;this.n43=H*P+K*ca+J*na+a*wa;this.n44=H*b+K*ga+J*$+a*c;d[0]=this.n11;d[1]=this.n21;d[2]=this.n31;d[3]=this.n41;d[4]=this.n12;d[5]=this.n22;d[6]=this.n32;d[7]=this.n42;d[8]=this.n13;d[9]=this.n23;d[10]=this.n33;d[11]=this.n43;d[12]=this.n14;d[13]=this.n24;d[14]=this.n34;d[15]=this.n44;return this},multiplySelf:function(a){var c=this.n11,d=this.n12,f=this.n13,g=this.n14,j=this.n21,
+k=this.n22,o=this.n23,i=this.n24,t=this.n31,w=this.n32,x=this.n33,z=this.n34,A=this.n41,E=this.n42,H=this.n43,K=this.n44,J=a.n11,R=a.n21,L=a.n31,P=a.n12,b=a.n22,aa=a.n32,ba=a.n13,ca=a.n23,ga=a.n33,da=a.n14,ja=a.n24;a=a.n34;this.n11=c*J+d*R+f*L;this.n12=c*P+d*b+f*aa;this.n13=c*ba+d*ca+f*ga;this.n14=c*da+d*ja+f*a+g;this.n21=j*J+k*R+o*L;this.n22=j*P+k*b+o*aa;this.n23=j*ba+k*ca+o*ga;this.n24=j*da+k*ja+o*a+i;this.n31=t*J+w*R+x*L;this.n32=t*P+w*b+x*aa;this.n33=t*ba+w*ca+x*ga;this.n34=t*da+w*ja+x*a+z;this.n41=
+A*J+E*R+H*L;this.n42=A*P+E*b+H*aa;this.n43=A*ba+E*ca+H*ga;this.n44=A*da+E*ja+H*a+K;return this},multiplyScalar:function(a){this.n11*=a;this.n12*=a;this.n13*=a;this.n14*=a;this.n21*=a;this.n22*=a;this.n23*=a;this.n24*=a;this.n31*=a;this.n32*=a;this.n33*=a;this.n34*=a;this.n41*=a;this.n42*=a;this.n43*=a;this.n44*=a;return this},determinant:function(){var a=this.n11,c=this.n12,d=this.n13,f=this.n14,g=this.n21,j=this.n22,k=this.n23,o=this.n24,i=this.n31,t=this.n32,w=this.n33,x=this.n34,z=this.n41,A=this.n42,
+E=this.n43,H=this.n44;return f*k*t*z-d*o*t*z-f*j*w*z+c*o*w*z+d*j*x*z-c*k*x*z-f*k*i*A+d*o*i*A+f*g*w*A-a*o*w*A-d*g*x*A+a*k*x*A+f*j*i*E-c*o*i*E-f*g*t*E+a*o*t*E+c*g*x*E-a*j*x*E-d*j*i*H+c*k*i*H+d*g*t*H-a*k*t*H-c*g*w*H+a*j*w*H},transpose:function(){function a(c,d,f){var g=c[d];c[d]=c[f];c[f]=g}a(this,"n21","n12");a(this,"n31","n13");a(this,"n32","n23");a(this,"n41","n14");a(this,"n42","n24");a(this,"n43","n34");return this},clone:function(){var a=new THREE.Matrix4;a.n11=this.n11;a.n12=this.n12;a.n13=this.n13;
+a.n14=this.n14;a.n21=this.n21;a.n22=this.n22;a.n23=this.n23;a.n24=this.n24;a.n31=this.n31;a.n32=this.n32;a.n33=this.n33;a.n34=this.n34;a.n41=this.n41;a.n42=this.n42;a.n43=this.n43;a.n44=this.n44;return a},flatten:function(){this.flattenToArray(this.flat);return this.flat},flattenToArray:function(a){a[0]=this.n11;a[1]=this.n21;a[2]=this.n31;a[3]=this.n41;a[4]=this.n12;a[5]=this.n22;a[6]=this.n32;a[7]=this.n42;a[8]=this.n13;a[9]=this.n23;a[10]=this.n33;a[11]=this.n43;a[12]=this.n14;a[13]=this.n24;a[14]=
+this.n34;a[15]=this.n44;return a},flattenToArrayOffset:function(a,c){a[c]=this.n11;a[c+1]=this.n21;a[c+2]=this.n31;a[c+3]=this.n41;a[c+4]=this.n12;a[c+5]=this.n22;a[c+6]=this.n32;a[c+7]=this.n42;a[c+8]=this.n13;a[c+9]=this.n23;a[c+10]=this.n33;a[c+11]=this.n43;a[c+12]=this.n14;a[c+13]=this.n24;a[c+14]=this.n34;a[c+15]=this.n44;return a},setTranslation:function(a,c,d){this.set(1,0,0,a,0,1,0,c,0,0,1,d,0,0,0,1);return this},setScale:function(a,c,d){this.set(a,0,0,0,0,c,0,0,0,0,d,0,0,0,0,1);return this},
+setRotX:function(a){var c=Math.cos(a);a=Math.sin(a);this.set(1,0,0,0,0,c,-a,0,0,a,c,0,0,0,0,1);return this},setRotY:function(a){var c=Math.cos(a);a=Math.sin(a);this.set(c,0,a,0,0,1,0,0,-a,0,c,0,0,0,0,1);return this},setRotZ:function(a){var c=Math.cos(a);a=Math.sin(a);this.set(c,-a,0,0,a,c,0,0,0,0,1,0,0,0,0,1);return this},setRotAxis:function(a,c){var d=Math.cos(c),f=Math.sin(c),g=1-d,j=a.x,k=a.y,o=a.z,i=g*j,t=g*k;this.set(i*j+d,i*k-f*o,i*o+f*k,0,i*k+f*o,t*k+d,t*o-f*j,0,i*o-f*k,t*o+f*j,g*o*o+d,0,0,
+0,0,1);return this},setPosition:function(a){this.n14=a.x;this.n24=a.y;this.n34=a.z;return this},setRotationFromEuler:function(a){var c=a.x,d=a.y,f=a.z;a=Math.cos(c);c=Math.sin(c);var g=Math.cos(d);d=Math.sin(d);var j=Math.cos(f);f=Math.sin(f);var k=a*d,o=c*d;this.n11=g*j;this.n12=-g*f;this.n13=d;this.n21=o*j+a*f;this.n22=-o*f+a*j;this.n23=-c*g;this.n31=-k*j+c*f;this.n32=k*f+c*j;this.n33=a*g},setRotationFromQuaternion:function(a){var c=a.x,d=a.y,f=a.z,g=a.w,j=c+c,k=d+d,o=f+f;a=c*j;var i=c*k;c*=o;var t=
+d*k;d*=o;f*=o;j*=g;k*=g;g*=o;this.n11=1-(t+f);this.n12=i-g;this.n13=c+k;this.n21=i+g;this.n22=1-(a+f);this.n23=d-j;this.n31=c-k;this.n32=d+j;this.n33=1-(a+t)},scale:function(a){var c=a.x,d=a.y;a=a.z;this.n11*=c;this.n12*=d;this.n13*=a;this.n21*=c;this.n22*=d;this.n23*=a;this.n31*=c;this.n32*=d;this.n33*=a;this.n41*=c;this.n42*=d;this.n43*=a;return this},toString:function(){return"| "+this.n11+" "+this.n12+" "+this.n13+" "+this.n14+" |\n| "+this.n21+" "+this.n22+" "+this.n23+" "+this.n24+" |\n| "+
+this.n31+" "+this.n32+" "+this.n33+" "+this.n34+" |\n| "+this.n41+" "+this.n42+" "+this.n43+" "+this.n44+" |"}};THREE.Matrix4.translationMatrix=function(a,c,d){var f=new THREE.Matrix4;f.setTranslation(a,c,d);return f};THREE.Matrix4.scaleMatrix=function(a,c,d){var f=new THREE.Matrix4;f.setScale(a,c,d);return f};THREE.Matrix4.rotationXMatrix=function(a){var c=new THREE.Matrix4;c.setRotX(a);return c};THREE.Matrix4.rotationYMatrix=function(a){var c=new THREE.Matrix4;c.setRotY(a);return c};
+THREE.Matrix4.rotationZMatrix=function(a){var c=new THREE.Matrix4;c.setRotZ(a);return c};THREE.Matrix4.rotationAxisAngleMatrix=function(a,c){var d=new THREE.Matrix4;d.setRotAxis(a,c);return d};
+THREE.Matrix4.makeInvert=function(a,c){var d=a.n11,f=a.n12,g=a.n13,j=a.n14,k=a.n21,o=a.n22,i=a.n23,t=a.n24,w=a.n31,x=a.n32,z=a.n33,A=a.n34,E=a.n41,H=a.n42,K=a.n43,J=a.n44;c===undefined&&(c=new THREE.Matrix4);c.n11=i*A*H-t*z*H+t*x*K-o*A*K-i*x*J+o*z*J;c.n12=j*z*H-g*A*H-j*x*K+f*A*K+g*x*J-f*z*J;c.n13=g*t*H-j*i*H+j*o*K-f*t*K-g*o*J+f*i*J;c.n14=j*i*x-g*t*x-j*o*z+f*t*z+g*o*A-f*i*A;c.n21=t*z*E-i*A*E-t*w*K+k*A*K+i*w*J-k*z*J;c.n22=g*A*E-j*z*E+j*w*K-d*A*K-g*w*J+d*z*J;c.n23=j*i*E-g*t*E-j*k*K+d*t*K+g*k*J-d*i*J;
+c.n24=g*t*w-j*i*w+j*k*z-d*t*z-g*k*A+d*i*A;c.n31=o*A*E-t*x*E+t*w*H-k*A*H-o*w*J+k*x*J;c.n32=j*x*E-f*A*E-j*w*H+d*A*H+f*w*J-d*x*J;c.n33=g*t*E-j*o*E+j*k*H-d*t*H-f*k*J+d*o*J;c.n34=j*o*w-f*t*w-j*k*x+d*t*x+f*k*A-d*o*A;c.n41=i*x*E-o*z*E-i*w*H+k*z*H+o*w*K-k*x*K;c.n42=f*z*E-g*x*E+g*w*H-d*z*H-f*w*K+d*x*K;c.n43=g*o*E-f*i*E-g*k*H+d*i*H+f*k*K-d*o*K;c.n44=f*i*w-g*o*w+g*k*x-d*i*x-f*k*z+d*o*z;c.multiplyScalar(1/a.determinant());return c};
+THREE.Matrix4.makeInvert3x3=function(a){var c=a.m33,d=c.m,f=a.n33*a.n22-a.n32*a.n23,g=-a.n33*a.n21+a.n31*a.n23,j=a.n32*a.n21-a.n31*a.n22,k=-a.n33*a.n12+a.n32*a.n13,o=a.n33*a.n11-a.n31*a.n13,i=-a.n32*a.n11+a.n31*a.n12,t=a.n23*a.n12-a.n22*a.n13,w=-a.n23*a.n11+a.n21*a.n13,x=a.n22*a.n11-a.n21*a.n12;a=a.n11*f+a.n21*k+a.n31*t;if(a==0)throw"matrix not invertible";a=1/a;d[0]=a*f;d[1]=a*g;d[2]=a*j;d[3]=a*k;d[4]=a*o;d[5]=a*i;d[6]=a*t;d[7]=a*w;d[8]=a*x;return c};
+THREE.Matrix4.makeFrustum=function(a,c,d,f,g,j){var k;k=new THREE.Matrix4;k.n11=2*g/(c-a);k.n12=0;k.n13=(c+a)/(c-a);k.n14=0;k.n21=0;k.n22=2*g/(f-d);k.n23=(f+d)/(f-d);k.n24=0;k.n31=0;k.n32=0;k.n33=-(j+g)/(j-g);k.n34=-2*j*g/(j-g);k.n41=0;k.n42=0;k.n43=-1;k.n44=0;return k};THREE.Matrix4.makePerspective=function(a,c,d,f){var g;a=d*Math.tan(a*Math.PI/360);g=-a;return THREE.Matrix4.makeFrustum(g*c,a*c,g,a,d,f)};
+THREE.Matrix4.makeOrtho=function(a,c,d,f,g,j){var k,o,i,t;k=new THREE.Matrix4;o=c-a;i=d-f;t=j-g;k.n11=2/o;k.n12=0;k.n13=0;k.n14=-((c+a)/o);k.n21=0;k.n22=2/i;k.n23=0;k.n24=-((d+f)/i);k.n31=0;k.n32=0;k.n33=-2/t;k.n34=-((j+g)/t);k.n41=0;k.n42=0;k.n43=0;k.n44=1;return k};THREE.Matrix4.__tmpVec1=new THREE.Vector3;THREE.Matrix4.__tmpVec2=new THREE.Vector3;THREE.Matrix4.__tmpVec3=new THREE.Vector3;
+THREE.Object3D=function(){this.id=THREE.Object3DCounter.value++;this.parent=undefined;this.children=[];this.position=new THREE.Vector3;this.positionScreen=new THREE.Vector4;this.rotation=new THREE.Vector3;this.scale=new THREE.Vector3(1,1,1);this.matrix=new THREE.Matrix4;this.matrixWorld=new THREE.Matrix4;this.matrixRotation=new THREE.Matrix4;this.matrixRotationWorld=new THREE.Matrix4;this.matrixNeedsUpdate=!0;this.matrixAutoUpdate=!0;this.quaternion=new THREE.Quaternion;this.useQuaternion=!1;this.boundRadius=
+0;this.boundRadiusScale=1;this.visible=!0};
+THREE.Object3D.prototype={addChild:function(a){if(this.children.indexOf(a)===-1){a.parent!==undefined&&a.parent.removeChild(a);a.parent=this;this.children.push(a)}},removeChild:function(a){var c=this.children.indexOf(a);if(c!==-1){a.parent=undefined;this.children.splice(c,1)}},updateMatrix:function(){this.matrix.setPosition(this.position);this.useQuaternion?this.matrixRotation.setRotationFromQuaternion(this.quaternion):this.matrixRotation.setRotationFromEuler(this.rotation);this.matrix.n11=this.matrixRotation.n11;
+this.matrix.n12=this.matrixRotation.n12;this.matrix.n13=this.matrixRotation.n13;this.matrix.n21=this.matrixRotation.n21;this.matrix.n22=this.matrixRotation.n22;this.matrix.n23=this.matrixRotation.n23;this.matrix.n31=this.matrixRotation.n31;this.matrix.n32=this.matrixRotation.n32;this.matrix.n33=this.matrixRotation.n33;if(this.scale.x!==1||this.scale.y!==1||this.scale.z!==1){this.matrix.scale(this.scale);this.boundRadiusScale=Math.max(this.scale.x,Math.max(this.scale.y,this.scale.z))}return!0},update:function(a,
+c,d){if(this.visible){this.matrixAutoUpdate&&(c|=this.updateMatrix());if(c||this.matrixNeedsUpdate){a?this.matrixWorld.multiply(a,this.matrix):this.matrixWorld.copy(this.matrix);this.matrixNeedsUpdate=!1;c=!0}a=0;for(var f=this.children.length;a<f;a++)this.children[a].update(this.matrixWorld,c,d)}}};THREE.Object3DCounter={value:0};
+THREE.Vertex=function(a,c){this.position=a||new THREE.Vector3;this.positionWorld=new THREE.Vector3;this.positionScreen=new THREE.Vector4;this.normal=c||new THREE.Vector3;this.normalWorld=new THREE.Vector3;this.normalScreen=new THREE.Vector3;this.tangent=new THREE.Vector4;this.__visible=!0};THREE.Vertex.prototype={toString:function(){return"THREE.Vertex ( position: "+this.position+", normal: "+this.normal+" )"}};
+THREE.Face3=function(a,c,d,f,g){this.a=a;this.b=c;this.c=d;this.centroid=new THREE.Vector3;this.normal=f instanceof THREE.Vector3?f:new THREE.Vector3;this.vertexNormals=f instanceof Array?f:[];this.materials=g instanceof Array?g:[g]};THREE.Face3.prototype={toString:function(){return"THREE.Face3 ( "+this.a+", "+this.b+", "+this.c+" )"}};
+THREE.Face4=function(a,c,d,f,g,j){this.a=a;this.b=c;this.c=d;this.d=f;this.centroid=new THREE.Vector3;this.normal=g instanceof THREE.Vector3?g:new THREE.Vector3;this.vertexNormals=g instanceof Array?g:[];this.materials=j instanceof Array?j:[j]};THREE.Face4.prototype={toString:function(){return"THREE.Face4 ( "+this.a+", "+this.b+", "+this.c+" "+this.d+" )"}};THREE.UV=function(a,c){this.set(a||0,c||0)};
+THREE.UV.prototype={set:function(a,c){this.u=a;this.v=c;return this},copy:function(a){this.set(a.u,a.v);return this},toString:function(){return"THREE.UV ("+this.u+", "+this.v+")"}};THREE.Geometry=function(){this.id="Geometry"+THREE.GeometryIdCounter++;this.vertices=[];this.faces=[];this.uvs=[];this.uvs2=[];this.colors=[];this.skinWeights=[];this.skinIndices=[];this.boundingSphere=this.boundingBox=null;this.geometryChunks={};this.hasTangents=!1};
+THREE.Geometry.prototype={computeCentroids:function(){var a,c,d;a=0;for(c=this.faces.length;a<c;a++){d=this.faces[a];d.centroid.set(0,0,0);if(d instanceof THREE.Face3){d.centroid.addSelf(this.vertices[d.a].position);d.centroid.addSelf(this.vertices[d.b].position);d.centroid.addSelf(this.vertices[d.c].position);d.centroid.divideScalar(3)}else if(d instanceof THREE.Face4){d.centroid.addSelf(this.vertices[d.a].position);d.centroid.addSelf(this.vertices[d.b].position);d.centroid.addSelf(this.vertices[d.c].position);
+d.centroid.addSelf(this.vertices[d.d].position);d.centroid.divideScalar(4)}}},computeFaceNormals:function(a){var c,d,f,g,j,k,o=new THREE.Vector3,i=new THREE.Vector3;f=0;for(g=this.vertices.length;f<g;f++){j=this.vertices[f];j.normal.set(0,0,0)}f=0;for(g=this.faces.length;f<g;f++){j=this.faces[f];if(a&&j.vertexNormals.length){o.set(0,0,0);c=0;for(d=j.normal.length;c<d;c++)o.addSelf(j.vertexNormals[c]);o.divideScalar(3)}else{c=this.vertices[j.a];d=this.vertices[j.b];k=this.vertices[j.c];o.sub(k.position,
+d.position);i.sub(c.position,d.position);o.crossSelf(i)}o.isZero()||o.normalize();j.normal.copy(o)}},computeVertexNormals:function(){var a,c,d,f;if(this.__tmpVertices==undefined){f=this.__tmpVertices=Array(this.vertices.length);a=0;for(c=this.vertices.length;a<c;a++)f[a]=new THREE.Vector3;a=0;for(c=this.faces.length;a<c;a++){d=this.faces[a];if(d instanceof THREE.Face3)d.vertexNormals=[new THREE.Vector3,new THREE.Vector3,new THREE.Vector3];else if(d instanceof THREE.Face4)d.vertexNormals=[new THREE.Vector3,
+new THREE.Vector3,new THREE.Vector3,new THREE.Vector3]}}else{f=this.__tmpVertices;a=0;for(c=this.vertices.length;a<c;a++)f[a].set(0,0,0)}a=0;for(c=this.faces.length;a<c;a++){d=this.faces[a];if(d instanceof THREE.Face3){f[d.a].addSelf(d.normal);f[d.b].addSelf(d.normal);f[d.c].addSelf(d.normal)}else if(d instanceof THREE.Face4){f[d.a].addSelf(d.normal);f[d.b].addSelf(d.normal);f[d.c].addSelf(d.normal);f[d.d].addSelf(d.normal)}}a=0;for(c=this.vertices.length;a<c;a++)f[a].normalize();a=0;for(c=this.faces.length;a<
+c;a++){d=this.faces[a];if(d instanceof THREE.Face3){d.vertexNormals[0].copy(f[d.a]);d.vertexNormals[1].copy(f[d.b]);d.vertexNormals[2].copy(f[d.c])}else if(d instanceof THREE.Face4){d.vertexNormals[0].copy(f[d.a]);d.vertexNormals[1].copy(f[d.b]);d.vertexNormals[2].copy(f[d.c]);d.vertexNormals[3].copy(f[d.d])}}},computeTangents:function(){function a($,qa,va,wa,Ha,Aa,Ia){j=$.vertices[qa].position;k=$.vertices[va].position;o=$.vertices[wa].position;i=g[Ha];t=g[Aa];w=g[Ia];x=k.x-j.x;z=o.x-j.x;A=k.y-j.y;
+E=o.y-j.y;H=k.z-j.z;K=o.z-j.z;J=t.u-i.u;R=w.u-i.u;L=t.v-i.v;P=w.v-i.v;b=1/(J*P-R*L);ca.set((P*x-L*z)*b,(P*A-L*E)*b,(P*H-L*K)*b);ga.set((J*z-R*x)*b,(J*E-R*A)*b,(J*K-R*H)*b);aa[qa].addSelf(ca);aa[va].addSelf(ca);aa[wa].addSelf(ca);ba[qa].addSelf(ga);ba[va].addSelf(ga);ba[wa].addSelf(ga)}var c,d,f,g,j,k,o,i,t,w,x,z,A,E,H,K,J,R,L,P,b,aa=[],ba=[],ca=new THREE.Vector3,ga=new THREE.Vector3,da=new THREE.Vector3,ja=new THREE.Vector3,na=new THREE.Vector3;c=0;for(d=this.vertices.length;c<d;c++){aa[c]=new THREE.Vector3;
+ba[c]=new THREE.Vector3}c=0;for(d=this.faces.length;c<d;c++){f=this.faces[c];g=this.uvs[c];if(f instanceof THREE.Face3){a(this,f.a,f.b,f.c,0,1,2);this.vertices[f.a].normal.copy(f.vertexNormals[0]);this.vertices[f.b].normal.copy(f.vertexNormals[1]);this.vertices[f.c].normal.copy(f.vertexNormals[2])}else if(f instanceof THREE.Face4){a(this,f.a,f.b,f.c,0,1,2);a(this,f.a,f.b,f.d,0,1,3);this.vertices[f.a].normal.copy(f.vertexNormals[0]);this.vertices[f.b].normal.copy(f.vertexNormals[1]);this.vertices[f.c].normal.copy(f.vertexNormals[2]);
+this.vertices[f.d].normal.copy(f.vertexNormals[3])}}c=0;for(d=this.vertices.length;c<d;c++){na.copy(this.vertices[c].normal);f=aa[c];da.copy(f);da.subSelf(na.multiplyScalar(na.dot(f))).normalize();ja.cross(this.vertices[c].normal,f);f=ja.dot(ba[c]);f=f<0?-1:1;this.vertices[c].tangent.set(da.x,da.y,da.z,f)}this.hasTangents=!0},computeBoundingBox:function(){var a;if(this.vertices.length>0){this.boundingBox={x:[this.vertices[0].position.x,this.vertices[0].position.x],y:[this.vertices[0].position.y,this.vertices[0].position.y],
+z:[this.vertices[0].position.z,this.vertices[0].position.z]};for(var c=1,d=this.vertices.length;c<d;c++){a=this.vertices[c];if(a.position.x<this.boundingBox.x[0])this.boundingBox.x[0]=a.position.x;else if(a.position.x>this.boundingBox.x[1])this.boundingBox.x[1]=a.position.x;if(a.position.y<this.boundingBox.y[0])this.boundingBox.y[0]=a.position.y;else if(a.position.y>this.boundingBox.y[1])this.boundingBox.y[1]=a.position.y;if(a.position.z<this.boundingBox.z[0])this.boundingBox.z[0]=a.position.z;else if(a.position.z>
+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(w){var x=[];c=0;for(d=w.length;c<d;c++)w[c]==undefined?x.push("undefined"):x.push(w[c].id);return x.join("_")}var c,d,f,g,j,k,o,i,t={};f=0;for(g=this.faces.length;f<g;f++){j=this.faces[f];
+k=j.materials;o=a(k);t[o]==undefined&&(t[o]={hash:o,counter:0});i=t[o].hash+"_"+t[o].counter;this.geometryChunks[i]==undefined&&(this.geometryChunks[i]={faces:[],materials:k,vertices:0});j=j instanceof THREE.Face3?3:4;if(this.geometryChunks[i].vertices+j>65535){t[o].counter+=1;i=t[o].hash+"_"+t[o].counter;this.geometryChunks[i]==undefined&&(this.geometryChunks[i]={faces:[],materials:k,vertices:0})}this.geometryChunks[i].faces.push(f);this.geometryChunks[i].vertices+=j}},toString:function(){return"THREE.Geometry ( vertices: "+
+this.vertices+", faces: "+this.faces+", uvs: "+this.uvs+" )"}};THREE.GeometryIdCounter=0;
+THREE.Camera=function(a,c,d,f,g){THREE.Object3D.call(this);this.fov=a||50;this.aspect=c||1;this.near=d||0.1;this.far=f||2E3;this.screenCenterY=this.screenCenterX=0;this.target=g||new THREE.Object3D;this.useTarget=!0;this.up=new THREE.Vector3(0,1,0);this.inverseMatrix=new THREE.Matrix4;this.projectionMatrix=null;this.tmpVec=new THREE.Vector3;this.translateX=function(j,k){this.tmpVec.sub(this.target.position,this.position).normalize().multiplyScalar(j);this.tmpVec.crossSelf(this.up);if(k)this.tmpVec.y=
+0;this.position.addSelf(this.tmpVec);this.target.position.addSelf(this.tmpVec)};this.translateZ=function(j,k){this.tmpVec.sub(this.target.position,this.position).normalize().multiplyScalar(j);if(k)this.tmpVec.y=0;this.position.subSelf(this.tmpVec);this.target.position.subSelf(this.tmpVec)};this.updateProjectionMatrix()};THREE.Camera.prototype=new THREE.Object3D;THREE.Camera.prototype.constructor=THREE.Camera;THREE.Camera.prototype.supr=THREE.Object3D.prototype;
+THREE.Camera.prototype.updateProjectionMatrix=function(){this.projectionMatrix=THREE.Matrix4.makePerspective(this.fov,this.aspect,this.near,this.far)};
+THREE.Camera.prototype.update=function(a,c,d){if(this.useTarget){this.matrix.lookAt(this.position,this.target.position,this.up);a?this.matrixWorld.multiply(a,this.matrix):this.matrixWorld.copy(this.matrix);THREE.Matrix4.makeInvert(this.matrixWorld,this.inverseMatrix);c=!0}else{this.matrixAutoUpdate&&(c|=this.updateMatrix());if(c||this.matrixNeedsUpdate){a?this.matrixWorld.multiply(a,this.matrix):this.matrixWorld.copy(this.matrix);this.matrixNeedsUpdate=!1;c=!0;THREE.Matrix4.makeInvert(this.matrixWorld,
+this.inverseMatrix)}}for(a=0;a<this.children.length;a++)this.children[a].update(this.matrixWorld,c,d)};
+THREE.Camera.prototype.frustumContains=function(a){var c=a.matrixWorld.n14,d=a.matrixWorld.n24,f=a.matrixWorld.n34,g=this.inverseMatrix,j=a.boundRadius*a.boundRadiusScale,k=g.n31*c+g.n32*d+g.n33*f+g.n34;if(k-j>-this.near)return!1;if(k+j<-this.far)return!1;k-=j;var o=this.projectionMatrix,i=1/(o.n43*k),t=i*this.screenCenterX,w=(g.n11*c+g.n12*d+g.n13*f+g.n14)*o.n11*t;j=o.n11*j*t;if(w+j<-this.screenCenterX)return!1;if(w-j>this.screenCenterX)return!1;c=(g.n21*c+g.n22*d+g.n23*f+g.n24)*o.n22*i*this.screenCenterY;
+if(c+j<-this.screenCenterY)return!1;if(c-j>this.screenCenterY)return!1;a.positionScreen.set(w,c,k,j);return!0};THREE.Light=function(a){THREE.Object3D.call(this);this.color=new THREE.Color(a)};THREE.Light.prototype=new THREE.Object3D;THREE.Light.prototype.constructor=THREE.Light;THREE.Light.prototype.supr=THREE.Object3D.prototype;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;THREE.DirectionalLight.prototype.constructor=THREE.DirectionalLight;THREE.PointLight=function(a,c){THREE.Light.call(this,a);this.position=new THREE.Vector3;this.intensity=c||1};THREE.PointLight.prototype=new THREE.Light;THREE.PointLight.prototype.constructor=THREE.PointLight;THREE.FlatShading=0;THREE.SmoothShading=1;
+THREE.NormalBlending=0;THREE.AdditiveBlending=1;THREE.SubtractiveBlending=2;THREE.BillboardBlending=3;THREE.ReverseSubtractiveBlending=4;THREE.MaterialCounter={value:0};THREE.CubeReflectionMapping=function(){};THREE.CubeRefractionMapping=function(){};THREE.LatitudeReflectionMapping=function(){};THREE.LatitudeRefractionMapping=function(){};THREE.SphericalReflectionMapping=function(){};THREE.SphericalRefractionMapping=function(){};THREE.UVMapping=function(){};
+THREE.LineBasicMaterial=function(a){this.id=THREE.MaterialCounter.value++;this.color=new THREE.Color(16777215);this.opacity=1;this.blending=THREE.NormalBlending;this.depth_test=!0;this.linewidth=1;this.linejoin=this.linecap="round";this.vertex_colors=!1;if(a){a.color!==undefined&&this.color.setHex(a.color);if(a.opacity!==undefined)this.opacity=a.opacity;if(a.blending!==undefined)this.blending=a.blending;if(a.depth_test!==undefined)this.depth_test=a.depth_test;if(a.linewidth!==undefined)this.linewidth=
+a.linewidth;if(a.linecap!==undefined)this.linecap=a.linecap;if(a.linejoin!==undefined)this.linejoin=a.linejoin;if(a.vertex_colors!==undefined)this.vertex_colors=a.vertex_colors}};
+THREE.LineBasicMaterial.prototype={toString:function(){return"THREE.LineBasicMaterial (<br/>id: "+this.id+"<br/>color: "+this.color+"<br/>opacity: "+this.opacity+"<br/>blending: "+this.blending+"<br/>depth_test: "+this.depth_test+"<br/>linewidth: "+this.linewidth+"<br/>linecap: "+this.linecap+"<br/>linejoin: "+this.linejoin+"<br/>vertex_colors: "+this.vertex_colors+"<br/>)"}};
+THREE.MeshBasicMaterial=function(a){this.id=THREE.MaterialCounter.value++;this.color=new THREE.Color(16777215);this.opacity=1;this.env_map=this.light_map=this.map=null;this.combine=THREE.MultiplyOperation;this.reflectivity=1;this.refraction_ratio=0.98;this.fog=!0;this.shading=THREE.SmoothShading;this.blending=THREE.NormalBlending;this.depth_test=!0;this.wireframe=!1;this.wireframe_linewidth=1;this.wireframe_linejoin=this.wireframe_linecap="round";this.vertex_colors=!1;this.skinning=!1;if(a){a.color!==
+undefined&&this.color.setHex(a.color);if(a.opacity!==undefined)this.opacity=a.opacity;if(a.map!==undefined)this.map=a.map;if(a.light_map!==undefined)this.light_map=a.light_map;if(a.env_map!==undefined)this.env_map=a.env_map;if(a.combine!==undefined)this.combine=a.combine;if(a.reflectivity!==undefined)this.reflectivity=a.reflectivity;if(a.refraction_ratio!==undefined)this.refraction_ratio=a.refraction_ratio;if(a.fog!==undefined)this.fog=a.fog;if(a.shading!==undefined)this.shading=a.shading;if(a.blending!==
+undefined)this.blending=a.blending;if(a.depth_test!==undefined)this.depth_test=a.depth_test;if(a.wireframe!==undefined)this.wireframe=a.wireframe;if(a.wireframe_linewidth!==undefined)this.wireframe_linewidth=a.wireframe_linewidth;if(a.wireframe_linecap!==undefined)this.wireframe_linecap=a.wireframe_linecap;if(a.wireframe_linejoin!==undefined)this.wireframe_linejoin=a.wireframe_linejoin;if(a.vertex_colors!==undefined)this.vertex_colors=a.vertex_colors;if(a.skinning!==undefined)this.skinning=a.skinning}};
+THREE.MeshBasicMaterial.prototype={toString:function(){return"THREE.MeshBasicMaterial (<br/>id: "+this.id+"<br/>color: "+this.color+"<br/>opacity: "+this.opacity+"<br/>map: "+this.map+"<br/>light_map: "+this.light_map+"<br/>env_map: "+this.env_map+"<br/>combine: "+this.combine+"<br/>reflectivity: "+this.reflectivity+"<br/>refraction_ratio: "+this.refraction_ratio+"<br/>blending: "+this.blending+"<br/>depth_test: "+this.depth_test+"<br/>wireframe: "+this.wireframe+"<br/>wireframe_linewidth: "+this.wireframe_linewidth+
+"<br/>wireframe_linecap: "+this.wireframe_linecap+"<br/>wireframe_linejoin: "+this.wireframe_linejoin+"<br/>vertex_colors: "+this.vertex_colors+"<br/>skinning: "+this.skinning+"<br/>)"}};
+THREE.MeshLambertMaterial=function(a){this.id=THREE.MaterialCounter.value++;this.color=new THREE.Color(16777215);this.opacity=1;this.env_map=this.light_map=this.map=null;this.combine=THREE.MultiplyOperation;this.reflectivity=1;this.refraction_ratio=0.98;this.fog=!0;this.shading=THREE.SmoothShading;this.blending=THREE.NormalBlending;this.depth_test=!0;this.wireframe=!1;this.wireframe_linewidth=1;this.wireframe_linejoin=this.wireframe_linecap="round";this.vertex_colors=!1;this.skinning=!1;if(a){a.color!==
+undefined&&this.color.setHex(a.color);if(a.opacity!==undefined)this.opacity=a.opacity;if(a.map!==undefined)this.map=a.map;if(a.light_map!==undefined)this.light_map=a.light_map;if(a.env_map!==undefined)this.env_map=a.env_map;if(a.combine!==undefined)this.combine=a.combine;if(a.reflectivity!==undefined)this.reflectivity=a.reflectivity;if(a.refraction_ratio!==undefined)this.refraction_ratio=a.refraction_ratio;if(a.fog!==undefined)this.fog=a.fog;if(a.shading!==undefined)this.shading=a.shading;if(a.blending!==
+undefined)this.blending=a.blending;if(a.depth_test!==undefined)this.depth_test=a.depth_test;if(a.wireframe!==undefined)this.wireframe=a.wireframe;if(a.wireframe_linewidth!==undefined)this.wireframe_linewidth=a.wireframe_linewidth;if(a.wireframe_linecap!==undefined)this.wireframe_linecap=a.wireframe_linecap;if(a.wireframe_linejoin!==undefined)this.wireframe_linejoin=a.wireframe_linejoin;if(a.vertex_colors!==undefined)this.vertex_colors=a.vertex_colors;if(a.skinning!==undefined)this.skinning=a.skinning}};
+THREE.MeshLambertMaterial.prototype={toString:function(){return"THREE.MeshLambertMaterial (<br/>id: "+this.id+"<br/>color: "+this.color+"<br/>opacity: "+this.opacity+"<br/>map: "+this.map+"<br/>light_map: "+this.light_map+"<br/>env_map: "+this.env_map+"<br/>combine: "+this.combine+"<br/>reflectivity: "+this.reflectivity+"<br/>refraction_ratio: "+this.refraction_ratio+"<br/>shading: "+this.shading+"<br/>blending: "+this.blending+"<br/>depth_test: "+this.depth_test+"<br/>wireframe: "+this.wireframe+
+"<br/>wireframe_linewidth: "+this.wireframe_linewidth+"<br/>wireframe_linecap: "+this.wireframe_linecap+"<br/>wireframe_linejoin: "+this.wireframe_linejoin+"<br/>vertex_colors: "+this.vertex_colors+"<br/>skinning: "+this.skinning+"<br/> )"}};
+THREE.MeshPhongMaterial=function(a){this.id=THREE.MaterialCounter.value++;this.color=new THREE.Color(16777215);this.ambient=new THREE.Color(328965);this.specular=new THREE.Color(1118481);this.shininess=30;this.opacity=1;this.env_map=this.light_map=this.map=null;this.combine=THREE.MultiplyOperation;this.reflectivity=1;this.refraction_ratio=0.98;this.fog=!0;this.shading=THREE.SmoothShading;this.blending=THREE.NormalBlending;this.depth_test=!0;this.wireframe=!1;this.wireframe_linewidth=1;this.wireframe_linejoin=
+this.wireframe_linecap="round";this.vertex_colors=!1;this.skinning=!1;if(a){if(a.color!==undefined)this.color=new THREE.Color(a.color);if(a.ambient!==undefined)this.ambient=new THREE.Color(a.ambient);if(a.specular!==undefined)this.specular=new THREE.Color(a.specular);if(a.shininess!==undefined)this.shininess=a.shininess;if(a.opacity!==undefined)this.opacity=a.opacity;if(a.light_map!==undefined)this.light_map=a.light_map;if(a.map!==undefined)this.map=a.map;if(a.env_map!==undefined)this.env_map=a.env_map;
+if(a.combine!==undefined)this.combine=a.combine;if(a.reflectivity!==undefined)this.reflectivity=a.reflectivity;if(a.refraction_ratio!==undefined)this.refraction_ratio=a.refraction_ratio;if(a.fog!==undefined)this.fog=a.fog;if(a.shading!==undefined)this.shading=a.shading;if(a.blending!==undefined)this.blending=a.blending;if(a.depth_test!==undefined)this.depth_test=a.depth_test;if(a.wireframe!==undefined)this.wireframe=a.wireframe;if(a.wireframe_linewidth!==undefined)this.wireframe_linewidth=a.wireframe_linewidth;
+if(a.wireframe_linecap!==undefined)this.wireframe_linecap=a.wireframe_linecap;if(a.wireframe_linejoin!==undefined)this.wireframe_linejoin=a.wireframe_linejoin;if(a.vertex_colors!==undefined)this.vertex_colors=a.vertex_colors;if(a.skinning!==undefined)this.skinning=a.skinning}};
+THREE.MeshPhongMaterial.prototype={toString:function(){return"THREE.MeshPhongMaterial (<br/>id: "+this.id+"<br/>color: "+this.color+"<br/>ambient: "+this.ambient+"<br/>specular: "+this.specular+"<br/>shininess: "+this.shininess+"<br/>opacity: "+this.opacity+"<br/>map: "+this.map+"<br/>env_map: "+this.env_map+"<br/>combine: "+this.combine+"<br/>reflectivity: "+this.reflectivity+"<br/>refraction_ratio: "+this.refraction_ratio+"<br/>shading: "+this.shading+"<br/>blending: "+this.blending+"<br/>depth_test: "+
+this.depth_test+"<br/>wireframe: "+this.wireframe+"<br/>wireframe_linewidth: "+this.wireframe_linewidth+"<br/>wireframe_linecap: "+this.wireframe_linecap+"<br/>wireframe_linejoin: "+this.wireframe_linejoin+"<br/>vertex_colors: "+this.vertex_colors+"<br/>skinning: "+this.skinning+"<br/>)"}};
+THREE.MeshDepthMaterial=function(a){this.id=THREE.MaterialCounter.value++;this.opacity=1;this.shading=THREE.SmoothShading;this.blending=THREE.NormalBlending;this.depth_test=!0;this.wireframe=!1;this.wireframe_linewidth=1;if(a){if(a.opacity!==undefined)this.opacity=a.opacity;if(a.shading!==undefined)this.shading=a.shading;if(a.blending!==undefined)this.blending=a.blending;if(a.depth_test!==undefined)this.depth_test=a.depth_test;if(a.wireframe!==undefined)this.wireframe=a.wireframe;if(a.wireframe_linewidth!==
+undefined)this.wireframe_linewidth=a.wireframe_linewidth}};THREE.MeshDepthMaterial.prototype={toString:function(){return"THREE.MeshDepthMaterial (<br/>id: "+this.id+"<br/>opacity: "+this.opacity+"<br/>blending: "+this.blending+"<br/>depth_test: "+this.depth_test+"<br/>wireframe: "+this.wireframe+"<br/>wireframe_linewidth: "+this.wireframe_linewidth+"<br/>)"}};
+THREE.MeshNormalMaterial=function(a){this.id=THREE.MaterialCounter.value++;this.opacity=1;this.shading=THREE.FlatShading;this.blending=THREE.NormalBlending;this.depth_test=!0;this.wireframe=!1;this.wireframe_linewidth=1;if(a){if(a.opacity!==undefined)this.opacity=a.opacity;if(a.shading!==undefined)this.shading=a.shading;if(a.blending!==undefined)this.blending=a.blending;if(a.depth_test!==undefined)this.depth_test=a.depth_test;if(a.wireframe!==undefined)this.wireframe=a.wireframe;if(a.wireframe_linewidth!==
+undefined)this.wireframe_linewidth=a.wireframe_linewidth}};THREE.MeshNormalMaterial.prototype={toString:function(){return"THREE.MeshNormalMaterial (<br/>id: "+this.id+"<br/>opacity: "+this.opacity+"<br/>blending: "+this.blending+"<br/>depth_test: "+this.depth_test+"<br/>wireframe: "+this.wireframe+"<br/>wireframe_linewidth: "+this.wireframe_linewidth+"<br/>)"}};THREE.MeshFaceMaterial=function(){};THREE.MeshFaceMaterial.prototype={toString:function(){return"THREE.MeshFaceMaterial"}};
+THREE.MeshShaderMaterial=function(a){this.id=THREE.MaterialCounter.value++;this.vertex_shader=this.fragment_shader="void main() {}";this.uniforms={};this.opacity=1;this.shading=THREE.SmoothShading;this.blending=THREE.NormalBlending;this.depth_test=!0;this.wireframe=!1;this.wireframe_linewidth=1;this.wireframe_linejoin=this.wireframe_linecap="round";this.vertex_colors=!1;this.skinning=!1;if(a){if(a.fragment_shader!==undefined)this.fragment_shader=a.fragment_shader;if(a.vertex_shader!==undefined)this.vertex_shader=
+a.vertex_shader;if(a.uniforms!==undefined)this.uniforms=a.uniforms;if(a.opacity!==undefined)this.opacity=a.opacity;if(a.shading!==undefined)this.shading=a.shading;if(a.blending!==undefined)this.blending=a.blending;if(a.depth_test!==undefined)this.depth_test=a.depth_test;if(a.wireframe!==undefined)this.wireframe=a.wireframe;if(a.wireframe_linewidth!==undefined)this.wireframe_linewidth=a.wireframe_linewidth;if(a.wireframe_linecap!==undefined)this.wireframe_linecap=a.wireframe_linecap;if(a.wireframe_linejoin!==
+undefined)this.wireframe_linejoin=a.wireframe_linejoin;if(a.vertex_colors!==undefined)this.vertex_colors=a.vertex_colors;if(a.skinning!==undefined)this.skinning=a.skinning}};
+THREE.MeshShaderMaterial.prototype={toString:function(){return"THREE.MeshShaderMaterial (<br/>id: "+this.id+"<br/>blending: "+this.blending+"<br/>depth_test: "+this.depth_test+"<br/>wireframe: "+this.wireframe+"<br/>wireframe_linewidth: "+this.wireframe_linewidth+"<br/>wireframe_linecap: "+this.wireframe_linecap+"<br/>wireframe_linejoin: "+this.wireframe_linejoin+"<br/>vertex_colors: "+this.vertex_colors+"<br/>skinning: "+this.skinning+"<br/>)"}};
+THREE.ParticleBasicMaterial=function(a){this.id=THREE.MaterialCounter.value++;this.color=new THREE.Color(16777215);this.opacity=1;this.map=null;this.size=1;this.blending=THREE.NormalBlending;this.depth_test=!0;this.offset=new THREE.Vector2;this.vertex_colors=!1;if(a){a.color!==undefined&&this.color.setHex(a.color);if(a.opacity!==undefined)this.opacity=a.opacity;if(a.map!==undefined)this.map=a.map;if(a.size!==undefined)this.size=a.size;if(a.blending!==undefined)this.blending=a.blending;if(a.depth_test!==
+undefined)this.depth_test=a.depth_test;if(a.vertex_colors!==undefined)this.vertex_colors=a.vertex_colors}};THREE.ParticleBasicMaterial.prototype={toString:function(){return"THREE.ParticleBasicMaterial (<br/>id: "+this.id+"<br/>color: "+this.color+"<br/>opacity: "+this.opacity+"<br/>map: "+this.map+"<br/>size: "+this.size+"<br/>blending: "+this.blending+"<br/>depth_test: "+this.depth_test+"<br/>vertex_colors: "+this.vertex_colors+"<br/>)"}};
+THREE.ParticleCircleMaterial=function(a){this.id=THREE.MaterialCounter.value++;this.color=new THREE.Color(16777215);this.opacity=1;this.blending=THREE.NormalBlending;if(a){a.color!==undefined&&this.color.setHex(a.color);if(a.opacity!==undefined)this.opacity=a.opacity;if(a.blending!==undefined)this.blending=a.blending}};
+THREE.ParticleCircleMaterial.prototype={toString:function(){return"THREE.ParticleCircleMaterial (<br/>color: "+this.color+"<br/>opacity: "+this.opacity+"<br/>blending: "+this.blending+"<br/>)"}};
+THREE.Texture=function(a,c,d,f,g,j){this.image=a;this.mapping=c!==undefined?c:new THREE.UVMapping;this.wrap_s=d!==undefined?d:THREE.ClampToEdgeWrapping;this.wrap_t=f!==undefined?f:THREE.ClampToEdgeWrapping;this.mag_filter=g!==undefined?g:THREE.LinearFilter;this.min_filter=j!==undefined?j:THREE.LinearMipMapLinearFilter;this.needsUpdate=!1};
+THREE.Texture.prototype={clone:function(){return new THREE.Texture(this.image,this.mapping,this.wrap_s,this.wrap_t,this.mag_filter,this.min_filter)},toString:function(){return"THREE.Texture (<br/>image: "+this.image+"<br/>wrap_s: "+this.wrap_s+"<br/>wrap_t: "+this.wrap_t+"<br/>mag_filter: "+this.mag_filter+"<br/>min_filter: "+this.min_filter+"<br/>)"}};THREE.MultiplyOperation=0;THREE.MixOperation=1;THREE.RepeatWrapping=0;THREE.ClampToEdgeWrapping=1;THREE.MirroredRepeatWrapping=2;
+THREE.NearestFilter=3;THREE.NearestMipMapNearestFilter=4;THREE.NearestMipMapLinearFilter=5;THREE.LinearFilter=6;THREE.LinearMipMapNearestFilter=7;THREE.LinearMipMapLinearFilter=8;THREE.ByteType=9;THREE.UnsignedByteType=10;THREE.ShortType=11;THREE.UnsignedShortType=12;THREE.IntType=13;THREE.UnsignedIntType=14;THREE.FloatType=15;THREE.AlphaFormat=16;THREE.RGBFormat=17;THREE.RGBAFormat=18;THREE.LuminanceFormat=19;THREE.LuminanceAlphaFormat=20;
+THREE.RenderTarget=function(a,c,d){this.width=a;this.height=c;d=d||{};this.wrap_s=d.wrap_s!==undefined?d.wrap_s:THREE.ClampToEdgeWrapping;this.wrap_t=d.wrap_t!==undefined?d.wrap_t:THREE.ClampToEdgeWrapping;this.mag_filter=d.mag_filter!==undefined?d.mag_filter:THREE.LinearFilter;this.min_filter=d.min_filter!==undefined?d.min_filter:THREE.LinearMipMapLinearFilter;this.format=d.format!==undefined?d.format:THREE.RGBFormat;this.type=d.type!==undefined?d.type:THREE.UnsignedByteType};
+var Uniforms={clone:function(a){var c,d,f,g={};for(c in a){g[c]={};for(d in a[c]){f=a[c][d];g[c][d]=f instanceof THREE.Color||f instanceof THREE.Vector3||f instanceof THREE.Texture?f.clone():f}}return g},merge:function(a){var c,d,f,g={};for(c=0;c<a.length;c++){f=this.clone(a[c]);for(d in f)g[d]=f[d]}return g}};THREE.Particle=function(a){THREE.Object3D.call(this);this.materials=a instanceof Array?a:[a];this.matrixAutoUpdate=!1};THREE.Particle.prototype=new THREE.Object3D;
+THREE.Particle.prototype.constructor=THREE.Particle;THREE.ParticleSystem=function(a,c){THREE.Object3D.call(this);this.geometry=a;this.materials=c instanceof Array?c:[c];this.sortParticles=!1};THREE.ParticleSystem.prototype=new THREE.Object3D;THREE.ParticleSystem.prototype.constructor=THREE.ParticleSystem;THREE.Line=function(a,c,d){THREE.Object3D.call(this);this.geometry=a;this.materials=c instanceof Array?c:[c];this.type=d!=undefined?d:THREE.LineStrip};THREE.LineStrip=0;THREE.LinePieces=1;
+THREE.Line.prototype=new THREE.Object3D;THREE.Line.prototype.constructor=THREE.Line;THREE.Mesh=function(a,c){THREE.Object3D.call(this);this.geometry=a;this.materials=c&&c.length?c:[c];this.flipSided=!1;this.doubleSided=!1;this.overdraw=!1;if(this.geometry){this.geometry.boundingSphere||this.geometry.computeBoundingSphere();this.boundRadius=a.boundingSphere.radius}};THREE.Mesh.prototype=new THREE.Object3D;THREE.Mesh.prototype.constructor=THREE.Mesh;THREE.Mesh.prototype.supr=THREE.Object3D.prototype;
+THREE.Scene=function(){THREE.Object3D.call(this);this.objects=[];this.lights=[];this.sounds=[];this.fog=null;this.matrixAutoUpdate=!1};THREE.Scene.prototype=new THREE.Object3D;THREE.Scene.prototype.constructor=THREE.Scene;THREE.Scene.prototype.supr=THREE.Object3D.prototype;THREE.Scene.prototype.addChild=function(a){this.supr.addChild.call(this,a);this.addChildRecurse(a)};
+THREE.Scene.prototype.addChildRecurse=function(a){if(a instanceof THREE.Light)this.lights.indexOf(a)===-1&&this.lights.push(a);else if(a instanceof THREE.Sound)this.sounds.indexOf(a)===-1&&this.sounds.push(a);else a instanceof THREE.Camera||a instanceof THREE.Bone||this.objects.indexOf(a)===-1&&this.objects.push(a);for(var c=0;c<a.children.length;c++)this.addChildRecurse(a.children[c])};THREE.Scene.prototype.removeChild=function(a){this.supr.removeChild.call(this,a);this.removeChildRecurse(a)};
+THREE.Scene.prototype.removeChildRecurse=function(a){if(a instanceof THREE.Light){var c=this.lights.indexOf(a);c!==-1&&this.lights.splice(c,1)}else if(a instanceof THREE.Sound){c=this.sounds.indexOf(a);c!==-1&&this.sounds.splice(c,1)}else if(!(a instanceof THREE.Camera)){c=this.objects.indexOf(a);c!==-1&&this.objects.splice(c,1)}for(c=0;c<a.children.length;c++)this.removeChildRecurse(a.children[c])};THREE.Scene.prototype.addObject=THREE.Scene.prototype.addChild;
+THREE.Scene.prototype.removeObject=THREE.Scene.prototype.removeChild;THREE.Scene.prototype.addLight=THREE.Scene.prototype.addChild;THREE.Scene.prototype.removeLight=THREE.Scene.prototype.removeChild;THREE.Fog=function(a,c,d){this.color=new THREE.Color(a);this.near=c||1;this.far=d||1E3};THREE.FogExp2=function(a,c){this.color=new THREE.Color(a);this.density=c||2.5E-4};
+THREE.WebGLRenderer=function(a){function c(e,n,m){var h,l,v,r=e.vertices,q=r.length,s=e.colors,G=s.length,F=e.__vertexArray,I=e.__colorArray,S=e.__sortArray,y=e.__dirtyVertices,M=e.__dirtyColors;if(m.sortParticles){qa.multiplySelf(m.matrixWorld);for(h=0;h<q;h++){l=r[h].position;Aa.copy(l);qa.multiplyVector3(Aa);S[h]=[Aa.z,h]}S.sort(function(ea,Z){return Z[0]-ea[0]});for(h=0;h<q;h++){l=r[S[h][1]].position;v=h*3;F[v]=l.x;F[v+1]=l.y;F[v+2]=l.z}for(h=0;h<G;h++){v=h*3;color=s[S[h][1]];I[v]=color.r;I[v+
+1]=color.g;I[v+2]=color.b}}else{if(y)for(h=0;h<q;h++){l=r[h].position;v=h*3;F[v]=l.x;F[v+1]=l.y;F[v+2]=l.z}if(M)for(h=0;h<G;h++){color=s[h];v=h*3;I[v]=color.r;I[v+1]=color.g;I[v+2]=color.b}}if(y||m.sortParticles){b.bindBuffer(b.ARRAY_BUFFER,e.__webGLVertexBuffer);b.bufferData(b.ARRAY_BUFFER,F,n)}if(M||m.sortParticles){b.bindBuffer(b.ARRAY_BUFFER,e.__webGLColorBuffer);b.bufferData(b.ARRAY_BUFFER,I,n)}}function d(e,n){e.fragment_shader=n.fragment_shader;e.vertex_shader=n.vertex_shader;e.uniforms=Uniforms.clone(n.uniforms)}
+function f(e,n,m,h,l){h.program||ca.initMaterial(h,n,m);var v=h.program,r=v.uniforms,q=h.uniforms;if(v!=aa){b.useProgram(v);aa=v;b.uniformMatrix4fv(r.projectionMatrix,!1,va)}if(m&&(h instanceof THREE.MeshBasicMaterial||h instanceof THREE.MeshLambertMaterial||h instanceof THREE.MeshPhongMaterial||h instanceof THREE.LineBasicMaterial||h instanceof THREE.ParticleBasicMaterial)){q.fogColor.value.setHex(m.color.hex);if(m instanceof THREE.Fog){q.fogNear.value=m.near;q.fogFar.value=m.far}else if(m instanceof
+THREE.FogExp2)q.fogDensity.value=m.density}if(h instanceof THREE.MeshPhongMaterial||h instanceof THREE.MeshLambertMaterial){var s,G,F=0,I=0,S=0,y,M,ea,Z=ca.lights,Q=Z.directional.colors,O=Z.directional.positions,N=Z.point.colors,ra=Z.point.positions,u=0,ma=0;m=G=G=0;for(s=n.length;m<s;m++){G=n[m];y=G.color;M=G.position;ea=G.intensity;if(G instanceof THREE.AmbientLight){F+=y.r;I+=y.g;S+=y.b}else if(G instanceof THREE.DirectionalLight){G=u*3;Q[G]=y.r*ea;Q[G+1]=y.g*ea;Q[G+2]=y.b*ea;O[G]=M.x;O[G+1]=M.y;
+O[G+2]=M.z;u+=1}else if(G instanceof THREE.PointLight){G=ma*3;N[G]=y.r*ea;N[G+1]=y.g*ea;N[G+2]=y.b*ea;ra[G]=M.x;ra[G+1]=M.y;ra[G+2]=M.z;ma+=1}}for(m=u*3;m<Q.length;m++)Q[m]=0;for(m=ma*3;m<N.length;m++)N[m]=0;Z.point.length=ma;Z.directional.length=u;Z.ambient[0]=F;Z.ambient[1]=I;Z.ambient[2]=S;n=ca.lights;q.enableLighting.value=n.directional.length+n.point.length;q.ambientLightColor.value=n.ambient;q.directionalLightColor.value=n.directional.colors;q.directionalLightDirection.value=n.directional.positions;
+q.pointLightColor.value=n.point.colors;q.pointLightPosition.value=n.point.positions}if(h instanceof THREE.MeshBasicMaterial||h instanceof THREE.MeshLambertMaterial||h instanceof THREE.MeshPhongMaterial){q.diffuse.value.setRGB(h.color.r*h.opacity,h.color.g*h.opacity,h.color.b*h.opacity);q.opacity.value=h.opacity;q.map.texture=h.map;q.light_map.texture=h.light_map;q.env_map.texture=h.env_map;q.reflectivity.value=h.reflectivity;q.refraction_ratio.value=h.refraction_ratio;q.combine.value=h.combine;q.useRefract.value=
+h.env_map&&h.env_map.mapping instanceof THREE.CubeRefractionMapping}if(h instanceof THREE.LineBasicMaterial){q.diffuse.value.setRGB(h.color.r*h.opacity,h.color.g*h.opacity,h.color.b*h.opacity);q.opacity.value=h.opacity}else if(h instanceof THREE.ParticleBasicMaterial){q.psColor.value.setRGB(h.color.r*h.opacity,h.color.g*h.opacity,h.color.b*h.opacity);q.opacity.value=h.opacity;q.size.value=h.size;q.map.texture=h.map}else if(h instanceof THREE.MeshPhongMaterial){q.ambient.value.setRGB(h.ambient.r,h.ambient.g,
+h.ambient.b);q.specular.value.setRGB(h.specular.r,h.specular.g,h.specular.b);q.shininess.value=h.shininess}else if(h instanceof THREE.MeshDepthMaterial){q.mNear.value=e.near;q.mFar.value=e.far;q.opacity.value=h.opacity}else if(h instanceof THREE.MeshNormalMaterial)q.opacity.value=h.opacity;for(var ka in q)if(F=v.uniforms[ka]){m=q[ka];s=m.type;n=m.value;if(s=="i")b.uniform1i(F,n);else if(s=="f")b.uniform1f(F,n);else if(s=="fv1")b.uniform1fv(F,n);else if(s=="fv")b.uniform3fv(F,n);else if(s=="v2")b.uniform2f(F,
+n.x,n.y);else if(s=="v3")b.uniform3f(F,n.x,n.y,n.z);else if(s=="c")b.uniform3f(F,n.r,n.g,n.b);else if(s=="t"){b.uniform1i(F,n);if(m=m.texture)if(m.image instanceof Array&&m.image.length==6){if(m.image.length==6){if(m.needsUpdate){if(!m.image.__webGLTextureCube)m.image.__webGLTextureCube=b.createTexture();b.bindTexture(b.TEXTURE_CUBE_MAP,m.image.__webGLTextureCube);b.texParameteri(b.TEXTURE_CUBE_MAP,b.TEXTURE_WRAP_S,b.CLAMP_TO_EDGE);b.texParameteri(b.TEXTURE_CUBE_MAP,b.TEXTURE_WRAP_T,b.CLAMP_TO_EDGE);
+b.texParameteri(b.TEXTURE_CUBE_MAP,b.TEXTURE_MAG_FILTER,b.LINEAR);b.texParameteri(b.TEXTURE_CUBE_MAP,b.TEXTURE_MIN_FILTER,b.LINEAR_MIPMAP_LINEAR);for(s=0;s<6;++s)b.texImage2D(b.TEXTURE_CUBE_MAP_POSITIVE_X+s,0,b.RGBA,b.RGBA,b.UNSIGNED_BYTE,m.image[s]);b.generateMipmap(b.TEXTURE_CUBE_MAP);b.bindTexture(b.TEXTURE_CUBE_MAP,null);m.needsUpdate=!1}b.activeTexture(b.TEXTURE0+n);b.bindTexture(b.TEXTURE_CUBE_MAP,m.image.__webGLTextureCube)}}else{if(m.needsUpdate){if(m.__wasSetOnce){b.bindTexture(b.TEXTURE_2D,
+m.__webGLTexture);b.texSubImage2D(b.TEXTURE_2D,0,0,0,b.RGBA,b.UNSIGNED_BYTE,m.image);b.texParameteri(b.TEXTURE_2D,b.TEXTURE_WRAP_S,L(m.wrap_s));b.texParameteri(b.TEXTURE_2D,b.TEXTURE_WRAP_T,L(m.wrap_t));b.texParameteri(b.TEXTURE_2D,b.TEXTURE_MAG_FILTER,L(m.mag_filter));b.texParameteri(b.TEXTURE_2D,b.TEXTURE_MIN_FILTER,L(m.min_filter));b.generateMipmap(b.TEXTURE_2D);b.bindTexture(b.TEXTURE_2D,null)}else{m.__webGLTexture=b.createTexture();b.bindTexture(b.TEXTURE_2D,m.__webGLTexture);b.texImage2D(b.TEXTURE_2D,
+0,b.RGBA,b.RGBA,b.UNSIGNED_BYTE,m.image);b.texParameteri(b.TEXTURE_2D,b.TEXTURE_WRAP_S,L(m.wrap_s));b.texParameteri(b.TEXTURE_2D,b.TEXTURE_WRAP_T,L(m.wrap_t));b.texParameteri(b.TEXTURE_2D,b.TEXTURE_MAG_FILTER,L(m.mag_filter));b.texParameteri(b.TEXTURE_2D,b.TEXTURE_MIN_FILTER,L(m.min_filter));b.generateMipmap(b.TEXTURE_2D);b.bindTexture(b.TEXTURE_2D,null);m.__wasSetOnce=!0}m.needsUpdate=!1}b.activeTexture(b.TEXTURE0+n);b.bindTexture(b.TEXTURE_2D,m.__webGLTexture)}}}b.uniformMatrix4fv(r.modelViewMatrix,
+!1,l._modelViewMatrixArray);b.uniformMatrix3fv(r.normalMatrix,!1,l._normalMatrixArray);(h instanceof THREE.MeshShaderMaterial||h instanceof THREE.MeshPhongMaterial||h.env_map)&&b.uniform3f(r.cameraPosition,e.position.x,e.position.y,e.position.z);(h instanceof THREE.MeshShaderMaterial||h.env_map||h.skinning)&&b.uniformMatrix4fv(r.objectMatrix,!1,l._objectMatrixArray);(h instanceof THREE.MeshPhongMaterial||h instanceof THREE.MeshLambertMaterial||h instanceof THREE.MeshShaderMaterial||h.skinning)&&b.uniformMatrix4fv(r.viewMatrix,
+!1,Ha);if(h.skinning){b.uniformMatrix4fv(r.cameraInverseMatrix,!1,wa);b.uniformMatrix4fv(r.boneGlobalMatrices,!1,l.boneMatrices)}return v}function g(e,n,m,h,l,v){e=f(e,n,m,h,v).attributes;b.bindBuffer(b.ARRAY_BUFFER,l.__webGLVertexBuffer);b.vertexAttribPointer(e.position,3,b.FLOAT,!1,0,0);if(e.color>=0){b.bindBuffer(b.ARRAY_BUFFER,l.__webGLColorBuffer);b.vertexAttribPointer(e.color,3,b.FLOAT,!1,0,0)}if(e.normal>=0){b.bindBuffer(b.ARRAY_BUFFER,l.__webGLNormalBuffer);b.vertexAttribPointer(e.normal,
+3,b.FLOAT,!1,0,0)}if(e.tangent>=0){b.bindBuffer(b.ARRAY_BUFFER,l.__webGLTangentBuffer);b.vertexAttribPointer(e.tangent,4,b.FLOAT,!1,0,0)}if(e.uv>=0)if(l.__webGLUVBuffer){b.bindBuffer(b.ARRAY_BUFFER,l.__webGLUVBuffer);b.vertexAttribPointer(e.uv,2,b.FLOAT,!1,0,0);b.enableVertexAttribArray(e.uv)}else b.disableVertexAttribArray(e.uv);if(e.uv2>=0)if(l.__webGLUV2Buffer){b.bindBuffer(b.ARRAY_BUFFER,l.__webGLUV2Buffer);b.vertexAttribPointer(e.uv2,2,b.FLOAT,!1,0,0);b.enableVertexAttribArray(e.uv2)}else b.disableVertexAttribArray(e.uv2);
+if(h.skinning&&e.skinVertexA>=0&&e.skinVertexB>=0&&e.skinIndex>=0&&e.skinWeight>=0){b.bindBuffer(b.ARRAY_BUFFER,l.__webGLSkinVertexABuffer);b.vertexAttribPointer(e.skinVertexA,4,b.FLOAT,!1,0,0);b.bindBuffer(b.ARRAY_BUFFER,l.__webGLSkinVertexBBuffer);b.vertexAttribPointer(e.skinVertexB,4,b.FLOAT,!1,0,0);b.bindBuffer(b.ARRAY_BUFFER,l.__webGLSkinIndicesBuffer);b.vertexAttribPointer(e.skinIndex,4,b.FLOAT,!1,0,0);b.bindBuffer(b.ARRAY_BUFFER,l.__webGLSkinWeightsBuffer);b.vertexAttribPointer(e.skinWeight,
+4,b.FLOAT,!1,0,0)}if(v instanceof THREE.Mesh)if(h.wireframe){b.lineWidth(h.wireframe_linewidth);b.bindBuffer(b.ELEMENT_ARRAY_BUFFER,l.__webGLLineBuffer);b.drawElements(b.LINES,l.__webGLLineCount,b.UNSIGNED_SHORT,0)}else{b.bindBuffer(b.ELEMENT_ARRAY_BUFFER,l.__webGLFaceBuffer);b.drawElements(b.TRIANGLES,l.__webGLFaceCount,b.UNSIGNED_SHORT,0)}else if(v instanceof THREE.Line){v=v.type==THREE.LineStrip?b.LINE_STRIP:b.LINES;b.lineWidth(h.linewidth);b.drawArrays(v,0,l.__webGLLineCount)}else if(v instanceof
+THREE.ParticleSystem)b.drawArrays(b.POINTS,0,l.__webGLParticleCount);else v instanceof THREE.Ribbon&&b.drawArrays(b.TRIANGLE_STRIP,0,l.__webGLVertexCount)}function j(e,n){if(!e.__webGLVertexBuffer)e.__webGLVertexBuffer=b.createBuffer();if(!e.__webGLNormalBuffer)e.__webGLNormalBuffer=b.createBuffer();if(e.hasPos){b.bindBuffer(b.ARRAY_BUFFER,e.__webGLVertexBuffer);b.bufferData(b.ARRAY_BUFFER,e.positionArray,b.DYNAMIC_DRAW);b.enableVertexAttribArray(n.attributes.position);b.vertexAttribPointer(n.attributes.position,
+3,b.FLOAT,!1,0,0)}if(e.hasNormal){b.bindBuffer(b.ARRAY_BUFFER,e.__webGLNormalBuffer);b.bufferData(b.ARRAY_BUFFER,e.normalArray,b.DYNAMIC_DRAW);b.enableVertexAttribArray(n.attributes.normal);b.vertexAttribPointer(n.attributes.normal,3,b.FLOAT,!1,0,0)}b.drawArrays(b.TRIANGLES,0,e.count);e.count=0}function k(e){if(ga!=e.doubleSided){e.doubleSided?b.disable(b.CULL_FACE):b.enable(b.CULL_FACE);ga=e.doubleSided}if(da!=e.flipSided){e.flipSided?b.frontFace(b.CW):b.frontFace(b.CCW);da=e.flipSided}}function o(e){if(na!=
+e){e?b.enable(b.DEPTH_TEST):b.disable(b.DEPTH_TEST);na=e}}function i(e){$[0].set(e.n41-e.n11,e.n42-e.n12,e.n43-e.n13,e.n44-e.n14);$[1].set(e.n41+e.n11,e.n42+e.n12,e.n43+e.n13,e.n44+e.n14);$[2].set(e.n41+e.n21,e.n42+e.n22,e.n43+e.n23,e.n44+e.n24);$[3].set(e.n41-e.n21,e.n42-e.n22,e.n43-e.n23,e.n44-e.n24);$[4].set(e.n41-e.n31,e.n42-e.n32,e.n43-e.n33,e.n44-e.n34);$[5].set(e.n41+e.n31,e.n42+e.n32,e.n43+e.n33,e.n44+e.n34);var n;for(e=0;e<6;e++){n=$[e];n.divideScalar(Math.sqrt(n.x*n.x+n.y*n.y+n.z*n.z))}}
+function t(e){for(var n=e.matrixWorld,m=-e.geometry.boundingSphere.radius*Math.max(e.scale.x,Math.max(e.scale.y,e.scale.z)),h=0;h<6;h++){e=$[h].x*n.n14+$[h].y*n.n24+$[h].z*n.n34+$[h].w;if(e<=m)return!1}return!0}function w(e,n){e.list[e.count]=n;e.count+=1}function x(e){var n,m,h=e.object,l=e.opaque,v=e.transparent;v.count=0;e=l.count=0;for(n=h.materials.length;e<n;e++){m=h.materials[e];m.opacity&&m.opacity<1||m.blending!=THREE.NormalBlending?w(v,m):w(l,m)}}function z(e){var n,m,h,l,v=e.object,r=e.buffer,
+q=e.opaque,s=e.transparent;s.count=0;e=q.count=0;for(h=v.materials.length;e<h;e++){n=v.materials[e];if(n instanceof THREE.MeshFaceMaterial){n=0;for(m=r.materials.length;n<m;n++)(l=r.materials[n])&&(l.opacity&&l.opacity<1||l.blending!=THREE.NormalBlending?w(s,l):w(q,l))}else{l=n;l.opacity&&l.opacity<1||l.blending!=THREE.NormalBlending?w(s,l):w(q,l)}}}function A(e,n){return n.z-e.z}function E(e,n,m,h,l){if(n[m]==undefined){e.push({buffer:h,object:l,opaque:{list:[],count:0},transparent:{list:[],count:0}});
+n[m]=1}}function H(e,n){e._modelViewMatrix.multiplyToArray(n.matrixWorld,e.matrixWorld,e._modelViewMatrixArray);THREE.Matrix4.makeInvert3x3(e._modelViewMatrix).transposeIntoArray(e._normalMatrixArray)}function K(e){if(e!=ja){switch(e){case THREE.AdditiveBlending:b.blendEquation(b.FUNC_ADD);b.blendFunc(b.ONE,b.ONE);break;case THREE.SubtractiveBlending:b.blendFunc(b.DST_COLOR,b.ZERO);break;case THREE.BillboardBlending:b.blendEquation(b.FUNC_ADD);b.blendFunc(b.SRC_ALPHA,b.ONE_MINUS_SRC_ALPHA);break;
+case THREE.ReverseSubtractiveBlending:b.blendEquation(b.FUNC_REVERSE_SUBTRACT);b.blendFunc(b.ONE,b.ONE);break;default:b.blendEquation(b.FUNC_ADD);b.blendFunc(b.ONE,b.ONE_MINUS_SRC_ALPHA)}ja=e}}function J(e,n){if(e&&!e.__webGLFramebuffer){e.__webGLFramebuffer=b.createFramebuffer();e.__webGLRenderbuffer=b.createRenderbuffer();e.__webGLTexture=b.createTexture();b.bindRenderbuffer(b.RENDERBUFFER,e.__webGLRenderbuffer);b.renderbufferStorage(b.RENDERBUFFER,b.DEPTH_COMPONENT16,e.width,e.height);b.bindTexture(b.TEXTURE_2D,
+e.__webGLTexture);b.texParameteri(b.TEXTURE_2D,b.TEXTURE_WRAP_S,L(e.wrap_s));b.texParameteri(b.TEXTURE_2D,b.TEXTURE_WRAP_T,L(e.wrap_t));b.texParameteri(b.TEXTURE_2D,b.TEXTURE_MAG_FILTER,L(e.mag_filter));b.texParameteri(b.TEXTURE_2D,b.TEXTURE_MIN_FILTER,L(e.min_filter));b.texImage2D(b.TEXTURE_2D,0,L(e.format),e.width,e.height,0,L(e.format),L(e.type),null);b.bindFramebuffer(b.FRAMEBUFFER,e.__webGLFramebuffer);b.framebufferTexture2D(b.FRAMEBUFFER,b.COLOR_ATTACHMENT0,b.TEXTURE_2D,e.__webGLTexture,0);
+b.framebufferRenderbuffer(b.FRAMEBUFFER,b.DEPTH_ATTACHMENT,b.RENDERBUFFER,e.__webGLRenderbuffer);b.bindTexture(b.TEXTURE_2D,null);b.bindRenderbuffer(b.RENDERBUFFER,null);b.bindFramebuffer(b.FRAMEBUFFER,null)}var m,h,l;if(e){m=e.__webGLFramebuffer;h=e.width;l=e.height}else{m=null;h=P.width;l=P.height}if(m!=ba){b.bindFramebuffer(b.FRAMEBUFFER,m);b.viewport(0,0,h,l);n&&b.clear(b.COLOR_BUFFER_BIT|b.DEPTH_BUFFER_BIT);ba=m}}function R(e,n){var m;if(e=="fragment")m=b.createShader(b.FRAGMENT_SHADER);else e==
+"vertex"&&(m=b.createShader(b.VERTEX_SHADER));b.shaderSource(m,n);b.compileShader(m);if(!b.getShaderParameter(m,b.COMPILE_STATUS)){alert(b.getShaderInfoLog(m));return null}return m}function L(e){switch(e){case THREE.RepeatWrapping:return b.REPEAT;case THREE.ClampToEdgeWrapping:return b.CLAMP_TO_EDGE;case THREE.MirroredRepeatWrapping:return b.MIRRORED_REPEAT;case THREE.NearestFilter:return b.NEAREST;case THREE.NearestMipMapNearestFilter:return b.NEAREST_MIPMAP_NEAREST;case THREE.NearestMipMapLinearFilter:return b.NEAREST_MIPMAP_LINEAR;
+case THREE.LinearFilter:return b.LINEAR;case THREE.LinearMipMapNearestFilter:return b.LINEAR_MIPMAP_NEAREST;case THREE.LinearMipMapLinearFilter:return b.LINEAR_MIPMAP_LINEAR;case THREE.ByteType:return b.BYTE;case THREE.UnsignedByteType:return b.UNSIGNED_BYTE;case THREE.ShortType:return b.SHORT;case THREE.UnsignedShortType:return b.UNSIGNED_SHORT;case THREE.IntType:return b.INT;case THREE.UnsignedShortType:return b.UNSIGNED_INT;case THREE.FloatType:return b.FLOAT;case THREE.AlphaFormat:return b.ALPHA;
+case THREE.RGBFormat:return b.RGB;case THREE.RGBAFormat:return b.RGBA;case THREE.LuminanceFormat:return b.LUMINANCE;case THREE.LuminanceAlphaFormat:return b.LUMINANCE_ALPHA}return 0}var P=document.createElement("canvas"),b,aa=null,ba=null,ca=this,ga=null,da=null,ja=null,na=null,$=[new THREE.Vector4,new THREE.Vector4,new THREE.Vector4,new THREE.Vector4,new THREE.Vector4,new THREE.Vector4],qa=new THREE.Matrix4,va=new Float32Array(16),wa=new Float32Array(16),Ha=new Float32Array(16),Aa=new THREE.Vector4,
+Ia=!0,Oa=new THREE.Color(0),Pa=0;if(a){if(a.antialias!==undefined)Ia=a.antialias;a.clearColor!==undefined&&Oa.setHex(a.clearColor);if(a.clearAlpha!==undefined)Pa=a.clearAlpha}this.domElement=P;this.autoClear=!0;this.sortObjects=!1;(function(e,n,m){try{b=P.getContext("experimental-webgl",{antialias:e})}catch(h){console.log(h)}if(!b)throw"cannot create webgl context";b.clearColor(0,0,0,1);b.clearDepth(1);b.enable(b.DEPTH_TEST);b.depthFunc(b.LEQUAL);b.frontFace(b.CCW);b.cullFace(b.BACK);b.enable(b.CULL_FACE);
+b.enable(b.BLEND);b.blendFunc(b.ONE,b.ONE_MINUS_SRC_ALPHA);b.clearColor(n.r,n.g,n.b,m);_cullEnabled=!0})(Ia,Oa,Pa);this.context=b;this.lights={ambient:[0,0,0],directional:{length:0,colors:[],positions:[]},point:{length:0,colors:[],positions:[]}};this.setSize=function(e,n){P.width=e;P.height=n;b.viewport(0,0,P.width,P.height)};this.setClearColorHex=function(e,n){var m=new THREE.Color(e);b.clearColor(m.r,m.g,m.b,n)};this.setClearColor=function(e,n){b.clearColor(e.r,e.g,e.b,n)};this.clear=function(){b.clear(b.COLOR_BUFFER_BIT|
+b.DEPTH_BUFFER_BIT)};this.initMaterial=function(e,n,m){var h,l;if(e instanceof THREE.MeshDepthMaterial)d(e,THREE.ShaderLib.depth);else if(e instanceof THREE.MeshNormalMaterial)d(e,THREE.ShaderLib.normal);else if(e instanceof THREE.MeshBasicMaterial)d(e,THREE.ShaderLib.basic);else if(e instanceof THREE.MeshLambertMaterial)d(e,THREE.ShaderLib.lambert);else if(e instanceof THREE.MeshPhongMaterial)d(e,THREE.ShaderLib.phong);else if(e instanceof THREE.LineBasicMaterial)d(e,THREE.ShaderLib.basic);else e instanceof
+THREE.ParticleBasicMaterial&&d(e,THREE.ShaderLib.particle_basic);var v,r,q,s;l=q=s=0;for(v=n.length;l<v;l++){r=n[l];r instanceof THREE.DirectionalLight&&q++;r instanceof THREE.PointLight&&s++}if(s+q<=4)n=q;else{n=Math.ceil(4*q/(s+q));s=4-n}l={directional:n,point:s};s=e.fragment_shader;n=e.vertex_shader;v={fog:m,map:e.map,env_map:e.env_map,light_map:e.light_map,vertex_colors:e.vertex_colors,skinning:e.skinning,maxDirLights:l.directional,maxPointLights:l.point};m=b.createProgram();l=["#ifdef GL_ES\nprecision highp float;\n#endif",
+"#define MAX_DIR_LIGHTS "+v.maxDirLights,"#define MAX_POINT_LIGHTS "+v.maxPointLights,v.fog?"#define USE_FOG":"",v.fog instanceof THREE.FogExp2?"#define FOG_EXP2":"",v.map?"#define USE_MAP":"",v.env_map?"#define USE_ENVMAP":"",v.light_map?"#define USE_LIGHTMAP":"",v.vertex_colors?"#define USE_COLOR":"","uniform mat4 viewMatrix;\nuniform vec3 cameraPosition;\n"].join("\n");v=[b.getParameter(b.MAX_VERTEX_TEXTURE_IMAGE_UNITS)>0?"#define VERTEX_TEXTURES":"","#define MAX_DIR_LIGHTS "+v.maxDirLights,"#define MAX_POINT_LIGHTS "+
+v.maxPointLights,v.map?"#define USE_MAP":"",v.env_map?"#define USE_ENVMAP":"",v.light_map?"#define USE_LIGHTMAP":"",v.vertex_colors?"#define USE_COLOR":"",v.skinning?"#define USE_SKINNING":"","uniform mat4 objectMatrix;\nuniform mat4 modelViewMatrix;\nuniform mat4 projectionMatrix;\nuniform mat4 viewMatrix;\nuniform mat3 normalMatrix;\nuniform vec3 cameraPosition;\nuniform mat4 cameraInverseMatrix;\nattribute vec3 position;\nattribute vec3 normal;\nattribute vec3 color;\nattribute vec2 uv;\nattribute vec2 uv2;\nattribute vec4 skinVertexA;\nattribute vec4 skinVertexB;\nattribute vec4 skinIndex;\nattribute vec4 skinWeight;\n"].join("\n");
+b.attachShader(m,R("fragment",l+s));b.attachShader(m,R("vertex",v+n));b.linkProgram(m);b.getProgramParameter(m,b.LINK_STATUS)||alert("Could not initialise shaders\nVALIDATE_STATUS: "+b.getProgramParameter(m,b.VALIDATE_STATUS)+", gl error ["+b.getError()+"]");m.uniforms={};m.attributes={};e.program=m;m=["viewMatrix","modelViewMatrix","projectionMatrix","normalMatrix","objectMatrix","cameraPosition","cameraInverseMatrix","boneGlobalMatrices"];for(h in e.uniforms)m.push(h);h=e.program;s=0;for(n=m.length;s<
+n;s++){l=m[s];h.uniforms[l]=b.getUniformLocation(h,l)}h=e.program;m=["position","normal","uv","uv2","tangent","color","skinVertexA","skinVertexB","skinIndex","skinWeight"];s=0;for(n=m.length;s<n;s++){l=m[s];h.attributes[l]=b.getAttribLocation(h,l)}h=e.program.attributes;b.enableVertexAttribArray(h.position);h.color>=0&&b.enableVertexAttribArray(h.color);h.normal>=0&&b.enableVertexAttribArray(h.normal);h.tangent>=0&&b.enableVertexAttribArray(h.tangent);if(e.skinning&&h.skinVertexA>=0&&h.skinVertexB>=
+0&&h.skinIndex>=0&&h.skinWeight>=0){b.enableVertexAttribArray(h.skinVertexA);b.enableVertexAttribArray(h.skinVertexB);b.enableVertexAttribArray(h.skinIndex);b.enableVertexAttribArray(h.skinWeight)}};this.render=function(e,n,m,h){var l,v,r,q,s,G,F,I,S=e.lights,y=e.fog;n.matrixAutoUpdate&&n.update();n.matrixWorld.flattenToArray(Ha);n.projectionMatrix.flattenToArray(va);n.inverseMatrix.flattenToArray(wa);qa.multiply(n.projectionMatrix,n.matrixWorld);i(qa);THREE.AnimationHandler&&THREE.AnimationHandler.update();
+e.update(undefined,!1,n);this.initWebGLObjects(e,n);J(m,h!==undefined?h:!0);this.autoClear&&this.clear();s=e.__webGLObjects.length;for(h=0;h<s;h++){l=e.__webGLObjects[h];F=l.object;if(F.visible)if(!(F instanceof THREE.Mesh)||t(F)){F.matrixWorld.flattenToArray(F._objectMatrixArray);H(F,n);z(l);l.render=!0;if(this.sortObjects){Aa.copy(F.position);qa.multiplyVector3(Aa);l.z=Aa.z}}else l.render=!1;else l.render=!1}this.sortObjects&&e.__webGLObjects.sort(A);G=e.__webGLObjectsImmediate.length;for(h=0;h<
+G;h++){l=e.__webGLObjectsImmediate[h];F=l.object;if(F.visible){F.matrixAutoUpdate&&F.matrixWorld.flattenToArray(F._objectMatrixArray);H(F,n);x(l)}}K(THREE.NormalBlending);for(h=0;h<s;h++){l=e.__webGLObjects[h];if(l.render){F=l.object;I=l.buffer;r=l.opaque;k(F);for(l=0;l<r.count;l++){q=r.list[l];o(q.depth_test);g(n,S,y,q,I,F)}}}for(h=0;h<G;h++){l=e.__webGLObjectsImmediate[h];F=l.object;if(F.visible){r=l.opaque;k(F);for(l=0;l<r.count;l++){q=r.list[l];o(q.depth_test);v=f(n,S,y,q,F);F.render(function(M){j(M,
+v)})}}}for(h=0;h<s;h++){l=e.__webGLObjects[h];if(l.render){F=l.object;I=l.buffer;r=l.transparent;k(F);for(l=0;l<r.count;l++){q=r.list[l];K(q.blending);o(q.depth_test);g(n,S,y,q,I,F)}}}for(h=0;h<G;h++){l=e.__webGLObjectsImmediate[h];F=l.object;if(F.visible){r=l.transparent;k(F);for(l=0;l<r.count;l++){q=r.list[l];K(q.blending);o(q.depth_test);v=f(n,S,y,q,F);F.render(function(M){j(M,v)})}}}if(m&&m.min_filter!==THREE.NearestFilter&&m.min_filter!==THREE.LinearFilter){b.bindTexture(b.TEXTURE_2D,m.__webGLTexture);
+b.generateMipmap(b.TEXTURE_2D);b.bindTexture(b.TEXTURE_2D,null)}};this.initWebGLObjects=function(e,n){var m,h,l;if(!e.__webGLObjects){e.__webGLObjects=[];e.__webGLObjectsMap={};e.__webGLObjectsImmediate=[]}m=0;for(h=e.objects.length;m<h;m++){l=e.objects[m];var v=e,r=n,q=void 0,s=void 0,G=void 0,F=void 0;s=l.geometry;if(v.__webGLObjectsMap[l.id]==undefined){v.__webGLObjectsMap[l.id]={};l._modelViewMatrix=new THREE.Matrix4;l._normalMatrixArray=new Float32Array(9);l._modelViewMatrixArray=new Float32Array(16);
+l._objectMatrixArray=new Float32Array(16);l.matrixWorld.flattenToArray(l._objectMatrixArray)}F=v.__webGLObjectsMap[l.id];objlist=v.__webGLObjects;if(l instanceof THREE.Mesh){for(q in s.geometryChunks){G=s.geometryChunks[q];if(!G.__webGLVertexBuffer){r=G;r.__webGLVertexBuffer=b.createBuffer();r.__webGLNormalBuffer=b.createBuffer();r.__webGLTangentBuffer=b.createBuffer();r.__webGLColorBuffer=b.createBuffer();r.__webGLUVBuffer=b.createBuffer();r.__webGLUV2Buffer=b.createBuffer();r.__webGLSkinVertexABuffer=
+b.createBuffer();r.__webGLSkinVertexBBuffer=b.createBuffer();r.__webGLSkinIndicesBuffer=b.createBuffer();r.__webGLSkinWeightsBuffer=b.createBuffer();r.__webGLFaceBuffer=b.createBuffer();r.__webGLLineBuffer=b.createBuffer();r=G;var I=l,S=void 0,y=void 0,M=0,ea=v=0,Z=I.geometry.faces,Q=r.faces;S=0;for(y=Q.length;S<y;S++){fi=Q[S];face=Z[fi];if(face instanceof THREE.Face3){M+=3;v+=1;ea+=3}else if(face instanceof THREE.Face4){M+=4;v+=2;ea+=4}}r.__vertexArray=new Float32Array(M*3);r.__normalArray=new Float32Array(M*
+3);r.__tangentArray=new Float32Array(M*4);r.__colorArray=new Float32Array(M*3);r.__uvArray=new Float32Array(M*2);r.__uv2Array=new Float32Array(M*2);r.__skinVertexAArray=new Float32Array(M*4);r.__skinVertexBArray=new Float32Array(M*4);r.__skinIndexArray=new Float32Array(M*4);r.__skinWeightArray=new Float32Array(M*4);r.__faceArray=new Uint16Array(v*3);r.__lineArray=new Uint16Array(ea*2);y=S=r;M=void 0;Z=void 0;var O=void 0,N=void 0;O=void 0;Q=!1;M=0;for(Z=I.materials.length;M<Z;M++){O=I.materials[M];
+if(O instanceof THREE.MeshFaceMaterial){O=0;for(N=y.materials.length;O<N;O++)if(y.materials[O]&&y.materials[O].shading!=undefined&&y.materials[O].shading==THREE.SmoothShading){Q=!0;break}}else if(O&&O.shading!=undefined&&O.shading==THREE.SmoothShading){Q=!0;break}if(Q)break}S.__needsSmoothNormals=Q;r.__webGLFaceCount=v*3;r.__webGLLineCount=ea*2;s.__dirtyVertices=!0;s.__dirtyElements=!0;s.__dirtyUvs=!0;s.__dirtyNormals=!0;s.__dirtyTangents=!0;s.__dirtyColors=!0}if(s.__dirtyVertices||s.__dirtyElements||
+s.__dirtyUvs||s.__dirtyNormals||s.__dirtyColors||s.__dirtyTangents){r=G;v=b.DYNAMIC_DRAW;ea=void 0;S=void 0;var ra=void 0,u=void 0,ma=void 0,ka=void 0,ua=void 0;ra=void 0;var B=void 0,C=void 0,D=void 0,T=void 0;B=void 0;C=void 0;D=void 0;u=void 0;B=void 0;C=void 0;D=void 0;T=void 0;B=void 0;C=void 0;D=void 0;T=void 0;B=void 0;C=void 0;D=void 0;T=void 0;B=void 0;C=void 0;D=void 0;T=void 0;B=void 0;C=void 0;D=void 0;T=void 0;u=void 0;ka=void 0;ma=void 0;ua=void 0;var oa=N=O=Q=Z=M=I=y=0,fa=0,p=0,ha=
+r.__vertexArray,Fa=r.__uvArray,Ga=r.__uv2Array,ta=r.__normalArray,U=r.__tangentArray,ia=r.__colorArray,V=r.__skinVertexAArray,W=r.__skinVertexBArray,X=r.__skinIndexArray,Y=r.__skinWeightArray,xa=r.__faceArray,pa=r.__lineArray,Qa=r.__needsSmoothNormals,la=l.geometry,Ja=la.__dirtyVertices,Ka=la.__dirtyElements,Ea=la.__dirtyUvs,La=la.__dirtyNormals,Ma=la.__dirtyTangents,Na=la.__dirtyColors,sa=la.vertices,Ra=r.faces,Sa=la.faces,Ta=la.uvs,Ua=la.uvs2,ya=la.colors,Ba=la.skinVerticesA,Ca=la.skinVerticesB,
+Da=la.skinIndices,za=la.skinWeights;ea=0;for(S=Ra.length;ea<S;ea++){ra=Ra[ea];u=Sa[ra];ua=Ta[ra];ra=Ua[ra];ma=u.vertexNormals;ka=u.normal;if(u instanceof THREE.Face3){if(Ja){B=sa[u.a].position;C=sa[u.b].position;D=sa[u.c].position;ha[I]=B.x;ha[I+1]=B.y;ha[I+2]=B.z;ha[I+3]=C.x;ha[I+4]=C.y;ha[I+5]=C.z;ha[I+6]=D.x;ha[I+7]=D.y;ha[I+8]=D.z;I+=9}if(za.length){B=za[u.a];C=za[u.b];D=za[u.c];Y[p]=B.x;Y[p+1]=B.y;Y[p+2]=B.z;Y[p+3]=B.w;Y[p+4]=C.x;Y[p+5]=C.y;Y[p+6]=C.z;Y[p+7]=C.w;Y[p+8]=D.x;Y[p+9]=D.y;Y[p+10]=
+D.z;Y[p+11]=D.w;B=Da[u.a];C=Da[u.b];D=Da[u.c];X[p]=B.x;X[p+1]=B.y;X[p+2]=B.z;X[p+3]=B.w;X[p+4]=C.x;X[p+5]=C.y;X[p+6]=C.z;X[p+7]=C.w;X[p+8]=D.x;X[p+9]=D.y;X[p+10]=D.z;X[p+11]=D.w;B=Ba[u.a];C=Ba[u.b];D=Ba[u.c];V[p]=B.x;V[p+1]=B.y;V[p+2]=B.z;V[p+3]=1;V[p+4]=C.x;V[p+5]=C.y;V[p+6]=C.z;V[p+7]=1;V[p+8]=D.x;V[p+9]=D.y;V[p+10]=D.z;V[p+11]=1;B=Ca[u.a];C=Ca[u.b];D=Ca[u.c];W[p]=B.x;W[p+1]=B.y;W[p+2]=B.z;W[p+3]=1;W[p+4]=C.x;W[p+5]=C.y;W[p+6]=C.z;W[p+7]=1;W[p+8]=D.x;W[p+9]=D.y;W[p+10]=D.z;W[p+11]=1;p+=12}if(Na&&
+ya.length){B=ya[u.a];C=ya[u.b];D=ya[u.c];ia[fa]=B.r;ia[fa+1]=B.g;ia[fa+2]=B.b;ia[fa+3]=C.r;ia[fa+4]=C.g;ia[fa+5]=C.b;ia[fa+6]=D.r;ia[fa+7]=D.g;ia[fa+8]=D.b;fa+=9}if(Ma&&la.hasTangents){B=sa[u.a].tangent;C=sa[u.b].tangent;D=sa[u.c].tangent;U[N]=B.x;U[N+1]=B.y;U[N+2]=B.z;U[N+3]=B.w;U[N+4]=C.x;U[N+5]=C.y;U[N+6]=C.z;U[N+7]=C.w;U[N+8]=D.x;U[N+9]=D.y;U[N+10]=D.z;U[N+11]=D.w;N+=12}if(La)if(ma.length==3&&Qa)for(u=0;u<3;u++){ka=ma[u];ta[O]=ka.x;ta[O+1]=ka.y;ta[O+2]=ka.z;O+=3}else for(u=0;u<3;u++){ta[O]=ka.x;
+ta[O+1]=ka.y;ta[O+2]=ka.z;O+=3}if(Ea&&ua)for(u=0;u<3;u++){ma=ua[u];Fa[M]=ma.u;Fa[M+1]=ma.v;M+=2}if(Ea&&ra)for(u=0;u<3;u++){ua=ra[u];Ga[Z]=ua.u;Ga[Z+1]=ua.v;Z+=2}if(Ka){xa[Q]=y;xa[Q+1]=y+1;xa[Q+2]=y+2;Q+=3;pa[oa]=y;pa[oa+1]=y+1;pa[oa+2]=y;pa[oa+3]=y+2;pa[oa+4]=y+1;pa[oa+5]=y+2;oa+=6;y+=3}}else if(u instanceof THREE.Face4){if(Ja){B=sa[u.a].position;C=sa[u.b].position;D=sa[u.c].position;T=sa[u.d].position;ha[I]=B.x;ha[I+1]=B.y;ha[I+2]=B.z;ha[I+3]=C.x;ha[I+4]=C.y;ha[I+5]=C.z;ha[I+6]=D.x;ha[I+7]=D.y;ha[I+
+8]=D.z;ha[I+9]=T.x;ha[I+10]=T.y;ha[I+11]=T.z;I+=12}if(za.length){B=za[u.a];C=za[u.b];D=za[u.c];T=za[u.d];Y[p]=B.x;Y[p+1]=B.y;Y[p+2]=B.z;Y[p+3]=B.w;Y[p+4]=C.x;Y[p+5]=C.y;Y[p+6]=C.z;Y[p+7]=C.w;Y[p+8]=D.x;Y[p+9]=D.y;Y[p+10]=D.z;Y[p+11]=D.w;Y[p+12]=T.x;Y[p+13]=T.y;Y[p+14]=T.z;Y[p+15]=T.w;B=Da[u.a];C=Da[u.b];D=Da[u.c];T=Da[u.d];X[p]=B.x;X[p+1]=B.y;X[p+2]=B.z;X[p+3]=B.w;X[p+4]=C.x;X[p+5]=C.y;X[p+6]=C.z;X[p+7]=C.w;X[p+8]=D.x;X[p+9]=D.y;X[p+10]=D.z;X[p+11]=D.w;X[p+12]=T.x;X[p+13]=T.y;X[p+14]=T.z;X[p+15]=
+T.w;B=Ba[u.a];C=Ba[u.b];D=Ba[u.c];T=Ba[u.d];V[p]=B.x;V[p+1]=B.y;V[p+2]=B.z;V[p+3]=1;V[p+4]=C.x;V[p+5]=C.y;V[p+6]=C.z;V[p+7]=1;V[p+8]=D.x;V[p+9]=D.y;V[p+10]=D.z;V[p+11]=1;V[p+12]=T.x;V[p+13]=T.y;V[p+14]=T.z;V[p+15]=1;B=Ca[u.a];C=Ca[u.b];D=Ca[u.c];T=Ca[u.d];W[p]=B.x;W[p+1]=B.y;W[p+2]=B.z;W[p+3]=1;W[p+4]=C.x;W[p+5]=C.y;W[p+6]=C.z;W[p+7]=1;W[p+8]=D.x;W[p+9]=D.y;W[p+10]=D.z;W[p+11]=1;W[p+12]=T.x;W[p+13]=T.y;W[p+14]=T.z;W[p+15]=1;p+=16}if(Na&&ya.length){B=ya[u.a];C=ya[u.b];D=ya[u.c];T=ya[u.d];ia[fa]=B.r;
+ia[fa+1]=B.g;ia[fa+2]=B.b;ia[fa+3]=C.r;ia[fa+4]=C.g;ia[fa+5]=C.b;ia[fa+6]=D.r;ia[fa+7]=D.g;ia[fa+8]=D.b;ia[fa+9]=T.r;ia[fa+10]=T.g;ia[fa+11]=T.b;fa+=12}if(Ma&&la.hasTangents){B=sa[u.a].tangent;C=sa[u.b].tangent;D=sa[u.c].tangent;u=sa[u.d].tangent;U[N]=B.x;U[N+1]=B.y;U[N+2]=B.z;U[N+3]=B.w;U[N+4]=C.x;U[N+5]=C.y;U[N+6]=C.z;U[N+7]=C.w;U[N+8]=D.x;U[N+9]=D.y;U[N+10]=D.z;U[N+11]=D.w;U[N+12]=u.x;U[N+13]=u.y;U[N+14]=u.z;U[N+15]=u.w;N+=16}if(La)if(ma.length==4&&Qa)for(u=0;u<4;u++){ka=ma[u];ta[O]=ka.x;ta[O+
+1]=ka.y;ta[O+2]=ka.z;O+=3}else for(u=0;u<4;u++){ta[O]=ka.x;ta[O+1]=ka.y;ta[O+2]=ka.z;O+=3}if(Ea&&ua)for(u=0;u<4;u++){ma=ua[u];Fa[M]=ma.u;Fa[M+1]=ma.v;M+=2}if(Ea&&ra)for(u=0;u<4;u++){ua=ra[u];Ga[Z]=ua.u;Ga[Z+1]=ua.v;Z+=2}if(Ka){xa[Q]=y;xa[Q+1]=y+1;xa[Q+2]=y+2;xa[Q+3]=y;xa[Q+4]=y+2;xa[Q+5]=y+3;Q+=6;pa[oa]=y;pa[oa+1]=y+1;pa[oa+2]=y;pa[oa+3]=y+3;pa[oa+4]=y+1;pa[oa+5]=y+2;pa[oa+6]=y+2;pa[oa+7]=y+3;oa+=8;y+=4}}}if(Ja){b.bindBuffer(b.ARRAY_BUFFER,r.__webGLVertexBuffer);b.bufferData(b.ARRAY_BUFFER,ha,v)}if(Na&&
+ya.length){b.bindBuffer(b.ARRAY_BUFFER,r.__webGLColorBuffer);b.bufferData(b.ARRAY_BUFFER,ia,v)}if(La){b.bindBuffer(b.ARRAY_BUFFER,r.__webGLNormalBuffer);b.bufferData(b.ARRAY_BUFFER,ta,v)}if(Ma&&la.hasTangents){b.bindBuffer(b.ARRAY_BUFFER,r.__webGLTangentBuffer);b.bufferData(b.ARRAY_BUFFER,U,v)}if(Ea&&M>0){b.bindBuffer(b.ARRAY_BUFFER,r.__webGLUVBuffer);b.bufferData(b.ARRAY_BUFFER,Fa,v)}if(Ea&&Z>0){b.bindBuffer(b.ARRAY_BUFFER,r.__webGLUV2Buffer);b.bufferData(b.ARRAY_BUFFER,Ga,v)}if(Ka){b.bindBuffer(b.ELEMENT_ARRAY_BUFFER,
+r.__webGLFaceBuffer);b.bufferData(b.ELEMENT_ARRAY_BUFFER,xa,v);b.bindBuffer(b.ELEMENT_ARRAY_BUFFER,r.__webGLLineBuffer);b.bufferData(b.ELEMENT_ARRAY_BUFFER,pa,v)}if(p>0){b.bindBuffer(b.ARRAY_BUFFER,r.__webGLSkinVertexABuffer);b.bufferData(b.ARRAY_BUFFER,V,v);b.bindBuffer(b.ARRAY_BUFFER,r.__webGLSkinVertexBBuffer);b.bufferData(b.ARRAY_BUFFER,W,v);b.bindBuffer(b.ARRAY_BUFFER,r.__webGLSkinIndicesBuffer);b.bufferData(b.ARRAY_BUFFER,X,v);b.bindBuffer(b.ARRAY_BUFFER,r.__webGLSkinWeightsBuffer);b.bufferData(b.ARRAY_BUFFER,
+Y,v)}}E(objlist,F,q,G,l)}s.__dirtyVertices=!1;s.__dirtyElements=!1;s.__dirtyUvs=!1;s.__dirtyNormals=!1;s.__dirtyTangents=!1;s.__dirtyColors=!1}else if(l instanceof THREE.Ribbon){if(!s.__webGLVertexBuffer){q=s;q.__webGLVertexBuffer=b.createBuffer();q.__webGLColorBuffer=b.createBuffer();q=s;G=q.vertices.length;q.__vertexArray=new Float32Array(G*3);q.__colorArray=new Float32Array(G*3);q.__webGLVertexCount=G;s.__dirtyVertices=!0;s.__dirtyColors=!0}if(s.__dirtyVertices||s.__dirtyColors){q=s;G=b.DYNAMIC_DRAW;
+y=void 0;y=void 0;I=void 0;r=void 0;M=q.vertices;v=q.colors;Z=M.length;ea=v.length;Q=q.__vertexArray;S=q.__colorArray;O=q.__dirtyColors;if(q.__dirtyVertices){for(y=0;y<Z;y++){I=M[y].position;r=y*3;Q[r]=I.x;Q[r+1]=I.y;Q[r+2]=I.z}b.bindBuffer(b.ARRAY_BUFFER,q.__webGLVertexBuffer);b.bufferData(b.ARRAY_BUFFER,Q,G)}if(O){for(y=0;y<ea;y++){color=v[y];r=y*3;S[r]=color.r;S[r+1]=color.g;S[r+2]=color.b}b.bindBuffer(b.ARRAY_BUFFER,q.__webGLColorBuffer);b.bufferData(b.ARRAY_BUFFER,S,G)}}E(objlist,F,0,s,l);s.__dirtyVertices=
+!1;s.__dirtyColors=!1}else if(l instanceof THREE.Line){if(!s.__webGLVertexBuffer){q=s;q.__webGLVertexBuffer=b.createBuffer();q.__webGLColorBuffer=b.createBuffer();q=s;G=q.vertices.length;q.__vertexArray=new Float32Array(G*3);q.__colorArray=new Float32Array(G*3);q.__webGLLineCount=G;s.__dirtyVertices=!0;s.__dirtyColors=!0}if(s.__dirtyVertices||s.__dirtyColors){q=s;G=b.DYNAMIC_DRAW;y=void 0;y=void 0;I=void 0;r=void 0;M=q.vertices;v=q.colors;Z=M.length;ea=v.length;Q=q.__vertexArray;S=q.__colorArray;
+O=q.__dirtyColors;if(q.__dirtyVertices){for(y=0;y<Z;y++){I=M[y].position;r=y*3;Q[r]=I.x;Q[r+1]=I.y;Q[r+2]=I.z}b.bindBuffer(b.ARRAY_BUFFER,q.__webGLVertexBuffer);b.bufferData(b.ARRAY_BUFFER,Q,G)}if(O){for(y=0;y<ea;y++){color=v[y];r=y*3;S[r]=color.r;S[r+1]=color.g;S[r+2]=color.b}b.bindBuffer(b.ARRAY_BUFFER,q.__webGLColorBuffer);b.bufferData(b.ARRAY_BUFFER,S,G)}}E(objlist,F,0,s,l);s.__dirtyVertices=!1;s.__dirtyColors=!1}else if(l instanceof THREE.ParticleSystem){if(!s.__webGLVertexBuffer){q=s;q.__webGLVertexBuffer=
+b.createBuffer();q.__webGLColorBuffer=b.createBuffer();q=s;G=q.vertices.length;q.__vertexArray=new Float32Array(G*3);q.__colorArray=new Float32Array(G*3);q.__sortArray=[];q.__webGLParticleCount=G;s.__dirtyVertices=!0;s.__dirtyColors=!0}(s.__dirtyVertices||s.__dirtyColors||l.sortParticles)&&c(s,b.DYNAMIC_DRAW,l,r);E(objlist,F,0,s,l);s.__dirtyVertices=!1;s.__dirtyColors=!1}else if(THREE.MarchingCubes!==undefined&&l instanceof THREE.MarchingCubes){s=F;if(s[0]==undefined){v.__webGLObjectsImmediate.push({object:l,
+opaque:{list:[],count:0},transparent:{list:[],count:0}});s[0]=1}}}};this.removeObject=function(e,n){var m,h;for(m=e.__webGLObjects.length-1;m>=0;m--){h=e.__webGLObjects[m].object;n==h&&e.__webGLObjects.splice(m,1)}};this.setFaceCulling=function(e,n){if(e){!n||n=="ccw"?b.frontFace(b.CCW):b.frontFace(b.CW);if(e=="back")b.cullFace(b.BACK);else e=="front"?b.cullFace(b.FRONT):b.cullFace(b.FRONT_AND_BACK);b.enable(b.CULL_FACE)}else b.disable(b.CULL_FACE)};this.supportsVertexTextures=function(){return b.getParameter(b.MAX_VERTEX_TEXTURE_IMAGE_UNITS)>
+0}};
+THREE.Snippets={fog_pars_fragment:"#ifdef USE_FOG\nuniform vec3 fogColor;\n#ifdef FOG_EXP2\nuniform float fogDensity;\n#else\nuniform float fogNear;\nuniform float fogFar;\n#endif\n#endif",fog_fragment:"#ifdef USE_FOG\nfloat depth = gl_FragCoord.z / gl_FragCoord.w;\n#ifdef FOG_EXP2\nconst float LOG2 = 1.442695;\nfloat fogFactor = exp2( - fogDensity * fogDensity * depth * depth * LOG2 );\nfogFactor = 1.0 - clamp( fogFactor, 0.0, 1.0 );\n#else\nfloat fogFactor = smoothstep( fogNear, fogFar, depth );\n#endif\ngl_FragColor = mix( gl_FragColor, vec4( fogColor, gl_FragColor.w ), fogFactor );\n#endif",envmap_pars_fragment:"#ifdef USE_ENVMAP\nvarying vec3 vReflect;\nuniform float reflectivity;\nuniform samplerCube env_map;\nuniform int combine;\n#endif",
+envmap_fragment:"#ifdef USE_ENVMAP\nvec4 cubeColor = textureCube( env_map, vec3( -vReflect.x, vReflect.yz ) );\nif ( combine == 1 ) {\ngl_FragColor = vec4( mix( gl_FragColor.xyz, cubeColor.xyz, reflectivity ), opacity );\n} else {\ngl_FragColor = gl_FragColor * cubeColor;\n}\n#endif",envmap_pars_vertex:"#ifdef USE_ENVMAP\nvarying vec3 vReflect;\nuniform float refraction_ratio;\nuniform bool useRefract;\n#endif",envmap_vertex:"#ifdef USE_ENVMAP\nvec4 mPosition = objectMatrix * vec4( position, 1.0 );\nvec3 nWorld = mat3( objectMatrix[0].xyz, objectMatrix[1].xyz, objectMatrix[2].xyz ) * normal;\nif ( useRefract ) {\nvReflect = refract( normalize( mPosition.xyz - cameraPosition ), normalize( nWorld.xyz ), refraction_ratio );\n} else {\nvReflect = reflect( normalize( mPosition.xyz - cameraPosition ), normalize( nWorld.xyz ) );\n}\n#endif",
+map_particle_pars_fragment:"#ifdef USE_MAP\nuniform sampler2D map;\n#endif",map_particle_fragment:"#ifdef USE_MAP\ngl_FragColor = gl_FragColor * texture2D( map, gl_PointCoord );\n#endif",map_pars_fragment:"#ifdef USE_MAP\nvarying vec2 vUv;\nuniform sampler2D map;\n#endif",map_pars_vertex:"#ifdef USE_MAP\nvarying vec2 vUv;\n#endif",map_fragment:"#ifdef USE_MAP\ngl_FragColor = gl_FragColor * texture2D( map, vUv );\n#endif",map_vertex:"#ifdef USE_MAP\nvUv = uv;\n#endif",lightmap_pars_fragment:"#ifdef USE_LIGHTMAP\nvarying vec2 vUv2;\nuniform sampler2D light_map;\n#endif",
+lightmap_pars_vertex:"#ifdef USE_LIGHTMAP\nvarying vec2 vUv2;\n#endif",lightmap_fragment:"#ifdef USE_LIGHTMAP\ngl_FragColor = gl_FragColor * texture2D( light_map, vUv2 );\n#endif",lightmap_vertex:"#ifdef USE_LIGHTMAP\nvUv2 = uv2;\n#endif",lights_pars_vertex:"uniform bool enableLighting;\nuniform vec3 ambientLightColor;\n#if MAX_DIR_LIGHTS > 0\nuniform vec3 directionalLightColor[ MAX_DIR_LIGHTS ];\nuniform vec3 directionalLightDirection[ MAX_DIR_LIGHTS ];\n#endif\n#if MAX_POINT_LIGHTS > 0\nuniform vec3 pointLightColor[ MAX_POINT_LIGHTS ];\nuniform vec3 pointLightPosition[ MAX_POINT_LIGHTS ];\n#ifdef PHONG\nvarying vec3 vPointLightVector[ MAX_POINT_LIGHTS ];\n#endif\n#endif",
+lights_vertex:"if ( !enableLighting ) {\nvLightWeighting = vec3( 1.0 );\n} else {\nvLightWeighting = ambientLightColor;\n#if MAX_DIR_LIGHTS > 0\nfor( int i = 0; i < MAX_DIR_LIGHTS; i++ ) {\nvec4 lDirection = viewMatrix * vec4( directionalLightDirection[ i ], 0.0 );\nfloat directionalLightWeighting = max( dot( transformedNormal, normalize( lDirection.xyz ) ), 0.0 );\nvLightWeighting += directionalLightColor[ i ] * directionalLightWeighting;\n}\n#endif\n#if MAX_POINT_LIGHTS > 0\nfor( int i = 0; i < MAX_POINT_LIGHTS; i++ ) {\nvec4 lPosition = viewMatrix * vec4( pointLightPosition[ i ], 1.0 );\nvec3 pointLightVector = normalize( lPosition.xyz - mvPosition.xyz );\nfloat pointLightWeighting = max( dot( transformedNormal, pointLightVector ), 0.0 );\nvLightWeighting += pointLightColor[ i ] * pointLightWeighting;\n#ifdef PHONG\nvPointLightVector[ i ] = pointLightVector;\n#endif\n}\n#endif\n}",
+lights_pars_fragment:"#if MAX_DIR_LIGHTS > 0\nuniform vec3 directionalLightDirection[ MAX_DIR_LIGHTS ];\n#endif\n#if MAX_POINT_LIGHTS > 0\nvarying vec3 vPointLightVector[ MAX_POINT_LIGHTS ];\n#endif\nvarying vec3 vViewPosition;\nvarying vec3 vNormal;",lights_fragment:"vec3 normal = normalize( vNormal );\nvec3 viewPosition = normalize( vViewPosition );\nvec4 mColor = vec4( diffuse, opacity );\nvec4 mSpecular = vec4( specular, opacity );\n#if MAX_POINT_LIGHTS > 0\nvec4 pointDiffuse  = vec4( 0.0 );\nvec4 pointSpecular = vec4( 0.0 );\nfor( int i = 0; i < MAX_POINT_LIGHTS; i++ ) {\nvec3 pointVector = normalize( vPointLightVector[ i ] );\nvec3 pointHalfVector = normalize( vPointLightVector[ i ] + vViewPosition );\nfloat pointDotNormalHalf = dot( normal, pointHalfVector );\nfloat pointDiffuseWeight = max( dot( normal, pointVector ), 0.0 );\nfloat pointSpecularWeight = 0.0;\nif ( pointDotNormalHalf >= 0.0 )\npointSpecularWeight = pow( pointDotNormalHalf, shininess );\npointDiffuse  += mColor * pointDiffuseWeight;\npointSpecular += mSpecular * pointSpecularWeight;\n}\n#endif\n#if MAX_DIR_LIGHTS > 0\nvec4 dirDiffuse  = vec4( 0.0 );\nvec4 dirSpecular = vec4( 0.0 );\nfor( int i = 0; i < MAX_DIR_LIGHTS; i++ ) {\nvec4 lDirection = viewMatrix * vec4( directionalLightDirection[ i ], 0.0 );\nvec3 dirVector = normalize( lDirection.xyz );\nvec3 dirHalfVector = normalize( lDirection.xyz + vViewPosition );\nfloat dirDotNormalHalf = dot( normal, dirHalfVector );\nfloat dirDiffuseWeight = max( dot( normal, dirVector ), 0.0 );\nfloat dirSpecularWeight = 0.0;\nif ( dirDotNormalHalf >= 0.0 )\ndirSpecularWeight = pow( dirDotNormalHalf, shininess );\ndirDiffuse  += mColor * dirDiffuseWeight;\ndirSpecular += mSpecular * dirSpecularWeight;\n}\n#endif\nvec4 totalLight = vec4( ambient, opacity );\n#if MAX_DIR_LIGHTS > 0\ntotalLight += dirDiffuse + dirSpecular;\n#endif\n#if MAX_POINT_LIGHTS > 0\ntotalLight += pointDiffuse + pointSpecular;\n#endif\ngl_FragColor = gl_FragColor * totalLight;",
+color_pars_fragment:"#ifdef USE_COLOR\nvarying vec3 vColor;\n#endif",color_fragment:"#ifdef USE_COLOR\ngl_FragColor = gl_FragColor * vec4( vColor, opacity );\n#endif",color_pars_vertex:"#ifdef USE_COLOR\nvarying vec3 vColor;\n#endif",color_vertex:"#ifdef USE_COLOR\nvColor = color;\n#endif",skinning_pars_vertex:"#ifdef USE_SKINNING\nuniform mat4 boneGlobalMatrices[20];\n#endif",skinning_vertex:"#ifdef USE_SKINNING\ngl_Position  = ( boneGlobalMatrices[ int( skinIndex.x ) ] * skinVertexA ) * skinWeight.x;\ngl_Position += ( boneGlobalMatrices[ int( skinIndex.y ) ] * skinVertexB ) * skinWeight.y;\ngl_Position  = projectionMatrix * viewMatrix * objectMatrix * gl_Position;\n#else\ngl_Position = projectionMatrix * mvPosition;\n#endif"};
+THREE.UniformsLib={common:{diffuse:{type:"c",value:new THREE.Color(15658734)},opacity:{type:"f",value:1},map:{type:"t",value:0,texture:null},light_map:{type:"t",value:2,texture:null},env_map:{type:"t",value:1,texture:null},useRefract:{type:"i",value:0},reflectivity:{type:"f",value:1},refraction_ratio:{type:"f",value:0.98},combine:{type:"i",value:0},fogDensity:{type:"f",value:2.5E-4},fogNear:{type:"f",value:1},fogFar:{type:"f",value:2E3},fogColor:{type:"c",value:new THREE.Color(16777215)}},lights:{enableLighting:{type:"i",
+value:1},ambientLightColor:{type:"fv",value:[]},directionalLightDirection:{type:"fv",value:[]},directionalLightColor:{type:"fv",value:[]},pointLightPosition:{type:"fv",value:[]},pointLightColor:{type:"fv",value:[]}},particle:{psColor:{type:"c",value:new THREE.Color(15658734)},opacity:{type:"f",value:1},size:{type:"f",value:1},map:{type:"t",value:0,texture:null},fogDensity:{type:"f",value:2.5E-4},fogNear:{type:"f",value:1},fogFar:{type:"f",value:2E3},fogColor:{type:"c",value:new THREE.Color(16777215)}}};
+THREE.ShaderLib={depth:{uniforms:{mNear:{type:"f",value:1},mFar:{type:"f",value:2E3},opacity:{type:"f",value:1}},fragment_shader:"uniform float mNear;\nuniform float mFar;\nuniform float opacity;\nvoid main() {\nfloat depth = gl_FragCoord.z / gl_FragCoord.w;\nfloat color = 1.0 - smoothstep( mNear, mFar, depth );\ngl_FragColor = vec4( vec3( color ), opacity );\n}",vertex_shader:"void main() {\ngl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );\n}"},normal:{uniforms:{opacity:{type:"f",
+value:1}},fragment_shader:"uniform float opacity;\nvarying vec3 vNormal;\nvoid main() {\ngl_FragColor = vec4( 0.5 * normalize( vNormal ) + 0.5, opacity );\n}",vertex_shader:"varying vec3 vNormal;\nvoid main() {\nvec4 mvPosition = modelViewMatrix * vec4( position, 1.0 );\nvNormal = normalize( normalMatrix * normal );\ngl_Position = projectionMatrix * mvPosition;\n}"},basic:{uniforms:THREE.UniformsLib.common,fragment_shader:["uniform vec3 diffuse;\nuniform float opacity;",THREE.Snippets.color_pars_fragment,
+THREE.Snippets.map_pars_fragment,THREE.Snippets.lightmap_pars_fragment,THREE.Snippets.envmap_pars_fragment,THREE.Snippets.fog_pars_fragment,"void main() {\ngl_FragColor = vec4( diffuse, opacity );",THREE.Snippets.map_fragment,THREE.Snippets.lightmap_fragment,THREE.Snippets.color_fragment,THREE.Snippets.envmap_fragment,THREE.Snippets.fog_fragment,"}"].join("\n"),vertex_shader:[THREE.Snippets.map_pars_vertex,THREE.Snippets.lightmap_pars_vertex,THREE.Snippets.envmap_pars_vertex,THREE.Snippets.color_pars_vertex,
+THREE.Snippets.skinning_pars_vertex,"void main() {\nvec4 mvPosition = modelViewMatrix * vec4( position, 1.0 );",THREE.Snippets.map_vertex,THREE.Snippets.lightmap_vertex,THREE.Snippets.envmap_vertex,THREE.Snippets.color_vertex,THREE.Snippets.skinning_vertex,"}"].join("\n")},lambert:{uniforms:Uniforms.merge([THREE.UniformsLib.common,THREE.UniformsLib.lights]),fragment_shader:["uniform vec3 diffuse;\nuniform float opacity;\nvarying vec3 vLightWeighting;",THREE.Snippets.color_pars_fragment,THREE.Snippets.map_pars_fragment,
+THREE.Snippets.lightmap_pars_fragment,THREE.Snippets.envmap_pars_fragment,THREE.Snippets.fog_pars_fragment,"void main() {\ngl_FragColor = vec4( diffuse, opacity );\ngl_FragColor = gl_FragColor * vec4( vLightWeighting, 1.0 );",THREE.Snippets.map_fragment,THREE.Snippets.lightmap_fragment,THREE.Snippets.color_fragment,THREE.Snippets.envmap_fragment,THREE.Snippets.fog_fragment,"}"].join("\n"),vertex_shader:["varying vec3 vLightWeighting;",THREE.Snippets.map_pars_vertex,THREE.Snippets.lightmap_pars_vertex,
+THREE.Snippets.envmap_pars_vertex,THREE.Snippets.lights_pars_vertex,THREE.Snippets.color_pars_vertex,THREE.Snippets.skinning_pars_vertex,"void main() {\nvec4 mvPosition = modelViewMatrix * vec4( position, 1.0 );",THREE.Snippets.map_vertex,THREE.Snippets.lightmap_vertex,THREE.Snippets.envmap_vertex,THREE.Snippets.color_vertex,"vec3 transformedNormal = normalize( normalMatrix * normal );",THREE.Snippets.lights_vertex,THREE.Snippets.skinning_vertex,"}"].join("\n")},phong:{uniforms:Uniforms.merge([THREE.UniformsLib.common,
+THREE.UniformsLib.lights,{ambient:{type:"c",value:new THREE.Color(328965)},specular:{type:"c",value:new THREE.Color(1118481)},shininess:{type:"f",value:30}}]),fragment_shader:["uniform vec3 diffuse;\nuniform float opacity;\nuniform vec3 ambient;\nuniform vec3 specular;\nuniform float shininess;\nvarying vec3 vLightWeighting;",THREE.Snippets.color_pars_fragment,THREE.Snippets.map_pars_fragment,THREE.Snippets.lightmap_pars_fragment,THREE.Snippets.envmap_pars_fragment,THREE.Snippets.fog_pars_fragment,
+THREE.Snippets.lights_pars_fragment,"void main() {\ngl_FragColor = vec4( vLightWeighting, 1.0 );",THREE.Snippets.lights_fragment,THREE.Snippets.map_fragment,THREE.Snippets.lightmap_fragment,THREE.Snippets.color_fragment,THREE.Snippets.envmap_fragment,THREE.Snippets.fog_fragment,"}"].join("\n"),vertex_shader:["#define PHONG\nvarying vec3 vLightWeighting;\nvarying vec3 vViewPosition;\nvarying vec3 vNormal;",THREE.Snippets.map_pars_vertex,THREE.Snippets.lightmap_pars_vertex,THREE.Snippets.envmap_pars_vertex,
+THREE.Snippets.lights_pars_vertex,THREE.Snippets.color_pars_vertex,THREE.Snippets.skinning_pars_vertex,"void main() {\nvec4 mvPosition = modelViewMatrix * vec4( position, 1.0 );",THREE.Snippets.map_vertex,THREE.Snippets.lightmap_vertex,THREE.Snippets.envmap_vertex,THREE.Snippets.color_vertex,"#ifndef USE_ENVMAP\nvec4 mPosition = objectMatrix * vec4( position, 1.0 );\n#endif\nvViewPosition = cameraPosition - mPosition.xyz;\nvec3 transformedNormal = normalize( normalMatrix * normal );\nvNormal = transformedNormal;",
+THREE.Snippets.lights_vertex,THREE.Snippets.skinning_vertex,"}"].join("\n")},particle_basic:{uniforms:THREE.UniformsLib.particle,fragment_shader:["uniform vec3 psColor;\nuniform float opacity;",THREE.Snippets.color_pars_fragment,THREE.Snippets.map_particle_pars_fragment,THREE.Snippets.fog_pars_fragment,"void main() {\ngl_FragColor = vec4( psColor, opacity );",THREE.Snippets.map_particle_fragment,THREE.Snippets.color_fragment,THREE.Snippets.fog_fragment,"}"].join("\n"),vertex_shader:["uniform float size;",
+THREE.Snippets.color_pars_vertex,"void main() {",THREE.Snippets.color_vertex,"vec4 mvPosition = modelViewMatrix * vec4( position, 1.0 );\ngl_Position = projectionMatrix * mvPosition;\ngl_PointSize = size;\n}"].join("\n")}};

+ 18 - 6
examples/camera_orthographic.html → examples/canvas_camera_orthographic.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - camera - orthographic</title>
+		<title>three.js canvas - camera - orthographic</title>
 		<meta charset="utf-8">
 		<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;"/>
 		<style type="text/css">
@@ -18,6 +18,7 @@
 		<script type="text/javascript" src="../build/Three.js"></script>
 		<script type="text/javascript" src="../src/extras/primitives/Cube.js"></script>
 
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
 		<script type="text/javascript" src="js/Stats.js"></script>
 
 		<script type="text/javascript">
@@ -26,7 +27,7 @@
 			var camera, scene, renderer;
 
 			init();
-			setInterval( loop, 1000 / 60 );
+			animate();
 
 			function init() {
 
@@ -115,19 +116,30 @@
 				stats = new Stats();
 				stats.domElement.style.position = 'absolute';
 				stats.domElement.style.top = '0px';
-				container.appendChild(stats.domElement);
+				container.appendChild( stats.domElement );
 
 			}
 
-			function loop() {
+			//
+
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+				stats.update();
+
+			}
+
+			function render() {
 
 				var timer = new Date().getTime() * 0.0001;
 
 				camera.position.x = Math.cos( timer ) * 200;
 				camera.position.z = Math.sin( timer ) * 200;
 
-				renderer.render(scene, camera);
-				stats.update();
+				renderer.render( scene, camera );
+
 			}
 
 		</script>

+ 17 - 8
examples/geometry_birds.html → examples/canvas_geometry_birds.html

@@ -1,7 +1,7 @@
 <html>
 	<head>
 		<meta http-equiv="content-type" content="text/html; charset=utf-8"/> 
-		<title>three.js - geometry - birds</title>
+		<title>three.js canvas - geometry - birds</title>
 		<style type="text/css"> 
 			body {
 				color: #808080;
@@ -26,11 +26,12 @@
 		<div id="container"></div>
 		<div id="info"><a href="http://github.com/mrdoob/three.js" target="_blank">three.js</a> - birds demo</div>
 
-		<script type="text/javascript" src="js/Stats.js"></script>
-
 		<script type="text/javascript" src="../build/Three.js"></script>
 		<script type="text/javascript" src="obj/Bird.js"></script>
 
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
+		<script type="text/javascript" src="js/Stats.js"></script>
+
 		<script type="text/javascript">
 
 			// Based on http://www.openprocessing.org/visuals/?visualID=6910
@@ -331,6 +332,7 @@
 			var stats;
 
 			init();
+			animate();
 
 			function init() {
 
@@ -378,8 +380,6 @@
 
 				document.getElementById( 'container' ).appendChild(stats.domElement);
 
-				setInterval( loop, 1000 / 200 );
-
 			}
 
 			function onDocumentMouseMove( event ) {
@@ -398,7 +398,18 @@
 
 			}
 
-			function loop() {
+			//
+
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+				stats.update();
+
+			}
+
+			function render() {
 
 				for ( var i = 0, il = birds.length; i < il; i++ ) {
 
@@ -421,8 +432,6 @@
 
 				renderer.render( scene, camera );
 
-				stats.update();
-
 			}
 
 		</script>

+ 15 - 8
examples/geometry_cube.html → examples/canvas_geometry_cube.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - geometry - cube</title>
+		<title>three.js canvas - geometry - cube</title>
 		<meta charset="utf-8">
 		<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;"/>
 		<style type="text/css">
@@ -16,9 +16,8 @@
 	<body>
 
 		<script type="text/javascript" src="../build/Three.js"></script>
-		<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="js/RequestAnimationFrame.js"></script>
 		<script type="text/javascript" src="js/Stats.js"></script>
 
 		<script type="text/javascript">
@@ -39,7 +38,7 @@
 			var windowHalfY = window.innerHeight / 2;
 
 			init();
-			setInterval(loop, 1000/60);
+			animate();
 
 			function init() {
 
@@ -84,7 +83,7 @@
 				scene.addObject( plane );
 
 				renderer = new THREE.CanvasRenderer();
-				renderer.setSize(  window.innerWidth, window.innerHeight );
+				renderer.setSize( window.innerWidth, window.innerHeight );
 
 				container.appendChild( renderer.domElement );
 
@@ -159,12 +158,20 @@
 
 			//
 
-			function loop() {
+			function animate() {
 
-				plane.rotation.z = cube.rotation.y += ( targetRotation - cube.rotation.y ) * 0.05;
+				requestAnimationFrame( animate );
 
-				renderer.render(scene, camera);
+				render();
 				stats.update();
+
+			}
+
+			function render() {
+
+				plane.rotation.z = cube.rotation.y += ( targetRotation - cube.rotation.y ) * 0.05;
+				renderer.render( scene, camera );
+
 			}
 
 		</script>

+ 17 - 9
examples/geometry_earth.html → examples/canvas_geometry_earth.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - geometry - earth</title>
+		<title>three.js canvas - geometry - earth</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -33,14 +33,14 @@
 		<div id="container"></div> 
 		<div id="info"><a href="http://github.com/mrdoob/three.js" target="_blank">three.js</a> - earth demo</div>
 
-		<script type="text/javascript" src="js/Stats.js"></script>
-
 		<script type="text/javascript" src="../build/Three.js"></script>
 		<script type="text/javascript" src="../src/extras/ImageUtils.js"></script>
-
 		<script type="text/javascript" src="../src/extras/primitives/Plane.js"></script>
 		<script type="text/javascript" src="../src/extras/primitives/Sphere.js"></script>
 
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
+		<script type="text/javascript" src="js/Stats.js"></script>
+
 		<script type="text/javascript">
 
 			var container, stats;
@@ -54,10 +54,8 @@
 			var windowHalfX = window.innerWidth / 2;
 			var windowHalfY = window.innerHeight / 2;
 
-
 			init();
-			setInterval( loop, 1000 / 60 );
-
+			animate();
 
 			function init() {
 
@@ -98,7 +96,18 @@
 
 			}
 
-			function loop() {
+			//
+
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+				stats.update();
+
+			}
+
+			function render() {
 
 				camera.position.x += ( mouseX - camera.position.x ) * 0.05;
 				camera.position.y += ( - mouseY - camera.position.y ) * 0.05;
@@ -106,7 +115,6 @@
 				mesh.rotation.y -= 0.005;
 
 				renderer.render( scene, camera );
-				stats.update();
 
 			}
 

+ 202 - 0
examples/canvas_geometry_hierarchy.html

@@ -0,0 +1,202 @@
+<!DOCTYPE HTML>
+<html lang="en">
+	<head>
+		<title>three.js canvas - geometry hierarchy 2</title>
+		<meta charset="utf-8">
+		<style type="text/css">
+			body {
+				background:#fff;
+				padding:0;
+				margin:0;
+				font-weight: bold;
+				overflow:hidden;
+			}
+		</style>
+	</head>
+	<body>
+
+		<!-- <script type="text/javascript" src="../build/Three.js"></script> -->
+
+		<script type="text/javascript" src="../src/Three.js"></script>
+		<script type="text/javascript" src="../src/core/Color.js"></script>
+		<script type="text/javascript" src="../src/core/Vector2.js"></script>
+		<script type="text/javascript" src="../src/core/Vector3.js"></script>
+		<script type="text/javascript" src="../src/core/Vector4.js"></script>
+		<script type="text/javascript" src="../src/core/Ray.js"></script>
+		<script type="text/javascript" src="../src/core/Rectangle.js"></script>
+		<script type="text/javascript" src="../src/core/Matrix3.js"></script>
+		<script type="text/javascript" src="../src/core/Matrix4.js"></script>
+		<script type="text/javascript" src="../src/core/Object3D.js"></script>
+		<script type="text/javascript" src="../src/core/Quaternion.js"></script>
+		<script type="text/javascript" src="../src/core/Vertex.js"></script>
+		<script type="text/javascript" src="../src/core/Face3.js"></script>
+		<script type="text/javascript" src="../src/core/Face4.js"></script>
+		<script type="text/javascript" src="../src/core/UV.js"></script>
+		<script type="text/javascript" src="../src/core/Geometry.js"></script>
+		<script type="text/javascript" src="../src/animation/AnimationHandler.js"></script>
+		<script type="text/javascript" src="../src/animation/Animation.js"></script>
+		<script type="text/javascript" src="../src/cameras/Camera.js"></script>
+		<script type="text/javascript" src="../src/cameras/QuakeCamera.js"></script>
+		<script type="text/javascript" src="../src/lights/Light.js"></script>
+		<script type="text/javascript" src="../src/lights/AmbientLight.js"></script>
+		<script type="text/javascript" src="../src/lights/DirectionalLight.js"></script>
+		<script type="text/javascript" src="../src/lights/PointLight.js"></script>
+		<script type="text/javascript" src="../src/materials/Material.js"></script>
+		<script type="text/javascript" src="../src/materials/Mappings.js"></script>
+		<script type="text/javascript" src="../src/materials/LineBasicMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/MeshBasicMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/MeshLambertMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/MeshPhongMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/MeshDepthMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/MeshNormalMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/MeshFaceMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/MeshShaderMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/ParticleBasicMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/ParticleCircleMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/ParticleDOMMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/Texture.js"></script>
+		<script type="text/javascript" src="../src/materials/RenderTarget.js"></script>
+		<script type="text/javascript" src="../src/materials/Uniforms.js"></script>
+		<script type="text/javascript" src="../src/objects/Particle.js"></script>
+		<script type="text/javascript" src="../src/objects/ParticleSystem.js"></script>
+		<script type="text/javascript" src="../src/objects/Line.js"></script>
+		<script type="text/javascript" src="../src/objects/Mesh.js"></script>
+		<script type="text/javascript" src="../src/objects/Bone.js"></script>
+		<script type="text/javascript" src="../src/objects/SkinnedMesh.js"></script>
+		<script type="text/javascript" src="../src/objects/Ribbon.js"></script>
+		<script type="text/javascript" src="../src/objects/Sound.js"></script>
+		<script type="text/javascript" src="../src/scenes/Scene.js"></script>
+		<script type="text/javascript" src="../src/scenes/Fog.js"></script>
+		<script type="text/javascript" src="../src/scenes/FogExp2.js"></script>
+		<script type="text/javascript" src="../src/renderers/Projector.js"></script>
+		<script type="text/javascript" src="../src/renderers/DOMRenderer.js"></script>
+		<script type="text/javascript" src="../src/renderers/CanvasRenderer.js"></script>
+		<script type="text/javascript" src="../src/renderers/SVGRenderer.js"></script>
+		<script type="text/javascript" src="../src/renderers/WebGLRenderer.js"></script>
+		<script type="text/javascript" src="../src/renderers/SoundRenderer.js"></script>
+		<script type="text/javascript" src="../src/renderers/renderables/RenderableObject.js"></script>
+		<script type="text/javascript" src="../src/renderers/renderables/RenderableFace3.js"></script>
+		<script type="text/javascript" src="../src/renderers/renderables/RenderableParticle.js"></script>
+		<script type="text/javascript" src="../src/renderers/renderables/RenderableLine.js"></script>
+		<script type="text/javascript" src="../src/extras/GeometryUtils.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/ShaderUtils.js"></script>
+		<script type="text/javascript" src="../src/extras/primitives/Cube.js"></script>
+		<script type="text/javascript" src="../src/extras/primitives/Cylinder.js"></script>
+		<script type="text/javascript" src="../src/extras/primitives/Plane.js"></script>
+		<script type="text/javascript" src="../src/extras/primitives/Sphere.js"></script>
+		<script type="text/javascript" src="../src/extras/primitives/Torus.js"></script>
+		<script type="text/javascript" src="../src/extras/primitives/Icosahedron.js"></script>
+		<script type="text/javascript" src="../src/extras/primitives/LathedObject.js"></script>
+		<script type="text/javascript" src="../src/extras/objects/MarchingCubes.js"></script>
+		<script type="text/javascript" src="../src/extras/io/Loader.js"></script>
+
+		<script type="text/javascript" src="js/Stats.js"></script>
+
+		<script type="text/javascript">
+
+			var statsEnabled = true;
+
+			var container, stats;
+
+			var camera, scene, renderer;
+
+			var geometry, group;
+
+			var mouseX = 0, mouseY = 0;
+
+			var windowHalfX = window.innerWidth / 2;
+			var windowHalfY = window.innerHeight / 2;
+
+			document.addEventListener( 'mousemove', onDocumentMouseMove, false );
+
+			init();
+			setInterval( loop, 1000 / 60 );
+
+			function init() {
+
+				container = document.createElement( 'div' );
+				document.body.appendChild( container );
+
+				camera = new THREE.Camera( 60, window.innerWidth / window.innerHeight, 1, 10000 );
+				camera.position.z = 500;
+
+				scene = new THREE.Scene();
+
+				var geometry = new Cube( 100, 100, 100 );
+				var material = new THREE.MeshNormalMaterial();
+
+				group = new THREE.Object3D();
+
+				for ( var i = 0; i < 200; i ++ ) {
+
+					var mesh = new THREE.Mesh( geometry, material );
+					mesh.position.x = Math.random() * 2000 - 1000;
+					mesh.position.y = Math.random() * 2000 - 1000;
+					mesh.position.z = Math.random() * 2000 - 1000;
+					mesh.rotation.x = Math.random() * 360 * ( Math.PI / 180 );
+					mesh.rotation.y = Math.random() * 360 * ( Math.PI / 180 );
+					mesh.updateMatrix();
+					mesh.autoUpdateMatrix = false;
+					mesh.overdraw = true;
+					group.addChild( mesh );
+
+				}
+
+				scene.addObject( group );
+
+				renderer = new THREE.CanvasRenderer();
+				renderer.setSize( window.innerWidth, window.innerHeight );
+				renderer.sortObjects = false;
+				container.appendChild( renderer.domElement );
+
+				if ( statsEnabled ) {
+
+					stats = new Stats();
+					stats.domElement.style.position = 'absolute';
+					stats.domElement.style.top = '0px';
+					stats.domElement.style.zIndex = 100;
+					container.appendChild( stats.domElement );
+
+				}
+
+			}
+
+			function onDocumentMouseMove(event) {
+
+				mouseX = ( event.clientX - windowHalfX ) * 10;
+				mouseY = ( event.clientY - windowHalfY ) * 10;
+
+			}
+
+			function loop() {
+
+				var rx = Math.sin( new Date().getTime() * 0.0007 ) * 0.5,
+				ry = Math.sin( new Date().getTime() * 0.0003 ) * 0.5,
+				rz = Math.sin( new Date().getTime() * 0.0002 ) * 0.5;
+
+				camera.position.x += ( mouseX - camera.position.x ) * .05;
+				camera.position.y += ( - mouseY - camera.position.y ) * .05;
+
+				group.rotation.x = rx;
+				group.rotation.y = ry;
+				group.rotation.z = rz;
+
+				renderer.render( scene, camera );
+
+				if ( statsEnabled ) stats.update();
+
+			}
+
+			function log( text ) {
+
+				var e = document.getElementById("log");
+				e.innerHTML = text + "<br/>" + e.innerHTML;
+
+			}
+
+		</script>
+
+	</body>
+</html>

+ 8 - 7
examples/geometry_panorama.html → examples/canvas_geometry_panorama.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - panorama demo</title>
+		<title>three.js canvas - panorama demo</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -32,7 +32,6 @@
 		<div id="info"><a href="http://github.com/mrdoob/three.js" target="_blank">three.js</a> - panorama demo. cubemap by <a href="http://www.zfight.com/" target="_blank">Jochum Skoglund</a>.</div>
 
 		<script type="text/javascript" src="../build/Three.js"></script>
-
 		<script type="text/javascript" src="../src/extras/primitives/Cube.js"></script>
 
 		<script type="text/javascript">
@@ -74,7 +73,7 @@
 					loadTexture( 'textures/cube/skybox/py.jpg' ), // top
 					loadTexture( 'textures/cube/skybox/ny.jpg' ), // bottom
 					loadTexture( 'textures/cube/skybox/pz.jpg' ), // back
-					loadTexture( 'textures/cube/skybox/nz.jpg' ) // front
+					loadTexture( 'textures/cube/skybox/nz.jpg' )  // front
 
 				];
 
@@ -99,14 +98,15 @@
 
 			function loadTexture( path ) {
 
-				var material = new THREE.MeshBasicMaterial( { map: new THREE.Texture( texture_placeholder ) } );
-
-				var image = new Image();
+				var texture = new THREE.Texture( texture_placeholder ),
+					material = new THREE.MeshBasicMaterial( { map: texture } ),
+					image = new Image();
 
 				image.onload = function () {
 
-					this.loaded = true;
+					texture.needsUpdate = true;
 					material.map.image = this;
+					
 					render();
 
 				};
@@ -114,6 +114,7 @@
 				image.src = path;
 
 				return material;
+
 			}
 
 			function onDocumentMouseDown( event ) {

+ 6 - 3
examples/geometry_panorama_fisheye.html → examples/canvas_geometry_panorama_fisheye.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - panorama fisheye demo</title>
+		<title>three.js canvas - panorama fisheye demo</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -108,14 +108,16 @@
 
 			function loadTexture( path ) {
 
-				var material = new THREE.MeshBasicMaterial( { map: new THREE.Texture( texture_placeholder ) } );
+				var texture = new THREE.Texture( texture_placeholder ),
+					material = new THREE.MeshBasicMaterial( { map: texture } );
 
 				var image = new Image();
 
 				image.onload = function () {
 
-					this.loaded = true;
+					texture.needsUpdate = true;
 					material.map.image = this;
+					
 					render();
 
 				};
@@ -123,6 +125,7 @@
 				image.src = path;
 
 				return material;
+
 			}
 
 			function onDocumentMouseDown( event ) {

+ 34 - 25
examples/geometry_terrain.html → examples/canvas_geometry_terrain.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - geometry - terrain</title>
+		<title>three.js canvas - geometry - terrain</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -33,12 +33,14 @@
 		<div id="container"><br /><br /><br /><br /><br />Generating...</div> 
 		<div id="info"><a href="http://github.com/mrdoob/three.js" target="_blank">three.js</a> - terrain demo. <a href="geometry_terrain.html">generate another</a></div> 
 
-		<script type="text/javascript" src="js/Stats.js"></script>
-		<script type="text/javascript" src="js/ImprovedNoise.js"></script>
-
 		<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="js/ImprovedNoise.js"></script>
+
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
+		<script type="text/javascript" src="js/Stats.js"></script>
+
 		<script type="text/javascript">
 
 			var container, stats;
@@ -53,10 +55,8 @@
 			var windowHalfX = window.innerWidth / 2;
 			var windowHalfY = window.innerHeight / 2;
 
-
 			init();
-			setInterval( loop, 1000 / 60 );
-
+			animate();
 
 			function init() {
 
@@ -103,23 +103,6 @@
 
 			}
 
-			function onDocumentMouseMove(event) {
-
-				mouseX = event.clientX - windowHalfX;
-				mouseY = event.clientY - windowHalfY;
-
-			}
-
-			function loop() {
-
-				camera.position.x += ( mouseX - camera.position.x ) * 0.05;
-				camera.position.y += ( - mouseY - camera.position.y ) * 0.05;
-
-				renderer.render(scene, camera);
-				stats.update();
-
-			}
-
 			function generateHeight( width, height ) {
 
 				var data = Float32Array ? new Float32Array() : [], perlin = new ImprovedNoise(),
@@ -162,7 +145,6 @@
 				canvas = document.createElement( 'canvas' );
 				canvas.width = width;
 				canvas.height = height;
-				canvas.loaded = true;
 
 				context = canvas.getContext( '2d' );
 				context.fillStyle = '#000';
@@ -192,6 +174,33 @@
 
 			}
 
+			function onDocumentMouseMove(event) {
+
+				mouseX = event.clientX - windowHalfX;
+				mouseY = event.clientY - windowHalfY;
+
+			}
+
+			//
+
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+				stats.update();
+
+			}
+
+			function render() {
+
+				camera.position.x += ( mouseX - camera.position.x ) * 0.05;
+				camera.position.y += ( - mouseY - camera.position.y ) * 0.05;
+
+				renderer.render( scene, camera );
+
+			}
+
 
 		</script>
 

+ 18 - 6
examples/interactive_cubes.html → examples/canvas_interactive_cubes.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - interactive - cubes</title>
+		<title>three.js canvas - interactive - cubes</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -17,6 +17,7 @@
 		<script type="text/javascript" src="../build/Three.js"></script>
 		<script type="text/javascript" src="../src/extras/primitives/Cube.js"></script>
 
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
 		<script type="text/javascript" src="js/Stats.js"></script>
 
 		<script type="text/javascript">
@@ -25,7 +26,7 @@
 			var camera, scene, projector, renderer;
 
 			init();
-			setInterval( loop, 1000 / 60 );
+			animate();
 
 			function init() {
 
@@ -69,7 +70,7 @@
 				renderer = new THREE.CanvasRenderer();
 				renderer.setSize( window.innerWidth, window.innerHeight );
 
-				container.appendChild(renderer.domElement);
+				container.appendChild( renderer.domElement );
 
 				stats = new Stats();
 				stats.domElement.style.position = 'absolute';
@@ -112,18 +113,29 @@
 				*/
 			}
 
+			//
+
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+				stats.update();
+
+			}
+
 			var radius = 600;
 			var theta = 0;
 
-			function loop() {
+			function render() {
 
 				theta += 0.2;
 				camera.position.x = radius * Math.sin( theta * Math.PI / 360 );
 				camera.position.y = radius * Math.sin( theta * Math.PI / 360 );
 				camera.position.z = radius * Math.cos( theta * Math.PI / 360 );
 
-				renderer.render(scene, camera);
-				stats.update();
+				renderer.render( scene, camera );
+
 			}
 
 		</script>

+ 17 - 5
examples/interactive_cubes_tween.html → examples/canvas_interactive_cubes_tween.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - interactive - cubes tween</title>
+		<title>three.js canvas - interactive - cubes tween</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -18,6 +18,7 @@
 		<script type="text/javascript" src="../src/extras/primitives/Cube.js"></script>
 
 		<script type="text/javascript" src="js/Tween.js"></script>
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
 		<script type="text/javascript" src="js/Stats.js"></script>
 
 		<script type="text/javascript">
@@ -26,7 +27,7 @@
 			var camera, scene, projector, renderer;
 
 			init();
-			setInterval( loop, 1000 / 60 );
+			animate();
 
 			function init() {
 
@@ -118,10 +119,21 @@
 				*/
 			}
 
+			//
+
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+				stats.update();
+
+			}
+
 			var radius = 600;
 			var theta = 0;
 
-			function loop() {
+			function render() {
 
 				TWEEN.update();
 
@@ -130,8 +142,8 @@
 				camera.position.y = radius * Math.sin( theta * Math.PI / 360 );
 				camera.position.z = radius * Math.cos( theta * Math.PI / 360 );
 
-				renderer.render(scene, camera);
-				stats.update();
+				renderer.render( scene, camera );
+
 			}
 
 		</script>

+ 17 - 6
examples/interactive_voxelpainter.html → examples/canvas_interactive_voxelpainter.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - interactive - voxel painter</title>
+		<title>three.js canvas - interactive - voxel painter</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -15,10 +15,10 @@
 	<body>
 
 		<script type="text/javascript" src="../build/Three.js"></script>
-
 		<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="js/RequestAnimationFrame.js"></script>
 		<script type="text/javascript" src="js/Stats.js"></script>
 
 		<script type="text/javascript">
@@ -31,7 +31,7 @@
 			theta = 45, isCtrlDown = false;
 
 			init();
-			setInterval( loop, 1000 / 60 );
+			animate();
 
 			function init() {
 
@@ -145,7 +145,7 @@
 
 					} else {
 
-						var position = new THREE.Vector3().add( intersects[ 0 ].point, intersects[ 0 ].object.rotationMatrix.multiplyVector3( intersects[ 0 ].face.normal.clone() ) );
+						var position = new THREE.Vector3().add( intersects[ 0 ].point, intersects[ 0 ].object.matrixRotation.multiplyVector3( intersects[ 0 ].face.normal.clone() ) );
 
 						var voxel = new THREE.Mesh( new Cube( 50, 50, 50 ), [ new THREE.MeshLambertMaterial( { color: 0x00ff80, opacity: 1, shading: THREE.FlatShading } ), new THREE.MeshFaceMaterial() ] );
 						voxel.position.x = Math.floor( position.x / 50 ) * 50 + 25;
@@ -186,7 +186,18 @@
 
 			}
 
-			function loop() {
+			//
+
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+				stats.update();
+
+			}
+
+			function render() {
 
 				if ( isShiftDown ) {
 
@@ -221,7 +232,7 @@
 				camera.position.z = 1400 * Math.cos( theta * Math.PI / 360 );
 
 				renderer.render( scene, camera );
-				stats.update();
+
 			}
 
 		</script>

+ 18 - 6
examples/lights_pointlights.html → examples/canvas_lights_pointlights.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - point light</title>
+		<title>three.js canvas - point light</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -38,8 +38,10 @@
 			Walt Disney head by <a href="http://www.davidoreilly.com/2009/01/walt-disneys-head-on-a-plate" target="_blank">David OReilly</a>
 		</div>
 
-		<script type="text/javascript" src="../build/Three.js"></script> 
-		<script type="text/javascript" src="obj/WaltHead.js"></script> 
+		<script type="text/javascript" src="../build/Three.js"></script>
+		<script type="text/javascript" src="obj/WaltHead.js"></script>
+
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
 
 		<script type="text/javascript">
 
@@ -49,7 +51,7 @@
 			mesh;
 
 			init();
-			setInterval( loop, 1000 / 60 );
+			animate();
 
 			function init() {
 
@@ -93,7 +95,17 @@
 
 			}
 
-			function loop() {
+			//
+
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+
+			}
+
+			function render() {
 
 				var time = new Date().getTime() * 0.0005;
 
@@ -123,7 +135,7 @@
 				light3.position.y = particle3.position.y;
 				light3.position.z = particle3.position.z;
 
-				renderer.render(scene, camera);
+				renderer.render( scene, camera );
 
 			}
 

+ 18 - 6
examples/lights_pointlights_smooth.html → examples/canvas_lights_pointlights_smooth.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - point light</title>
+		<title>three.js canvas - point light smooth</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -38,8 +38,10 @@
 			Walt Disney head by <a href="http://www.davidoreilly.com/2009/01/walt-disneys-head-on-a-plate" target="_blank">David OReilly</a>
 		</div>
 
-		<script type="text/javascript" src="../build/Three.js"></script> 
-		<script type="text/javascript" src="obj/WaltHead.js"></script> 
+		<script type="text/javascript" src="../build/Three.js"></script>
+		<script type="text/javascript" src="obj/WaltHead.js"></script>
+
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
 
 		<script type="text/javascript">
 
@@ -49,7 +51,7 @@
 			geometry, mesh;
 
 			init();
-			setInterval( loop, 1000 / 60 );
+			animate();
 
 			function init() {
 
@@ -96,7 +98,17 @@
 
 			}
 
-			function loop() {
+			//
+
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+
+			}
+
+			function render() {
 
 				var time = new Date().getTime() * 0.0005;
 
@@ -126,7 +138,7 @@
 				light3.position.y = particle3.position.y;
 				light3.position.z = particle3.position.z;
 
-				renderer.render(scene, camera);
+				renderer.render( scene, camera );
 
 			}
 

+ 20 - 17
examples/lines_test.html → examples/canvas_lines.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - particles - floor</title>
+		<title>three.js canvas - lines - random</title>
 		<meta charset="utf-8">
 		<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;"/>
 		<style type="text/css">
@@ -18,7 +18,9 @@
 	</head>
 	<body>
 
-		<script type="text/javascript" src="../build/Three.js"></script> 
+		<script type="text/javascript" src="../build/Three.js"></script>
+
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
 
 		<script type="text/javascript">
 
@@ -31,12 +33,10 @@
 			AMOUNTX = 10,
 			AMOUNTY = 10,
 
-			camera, scene, renderer,
-
-			stats;
+			camera, scene, renderer;
 
 			init();
-			setInterval( loop, 1000 / 60 );
+			animate();
 
 			function init() {
 
@@ -80,13 +80,6 @@
 				var line = new THREE.Line( geometry, new THREE.LineBasicMaterial( { color: 0xffffff, opacity: 0.5 } ) );
 				scene.addObject( line );
 
-				/*
-				stats = new Stats();
-				stats.domElement.style.position = 'absolute';
-				stats.domElement.style.top = '0px';
-				container.appendChild(stats.domElement);
-				*/
-
 				document.addEventListener( 'mousemove', onDocumentMouseMove, false );
 				document.addEventListener( 'touchstart', onDocumentTouchStart, false );
 				document.addEventListener( 'touchmove', onDocumentTouchMove, false );
@@ -108,7 +101,9 @@
 
 					mouseX = event.touches[ 0 ].pageX - windowHalfX;
 					mouseY = event.touches[ 0 ].pageY - windowHalfY;
+
 				}
+
 			}
 
 			function onDocumentTouchMove( event ) {
@@ -119,20 +114,28 @@
 
 					mouseX = event.touches[ 0 ].pageX - windowHalfX;
 					mouseY = event.touches[ 0 ].pageY - windowHalfY;
+
 				}
+
 			}
 
 			//
 
-			function loop() {
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+
+			}
+
+			function render() {
 
 				camera.position.x += ( mouseX - camera.position.x ) * .05;
 				camera.position.y += ( - mouseY + 200 - camera.position.y ) * .05;
-				camera.updateMatrix();
 
-				renderer.render(scene, camera);
+				renderer.render( scene, camera );
 
-				// stats.update();
 			}
 
 		</script>

+ 22 - 19
examples/lines_sphere.html → examples/canvas_lines_sphere.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - particles - floor</title>
+		<title>three.js canvas - lines - sphere</title>
 		<meta charset="utf-8">
 		<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;"/>
 		<style type="text/css">
@@ -18,7 +18,9 @@
 	</head>
 	<body>
 
-		<script type="text/javascript" src="../build/Three.js"></script> 
+		<script type="text/javascript" src="../build/Three.js"></script>
+
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
 
 		<script type="text/javascript">
 
@@ -34,12 +36,10 @@
 			AMOUNTX = 10,
 			AMOUNTY = 10,
 
-			camera, scene, renderer,
-
-			stats;
+			camera, scene, renderer;
 
 			init();
-			setInterval(loop, 1000 / 60);
+			animate();
 
 			function init() {
 
@@ -92,16 +92,9 @@
 					geometry.vertices.push( new THREE.Vertex( vector2 ) );
 
 					var line = new THREE.Line( geometry, new THREE.LineBasicMaterial( { color: 0xffffff, opacity: Math.random() } ) );
-					scene.addObject(line);
+					scene.addObject( line );
 				}
 
-				/*
-				stats = new Stats();
-				stats.domElement.style.position = 'absolute';
-				stats.domElement.style.top = '0px';
-				container.appendChild(stats.domElement);
-				*/
-
 				document.addEventListener( 'mousemove', onDocumentMouseMove, false );
 				document.addEventListener( 'touchstart', onDocumentTouchStart, false );
 				document.addEventListener( 'touchmove', onDocumentTouchMove, false );
@@ -117,37 +110,47 @@
 
 			function onDocumentTouchStart( event ) {
 
-				if(event.touches.length > 1) {
+				if ( event.touches.length > 1 ) {
 
 					event.preventDefault();
 
 					mouseX = event.touches[ 0 ].pageX - windowHalfX;
 					mouseY = event.touches[ 0 ].pageY - windowHalfY;
+
 				}
+
 			}
 
 			function onDocumentTouchMove( event ) {
 
-				if(event.touches.length == 1) {
+				if ( event.touches.length == 1 ) {
 
 					event.preventDefault();
 
 					mouseX = event.touches[ 0 ].pageX - windowHalfX;
 					mouseY = event.touches[ 0 ].pageY - windowHalfY;
+
 				}
+
 			}
 
 			//
 
-			function loop() {
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+
+			}
+
+			function render() {
 
 				camera.position.x += ( mouseX - camera.position.x ) * .05;
 				camera.position.y += ( - mouseY + 200 - camera.position.y ) * .05;
-				camera.updateMatrix();
 
 				renderer.render( scene, camera );
 
-				// stats.update();
 			}
 
 		</script>

+ 14 - 7
examples/materials.html → examples/canvas_materials.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - materials</title>
+		<title>three.js canvas - materials</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -15,10 +15,10 @@
 	<body>
 
 		<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="js/RequestAnimationFrame.js"></script>
 		<script type="text/javascript" src="js/Stats.js"></script>
 
 		<script type="text/javascript">
@@ -29,8 +29,7 @@
 			var particleLight, pointLight;
 
 			init();
-			// loop();
-			setInterval( loop, 1000 / 60 );
+			animate();
 
 			function init() {
 
@@ -163,7 +162,7 @@
 				var image = document.createElement( 'img' );
 				var texture = new THREE.Texture( image, THREE.UVMapping )
 
-				image.onload = function () { texture.loaded = true; };
+				image.onload = function () { texture.needsUpdate = true; };
 				image.src = path;
 
 				return texture;
@@ -172,7 +171,16 @@
 
 			//
 
-			function loop() {
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+				stats.update();
+
+			}
+
+			function render() {
 
 				var timer = new Date().getTime() * 0.0001;
 
@@ -198,7 +206,6 @@
 
 				renderer.render( scene, camera );
 
-				stats.update();
 			}
 
 		</script>

+ 17 - 11
examples/materials_depth.html → examples/canvas_materials_depth.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - depth material</title>
+		<title>three.js canvas - depth material</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -15,10 +15,10 @@
 	<body>
 
 		<script type="text/javascript" src="../build/Three.js"></script>
-
 		<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="js/RequestAnimationFrame.js"></script>
 		<script type="text/javascript" src="js/Stats.js"></script>
 
 		<script type="text/javascript">
@@ -55,8 +55,7 @@
 			var debugContext;
 
 			init();
-			setInterval( loop, 1000 / 60 );
-			// loop();
+			animate();
 
 			function init() {
 
@@ -129,7 +128,6 @@
 				scene.addLight( pointLight );
 
 				renderer = new THREE.CanvasRenderer();
-				// renderer = new THREE.WebGLRenderer();
 				renderer.setSize( window.innerWidth, window.innerHeight );
 
 				container.appendChild( renderer.domElement );
@@ -196,7 +194,16 @@
 
 			//
 
-			function loop() {
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+				stats.update();
+
+			}
+
+			function render() {
 
 				if ( moveForward ) camera.position.z -= 10; // camera.moveZ( 10 );
 				if ( moveBackwards ) camera.position.z += 10; // camera.moveZ( - 10 );
@@ -216,14 +223,14 @@
 				if ( rollLeft ) camera.rotation.z += 0.01; // camera.rotateZ( 1 );
 				if ( rollRight ) camera.rotation.z -= 0.01; // camera.rotateZ( - 1 );
 
-				debugContext.clearRect( -256, -256, 512, 512 );
+				debugContext.clearRect( - 256, - 256, 512, 512 );
 
 				debugContext.beginPath();
 
 				// center
-				debugContext.moveTo( -10, 0 );
+				debugContext.moveTo( - 10, 0 );
 				debugContext.lineTo( 10, 0 );
-				debugContext.moveTo( 0, -10 );
+				debugContext.moveTo( 0, - 10 );
 				debugContext.lineTo( 0, 10 );
 
 				// camera
@@ -249,9 +256,8 @@
 				debugContext.closePath();
 				debugContext.stroke();
 
-				renderer.render(scene, camera);
+				renderer.render( scene, camera );
 
-				stats.update();
 			}
 
 		</script>

+ 15 - 5
examples/materials_normal.html → examples/canvas_materials_normal.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - normal material</title>
+		<title>three.js canvas - normal material</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -41,13 +41,15 @@
 		<script type="text/javascript" src="../build/Three.js"></script> 
 		<script type="text/javascript" src="obj/WaltHead.js"></script>
 
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
+
 		<script type="text/javascript">
 
 			var camera, scene, renderer,
 			object;
 
 			init();
-			setInterval( loop, 1000 / 60 );
+			animate();
 
 			function init() {
 
@@ -64,20 +66,28 @@
 				scene.addObject( object );
 
 				renderer = new THREE.CanvasRenderer();
-				//renderer = new THREE.WebGLRenderer();
 				renderer.setSize( window.innerWidth, window.innerHeight );
 				container.appendChild( renderer.domElement );
 
 			}
 
-			function loop() {
+			//
+
+			function animate() {
+
+				requestAnimationFrame( animate );
+				render();
+
+			}
+
+			function render() {
 
 				var time = new Date().getTime() * 0.0005;
 
 				object.rotation.x -= 0.005;
 				object.rotation.y -= 0.01;
 
-				renderer.render(scene, camera);
+				renderer.render( scene, camera );
 
 			}
 

+ 16 - 4
examples/materials_reflection.html → examples/canvas_materials_reflection.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - spherical reflection</title>
+		<title>three.js canvas - spherical reflection</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -42,6 +42,8 @@
 
 		<script type="text/javascript" src="obj/WaltHead.js"></script>
 
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
+
 		<script type="text/javascript">
 
 			var camera, scene, renderer,
@@ -50,7 +52,7 @@
 			geometry, mesh;
 
 			init();
-			setInterval( loop, 1000 / 60 );
+			animate();
 
 			function init() {
 
@@ -74,13 +76,23 @@
 
 			}
 
-			function loop() {
+			//
+
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+
+			}
+
+			function render() {
 
 				var time = new Date().getTime() * 0.0005;
 
 				mesh.rotation.y -= 0.01;
 
-				renderer.render(scene, camera);
+				renderer.render( scene, camera );
 
 			}
 

+ 55 - 36
examples/materials_video.html → examples/canvas_materials_video.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - materials - video</title>
+		<title>three.js canvas - materials - video</title>
 		<meta charset="utf-8">
 		<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;"/>
 		<style type="text/css">
@@ -15,11 +15,12 @@
 	</head>
 	<body>
 
-		<script type="text/javascript" src="js/Stats.js"></script>
-
 		<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="js/RequestAnimationFrame.js"></script>
+		<script type="text/javascript" src="js/Stats.js"></script>
+
 		<video id="video" autoplay style="display:none">
 			<source src="textures/sintel.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"'>
 			<source src="textures/sintel.ogv" type='video/ogg; codecs="theora, vorbis"'>
@@ -33,8 +34,9 @@
 
 			var camera, scene, renderer;
 
-			var video, texture, textureContext,
-			textureReflection, textureReflectionContext, textureReflectionGradient;
+			var video, image, imageContext,
+			imageReflection, imageReflectionContext, imageReflectionGradient,
+			texture, textureReflection;
 
 			var mesh;
 
@@ -44,12 +46,8 @@
 			var windowHalfX = window.innerWidth / 2;
 			var windowHalfY = window.innerHeight / 2;
 
-
-			document.addEventListener( 'mousemove', onDocumentMouseMove, false );
-
 			init();
-			setInterval( loop, 1000 / 60 );
-
+			animate();
 
 			function init() {
 
@@ -73,33 +71,37 @@
 
 				// 
 
-				texture = document.createElement( 'canvas' );
-				texture.loaded = true;
-				texture.width = 480;
-				texture.height = 204;
+				image = document.createElement( 'canvas' );
+				image.width = 480;
+				image.height = 204;
 
-				textureContext = texture.getContext( '2d' );
-				textureContext.fillStyle = '#000000';
-				textureContext.fillRect( 0, 0, 480, 204 );
+				imageContext = image.getContext( '2d' );
+				imageContext.fillStyle = '#000000';
+				imageContext.fillRect( 0, 0, 480, 204 );
 
-				var map = new THREE.Texture( texture );
+				texture = new THREE.Texture( image );
+				texture.min_filter = THREE.LinearFilter;
+				texture.mag_filter = THREE.LinearFilter;
 
-				var material = new THREE.MeshBasicMaterial( { map: map } );
+				var material = new THREE.MeshBasicMaterial( { map: texture } );
 
-				textureReflection = document.createElement( 'canvas' );
-				textureReflection.loaded = true;
-				textureReflection.width = 480;
-				textureReflection.height = 204;
+				imageReflection = document.createElement( 'canvas' );
+				imageReflection.width = 480;
+				imageReflection.height = 204;
 
-				textureReflectionContext = textureReflection.getContext( '2d' );
-				textureReflectionContext.fillStyle = '#000000';
-				textureReflectionContext.fillRect( 0, 0, 480, 204 );
+				imageReflectionContext = imageReflection.getContext( '2d' );
+				imageReflectionContext.fillStyle = '#000000';
+				imageReflectionContext.fillRect( 0, 0, 480, 204 );
 
-				textureReflectionGradient = textureReflectionContext.createLinearGradient( 0, 0, 0, 204 );
-				textureReflectionGradient.addColorStop( 0.2, 'rgba(240, 240, 240, 1)' );
-				textureReflectionGradient.addColorStop( 1, 'rgba(240, 240, 240, 0.8)' );
+				imageReflectionGradient = imageReflectionContext.createLinearGradient( 0, 0, 0, 204 );
+				imageReflectionGradient.addColorStop( 0.2, 'rgba(240, 240, 240, 1)' );
+				imageReflectionGradient.addColorStop( 1, 'rgba(240, 240, 240, 0.8)' );
 
-				var materialReflection = new THREE.MeshBasicMaterial( { map: new THREE.Texture( textureReflection ) } );
+				textureReflection = new THREE.Texture( imageReflection );
+				textureReflection.min_filter = THREE.LinearFilter;
+				textureReflection.mag_filter = THREE.LinearFilter;
+				
+				var materialReflection = new THREE.MeshBasicMaterial( { map: textureReflection } );
 
 				//
 
@@ -135,6 +137,7 @@
 						particle.position.y = -153
 						particle.position.z = iy * separation - ( ( amounty * separation ) / 2 );
 						scene.addObject( particle );
+
 					}
 				}
 
@@ -148,6 +151,8 @@
 				stats.domElement.style.top = '0px';
 				container.appendChild( stats.domElement );
 
+				document.addEventListener( 'mousemove', onDocumentMouseMove, false );
+
 			}
 
 			function onDocumentMouseMove(event) {
@@ -157,22 +162,36 @@
 
 			}
 
-			function loop() {
+			//
+
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+				stats.update();
+
+			}
+
+			function render() {
 
 				camera.position.x += ( mouseX - camera.position.x ) * 0.05;
 				camera.position.y += ( - mouseY - camera.position.y ) * 0.05;
 
 				if ( video.readyState === video.HAVE_ENOUGH_DATA ) {
 
-					textureContext.drawImage( video, 0, 0 );
+					imageContext.drawImage( video, 0, 0 );
+					
+					if ( texture ) texture.needsUpdate = true;
+					if ( textureReflection ) textureReflection.needsUpdate = true;
+
 				}
 
-				textureReflectionContext.drawImage( texture, 0, 0 );
-				textureReflectionContext.fillStyle = textureReflectionGradient;
-				textureReflectionContext.fillRect( 0, 0, 480, 204 );
+				imageReflectionContext.drawImage( image, 0, 0 );
+				imageReflectionContext.fillStyle = imageReflectionGradient;
+				imageReflectionContext.fillRect( 0, 0, 480, 204 );
 
 				renderer.render( scene, camera );
-				stats.update();
 
 			}
 

+ 14 - 4
examples/particles_floor.html → examples/canvas_particles_floor.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - particles - floor</title>
+		<title>three.js canvas - particles - floor</title>
 		<meta charset="utf-8">
 		<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;"/>
 		<style type="text/css">
@@ -19,6 +19,8 @@
 	<body>
 
 		<script type="text/javascript" src="../build/Three.js"></script>
+
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
 		<script type="text/javascript" src="js/Stats.js"></script>
 
 		<script type="text/javascript">
@@ -35,7 +37,7 @@
 			var windowHalfY = window.innerHeight / 2;
 
 			init();
-			setInterval( loop, 1000 / 60 );
+			animate();
 
 			function init() {
 
@@ -106,14 +108,22 @@
 
 			//
 
-			function loop() {
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+				stats.update();
+
+			}
+
+			function render() {
 
 				camera.position.x += ( mouseX - camera.position.x ) * .05;
 				camera.position.y += ( - mouseY - camera.position.y ) * .05;
 
 				renderer.render( scene, camera );
 
-				stats.update();
 			}
 
 		</script>

+ 15 - 6
examples/particles_random.html → examples/canvas_particles_random.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - particles - random</title>
+		<title>three.js canvas - particles - random</title>
 		<meta charset="utf-8">
 		<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;"/>
 		<style type="text/css">
@@ -20,6 +20,7 @@
 
 		<script type="text/javascript" src="../build/Three.js"></script>
 
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
 		<script type="text/javascript" src="js/Stats.js"></script>
 
 		<script type="text/javascript">
@@ -32,12 +33,12 @@
 			var windowHalfY = window.innerHeight / 2;
 
 			init();
-			setInterval( loop, 1000 / 60 );
+			animate();
 
 			function init() {
 
-				container = document.createElement('div');
-				document.body.appendChild(container);
+				container = document.createElement( 'div' );
+				document.body.appendChild( container );
 
 				camera = new THREE.Camera( 75, window.innerWidth / window.innerHeight, 1, 3000 );
 				camera.position.z = 1000;
@@ -100,14 +101,22 @@
 
 			//
 
-			function loop() {
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+				stats.update();
+
+			}
+
+			function render() {
 
 				camera.position.x += ( mouseX - camera.position.x ) * 0.05;
 				camera.position.y += ( - mouseY - camera.position.y ) * 0.05;
 
 				renderer.render( scene, camera );
 
-				stats.update();
 			}
 
 		</script>

+ 21 - 8
examples/particles_sprites.html → examples/canvas_particles_sprites.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - particles - sprites</title>
+		<title>three.js canvas - particles - sprites</title>
 		<meta charset="utf-8">
 		<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;"/>
 		<style type="text/css">
@@ -19,8 +19,10 @@
 	<body>
 
 		<script type="text/javascript" src="../build/Three.js"></script>
-		<script type="text/javascript" src="js/Tween.js"></script>
+
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
 		<script type="text/javascript" src="js/Stats.js"></script>
+		<script type="text/javascript" src="js/Tween.js"></script>
 
 		<script type="text/javascript">
 
@@ -32,12 +34,12 @@
 			var windowHalfY = window.innerHeight / 2;
 
 			init();
-			setInterval( loop, 1000 / 60 );
+			animate();
 
 			function init() {
 
-				container = document.createElement('div');
-				document.body.appendChild(container);
+				container = document.createElement( 'div' );
+				document.body.appendChild( container );
 
 				camera = new THREE.Camera( 75, window.innerWidth / window.innerHeight, 1, 5000 );
 				camera.position.z = 1000;
@@ -76,7 +78,6 @@
 				var canvas = document.createElement( 'canvas' );
 				canvas.width = 16;
 				canvas.height = 16;
-				canvas.loaded = true;
 
 				var context = canvas.getContext( '2d' );
 				var gradient = context.createRadialGradient( canvas.width / 2, canvas.height / 2, 0, canvas.width / 2, canvas.height / 2, canvas.width / 2 );
@@ -136,7 +137,9 @@
 
 					mouseX = event.touches[ 0 ].pageX - windowHalfX;
 					mouseY = event.touches[ 0 ].pageY - windowHalfY;
+
 				}
+
 			}
 
 			function onDocumentTouchMove( event ) {
@@ -147,12 +150,23 @@
 
 					mouseX = event.touches[ 0 ].pageX - windowHalfX;
 					mouseY = event.touches[ 0 ].pageY - windowHalfY;
+
 				}
+
 			}
 
 			//
 
-			function loop() {
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+				stats.update();
+
+			}
+
+			function render() {
 
 				TWEEN.update();
 
@@ -161,7 +175,6 @@
 
 				renderer.render( scene, camera );
 
-				stats.update();
 			}
 
 		</script>

+ 14 - 5
examples/particles_waves.html → examples/canvas_particles_waves.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - particles - waves</title>
+		<title>three.js canvas - particles - waves</title>
 		<meta charset="utf-8">
 		<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;"/>
 		<style type="text/css">
@@ -18,6 +18,8 @@
 	</head>
 	<body>
 		<script type="text/javascript" src="../build/Three.js"></script>
+
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
 		<script type="text/javascript" src="js/Stats.js"></script>
 
 		<script type="text/javascript">
@@ -35,7 +37,7 @@
 			var windowHalfY = window.innerHeight / 2;
 
 			init();
-			setInterval(loop, 1000 / 60);
+			animate();
 
 			function init() {
 
@@ -116,7 +118,16 @@
 
 			//
 
-			function loop() {
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+				stats.update();
+
+			}
+
+			function render() {
 
 				camera.position.x += ( mouseX - camera.position.x ) * .05;
 				camera.position.y += ( - mouseY - camera.position.y ) * .05;
@@ -136,8 +147,6 @@
 
 				renderer.render( scene, camera );
 
-				stats.update();
-
 				count += 0.1;
 
 			}

+ 215 - 0
examples/canvas_performance.html

@@ -0,0 +1,215 @@
+<!DOCTYPE HTML>
+<html lang="en">
+	<head>
+		<title>three.js canvas - performance</title>
+		<meta charset="utf-8">
+		<style type="text/css">
+			body {
+				font-family: Monospace;
+				background-color: #f0f0f0;
+				margin: 0px;
+				overflow: hidden;
+			}
+		</style>
+	</head>
+	<body>
+
+		<!-- <script type="text/javascript" src="../build/Three.js"></script> -->
+
+		<script type="text/javascript" src="../src/Three.js"></script>
+		<script type="text/javascript" src="../src/core/Color.js"></script>
+		<script type="text/javascript" src="../src/core/Vector2.js"></script>
+		<script type="text/javascript" src="../src/core/Vector3.js"></script>
+		<script type="text/javascript" src="../src/core/Vector4.js"></script>
+		<script type="text/javascript" src="../src/core/Ray.js"></script>
+		<script type="text/javascript" src="../src/core/Rectangle.js"></script>
+		<script type="text/javascript" src="../src/core/Matrix3.js"></script>
+		<script type="text/javascript" src="../src/core/Matrix4.js"></script>
+		<script type="text/javascript" src="../src/core/Object3D.js"></script>
+		<script type="text/javascript" src="../src/core/Quaternion.js"></script>
+		<script type="text/javascript" src="../src/core/Vertex.js"></script>
+		<script type="text/javascript" src="../src/core/Face3.js"></script>
+		<script type="text/javascript" src="../src/core/Face4.js"></script>
+		<script type="text/javascript" src="../src/core/UV.js"></script>
+		<script type="text/javascript" src="../src/core/Geometry.js"></script>
+		<script type="text/javascript" src="../src/animation/AnimationHandler.js"></script>
+		<script type="text/javascript" src="../src/animation/Animation.js"></script>
+		<script type="text/javascript" src="../src/cameras/Camera.js"></script>
+		<script type="text/javascript" src="../src/cameras/QuakeCamera.js"></script>
+		<script type="text/javascript" src="../src/lights/Light.js"></script>
+		<script type="text/javascript" src="../src/lights/AmbientLight.js"></script>
+		<script type="text/javascript" src="../src/lights/DirectionalLight.js"></script>
+		<script type="text/javascript" src="../src/lights/PointLight.js"></script>
+		<script type="text/javascript" src="../src/materials/Material.js"></script>
+		<script type="text/javascript" src="../src/materials/Mappings.js"></script>
+		<script type="text/javascript" src="../src/materials/LineBasicMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/MeshBasicMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/MeshLambertMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/MeshPhongMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/MeshDepthMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/MeshNormalMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/MeshFaceMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/MeshShaderMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/ParticleBasicMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/ParticleCircleMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/ParticleDOMMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/Texture.js"></script>
+		<script type="text/javascript" src="../src/materials/RenderTarget.js"></script>
+		<script type="text/javascript" src="../src/materials/Uniforms.js"></script>
+		<script type="text/javascript" src="../src/objects/Particle.js"></script>
+		<script type="text/javascript" src="../src/objects/ParticleSystem.js"></script>
+		<script type="text/javascript" src="../src/objects/Line.js"></script>
+		<script type="text/javascript" src="../src/objects/Mesh.js"></script>
+		<script type="text/javascript" src="../src/objects/Bone.js"></script>
+		<script type="text/javascript" src="../src/objects/SkinnedMesh.js"></script>
+		<script type="text/javascript" src="../src/objects/Ribbon.js"></script>
+		<script type="text/javascript" src="../src/objects/Sound.js"></script>
+		<script type="text/javascript" src="../src/scenes/Scene.js"></script>
+		<script type="text/javascript" src="../src/scenes/Fog.js"></script>
+		<script type="text/javascript" src="../src/scenes/FogExp2.js"></script>
+		<script type="text/javascript" src="../src/renderers/Projector.js"></script>
+		<script type="text/javascript" src="../src/renderers/DOMRenderer.js"></script>
+		<script type="text/javascript" src="../src/renderers/CanvasRenderer.js"></script>
+		<script type="text/javascript" src="../src/renderers/SVGRenderer.js"></script>
+		<script type="text/javascript" src="../src/renderers/WebGLRenderer.js"></script>
+		<script type="text/javascript" src="../src/renderers/SoundRenderer.js"></script>
+		<script type="text/javascript" src="../src/renderers/renderables/RenderableObject.js"></script>
+		<script type="text/javascript" src="../src/renderers/renderables/RenderableFace3.js"></script>
+		<script type="text/javascript" src="../src/renderers/renderables/RenderableParticle.js"></script>
+		<script type="text/javascript" src="../src/renderers/renderables/RenderableLine.js"></script>
+		<script type="text/javascript" src="../src/extras/GeometryUtils.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/ShaderUtils.js"></script>
+		<script type="text/javascript" src="../src/extras/primitives/Cube.js"></script>
+		<script type="text/javascript" src="../src/extras/primitives/Cylinder.js"></script>
+		<script type="text/javascript" src="../src/extras/primitives/Plane.js"></script>
+		<script type="text/javascript" src="../src/extras/primitives/Sphere.js"></script>
+		<script type="text/javascript" src="../src/extras/primitives/Torus.js"></script>
+		<script type="text/javascript" src="../src/extras/primitives/Icosahedron.js"></script>
+		<script type="text/javascript" src="../src/extras/primitives/LathedObject.js"></script>
+		<script type="text/javascript" src="../src/extras/objects/MarchingCubes.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="js/RequestAnimationFrame.js"></script>
+		<script type="text/javascript" src="js/Stats.js"></script>
+
+		<script type="text/javascript">
+
+			var container, stats;
+
+			var camera, scene, renderer;
+
+			var sphere, plane;
+
+			var targetRotation = 0;
+			var targetRotationOnMouseDown = 0;
+
+			var mouseX = 0;
+			var mouseXOnMouseDown = 0;
+
+			var windowHalfX = window.innerWidth / 2;
+			var windowHalfY = window.innerHeight / 2;
+
+			init();
+			animate();
+
+			function init() {
+
+				container = document.createElement( 'div' );
+				document.body.appendChild( container );
+
+				camera = new THREE.Camera( 45, window.innerWidth / window.innerHeight, 1, 10000 );
+				camera.position.z = 1000;
+				camera.position.y = 1000;
+				camera.position.z = 1000;
+
+				scene = new THREE.Scene();
+
+				// Grid
+
+				var geometry = new THREE.Geometry();
+				geometry.vertices.push( new THREE.Vertex( new THREE.Vector3( - 500, 0, 0 ) ) );
+				geometry.vertices.push( new THREE.Vertex( new THREE.Vector3( 500, 0, 0 ) ) );
+
+				var material = new THREE.LineBasicMaterial( { color: 0x000000, opacity: 0.5 } );
+
+				for ( var i = 0; i <= 10; i ++ ) {
+
+					var line = new THREE.Line( geometry, material );
+					line.position.z = ( i * 100 ) - 500;
+					scene.addObject( line );
+
+					var line = new THREE.Line( geometry, material );
+					line.position.x = ( i * 100 ) - 500;
+					line.rotation.y = 90 * Math.PI / 180;
+					scene.addObject( line );
+
+				}
+
+				// Spheres
+
+				geometry = new Sphere( 100, 26, 18 );
+				material = new THREE.MeshLambertMaterial( { color: 0xffffff, shading: THREE.FlatShading, opacity: 1 } );
+
+				for ( var i = 0; i < 20; i ++ ) {
+
+					sphere = new THREE.Mesh( geometry, material );
+					sphere.overdraw = true;
+
+					sphere.position.x = ( i % 5 ) * 200 - 400;
+					sphere.position.z = Math.floor( i / 5 ) * 200 - 400;
+
+					scene.addObject( sphere );
+
+				}
+
+				// Lights
+
+				var ambientLight = new THREE.AmbientLight( Math.random() * 0x202020 );
+				scene.addLight( ambientLight );
+
+				var directionalLight = new THREE.DirectionalLight( Math.random() * 0xffffff );
+				directionalLight.position.x = 0;
+				directionalLight.position.y = 1;
+				directionalLight.position.z = 0;
+				scene.addLight( directionalLight );
+
+				var pointLight = new THREE.PointLight( 0xff0000, 1 );
+				scene.addLight( pointLight );
+
+				renderer = new THREE.CanvasRenderer();
+				renderer.setSize( window.innerWidth, window.innerHeight );
+
+				container.appendChild( renderer.domElement );
+
+				stats = new Stats();
+				stats.domElement.style.position = 'absolute';
+				stats.domElement.style.top = '0px';
+				container.appendChild(stats.domElement);
+
+			}
+
+			//
+
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+				stats.update();
+
+			}
+
+			function render() {
+
+				renderer.render( scene, camera );
+
+			}
+
+		</script>
+
+	</body>
+</html>

+ 46 - 17
examples/canvasrenderer_sandbox.html → examples/canvas_sandbox.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - geometry - sphere</title>
+		<title>three.js canvas - sandbox</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -25,21 +25,23 @@
 		<script type="text/javascript" src="../src/core/Rectangle.js"></script>
 		<script type="text/javascript" src="../src/core/Matrix3.js"></script>
 		<script type="text/javascript" src="../src/core/Matrix4.js"></script>
+		<script type="text/javascript" src="../src/core/Object3D.js"></script>
+		<script type="text/javascript" src="../src/core/Quaternion.js"></script>
 		<script type="text/javascript" src="../src/core/Vertex.js"></script>
 		<script type="text/javascript" src="../src/core/Face3.js"></script>
 		<script type="text/javascript" src="../src/core/Face4.js"></script>
 		<script type="text/javascript" src="../src/core/UV.js"></script>
 		<script type="text/javascript" src="../src/core/Geometry.js"></script>
+		<script type="text/javascript" src="../src/animation/AnimationHandler.js"></script>
+		<script type="text/javascript" src="../src/animation/Animation.js"></script>
 		<script type="text/javascript" src="../src/cameras/Camera.js"></script>
+		<script type="text/javascript" src="../src/cameras/QuakeCamera.js"></script>
 		<script type="text/javascript" src="../src/lights/Light.js"></script>
 		<script type="text/javascript" src="../src/lights/AmbientLight.js"></script>
 		<script type="text/javascript" src="../src/lights/DirectionalLight.js"></script>
 		<script type="text/javascript" src="../src/lights/PointLight.js"></script>
-		<script type="text/javascript" src="../src/objects/Object3D.js"></script>
-		<script type="text/javascript" src="../src/objects/Particle.js"></script>
-		<script type="text/javascript" src="../src/objects/Line.js"></script>
-		<script type="text/javascript" src="../src/objects/Mesh.js"></script>
 		<script type="text/javascript" src="../src/materials/Material.js"></script>
+		<script type="text/javascript" src="../src/materials/Mappings.js"></script>
 		<script type="text/javascript" src="../src/materials/LineBasicMaterial.js"></script>
 		<script type="text/javascript" src="../src/materials/MeshBasicMaterial.js"></script>
 		<script type="text/javascript" src="../src/materials/MeshLambertMaterial.js"></script>
@@ -52,28 +54,47 @@
 		<script type="text/javascript" src="../src/materials/ParticleCircleMaterial.js"></script>
 		<script type="text/javascript" src="../src/materials/ParticleDOMMaterial.js"></script>
 		<script type="text/javascript" src="../src/materials/Texture.js"></script>
-		<script type="text/javascript" src="../src/materials/mappings/CubeReflectionMapping.js"></script>
-		<script type="text/javascript" src="../src/materials/mappings/CubeRefractionMapping.js"></script>
-		<script type="text/javascript" src="../src/materials/mappings/LatitudeReflectionMapping.js"></script>
-		<script type="text/javascript" src="../src/materials/mappings/LatitudeRefractionMapping.js"></script>
-		<script type="text/javascript" src="../src/materials/mappings/SphericalReflectionMapping.js"></script>
-		<script type="text/javascript" src="../src/materials/mappings/SphericalRefractionMapping.js"></script>
-		<script type="text/javascript" src="../src/materials/mappings/UVMapping.js"></script>
+		<script type="text/javascript" src="../src/materials/RenderTarget.js"></script>
+		<script type="text/javascript" src="../src/materials/Uniforms.js"></script>
+		<script type="text/javascript" src="../src/objects/Particle.js"></script>
+		<script type="text/javascript" src="../src/objects/ParticleSystem.js"></script>
+		<script type="text/javascript" src="../src/objects/Line.js"></script>
+		<script type="text/javascript" src="../src/objects/Mesh.js"></script>
+		<script type="text/javascript" src="../src/objects/Bone.js"></script>
+		<script type="text/javascript" src="../src/objects/SkinnedMesh.js"></script>
+		<script type="text/javascript" src="../src/objects/Ribbon.js"></script>
+		<script type="text/javascript" src="../src/objects/Sound.js"></script>
 		<script type="text/javascript" src="../src/scenes/Scene.js"></script>
 		<script type="text/javascript" src="../src/scenes/Fog.js"></script>
+		<script type="text/javascript" src="../src/scenes/FogExp2.js"></script>
 		<script type="text/javascript" src="../src/renderers/Projector.js"></script>
 		<script type="text/javascript" src="../src/renderers/DOMRenderer.js"></script>
 		<script type="text/javascript" src="../src/renderers/CanvasRenderer.js"></script>
 		<script type="text/javascript" src="../src/renderers/SVGRenderer.js"></script>
 		<script type="text/javascript" src="../src/renderers/WebGLRenderer.js"></script>
+		<script type="text/javascript" src="../src/renderers/SoundRenderer.js"></script>
 		<script type="text/javascript" src="../src/renderers/renderables/RenderableObject.js"></script>
 		<script type="text/javascript" src="../src/renderers/renderables/RenderableFace3.js"></script>
 		<script type="text/javascript" src="../src/renderers/renderables/RenderableParticle.js"></script>
 		<script type="text/javascript" src="../src/renderers/renderables/RenderableLine.js"></script>
+		<script type="text/javascript" src="../src/extras/GeometryUtils.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/ShaderUtils.js"></script>
+		<script type="text/javascript" src="../src/extras/primitives/Cube.js"></script>
+		<script type="text/javascript" src="../src/extras/primitives/Cylinder.js"></script>
+		<script type="text/javascript" src="../src/extras/primitives/Plane.js"></script>
+		<script type="text/javascript" src="../src/extras/primitives/Sphere.js"></script>
+		<script type="text/javascript" src="../src/extras/primitives/Torus.js"></script>
+		<script type="text/javascript" src="../src/extras/primitives/Icosahedron.js"></script>
+		<script type="text/javascript" src="../src/extras/primitives/LathedObject.js"></script>
+		<script type="text/javascript" src="../src/extras/objects/MarchingCubes.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/ImageUtils.js"></script>
 
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
 		<script type="text/javascript" src="js/Stats.js"></script>
 
 		<script type="text/javascript">
@@ -105,7 +126,7 @@
 			var debugContext;
 
 			init();
-			setInterval( loop, 1000 / 60 );
+			animate();
 
 			function init() {
 
@@ -145,7 +166,7 @@
 				objects = [];
 
 				geometry = new Sphere( 100, 16, 8 );
-				material = new THREE.MeshBasicMaterial( { env_map: ImageUtils.loadTexture( 'textures/envmap.png', new THREE.SphericalReflectionMapping() ) } );
+				material = new THREE.MeshBasicMaterial( { env_map: ImageUtils.loadTexture( 'textures/metal.jpg', new THREE.SphericalReflectionMapping() ) } );
 
 				for ( var i = 0; i < 10; i ++ ) {
 
@@ -250,7 +271,16 @@
 
 			//
 
-			function loop() {
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+				stats.update();
+
+			}
+
+			function render() {
 
 				if ( moveForward ) camera.position.z -= 5;
 				if ( moveBackwards ) camera.position.z += 5;
@@ -304,9 +334,8 @@
 				debugContext.closePath();
 				debugContext.stroke();
 
-				renderer.render(scene, camera);
+				renderer.render( scene, camera );
 
-				stats.update();
 			}
 
 		</script>

+ 0 - 216
examples/hdr.html

@@ -1,216 +0,0 @@
-<!DOCTYPE HTML>
-<html lang="en">
-    <head>
-        <title>three.js - materials - HDR texture - webgl</title>
-        <meta charset="utf-8">
-        <style type="text/css">
-            body {
-                color: #000;
-                font-family:Monospace;
-                font-size:13px;
-                text-align:center;
-                font-weight: bold;
-
-                background-color: #fff;
-                margin: 0px;
-                overflow: hidden;
-            }
-
-            #info {
-				color:#000;
-                position: absolute;
-                top: 0px; width: 100%;
-                padding: 5px;
-				
-            }
-
-            a { color: red; }
-
-        </style>
-    </head>
-    <body>
-
-        <div id="container"></div>
-        <div id="info">
-			<a href="http://github.com/mrdoob/three.js" target="_blank">three.js</a> - webgl HDR texture example -
-			based on <a href="http://spidergl.org/example.php?id=13" target="_blank">SpiderGL</a>
-		</div>
-
-        <script type="text/javascript" src="../build/ThreeExtras.js"></script>
-        <script type="text/javascript" src="js/Stats.js"></script>
-
-		
-		<!-- HDR fragment shader -->
-		<script id="fs-hdr" type="x-shader/x-fragment">
-		uniform sampler2D   tDiffuse;
-		uniform float       exposure;
-		uniform float       brightMax;
-		
-		varying vec2  vUv;
-		 
-		vec3 decode_pnghdr( const in vec4 color ) {
-		
-			// remove gamma correction
-			vec4 res = color * color;
-			
-			// decoded RI
-			float ri = pow( 2.0, res.w * 32.0 - 16.0 );
-			
-			// decoded HDR pixel
-			res.xyz = res.xyz * ri;
-			return res.xyz;
-			
-		}
-		 
-		void main(void)
-		{
-			vec4 color = texture2D( tDiffuse, vUv );
-			color.xyz  = decode_pnghdr( color );
-			
-			// apply gamma correction and exposure
-			//gl_FragColor = vec4( pow( exposure * color.xyz, vec3( 0.474 ) ), 1.0 );
-			
-			// Perform tone-mapping
-			float Y = dot(vec4(0.30, 0.59, 0.11, 0.0), color);
-			float YD = exposure * (exposure/brightMax + 1.0) / (exposure + 1.0);
-			color *= YD;
-			
-			gl_FragColor = vec4( color.xyz, 1.0 );
-		}
-		</script>
-		
-		<!-- HDR vertex shader -->
-		<script id="vs-hdr" type="x-shader/x-vertex">
-		varying vec2 vUv;
-		 
-		void main(void)
-		{
-			vUv  = uv;
-			gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );
-		}		
-		</script>
-		
-
-        <script type="text/javascript">
-
-			if ( ! THREE.Detector.webgl ) THREE.Detector.addGetWebGLMessage();
-
-            var container, stats;
-
-            var camera, scene, renderer, mesh, directionalLight;
-			
-			var windowHalfX = window.innerWidth / 2;
-			var windowHalfY = window.innerHeight / 2;
-			
-            var materialHDR, quad;
-
-            init();
-            setInterval( loop, 1000 / 60 );
-
-            function init() {
-
-                container = document.getElementById( 'container' );
-
-				camera = new THREE.Camera( 50, window.innerWidth / window.innerHeight, 1, 10000 );
-				camera.position.z = 900;
-
-                scene = new THREE.Scene();
-
-				directionalLight = new THREE.DirectionalLight( 0xffffff );
-				directionalLight.position.x = 0;
-				directionalLight.position.y = 0;
-				directionalLight.position.z = 1;
-				directionalLight.position.normalize();
-				scene.addLight( directionalLight );
-
-				var texture = ImageUtils.loadTexture( "textures/memorial.png" );
-				texture.min_filter = THREE.LinearFilter;
-				texture.mag_filter = THREE.NearestFilter;
-				
-                materialHDR = new THREE.MeshShaderMaterial( {
-
-                    uniforms: { tDiffuse:  { type: "t", value: 0, texture: texture },
-								exposure:  { type: "f", value: 0.125 },
-								brightMax: { type: "f", value: 0.5 }
-							  },
-                    vertex_shader: getText( 'vs-hdr' ),
-                    fragment_shader: getText( 'fs-hdr' )
-
-                } );
-
-				var plane = new Plane( 512, 768 );				
-
-                quad = new THREE.Mesh( plane, materialHDR );
-				quad.position.z = -100;
-                scene.addObject( quad );
-
-                renderer = new THREE.WebGLRenderer();
-				renderer.setSize( window.innerWidth, window.innerHeight );
-                container.appendChild( renderer.domElement );
-				
-                stats = new Stats();
-                stats.domElement.style.position = 'absolute';
-                stats.domElement.style.top = '0px';
-                container.appendChild( stats.domElement );
-
-            }
-
-			function getText( id ) {
-				
-				return document.getElementById( id ).textContent;
-			}
-			
-			var delta, current, old = 0, sign = 1, rate = 1;
-			
-            function loop() {
-
-				if ( ! old ) old = new Date().getTime();
-				current = new Date().getTime();
-				delta = (current  - old ) * 0.005;
-				old = current;
-				
-				if ( materialHDR.uniforms.exposure.value > 0 || materialHDR.uniforms.exposure.value < 1 ) {
-				
-					rate = 0.25;
-					
-				} else {
-				
-					rate = 1;
-					
-				}
-				
-				
-				if ( materialHDR.uniforms.exposure.value > 5 || materialHDR.uniforms.exposure.value <= 0 ) {
-				
-					sign *= -1;
-					
-				}				
-				
-
-				materialHDR.uniforms.exposure.value += sign * rate * delta;
-				
-				// Render final scene to the screen with film shader
-
-				renderer.render( scene, camera );
-
-                stats.update();
-
-            }
-			
-			function is_browser_compatible() {
-
-				// WebGL support
-
-				try { var test = new Float32Array(1); } catch(e) { return false; }
-
-				// Web workers
-
-				return !!window.Worker;
-
-			}
-			
-
-        </script>
-
-    </body>
-</html>

+ 143 - 0
examples/js/CameraControl.js

@@ -0,0 +1,143 @@
+/**
+ * @author mrdoob / http://mrdoob.com/
+ * @author alteredq / http://alteredqualia.com/
+ * @author paulirish / http://paulirish.com/
+ */
+
+function bind( scope, fn ) {
+	return function () {
+		fn.apply( scope, arguments );
+	};
+}
+
+CameraControlWASD = function ( camera, movement_speed, look_speed, nofly, look_vertical ) {
+
+	this.movement_speed = movement_speed !== undefined ? movement_speed : 1.0;
+	this.look_speed = look_speed !== undefined ? look_speed : 0.005;
+
+	this.nofly = nofly;
+	this.look_vertical = look_vertical;
+	
+	this.camera = camera;
+	
+	this.mouseX = 0;
+	this.mouseY = 0;
+	
+	this.lat = 0;
+	this.lon = 0;
+	this.phy = 0;
+	this.theta = 0;
+	
+	this.moveForward = false;
+	this.moveBackward = false;
+	this.moveLeft = false;
+	this.moveRight = false;
+	
+	this.windowHalfX = window.innerWidth / 2;
+	this.windowHalfY = window.innerHeight / 2;
+
+	this.onDocumentMouseDown = function ( event ) {
+		
+		event.preventDefault();
+		event.stopPropagation();
+
+		switch ( event.button ) {
+
+			case 0: this.moveForward = true; break;
+			case 2: this.moveBackward = true; break;
+
+		}
+
+	};
+
+	this.onDocumentMouseUp = function ( event ) {
+
+		event.preventDefault();
+		event.stopPropagation();
+
+		switch ( event.button ) {
+
+			case 0: this.moveForward = false; break;
+			case 2: this.moveBackward = false; break;
+
+		}
+
+	};
+
+	this.onDocumentMouseMove = function (event) {
+
+		this.mouseX = event.clientX - this.windowHalfX;
+		this.mouseY = event.clientY - this.windowHalfY;
+
+	};
+	
+	this.onDocumentKeyDown = function ( event ) {
+
+		switch( event.keyCode ) {
+
+			case 38: /*up*/
+			case 87: /*W*/ this.moveForward = true; break;
+
+			case 37: /*left*/
+			case 65: /*A*/ this.moveLeft = true; break;
+
+			case 40: /*down*/
+			case 83: /*S*/ this.moveBackward = true; break;
+
+			case 39: /*right*/
+			case 68: /*D*/ this.moveRight = true; break;
+
+		}
+
+	};
+
+	this.onDocumentKeyUp = function ( event ) {
+
+		switch( event.keyCode ) {
+
+			case 38: /*up*/
+			case 87: /*W*/ this.moveForward = false; break;
+
+			case 37: /*left*/
+			case 65: /*A*/ this.moveLeft = false; break;
+
+			case 40: /*down*/
+			case 83: /*S*/ this.moveBackward = false; break;
+
+			case 39: /*right*/
+			case 68: /*D*/ this.moveRight = false; break;
+
+		}
+
+	};
+	
+	this.update = function() {
+	
+		if ( this.moveForward )  this.camera.translateZ( - this.movement_speed, this.nofly );
+		if ( this.moveBackward ) this.camera.translateZ(   this.movement_speed, this.nofly  );
+		if ( this.moveLeft )     this.camera.translateX( - this.movement_speed, this.nofly  );
+		if ( this.moveRight )    this.camera.translateX(   this.movement_speed, this.nofly  );
+
+		this.lon += this.mouseX * this.look_speed;
+		if( this.look_vertical ) this.lat -= this.mouseY * this.look_speed;
+
+		this.lat = Math.max( - 85, Math.min( 85, this.lat ) );
+		this.phi = ( 90 - this.lat ) * Math.PI / 180;
+		this.theta = this.lon * Math.PI / 180;
+
+		this.camera.target.position.x = 100 * Math.sin( this.phi ) * Math.cos( this.theta ) + this.camera.position.x;
+		this.camera.target.position.y = 100 * Math.cos( this.phi ) + this.camera.position.y;
+		this.camera.target.position.z = 100 * Math.sin( this.phi ) * Math.sin( this.theta ) + this.camera.position.z;
+		
+	};
+	
+	
+	document.addEventListener( 'contextmenu', function ( event ) { event.preventDefault(); }, false );
+	
+	document.addEventListener( 'mousemove', bind( this, this.onDocumentMouseMove ), false );
+	document.addEventListener( 'mousedown', bind( this, this.onDocumentMouseDown ), false );
+	document.addEventListener( 'mouseup', bind( this, this.onDocumentMouseUp ), false );
+	document.addEventListener( 'keydown', bind( this, this.onDocumentKeyDown ), false );
+	document.addEventListener( 'keyup', bind( this, this.onDocumentKeyUp ), false );
+	
+};

+ 23 - 23
src/extras/Detector.js → examples/js/Detector.js

@@ -1,48 +1,48 @@
 /**
  * @author alteredq / http://alteredqualia.com/
  */
- 
-THREE.Detector = {
-	
+
+Detector = {
+
 	// supported features
-	
-	canvas	: !!window.CanvasRenderingContext2D, // !!document.createElement( 'canvas' ).getContext,
-	webgl	: !!window.WebGLRenderingContext, // window.Uint8Array != undefined,
+
+	canvas	: !!window.CanvasRenderingContext2D,
+	webgl	: !!window.WebGLRenderingContext,
 	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',
+		'Please try with',
 		'<a href="http://www.google.com/chrome">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";
@@ -51,12 +51,12 @@ THREE.Detector = {
 		style.padding = "1em";
 		style.width = "475px";
 		style.margin = "5em auto 0";
-		
+
 		wrap.appendChild( message )
 		parent.appendChild( wrap );
-		
+
 		return message;
 
 	}
-	
+
 };

+ 22 - 0
examples/js/RequestAnimationFrame.js

@@ -0,0 +1,22 @@
+/**
+ * Provides requestAnimationFrame in a cross browser way.
+ * @author paulirish / http://paulirish.com/
+ */
+
+if ( !window.requestAnimationFrame ) {
+
+	window.requestAnimationFrame = ( function() {
+
+		return window.webkitRequestAnimationFrame ||
+		window.mozRequestAnimationFrame || // comment out if FF4 is slow (it caps framerate at ~30fps: https://bugzilla.mozilla.org/show_bug.cgi?id=630127)
+		window.oRequestAnimationFrame ||
+		window.msRequestAnimationFrame ||
+		function( /* function FrameRequestCallback */ callback, /* DOMElement Element */ element ) {
+
+			window.setTimeout( callback, 1000 / 60 );
+
+		};
+
+	} )();
+
+}

+ 115 - 0
examples/js/ShaderExtras.js

@@ -0,0 +1,115 @@
+var ShaderExtras = {
+
+	/* -------------------------------------------------------------------------
+	//	Depth-of-field shader with bokeh
+	//	ported from GLSL shader by Martins Upitis 
+	//	http://artmartinsh.blogspot.com/2010/02/glsl-lens-blur-filter-with-bokeh.html
+	 ------------------------------------------------------------------------- */
+	
+	'bokeh'	: {
+
+	uniforms: { tColor:   { type: "t", value: 0, texture: null },
+				tDepth:   { type: "t", value: 1, texture: null },
+				focus:    { type: "f", value: 1.0 },
+				aspect:   { type: "f", value: 1.0 },
+				aperture: { type: "f", value: 0.025 },
+				maxblur:  { type: "f", value: 1.0 },
+			  },
+
+	vertex_shader: [
+
+	"varying vec2 vUv;",
+
+	"void main() {",
+		
+		"vUv = vec2( uv.x, 1.0 - uv.y );",
+		"gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );",
+		
+	"}"
+
+	].join("\n"),
+
+	fragment_shader: [
+
+	"varying vec2 vUv;",
+	
+	"uniform sampler2D tColor;",
+	"uniform sampler2D tDepth;",
+
+	"uniform float maxblur;",  	// max blur amount
+	"uniform float aperture;",	// aperture - bigger values for shallower depth of field
+	
+	"uniform float focus;",
+	"uniform float aspect;",
+	
+	"void main() {",
+
+	"vec2 aspectcorrect = vec2( 1.0, aspect );",
+
+	"vec4 depth1 = texture2D( tDepth, vUv );",
+
+	"float factor = depth1.x - focus;",
+ 
+	"vec2 dofblur = vec2 ( clamp( factor * aperture, -maxblur, maxblur ) );",
+	
+	"vec2 dofblur9 = dofblur * 0.9;",
+	"vec2 dofblur7 = dofblur * 0.7;",
+	"vec2 dofblur4 = dofblur * 0.4;",
+
+	"vec4 col = vec4( 0.0 );",
+
+	"col += texture2D( tColor, vUv.xy );",
+	"col += texture2D( tColor, vUv.xy + ( vec2(  0.0,   0.4  ) * aspectcorrect ) * dofblur );",
+	"col += texture2D( tColor, vUv.xy + ( vec2(  0.15,  0.37 ) * aspectcorrect ) * dofblur );",
+	"col += texture2D( tColor, vUv.xy + ( vec2(  0.29,  0.29 ) * aspectcorrect ) * dofblur );",
+	"col += texture2D( tColor, vUv.xy + ( vec2( -0.37,  0.15 ) * aspectcorrect ) * dofblur );",
+	"col += texture2D( tColor, vUv.xy + ( vec2(  0.40,  0.0  ) * aspectcorrect ) * dofblur );",
+	"col += texture2D( tColor, vUv.xy + ( vec2(  0.37, -0.15 ) * aspectcorrect ) * dofblur );",	
+	"col += texture2D( tColor, vUv.xy + ( vec2(  0.29, -0.29 ) * aspectcorrect ) * dofblur );",	
+	"col += texture2D( tColor, vUv.xy + ( vec2( -0.15, -0.37 ) * aspectcorrect ) * dofblur );",
+	"col += texture2D( tColor, vUv.xy + ( vec2(  0.0,  -0.4  ) * aspectcorrect ) * dofblur );",	
+	"col += texture2D( tColor, vUv.xy + ( vec2( -0.15,  0.37 ) * aspectcorrect ) * dofblur );",
+	"col += texture2D( tColor, vUv.xy + ( vec2( -0.29,  0.29 ) * aspectcorrect ) * dofblur );",
+	"col += texture2D( tColor, vUv.xy + ( vec2(  0.37,  0.15 ) * aspectcorrect ) * dofblur );",	
+	"col += texture2D( tColor, vUv.xy + ( vec2( -0.4,   0.0  ) * aspectcorrect ) * dofblur );",	
+	"col += texture2D( tColor, vUv.xy + ( vec2( -0.37, -0.15 ) * aspectcorrect ) * dofblur );",	
+	"col += texture2D( tColor, vUv.xy + ( vec2( -0.29, -0.29 ) * aspectcorrect ) * dofblur );",	
+	"col += texture2D( tColor, vUv.xy + ( vec2(  0.15, -0.37 ) * aspectcorrect ) * dofblur );",
+
+	"col += texture2D( tColor, vUv.xy + ( vec2(  0.15,  0.37 ) * aspectcorrect ) * dofblur9 );",
+	"col += texture2D( tColor, vUv.xy + ( vec2( -0.37,  0.15 ) * aspectcorrect ) * dofblur9 );",		
+	"col += texture2D( tColor, vUv.xy + ( vec2(  0.37, -0.15 ) * aspectcorrect ) * dofblur9 );",		
+	"col += texture2D( tColor, vUv.xy + ( vec2( -0.15, -0.37 ) * aspectcorrect ) * dofblur9 );",
+	"col += texture2D( tColor, vUv.xy + ( vec2( -0.15,  0.37 ) * aspectcorrect ) * dofblur9 );",
+	"col += texture2D( tColor, vUv.xy + ( vec2(  0.37,  0.15 ) * aspectcorrect ) * dofblur9 );",		
+	"col += texture2D( tColor, vUv.xy + ( vec2( -0.37, -0.15 ) * aspectcorrect ) * dofblur9 );",	
+	"col += texture2D( tColor, vUv.xy + ( vec2(  0.15, -0.37 ) * aspectcorrect ) * dofblur9 );",	
+
+	"col += texture2D( tColor, vUv.xy + ( vec2(  0.29,  0.29 ) * aspectcorrect ) * dofblur7 );",
+	"col += texture2D( tColor, vUv.xy + ( vec2(  0.40,  0.0  ) * aspectcorrect ) * dofblur7 );",	
+	"col += texture2D( tColor, vUv.xy + ( vec2(  0.29, -0.29 ) * aspectcorrect ) * dofblur7 );",	
+	"col += texture2D( tColor, vUv.xy + ( vec2(  0.0,  -0.4  ) * aspectcorrect ) * dofblur7 );",	
+	"col += texture2D( tColor, vUv.xy + ( vec2( -0.29,  0.29 ) * aspectcorrect ) * dofblur7 );",
+	"col += texture2D( tColor, vUv.xy + ( vec2( -0.4,   0.0  ) * aspectcorrect ) * dofblur7 );",	
+	"col += texture2D( tColor, vUv.xy + ( vec2( -0.29, -0.29 ) * aspectcorrect ) * dofblur7 );",	
+	"col += texture2D( tColor, vUv.xy + ( vec2(  0.0,   0.4  ) * aspectcorrect ) * dofblur7 );",
+		 
+	"col += texture2D( tColor, vUv.xy + ( vec2(  0.29,  0.29 ) * aspectcorrect ) * dofblur4 );",
+	"col += texture2D( tColor, vUv.xy + ( vec2(  0.4,   0.0  ) * aspectcorrect ) * dofblur4 );",	
+	"col += texture2D( tColor, vUv.xy + ( vec2(  0.29, -0.29 ) * aspectcorrect ) * dofblur4 );",	
+	"col += texture2D( tColor, vUv.xy + ( vec2(  0.0,  -0.4  ) * aspectcorrect ) * dofblur4 );",
+	"col += texture2D( tColor, vUv.xy + ( vec2( -0.29,  0.29 ) * aspectcorrect ) * dofblur4 );",
+	"col += texture2D( tColor, vUv.xy + ( vec2( -0.4,   0.0  ) * aspectcorrect ) * dofblur4 );",
+	"col += texture2D( tColor, vUv.xy + ( vec2( -0.29, -0.29 ) * aspectcorrect ) * dofblur4 );",	
+	"col += texture2D( tColor, vUv.xy + ( vec2(  0.0,   0.4  ) * aspectcorrect ) * dofblur4 );",
+
+	"gl_FragColor = col / 41.0;",
+	"gl_FragColor.a = 1.0;",
+	
+	"}"
+	
+	].join("\n")	
+	
+}
+
+};

+ 170 - 0
examples/js/gui/gui.css

@@ -0,0 +1,170 @@
+#guidat { 
+	position: fixed;
+	top: 0; 
+	right: 0;
+	width: auto;
+	z-index: 1001;
+	text-align: right;
+}
+
+.guidat { 
+	color: #fff;
+	opacity: 0.97;
+	text-align: left;
+	float: right;
+	margin-right: 20px;
+	margin-bottom: 20px;
+	background-color: #fff;
+}
+
+.guidat,
+.guidat input { 
+	font: 9.5px Lucida Grande, sans-serif;
+}
+
+.guidat-controllers { 
+	height: 300px;
+	overflow-y: auto;
+	overflow-x: hidden;
+	background-color: rgba(0,0,0,0.1);
+	/*
+	-moz-transition: height .2s ease-out;
+	-webkit-transition: height .2s ease-out;
+	transition: height .2s ease-out;
+	*/
+}
+
+a.guidat-toggle { 
+	text-decoration: none;
+	cursor: pointer;
+	color: #fff;
+	background-color: #222;
+	text-align: center;
+	display: block;
+	padding: 5px;
+
+}
+
+a.guidat-toggle:hover { 
+	background-color: #000;
+}
+
+.guidat-controller { 
+	padding: 3px;
+	height: 25px;
+	clear: left;
+	border-bottom: 1px solid #222;
+	background-color: #111;
+}
+
+.guidat-controller,
+.guidat-controller input,
+.guidat-slider-bg,
+.guidat-slider-fg { 
+	-moz-transition: background-color 0.15s linear;
+	-webkit-transition: background-color 0.15s linear;
+	transition: background-color 0.15s linear;
+}
+
+.guidat-controller.boolean:hover,
+.guidat-controller.function:hover {
+	background-color: #000;
+}
+
+.guidat-controller input { 
+	float: right;
+	outline: none;
+	border: 0;
+	padding: 4px;
+	margin-top: 2px;
+	background-color: #222;
+}
+
+
+.guidat-controller select {
+	margin-top: 4px;
+	float: right;
+}
+
+.guidat-controller input:hover { 
+	background-color: #444;
+}
+
+.guidat-controller input:focus { 
+	background-color: #555;
+}
+
+.guidat-controller.number { 
+	border-left: 5px solid #00aeff ;
+}
+
+.guidat-controller.string { 
+	border-left: 5px solid #1ed36f;
+}
+
+.guidat-controller.string input { 
+	border: 0;
+	color: #1ed36f;
+	margin-right: 2px;
+	width: 148px;
+}
+
+.guidat-controller.boolean { 
+	border-left: 5px solid #54396e;
+}
+
+.guidat-controller.function { 
+	border-left: 5px solid #e61d5f;
+}
+
+.guidat-controller.number input[type=text] {
+	width: 35px;
+	margin-left: 5px;
+	margin-right: 2px;
+	color: #00aeff;
+}
+
+.guidat .guidat-controller.boolean input { 
+	margin-top: 6px;
+	margin-right: 2px;
+	font-size: 20px;
+}
+
+.guidat-controller:last-child {
+	border-bottom: none;
+	-webkit-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.5);
+	-moz-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.5);
+	box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.5);
+}
+
+.guidat-propertyname { 
+	padding: 5px;
+	padding-top: 7px;
+	cursor: default;
+	display: inline-block;
+}
+
+
+.guidat-slider-bg:hover,
+.guidat-slider-bg.active {
+	background-color: #444;
+}
+
+.guidat-slider-bg:hover .guidat-slider-fg, 
+.guidat-slider-bg.active .guidat-slider-fg { 
+	background-color: #52c8ff;
+}
+
+.guidat-slider-bg { 
+	background-color: #222;
+	cursor: ew-resize;
+	width: 40%;
+	margin-top: 2px;
+	float: right;
+	height: 21px;
+}
+
+.guidat-slider-fg { 
+	background-color: #00aeff;
+	height: 20px;
+}

+ 1051 - 0
examples/js/gui/gui.full.js

@@ -0,0 +1,1051 @@
+var GUI = function() {
+
+	var _this = this;
+	
+	var MIN_WIDTH = 240;
+	var MAX_WIDTH = 500;
+	
+	var controllers = [];
+	var listening = [];
+	
+	var autoListen = true;
+	
+	var listenInterval;
+	
+	// Sum total of heights of controllers in this gui
+	var controllerHeight;
+	
+	var curControllerContainerHeight = 0;
+	
+	var _this = this;
+	
+	var open = false;
+	var width = 280;
+	
+	// Prevents checkForOverflow bug in which loaded gui appearance
+	// settings are not respected by presence of scrollbar.
+	var explicitOpenHeight = false;
+	
+	// How big we get when we open
+	var openHeight;
+	
+	var name;
+	
+	var resizeTo = 0;
+	var resizeTimeout;
+	
+	this.domElement = document.createElement('div');
+	this.domElement.setAttribute('class', 'guidat');
+	this.domElement.style.width = width+'px';
+
+	var controllerContainer = document.createElement('div');
+	controllerContainer.setAttribute('class', 'guidat-controllers');
+	
+	// Firefox hack to prevent horizontal scrolling
+	controllerContainer.addEventListener('DOMMouseScroll', function(e) {
+		
+		var scrollAmount = this.scrollTop;
+		
+		if (e.wheelDelta) {
+			scrollAmount+=e.wheelDelta; 
+		} else if (e.detail) {
+			scrollAmount+=e.detail;
+		}
+			
+		if (e.preventDefault) {
+			e.preventDefault();
+		}
+		e.returnValue = false;
+		
+		controllerContainer.scrollTop = scrollAmount;
+		
+	}, false);
+	
+	controllerContainer.style.height = '0px';
+
+	var toggleButton = document.createElement('a');
+	toggleButton.setAttribute('class', 'guidat-toggle');
+	toggleButton.setAttribute('href', '#');
+	toggleButton.innerHTML = "Show Controls";
+	
+	var toggleDragged = false;
+	var dragDisplacementY = 0;
+	var togglePressed = false;
+	
+	var my, pmy, mx, pmx;
+	
+	var resize = function(e) {
+		pmy = my;
+		pmx = mx;
+		my = e.pageY;
+		mx = e.pageX;
+		
+		var dmy = my - pmy;
+				
+		if (!open) { 
+			if (dmy > 0) {
+				open = true;
+				curControllerContainerHeight = openHeight = 1;
+				toggleButton.innerHTML = name || "Hide Controls";
+			} else {
+				return;
+			}
+		}
+		
+		// TODO: Flip this if you want to resize to the left.
+		var dmx = pmx - mx;
+		
+		if (dmy > 0 && 
+			curControllerContainerHeight > controllerHeight) {
+			var d = GUI.map(curControllerContainerHeight, controllerHeight, controllerHeight + 100, 1, 0);
+			dmy *= d;
+		}
+		
+		toggleDragged = true;
+		dragDisplacementY += dmy;
+		dragDisplacementX += dmx;
+		openHeight += dmy;
+		width += dmx;
+		curControllerContainerHeight += dmy;
+		controllerContainer.style.height = openHeight+'px';
+		width = GUI.constrain(width, MIN_WIDTH, MAX_WIDTH);
+		_this.domElement.style.width = width+'px';
+		checkForOverflow();
+	};
+	
+	toggleButton.addEventListener('mousedown', function(e) {
+		pmy = my = e.pageY;
+		pmx = mx = e.pageX;
+		togglePressed = true;
+		e.preventDefault();
+		dragDisplacementY = 0;
+		dragDisplacementX = 0;
+		document.addEventListener('mousemove', resize, false);
+		return false;
+
+	}, false);
+	
+	
+	toggleButton.addEventListener('click', function(e) {
+		e.preventDefault();
+		return false;
+	}, false);
+	
+	
+	document.addEventListener('mouseup', function(e) {
+		
+		if (togglePressed && !toggleDragged) {
+			
+			_this.toggle();
+
+			// Clears lingering slider column
+			_this.domElement.style.width = (width+1)+'px';
+			setTimeout(function() {
+				_this.domElement.style.width = width+'px';
+			}, 1);
+		}
+		
+		if (togglePressed && toggleDragged) {
+		
+			if (dragDisplacementX == 0) {
+			
+				// Clears lingering slider column
+				_this.domElement.style.width = (width+1)+'px';
+				setTimeout(function() {
+					_this.domElement.style.width = width+'px';
+				}, 1);
+	
+			}
+		
+			if (openHeight > controllerHeight) {
+			
+				clearTimeout(resizeTimeout);
+				openHeight = resizeTo = controllerHeight;
+				beginResize();
+				
+			} else if (controllerContainer.children.length >= 1) {
+
+				var singleControllerHeight = controllerContainer.children[0].offsetHeight;			
+				clearTimeout(resizeTimeout);
+				var target = Math.round(curControllerContainerHeight/singleControllerHeight)*singleControllerHeight-1;
+				resizeTo = target;
+				if (resizeTo <= 0) {
+					_this.hide();
+					openHeight = singleControllerHeight*2;
+				} else { 
+					openHeight = resizeTo;		
+					beginResize();			
+				}
+			}
+			
+			
+			
+		}
+		
+		
+		document.removeEventListener('mousemove', resize, false);
+		e.preventDefault();
+		toggleDragged = false;
+		togglePressed = false;
+		
+		return false;
+
+	}, false);
+	
+	this.domElement.appendChild(controllerContainer);
+	this.domElement.appendChild(toggleButton);
+
+	if (GUI.autoPlace) {
+		if(GUI.autoPlaceContainer == null) {
+			GUI.autoPlaceContainer = document.createElement('div');
+			GUI.autoPlaceContainer.setAttribute("id", "guidat");
+			
+			document.body.appendChild(GUI.autoPlaceContainer);
+		}
+		GUI.autoPlaceContainer.appendChild(this.domElement);
+	}
+
+	this.autoListenIntervalTime = 1000/60;
+
+	var createListenInterval = function() {
+		listenInterval = setInterval(function() {
+			_this.listen();
+		}, this.autoListenIntervalTime);
+	}
+	
+	this.__defineSetter__("autoListen", function(v) {
+		autoListen = v;
+		if (!autoListen) {
+			clearInterval(listenInterval);
+		} else { 
+			if (listening.length > 0) createListenInterval();
+		}
+	});
+	
+	this.__defineGetter__("autoListen", function(v) {
+		return autoListen;
+	});
+	
+	this.listenTo = function(controller) {
+	 	// TODO: check for duplicates
+	 	if (listening.length == 0) {
+	 		createListenInterval();
+	 	}
+		listening.push(controller);
+	};
+	
+	this.unlistenTo = function(controller) {
+		// TODO: test this
+		for(var i = 0; i < listening.length; i++) {
+			if(listening[i] == controller) listening.splice(i, 1);
+		}
+		if(listening.length <= 0) {
+			clearInterval(listenInterval);
+		}
+	};
+	
+	this.listen = function(whoToListenTo) {
+		var arr = whoToListenTo || listening;
+		for (var i in arr) {
+			arr[i].updateDisplay();
+		}
+	};
+	
+	this.listenAll = function() {
+		this.listen(controllers);
+	}
+	
+	this.autoListen = true;
+
+	var alreadyControlled = function(object, propertyName) {
+		for (var i in controllers) {
+			if (controllers[i].object == object &&
+				controllers[i].propertyName == propertyName) {
+				return true;
+			}
+		}
+		return false;
+	};
+
+
+	var construct = function(constructor, args) {
+		function F() {
+		    return constructor.apply(this, args);
+		}
+		F.prototype = constructor.prototype;
+		return new F();
+	};
+
+	this.add = function() {
+
+		var object = arguments[0];
+		var propertyName = arguments[1];
+
+		// Have we already added this?
+		if (alreadyControlled(object, propertyName)) {
+		//	GUI.error("Controller for \"" + propertyName+"\" already added.");
+		//	return;
+		}
+
+		var value = object[propertyName];
+
+		// Does this value exist? Is it accessible?
+		if (value == undefined) {
+			GUI.error(object + " either has no property \""+propertyName+"\", or the property is inaccessible.");
+			return;
+		}
+
+		var type = typeof value;
+		var handler = handlerTypes[type];
+
+		// Do we know how to deal with this data type?
+		if (handler == undefined) {
+			GUI.error("Cannot create controller for data type \""+type+"\"");
+			return;
+		}
+	
+		var args = [this]; // Set first arg (parent) to this 
+		for (var j = 0; j < arguments.length; j++) {
+			args.push(arguments[j]);
+		}
+	
+		var controllerObject = construct(handler, args);
+		
+		// Were we able to make the controller?
+		if (!controllerObject) {
+			GUI.error("Error creating controller for \""+propertyName+"\".");
+			return;
+		}
+
+		// Success.
+		controllerContainer.appendChild(controllerObject.domElement);
+		controllers.push(controllerObject);
+		GUI.allControllers.push(controllerObject);
+
+		// Do we have a saved value for this controller?
+		if (type != "function" && 
+			GUI.saveIndex < GUI.savedValues.length) {
+			controllerObject.setValue(GUI.savedValues[GUI.saveIndex]);
+			GUI.saveIndex++;
+		}
+	
+		// Compute sum height of controllers.
+		checkForOverflow();
+		
+		// Prevents checkForOverflow bug in which loaded gui appearance
+		// settings are not respected by presence of scrollbar.
+		if (!explicitOpenHeight) {
+			openHeight = controllerHeight;
+		}
+		
+		return controllerObject;
+		
+	}
+	
+	var checkForOverflow = function() {
+		controllerHeight = 0;
+		for (var i in controllers) {
+			controllerHeight += controllers[i].domElement.offsetHeight;
+		}
+		if (controllerHeight - 1 > openHeight) {
+			controllerContainer.style.overflowY = "auto";
+		} else {
+			controllerContainer.style.overflowY = "hidden";
+		}	
+	}
+	
+	var handlerTypes = {
+		"number": GUI.NumberController,
+		"string": GUI.StringController,
+		"boolean": GUI.BooleanController,
+		"function": GUI.FunctionController
+	};
+	
+	var alreadyControlled = function(object, propertyName) {
+		for (var i in controllers) {
+			if (controllers[i].object == object &&
+				controllers[i].propertyName == propertyName) {
+				return true;
+			}
+		}
+		return false;
+	};
+	
+	var construct = function(constructor, args) {
+        function F() {
+            return constructor.apply(this, args);
+        }
+        F.prototype = constructor.prototype;
+        return new F();
+    };
+
+	this.reset = function() {
+		// TODO
+	}
+
+	// GUI ... GUI
+	
+	this.toggle = function() {
+		open ? this.hide() : this.show();
+	};
+
+	this.show = function() {
+		toggleButton.innerHTML = name || "Hide Controls";
+		resizeTo = openHeight;
+		clearTimeout(resizeTimeout);
+		beginResize();
+		open = true;
+	}
+
+	this.hide = function() {
+		toggleButton.innerHTML = name || "Show Controls";
+		resizeTo = 0;
+		clearTimeout(resizeTimeout);
+		beginResize();
+		open = false;
+	}
+	
+	this.name = function(n) {
+		name = n;
+		toggleButton.innerHTML = n;
+	}
+	
+	// used in saveURL
+	this.appearanceVars = function() {
+		return [open, width, openHeight, controllerContainer.scrollTop]
+	}
+	
+	var beginResize = function() {
+		//console.log("Resizing from " + curControllerContainerHeight + " to " + resizeTo);
+		curControllerContainerHeight += (resizeTo - curControllerContainerHeight)*0.6;
+		if (Math.abs(curControllerContainerHeight-resizeTo) < 1) {
+			curControllerContainerHeight = resizeTo;
+		} else { 
+			resizeTimeout = setTimeout(beginResize, 1000/30);
+		}
+		controllerContainer.style.height = Math.round(curControllerContainerHeight)+'px';
+		checkForOverflow();
+	}
+	
+	// Load saved appearance:
+
+	if (GUI.guiIndex < GUI.savedAppearanceVars.length) {
+
+	
+		width = parseInt(GUI.savedAppearanceVars[GUI.guiIndex][1]);
+		_this.domElement.style.width = width+"px";
+		
+		openHeight = parseInt(GUI.savedAppearanceVars[GUI.guiIndex][2]);
+		explicitOpenHeight = true;
+		if (eval(GUI.savedAppearanceVars[GUI.guiIndex][0]) == true) {
+			curControllerContainerHeight = openHeight;
+			var t = GUI.savedAppearanceVars[GUI.guiIndex][3]
+			
+			// Hack.
+			setTimeout(function() {
+				controllerContainer.scrollTop = t;
+			}, 0);
+			
+			if (GUI.scrollTop > -1) {
+				document.body.scrollTop = GUI.scrollTop;
+			}
+			resizeTo = openHeight;
+			this.show();
+		}
+
+		GUI.guiIndex++;
+	}
+
+	GUI.allGuis.push(this);
+
+};
+
+// Static members
+
+GUI.autoPlace = true;
+GUI.autoPlaceContainer = null;
+GUI.allControllers = [];
+GUI.allGuis = [];
+
+GUI.saveURL = function() { 
+	title = window.location;
+	url = GUI.replaceGetVar("saveString", GUI.getSaveString());
+	window.location = url;
+};
+
+GUI.scrollTop = -1;
+
+GUI.load = function(saveString) {
+
+	//GUI.savedAppearanceVars = [];
+	var vals = saveString.split(",");
+	var numGuis = parseInt(vals[0]);
+	GUI.scrollTop = parseInt(vals[1]);
+	for (var i = 0; i < numGuis; i++) {
+		var appr = vals.splice(2, 4);
+		GUI.savedAppearanceVars.push(appr);
+	}
+	
+	GUI.savedValues = vals.splice(2, vals.length);
+	
+};
+
+GUI.savedValues = [];
+GUI.savedAppearanceVars = [];
+
+GUI.getSaveString = function() {
+
+	var vals = [];
+	
+	vals.push(GUI.allGuis.length);
+	vals.push(document.body.scrollTop);
+	
+	
+	for (var i in GUI.allGuis) {
+		var av = GUI.allGuis[i].appearanceVars();
+		for (var j = 0; j < av.length; j++) {
+			vals.push(av[j]);
+		}
+	}	
+	
+	for (var i in GUI.allControllers) {
+	
+		// We don't save values for functions.
+		if (GUI.allControllers[i].type == "function") {
+			continue;
+		}
+		
+		var v = GUI.allControllers[i].getValue();
+		
+		// Round numbers so they don't get enormous
+		if (GUI.allControllers[i].type == "number") {
+			v = GUI.roundToDecimal(v, 4);
+		}
+		
+		vals.push(v);
+		
+	}
+	
+	return vals.join(',');
+	
+}
+
+GUI.getVarFromURL = function(v) {
+
+    var vars = [], hash;
+    var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
+
+    for (var i = 0; i < hashes.length; i++) {
+ 		hash = hashes[i].split("=")
+        if (hash == undefined) continue;
+		if (hash[0] == v) {
+			return hash[1];
+		}
+    }
+	
+	return null;
+
+};
+
+GUI.replaceGetVar = function(varName, val) {
+
+    var vars = [], hash;
+    var loc = window.location.href;
+    var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
+
+    for (var i = 0; i < hashes.length; i++) {
+ 		hash = hashes[i].split("=")
+        if (hash == undefined) continue;
+		if (hash[0] == varName) {
+			return loc.replace(hash[1], val);
+		}
+    }
+	
+	if (window.location.href.indexOf('?') != -1) {
+		return loc + "&"+varName+"="+val;
+	}
+	
+	return loc+"?"+varName+"="+val;
+	
+};
+
+GUI.saveIndex = 0;
+GUI.guiIndex = 0;
+
+GUI.showSaveString = function() {
+	alert(GUI.getSaveString());
+}
+
+// Util functions
+
+GUI.makeUnselectable = function(elem) {
+	elem.onselectstart = function() { return false; };
+	elem.style.MozUserSelect = "none";
+	elem.style.KhtmlUserSelect = "none";
+	elem.unselectable = "on";
+}
+    
+GUI.makeSelectable = function(elem) {
+	elem.onselectstart = function() { };
+	elem.style.MozUserSelect = "auto";
+	elem.style.KhtmlUserSelect = "auto";
+	elem.unselectable = "off";
+}
+
+GUI.map = function(v, i1, i2, o1, o2) {
+	var v = o1 + (o2 - o1) * ((v - i1) / (i2 - i1));
+	return v;
+}
+
+GUI.constrain = function (v, o1, o2) {
+	if (v < o1) v = o1;
+	else if (v > o2) v = o2;
+	return v;
+}
+
+GUI.error = function(str) {
+	if (typeof console.error == 'function') {
+		console.error("[GUI ERROR] " + str);
+	}
+};
+
+GUI.roundToDecimal = function(n, decimals) {
+	var t = Math.pow(10, decimals);
+	return Math.round(n*t)/t;
+}
+
+GUI.extendController = function(clazz) {
+	clazz.prototype = new GUI.Controller();
+	clazz.prototype.constructor = clazz;
+}
+
+if (GUI.getVarFromURL('saveString') != null) GUI.load(GUI.getVarFromURL('saveString'));GUI.Slider = function(numberController, min, max, step, initValue) {
+	
+	var min = min;
+	var max = max;
+	var step = step;
+	
+	var clicked = false;
+	var _this = this;
+	
+	var x, px;
+	
+	this.domElement = document.createElement('div');
+	this.domElement.setAttribute('class', 'guidat-slider-bg');
+	
+	this.fg = document.createElement('div');
+	this.fg.setAttribute('class', 'guidat-slider-fg');
+	
+	this.domElement.appendChild(this.fg);
+	
+	var findPos = function(obj) {
+		var curleft = curtop = 0;
+		if (obj.offsetParent) {
+			do {
+				curleft += obj.offsetLeft;
+				curtop += obj.offsetTop;
+			} while (obj = obj.offsetParent);
+			return [curleft,curtop];
+		}
+	}
+	
+	this.__defineSetter__('value', function(e) {
+		var pct = GUI.map(e, min, max, 0, 100);
+		this.fg.style.width = pct+"%";
+	});
+
+	var onDrag = function(e) {
+		if (!clicked) return;
+		var pos = findPos(_this.domElement);
+		var val = GUI.map(e.pageX, pos[0], pos[0] + _this.domElement.offsetWidth, min, max);
+		val = Math.round(val/step)*step;
+		numberController.setValue(val);
+	}
+	
+	this.domElement.addEventListener('mousedown', function(e) {
+		clicked = true;
+		x = px = e.pageX;
+		_this.domElement.setAttribute('class', 'guidat-slider-bg active');
+		_this.fg.setAttribute('class', 'guidat-slider-fg active');
+		onDrag(e);
+		document.addEventListener('mouseup', mouseup, false);
+	}, false);
+	
+	
+	var mouseup = function(e) { 
+		_this.domElement.setAttribute('class', 'guidat-slider-bg');
+		_this.fg.setAttribute('class', 'guidat-slider-fg');
+		clicked = false;			
+		if (numberController.finishChangeFunction != null) {
+			numberController.finishChangeFunction.call(this, numberController.getValue());
+		}
+		document.removeEventListener('mouseup', mouseup, false);
+	};
+
+	
+	document.addEventListener('mousemove', onDrag, false);
+	
+	this.value = initValue;	
+		
+}
+GUI.Controller = function() {
+
+	this.parent = arguments[0];
+    this.object = arguments[1];
+    this.propertyName = arguments[2];
+
+	if (arguments.length > 0) this.initialValue = this.propertyName[this.object];
+
+    this.domElement = document.createElement('div');
+    this.domElement.setAttribute('class', 'guidat-controller ' + this.type);
+    
+    this.propertyNameElement = document.createElement('span');
+    this.propertyNameElement.setAttribute('class', 'guidat-propertyname');
+    this.name(this.propertyName);
+    this.domElement.appendChild(this.propertyNameElement);
+    
+    GUI.makeUnselectable(this.domElement);
+    
+};
+
+GUI.Controller.prototype.changeFunction = null;
+GUI.Controller.prototype.finishChangeFunction = null;
+
+GUI.Controller.prototype.name = function(n) {
+	this.propertyNameElement.innerHTML = n;
+	return this;
+};
+
+GUI.Controller.prototype.reset = function() {
+	this.setValue(this.initialValue);
+	return this;
+};
+
+GUI.Controller.prototype.listen = function() {
+	this.parent.listenTo(this);
+	return this;
+}
+
+GUI.Controller.prototype.unlisten = function() {
+	this.parent.unlistenTo(this); // <--- hasn't been tested yet
+	return this;
+}
+    
+GUI.Controller.prototype.setValue = function(n) {
+	this.object[this.propertyName] = n;
+	if (this.changeFunction != null) {
+		this.changeFunction.call(this, n);
+	}
+	this.updateDisplay();
+	return this;
+}
+    
+GUI.Controller.prototype.getValue = function() {
+	return this.object[this.propertyName];
+}
+
+GUI.Controller.prototype.updateDisplay = function() {}
+    
+GUI.Controller.prototype.onChange = function(fnc) {
+	this.changeFunction = fnc;
+	return this;
+}
+GUI.Controller.prototype.onFinishChange = function(fnc) {
+	this.finishChangeFunction = fnc;
+	return this;
+}
+
+GUI.Controller.prototype.options = function() {
+	var _this = this;
+	var select = document.createElement('select');
+	if (arguments.length == 1) {
+		var arr = arguments[0];
+		for (var i in arr) {
+			var opt = document.createElement('option');
+			opt.innerHTML = i;
+			opt.setAttribute('value', arr[i]);
+			select.appendChild(opt);
+		}
+	} else { 
+		for (var i = 0; i < arguments.length; i++) {
+			var opt = document.createElement('option');
+			opt.innerHTML = arguments[i];
+			opt.setAttribute('value', arguments[i]);
+			select.appendChild(opt);
+		}
+	}
+	
+	select.addEventListener('change', function() {
+		_this.setValue(this.value);
+		if (_this.finishChangeFunction != null) {
+			_this.finishChangeFunction.call(this, _this.getValue());
+		}
+	}, false);
+	_this.domElement.appendChild(select);
+	return this;
+}
+GUI.BooleanController = function() {
+
+	this.type = "boolean";
+	GUI.Controller.apply(this, arguments);
+
+	var _this = this;
+    var input = document.createElement('input');
+    input.setAttribute('type', 'checkbox');
+    
+    this.domElement.addEventListener('click', function(e) {
+    	input.checked = !input.checked;
+    	e.preventDefault();
+    	_this.setValue(input.checked);
+    }, false);
+    
+    input.addEventListener('mouseup', function(e) {
+    	input.checked = !input.checked; // counteracts default.
+    }, false);
+    
+    this.domElement.style.cursor = "pointer";
+    this.propertyNameElement.style.cursor = "pointer";
+    this.domElement.appendChild(input);
+    
+    this.updateDisplay = function() {
+    	input.checked = _this.getValue();
+    };
+    
+    
+    this.setValue = function(val) {
+		if (typeof val != "boolean") {
+			try { 
+				val = eval(val);
+			} catch (e) {}
+		}
+		return GUI.Controller.prototype.setValue.call(this, val);
+    }
+
+};
+GUI.extendController(GUI.BooleanController);GUI.FunctionController = function() {
+	
+	this.type = "function";
+	
+	var _this = this;
+	
+	GUI.Controller.apply(this, arguments);
+	
+	this.domElement.addEventListener('click', function() {
+		_this.fire();
+	}, false);
+	
+	this.domElement.style.cursor = "pointer";
+	this.propertyNameElement.style.cursor = "pointer";
+	
+	var fireFunction = null;
+	this.onFire = function(fnc) {
+		fireFunction = fnc;
+		return this;
+	}
+	
+	this.fire = function() {
+		if (fireFunction != null) {
+			fireFunction.call(this);
+		}
+		_this.object[_this.propertyName].call(_this.object);
+	};
+	
+};
+GUI.extendController(GUI.FunctionController);
+GUI.NumberController = function() {
+
+	this.type = "number";
+    
+    GUI.Controller.apply(this, arguments);
+    
+    var _this = this;
+    
+    // If we simply click and release a number field, we want to highlight it.
+    // This variable keeps track of whether or not we've dragged
+    var draggedNumberField = false;
+    
+    var clickedNumberField = false;
+    
+    var y = py = 0;
+    
+    var min = arguments[3];
+    var max = arguments[4];
+    var step = arguments[5];
+    
+    if (!step) {
+    	if (min != undefined && max != undefined) {
+    		step = (max-min)*0.01;
+    	} else {
+    		step = 1;
+    	}	
+    }
+    
+    var numberField = document.createElement('input');
+    numberField.setAttribute('id', this.propertyName);
+    numberField.setAttribute('type', 'text');
+    numberField.setAttribute('value', this.getValue());
+    
+    if (step) numberField.setAttribute('step', step);
+    
+    this.domElement.appendChild(numberField);
+    
+    var slider;
+    
+    if (min != undefined && max != undefined) {
+    	slider = new GUI.Slider(this, min, max, step, this.getValue());
+    	this.domElement.appendChild(slider.domElement);
+    }
+    
+    numberField.addEventListener('blur', function(e) {
+        var val = parseFloat(this.value);
+        console.log(val);
+        if (!isNaN(val)) {
+	        _this.setValue(val);
+        }
+    }, false);
+    
+    numberField.addEventListener('mousewheel', function(e) {
+    	e.preventDefault();
+    	_this.setValue(_this.getValue() + Math.abs(e.wheelDeltaY)/e.wheelDeltaY*step);
+    	return false;
+    }, false);
+    
+    numberField.addEventListener('mousedown', function(e) {
+        py = y = e.pageY;
+		clickedNumberField = true;
+        document.addEventListener('mousemove', dragNumberField, false);
+		document.addEventListener('mouseup', mouseup, false);
+    }, false);
+
+	// Handle up arrow and down arrow
+	numberField.addEventListener('keydown', function(e) {
+		switch(e.keyCode) {
+			case 38: 	// up
+				var newVal = _this.getValue() + step;
+				_this.setValue(newVal);
+				break;
+			case 40: 	// down
+				var newVal = _this.getValue() - step;
+				_this.setValue(newVal);
+				break;
+		}
+	}, false);
+    
+    var mouseup = function(e) {
+        document.removeEventListener('mousemove', dragNumberField, false);
+        GUI.makeSelectable(_this.parent.domElement); 
+        GUI.makeSelectable(numberField);
+        if (clickedNumberField && !draggedNumberField) { 
+	        numberField.focus();
+	        numberField.select();
+        }
+        draggedNumberField = false;
+        clickedNumberField = false;
+		if (_this.finishChangeFunction != null) {
+			_this.finishChangeFunction.call(this, _this.getValue());
+		}
+		document.removeEventListener('mouseup', mouseup, false);
+	}
+
+    
+    
+    var dragNumberField = function(e) {
+    	draggedNumberField = true;
+		e.preventDefault();
+
+		// We don't want to be highlighting this field as we scroll.
+		// Or any other fields in this gui for that matter ...
+		// TODO: Make makeUselectable go through each element and child element.
+
+		GUI.makeUnselectable(_this.parent.domElement);
+		GUI.makeUnselectable(numberField);
+		
+		py = y;
+		y = e.pageY;
+		var dy = py - y;
+		var newVal = _this.getValue() + dy*step;	
+		_this.setValue(newVal);
+		return false;
+    }
+    
+    this.options = function() {
+    	_this.noSlider();
+    	_this.domElement.removeChild(numberField);
+    	return GUI.Controller.prototype.options.apply(this, arguments);
+    };
+    
+    this.noSlider = function() {
+    	if (slider) {
+    		_this.domElement.removeChild(slider.domElement);
+    	}
+    	return this;
+    };
+    
+    this.setValue = function(val) {
+    
+		val = parseFloat(val);
+		
+    	if (min != undefined && val <= min) {
+    		val = min;
+    	} else if (max != undefined && val >= max) { 
+    		val = max;
+    	}
+    	
+    	return GUI.Controller.prototype.setValue.call(this, val);
+    	
+    }
+    
+    this.updateDisplay = function() {
+        numberField.value = GUI.roundToDecimal(_this.getValue(), 4);
+        if (slider) slider.value = _this.getValue();
+	}
+};
+
+GUI.extendController(GUI.NumberController);
+GUI.StringController = function() {
+
+	this.type = "string";
+	
+	var _this = this;
+    GUI.Controller.apply(this, arguments);
+    
+    var input = document.createElement('input');
+    
+    var initialValue = this.getValue();
+    
+    input.setAttribute('value', initialValue);
+    input.setAttribute('spellcheck', 'false');
+    
+    this.domElement.addEventListener('mouseup', function() {
+    	input.focus();
+    	input.select();
+    }, false);
+    
+    // TODO: getting messed up on ctrl a
+    input.addEventListener('keyup', function(e) {
+    	if (e.keyCode == 13 && _this.finishChangeFunction != null) {
+			_this.finishChangeFunction.call(this, _this.getValue());
+		}
+        _this.setValue(input.value);
+    }, false);
+    
+    input.addEventListener('blur', function() {
+		if (_this.finishChangeFunction != null) {
+			_this.finishChangeFunction.call(this, _this.getValue());
+		}
+    }, false);
+    
+    this.updateDisplay = function() {
+    	input.value = _this.getValue();
+    }
+    
+    this.options = function() {
+    	_this.domElement.removeChild(input);
+    	return GUI.Controller.prototype.options.apply(this, arguments);
+    };
+    
+    this.domElement.appendChild(input);
+    
+};
+
+GUI.extendController(GUI.StringController);

+ 34 - 0
examples/js/gui/gui.min.js

@@ -0,0 +1,34 @@
+var GUI=function(){var a=this,b=[],d=[],e=true,j,k,h=0;a=this;var l=false,n=280,o=false,i,f,q=0,s;this.domElement=document.createElement("div");this.domElement.setAttribute("class","guidat");this.domElement.style.width=n+"px";var p=document.createElement("div");p.setAttribute("class","guidat-controllers");p.addEventListener("DOMMouseScroll",function(c){var g=this.scrollTop;if(c.wheelDelta)g+=c.wheelDelta;else if(c.detail)g+=c.detail;c.preventDefault&&c.preventDefault();c.returnValue=false;p.scrollTop=
+g},false);p.style.height="0px";var r=document.createElement("a");r.setAttribute("class","guidat-toggle");r.setAttribute("href","#");r.innerHTML="Show Controls";var u=false,C=0,v=false,w,y,x,z,D=function(c){y=w;z=x;w=c.pageY;x=c.pageX;c=w-y;if(!l)if(c>0){l=true;h=i=1;r.innerHTML=f||"Hide Controls"}else return;var g=z-x;if(c>0&&h>k){var m=GUI.map(h,k,k+100,1,0);c*=m}u=true;C+=c;dragDisplacementX+=g;i+=c;n+=g;h+=c;p.style.height=i+"px";n=GUI.constrain(n,240,500);a.domElement.style.width=n+"px";A()};
+r.addEventListener("mousedown",function(c){y=w=c.pageY;z=x=c.pageX;v=true;c.preventDefault();dragDisplacementX=C=0;document.addEventListener("mousemove",D,false);return false},false);r.addEventListener("click",function(c){c.preventDefault();return false},false);document.addEventListener("mouseup",function(c){if(v&&!u){a.toggle();a.domElement.style.width=n+1+"px";setTimeout(function(){a.domElement.style.width=n+"px"},1)}if(v&&u){if(dragDisplacementX==0){a.domElement.style.width=n+1+"px";setTimeout(function(){a.domElement.style.width=
+n+"px"},1)}if(i>k){clearTimeout(s);i=q=k;t()}else if(p.children.length>=1){var g=p.children[0].offsetHeight;clearTimeout(s);q=Math.round(h/g)*g-1;if(q<=0){a.hide();i=g*2}else{i=q;t()}}}document.removeEventListener("mousemove",D,false);c.preventDefault();return v=u=false},false);this.domElement.appendChild(p);this.domElement.appendChild(r);if(GUI.autoPlace){if(GUI.autoPlaceContainer==null){GUI.autoPlaceContainer=document.createElement("div");GUI.autoPlaceContainer.setAttribute("id","guidat");document.body.appendChild(GUI.autoPlaceContainer)}GUI.autoPlaceContainer.appendChild(this.domElement)}this.autoListenIntervalTime=
+1E3/60;var E=function(){j=setInterval(function(){a.listen()},this.autoListenIntervalTime)};this.__defineSetter__("autoListen",function(c){if(e=c)d.length>0&&E();else clearInterval(j)});this.__defineGetter__("autoListen",function(){return e});this.listenTo=function(c){d.length==0&&E();d.push(c)};this.unlistenTo=function(c){for(var g=0;g<d.length;g++)d[g]==c&&d.splice(g,1);d.length<=0&&clearInterval(j)};this.listen=function(c){c=c||d;for(var g in c)c[g].updateDisplay()};this.listenAll=function(){this.listen(b)};
+this.autoListen=true;var F=function(c,g){for(var m in b)if(b[m].object==c&&b[m].propertyName==g)return true;return false},G=function(c,g){function m(){return c.apply(this,g)}m.prototype=c.prototype;return new m};this.add=function(){var c=arguments[0],g=arguments[1];F(c,g);var m=c[g];if(m==undefined)GUI.error(c+' either has no property "'+g+'", or the property is inaccessible.');else{c=typeof m;m=I[c];if(m==undefined)GUI.error('Cannot create controller for data type "'+c+'"');else{for(var H=[this],
+B=0;B<arguments.length;B++)H.push(arguments[B]);if(m=G(m,H)){p.appendChild(m.domElement);b.push(m);GUI.allControllers.push(m);if(c!="function"&&GUI.saveIndex<GUI.savedValues.length){m.setValue(GUI.savedValues[GUI.saveIndex]);GUI.saveIndex++}A();o||(i=k);return m}else GUI.error('Error creating controller for "'+g+'".')}}};var A=function(){k=0;for(var c in b)k+=b[c].domElement.offsetHeight;p.style.overflowY=k-1>i?"auto":"hidden"},I={number:GUI.NumberController,string:GUI.StringController,"boolean":GUI.BooleanController,
+"function":GUI.FunctionController};F=function(c,g){for(var m in b)if(b[m].object==c&&b[m].propertyName==g)return true;return false};G=function(c,g){function m(){return c.apply(this,g)}m.prototype=c.prototype;return new m};this.reset=function(){};this.toggle=function(){l?this.hide():this.show()};this.show=function(){r.innerHTML=f||"Hide Controls";q=i;clearTimeout(s);t();l=true};this.hide=function(){r.innerHTML=f||"Show Controls";q=0;clearTimeout(s);t();l=false};this.name=function(c){f=c;r.innerHTML=
+c};this.appearanceVars=function(){return[l,n,i,p.scrollTop]};var t=function(){h+=(q-h)*0.6;if(Math.abs(h-q)<1)h=q;else s=setTimeout(t,1E3/30);p.style.height=Math.round(h)+"px";A()};if(GUI.guiIndex<GUI.savedAppearanceVars.length){n=parseInt(GUI.savedAppearanceVars[GUI.guiIndex][1]);a.domElement.style.width=n+"px";i=parseInt(GUI.savedAppearanceVars[GUI.guiIndex][2]);o=true;if(eval(GUI.savedAppearanceVars[GUI.guiIndex][0])==true){h=i;var J=GUI.savedAppearanceVars[GUI.guiIndex][3];setTimeout(function(){p.scrollTop=
+J},0);if(GUI.scrollTop>-1)document.body.scrollTop=GUI.scrollTop;q=i;this.show()}GUI.guiIndex++}GUI.allGuis.push(this)};GUI.autoPlace=true;GUI.autoPlaceContainer=null;GUI.allControllers=[];GUI.allGuis=[];GUI.saveURL=function(){title=window.location;url=GUI.replaceGetVar("saveString",GUI.getSaveString());window.location=url};GUI.scrollTop=-1;
+GUI.load=function(a){a=a.split(",");var b=parseInt(a[0]);GUI.scrollTop=parseInt(a[1]);for(var d=0;d<b;d++){var e=a.splice(2,4);GUI.savedAppearanceVars.push(e)}GUI.savedValues=a.splice(2,a.length)};GUI.savedValues=[];GUI.savedAppearanceVars=[];
+GUI.getSaveString=function(){var a=[];a.push(GUI.allGuis.length);a.push(document.body.scrollTop);for(var b in GUI.allGuis)for(var d=GUI.allGuis[b].appearanceVars(),e=0;e<d.length;e++)a.push(d[e]);for(b in GUI.allControllers)if(GUI.allControllers[b].type!="function"){d=GUI.allControllers[b].getValue();if(GUI.allControllers[b].type=="number")d=GUI.roundToDecimal(d,4);a.push(d)}return a.join(",")};
+GUI.getVarFromURL=function(a){for(var b,d=window.location.href.slice(window.location.href.indexOf("?")+1).split("&"),e=0;e<d.length;e++){b=d[e].split("=");if(b!=undefined)if(b[0]==a)return b[1]}return null};
+GUI.replaceGetVar=function(a,b){for(var d,e=window.location.href,j=window.location.href.slice(window.location.href.indexOf("?")+1).split("&"),k=0;k<j.length;k++){d=j[k].split("=");if(d!=undefined)if(d[0]==a)return e.replace(d[1],b)}if(window.location.href.indexOf("?")!=-1)return e+"&"+a+"="+b;return e+"?"+a+"="+b};GUI.saveIndex=0;GUI.guiIndex=0;GUI.showSaveString=function(){alert(GUI.getSaveString())};
+GUI.makeUnselectable=function(a){a.onselectstart=function(){return false};a.style.MozUserSelect="none";a.style.KhtmlUserSelect="none";a.unselectable="on"};GUI.makeSelectable=function(a){a.onselectstart=function(){};a.style.MozUserSelect="auto";a.style.KhtmlUserSelect="auto";a.unselectable="off"};GUI.map=function(a,b,d,e,j){return a=e+(j-e)*((a-b)/(d-b))};GUI.constrain=function(a,b,d){if(a<b)a=b;else if(a>d)a=d;return a};
+GUI.error=function(a){typeof console.error=="function"&&console.error("[GUI ERROR] "+a)};GUI.roundToDecimal=function(a,b){var d=Math.pow(10,b);return Math.round(a*d)/d};GUI.extendController=function(a){a.prototype=new GUI.Controller;a.prototype.constructor=a};GUI.getVarFromURL("saveString")!=null&&GUI.load(GUI.getVarFromURL("saveString"));
+GUI.Slider=function(a,b,d,e,j){b=b;d=d;e=e;var k=false,h=this;this.domElement=document.createElement("div");this.domElement.setAttribute("class","guidat-slider-bg");this.fg=document.createElement("div");this.fg.setAttribute("class","guidat-slider-fg");this.domElement.appendChild(this.fg);this.__defineSetter__("value",function(o){this.fg.style.width=GUI.map(o,b,d,0,100)+"%"});var l=function(o){if(k){var i;i=h.domElement;var f=curtop=0;if(i.offsetParent){do{f+=i.offsetLeft;curtop+=i.offsetTop}while(i=
+i.offsetParent);i=[f,curtop]}else i=void 0;o=GUI.map(o.pageX,i[0],i[0]+h.domElement.offsetWidth,b,d);o=Math.round(o/e)*e;a.setValue(o)}};this.domElement.addEventListener("mousedown",function(o){k=true;h.domElement.setAttribute("class","guidat-slider-bg active");h.fg.setAttribute("class","guidat-slider-fg active");l(o);document.addEventListener("mouseup",n,false)},false);var n=function(){h.domElement.setAttribute("class","guidat-slider-bg");h.fg.setAttribute("class","guidat-slider-fg");k=false;a.finishChangeFunction!=
+null&&a.finishChangeFunction.call(this,a.getValue());document.removeEventListener("mouseup",n,false)};document.addEventListener("mousemove",l,false);this.value=j};
+GUI.Controller=function(){this.parent=arguments[0];this.object=arguments[1];this.propertyName=arguments[2];if(arguments.length>0)this.initialValue=this.propertyName[this.object];this.domElement=document.createElement("div");this.domElement.setAttribute("class","guidat-controller "+this.type);this.propertyNameElement=document.createElement("span");this.propertyNameElement.setAttribute("class","guidat-propertyname");this.name(this.propertyName);this.domElement.appendChild(this.propertyNameElement);
+GUI.makeUnselectable(this.domElement)};GUI.Controller.prototype.changeFunction=null;GUI.Controller.prototype.finishChangeFunction=null;GUI.Controller.prototype.name=function(a){this.propertyNameElement.innerHTML=a;return this};GUI.Controller.prototype.reset=function(){this.setValue(this.initialValue);return this};GUI.Controller.prototype.listen=function(){this.parent.listenTo(this);return this};GUI.Controller.prototype.unlisten=function(){this.parent.unlistenTo(this);return this};
+GUI.Controller.prototype.setValue=function(a){this.object[this.propertyName]=a;this.changeFunction!=null&&this.changeFunction.call(this,a);this.updateDisplay();return this};GUI.Controller.prototype.getValue=function(){return this.object[this.propertyName]};GUI.Controller.prototype.updateDisplay=function(){};GUI.Controller.prototype.onChange=function(a){this.changeFunction=a;return this};GUI.Controller.prototype.onFinishChange=function(a){this.finishChangeFunction=a;return this};
+GUI.Controller.prototype.options=function(){var a=this,b=document.createElement("select");if(arguments.length==1){var d=arguments[0],e;for(e in d){var j=document.createElement("option");j.innerHTML=e;j.setAttribute("value",d[e]);b.appendChild(j)}}else for(e=0;e<arguments.length;e++){j=document.createElement("option");j.innerHTML=arguments[e];j.setAttribute("value",arguments[e]);b.appendChild(j)}b.addEventListener("change",function(){a.setValue(this.value);a.finishChangeFunction!=null&&a.finishChangeFunction.call(this,
+a.getValue())});a.domElement.appendChild(b);return this};
+GUI.BooleanController=function(){this.type="boolean";GUI.Controller.apply(this,arguments);var a=this,b=document.createElement("input");b.setAttribute("type","checkbox");this.domElement.addEventListener("click",function(d){b.checked=!b.checked;d.preventDefault();a.setValue(b.checked)},false);b.addEventListener("mouseup",function(){b.checked=!b.checked},false);this.domElement.style.cursor="pointer";this.propertyNameElement.style.cursor="pointer";this.domElement.appendChild(b);this.updateDisplay=function(){b.checked=
+a.getValue()};this.setValue=function(d){if(typeof d!="boolean")try{d=eval(d)}catch(e){}return GUI.Controller.prototype.setValue.call(this,d)}};GUI.extendController(GUI.BooleanController);
+GUI.FunctionController=function(){this.type="function";var a=this;GUI.Controller.apply(this,arguments);this.domElement.addEventListener("click",function(){a.fire()},false);this.domElement.style.cursor="pointer";this.propertyNameElement.style.cursor="pointer";var b=null;this.onFire=function(d){b=d;return this};this.fire=function(){b!=null&&b.call(this);a.object[a.propertyName].call(a.object)}};GUI.extendController(GUI.FunctionController);
+GUI.NumberController=function(){this.type="number";GUI.Controller.apply(this,arguments);var a=this,b=false,d=false,e=py=0,j=arguments[3],k=arguments[4],h=arguments[5];h||(h=j!=undefined&&k!=undefined?(k-j)*0.01:1);var l=document.createElement("input");l.setAttribute("id",this.propertyName);l.setAttribute("type","text");l.setAttribute("value",this.getValue());h&&l.setAttribute("step",h);this.domElement.appendChild(l);var n;if(j!=undefined&&k!=undefined){n=new GUI.Slider(this,j,k,h,this.getValue());
+this.domElement.appendChild(n.domElement)}l.addEventListener("blur",function(){var f=parseFloat(this.value);console.log(f);isNaN(f)||a.setValue(f)},false);l.addEventListener("mousewheel",function(f){f.preventDefault();a.setValue(a.getValue()+Math.abs(f.wheelDeltaY)/f.wheelDeltaY*h);return false},false);l.addEventListener("mousedown",function(f){py=e=f.pageY;d=true;document.addEventListener("mousemove",i,false);document.addEventListener("mouseup",o,false)},false);l.addEventListener("keydown",function(f){switch(f.keyCode){case 38:f=
+a.getValue()+h;a.setValue(f);break;case 40:f=a.getValue()-h;a.setValue(f)}},false);var o=function(){document.removeEventListener("mousemove",i,false);GUI.makeSelectable(a.parent.domElement);GUI.makeSelectable(l);if(d&&!b){l.focus();l.select()}d=b=false;a.finishChangeFunction!=null&&a.finishChangeFunction.call(this,a.getValue());document.removeEventListener("mouseup",o,false)},i=function(f){b=true;f.preventDefault();GUI.makeUnselectable(a.parent.domElement);GUI.makeUnselectable(l);py=e;e=f.pageY;f=
+py-e;f=a.getValue()+f*h;a.setValue(f);return false};this.options=function(){a.noSlider();a.domElement.removeChild(l);return GUI.Controller.prototype.options.apply(this,arguments)};this.noSlider=function(){n&&a.domElement.removeChild(n.domElement);return this};this.setValue=function(f){f=parseFloat(f);if(j!=undefined&&f<=j)f=j;else if(k!=undefined&&f>=k)f=k;return GUI.Controller.prototype.setValue.call(this,f)};this.updateDisplay=function(){l.value=GUI.roundToDecimal(a.getValue(),4);if(n)n.value=a.getValue()}};
+GUI.extendController(GUI.NumberController);
+GUI.StringController=function(){this.type="string";var a=this;GUI.Controller.apply(this,arguments);var b=document.createElement("input"),d=this.getValue();b.setAttribute("value",d);b.setAttribute("spellcheck","false");this.domElement.addEventListener("mouseup",function(){b.focus();b.select()},false);b.addEventListener("keyup",function(e){e.keyCode==13&&a.finishChangeFunction!=null&&a.finishChangeFunction.call(this,a.getValue());a.setValue(b.value)},false);b.addEventListener("blur",function(){a.finishChangeFunction!=
+null&&a.finishChangeFunction.call(this,a.getValue())},false);this.updateDisplay=function(){b.value=a.getValue()};this.options=function(){a.domElement.removeChild(b);return GUI.Controller.prototype.options.apply(this,arguments)};this.domElement.appendChild(b)};GUI.extendController(GUI.StringController);

+ 22 - 33
examples/lights_test.html → examples/misc_lights_test.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - lights - point + directional - webgl</title>
+		<title>three.js misc - lights - point + directional</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 
@@ -39,11 +39,8 @@
 		<pre id="log"></pre>
 
 		<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/Detector.js"></script>
-
+		
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
 		<script type="text/javascript" src="js/Stats.js"></script>
 
 		<script type="text/javascript">
@@ -71,18 +68,15 @@
 			var bcanvas = document.getElementById( 'rcanvas' );
 			var bwebgl = document.getElementById( 'rwebgl' );
 
-			document.addEventListener('mousemove', onDocumentMouseMove, false);
+			document.addEventListener( 'mousemove', onDocumentMouseMove, false );
 
 			init();
-
-			loop();
+			animate();
 
 			//render_canvas = !has_gl;
 			bwebgl.style.display = has_gl ? 'inline' : 'none';
 			bcanvas.className = render_canvas ? 'button' : 'button inactive';
 
-			setInterval(loop, 1000/60);
-
 			function init() {
 
 				container = document.createElement('div');
@@ -107,8 +101,7 @@
 					mesh.position.z = 500 * ( Math.random() - 0.5 );
 					mesh.scale.x = mesh.scale.y = mesh.scale.z = 0.25 * ( Math.random() + 0.5 );
 					mesh.overdraw = true;
-					mesh.updateMatrix();
-					scene.addObject(mesh);
+					scene.addObject( mesh );
 
 				}
 
@@ -133,7 +126,6 @@
 				lightMesh.scale.x = lightMesh.scale.y = lightMesh.scale.z = 0.05;
 				lightMesh.position = pointLight.position;
 				lightMesh.overdraw = true;
-				lightMesh.updateMatrix();
 				scene.addObject(lightMesh);
 
 
@@ -197,24 +189,25 @@
 
 			}
 
+			//
+
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+				stats.update();
+
+			}
+
 			var r = 0, counter = 0;
 
-			function loop() {
+			function render() {
+
+				counter == 30 ? scene.removeLight( directionalLight ) : counter ++;
 
-				if( counter == 30 ) {
-					
-					scene.removeLight( directionalLight );
-					
-				} else {
-				
-					counter++;
-					
-				}
-				
 				camera.position.x += ( mouseX - camera.position.x ) * .05;
 				camera.position.y += ( - mouseY - camera.position.y ) * .05;
-				camera.updateMatrix();
-
 
 				for ( var i = 0, l = scene.objects.length; i < l; i ++ ) {
 
@@ -230,21 +223,17 @@
 
 						scene.objects[i].rotation.z += 0.05;
 
-					scene.objects[i].updateMatrix();
 				}
 
 
-				lightMesh.position.x = 200*Math.cos(r);
-				lightMesh.position.z = 200*Math.sin(r);
-				lightMesh.updateMatrix();
+				lightMesh.position.x = 200 * Math.cos( r );
+				lightMesh.position.z = 200 * Math.sin( r );
 
 				r += 0.1;
 
 				if ( render_canvas ) canvasRenderer.render( scene, camera );
 				if ( render_gl && has_gl ) webglRenderer.render( scene, camera );
 
-				stats.update();
-
 			}
 
 			function log(text) {

+ 18 - 16
examples/materials_multimaterials.html → examples/misc_materials_multimaterials.html

@@ -42,10 +42,7 @@
 
 		<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/Plane.js"></script>
-
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
 		<script type="text/javascript" src="js/Stats.js"></script>
 
 		<script type="text/javascript">
@@ -80,15 +77,12 @@
 			document.addEventListener('mousemove', onDocumentMouseMove, false);
 
 			init();
-
-			loop();
+			animate();
 
 			//render_canvas = !has_gl;
 			bwebgl.style.display = has_gl ? "inline" : "none";
 			bcanvas.className = render_canvas ? "button" : "button inactive";
 
-			setInterval(loop, 1000/60);
-
 			function init() {
 
 				container = document.createElement('div');
@@ -167,7 +161,7 @@
 
 				var loader = new THREE.Loader(),
 					callback = function( geometry ) { createScene( geometry) };
-				
+
 				loader.loadAscii( { model: "obj/female02/Female02_slim.js", callback: callback } );
 				//loader.loadBinary( { model: "obj/female02/Female02_bin.js", callback: callback } );
 
@@ -205,10 +199,9 @@
 				}
 
 				var xm1 = new THREE.MeshLambertMaterial( { map: new THREE.Texture( x1 ) } );
-				xm1.map.image.loaded = 1; // this is procedurally generated texture
-
 				var xm2 = new THREE.MeshLambertMaterial( { map: new THREE.Texture( x2 ) } );
-				xm2.map.image.loaded = 1; // this is procedurally generated texture
+				xm1.map.needsUpdate = true;
+				xm2.map.needsUpdate = true;
 
 				geometry.materials[0].push ( xm1 ); // goes to faces with material 0
 				geometry.materials[1].push ( xm2 ); // goes to faces with material 1
@@ -263,7 +256,7 @@
 					xc.fillText(i, 10, 64);
 
 					var xm = new THREE.MeshBasicMaterial( { map: new THREE.Texture( x ) } );
-					xm.map.image.loaded = 1;
+					xm.map.needsUpdate = true;
 
 					mesh = new THREE.Mesh( new Plane( size, size ), xm );
 					mesh.position.x = i * (size + 5) - ( ( materials.length - 1 )* ( size + 5 )/2);
@@ -284,7 +277,18 @@
 
 			}
 
-			function loop() {
+			//
+
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+				stats.update();
+
+			}
+
+			function render() {
 
 				camera.position.x += ( mouseX - camera.position.x ) * .05;
 				camera.position.y += ( - mouseY - camera.position.y ) * .05;
@@ -293,8 +297,6 @@
 				if ( render_canvas ) canvasRenderer.render( scene, camera );
 				if ( render_gl && has_gl ) webglRenderer.render( scene, camera );
 
-				stats.update();
-
 			}
 
 			function log(text) {

+ 275 - 0
examples/misc_sound.html

@@ -0,0 +1,275 @@
+<!DOCTYPE HTML>
+<html lang="en">
+	<head>
+		<title>three.js - misc - sound</title>
+		<meta charset="utf-8">
+		<style type="text/css">
+			body {
+				background-color: #000000;
+				margin: 0px;
+				overflow: hidden;
+				font-family:Monospace;
+				font-size:13px;
+				text-align:center;
+				font-weight: bold;
+				text-align:center;
+			}
+
+			a {
+				color:#0078ff;
+			}
+
+			#info {
+				color:#fff;
+				position: absolute;
+				top: 0px; width: 100%;
+				padding: 5px;
+				z-index:100;
+			}
+		</style>
+	</head>
+	<body>
+
+		<div id="info">
+			<a href="http://github.com/mrdoob/three.js" target="_blank">three.js</a> - webgl 3d sounds example -
+			music by <a href="http://www.newgrounds.com/audio/listen/358232" target="_blank">larrylarrybb</a> and
+			<a href="http://www.newgrounds.com/audio/listen/376737" target="_blank">skullbeatz</a> <br/><br/>
+
+			navigate with WASD / arrows / mouse
+		</div>
+
+
+		<div id="container"></div>
+
+		<script type="text/javascript" src="../build/Three.js"></script>
+
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
+		<script type="text/javascript" src="js/Detector.js"></script>
+
+		<script type="text/javascript">
+
+			if ( ! Detector.webgl ) Detector.addGetWebGLMessage();
+
+			var container;
+			var camera, scene, renderer, soundRenderer;
+			var light, pointLight;
+			var cameraControl;
+
+			var mesh;
+			var material_sphere1, material_sphere2;
+
+			var postprocessing = { enabled: true };
+
+			init();
+			animate();
+
+			function init() {
+
+				container = document.getElementById( 'container' );
+
+				scene  = new THREE.Scene();
+				scene.fog = new THREE.FogExp2( 0x000000, 0.0035 );
+
+				camera = new THREE.QuakeCamera( { fov: 50, aspect: window.innerWidth / window.innerHeight, near: 1, far: 10000,
+												  movement_speed: 1, look_speed: 0.002, nofly: true, look_vertical: false } );
+
+				camera.position.set( 0, 25, 0 );
+
+				light = new THREE.DirectionalLight( 0xffffff );
+				light.position.set( 0, 0.5, 1 );
+				light.position.normalize();
+				scene.addLight( light );
+
+				var sphere = new Sphere( 20, 32, 16 );
+
+				material_sphere1 = new THREE.MeshLambertMaterial( { color: 0xffaa00, shading: THREE.FlatShading } );
+				material_sphere2 = new THREE.MeshLambertMaterial( { color: 0xff2200, shading: THREE.FlatShading } );
+
+				var cube = new Cube( 5, 40, 5 );
+				var material_cube = new THREE.MeshLambertMaterial( { color: 0xffff00, shading: THREE.FlatShading } );
+				material_cube.color.setHSV( 0.1, 0.7, 1 );
+
+				// sound spheres
+
+				var s = 1;
+
+				var mesh1 = new THREE.Mesh( sphere, material_sphere1 );
+				mesh1.position.set( -250, 30, 0 );
+				mesh1.scale.set( s, s, s );
+
+				var sound1 = new THREE.Sound( [ "sounds/358232_j_s_song.mp3", "sounds/358232_j_s_song.ogg" ] , 275, 20, true );
+				//var sound1 = new THREE.Sound( "sounds/358232_j_s_song.ogg", 275, 20, true );
+				sound1.play();
+
+				var dbg = new THREE.Mesh( cube, material_cube );
+				dbg.position.set( 0, -10 ,0 );
+				mesh1.addChild( dbg );
+
+				mesh1.addChild( sound1 );
+				scene.addObject( mesh1 );
+
+
+				var mesh2 = new THREE.Mesh( sphere, material_sphere2 );
+				mesh2.position.set( 250, 30, 0 );
+				mesh2.scale.set( s, s, s );
+
+				var sound2 = new THREE.Sound( [ "sounds/376737_Skullbeatz___Bad_Cat_Maste.mp3", "sounds/376737_Skullbeatz___Bad_Cat_Maste.ogg" ], 275, 20, true );
+				//var sound2 = new THREE.Sound( "sounds/376737_Skullbeatz___Bad_Cat_Maste.ogg", 275, 20, true );
+				sound2.play();
+
+				var dbg = new THREE.Mesh( cube, material_cube );
+				dbg.position.set( 0, -10, 0 );
+				mesh2.addChild( dbg );
+
+				mesh2.addChild( sound2 );
+				scene.addObject( mesh2 );
+
+				// ground
+
+				var material_wireframe = new THREE.MeshLambertMaterial( { color: 0xffaa00, wireframe: true, wireframe_linewidth: 1 } );
+				material_wireframe.color.setHSV( 0.1, 0.2, 0.25 );
+
+
+				var plane = new Plane( 1000, 1000, 100, 100 );
+				mesh = new THREE.Mesh( plane, material_wireframe );
+				mesh.position.y = 0.1;
+				mesh.rotation.x = -1.57;
+				scene.addObject( mesh );
+
+
+				renderer = new THREE.WebGLRenderer( { clearColor: 0x000000, clearAlpha: 1 } );
+				renderer.setSize( window.innerWidth, window.innerHeight );
+
+				soundRenderer = new THREE.SoundRenderer();
+
+				container.innerHTML = "";
+				container.appendChild( renderer.domElement );
+				container.appendChild( soundRenderer.domElement );
+
+				initPostprocessing();
+				renderer.autoClear = false;
+
+			}
+
+
+			function initPostprocessing() {
+
+				postprocessing.scene = new THREE.Scene();
+
+				postprocessing.camera = new THREE.Camera();
+				postprocessing.camera.projectionMatrix = THREE.Matrix4.makeOrtho( window.innerWidth / - 2, window.innerWidth / 2,  window.innerHeight / 2, window.innerHeight / - 2, -10000, 10000 );
+				postprocessing.camera.position.z = 100;
+
+				var pars = { min_filter: THREE.LinearFilter, mag_filter: THREE.LinearFilter };
+				postprocessing.rtTexture1 = new THREE.RenderTarget( window.innerWidth, window.innerHeight, pars );
+				postprocessing.rtTexture2 = new THREE.RenderTarget( 512, 512, pars );
+				postprocessing.rtTexture3 = new THREE.RenderTarget( 512, 512, pars );
+
+				var screen_shader = ShaderUtils.lib["screen"];
+				var screen_uniforms = Uniforms.clone( screen_shader.uniforms );
+
+				screen_uniforms["tDiffuse"].texture = postprocessing.rtTexture1;
+				screen_uniforms["opacity"].value = 1.0;
+
+				postprocessing.materialScreen = new THREE.MeshShaderMaterial( {
+
+					uniforms: screen_uniforms,
+					vertex_shader: screen_shader.vertex_shader,
+					fragment_shader: screen_shader.fragment_shader,
+					blending: THREE.AdditiveBlending
+
+				} );
+
+				var convolution_shader = ShaderUtils.lib["convolution"];
+				var convolution_uniforms = Uniforms.clone( convolution_shader.uniforms );
+
+				postprocessing.blurx = new THREE.Vector2( 0.001953125, 0.0 ),
+				postprocessing.blury = new THREE.Vector2( 0.0, 0.001953125 );
+
+				convolution_uniforms["tDiffuse"].texture = postprocessing.rtTexture1;
+				convolution_uniforms["uImageIncrement"].value = postprocessing.blurx;
+				convolution_uniforms["cKernel"].value = ShaderUtils.buildKernel( 4.0 );
+
+				postprocessing.materialConvolution = new THREE.MeshShaderMaterial( {
+
+					uniforms: convolution_uniforms,
+					vertex_shader:   "#define KERNEL_SIZE 25.0\n" + convolution_shader.vertex_shader,
+					fragment_shader: "#define KERNEL_SIZE 25\n"   + convolution_shader.fragment_shader
+
+				} );
+
+				postprocessing.quad = new THREE.Mesh( new Plane( window.innerWidth, window.innerHeight ), postprocessing.materialConvolution );
+				postprocessing.quad.position.z = -500;
+				postprocessing.scene.addObject( postprocessing.quad );
+
+			}
+
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+
+			}
+
+
+			function render() {
+
+				var time = new Date().getTime() * 0.005;
+
+				material_sphere1.color.setHSV( 0.0, 0.3 + 0.7 * ( 1 + Math.cos(time) ) / 2, 1 );
+				material_sphere2.color.setHSV( 0.1, 0.3 + 0.7 * ( 1 + Math.sin(time) ) / 2, 1 );
+
+				if ( postprocessing.enabled ) {
+
+					renderer.clear();
+
+					// Render scene into texture
+
+					renderer.render( scene, camera, postprocessing.rtTexture1 );
+
+					// Render quad with blured scene into texture (convolution pass 1)
+
+					postprocessing.quad.materials = [ postprocessing.materialConvolution ];
+
+					postprocessing.materialConvolution.uniforms.tDiffuse.texture = postprocessing.rtTexture1;
+					postprocessing.materialConvolution.uniforms.uImageIncrement.value = postprocessing.blurx;
+
+					renderer.render( postprocessing.scene, postprocessing.camera, postprocessing.rtTexture2 );
+
+					// Render quad with blured scene into texture (convolution pass 2)
+
+					postprocessing.materialConvolution.uniforms.tDiffuse.texture = postprocessing.rtTexture2;
+					postprocessing.materialConvolution.uniforms.uImageIncrement.value = postprocessing.blury;
+
+					renderer.render( postprocessing.scene, postprocessing.camera, postprocessing.rtTexture3 );
+
+					// Render original scene with superimposed blur to texture
+
+					postprocessing.quad.materials = [ postprocessing.materialScreen ];
+
+					postprocessing.materialScreen.uniforms.tDiffuse.texture = postprocessing.rtTexture3;
+					postprocessing.materialScreen.uniforms.opacity.value = 1.3;
+
+					renderer.render( postprocessing.scene, postprocessing.camera, postprocessing.rtTexture1, false );
+
+					// Render to screen
+
+					postprocessing.materialScreen.uniforms.tDiffuse.texture = postprocessing.rtTexture1;
+					renderer.render( postprocessing.scene, postprocessing.camera );
+
+				} else {
+
+					renderer.clear();
+					renderer.render( scene, camera );
+
+				}
+
+				soundRenderer.render( scene, camera );
+
+			}
+
+		</script>
+
+	</body>
+</html>

+ 43 - 23
examples/uqbiquity_test.html → examples/misc_uqbiquity_test.html

@@ -26,22 +26,23 @@
 		<script type="text/javascript" src="../src/core/Rectangle.js"></script>
 		<script type="text/javascript" src="../src/core/Matrix3.js"></script>
 		<script type="text/javascript" src="../src/core/Matrix4.js"></script>
+		<script type="text/javascript" src="../src/core/Object3D.js"></script>
+		<script type="text/javascript" src="../src/core/Quaternion.js"></script>
 		<script type="text/javascript" src="../src/core/Vertex.js"></script>
 		<script type="text/javascript" src="../src/core/Face3.js"></script>
 		<script type="text/javascript" src="../src/core/Face4.js"></script>
 		<script type="text/javascript" src="../src/core/UV.js"></script>
 		<script type="text/javascript" src="../src/core/Geometry.js"></script>
+		<script type="text/javascript" src="../src/animation/AnimationHandler.js"></script>
+		<script type="text/javascript" src="../src/animation/Animation.js"></script>
 		<script type="text/javascript" src="../src/cameras/Camera.js"></script>
+		<script type="text/javascript" src="../src/cameras/QuakeCamera.js"></script>
 		<script type="text/javascript" src="../src/lights/Light.js"></script>
 		<script type="text/javascript" src="../src/lights/AmbientLight.js"></script>
 		<script type="text/javascript" src="../src/lights/DirectionalLight.js"></script>
 		<script type="text/javascript" src="../src/lights/PointLight.js"></script>
-		<script type="text/javascript" src="../src/objects/Object3D.js"></script>
-		<script type="text/javascript" src="../src/objects/Particle.js"></script>
-		<script type="text/javascript" src="../src/objects/ParticleSystem.js"></script>
-		<script type="text/javascript" src="../src/objects/Line.js"></script>
-		<script type="text/javascript" src="../src/objects/Mesh.js"></script>
 		<script type="text/javascript" src="../src/materials/Material.js"></script>
+		<script type="text/javascript" src="../src/materials/Mappings.js"></script>
 		<script type="text/javascript" src="../src/materials/LineBasicMaterial.js"></script>
 		<script type="text/javascript" src="../src/materials/MeshBasicMaterial.js"></script>
 		<script type="text/javascript" src="../src/materials/MeshLambertMaterial.js"></script>
@@ -56,13 +57,14 @@
 		<script type="text/javascript" src="../src/materials/Texture.js"></script>
 		<script type="text/javascript" src="../src/materials/RenderTarget.js"></script>
 		<script type="text/javascript" src="../src/materials/Uniforms.js"></script>
-		<script type="text/javascript" src="../src/materials/mappings/CubeReflectionMapping.js"></script>
-		<script type="text/javascript" src="../src/materials/mappings/CubeRefractionMapping.js"></script>
-		<script type="text/javascript" src="../src/materials/mappings/LatitudeReflectionMapping.js"></script>
-		<script type="text/javascript" src="../src/materials/mappings/LatitudeRefractionMapping.js"></script>
-		<script type="text/javascript" src="../src/materials/mappings/SphericalReflectionMapping.js"></script>
-		<script type="text/javascript" src="../src/materials/mappings/SphericalRefractionMapping.js"></script>
-		<script type="text/javascript" src="../src/materials/mappings/UVMapping.js"></script>
+		<script type="text/javascript" src="../src/objects/Particle.js"></script>
+		<script type="text/javascript" src="../src/objects/ParticleSystem.js"></script>
+		<script type="text/javascript" src="../src/objects/Line.js"></script>
+		<script type="text/javascript" src="../src/objects/Mesh.js"></script>
+		<script type="text/javascript" src="../src/objects/Bone.js"></script>
+		<script type="text/javascript" src="../src/objects/SkinnedMesh.js"></script>
+		<script type="text/javascript" src="../src/objects/Ribbon.js"></script>
+		<script type="text/javascript" src="../src/objects/Sound.js"></script>
 		<script type="text/javascript" src="../src/scenes/Scene.js"></script>
 		<script type="text/javascript" src="../src/scenes/Fog.js"></script>
 		<script type="text/javascript" src="../src/scenes/FogExp2.js"></script>
@@ -71,17 +73,28 @@
 		<script type="text/javascript" src="../src/renderers/CanvasRenderer.js"></script>
 		<script type="text/javascript" src="../src/renderers/SVGRenderer.js"></script>
 		<script type="text/javascript" src="../src/renderers/WebGLRenderer.js"></script>
+		<script type="text/javascript" src="../src/renderers/SoundRenderer.js"></script>
 		<script type="text/javascript" src="../src/renderers/renderables/RenderableObject.js"></script>
 		<script type="text/javascript" src="../src/renderers/renderables/RenderableFace3.js"></script>
 		<script type="text/javascript" src="../src/renderers/renderables/RenderableParticle.js"></script>
 		<script type="text/javascript" src="../src/renderers/renderables/RenderableLine.js"></script>
-
-		<script type="text/javascript" src="obj/Qrcode.js"></script>
+		<script type="text/javascript" src="../src/extras/GeometryUtils.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/ShaderUtils.js"></script>
 		<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/primitives/Cylinder.js"></script>
+		<script type="text/javascript" src="../src/extras/primitives/Plane.js"></script>
+		<script type="text/javascript" src="../src/extras/primitives/Sphere.js"></script>
+		<script type="text/javascript" src="../src/extras/primitives/Torus.js"></script>
+		<script type="text/javascript" src="../src/extras/primitives/Icosahedron.js"></script>
+		<script type="text/javascript" src="../src/extras/primitives/LathedObject.js"></script>
 		<script type="text/javascript" src="../src/extras/objects/MarchingCubes.js"></script>
+		<script type="text/javascript" src="../src/extras/io/Loader.js"></script>
+
+		<script type="text/javascript" src="obj/Qrcode.js"></script>
 
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
 		<script type="text/javascript" src="js/Stats.js"></script>
 
 		<script type="text/javascript">
@@ -102,12 +115,8 @@
 			var windowHalfX = window.innerWidth / 2;
 			var windowHalfY = window.innerHeight / 2;
 
-			document.addEventListener( 'mousemove', onDocumentMouseMove, false );
-
 			init();
-			// loop();
-			setInterval( loop, 1000 / 60 );
-
+			animate();
 
 			function init() {
 
@@ -231,6 +240,8 @@
 				stats.domElement.style.top = '0px';
 				container.appendChild( stats.domElement );
 
+				document.addEventListener( 'mousemove', onDocumentMouseMove, false );
+
 			}
 
 			function onDocumentMouseMove(event) {
@@ -240,7 +251,18 @@
 
 			}
 
-			function loop() {
+			//
+
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+				stats.update();
+
+			}
+
+			function render() {
 
 				camera.position.x += ( mouseX - camera.position.x ) * .05;
 				camera.position.y += ( - mouseY - camera.position.y ) * .05;
@@ -258,8 +280,6 @@
 				svgRenderer.render( scene, camera );
 				webglRenderer.render( scene, camera );
 
-				stats.update();
-
 			}
 
 		</script>

+ 0 - 281
examples/render_to_texture.html

@@ -1,281 +0,0 @@
-<!DOCTYPE HTML>
-<html lang="en">
-    <head>
-        <title>three.js - render-to-texture - webgl</title>
-        <meta charset="utf-8">
-        <style type="text/css">
-            body {
-                color: #ffffff;
-                font-family:Monospace;
-                font-size:13px;
-                text-align:center;
-                font-weight: bold;
-
-                background-color: #000000;
-                margin: 0px;
-                overflow: hidden;
-            }
-
-            #info {
-                position: absolute;
-                top: 0px; width: 100%;
-                padding: 5px;
-            }
-
-            a {
-
-                color: #ffffff;
-            }
-
-        </style>
-    </head>
-    <body>
-
-        <div id="container"></div>
-        <div id="info"><a href="http://github.com/mrdoob/three.js" target="_blank">three.js</a> render-to-texture webgl example</div>
-
-        <script type="text/javascript" src="js/Stats.js"></script>
-        <script type="text/javascript" src="../build/ThreeExtras.js"></script>
-
-        <script id="fragment_shader_screen" type="x-shader/x-fragment">
-			varying vec2 vUv;
-			uniform sampler2D tDiffuse;
-			
-            void main(void)
-            {
-				//gl_FragColor = texture2D( tDiffuse, vec2( vUv.x, 1.0 - vUv.y ) );
-				gl_FragColor = texture2D( tDiffuse, vUv );
-            }
-        </script>
-
-        <script id="fragment_shader_pass_1" type="x-shader/x-fragment">
-			varying vec2 vUv;
-			uniform float time;
-			
-            void main(void)
-            {
-                //gl_FragColor = vec4( time, vUv.x, vUv.y, 1.0 );
-				float r = vUv.x;
-				if( vUv.y < 0.5 ) r = 0.0;
-				float g = vUv.y;
-				if( vUv.x < 0.5 ) g = 0.0;
-				
-				gl_FragColor = vec4( r, g, time, 1.0 );
-            }
-        </script>
-
-        <script id="vertex_shader" type="x-shader/x-vertex">
-            varying vec2 vUv;
-
-            void main()
-            {
-               vUv = uv;
-               //gl_Position = vec4( position, 1.0 );
-			   gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );
-           }
-        </script>
-
-
-        <script type="text/javascript">
-
-			if ( ! THREE.Detector.webgl ) THREE.Detector.addGetWebGLMessage();
-			
-            var container, stats;
-
-            var cameraRTT, camera, sceneRTT, sceneScreen, scene, renderer, zmesh1, zmesh2;
-
-			var mouseX = 0, mouseY = 0;
-			
-			var windowHalfX = window.innerWidth / 2;
-			var windowHalfY = window.innerHeight / 2;
-			
-            var rtTexture, material, quad;
-
-            init();
-            setInterval( loop, 1000 / 60 );
-
-            function init() {
-
-                container = document.getElementById( 'container' );
-
-                cameraRTT = new THREE.Camera();
-				cameraRTT.projectionMatrix = THREE.Matrix4.makeOrtho( window.innerWidth / - 2, window.innerWidth / 2, window.innerHeight / 2, window.innerHeight / - 2, -10000, 10000 );
-                cameraRTT.position.z = 100;
-
-				camera = new THREE.Camera( 30, window.innerWidth / window.innerHeight, 1, 10000 );
-				camera.position.z = 100;
-				camera.updateMatrix();
-
-                sceneRTT = new THREE.Scene();
-				sceneScreen = new THREE.Scene();
-				scene = new THREE.Scene();
-
-				var light = new THREE.DirectionalLight( 0xffffff );
-				light.position.x = 0;
-				light.position.y = 0;
-				light.position.z = 1;
-				light.position.normalize();
-				scene.addLight( light );
-				sceneRTT.addLight( light );
-				sceneScreen.addLight( light );
-
-				light = new THREE.DirectionalLight( 0xffaaaa, 0.5 );
-				light.position.x = -1;
-				light.position.y = 0;
-				light.position.z = -1;
-				light.position.normalize();
-				scene.addLight( light );
-
-                rtTexture = new THREE.RenderTarget( window.innerWidth, window.innerHeight, { min_filter: THREE.LinearFilter, mag_filter: THREE.NearestFilter } );
-
-                material = new THREE.MeshShaderMaterial( {
-
-                    uniforms: { time: { type: "f", value: 0.0 } },
-                    vertex_shader: document.getElementById( 'vertex_shader' ).textContent,
-                    fragment_shader: document.getElementById( 'fragment_shader_pass_1' ).textContent
-
-                } );
-
-                var materialScreen = new THREE.MeshShaderMaterial( {
-
-                    uniforms: { tDiffuse: { type: "t", value: 0, texture: rtTexture } },
-                    vertex_shader: document.getElementById( 'vertex_shader' ).textContent,
-                    fragment_shader: document.getElementById( 'fragment_shader_screen' ).textContent
-
-                } );
-
-				//var mt = new THREE.MeshBasicMaterial( { color:0xffffff, map: ImageUtils.loadTexture( "textures/land_ocean_ice_cloud_2048.jpg" ) } );
-				
-				var plane = new Plane( window.innerWidth, window.innerHeight );
-				
-                quad = new THREE.Mesh( plane, material );
-				quad.position.z = -100;
-                sceneRTT.addObject( quad );
-
-				var loader = new THREE.Loader();
-				loader.loadBinary( { model: "obj/torus/Torus_bin.js", callback: function( geometry ) { createMesh( geometry, sceneRTT ) } } );
-
-                quad = new THREE.Mesh( plane, materialScreen );
-				quad.position.z = -100;
-                sceneScreen.addObject( quad );
-
-				var n = 5,
-					geometry = new Sphere( 10, 64, 32 ),
-					material2 = new THREE.MeshLambertMaterial( { color:0xffffff, map: rtTexture } );
-					//material2 = new THREE.MeshBasicMaterial( { color:0xffffff, map: rtTexture } );
-				
-				for( var j = 0; j < n; j++ ) {
-					for( var i = 0; i < n; i++ ) {
-					
-						mesh = new THREE.Mesh( geometry, material2 );
-						mesh.position.x = ( i - (n-1)/2 ) * 20;
-						mesh.position.y = ( j - (n-1)/2 ) * 20;
-						mesh.position.z = 0;
-						mesh.rotation.y = 1.57;
-						scene.addObject( mesh );
-						
-					}
-				}
-
-                renderer = new THREE.WebGLRenderer();
-				renderer.setSize( window.innerWidth, window.innerHeight );
-				renderer.autoClear = false;
-                container.appendChild( renderer.domElement );
-				
-                stats = new Stats();
-                stats.domElement.style.position = 'absolute';
-                stats.domElement.style.top = '0px';
-                container.appendChild( stats.domElement );
-				
-				document.addEventListener( 'mousemove', onDocumentMouseMove, false );
-
-            }
-
-			function createMesh( geometry, xscene ) {
-
-				var mat1 = new THREE.MeshPhongMaterial( { color: 0x555555, specular:0xffaa00, shininess:5 } ),
-					mat2 = new THREE.MeshPhongMaterial( { color: 0x550000, specular:0xff2200, shininess:5 } );
-				
-				zmesh1 = new THREE.Mesh( geometry, mat1 );
-				zmesh1.position.x = 0;
-				zmesh1.position.y = 0;
-				zmesh1.position.z = 100;
-				zmesh1.scale.x = zmesh1.scale.y = zmesh1.scale.z = 150;
-				zmesh1.overdraw = true;
-				zmesh1.updateMatrix();
-				xscene.addObject( zmesh1 );
-
-				zmesh2 = new THREE.Mesh( geometry, mat2 );
-				zmesh2.position.x = 0;
-				zmesh2.position.y = 150;
-				zmesh2.position.z = 100;
-				zmesh2.scale.x = zmesh2.scale.y = zmesh2.scale.z = 75;
-				zmesh2.overdraw = true;
-				zmesh2.updateMatrix();
-				xscene.addObject( zmesh2 );
-
-			}
-
-			function onDocumentMouseMove( event ) {
-
-				mouseX = ( event.clientX - windowHalfX );
-				mouseY = ( event.clientY - windowHalfY );
-
-			}
-
-			var delta = 0.01;
-			
-            function loop() {
-
-				var time = new Date().getTime() * 0.0015;
-				
-				camera.position.x += ( mouseX - camera.position.x ) * .05;
-				camera.position.y += ( - mouseY - camera.position.y ) * .05;
-
-				if ( zmesh1 && zmesh2 ) {
-				
-					zmesh1.rotation.x = 1.57;
-					zmesh1.rotation.z = time;
-
-					zmesh2.rotation.z = 1.57;
-					zmesh2.rotation.y = -time;
-
-				}
-				
-				if ( material.uniforms.time.value > 1 || material.uniforms.time.value < 0 ) {
-				
-					delta *= -1;
-					
-				}
-					
-				material.uniforms.time.value += delta;
-				
-				renderer.clear();
-				
-				// Render first scene into texture
-				
-                renderer.render( sceneRTT, cameraRTT, rtTexture );
-				
-				
-				// Render full screen quad with generated texture
-				// (disable depth writing so that it stays in the background)
-				
-				renderer.context.depthMask( 0 );
-				renderer.render( sceneScreen, cameraRTT );
-				//renderer.render( sceneRTT, cameraRTT );
-				renderer.context.depthMask( 1 );
-				
-                // Render second scene to screen
-				// (using first scene as regular texture)
-				
-                renderer.render( scene, camera );
-				
-
-                stats.update();
-
-            }
-
-        </script>
-
-    </body>
-</html>

二进制
examples/sounds/358232_j_s_song.mp3


二进制
examples/sounds/358232_j_s_song.ogg


二进制
examples/sounds/376737_Skullbeatz___Bad_Cat_Maste.mp3


二进制
examples/sounds/376737_Skullbeatz___Bad_Cat_Maste.ogg


+ 8 - 0
examples/sounds/readme.txt

@@ -0,0 +1,8 @@
+Music from Newgrounds Audio portal, licensed under 
+Creative Commons Attribution Noncommercial Share Alike
+
+Bad Cat [Master Version] by Skullbeatz
+http://www.newgrounds.com/audio/listen/376737
+
+The Sound of Epicness by larrylarrybb
+http://www.newgrounds.com/audio/listen/358232

+ 36 - 26
examples/io_blender_colors.html → examples/webgl_geometry_blenderexport_colors.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - io - blender - vertex colors - webgl</title>
+		<title>three.js webgl - io blender - vertex colors</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -12,6 +12,7 @@
 
 				background-color: #000;
 				margin: 0px;
+				padding: 0px;
 				overflow: hidden;
 			}
 
@@ -22,7 +23,6 @@
 			}
 
 			a {
-
 				color: #0080ff;
 			}
 
@@ -30,15 +30,18 @@
 	</head>
 	<body>
 
-		<div id="container"></div> 
-		<div id="info"><a href="http://github.com/mrdoob/three.js" target="_blank">three.js</a> - vertex colors - blender export - webgl</div>
+		<div id="container"></div>
+		<div id="info"><a href="http://github.com/mrdoob/three.js" target="_blank">three.js</a> webgl - io blender - vertex colors</div>
+
+		<script type="text/javascript" src="../build/Three.js"></script>
+
+		<script type="text/javascript" src="js/Detector.js"></script>
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
+		<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>		
-		
 		<script type="text/javascript">
 
-			if ( ! THREE.Detector.webgl ) THREE.Detector.addGetWebGLMessage();
+			if ( ! Detector.webgl ) Detector.addGetWebGLMessage();
 
 			var container, stats;
 
@@ -51,10 +54,8 @@
 			var windowHalfX = window.innerWidth / 2;
 			var windowHalfY = window.innerHeight / 2;
 
-
 			init();
-			setInterval( loop, 1000 / 60 );
-
+			animate();
 
 			function init() {
 
@@ -64,9 +65,9 @@
 				camera.position.z = 1800;
 
 				scene = new THREE.Scene();
-				
+
 				//scene.addLight( new THREE.AmbientLight( 0x333333 )  );
-				
+
 				light = new THREE.DirectionalLight( 0xffffff );
 				light.position.set( 0, 0, 1 );
 				light.position.normalize();
@@ -74,7 +75,7 @@
 
 				var loader = new THREE.Loader();
 				loader.loadAscii( { model: "obj/cubecolors/cubecolors.js", callback: createScene } );
-				
+
 				renderer = new THREE.WebGLRenderer();
 				renderer.setSize( window.innerWidth, window.innerHeight );
 
@@ -90,16 +91,15 @@
 			}
 
 			function createScene( geometry ) {
-			
+
 				geometry.materials[0][0].shading = THREE.FlatShading;
-				
-				var material = [ new THREE.MeshFaceMaterial(), 
-								 new THREE.MeshLambertMaterial( { color: 0xffffff, opacity:0.9, shading:THREE.FlatShading, wireframe: true, wireframe_linewidth: 2 } )  
-								];
+
+				var material = [ new THREE.MeshFaceMaterial(), new THREE.MeshLambertMaterial( { color: 0xffffff, opacity:0.9, shading:THREE.FlatShading, wireframe: true, wireframe_linewidth: 2 } ) ];
+
 				mesh = SceneUtils.addMesh( scene, geometry, 250, 0, 0, 0, 0, 0, 0, material );
-				
+
 			}
-			
+
 			function onDocumentMouseMove( event ) {
 
 				mouseX = ( event.clientX - windowHalfX );
@@ -107,20 +107,30 @@
 
 			}
 
-			function loop() {
+			//
+
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+				stats.update();
+
+			}
+
+			function render() {
 
 				camera.position.x += ( mouseX - camera.position.x ) * 0.05;
 				camera.position.y += ( - mouseY - camera.position.y ) * 0.05;
 
 				if ( mesh ) {
-				
+
 					mesh.rotation.x += 0.01;
 					mesh.rotation.y += 0.01;
-					
+
 				}
-				
+
 				renderer.render( scene, camera );
-				stats.update();
 
 			}
 

+ 32 - 21
examples/geometry_colors.html → examples/webgl_geometry_colors.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - geometry - vertex colors - webgl</title>
+		<title>three.js webgl - geometry - vertex colors</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -30,15 +30,18 @@
 	</head>
 	<body>
 
-		<div id="container"></div> 
+		<div id="container"></div>
 		<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="../build/Three.js"></script>
+
+		<script type="text/javascript" src="js/Detector.js"></script>
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
 		<script type="text/javascript" src="js/Stats.js"></script>
-		<script type="text/javascript" src="../build/ThreeExtras.js"></script>
 
 		<script type="text/javascript">
 
-			if ( ! THREE.Detector.webgl ) THREE.Detector.addGetWebGLMessage();
+			if ( ! Detector.webgl ) Detector.addGetWebGLMessage();
 
 			var container, stats;
 
@@ -51,10 +54,8 @@
 			var windowHalfX = window.innerWidth / 2;
 			var windowHalfY = window.innerHeight / 2;
 
-
 			init();
-			setInterval( loop, 1000 / 60 );
-
+			animate();
 
 			function init() {
 
@@ -64,7 +65,7 @@
 				camera.position.z = 1800;
 
 				scene = new THREE.Scene();
-				
+
 				light = new THREE.DirectionalLight( 0xffffff );
 				light.position.set( 0, 0, 1 );
 				light.position.normalize();
@@ -72,7 +73,7 @@
 
 				var shadowMaterial = new THREE.MeshBasicMaterial( { map: ImageUtils.loadTexture( 'textures/shadow.png' ) } );
 				var shadowGeo = new Plane( 300, 300, 1, 1 );
-				
+
 				mesh = new THREE.Mesh( shadowGeo, shadowMaterial );
 				mesh.position.y = - 250;
 				mesh.rotation.x = - 90 * Math.PI / 180;
@@ -91,15 +92,15 @@
 				scene.addObject( mesh );
 
 				var color, p, colors = [], colors2 = [], colors3 = [],
-					
+
 					geometry = new Icosahedron( 1 ),
 					geometry2 = new THREE.Geometry(),
 					geometry3 = new THREE.Geometry();
-					
+
 				for( var i = 0; i < geometry.vertices.length; i++ ) {
-				
+
 					p = geometry.vertices[ i ].position;
-					
+
 					color = new THREE.Color( 0xffffff );
 					color.setHSV( ( p.y + 1 ) / 2, 1.0, 1.0 );
 					colors[ i ] = color;
@@ -116,21 +117,21 @@
 
 				geometry3.vertices = geometry2.vertices = geometry.vertices;
 				geometry3.faces = geometry2.faces = geometry.faces;
-				
+
 				geometry2.sortFacesByMaterial();
 				geometry3.sortFacesByMaterial();
-				
+
 				geometry.colors = colors;
 				geometry2.colors = colors2;
 				geometry3.colors = colors3;
-				
+
 				var materials = [
-					
+
 					new THREE.MeshLambertMaterial( { color: 0xffffff, shading: THREE.FlatShading, vertex_colors: true } ),
 					new THREE.MeshBasicMaterial( { color: 0x000000, shading: THREE.FlatShading, wireframe: true } )
-					
+
 				];
-				
+
 				mesh = new THREE.Mesh( geometry, materials  );
 				mesh.position.x = -400;
 				mesh.scale.x = mesh.scale.y = mesh.scale.z = 200;
@@ -170,13 +171,23 @@
 
 			}
 
-			function loop() {
+			//
+
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+				stats.update();
+
+			}
+
+			function render() {
 
 				camera.position.x += ( mouseX - camera.position.x ) * 0.05;
 				camera.position.y += ( - mouseY - camera.position.y ) * 0.05;
 
 				renderer.render( scene, camera );
-				stats.update();
 
 			}
 

+ 35 - 130
examples/geometry_dynamic_gl.html → examples/webgl_geometry_dynamic.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - geometry - dynamic - webgl</title>
+		<title>three.js webgl - geometry - dynamic</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -36,54 +36,48 @@
 	</head>
 	<body>
 
-		<div id="container"><br /><br /><br /><br /><br />Generating world...</div> 
-		<div id="info"><a href="http://github.com/mrdoob/three.js" target="_blank">three.js</a> - dynamic geometry demo - webgl<br />(left click: forward, right click: backward)</div> 
+		<div id="container"></div>
+		<div id="info"><a href="http://github.com/mrdoob/three.js" target="_blank">three.js</a> - dynamic geometry demo - webgl<br />(left click: forward, right click: backward)</div>
 
-		<script type="text/javascript" src="../build/ThreeExtras.js"></script>
+		<script type="text/javascript" src="../build/Three.js"></script>
+
+		<script type="text/javascript" src="js/Detector.js"></script>
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
 		<script type="text/javascript" src="js/Stats.js"></script>
 
 		<script type="text/javascript">
 
-			if ( ! THREE.Detector.webgl ) {
-			
-				THREE.Detector.addGetWebGLMessage();
+			if ( ! Detector.webgl ) {
+
+				Detector.addGetWebGLMessage();
 				document.getElementById( 'container' ).innerHTML = "";
-				
+
 			}
 
 			var container, stats;
 
 			var camera, scene, renderer;
-			
+
 			var mesh, texture,geometry, material;
 
 			var worldWidth = 128, worldDepth = 128,
 			worldHalfWidth = worldWidth / 2, worldHalfDepth = worldDepth / 2;
 
-			var mouseX = 0, mouseY = 0,
-			lat = 0, lon = 0, phy = 0, theta = 0;
-
-			var direction = new THREE.Vector3(),
-			moveForward = false, moveBackward = false, moveLeft = false, moveRight = false;
-
-			var windowHalfX = window.innerWidth / 2;
-			var windowHalfY = window.innerHeight / 2;
-
-
 			init();
-			setInterval( loop, 1000 / 60 );
-
+			animate();
 
 			function init() {
 
 				container = document.getElementById( 'container' );
 
-				camera = new THREE.Camera( 60, window.innerWidth / window.innerHeight, 1, 20000 );
+				camera = new THREE.QuakeCamera( { fov: 60, aspect: window.innerWidth / window.innerHeight, near: 1, far: 20000,
+												  movement_speed: 10, look_speed: 0.004, nofly: false, look_vertical: true } );
+
 				camera.target.position.z = - 100;
 
 				scene = new THREE.Scene();
 				scene.fog = new THREE.FogExp2( 0xaaccff, 0.0007 );
-				
+
 				//var light = new THREE.PointLight( 0xffffff, 2 );
 				//light.position.y = 500;
 				//scene.addLight( light );
@@ -94,42 +88,42 @@
 				geometry = new Plane( 20000, 20000, worldWidth - 1, worldDepth - 1 );
 
 				var i, j, il, jl;
-				
+
 				for ( i = 0, il = geometry.vertices.length; i < il; i ++ ) {
 
 					geometry.vertices[ i ].position.z = 35 * Math.sin( i/2 );
 
 				}
-				
+
 				for( i = 0; i < geometry.uvs.length; i++ ) {
-				
+
 					var uvs = geometry.uvs[ i ];
 					for ( j = 0, jl = uvs.length; j < jl; j++ ) {
-					
+
 						uvs[ j ].u *= 5;
 						uvs[ j ].v *= 5;
-						
+
 					}
 
 				}
-				
+
 
 				//console.log( "triangles: " + geometry.faces.length * 2 + " faces: " + geometry.faces.length + " vertices: " + geometry.vertices.length );
-				
+
 				geometry.computeFaceNormals();
 				geometry.computeVertexNormals();
-				
+
 				var texture = ImageUtils.loadTexture( "textures/water.jpg" );
 				texture.wrap_s = texture.wrap_t = THREE.RepeatWrapping;
 				material = new THREE.MeshBasicMaterial( { color:0x0044ff, opacity:1, map: texture } );
-				
+
 				mesh = new THREE.Mesh( geometry, material );
 				mesh.rotation.x = - 90 * Math.PI / 180;
 				scene.addObject( mesh );
 
 				renderer = new THREE.WebGLRenderer( { clearColor:0xaaccff, clearAlpha: 1 } );
 				renderer.setSize( window.innerWidth, window.innerHeight );
-				
+
 				container.innerHTML = "";
 
 				container.appendChild( renderer.domElement );
@@ -139,110 +133,23 @@
 				stats.domElement.style.top = '0px';
 				container.appendChild( stats.domElement );
 
-				document.addEventListener( 'mousedown', onDocumentMouseDown, false );
-				document.addEventListener( 'mouseup', onDocumentMouseUp, false );
-				document.addEventListener( 'mousemove', onDocumentMouseMove, false );
-				document.addEventListener( 'contextmenu', function ( event ) { event.preventDefault(); }, false );
-				
-				document.addEventListener( 'keydown', onDocumentKeyDown, false );
-				document.addEventListener( 'keyup', onDocumentKeyUp, false );
-
-			}
-
-
-			function onDocumentMouseDown( event ) {
-
-				event.preventDefault();
-				event.stopPropagation();
-
-				switch ( event.button ) {
-
-					case 0: moveForward = true; break;
-					case 2: moveBackward = true; break;
-
-				}
-
 			}
 
-			function onDocumentMouseUp( event ) {
-
-				event.preventDefault();
-				event.stopPropagation();
-
-				switch ( event.button ) {
-
-					case 0: moveForward = false; break;
-					case 2: moveBackward = false; break;
 
-				}
-
-			}
+			//
 
-			function onDocumentMouseMove(event) {
+			function animate() {
 
-				mouseX = event.clientX - windowHalfX;
-				mouseY = event.clientY - windowHalfY;
+				requestAnimationFrame( animate );
 
-			}
-			
-			function onDocumentKeyDown( event ) {
-
-				switch( event.keyCode ) {
-
-					case 38: /*up*/
-					case 87: /*W*/ moveForward = true; break;
-
-					case 37: /*left*/
-					case 65: /*A*/ moveLeft = true; break;
-
-					case 40: /*down*/
-					case 83: /*S*/ moveBackward = true; break;
-
-					case 39: /*right*/
-					case 68: /*D*/ moveRight = true; break;
-				}
+				render();
+				stats.update();
 
 			}
 
-			function onDocumentKeyUp( event ) {
-
-				switch( event.keyCode ) {
-
-					case 38: /*up*/
-					case 87: /*W*/ moveForward = false; break;
-
-					case 37: /*left*/
-					case 65: /*A*/ moveLeft = false; break;
-
-					case 40: /*down*/
-					case 83: /*S*/ moveBackward = false; break;
-
-					case 39: /*right*/
-					case 68: /*D*/ moveRight = false; break;
-				}
-
-			}
-			
-			function loop() {
+			function render() {
 
 				var time = new Date().getTime() * 0.01;
-				
-				if ( moveForward ) camera.translateZ( - 10 );
-				if ( moveBackward ) camera.translateZ( 10 );
-				if ( moveLeft )     camera.translateX( - 10 );
-				if ( moveRight )    camera.translateX( 10 );
-
-				lon += mouseX * 0.004;
-				lat -= mouseY * 0.004;
-
-				lat = Math.max( - 85, Math.min( 85, lat ) );
-				phi = ( 90 - lat ) * Math.PI / 180;
-				theta = lon * Math.PI / 180;
-
-				camera.target.position.x = 100 * Math.sin( phi ) * Math.cos( theta ) + camera.position.x;
-				camera.target.position.y = 100 * Math.cos( phi ) + camera.position.y;
-				camera.target.position.z = 100 * Math.sin( phi ) * Math.sin( theta ) + camera.position.z;
-
 
 				for ( var i = 0, l = geometry.vertices.length; i < l; i ++ ) {
 
@@ -255,12 +162,10 @@
 
 				mesh.geometry.__dirtyVertices = true;
 				//mesh.geometry.__dirtyNormals = true;
-				
+
 				renderer.render(scene, camera);
-				
-				stats.update();
 
-			}			
+			}
 
 		</script>
 

+ 203 - 0
examples/webgl_geometry_hierarchy.html

@@ -0,0 +1,203 @@
+<!DOCTYPE HTML>
+<html lang="en">
+	<head>
+		<title>three.js webgl - geometry hierarchy</title>
+		<meta charset="utf-8">
+		<style type="text/css">
+			body {
+				background:#fff;
+				padding:0;
+				margin:0;
+				font-weight: bold;
+				overflow:hidden;
+			}
+		</style>
+	</head>
+	<body>
+
+		<!-- <script type="text/javascript" src="../build/Three.js"></script> -->
+
+		<script type="text/javascript" src="../src/Three.js"></script>
+		<script type="text/javascript" src="../src/core/Color.js"></script>
+		<script type="text/javascript" src="../src/core/Vector2.js"></script>
+		<script type="text/javascript" src="../src/core/Vector3.js"></script>
+		<script type="text/javascript" src="../src/core/Vector4.js"></script>
+		<script type="text/javascript" src="../src/core/Ray.js"></script>
+		<script type="text/javascript" src="../src/core/Rectangle.js"></script>
+		<script type="text/javascript" src="../src/core/Matrix3.js"></script>
+		<script type="text/javascript" src="../src/core/Matrix4.js"></script>
+		<script type="text/javascript" src="../src/core/Object3D.js"></script>
+		<script type="text/javascript" src="../src/core/Quaternion.js"></script>
+		<script type="text/javascript" src="../src/core/Vertex.js"></script>
+		<script type="text/javascript" src="../src/core/Face3.js"></script>
+		<script type="text/javascript" src="../src/core/Face4.js"></script>
+		<script type="text/javascript" src="../src/core/UV.js"></script>
+		<script type="text/javascript" src="../src/core/Geometry.js"></script>
+		<script type="text/javascript" src="../src/animation/AnimationHandler.js"></script>
+		<script type="text/javascript" src="../src/animation/Animation.js"></script>
+		<script type="text/javascript" src="../src/cameras/Camera.js"></script>
+		<script type="text/javascript" src="../src/cameras/QuakeCamera.js"></script>
+		<script type="text/javascript" src="../src/lights/Light.js"></script>
+		<script type="text/javascript" src="../src/lights/AmbientLight.js"></script>
+		<script type="text/javascript" src="../src/lights/DirectionalLight.js"></script>
+		<script type="text/javascript" src="../src/lights/PointLight.js"></script>
+		<script type="text/javascript" src="../src/materials/Material.js"></script>
+		<script type="text/javascript" src="../src/materials/Mappings.js"></script>
+		<script type="text/javascript" src="../src/materials/LineBasicMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/MeshBasicMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/MeshLambertMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/MeshPhongMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/MeshDepthMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/MeshNormalMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/MeshFaceMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/MeshShaderMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/ParticleBasicMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/ParticleCircleMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/ParticleDOMMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/Texture.js"></script>
+		<script type="text/javascript" src="../src/materials/RenderTarget.js"></script>
+		<script type="text/javascript" src="../src/materials/Uniforms.js"></script>
+		<script type="text/javascript" src="../src/objects/Particle.js"></script>
+		<script type="text/javascript" src="../src/objects/ParticleSystem.js"></script>
+		<script type="text/javascript" src="../src/objects/Line.js"></script>
+		<script type="text/javascript" src="../src/objects/Mesh.js"></script>
+		<script type="text/javascript" src="../src/objects/Bone.js"></script>
+		<script type="text/javascript" src="../src/objects/SkinnedMesh.js"></script>
+		<script type="text/javascript" src="../src/objects/Ribbon.js"></script>
+		<script type="text/javascript" src="../src/objects/Sound.js"></script>
+		<script type="text/javascript" src="../src/scenes/Scene.js"></script>
+		<script type="text/javascript" src="../src/scenes/Fog.js"></script>
+		<script type="text/javascript" src="../src/scenes/FogExp2.js"></script>
+		<script type="text/javascript" src="../src/renderers/Projector.js"></script>
+		<script type="text/javascript" src="../src/renderers/DOMRenderer.js"></script>
+		<script type="text/javascript" src="../src/renderers/CanvasRenderer.js"></script>
+		<script type="text/javascript" src="../src/renderers/SVGRenderer.js"></script>
+		<script type="text/javascript" src="../src/renderers/WebGLRenderer.js"></script>
+		<script type="text/javascript" src="../src/renderers/SoundRenderer.js"></script>
+		<script type="text/javascript" src="../src/renderers/renderables/RenderableObject.js"></script>
+		<script type="text/javascript" src="../src/renderers/renderables/RenderableFace3.js"></script>
+		<script type="text/javascript" src="../src/renderers/renderables/RenderableParticle.js"></script>
+		<script type="text/javascript" src="../src/renderers/renderables/RenderableLine.js"></script>
+		<script type="text/javascript" src="../src/extras/GeometryUtils.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/ShaderUtils.js"></script>
+		<script type="text/javascript" src="../src/extras/primitives/Cube.js"></script>
+		<script type="text/javascript" src="../src/extras/primitives/Cylinder.js"></script>
+		<script type="text/javascript" src="../src/extras/primitives/Plane.js"></script>
+		<script type="text/javascript" src="../src/extras/primitives/Sphere.js"></script>
+		<script type="text/javascript" src="../src/extras/primitives/Torus.js"></script>
+		<script type="text/javascript" src="../src/extras/primitives/Icosahedron.js"></script>
+		<script type="text/javascript" src="../src/extras/primitives/LathedObject.js"></script>
+		<script type="text/javascript" src="../src/extras/objects/MarchingCubes.js"></script>
+		<script type="text/javascript" src="../src/extras/io/Loader.js"></script>
+
+		<script type="text/javascript" src="js/Stats.js"></script>
+
+		<script type="text/javascript">
+
+			var statsEnabled = true;
+
+			var container, stats;
+
+			var camera, scene, renderer;
+
+			var geometry, group;
+
+			var mouseX = 0, mouseY = 0;
+
+			var windowHalfX = window.innerWidth / 2;
+			var windowHalfY = window.innerHeight / 2;
+
+			document.addEventListener( 'mousemove', onDocumentMouseMove, false );
+
+			init();
+			setInterval( loop, 1000 / 60 );
+
+			function init() {
+
+				container = document.createElement( 'div' );
+				document.body.appendChild( container );
+
+				camera = new THREE.Camera( 60, window.innerWidth / window.innerHeight, 1, 10000 );
+				camera.position.z = 500;
+
+				scene = new THREE.Scene();
+				scene.fog = new THREE.Fog( 0xffffff, 1, 10000 );
+
+				var geometry = new Cube( 100, 100, 100 );
+				var material = new THREE.MeshNormalMaterial();
+
+				group = new THREE.Object3D();
+
+				for ( var i = 0; i < 1000; i ++ ) {
+
+					var mesh = new THREE.Mesh( geometry, material );
+					mesh.position.x = Math.random() * 2000 - 1000;
+					mesh.position.y = Math.random() * 2000 - 1000;
+					mesh.position.z = Math.random() * 2000 - 1000;
+					mesh.rotation.x = Math.random() * 360 * ( Math.PI / 180 );
+					mesh.rotation.y = Math.random() * 360 * ( Math.PI / 180 );
+					mesh.updateMatrix();
+					mesh.autoUpdateMatrix = false;
+
+					group.addChild( mesh );
+
+				}
+
+				scene.addObject( group );
+
+				renderer = new THREE.WebGLRenderer();
+				renderer.setSize( window.innerWidth, window.innerHeight );
+				renderer.sortObjects = false;
+				container.appendChild( renderer.domElement );
+
+				if ( statsEnabled ) {
+
+					stats = new Stats();
+					stats.domElement.style.position = 'absolute';
+					stats.domElement.style.top = '0px';
+					stats.domElement.style.zIndex = 100;
+					container.appendChild( stats.domElement );
+
+				}
+
+			}
+
+			function onDocumentMouseMove(event) {
+
+				mouseX = ( event.clientX - windowHalfX ) * 10;
+				mouseY = ( event.clientY - windowHalfY ) * 10;
+
+			}
+
+			function loop() {
+
+				var rx = Math.sin( new Date().getTime() * 0.0007 ) * 0.5,
+				ry = Math.sin( new Date().getTime() * 0.0003 ) * 0.5,
+				rz = Math.sin( new Date().getTime() * 0.0002 ) * 0.5;
+
+				camera.position.x += ( mouseX - camera.position.x ) * .05;
+				camera.position.y += ( - mouseY - camera.position.y ) * .05;
+
+				group.rotation.x = rx;
+				group.rotation.y = ry;
+				group.rotation.z = rz;
+
+				renderer.render( scene, camera );
+
+				if ( statsEnabled ) stats.update();
+
+			}
+
+			function log( text ) {
+
+				var e = document.getElementById("log");
+				e.innerHTML = text + "<br/>" + e.innerHTML;
+
+			}
+
+		</script>
+
+	</body>
+</html>

+ 281 - 0
examples/webgl_geometry_hierarchy2.html

@@ -0,0 +1,281 @@
+<!DOCTYPE HTML>
+<html lang="en">
+	<head>
+		<title>three.js webgl - geometry hierarchy 2</title>
+		<meta charset="utf-8">
+		<style type="text/css">
+			body {
+				background:#fff;
+				padding:0;
+				margin:0;
+				font-weight: bold;
+				overflow:hidden;
+			}
+		</style>
+	</head>
+	<body>
+
+		<!-- <script type="text/javascript" src="../build/Three.js"></script> -->
+
+		<script type="text/javascript" src="../src/Three.js"></script>
+		<script type="text/javascript" src="../src/core/Color.js"></script>
+		<script type="text/javascript" src="../src/core/Vector2.js"></script>
+		<script type="text/javascript" src="../src/core/Vector3.js"></script>
+		<script type="text/javascript" src="../src/core/Vector4.js"></script>
+		<script type="text/javascript" src="../src/core/Ray.js"></script>
+		<script type="text/javascript" src="../src/core/Rectangle.js"></script>
+		<script type="text/javascript" src="../src/core/Matrix3.js"></script>
+		<script type="text/javascript" src="../src/core/Matrix4.js"></script>
+		<script type="text/javascript" src="../src/core/Object3D.js"></script>
+		<script type="text/javascript" src="../src/core/Quaternion.js"></script>
+		<script type="text/javascript" src="../src/core/Vertex.js"></script>
+		<script type="text/javascript" src="../src/core/Face3.js"></script>
+		<script type="text/javascript" src="../src/core/Face4.js"></script>
+		<script type="text/javascript" src="../src/core/UV.js"></script>
+		<script type="text/javascript" src="../src/core/Geometry.js"></script>
+		<script type="text/javascript" src="../src/animation/AnimationHandler.js"></script>
+		<script type="text/javascript" src="../src/animation/Animation.js"></script>
+		<script type="text/javascript" src="../src/cameras/Camera.js"></script>
+		<script type="text/javascript" src="../src/cameras/QuakeCamera.js"></script>
+		<script type="text/javascript" src="../src/lights/Light.js"></script>
+		<script type="text/javascript" src="../src/lights/AmbientLight.js"></script>
+		<script type="text/javascript" src="../src/lights/DirectionalLight.js"></script>
+		<script type="text/javascript" src="../src/lights/PointLight.js"></script>
+		<script type="text/javascript" src="../src/materials/Material.js"></script>
+		<script type="text/javascript" src="../src/materials/Mappings.js"></script>
+		<script type="text/javascript" src="../src/materials/LineBasicMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/MeshBasicMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/MeshLambertMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/MeshPhongMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/MeshDepthMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/MeshNormalMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/MeshFaceMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/MeshShaderMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/ParticleBasicMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/ParticleCircleMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/ParticleDOMMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/Texture.js"></script>
+		<script type="text/javascript" src="../src/materials/RenderTarget.js"></script>
+		<script type="text/javascript" src="../src/materials/Uniforms.js"></script>
+		<script type="text/javascript" src="../src/objects/Particle.js"></script>
+		<script type="text/javascript" src="../src/objects/ParticleSystem.js"></script>
+		<script type="text/javascript" src="../src/objects/Line.js"></script>
+		<script type="text/javascript" src="../src/objects/Mesh.js"></script>
+		<script type="text/javascript" src="../src/objects/Bone.js"></script>
+		<script type="text/javascript" src="../src/objects/SkinnedMesh.js"></script>
+		<script type="text/javascript" src="../src/objects/Ribbon.js"></script>
+		<script type="text/javascript" src="../src/objects/Sound.js"></script>
+		<script type="text/javascript" src="../src/scenes/Scene.js"></script>
+		<script type="text/javascript" src="../src/scenes/Fog.js"></script>
+		<script type="text/javascript" src="../src/scenes/FogExp2.js"></script>
+		<script type="text/javascript" src="../src/renderers/Projector.js"></script>
+		<script type="text/javascript" src="../src/renderers/DOMRenderer.js"></script>
+		<script type="text/javascript" src="../src/renderers/CanvasRenderer.js"></script>
+		<script type="text/javascript" src="../src/renderers/SVGRenderer.js"></script>
+		<script type="text/javascript" src="../src/renderers/WebGLRenderer.js"></script>
+		<script type="text/javascript" src="../src/renderers/SoundRenderer.js"></script>
+		<script type="text/javascript" src="../src/renderers/renderables/RenderableObject.js"></script>
+		<script type="text/javascript" src="../src/renderers/renderables/RenderableFace3.js"></script>
+		<script type="text/javascript" src="../src/renderers/renderables/RenderableParticle.js"></script>
+		<script type="text/javascript" src="../src/renderers/renderables/RenderableLine.js"></script>
+		<script type="text/javascript" src="../src/extras/GeometryUtils.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/ShaderUtils.js"></script>
+		<script type="text/javascript" src="../src/extras/primitives/Cube.js"></script>
+		<script type="text/javascript" src="../src/extras/primitives/Cylinder.js"></script>
+		<script type="text/javascript" src="../src/extras/primitives/Plane.js"></script>
+		<script type="text/javascript" src="../src/extras/primitives/Sphere.js"></script>
+		<script type="text/javascript" src="../src/extras/primitives/Torus.js"></script>
+		<script type="text/javascript" src="../src/extras/primitives/Icosahedron.js"></script>
+		<script type="text/javascript" src="../src/extras/primitives/LathedObject.js"></script>
+		<script type="text/javascript" src="../src/extras/objects/MarchingCubes.js"></script>
+		<script type="text/javascript" src="../src/extras/io/Loader.js"></script>
+
+		<script type="text/javascript" src="js/Stats.js"></script>
+
+		<script type="text/javascript">
+
+			var statsEnabled = true;
+
+			var container, stats;
+
+			var camera, scene, renderer;
+
+			var geometry, objects;
+
+			var mouseX = 0, mouseY = 0;
+
+			var windowHalfX = window.innerWidth / 2;
+			var windowHalfY = window.innerHeight / 2;
+
+			document.addEventListener( 'mousemove', onDocumentMouseMove, false );
+
+			init();
+			setInterval( loop, 1000 / 60 );
+
+			function init() {
+
+				container = document.createElement( 'div' );
+				document.body.appendChild( container );
+
+				camera = new THREE.Camera( 60, window.innerWidth / window.innerHeight, 1, 10000 );
+				camera.position.z = 500;
+
+				scene = new THREE.Scene();
+				scene.fog = new THREE.Fog( 0xffffff, 1, 10000 );
+
+				var geometry = new Cube( 100, 100, 100 );
+				var material = new THREE.MeshNormalMaterial();
+
+				var mesh = new THREE.Mesh( geometry, material );
+				mesh.position.x = 1000;
+
+				objects = [];
+
+				objects.push( mesh );
+
+				var amount = 200, child, object = mesh;
+
+				for ( var i = 0; i < amount; i ++ ) {
+
+					child = new THREE.Mesh( geometry, material );
+					child.position.x = 100;
+
+					object.addChild( child );
+					object = child;
+
+					objects.push( child );
+
+				}
+
+				object = mesh;
+
+				for ( var i = 0; i < amount; i ++ ) {
+
+					child = new THREE.Mesh( geometry, material );
+					child.position.x = - 100;
+
+					object.addChild( child );
+					object = child;
+
+					objects.push( child );
+
+				}
+
+				object = mesh;
+
+				for ( var i = 0; i < amount; i ++ ) {
+
+					child = new THREE.Mesh( geometry, material );
+					child.position.y = - 100;
+
+					object.addChild( child );
+					object = child;
+
+					objects.push( child );
+
+				}
+
+				object = mesh;
+
+				for ( var i = 0; i < amount; i ++ ) {
+
+					child = new THREE.Mesh( geometry, material );
+					child.position.y = 100;
+
+					object.addChild( child );
+					object = child;
+
+					objects.push( child );
+
+				}
+
+				object = mesh;
+
+				for ( var i = 0; i < amount; i ++ ) {
+
+					child = new THREE.Mesh( geometry, material );
+					child.position.z = - 100;
+
+					object.addChild( child );
+					object = child;
+
+					objects.push( child );
+
+				}
+
+				object = mesh;
+
+				for ( var i = 0; i < amount; i ++ ) {
+
+					child = new THREE.Mesh( geometry, material );
+					child.position.z = 100;
+
+					object.addChild( child );
+					object = child;
+
+					objects.push( child );
+
+				}
+
+				scene.addObject( mesh );
+
+				renderer = new THREE.WebGLRenderer();
+				renderer.setSize( window.innerWidth, window.innerHeight );
+				renderer.sortObjects = false;
+				container.appendChild( renderer.domElement );
+
+				if ( statsEnabled ) {
+
+					stats = new Stats();
+					stats.domElement.style.position = 'absolute';
+					stats.domElement.style.top = '0px';
+					stats.domElement.style.zIndex = 100;
+					container.appendChild( stats.domElement );
+
+				}
+
+			}
+
+			function onDocumentMouseMove(event) {
+
+				mouseX = ( event.clientX - windowHalfX ) * 10;
+				mouseY = ( event.clientY - windowHalfY ) * 10;
+
+			}
+
+			function loop() {
+
+				var rx = Math.sin( new Date().getTime() * 0.0007 ) * 0.2,
+				ry = Math.sin( new Date().getTime() * 0.0003 ) * 0.1,
+				rz = Math.sin( new Date().getTime() * 0.0002 ) * 0.1;
+
+				camera.position.x += ( mouseX - camera.position.x ) * .05;
+				camera.position.y += ( - mouseY - camera.position.y ) * .05;
+
+				for ( var i = 0, l = objects.length; i < l; i ++ ) {
+
+					objects[ i ].rotation.x = rx;
+					objects[ i ].rotation.y = ry;
+					objects[ i ].rotation.z = rz;
+
+				}
+
+				renderer.render( scene, camera );
+
+				if ( statsEnabled ) stats.update();
+
+			}
+
+			function log( text ) {
+
+				var e = document.getElementById("log");
+				e.innerHTML = text + "<br/>" + e.innerHTML;
+
+			}
+
+		</script>
+
+	</body>
+</html>

+ 64 - 60
examples/geometry_large_mesh.html → examples/webgl_geometry_large_mesh.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - geometry - large mesh - webgl</title>
+		<title>three.js webgl - geometry - large mesh</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -22,7 +22,7 @@
 			.inactive { background:#999; color:#eee }
 		</style>
 	</head>
-	
+
 	<body>
 		<div id="d">
 			<h1>Large mesh test</h1>
@@ -30,25 +30,23 @@
 			<span id="rcanvas" class="button inactive">2d canvas renderer</span>
 			<span id="rwebgl" class="button">WebGL renderer</span>
 			<br/>
-			
-			<p>Lucy model from <a href="http://graphics.stanford.edu/data/3Dscanrep/">Stanford 3d scanning repository</a> 
+
+			<p>Lucy model from <a href="http://graphics.stanford.edu/data/3Dscanrep/">Stanford 3d scanning repository</a>
 			(decimated with <a href="http://meshlab.sourceforge.net/">Meshlab</a>).
-			
+
 			<p>Please be patient while the mesh is loading. It may take a while, it's 2MB file.
-			
+
 			<br/>
 			<p>Best viewed in Chrome 8/9 or Firefox 4 using WebGL renderer.
 			<p>Canvas renderer is very slow for this demo and only diffuse material works there.
 			<p>Use the flag --allow-file-access-from-files if working localy in Chrome.
 		</div>
-		
+
 		<pre id="log"></pre>
 
 		<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="js/RequestAnimationFrame.js"></script>
 		<script type="text/javascript" src="js/Stats.js"></script>
 
 		<script type="text/javascript">
@@ -65,37 +63,34 @@
 			var canvasRenderer, webglRenderer;
 
 			var loader;
-			
+
 			var mesh, zmesh, lightMesh;
-			
+
 			var directionalLight, pointLight;
-			
+
 			var mouseX = 0;
 			var mouseY = 0;
 
-			var windowHalfX = window.innerWidth >> 1;
-			var windowHalfY = window.innerHeight >> 1;
+			var windowHalfX = window.innerWidth / 2;
+			var windowHalfY = window.innerHeight / 2;
 
 			var render_canvas = 1, render_gl = 1;
 			var has_gl = 0;
-			
+
 			var bcanvas = document.getElementById("rcanvas");
 			var bwebgl = document.getElementById("rwebgl");
-			
+
 			document.addEventListener('mousemove', onDocumentMouseMove, false);
 
 			init();
-			
-			loop();
-			
+			animate();
+
 			render_canvas = !has_gl;
 			bwebgl.style.display = has_gl ? "inline" : "none";
 			bcanvas.className = render_canvas ? "button" : "button inactive";
-			
-			setInterval(loop, 1000/60);
-			
+
 			function addMesh( geometry, scale, x, y, z, rx, ry, rz, material ) {
-				
+
 				mesh = new THREE.Mesh( geometry, material );
 				mesh.scale.x = mesh.scale.y = mesh.scale.z = scale;
 				mesh.position.x = x;
@@ -107,9 +102,9 @@
 				mesh.overdraw = true;
 				mesh.updateMatrix();
 				scene.addObject(mesh);
-				
+
 			}
-			
+
 			function init() {
 
 				container = document.createElement('div');
@@ -147,7 +142,7 @@
 				lightMesh.overdraw = true;
 				lightMesh.updateMatrix();
 				scene.addObject(lightMesh);
-				
+
 
 				if ( render_gl ) {
 					try {
@@ -160,7 +155,7 @@
 					catch (e) {
 					}
 				}
-				
+
 				if( render_canvas ) {
 					canvasRenderer = new THREE.CanvasRenderer();
 					canvasRenderer.setSize( SCREEN_WIDTH, SCREEN_HEIGHT );
@@ -173,38 +168,38 @@
 				stats.domElement.style.top = '0px';
 				stats.domElement.style.zIndex = 100;
 				container.appendChild( stats.domElement );
-				
+
 				bcanvas.addEventListener("click", toggleCanvas, false);
 				bwebgl.addEventListener("click", toggleWebGL, false);
-				
+
 				loader = new THREE.Loader( true );
 				document.body.appendChild( loader.statusDomElement );
-				
+
 				var s = (new Date).getTime(),
 					callback = function( geometry ) { createScene( geometry, s ) };
-				
+
 				//loader.loadAscii( { model: 'obj/lucy/Lucy100k_slim.js', callback: callback } );
 				loader.loadBinary( { model: 'obj/lucy/Lucy100k_bin.js', callback: callback } );
 
 			}
-			
-			
+
+
 			function createScene( geometry, start ) {
-				
+
 				addMesh( geometry, 0.75, 900, 0, 0, 0,0,0, new THREE.MeshPhongMaterial( { ambient: 0x030303, color: 0x030303, specular: 0x990000, shininess: 30 } ) );
 				addMesh( geometry, 0.75, 300, 0, 0, 0,0,0, new THREE.MeshFaceMaterial( ) );
 				addMesh( geometry, 0.75, -300, 0, 0, 0,0,0, new THREE.MeshPhongMaterial( { ambient: 0x030303, color: 0x111111, specular: 0xffaa00, shininess: 10 } ) );
 				addMesh( geometry, 0.75, -900, 0, 0, 0,0,0, new THREE.MeshPhongMaterial( { ambient: 0x030303, color: 0x555555, specular: 0x666666, shininess: 10 } ) );
-				
+
 				loader.statusDomElement.style.display = "none";
-				
+
 				log( "geometry.vertices: " + geometry.vertices.length );
 				log( "geometry.faces: " + geometry.faces.length );
 
 				log( "model loaded and created in " + ((new Date).getTime() - start) + " ms" );
-				
+
 			}
-			
+
 			function onDocumentMouseMove(event) {
 
 				mouseX = ( event.clientX - windowHalfX );
@@ -212,63 +207,72 @@
 
 			}
 
+			//
+
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+				stats.update();
+
+			}
+
 			var r = 0;
-			
-			function loop() {
+
+			function render() {
 
 				camera.position.x += ( mouseX - camera.position.x ) * .05;
 				camera.position.y += ( - mouseY - camera.position.y ) * .05;
 				camera.updateMatrix();
-				
+
 				lightMesh.position.x = 700*Math.cos(r);
 				lightMesh.position.z = 700*Math.sin(r);
 				lightMesh.updateMatrix();
 
 				r += 0.01;
-				
-				
+
+
 				if ( render_canvas ) canvasRenderer.render( scene, camera );
 				if ( render_gl && has_gl ) webglRenderer.render( scene, camera );
 
-				stats.update();
-
 			}
 
 			function log(text) {
-			
+
 				var e = document.getElementById("log");
 				e.innerHTML = text + "<br/>" + e.innerHTML;
-				
+
 			}
-			
+
 			function toggleCanvas() {
-			
+
 				render_canvas = !render_canvas;
 				bcanvas.className = render_canvas ? "button" : "button inactive";
-				
+
 				render_gl = !render_canvas;
 				bwebgl.className = render_gl ? "button" : "button inactive";
-				
+
 				if( has_gl )
 					webglRenderer.domElement.style.display = render_gl ? "block" : "none";
-				
+
 				canvasRenderer.domElement.style.display = render_canvas ? "block" : "none";
-				
+
 			}
-			
+
 			function toggleWebGL() {
-			
+
 				render_gl = !render_gl;
 				bwebgl.className = render_gl ? "button" : "button inactive";
-				
+
 				render_canvas = !render_gl;
 				bcanvas.className = render_canvas ? "button" : "button inactive";
-				
+
 				if( has_gl )
 					webglRenderer.domElement.style.display = render_gl ? "block" : "none";
-					
+
 				canvasRenderer.domElement.style.display = render_canvas ? "block" : "none";
-				
+
 			}
 		</script>
 

+ 25 - 116
examples/geometry_minecraft.html → examples/webgl_geometry_minecraft.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - geometry - minecraft - webgl</title>
+		<title>three.js webgl - geometry - minecraft</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -40,21 +40,21 @@
 		<div id="container"><br /><br /><br /><br /><br />Generating world...</div>
 		<div id="info"><a href="http://github.com/mrdoob/three.js" target="_blank">three.js</a> - <a href="http://www.minecraft.net/" target="_blank">minecraft</a> demo. featuring <a href="http://painterlypack.net/" target="_blank">painterly pack</a><br />(left click: forward, right click: backward)</div>
 
-		<script type="text/javascript" src="js/Stats.js"></script>
+		<script type="text/javascript" src="../build/Three.js"></script>
+
 		<script type="text/javascript" src="js/ImprovedNoise.js"></script>
 
-		<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" src="js/Detector.js"></script>
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
+		<script type="text/javascript" src="js/Stats.js"></script>
 
 		<script type="text/javascript">
 
-			if ( ! THREE.Detector.webgl ) {
-				
-				THREE.Detector.addGetWebGLMessage();
+			if ( ! Detector.webgl ) {
+
+				Detector.addGetWebGLMessage();
 				document.getElementById( 'container' ).innerHTML = "";
-				
+
 			}
 
 			var container, stats;
@@ -67,25 +67,17 @@
 			worldHalfWidth = worldWidth / 2, worldHalfDepth = worldDepth / 2,
 			data = generateHeight( worldWidth, worldDepth );
 
-			var mouseX = 0, mouseY = 0,
-			lat = 0, lon = 0, phy = 0, theta = 0;
-
-			var direction = new THREE.Vector3(),
-			moveForward = false, moveBackward = false;
-
-			var windowHalfX = window.innerWidth / 2;
-			var windowHalfY = window.innerHeight / 2;
-
 
 			init();
-			setInterval( loop, 1000 / 60 );
-
+			animate();
 
 			function init() {
 
 				container = document.getElementById( 'container' );
+				
+				camera = new THREE.QuakeCamera( { fov: 60, aspect: window.innerWidth / window.innerHeight, near: 1, far: 20000,
+												   movement_speed: 15, look_speed: 0.005, nofly: false, look_vertical: true } );
 
-				camera = new THREE.Camera( 60, window.innerWidth / window.innerHeight, 1, 20000 );
 				camera.target.position.z = - 100;
 
 				scene = new THREE.Scene();
@@ -181,34 +173,18 @@
 				stats.domElement.style.top = '0px';
 				container.appendChild( stats.domElement );
 
-				document.addEventListener( 'mousedown', onDocumentMouseDown, false );
-				document.addEventListener( 'mouseup', onDocumentMouseUp, false );
-				document.addEventListener( 'mousemove', onDocumentMouseMove, false );
-				document.addEventListener( 'contextmenu', function ( event ) { event.preventDefault(); }, false );
-
-				document.addEventListener( 'keydown', onDocumentKeyDown, false );
-				document.addEventListener( 'keyup', onDocumentKeyUp, false );
-
 			}
 
-			function generateAO( image, sides ) {
-
-				var c = document.createElement('canvas');
-				c.width = image.width;
-				c.height = image.height;
-				c.getContext( "2d" ).drawImage( image, 0, 0 );
-
-				return c;
-
-			}
 
 			function loadTexture( path ) {
 
 				var image = new Image();
-				image.onload = function () { this.loaded = true; };
+				image.onload = function () { texture.needsUpdate = true; };
 				image.src = path;
 
-				return new THREE.MeshLambertMaterial( { map: new THREE.Texture( image, new THREE.UVMapping(), THREE.ClampToEdgeWrapping, THREE.ClampToEdgeWrapping, THREE.NearestFilter, THREE.LinearMipMapLinearFilter ) } );
+				var texture  = new THREE.Texture( image, new THREE.UVMapping(), THREE.ClampToEdgeWrapping, THREE.ClampToEdgeWrapping, THREE.NearestFilter, THREE.LinearMipMapLinearFilter );
+				
+				return new THREE.MeshLambertMaterial( { map: texture } );
 
 			}
 
@@ -243,87 +219,20 @@
 
 			}
 
-			function onDocumentMouseDown( event ) {
-
-				event.preventDefault();
-				event.stopPropagation();
-
-				switch ( event.button ) {
-
-					case 0: moveForward = true; break;
-					case 2: moveBackward = true; break;
-
-				}
-
-			}
-
-			function onDocumentMouseUp( event ) {
+			//
 
-				event.preventDefault();
-				event.stopPropagation();
+			function animate() {
 
-				switch ( event.button ) {
+				requestAnimationFrame( animate );
 
-					case 0: moveForward = false; break;
-					case 2: moveBackward = false; break;
-
-				}
-
-			}
-
-			function onDocumentMouseMove(event) {
-
-				mouseX = event.clientX - windowHalfX;
-				mouseY = event.clientY - windowHalfY;
-
-			}
-
-			function onDocumentKeyDown( event ) {
-
-				switch( event.keyCode ) {
-
-					case 38: /*↑*/ moveForward = true; break;
-					case 40: /*↓*/ moveBackward = true; break;
-
-					case 87: /*W*/ moveForward = true; break;
-					case 83: /*S*/ moveBackward = true; break;
-
-				}
-
-			}
-
-			function onDocumentKeyUp( event ) {
-
-				switch( event.keyCode ) {
-
-					case 38: /*↑*/ moveForward = false; break;
-					case 40: /*↓*/ moveBackward = false; break;
-
-					case 87: /*W*/ moveForward = false; break;
-					case 83: /*S*/ moveBackward = false; break;
-
-				}
+				render();
+				stats.update();
 
 			}
 
-			function loop() {
-
-				if ( moveForward ) camera.translateZ( - 15 );
-				if ( moveBackward ) camera.translateZ( 15 );
-
-				lon += mouseX * 0.005;
-				lat -= mouseY * 0.005;
+			function render() {
 
-				lat = Math.max( - 85, Math.min( 85, lat ) );
-				phi = ( 90 - lat ) * Math.PI / 180;
-				theta = lon * Math.PI / 180;
-
-				camera.target.position.x = 100 * Math.sin( phi ) * Math.cos( theta ) + camera.position.x;
-				camera.target.position.y = 100 * Math.cos( phi ) + camera.position.y;
-				camera.target.position.z = 100 * Math.sin( phi ) * Math.sin( theta ) + camera.position.z;
-
-				renderer.render(scene, camera);
-				stats.update();
+				renderer.render( scene, camera );
 
 			}
 

+ 38 - 135
examples/geometry_minecraft_ao.html → examples/webgl_geometry_minecraft_ao.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - geometry - minecraft - ao - webgl</title>
+		<title>three.js webgl - geometry - minecraft - ao</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -47,69 +47,54 @@
 			<button id="baot">texture + ao</button>
 		</div>
 
-		<script type="text/javascript" src="js/Stats.js"></script>
+		<script type="text/javascript" src="../build/Three.js"></script>
+
 		<script type="text/javascript" src="js/ImprovedNoise.js"></script>
 
-		<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" src="js/Detector.js"></script>
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
+		<script type="text/javascript" src="js/Stats.js"></script>
 
 		<script type="text/javascript">
 
-			if ( ! THREE.Detector.webgl ) {
-				
-				THREE.Detector.addGetWebGLMessage();
+			if ( ! Detector.webgl ) {
+
+				Detector.addGetWebGLMessage();
 				document.getElementById( 'container' ).innerHTML = "";
-				
+
 			}
 
 			var fogExp2 = true;
-			
+
 			var container, stats;
 
 			var camera, scene, renderer;
 
 			var mesh;
+			
+			var mat;
 
 			var worldWidth = 128, worldDepth = 128,
 			worldHalfWidth = worldWidth / 2, worldHalfDepth = worldDepth / 2,
 			data = generateHeight( worldWidth, worldDepth );
 
-			var mouseX = 0, mouseY = 0,
-			lat = 0, lon = 0, phy = 0, theta = 0;
-
-			var direction = new THREE.Vector3(),
-			moveForward = false, moveBackward = false, moveLeft = false, moveRight = false;
-
-			var windowHalfX = window.innerWidth / 2;
-			var windowHalfY = window.innerHeight / 2;
-
-
 			init();
-			setInterval( loop, 1000 / 60 );
-
+			animate();
 
 			function init() {
 
 				container = document.getElementById( 'container' );
 
-				if( fogExp2 )
-					camera = new THREE.Camera( 60, window.innerWidth / window.innerHeight, 1, 20000 );
-				else
-					camera = new THREE.Camera( 60, window.innerWidth / window.innerHeight, 1, 7500 );
-					
+				camera = new THREE.QuakeCamera( { fov: 60, aspect: window.innerWidth / window.innerHeight, near: 1, far: 20000,
+												  movement_speed: 15, look_speed: 0.005, nofly: false, look_vertical: true } );
+
 				camera.target.position.z = - 100;
 
 				camera.position.y = getY( worldHalfWidth, worldHalfDepth ) * 100 + 100;
 				camera.target.position.y = camera.position.y;
 
 				scene = new THREE.Scene();
-				
-				if( fogExp2 )
-					scene.fog = new THREE.FogExp2( 0xffffff, 0.00025 );
-				else
-					scene.fog = new THREE.Fog( 0xffffff, - 1000, 7500 );
+				scene.fog = new THREE.FogExp2( 0xffffff, 0.00025 );
 
 				var debug_texture = false,
 					debug_numbers = false,
@@ -476,14 +461,6 @@
 				stats.domElement.style.top = '0px';
 				container.appendChild( stats.domElement );
 
-				document.addEventListener( 'mousedown', onDocumentMouseDown, false );
-				document.addEventListener( 'mouseup', onDocumentMouseUp, false );
-				document.addEventListener( 'mousemove', onDocumentMouseMove, false );
-				document.addEventListener( 'contextmenu', function ( event ) { event.preventDefault(); }, false );
-
-				document.addEventListener( 'keydown', onDocumentKeyDown, false );
-				document.addEventListener( 'keyup', onDocumentKeyUp, false );
-
 				document.getElementById( "bao" ).addEventListener( "click",  function() { mat.map = m_ao.map; }, false );
 				document.getElementById( "baot" ).addEventListener( "click", function() { mat.map = m_aot.map; }, false );
 				document.getElementById( "bt" ).addEventListener( "click",   function() { mat.map = m_t.map; }, false );
@@ -503,6 +480,8 @@
 
 				canvas.width = canvas.height = size;
 
+				var texture = new THREE.Texture( canvas, new THREE.UVMapping(), THREE.ClampToEdgeWrapping, THREE.ClampToEdgeWrapping, THREE.NearestFilter, THREE.LinearMipMapLinearFilter );
+
 				function generateTexture() {
 
 					if( count == 3 ) {
@@ -517,13 +496,13 @@
 
 						}
 
-						canvas.loaded = true;
+						texture.needsUpdate = true;
 
 					}
 
 				}
 
-				return new THREE.MeshLambertMaterial( { map: new THREE.Texture( canvas, new THREE.UVMapping(), THREE.ClampToEdgeWrapping, THREE.ClampToEdgeWrapping, THREE.NearestFilter, THREE.LinearMipMapLinearFilter ) } );
+				return new THREE.MeshLambertMaterial( { map: texture } );
 
 			}
 
@@ -540,6 +519,8 @@
 
 				canvas.width = canvas.height = size;
 
+				var texture = new THREE.Texture( canvas, new THREE.UVMapping(), THREE.ClampToEdgeWrapping, THREE.ClampToEdgeWrapping, THREE.NearestFilter, THREE.LinearMipMapLinearFilter );
+				
 				function generateTexture() {
 
 					if( count == 3 ) {
@@ -558,13 +539,13 @@
 
 						}
 
-						canvas.loaded = true;
+						texture.needsUpdate = true;
 
 					}
 
 				}
 
-				return new THREE.MeshLambertMaterial( { map: new THREE.Texture( canvas, new THREE.UVMapping(), THREE.ClampToEdgeWrapping, THREE.ClampToEdgeWrapping, THREE.NearestFilter, THREE.LinearMipMapLinearFilter ) } );
+				return new THREE.MeshLambertMaterial( { map: texture } );
 
 			}
 			function generateMegamaterialDebug() {
@@ -594,9 +575,10 @@
 
 				}
 
-				canvas.loaded = true;
-
-				return new THREE.MeshLambertMaterial( { map: new THREE.Texture( canvas, new THREE.UVMapping(), THREE.ClampToEdgeWrapping, THREE.ClampToEdgeWrapping, THREE.NearestFilter, THREE.LinearMipMapLinearFilter ) } );
+				var texture = new THREE.Texture( canvas, new THREE.UVMapping(), THREE.ClampToEdgeWrapping, THREE.ClampToEdgeWrapping, THREE.NearestFilter, THREE.LinearMipMapLinearFilter );
+				texture.needsUpdate = true;
+				
+				return new THREE.MeshLambertMaterial( { map: texture } );
 
 			}
 
@@ -769,7 +751,7 @@
 
 				var image = new Image();
 
-				image.onload = function () { this.loaded = true; callback(); };
+				image.onload = function () { callback(); };
 				image.src = path;
 
 				return image;
@@ -806,99 +788,20 @@
 
 			}
 
-			function onDocumentMouseDown( event ) {
-
-				event.preventDefault();
-				event.stopPropagation();
-
-				switch ( event.button ) {
-
-					case 0: moveForward = true; break;
-					case 2: moveBackward = true; break;
-
-				}
-
-			}
+			//
 
-			function onDocumentMouseUp( event ) {
+			function animate() {
 
-				event.preventDefault();
-				event.stopPropagation();
+				requestAnimationFrame( animate );
 
-				switch ( event.button ) {
-
-					case 0: moveForward = false; break;
-					case 2: moveBackward = false; break;
-
-				}
-
-			}
-
-			function onDocumentMouseMove(event) {
-
-				mouseX = event.clientX - windowHalfX;
-				mouseY = event.clientY - windowHalfY;
-
-			}
-
-			function onDocumentKeyDown( event ) {
-
-				switch( event.keyCode ) {
-
-					case 38: /*up*/
-					case 87: /*W*/ moveForward = true; break;
-
-					case 37: /*left*/
-					case 65: /*A*/ moveLeft = true; break;
-
-					case 40: /*down*/
-					case 83: /*S*/ moveBackward = true; break;
-
-					case 39: /*right*/
-					case 68: /*D*/ moveRight = true; break;
-				}
-
-			}
-
-			function onDocumentKeyUp( event ) {
-
-				switch( event.keyCode ) {
-
-					case 38: /*up*/
-					case 87: /*W*/ moveForward = false; break;
-
-					case 37: /*left*/
-					case 65: /*A*/ moveLeft = false; break;
-
-					case 40: /*down*/
-					case 83: /*S*/ moveBackward = false; break;
-
-					case 39: /*right*/
-					case 68: /*D*/ moveRight = false; break;
-				}
+				render();
+				stats.update();
 
 			}
 
-			function loop() {
-
-				if ( moveForward )  camera.translateZ( - 15 );
-				if ( moveBackward ) camera.translateZ( 15 );
-				if ( moveLeft )     camera.translateX( - 15 );
-				if ( moveRight )    camera.translateX( 15 );
-
-				lon += mouseX * 0.005;
-				lat -= mouseY * 0.005;
+			function render() {
 
-				lat = Math.max( - 85, Math.min( 85, lat ) );
-				phi = ( 90 - lat ) * Math.PI / 180;
-				theta = lon * Math.PI / 180;
-
-				camera.target.position.x = 100 * Math.sin( phi ) * Math.cos( theta ) + camera.position.x;
-				camera.target.position.y = 100 * Math.cos( phi ) + camera.position.y;
-				camera.target.position.z = 100 * Math.sin( phi ) * Math.sin( theta ) + camera.position.z;
-
-				renderer.render(scene, camera);
-				stats.update();
+				renderer.render( scene, camera );
 
 			}
 

+ 26 - 77
examples/geometry_terrain_gl.html → examples/webgl_geometry_terrain.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - geometry - terrain - webgl</title>
+		<title>three.js webgl - geometry - terrain</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -30,23 +30,24 @@
 	</head>
 	<body>
 
-		<div id="container"><br /><br /><br /><br /><br />Generating world...</div> 
-		<div id="info"><a href="http://github.com/mrdoob/three.js" target="_blank">three.js</a> - webgl terrain demo<br />(left click: forward, right click: backward)</div> 
+		<div id="container"><br /><br /><br /><br /><br />Generating world...</div>
+		<div id="info"><a href="http://github.com/mrdoob/three.js" target="_blank">three.js</a> - webgl terrain demo<br />(left click: forward, right click: backward)</div>
+
+		<script type="text/javascript" src="../build/Three.js"></script>
 
-		<script type="text/javascript" src="js/Stats.js"></script>
 		<script type="text/javascript" src="js/ImprovedNoise.js"></script>
 
-		<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" src="js/Detector.js"></script>
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
+		<script type="text/javascript" src="js/Stats.js"></script>
+
 		<script type="text/javascript">
 
-			if ( ! THREE.Detector.webgl ) {
-				
-				THREE.Detector.addGetWebGLMessage();
+			if ( ! Detector.webgl ) {
+
+				Detector.addGetWebGLMessage();
 				document.getElementById( 'container' ).innerHTML = "";
-				
+
 			}
 
 			var container, stats;
@@ -58,25 +59,17 @@
 			var worldWidth = 256, worldDepth = 256,
 			worldHalfWidth = worldWidth / 2, worldHalfDepth = worldDepth / 2;
 
-			var mouseX = 0, mouseY = 0,
-			lat = 0, lon = 0, phy = 0, theta = 0;
-
-			var direction = new THREE.Vector3(),
-			moveForward = false, moveBackward = false;
-
-			var windowHalfX = window.innerWidth / 2;
-			var windowHalfY = window.innerHeight / 2;
-
 
 			init();
-			setInterval( loop, 1000 / 60 );
-
+			animate();
 
 			function init() {
 
 				container = document.getElementById( 'container' );
 
-				camera = new THREE.Camera( 60, window.innerWidth / window.innerHeight, 1, 20000 );
+				camera = new THREE.QuakeCamera( { fov: 60, aspect: window.innerWidth / window.innerHeight, near: 1, far: 20000,
+												  movement_speed: 15, look_speed: 0.004, nofly: false, look_vertical: true } );
+
 				camera.target.position.z = - 100;
 
 				scene = new THREE.Scene();
@@ -95,7 +88,8 @@
 				}
 
 				texture = new THREE.Texture( generateTexture( data, worldWidth, worldDepth ), new THREE.UVMapping(), THREE.ClampToEdgeWrapping, THREE.ClampToEdgeWrapping );
-
+				texture.needsUpdate = true;
+				
 				mesh = new THREE.Mesh( geometry, new THREE.MeshBasicMaterial( { map: texture } ) );
 				mesh.rotation.x = - 90 * Math.PI / 180;
 				scene.addObject( mesh );
@@ -112,11 +106,6 @@
 				stats.domElement.style.top = '0px';
 				container.appendChild( stats.domElement );
 
-				document.addEventListener( 'mousedown', onDocumentMouseDown, false );
-				document.addEventListener( 'mouseup', onDocumentMouseUp, false );
-				document.addEventListener( 'mousemove', onDocumentMouseMove, false );
-				document.addEventListener( 'contextmenu', function ( event ) { event.preventDefault(); }, false );
-
 			}
 
 			function generateHeight( width, height ) {
@@ -190,7 +179,6 @@
 				canvasScaled = document.createElement( 'canvas' );
 				canvasScaled.width = width * 4;
 				canvasScaled.height = height * 4;
-				canvasScaled.loaded = true;
 
 				context = canvasScaled.getContext( '2d' );
 				context.scale( 4, 4 );
@@ -215,59 +203,20 @@
 
 			}
 
-			function onDocumentMouseDown( event ) {
-
-				event.preventDefault();
-				event.stopPropagation();
-
-				switch ( event.button ) {
-
-					case 0: moveForward = true; break;
-					case 2: moveBackward = true; break;
-
-				}
-
-			}
-
-			function onDocumentMouseUp( event ) {
-
-				event.preventDefault();
-				event.stopPropagation();
+			//
 
-				switch ( event.button ) {
+			function animate() {
 
-					case 0: moveForward = false; break;
-					case 2: moveBackward = false; break;
-
-				}
+				requestAnimationFrame( animate );
 
-			}
-
-			function onDocumentMouseMove(event) {
-
-				mouseX = event.clientX - windowHalfX;
-				mouseY = event.clientY - windowHalfY;
+				render();
+				stats.update();
 
 			}
 
-			function loop() {
-
-				if ( moveForward ) camera.translateZ( - 15 );
-				if ( moveBackward ) camera.translateZ( 15 );
+			function render() {
 
-				lon += mouseX * 0.004;
-				lat -= mouseY * 0.004;
-
-				lat = Math.max( - 85, Math.min( 85, lat ) );
-				phi = ( 90 - lat ) * Math.PI / 180;
-				theta = lon * Math.PI / 180;
-
-				camera.target.position.x = 100 * Math.sin( phi ) * Math.cos( theta ) + camera.position.x;
-				camera.target.position.y = 100 * Math.cos( phi ) + camera.position.y;
-				camera.target.position.z = 100 * Math.sin( phi ) * Math.sin( theta ) + camera.position.z;
-
-				renderer.render(scene, camera);
-				stats.update();
+				renderer.render( scene, camera );
 
 			}
 

+ 25 - 77
examples/geometry_terrain_gl2.html → examples/webgl_geometry_terrain2.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - geometry - terrain 2 - webgl</title>
+		<title>three.js webgl - geometry - terrain 2</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -30,24 +30,25 @@
 	</head>
 	<body>
 
-		<div id="container"><br /><br /><br /><br /><br />Generating world...</div> 
-		<div id="info"><a href="http://github.com/mrdoob/three.js" target="_blank">three.js</a> - webgl terrain demo<br />(left click: forward, right click: backward)</div> 
+		<div id="container"><br /><br /><br /><br /><br />Generating world...</div>
+		<div id="info"><a href="http://github.com/mrdoob/three.js" target="_blank">three.js</a> - webgl terrain demo<br />(left click: forward, right click: backward)</div>
+
+		<script type="text/javascript" src="../build/Three.js"></script>
 
-		<script type="text/javascript" src="js/Stats.js"></script>
 		<script type="text/javascript" src="js/PRNG.js"></script>
 		<script type="text/javascript" src="js/SimplexNoise.js"></script>
 
-		<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" src="js/Detector.js"></script>
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
+		<script type="text/javascript" src="js/Stats.js"></script>
 
 		<script type="text/javascript">
 
-			if ( ! THREE.Detector.webgl ) {
-				
-				THREE.Detector.addGetWebGLMessage();
+			if ( ! Detector.webgl ) {
+
+				Detector.addGetWebGLMessage();
 				document.getElementById( 'container' ).innerHTML = "";
-				
+
 			}
 
 			var container, stats;
@@ -59,25 +60,16 @@
 			var worldWidth = 256, worldDepth = 256,
 			worldHalfWidth = worldWidth / 2, worldHalfDepth = worldDepth / 2;
 
-			var mouseX = 0, mouseY = 0,
-			lat = 0, lon = 0, phy = 0, theta = 0;
-
-			var direction = new THREE.Vector3(),
-			moveForward = false, moveBackward = false;
-
-			var windowHalfX = window.innerWidth / 2;
-			var windowHalfY = window.innerHeight / 2;
-
-
 			init();
-			setInterval( loop, 1000 / 60 );
-
+			animate();
 
 			function init() {
 
 				container = document.getElementById( 'container' );
 
-				camera = new THREE.Camera( 60, window.innerWidth / window.innerHeight, 1, 20000 );
+				camera = new THREE.QuakeCamera( { fov: 60, aspect: window.innerWidth / window.innerHeight, near: 1, far: 20000,
+												  movement_speed: 10, look_speed: 0.004, nofly: false, look_vertical: true } );
+
 				camera.target.position.z = - 100;
 
 				scene = new THREE.Scene();
@@ -96,7 +88,8 @@
 				}
 
 				texture = new THREE.Texture( generateTexture( data, worldWidth, worldDepth ), new THREE.UVMapping(), THREE.ClampToEdgeWrapping, THREE.ClampToEdgeWrapping );
-
+				texture.needsUpdate = true;
+				
 				mesh = new THREE.Mesh( geometry, new THREE.MeshBasicMaterial( { map: texture } ) );
 				mesh.rotation.x = - 90 * Math.PI / 180;
 				scene.addObject( mesh );
@@ -113,11 +106,6 @@
 				stats.domElement.style.top = '0px';
 				container.appendChild( stats.domElement );
 
-				document.addEventListener( 'mousedown', onDocumentMouseDown, false );
-				document.addEventListener( 'mouseup', onDocumentMouseUp, false );
-				document.addEventListener( 'mousemove', onDocumentMouseMove, false );
-				document.addEventListener( 'contextmenu', function ( event ) { event.preventDefault(); }, false );
-
 			}
 
 			/*
@@ -268,7 +256,6 @@
 				canvasScaled = document.createElement( 'canvas' );
 				canvasScaled.width = width * 4;
 				canvasScaled.height = height * 4;
-				canvasScaled.loaded = true;
 
 				context = canvasScaled.getContext( '2d' );
 				context.scale( 4, 4 );
@@ -293,59 +280,20 @@
 
 			}
 
-			function onDocumentMouseDown( event ) {
-
-				event.preventDefault();
-				event.stopPropagation();
-
-				switch ( event.button ) {
-
-					case 0: moveForward = true; break;
-					case 2: moveBackward = true; break;
-
-				}
-
-			}
-
-			function onDocumentMouseUp( event ) {
-
-				event.preventDefault();
-				event.stopPropagation();
+			//
 
-				switch ( event.button ) {
+			function animate() {
 
-					case 0: moveForward = false; break;
-					case 2: moveBackward = false; break;
-
-				}
+				requestAnimationFrame( animate );
 
-			}
-
-			function onDocumentMouseMove(event) {
-
-				mouseX = event.clientX - windowHalfX;
-				mouseY = event.clientY - windowHalfY;
+				render();
+				stats.update();
 
 			}
 
-			function loop() {
-
-				if ( moveForward ) camera.translateZ( - 10 );
-				if ( moveBackward ) camera.translateZ( 10 );
+			function render() {
 
-				lon += mouseX * 0.004;
-				lat -= mouseY * 0.004;
-
-				lat = Math.max( - 85, Math.min( 85, lat ) );
-				phi = ( 90 - lat ) * Math.PI / 180;
-				theta = lon * Math.PI / 180;
-
-				camera.target.position.x = 100 * Math.sin( phi ) * Math.cos( theta ) + camera.position.x;
-				camera.target.position.y = 100 * Math.cos( phi ) + camera.position.y;
-				camera.target.position.z = 100 * Math.sin( phi ) * Math.sin( theta ) + camera.position.z;
-
-				renderer.render(scene, camera);
-				stats.update();
+				renderer.render( scene, camera );
 
 			}
 

+ 29 - 89
examples/geometry_terrain_fog_gl.html → examples/webgl_geometry_terrain_fog.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - geometry - terrain + fog - webgl</title>
+		<title>three.js webgl - geometry - terrain + fog</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -30,28 +30,26 @@
 	</head>
 	<body>
 
-		<div id="container"><br /><br /><br /><br /><br />Generating world...</div> 
-		<div id="info"><a href="http://github.com/mrdoob/three.js" target="_blank">three.js</a> - webgl terrain + fog demo <br />(left click: forward, right click: backward)</div> 
+		<div id="container"><br /><br /><br /><br /><br />Generating world...</div>
+		<div id="info"><a href="http://github.com/mrdoob/three.js" target="_blank">three.js</a> - webgl terrain + fog demo <br />(left click: forward, right click: backward)</div>
+
+		<script type="text/javascript" src="../build/Three.js"></script>
 
-		<script type="text/javascript" src="js/Stats.js"></script>
 		<script type="text/javascript" src="js/ImprovedNoise.js"></script>
 
-		<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" src="js/Detector.js"></script>
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
+		<script type="text/javascript" src="js/Stats.js"></script>
+
 		<script type="text/javascript">
 
-			if ( ! THREE.Detector.webgl ) {
-				
-				THREE.Detector.addGetWebGLMessage();
+			if ( ! Detector.webgl ) {
+
+				Detector.addGetWebGLMessage();
 				document.getElementById( 'container' ).innerHTML = "";
-				
+
 			}
-			
-			var fogExp2 = true;
-			
+
 			var container, stats;
 
 			var camera, scene, renderer;
@@ -61,36 +59,20 @@
 			var worldWidth = 256, worldDepth = 256,
 			worldHalfWidth = worldWidth / 2, worldHalfDepth = worldDepth / 2;
 
-			var mouseX = 0, mouseY = 0,
-			lat = 0, lon = 0, phy = 0, theta = 0;
-
-			var direction = new THREE.Vector3(),
-			moveForward = false, moveBackward = false;
-
-			var windowHalfX = window.innerWidth / 2;
-			var windowHalfY = window.innerHeight / 2;
-
-
 			init();
-			setInterval( loop, 1000 / 60 );
-
+			animate();
 
 			function init() {
 
 				container = document.getElementById( 'container' );
 
-				if ( fogExp2 )
-					camera = new THREE.Camera( 60, window.innerWidth / window.innerHeight, 1, 10000 );
-				else
-					camera = new THREE.Camera( 60, window.innerWidth / window.innerHeight, 1, 1000 );
+				camera = new THREE.QuakeCamera( { fov: 60, aspect: window.innerWidth / window.innerHeight, near: 1, far: 10000,
+												  movement_speed: 5, look_speed: 0.004, nofly: false, look_vertical: true } );
+
 				camera.target.position.z = - 100;
 
 				scene = new THREE.Scene();
-				
-				if ( fogExp2 )
-					scene.fog = new THREE.FogExp2( 0xefd1b5, 0.0025 );
-				else
-					scene.fog = new THREE.Fog( 0xefd1b5, - 750, 1000 );
+				scene.fog = new THREE.FogExp2( 0xefd1b5, 0.0025 );
 
 				data = generateHeight( worldWidth, worldDepth );
 
@@ -106,7 +88,8 @@
 				}
 
 				texture = new THREE.Texture( generateTexture( data, worldWidth, worldDepth ), new THREE.UVMapping(), THREE.ClampToEdgeWrapping, THREE.ClampToEdgeWrapping );
-
+				texture.needsUpdate = true;
+				
 				mesh = new THREE.Mesh( geometry, new THREE.MeshBasicMaterial( { map: texture } ) );
 				mesh.rotation.x = - 90 * Math.PI / 180;
 				scene.addObject( mesh );
@@ -123,11 +106,6 @@
 				stats.domElement.style.top = '0px';
 				container.appendChild( stats.domElement );
 
-				document.addEventListener( 'mousedown', onDocumentMouseDown, false );
-				document.addEventListener( 'mouseup', onDocumentMouseUp, false );
-				document.addEventListener( 'mousemove', onDocumentMouseMove, false );
-				document.addEventListener( 'contextmenu', function ( event ) { event.preventDefault(); }, false );
-
 			}
 
 			function generateHeight( width, height ) {
@@ -192,6 +170,7 @@
 					imageData[ i ] = ( 96 + shade * 128 ) * ( 0.5 + data[ j ] * 0.007 );
 					imageData[ i + 1 ] = ( 32 + shade * 96 ) * ( 0.5 + data[ j ] * 0.007 );
 					imageData[ i + 2 ] = ( shade * 96 ) * ( 0.5 + data[ j ] * 0.007 );
+
 				}
 
 				context.putImageData( image, 0, 0 );
@@ -201,7 +180,6 @@
 				canvasScaled = document.createElement( 'canvas' );
 				canvasScaled.width = width * 4;
 				canvasScaled.height = height * 4;
-				canvasScaled.loaded = true;
 
 				context = canvasScaled.getContext( '2d' );
 				context.scale( 4, 4 );
@@ -226,59 +204,21 @@
 
 			}
 
-			function onDocumentMouseDown( event ) {
-
-				event.preventDefault();
-				event.stopPropagation();
-
-				switch ( event.button ) {
-
-					case 0: moveForward = true; break;
-					case 2: moveBackward = true; break;
-
-				}
-
-			}
-
-			function onDocumentMouseUp( event ) {
-
-				event.preventDefault();
-				event.stopPropagation();
+			//
 
-				switch ( event.button ) {
+			function animate() {
 
-					case 0: moveForward = false; break;
-					case 2: moveBackward = false; break;
+				requestAnimationFrame( animate );
 
-				}
-
-			}
-
-			function onDocumentMouseMove(event) {
-
-				mouseX = event.clientX - windowHalfX;
-				mouseY = event.clientY - windowHalfY;
+				render();
+				stats.update();
 
 			}
 
-			function loop() {
-
-				if ( moveForward ) camera.translateZ( - 5 );
-				if ( moveBackward ) camera.translateZ( 5 );
-
-				lon += mouseX * 0.004;
-				lat -= mouseY * 0.004;
 
-				lat = Math.max( - 85, Math.min( 85, lat ) );
-				phi = ( 90 - lat ) * Math.PI / 180;
-				theta = lon * Math.PI / 180;
+			function render() {
 
-				camera.target.position.x = 100 * Math.sin( phi ) * Math.cos( theta ) + camera.position.x;
-				camera.target.position.y = 100 * Math.cos( phi ) + camera.position.y;
-				camera.target.position.z = 100 * Math.sin( phi ) * Math.sin( theta ) + camera.position.z;
-
-				renderer.render(scene, camera);
-				stats.update();
+				renderer.render( scene, camera );
 
 			}
 

+ 225 - 0
examples/webgl_hdr.html

@@ -0,0 +1,225 @@
+<!DOCTYPE HTML>
+<html lang="en">
+	<head>
+		<title>three.js webgl - materials - HDR texture</title>
+		<meta charset="utf-8">
+		<style type="text/css">
+		    body {
+			color: #000;
+			font-family:Monospace;
+			font-size:13px;
+			text-align:center;
+			font-weight: bold;
+
+			background-color: #fff;
+			margin: 0px;
+			overflow: hidden;
+		    }
+
+		    #info {
+					color:#000;
+			position: absolute;
+			top: 0px; width: 100%;
+			padding: 5px;
+
+		    }
+
+		    a { color: red; }
+
+		</style>
+	</head>
+	<body>
+
+		<div id="container"></div>
+		<div id="info">
+			<a href="http://github.com/mrdoob/three.js" target="_blank">three.js</a> - webgl HDR texture example -
+			based on <a href="http://spidergl.org/example.php?id=13" target="_blank">SpiderGL</a>
+		</div>
+
+		<script type="text/javascript" src="../build/Three.js"></script>
+
+		<script type="text/javascript" src="js/Detector.js"></script>
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
+		<script type="text/javascript" src="js/Stats.js"></script>
+
+		<!-- HDR fragment shader -->
+		<script id="fs-hdr" type="x-shader/x-fragment">
+			uniform sampler2D   tDiffuse;
+			uniform float       exposure;
+			uniform float       brightMax;
+
+			varying vec2  vUv;
+
+			vec3 decode_pnghdr( const in vec4 color ) {
+
+				// remove gamma correction
+				vec4 res = color * color;
+
+				// decoded RI
+				float ri = pow( 2.0, res.w * 32.0 - 16.0 );
+
+				// decoded HDR pixel
+				res.xyz = res.xyz * ri;
+				return res.xyz;
+
+			}
+
+			void main(void)
+			{
+				vec4 color = texture2D( tDiffuse, vUv );
+				color.xyz  = decode_pnghdr( color );
+
+				// apply gamma correction and exposure
+				//gl_FragColor = vec4( pow( exposure * color.xyz, vec3( 0.474 ) ), 1.0 );
+
+				// Perform tone-mapping
+				float Y = dot(vec4(0.30, 0.59, 0.11, 0.0), color);
+				float YD = exposure * (exposure/brightMax + 1.0) / (exposure + 1.0);
+				color *= YD;
+
+				gl_FragColor = vec4( color.xyz, 1.0 );
+			}
+		</script>
+
+		<!-- HDR vertex shader -->
+		<script id="vs-hdr" type="x-shader/x-vertex">
+			varying vec2 vUv;
+
+			void main(void)
+			{
+				vUv  = uv;
+				gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );
+			}
+		</script>
+
+
+		<script type="text/javascript">
+
+			if ( ! Detector.webgl ) Detector.addGetWebGLMessage();
+
+			var container, stats;
+
+			var camera, scene, renderer, mesh, directionalLight;
+
+			var windowHalfX = window.innerWidth / 2;
+			var windowHalfY = window.innerHeight / 2;
+
+			var materialHDR, quad;
+
+			var delta, current, old = 0, sign = 1, rate = 1;
+
+			init();
+			animate();
+
+			function init() {
+
+				container = document.getElementById( 'container' );
+
+				camera = new THREE.Camera( 50, window.innerWidth / window.innerHeight, 1, 10000 );
+				camera.position.z = 900;
+
+				scene = new THREE.Scene();
+
+				directionalLight = new THREE.DirectionalLight( 0xffffff );
+				directionalLight.position.x = 0;
+				directionalLight.position.y = 0;
+				directionalLight.position.z = 1;
+				directionalLight.position.normalize();
+				scene.addLight( directionalLight );
+
+				var texture = ImageUtils.loadTexture( "textures/memorial.png" );
+				texture.min_filter = THREE.LinearFilter;
+				texture.mag_filter = THREE.NearestFilter;
+
+				materialHDR = new THREE.MeshShaderMaterial( {
+
+					uniforms: {
+						tDiffuse:  { type: "t", value: 0, texture: texture },
+						exposure:  { type: "f", value: 0.125 },
+						brightMax: { type: "f", value: 0.5 }
+						},
+					vertex_shader: getText( 'vs-hdr' ),
+					fragment_shader: getText( 'fs-hdr' )
+
+				} );
+
+				var plane = new Plane( 512, 768 );
+
+				quad = new THREE.Mesh( plane, materialHDR );
+				quad.position.z = -100;
+				scene.addObject( quad );
+
+				renderer = new THREE.WebGLRenderer();
+				renderer.setSize( window.innerWidth, window.innerHeight );
+				container.appendChild( renderer.domElement );
+
+				stats = new Stats();
+				stats.domElement.style.position = 'absolute';
+				stats.domElement.style.top = '0px';
+				container.appendChild( stats.domElement );
+
+			}
+
+			function getText( id ) {
+
+				return document.getElementById( id ).textContent;
+
+			}
+
+			//
+
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+				stats.update();
+
+			}
+
+			function render() {
+
+				if ( ! old ) old = new Date().getTime();
+				current = new Date().getTime();
+				delta = (current  - old ) * 0.005;
+				old = current;
+
+				if ( materialHDR.uniforms.exposure.value > 0 || materialHDR.uniforms.exposure.value < 1 ) {
+
+					rate = 0.25;
+
+				} else {
+
+					rate = 1;
+
+				}
+
+				if ( materialHDR.uniforms.exposure.value > 5 || materialHDR.uniforms.exposure.value <= 0 ) {
+
+					sign *= -1;
+
+				}
+
+				materialHDR.uniforms.exposure.value += sign * rate * delta;
+
+				// Render final scene to the screen with film shader
+
+				renderer.render( scene, camera );
+
+			}
+
+			function is_browser_compatible() {
+
+				// WebGL support
+
+				try { var test = new Float32Array(1); } catch(e) { return false; }
+
+				// Web workers
+
+				return !!window.Worker;
+
+			}
+
+		</script>
+	</body>
+</html>

+ 52 - 44
examples/interactive_voxelpainter_gl.html → examples/webgl_interactive_voxelpainter.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - interactive - voxel painter - webgl</title>
+		<title>three.js webgl - interactive - voxel painter</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -10,7 +10,7 @@
 				margin: 0px;
 				overflow: hidden;
 			}
-			
+
 			#oldie { background-color: #ddd !important }
 		</style>
 	</head>
@@ -18,17 +18,14 @@
 
 		<script type="text/javascript" src="../build/Three.js"></script>
 
-		<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/Detector.js"></script>
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
 		<script type="text/javascript" src="js/Stats.js"></script>
 
 		<script type="text/javascript">
 
-			if ( ! THREE.Detector.webgl ) THREE.Detector.addGetWebGLMessage();
-			
+			if ( ! Detector.webgl ) Detector.addGetWebGLMessage();
+
 			var container, stats;
 			var camera, scene, renderer;
 			var projector, plane, cube;
@@ -36,12 +33,12 @@
 			rollOveredFace, isShiftDown = false,
 			theta = 45, isCtrlDown = false;
 
-			var rollOverMesh, rollOverMaterial, voxelPosition = new THREE.Vector3(), tmpVec = new THREE.Vector3();			
+			var rollOverMesh, rollOverMaterial, voxelPosition = new THREE.Vector3(), tmpVec = new THREE.Vector3();
 			var cubeGeo, cubeMaterial;
 			var i, intersector;
-			
+
 			init();
-			setInterval( loop, 1000 / 60 );
+			animate();
 
 			function init() {
 
@@ -63,20 +60,20 @@
 				scene = new THREE.Scene();
 
 				// roll-over helpers
-				
+
 				rollOverGeo = new Cube( 50, 50, 50 );
 				rollOverMaterial = new THREE.MeshBasicMaterial( { color: 0xff0000, opacity: 0.5 } );
 				rollOverMesh = new THREE.Mesh( rollOverGeo, rollOverMaterial );
 				scene.addObject( rollOverMesh );
-				
+
 
 				// cubes
-				
+
 				cubeGeo = new Cube( 50, 50, 50 );
 				cubeMaterial = new THREE.MeshLambertMaterial( { color: 0x00ff80, opacity: 1, shading: THREE.FlatShading, map: ImageUtils.loadTexture( "textures/square-outline-textured.png" ) } );
 				cubeMaterial.color.setHSV( 0.1, 0.7, 1.0 );
 				// picking
-				
+
 				projector = new THREE.Projector();
 
 				// grid
@@ -125,35 +122,35 @@
 			}
 
 			function getRealIntersector( intersects ) {
-				
+
 				for( i = 0; i < intersects.length; i++ ) {
-				
+
 					intersector = intersects[ i ];
-					
+
 					if ( intersector.object != rollOverMesh ) {
-						
+
 						return intersector;
-						
+
 					}
-				
+
 				}
-				
+
 				return null;
-				
+
 			}
-			
+
 			function setVoxelPosition( intersector ) {
-				
+
 				tmpVec.copy( intersector.face.normal );
-				
-				voxelPosition.add( intersector.point, intersector.object.rotationMatrix.multiplyVector3( tmpVec ) );
-					
+
+				voxelPosition.add( intersector.point, intersector.object.matrixRotation.multiplyVector3( tmpVec ) );
+
 				voxelPosition.x = Math.floor( voxelPosition.x / 50 ) * 50 + 25;
 				voxelPosition.y = Math.floor( voxelPosition.y / 50 ) * 50 + 25;
 				voxelPosition.z = Math.floor( voxelPosition.z / 50 ) * 50 + 25;
 
 			}
-			
+
 			function onDocumentMouseMove( event ) {
 
 				event.preventDefault();
@@ -172,11 +169,11 @@
 				if ( intersects.length > 0 ) {
 
 					intersector = getRealIntersector( intersects );
-					
+
 					// delete cube
-					
+
 					if ( isCtrlDown ) {
-						
+
 						if ( intersector.object != plane ) {
 
 							scene.removeObject( intersector.object );
@@ -185,15 +182,15 @@
 						}
 
 					// create cube
-					
+
 					} else {
 
-						intersector = getRealIntersector( intersects );						
+						intersector = getRealIntersector( intersects );
 						setVoxelPosition( intersector );
 
 						var voxel = new THREE.Mesh( cubeGeo, cubeMaterial );
 						voxel.position.copy( voxelPosition );
-						
+
 						scene.addObject( voxel );
 
 					}
@@ -227,8 +224,19 @@
 				window.open( renderer.domElement.toDataURL('image/png'), 'mywindow' );
 
 			}
-			
-			function loop() {
+
+			//
+
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+				stats.update();
+
+			}
+
+			function render() {
 
 				if ( isShiftDown ) {
 
@@ -245,19 +253,19 @@
 
 					intersector = getRealIntersector( intersects );
 					if ( intersector ) {
-					
-						setVoxelPosition( intersector );					
+
+						setVoxelPosition( intersector );
 						rollOverMesh.position = voxelPosition;
-						
+
 					}
-					
+
 				}
-				
+
 				camera.position.x = 1400 * Math.sin( theta * Math.PI / 360 );
 				camera.position.z = 1400 * Math.cos( theta * Math.PI / 360 );
 
 				renderer.render( scene, camera );
-				stats.update();
+
 			}
 
 		</script>

+ 36 - 30
examples/lights_pointlights_gl.html → examples/webgl_lights_pointlights.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - lights - point lights - webgl</title>
+		<title>three.js webl - lights - point lights</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -28,39 +28,37 @@
 			a:hover {
 				color: #0080ff;
 			}
-			
+
 			#log { color:#fff; position:absolute; top:50px; text-align:left; display:block; z-index:100; pointer-events:none; }
 		</style>
 	</head>
 	<body>
 
 		<pre id="log"></pre>
-		
+
 		<div id="container"></div>
 		<div id="info">
 			<a href="http://github.com/mrdoob/three.js" target="_blank">three.js</a> - point lights WebGL demo.<br />
 			Walt Disney head by <a href="http://www.davidoreilly.com/2009/01/walt-disneys-head-on-a-plate" target="_blank">David OReilly</a>
 		</div>
 
-		<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/Detector.js"></script>
+		<script type="text/javascript" src="../build/Three.js"></script>
 
+		<script type="text/javascript" src="js/Detector.js"></script>
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
 		<script type="text/javascript" src="js/Stats.js"></script>
 
 		<script type="text/javascript">
 
-			if ( ! THREE.Detector.webgl ) THREE.Detector.addGetWebGLMessage();
-			
+			if ( ! Detector.webgl ) Detector.addGetWebGLMessage();
+
 			var camera, scene, renderer,
 			particle1, particle2, particle2,
 			light1, light2, light3,
 			object,loader;
 
 			init();
-			setInterval( loop, 1000 / 60 );
+			animate();
 
 			function init() {
 
@@ -73,21 +71,21 @@
 
 				loader = new THREE.Loader( true );
 				document.body.appendChild( loader.statusDomElement );
-				
+
 				var callback = function( geometry ) {
-				
+
 					object = new THREE.Mesh( geometry, new THREE.MeshPhongMaterial( { ambient: 0x555555, color: 0x555555, specular: 0xffffff, shininess: 50, shading: THREE.SmoothShading }  )  );
 					object.scale.x = object.scale.y = object.scale.z = 0.80;
 					object.overdraw = true;
 					scene.addObject( object );
-					
+
 					loader.statusDomElement.style.display = "none";
-					
+
 				};
-				
+
 				//loader.loadAscii( { model: "obj/walt/WaltHead_slim.js", callback: callback } );
 				loader.loadBinary( { model: "obj/walt/WaltHead_bin.js", callback: callback } );
-				
+
 				/*
 				var directionalLight = new THREE.DirectionalLight( 0x111111, 0.9 );
 				directionalLight.position.x = 1;
@@ -96,7 +94,7 @@
 				directionalLight.position.normalize();
 				scene.addLight( directionalLight );
 				*/
-				
+
 				scene.addLight( new THREE.AmbientLight( 0x00000 ) );
 
 				light1 = new THREE.PointLight( 0xff0040 );
@@ -109,23 +107,23 @@
 				scene.addLight( light3 );
 
 				var sphere = new Sphere( 0.5, 16, 8 );
-				
+
 				var l1 = new THREE.Mesh( sphere, new THREE.MeshBasicMaterial( { color: 0xff0040 } ) );
 				l1.position = light1.position;
 				scene.addObject( l1 );
-				
+
 				var l2 = new THREE.Mesh( sphere, new THREE.MeshBasicMaterial( { color: 0x0040ff } ) );
 				l2.position = light2.position;
 				scene.addObject( l2 );
-	 
+
 				var l3 = new THREE.Mesh( sphere, new THREE.MeshBasicMaterial( { color: 0x80ff80 } ) );
 				l3.position = light3.position;
 				scene.addObject( l3 );
- 
+
 				renderer = new THREE.WebGLRenderer();
 				renderer.setSize( window.innerWidth, window.innerHeight );
 				container.appendChild( renderer.domElement );
-				
+
 				/*
 				stats = new Stats();
 				stats.domElement.style.position = 'absolute';
@@ -136,7 +134,17 @@
 
 			}
 
-			function loop() {
+			//
+
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+
+			}
+
+			function render() {
 
 				var time = new Date().getTime() * 0.0005;
 
@@ -154,17 +162,15 @@
 				light3.position.y = Math.cos( time * 0.3 ) * 40;
 				light3.position.z = Math.sin( time * 0.5 ) * 30;
 
-				renderer.render(scene, camera);
-				
-				//stats.update();
+				renderer.render( scene, camera );
 
 			}
-			
+
 			function log( text ) {
-			
+
 				var e = document.getElementById("log");
 				e.innerHTML = text + "<br/>" + e.innerHTML;
-				
+
 			}
 
 		</script>

+ 94 - 91
examples/lines_colors_gl.html → examples/webgl_lines_colors.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - lines - cubes - colors - webgl</title>
+		<title>three.js webgl - lines - cubes - colors</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -13,7 +13,7 @@
 			a {
 				color:#0078ff;
 			}
-			
+
 			#info {
 				position: absolute;
 				top: 10px; width: 100%;
@@ -24,7 +24,7 @@
 				text-align: center;
 				z-index:100;
 			}
-			
+
 			a {
 				color: orange;
 				text-decoration: none;
@@ -33,38 +33,37 @@
 			a:hover {
 				color: #0080ff;
 			}
-			
+
 		</style>
 	</head>
 	<body>
-	
+
 		<div id="info">
-			<a href="http://github.com/mrdoob/three.js" target="_blank">three.js</a> - color lines WebGL demo 
+			<a href="http://github.com/mrdoob/three.js" target="_blank">three.js</a> - color lines WebGL demo
 			[<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/ThreeExtras.js"></script>
+		<script type="text/javascript" src="../build/Three.js"></script>
+
+		<script type="text/javascript" src="js/Detector.js"></script>
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
 		<script type="text/javascript" src="js/Stats.js"></script>
 
 		<script type="text/javascript">
-		
-			if ( ! THREE.Detector.webgl ) THREE.Detector.addGetWebGLMessage();
+
+			if ( ! Detector.webgl ) Detector.addGetWebGLMessage();
 
 			var mouseX = 0, mouseY = 0,
 
 			windowHalfX = window.innerWidth / 2,
 			windowHalfY = window.innerHeight / 2,
 
-			camera, scene, renderer,
-			
-			material,
-
-			stats;
+			camera, scene, renderer, material;
 
 			var cameraOrtho, sceneScreen, rtTexture1, rtTexture2, rtTexture3, materialScreen, materialConvolution, blurx, blury, quadScreen;
-			
+
 			init();
-			setInterval( loop, 1000 / 60 );
+			animate();
 
 			function init() {
 
@@ -75,7 +74,7 @@
 
 				camera = new THREE.Camera( 33, window.innerWidth / window.innerHeight, 1, 10000 );
 				camera.position.z = 700;
-				
+
 				scene = new THREE.Scene();
 
 				renderer = new THREE.WebGLRenderer();
@@ -83,16 +82,16 @@
 				renderer.autoClear = false;
 				container.appendChild( renderer.domElement );
 
-				var geometry = new THREE.Geometry(), 
+				var geometry = new THREE.Geometry(),
 					geometry2 = new THREE.Geometry(),
 					geometry3 = new THREE.Geometry(),
 					points = hilbert3D( new THREE.Vector3( 0,0,0 ), 200.0, 2, 0, 1, 2, 3, 4, 5, 6, 7 ),
 					colors = [], colors2 = [], colors3 = [];
 
 				for ( i = 0; i < points.length; i ++ ) {
-				
+
 					geometry.vertices.push( new THREE.Vertex( points[ i ] ) );
-				
+
 					colors[ i ] = new THREE.Color( 0xffffff );
 					colors[ i ].setHSV( 0.6, ( 200 + points[ i ].x ) / 400, 1.0 );
 
@@ -103,26 +102,26 @@
 					colors3[ i ].setHSV( i / points.length, 1.0, 1.0 );
 
 				}
-				
+
 				geometry2.vertices = geometry3.vertices = geometry.vertices;
-				
+
 				geometry.colors = colors;
 				geometry2.colors = colors2;
 				geometry3.colors = colors3;
-				
+
 				// lines
 
 				material = new THREE.LineBasicMaterial( { color: 0xffffff, opacity: 1, linewidth: 3 } );
 
 				var line, p, scale = 0.3, d = 225,
-					parameters =  [ [ material, scale*1.5, [-d,0,0],  geometry ], 
-									[ material, scale*1.5, [0,0,0],  geometry2 ], 
+					parameters =  [ [ material, scale*1.5, [-d,0,0],  geometry ],
+									[ material, scale*1.5, [0,0,0],  geometry2 ],
 									[ material, scale*1.5, [d,0,0],  geometry3 ] ];
-				
+
 				material.vertex_colors = true;
-				
+
 				for ( i = 0; i < parameters.length; ++i ) {
-				
+
 					p = parameters[ i ];
 					line = new THREE.Line( p[ 3 ],  p[ 0 ] );
 					line.scale.x = line.scale.y = line.scale.z =  p[ 1 ];
@@ -130,38 +129,37 @@
 					line.position.y = p[ 2 ][ 1 ];
 					line.position.z = p[ 2 ][ 2 ];
 					scene.addObject( line );
-					
+
 				}
 
 				// postprocessing
-				
-                cameraOrtho = new THREE.Camera();
+
+				cameraOrtho = new THREE.Camera();
 				cameraOrtho.projectionMatrix = THREE.Matrix4.makeOrtho( window.innerWidth / - 2, window.innerWidth / 2, window.innerHeight / 2, window.innerHeight / - 2, -10000, 10000 );
-                cameraOrtho.position.z = 100;
+				cameraOrtho.position.z = 100;
 
 				sceneScreen = new THREE.Scene();
-				
+
 				var pars = { min_filter: THREE.LinearFilter, mag_filter: THREE.LinearFilter };
-                rtTexture1 = new THREE.RenderTarget( window.innerWidth, window.innerHeight, pars );
-                rtTexture2 = new THREE.RenderTarget( 512, 512, pars );
-                rtTexture3 = new THREE.RenderTarget( 512, 512, pars );
+				rtTexture1 = new THREE.RenderTarget( window.innerWidth, window.innerHeight, pars );
+				rtTexture2 = new THREE.RenderTarget( 512, 512, pars );
+				rtTexture3 = new THREE.RenderTarget( 512, 512, pars );
 
 				var screen_shader = ShaderUtils.lib["screen"];
 				var screen_uniforms = Uniforms.clone( screen_shader.uniforms );
-				
+
 				screen_uniforms["tDiffuse"].texture = rtTexture1;
 				screen_uniforms["opacity"].value = 1.0;
-				
-                materialScreen = new THREE.MeshShaderMaterial( {
 
-                    uniforms: screen_uniforms,
-                    vertex_shader: screen_shader.vertex_shader,
-                    fragment_shader: screen_shader.fragment_shader,
+				materialScreen = new THREE.MeshShaderMaterial( {
+
+					uniforms: screen_uniforms,
+					vertex_shader: screen_shader.vertex_shader,
+					fragment_shader: screen_shader.fragment_shader,
 					blending: THREE.AdditiveBlending
 
-                } );
-				
-				
+				} );
+
 				var convolution_shader = ShaderUtils.lib["convolution"];
 				var convolution_uniforms = Uniforms.clone( convolution_shader.uniforms );
 
@@ -171,43 +169,42 @@
 				convolution_uniforms["tDiffuse"].texture = rtTexture1;
 				convolution_uniforms["uImageIncrement"].value = blurx;
 				convolution_uniforms["cKernel"].value = ShaderUtils.buildKernel( 4.0 );
-				
-                materialConvolution = new THREE.MeshShaderMaterial( {
 
-                    uniforms: convolution_uniforms,
-                    vertex_shader:   "#define KERNEL_SIZE 25.0\n" + convolution_shader.vertex_shader,
-                    fragment_shader: "#define KERNEL_SIZE 25\n"   + convolution_shader.fragment_shader
+				materialConvolution = new THREE.MeshShaderMaterial( {
 
-                } );
-				
-				var plane = new Plane( window.innerWidth, window.innerHeight );				
+					uniforms: convolution_uniforms,
+					vertex_shader:   "#define KERNEL_SIZE 25.0\n" + convolution_shader.vertex_shader,
+					fragment_shader: "#define KERNEL_SIZE 25\n"   + convolution_shader.fragment_shader
 
-                quadScreen = new THREE.Mesh( plane, materialConvolution );
+				} );
+
+				var plane = new Plane( window.innerWidth, window.innerHeight );
+
+				quadScreen = new THREE.Mesh( plane, materialConvolution );
 				quadScreen.position.z = -100;
-                sceneScreen.addObject( quadScreen );
+				sceneScreen.addObject( quadScreen );
 
-				
 				stats = new Stats();
 				stats.domElement.style.position = 'absolute';
 				stats.domElement.style.top = '0px';
 				//container.appendChild(stats.domElement);
-				
+
 
 				document.addEventListener( 'mousemove', onDocumentMouseMove, false );
 				document.addEventListener( 'touchstart', onDocumentTouchStart, false );
 				document.addEventListener( 'touchmove', onDocumentTouchMove, false );
-				
+
 			}
 
 			// port of Processing Java code by Thomas Diewald
 			// http://www.openprocessing.org/visuals/?visualID=15599
-			
+
 			function hilbert3D( center, side, iterations, v0, v1, v2, v3, v4, v5, v6, v7 ) {
-			
+
 				var half = side/2,
-					
+
 					vec_s = [
-			  
+
 					new THREE.Vector3( center.x - half, center.y + half, center.z - half ),
 					new THREE.Vector3( center.x - half, center.y + half, center.z + half ),
 					new THREE.Vector3( center.x - half, center.y - half, center.z + half ),
@@ -216,31 +213,31 @@
 					new THREE.Vector3( center.x + half, center.y - half, center.z + half ),
 					new THREE.Vector3( center.x + half, center.y + half, center.z + half ),
 					new THREE.Vector3( center.x + half, center.y + half, center.z - half )
-				
+
 					],
-  
+
 					vec = [ vec_s[ v0 ], vec_s[ v1 ], vec_s[ v2 ], vec_s[ v3 ], vec_s[ v4 ], vec_s[ v5 ], vec_s[ v6 ], vec_s[ v7 ] ];
 
 				if( --iterations >= 0 ) {
-			
+
 					var tmp = [];
-					
+
 					tmp = tmp.concat( hilbert3D ( vec[ 0 ], half, iterations, v0, v3, v4, v7, v6, v5, v2, v1 ) );
 					tmp = tmp.concat( hilbert3D ( vec[ 1 ], half, iterations, v0, v7, v6, v1, v2, v5, v4, v3 ) );
-					tmp = tmp.concat( hilbert3D ( vec[ 2 ], half, iterations, v0, v7, v6, v1, v2, v5, v4, v3 ) ); 
+					tmp = tmp.concat( hilbert3D ( vec[ 2 ], half, iterations, v0, v7, v6, v1, v2, v5, v4, v3 ) );
 					tmp = tmp.concat( hilbert3D ( vec[ 3 ], half, iterations, v2, v3, v0, v1, v6, v7, v4, v5 ) );
-					tmp = tmp.concat( hilbert3D ( vec[ 4 ], half, iterations, v2, v3, v0, v1, v6, v7, v4, v5 ) ); 
+					tmp = tmp.concat( hilbert3D ( vec[ 4 ], half, iterations, v2, v3, v0, v1, v6, v7, v4, v5 ) );
 					tmp = tmp.concat( hilbert3D ( vec[ 5 ], half, iterations, v4, v3, v2, v5, v6, v1, v0, v7 ) );
 					tmp = tmp.concat( hilbert3D ( vec[ 6 ], half, iterations, v4, v3, v2, v5, v6, v1, v0, v7 ) );
 					tmp = tmp.concat( hilbert3D ( vec[ 7 ], half, iterations, v6, v5, v2, v1, v0, v3, v4, v7 ) );
-					
+
 					return tmp;
-					
+
 				}
-			
+
 				return vec;
 			}
-			
+
 			//
 
 			function onDocumentMouseMove(event) {
@@ -273,51 +270,59 @@
 
 			//
 
-			function loop() {
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+
+			}
+
+			function render() {
 
 				camera.position.x += ( mouseX - camera.position.x ) * .05;
 				camera.position.y += ( - mouseY + 200 - camera.position.y ) * .05;
 				camera.updateMatrix();
 
 				var time = new Date().getTime() * 0.0005;
-				
+
 				for( var i = 0; i<scene.objects.length; i++ ) {
-				
+
 					scene.objects[i].rotation.y = time * ( i % 2 ? 1 : -1);
-					
+
 				}
-				
+
 				//renderer.render( scene, camera );
 
 				renderer.clear();
-				
+
 				// Render scene into texture
-				
+
 				renderer.render( scene, camera, rtTexture1 );
 
 				// Render quad with blured scene into texture (convolution pass 1)
-				
+
 				quadScreen.materials = [ materialConvolution ];
-				
+
 				materialConvolution.uniforms.tDiffuse.texture = rtTexture1;
 				materialConvolution.uniforms.uImageIncrement.value = blurx;
-				
+
 				renderer.render( sceneScreen, cameraOrtho, rtTexture2 );
-				
+
 				// Render quad with blured scene into texture (convolution pass 2)
-				
+
 				materialConvolution.uniforms.tDiffuse.texture = rtTexture2;
 				materialConvolution.uniforms.uImageIncrement.value = blury;
-				
+
 				renderer.render( sceneScreen, cameraOrtho, rtTexture3 );
-				
+
 				// Render original scene with superimposed blur to texture
-				
+
 				quadScreen.materials = [ materialScreen ];
-				
+
 				materialScreen.uniforms.tDiffuse.texture = rtTexture3;
 				materialScreen.uniforms.opacity.value = 1.3;
-				
+
 				renderer.render( sceneScreen, cameraOrtho, rtTexture1, false );
 
 				// Render to screen
@@ -325,8 +330,6 @@
 				materialScreen.uniforms.tDiffuse.texture = rtTexture1;
 				renderer.render( sceneScreen, cameraOrtho );
 
-				//stats.update();
-				
 			}
 
 

+ 51 - 49
examples/lines_cubes_gl.html → examples/webgl_lines_cubes.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - lines - cubes - webgl</title>
+		<title>three.js webgl - lines - cubes</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -13,7 +13,7 @@
 			a {
 				color:#0078ff;
 			}
-			
+
 			#info {
 				position: absolute;
 				top: 10px; width: 100%;
@@ -24,7 +24,7 @@
 				text-align: center;
 				z-index:100;
 			}
-			
+
 			a {
 				color: orange;
 				text-decoration: none;
@@ -33,34 +33,35 @@
 			a:hover {
 				color: #0080ff;
 			}
-			
+
 		</style>
 	</head>
 	<body>
-	
+
 		<div id="info">
-			<a href="http://github.com/mrdoob/three.js" target="_blank">three.js</a> - lines WebGL demo 
+			<a href="http://github.com/mrdoob/three.js" target="_blank">three.js</a> - lines WebGL demo
 			[<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/ThreeExtras.js"></script>
+		<script type="text/javascript" src="../build/Three.js"></script>
+
+		<script type="text/javascript" src="js/Detector.js"></script>
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
 		<script type="text/javascript" src="js/Stats.js"></script>
 
 		<script type="text/javascript">
-		
-			if ( ! THREE.Detector.webgl ) THREE.Detector.addGetWebGLMessage();
+
+			if ( ! Detector.webgl ) Detector.addGetWebGLMessage();
 
 			var mouseX = 0, mouseY = 0,
 
 			windowHalfX = window.innerWidth / 2,
 			windowHalfY = window.innerHeight / 2,
 
-			camera, scene, renderer,
-
-			stats;
+			camera, scene, renderer;
 
 			init();
-			setInterval( loop, 1000 / 60 );
+			animate();
 
 			function init() {
 
@@ -82,11 +83,11 @@
 					points = hilbert3D( new THREE.Vector3( 0,0,0 ), 200.0, 4, 0, 1, 2, 3, 4, 5, 6, 7 );
 
 				for ( i = 0; i < points.length; i ++ ) {
-				
+
 					geometry.vertices.push( new THREE.Vertex( points[i] ) );
-				
+
 				}
-				
+
 
 				// lines
 
@@ -97,14 +98,14 @@
 					parameters = [ [ m3, scale*0.5, [0,0,0],  g1 ], [ m2, scale*0.5, [d, 0, 0],  g1 ], [ m2, scale*0.5, [-d, 0, 0],  g1 ],
 								   [ m2, scale*0.5, [0,d,0],  g1 ], [ m2, scale*0.5, [d, d, 0],  g1 ], [ m2, scale*0.5, [-d, d, 0],  g1 ],
 								   [ m2, scale*0.5, [0,-d,0], g1 ], [ m2, scale*0.5, [d, -d, 0], g1 ], [ m2, scale*0.5, [-d, -d, 0], g1 ],
-								   
+
 								   [ m1, scale*0.5, [2*d, 0, 0],  g1 ], [ m1, scale*0.5, [-2*d, 0, 0],  g1 ],
 								   [ m1, scale*0.5, [2*d, d, 0],  g1 ], [ m1, scale*0.5, [-2*d, d, 0],  g1 ],
 								   [ m1, scale*0.5, [2*d, -d, 0], g1 ], [ m1, scale*0.5, [-2*d, -d, 0], g1 ],
 								   ];
-				
+
 				for ( i = 0; i < parameters.length; ++i ) {
-				
+
 					p = parameters[ i ];
 					line = new THREE.Line( p[ 3 ],  p[ 0 ] );
 					line.scale.x = line.scale.y = line.scale.z =  p[ 1 ];
@@ -112,30 +113,24 @@
 					line.position.y = p[ 2 ][ 1 ];
 					line.position.z = p[ 2 ][ 2 ];
 					scene.addObject( line );
-					
-				}
 
-				/*
-				stats = new Stats();
-				stats.domElement.style.position = 'absolute';
-				stats.domElement.style.top = '0px';
-				container.appendChild(stats.domElement);
-				*/
+				}
 
 				document.addEventListener( 'mousemove', onDocumentMouseMove, false );
 				document.addEventListener( 'touchstart', onDocumentTouchStart, false );
 				document.addEventListener( 'touchmove', onDocumentTouchMove, false );
+
 			}
 
 			// port of Processing Java code by Thomas Diewald
 			// http://www.openprocessing.org/visuals/?visualID=15599
-			
+
 			function hilbert3D( center, side, iterations, v0, v1, v2, v3, v4, v5, v6, v7 ) {
-			
+
 				var half = side/2,
-					
+
 					vec_s = [
-			  
+
 					new THREE.Vector3( center.x - half, center.y + half, center.z - half ),
 					new THREE.Vector3( center.x - half, center.y + half, center.z + half ),
 					new THREE.Vector3( center.x - half, center.y - half, center.z + half ),
@@ -144,31 +139,31 @@
 					new THREE.Vector3( center.x + half, center.y - half, center.z + half ),
 					new THREE.Vector3( center.x + half, center.y + half, center.z + half ),
 					new THREE.Vector3( center.x + half, center.y + half, center.z - half )
-				
+
 					],
-  
+
 					vec = [ vec_s[ v0 ], vec_s[ v1 ], vec_s[ v2 ], vec_s[ v3 ], vec_s[ v4 ], vec_s[ v5 ], vec_s[ v6 ], vec_s[ v7 ] ];
 
 				if( --iterations >= 0 ) {
-			
+
 					var tmp = [];
-					
+
 					tmp = tmp.concat( hilbert3D ( vec[ 0 ], half, iterations, v0, v3, v4, v7, v6, v5, v2, v1 ) );
 					tmp = tmp.concat( hilbert3D ( vec[ 1 ], half, iterations, v0, v7, v6, v1, v2, v5, v4, v3 ) );
-					tmp = tmp.concat( hilbert3D ( vec[ 2 ], half, iterations, v0, v7, v6, v1, v2, v5, v4, v3 ) ); 
+					tmp = tmp.concat( hilbert3D ( vec[ 2 ], half, iterations, v0, v7, v6, v1, v2, v5, v4, v3 ) );
 					tmp = tmp.concat( hilbert3D ( vec[ 3 ], half, iterations, v2, v3, v0, v1, v6, v7, v4, v5 ) );
-					tmp = tmp.concat( hilbert3D ( vec[ 4 ], half, iterations, v2, v3, v0, v1, v6, v7, v4, v5 ) ); 
+					tmp = tmp.concat( hilbert3D ( vec[ 4 ], half, iterations, v2, v3, v0, v1, v6, v7, v4, v5 ) );
 					tmp = tmp.concat( hilbert3D ( vec[ 5 ], half, iterations, v4, v3, v2, v5, v6, v1, v0, v7 ) );
 					tmp = tmp.concat( hilbert3D ( vec[ 6 ], half, iterations, v4, v3, v2, v5, v6, v1, v0, v7 ) );
 					tmp = tmp.concat( hilbert3D ( vec[ 7 ], half, iterations, v6, v5, v2, v1, v0, v3, v4, v7 ) );
-					
+
 					return tmp;
-					
+
 				}
-			
+
 				return vec;
 			}
-			
+
 			//
 
 			function onDocumentMouseMove(event) {
@@ -201,23 +196,30 @@
 
 			//
 
-			function loop() {
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+
+			}
+
+			function render() {
 
 				camera.position.x += ( mouseX - camera.position.x ) * .05;
 				camera.position.y += ( - mouseY + 200 - camera.position.y ) * .05;
 				camera.updateMatrix();
 
 				var time = new Date().getTime() * 0.0015;
-				
-				for( var i = 0; i<scene.objects.length; i++ ) {
-				
-					scene.objects[i].rotation.y = time * ( i % 2 ? 1 : -1);
-					
+
+				for( var i = 0; i < scene.objects.length; i++ ) {
+
+					scene.objects[ i ].rotation.y = time * ( i % 2 ? 1 : -1);
+
 				}
 
-				renderer.render(scene, camera);
+				renderer.render( scene, camera );
 
-				//stats.update();
 			}
 
 		</script>

+ 39 - 39
examples/lines_sphere_gl.html → examples/webgl_lines_sphere.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - lines - spheres - webgl</title>
+		<title>three.js webgl - lines - spheres</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -13,7 +13,7 @@
 			a {
 				color:#0078ff;
 			}
-			
+
 			#info {
 				position: absolute;
 				top: 10px; width: 100%;
@@ -24,7 +24,7 @@
 				text-align: center;
 				z-index:100;
 			}
-			
+
 			a {
 				color: #ff0080;
 				text-decoration: none;
@@ -33,7 +33,7 @@
 			a:hover {
 				color: #0080ff;
 			}
-			
+
 		</style>
 	</head>
 	<body>
@@ -42,29 +42,30 @@
 			<a href="http://github.com/mrdoob/three.js" target="_blank">three.js</a> - lines WebGL demo
 		</div>
 
-		<script type="text/javascript" src="../build/ThreeExtras.js"></script>
+		<script type="text/javascript" src="../build/Three.js"></script>
+
+		<script type="text/javascript" src="js/Detector.js"></script>
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
 		<script type="text/javascript" src="js/Stats.js"></script>
-		
+
 		<script type="text/javascript">
-		
-			if ( ! THREE.Detector.webgl ) THREE.Detector.addGetWebGLMessage();
+
+			if ( ! Detector.webgl ) Detector.addGetWebGLMessage();
 
 			var SCREEN_WIDTH = window.innerWidth,
 				SCREEN_HEIGHT = window.innerHeight,
 
 			r = 450,
-			
+
 			mouseX = 0, mouseY = 0,
 
 			windowHalfX = window.innerWidth / 2,
 			windowHalfY = window.innerHeight / 2,
 
-			camera, scene, renderer,
-
-			stats;
+			camera, scene, renderer;
 
 			init();
-			setInterval( loop, 1000 / 60 );
+			animate();
 
 			function init() {
 
@@ -77,14 +78,14 @@
 				camera.position.z = 1000;
 
 				scene = new THREE.Scene();
-				
+
 				var i, line, vector1, vector2, material, p,
 					parameters = [ [ 0.25, 0xff7700, 1, 2 ], [ 0.5, 0xff9900, 1, 1 ], [ 0.75, 0xffaa00, 0.75, 1 ], [ 1, 0xffaa00, 0.5, 1 ], [ 1.25, 0x000833, 0.8, 1 ],
 							       [ 3.0, 0xaaaaaa, 0.75, 2 ], [ 3.5, 0xffffff, 0.5, 1 ], [ 4.5, 0xffffff, 0.25, 1 ], [ 5.5, 0xffffff, 0.125, 1 ] ],
-					
+
 					geometry = new THREE.Geometry();
-				
-				
+
+
 				for ( i = 0; i < 1500; ++i ) {
 
 					vector1 = new THREE.Vector3( Math.random() * 2 - 1, Math.random() * 2 - 1, Math.random() * 2 - 1 );
@@ -96,13 +97,13 @@
 
 					geometry.vertices.push( new THREE.Vertex( vector1 ) );
 					geometry.vertices.push( new THREE.Vertex( vector2 ) );
-					
+
 				}
 
 				for( i = 0; i < parameters.length; ++i ) {
-					
+
 					p = parameters[ i ];
-					
+
 					material = new THREE.LineBasicMaterial( { color: p[ 1 ], opacity: p[ 2 ], linewidth: p[ 3 ] } );
 
 					line = new THREE.Line( geometry, material, THREE.LinePieces );
@@ -117,25 +118,18 @@
 				renderer = new THREE.WebGLRenderer();
 				renderer.setSize(SCREEN_WIDTH, SCREEN_HEIGHT);
 				container.appendChild(renderer.domElement);
-				
-				/*
-				stats = new Stats();
-				stats.domElement.style.position = 'absolute';
-				stats.domElement.style.top = '0px';
-				container.appendChild(stats.domElement);
-				*/
-				
+
 				document.addEventListener( 'mousemove', onDocumentMouseMove, false );
 				document.addEventListener( 'touchstart', onDocumentTouchStart, false );
 				document.addEventListener( 'touchmove', onDocumentTouchMove, false );
-				
+
 			}
 
 			function onDocumentMouseMove(event) {
 
 				mouseX = event.clientX - windowHalfX;
 				mouseY = event.clientY - windowHalfY;
-				
+
 			}
 
 			function onDocumentTouchStart( event ) {
@@ -147,7 +141,7 @@
 					mouseX = event.touches[ 0 ].pageX - windowHalfX;
 					mouseY = event.touches[ 0 ].pageY - windowHalfY;
 				}
-				
+
 			}
 
 			function onDocumentTouchMove( event ) {
@@ -159,12 +153,20 @@
 					mouseX = event.touches[ 0 ].pageX - windowHalfX;
 					mouseY = event.touches[ 0 ].pageY - windowHalfY;
 				}
-				
+
 			}
 
 			//
 
-			function loop() {
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+
+			}
+
+			function render() {
 
 				//camera.position.x += ( mouseX - camera.position.x ) * .05;
 				camera.position.y += ( - mouseY + 200 - camera.position.y ) * .05;
@@ -175,17 +177,15 @@
 				var time = new Date().getTime() * 0.0001;
 
 				for( var i = 0; i<scene.objects.length; i++ ) {
-				
+
 					scene.objects[i].rotation.y = time * ( i < 4 ? i+1 : - (i+1) );
 
 					if ( i < 5 ) scene.objects[i].scale.x = scene.objects[i].scale.y = scene.objects[i].scale.z = scene.objects[i].originalScale * (i/5+1) * (1 + 0.5 * Math.sin( 7*time ) );
-					
+
 				}
-				
-				//stats.update();
-				 
+
 			}
-			
+
 
 		</script>
 	</body>

+ 32 - 21
examples/materials_gl.html → examples/webgl_materials.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - materials - webgl</title>
+		<title>three.js webgl - materials</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -17,20 +17,23 @@
 
 		<pre id="log"></pre>
 
-		<script type="text/javascript" src="../build/ThreeExtras.js"></script>
+		<script type="text/javascript" src="../build/Three.js"></script>
+
+		<script type="text/javascript" src="js/Detector.js"></script>
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
 		<script type="text/javascript" src="js/Stats.js"></script>
 
 		<script type="text/javascript">
 
-			if ( ! THREE.Detector.webgl ) THREE.Detector.addGetWebGLMessage();
-			
+			if ( ! Detector.webgl ) Detector.addGetWebGLMessage();
+
 			var container, stats;
 
 			var camera, scene, renderer, objects;
 			var particleLight, pointLight;
 
 			init();
-			setInterval( loop, 1000 / 60 );
+			animate();
 
 			function init() {
 
@@ -48,9 +51,9 @@
 				var line_material = new THREE.LineBasicMaterial( { color: 0xffffff, opacity: 0.2 } ),
 					geometry = new THREE.Geometry(),
 					floor = -75, step = 25;
-				
+
 				for ( var i = 0; i <= 40; i ++ ) {
-				
+
 					geometry.vertices.push( new THREE.Vertex( new THREE.Vector3( - 500, floor, i * step - 500 ) ) );
 					geometry.vertices.push( new THREE.Vertex( new THREE.Vector3(   500, floor, i * step - 500 ) ) );
 
@@ -58,12 +61,12 @@
 					geometry.vertices.push( new THREE.Vertex( new THREE.Vector3( i * step - 500, floor,  500 ) ) );
 
 				}
-				
+
 				var line = new THREE.Line( geometry, line_material, THREE.LinePieces );
 				scene.addObject( line );
 
 				var generatedTexture = new THREE.Texture( generateTexture() );
-				generatedTexture.image.loaded = 1;
+				generatedTexture.needsUpdate = true;
 
 				var materials = [];
 				materials.push( new THREE.MeshLambertMaterial( { color: 0xdddddd, shading: THREE.FlatShading } ) );
@@ -86,7 +89,7 @@
 				var geometry_smooth = new Sphere( 70, 32, 16 );
 				var geometry_flat = new Sphere( 70, 32, 16 );
 				var geometry_pieces = new Sphere( 70, 32, 16 ); // Extra geometry to be broken down for MeshFaceMaterial
-				
+
 				for ( var i = 0, l = geometry_pieces.faces.length; i < l; i ++ ) {
 
 					var face = geometry_pieces.faces[ i ];
@@ -95,20 +98,20 @@
 				}
 
 				geometry_pieces.sortFacesByMaterial();
-				
+
 				materials.push( new THREE.MeshFaceMaterial() );
 
 				objects = [];
 
 				var sphere, geometry, material;
-				
+
 				for ( var i = 0, l = materials.length; i < l; i ++ ) {
-				
+
 					material = materials[ i ];
-					
-					geometry = material instanceof THREE.MeshFaceMaterial ? geometry_pieces : 
+
+					geometry = material instanceof THREE.MeshFaceMaterial ? geometry_pieces :
 							   ( material.shading == THREE.FlatShading ? geometry_flat : geometry_smooth );
-					
+
 					sphere = new THREE.Mesh( geometry, material );
 
 					sphere.position.x = ( i % 4 ) * 200 - 400;
@@ -195,7 +198,16 @@
 
 			//
 
-			function loop() {
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+				stats.update();
+
+			}
+
+			function render() {
 
 				var timer = new Date().getTime() * 0.0001;
 
@@ -221,14 +233,13 @@
 
 				renderer.render( scene, camera );
 
-				stats.update();
 			}
-			
+
 			function log( text ) {
-			
+
 				var e = document.getElementById("log");
 				e.innerHTML = text + "<br/>" + e.innerHTML;
-				
+
 			}
 
 		</script>

+ 25 - 16
examples/materials_cars.html → examples/webgl_materials_cars.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - materials - cube reflection [cars] - webgl</title>
+		<title>three.js webgl - materials - cube reflection [cars]</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -27,7 +27,7 @@
 			#car_info { text-align:center; }
 			#car_name { font-size:1em }
 			#car_author { font-size:1em }
-			
+
 			#oldie { background:rgb(50,0,0) !important; color:#fff !important; margin-top:7em!important }
 		</style>
 	</head>
@@ -56,13 +56,16 @@
 
 		<div id="log"></div>
 
-		<script type="text/javascript" src="../build/ThreeExtras.js"></script>
+		<script type="text/javascript" src="../build/Three.js"></script>
+
+		<script type="text/javascript" src="js/Detector.js"></script>
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
 		<script type="text/javascript" src="js/Stats.js"></script>
 
 		<script type="text/javascript">
 
-			if ( ! THREE.Detector.webgl ) THREE.Detector.addGetWebGLMessage();
-			
+			if ( ! Detector.webgl ) Detector.addGetWebGLMessage();
+
 			var STATS_ENABLED = false;
 
 			var CARS = {
@@ -150,12 +153,9 @@
 
 			var loader = new THREE.Loader( true );
 			document.body.appendChild( loader.statusDomElement );
-			
-			document.addEventListener('mousemove', onDocumentMouseMove, false);
 
 			init();
-
-			setInterval(loop, 1000/60);
+			animate();
 
 			function init() {
 
@@ -214,13 +214,14 @@
 
 				}
 
+				document.addEventListener('mousemove', onDocumentMouseMove, false);
+
 				var r = "textures/cube/Bridge2/";
 				var urls = [ r + "posx.jpg", r + "negx.jpg",
 							 r + "posy.jpg", r + "negy.jpg",
 							 r + "posz.jpg", r + "negz.jpg" ];
 
-				var images = ImageUtils.loadArray( urls );
-				var textureCube = new THREE.Texture( images );
+				var textureCube = ImageUtils.loadTextureCube( urls );
 
 				// common materials
 
@@ -569,16 +570,24 @@
 
 			}
 
-			var r = 0;
+			//
+
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+
+			}
 
-			function loop() {
+			function render() {
 
-				r -= 0.005;
+				var timer = - new Date().getTime() * 0.0002;
 
 				camera.position.y += ( - mouseY - camera.position.y ) * .05;
 
-				camera.position.x = 1000 * Math.cos( r );
-				camera.position.z = 1000 * Math.sin( r );
+				camera.position.x = 1000 * Math.cos( timer );
+				camera.position.z = 1000 * Math.sin( timer );
 
 				cameraCube.target.position.x = - camera.position.x;
 				cameraCube.target.position.y = - camera.position.y;

+ 58 - 64
examples/materials_cars_camaro.html → examples/webgl_materials_cars_camaro.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - materials - cube reflection [camaro] - webgl</title>
+		<title>three.js webgl - materials - cube reflection [camaro]</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -23,58 +23,45 @@
 			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> 
+		<div id="log"></div>
 
-		<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="../build/Three.js"></script>
 
+		<script type="text/javascript" src="js/Detector.js"></script>
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
 		<script type="text/javascript" src="js/Stats.js"></script>
 
 		<script type="text/javascript">
 
-			if ( ! THREE.Detector.webgl ) THREE.Detector.addGetWebGLMessage();
-			
+			if ( ! Detector.webgl ) Detector.addGetWebGLMessage();
+
 			var SCREEN_WIDTH = window.innerWidth;
 			var SCREEN_HEIGHT = window.innerHeight;
 
-			var container;
-			var stats;
+			var container, stats;
 
-			var camera;
-			var scene;
-			var webglRenderer;
+			var camera, scene, webglRenderer;
 
 			var lightMesh;
-			
+
 			var directionalLight, pointLight;
-			
-			var mouseX = 0;
-			var mouseY = 0;
 
-			var windowHalfX = window.innerWidth >> 1;
-			var windowHalfY = window.innerHeight >> 1;
+			var mouseX = 0, mouseY = 0;
 
-			document.addEventListener('mousemove', onDocumentMouseMove, false);
+			var windowHalfX = window.innerWidth / 2;
+			var windowHalfY = window.innerHeight / 2;
 
 			init();
-			
-			loop();
-						
-			setInterval(loop, 1000/60);
-			
+			animate();
+
 			function init() {
 
 				container = document.createElement('div');
@@ -85,7 +72,7 @@
 				camera.updateMatrix();
 
 				scene = new THREE.Scene();
-				
+
 				// LIGHTS
 
 				var ambient = new THREE.AmbientLight( 0x555555 );
@@ -125,16 +112,17 @@
 				stats.domElement.style.zIndex = 100;
 				container.appendChild( stats.domElement );
 
+				document.addEventListener('mousemove', onDocumentMouseMove, false);
+
 				var r = "textures/cube/SwedishRoyalCastle/";
-				var urls = [ r + "px.jpg", r + "nx.jpg", 
-							 r + "py.jpg", r + "ny.jpg", 
+				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 textureCube = ImageUtils.loadTextureCube( urls );
+
 				var camaroMaterials = {
-					
+
 					body: 		[],
 					chrome: 	new THREE.MeshLambertMaterial( { color: 0xffffff, env_map: textureCube } ),
 					darkchrome: new THREE.MeshLambertMaterial( { color: 0x444444, env_map: textureCube } ),
@@ -142,15 +130,15 @@
 					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 } ) ] );
@@ -158,26 +146,26 @@
 
 				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 );
 
@@ -188,7 +176,7 @@
 			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
@@ -198,14 +186,13 @@
 				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 );
@@ -213,31 +200,38 @@
 
 			}
 
-			var r = 0;
-			
-			function loop() {
+			// 
+
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+				stats.update();
+
+			}
+
+			function render() {
+
+				var timer = - new Date().getTime() * 0.0002;
 
 				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;
+				lightMesh.position.x = 1500 * Math.cos( timer );
+				lightMesh.position.z = 1500 * Math.sin( timer );
 
 				webglRenderer.render( scene, camera );
 
-				stats.update();
-
 			}
 
 			function log(text) {
-			
+
 				var e = document.getElementById("log");
 				e.innerHTML = text + "<br/>" + e.innerHTML;
-				
+
 			}
-			
+
 		</script>
 
 	</body>

+ 31 - 25
examples/materials_cubemap.html → examples/webgl_materials_cubemap.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - materials - cube reflection / refraction [Walt] - webgl</title>
+		<title>three.js webgl - materials - cube reflection / refraction [Walt]</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -21,7 +21,7 @@
 			#d { text-align:center; margin:1em 0 -7.5em 0; z-index:1000; position:relative; display:block }
 			.button { background:orange; color:#fff; padding:0.2em 0.5em; cursor:pointer }
 			.inactive { background:#999; color:#eee }
-			
+
 			#oldie { margin-top:11em !important }
 		</style>
 	</head>
@@ -36,13 +36,16 @@
 
 		<pre id="log"></pre>
 
-		<script type="text/javascript" src="../build/ThreeExtras.js"></script>
+		<script type="text/javascript" src="../build/Three.js"></script>
+
+		<script type="text/javascript" src="js/Detector.js"></script>
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
 		<script type="text/javascript" src="js/Stats.js"></script>
 
 		<script type="text/javascript">
 
-			if ( ! THREE.Detector.webgl ) THREE.Detector.addGetWebGLMessage();
-			
+			if ( ! Detector.webgl ) Detector.addGetWebGLMessage();
+
 			var container, stats;
 
 			var camera, scene, webglRenderer;
@@ -51,7 +54,7 @@
 			var mesh, zmesh, lightMesh, geometry;
 
 			var loader;
-			
+
 			var directionalLight, pointLight;
 
 			var mouseX = 0;
@@ -63,7 +66,7 @@
 			document.addEventListener('mousemove', onDocumentMouseMove, false);
 
 			init();
-			setInterval( loop, 1000 / 60 );
+			animate();
 
 			function init() {
 
@@ -101,20 +104,16 @@
 						path + 'pz' + format, path + 'nz' + format
 					];
 
-				var images = ImageUtils.loadArray( urls );
-
-				var reflectionCube = new THREE.Texture( images );
-				var refractionCube = new THREE.Texture( images, new THREE.CubeRefractionMapping() );
+				var reflectionCube = ImageUtils.loadTextureCube( urls );
+				var refractionCube = new THREE.Texture( reflectionCube.image, new THREE.CubeRefractionMapping() );
 				
-				//var cubeMaterial3 = new THREE.MeshPhongMaterial( { color: 0x000000, specular:0xaa0000, env_map: new THREE.TextureCube( images ), combine: THREE.MixOperation, reflectivity: 0.25 } );
+				//var cubeMaterial3 = new THREE.MeshPhongMaterial( { color: 0x000000, specular:0xaa0000, env_map: reflectionCube, combine: THREE.MixOperation, reflectivity: 0.25 } );
 				var cubeMaterial3 = new THREE.MeshLambertMaterial( { color: 0xff6600, env_map: reflectionCube, combine: THREE.MixOperation, reflectivity: 0.3 } );
 				var cubeMaterial2 = new THREE.MeshLambertMaterial( { color: 0xffee00, env_map: refractionCube, refraction_ratio: 0.95 } );
 				var cubeMaterial1 = new THREE.MeshLambertMaterial( { color: 0xffffff, env_map: reflectionCube } )
 
-				//SceneUtils.addPanoramaCubePlanes( sceneCube, 100000, images );
-				//SceneUtils.addPanoramaCube( sceneCube, 100000, images );
 				SceneUtils.addPanoramaCubeWebGL( sceneCube, 100000, reflectionCube );
-				
+
 				webglRenderer = new THREE.WebGLRenderer();
 				webglRenderer.setSize( window.innerWidth, window.innerHeight );
 				webglRenderer.autoClear = false;
@@ -129,7 +128,7 @@
 
 				loader = new THREE.Loader( true );
 				document.body.appendChild( loader.statusDomElement );
-				
+
 				loader.loadBinary( { model: "obj/walt/WaltHead_bin.js", callback: function( geometry ) { createScene( geometry, cubeMaterial1, cubeMaterial2, cubeMaterial3 ) } } );
 
 			}
@@ -141,7 +140,7 @@
 				SceneUtils.addMesh( scene, geometry, s,      0, 0, -100, 0,0,0, m1 );
 				SceneUtils.addMesh( scene, geometry, s,   -900, 0, -100, 0,0,0, m2 );
 				SceneUtils.addMesh( scene, geometry, s,    900, 0, -100, 0,0,0, m3 );
-				
+
 				loader.statusDomElement.style.display = "none";
 
 			}
@@ -153,9 +152,20 @@
 
 			}
 
-			var r = 0;
+			//
 
-			function loop() {
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+				stats.update();
+
+			}
+
+			function render() {
+
+				var timer = - new Date().getTime() * 0.0002;
 
 				camera.position.x += ( mouseX - camera.position.x ) * .05;
 				camera.position.y += ( - mouseY - camera.position.y ) * .05;
@@ -165,17 +175,13 @@
 				cameraCube.target.position.z = - camera.position.z;
 
 
-				lightMesh.position.x = 1500 * Math.cos( r );
-				lightMesh.position.z = 1500 * Math.sin( r );
-
-				r += 0.01;
+				lightMesh.position.x = 1500 * Math.cos( timer );
+				lightMesh.position.z = 1500 * Math.sin( timer );
 
 				webglRenderer.clear();
 				webglRenderer.render( sceneCube, cameraCube );
 				webglRenderer.render( scene, camera );
 
-				stats.update();
-
 			}
 
 			function log(text) {

+ 24 - 17
examples/materials_cubemap_balls_reflection.html → examples/webgl_materials_cubemap_balls_reflection.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - materials - cube reflection [balls] - webgl</title>
+		<title>three.js webgl - materials - cube reflection [balls]</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -26,7 +26,7 @@
 			a {
 				color: #ffffff;
 			}
-			
+
 			#oldie a { color:#da0 }
 		</style>
 	</head>
@@ -34,13 +34,16 @@
 	<body>
 		<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="../build/Three.js"></script>
+
+		<script type="text/javascript" src="js/Detector.js"></script>
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
 		<script type="text/javascript" src="js/Stats.js"></script>
 
 		<script type="text/javascript">
 
-			if ( ! THREE.Detector.webgl ) THREE.Detector.addGetWebGLMessage();
-			
+			if ( ! Detector.webgl ) Detector.addGetWebGLMessage();
+
 			var statsEnabled = false;
 
 			var container, stats;
@@ -61,12 +64,12 @@
 			document.addEventListener( 'mousemove', onDocumentMouseMove, false );
 
 			init();
-			setInterval( loop, 1000 / 60 );
+			animate();
 
 			function init() {
 
-				container = document.createElement('div');
-				document.body.appendChild(container);
+				container = document.createElement( 'div' );
+				document.body.appendChild( container );
 
 				camera = new THREE.Camera( 60, window.innerWidth / window.innerHeight, 1, 100000 );
 				camera.position.z = 3200;
@@ -87,10 +90,7 @@
 						path + 'pz' + format, path + 'nz' + format
 					];
 
-				var images = ImageUtils.loadArray( urls );
-				var textureCube = new THREE.Texture( images );
-				// var textureCube = new THREE.Texture( images, new THREE.CubeRefractionMapping );
-
+				var textureCube = ImageUtils.loadTextureCube( urls );
 				var material = new THREE.MeshBasicMaterial( { color: 0xffffff, env_map: textureCube } );
 
 				for ( var i = 0; i < 200; i ++ ) {
@@ -103,8 +103,6 @@
 					scene.addObject( mesh );
 				}
 
-				//SceneUtils.addPanoramaCubePlanes( sceneCube, 100000, images );
-				//SceneUtils.addPanoramaCube( sceneCube, 100000, images );
 				SceneUtils.addPanoramaCubeWebGL( sceneCube, 100000, textureCube );
 
 				webglRenderer = new THREE.WebGLRenderer();
@@ -131,7 +129,18 @@
 
 			}
 
-			function loop() {
+			//
+
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+				if ( statsEnabled ) stats.update();
+
+			}
+
+			function render() {
 
 				camera.position.x += ( mouseX - camera.position.x ) * .05;
 				camera.position.y += ( - mouseY - camera.position.y ) * .05;
@@ -144,8 +153,6 @@
 				webglRenderer.render( sceneCube, cameraCube );
 				webglRenderer.render( scene, camera );
 
-				if ( statsEnabled ) stats.update();
-
 			}
 
 		</script>

+ 22 - 11
examples/materials_cubemap_balls_refraction.html → examples/webgl_materials_cubemap_balls_refraction.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - materials - cube refraction [balls] - webgl</title>
+		<title>three.js webgl - materials - cube refraction [balls]</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -26,7 +26,7 @@
 			a {
 				color: #ffffff;
 			}
-			
+
 			#oldie a { color:#da0 }
 		</style>
 	</head>
@@ -34,13 +34,16 @@
 	<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/Three.js"></script>
+
+		<script type="text/javascript" src="js/Detector.js"></script>
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
 		<script type="text/javascript" src="js/Stats.js"></script>
 
 		<script type="text/javascript">
 
-			if ( ! THREE.Detector.webgl ) THREE.Detector.addGetWebGLMessage();
-			
+			if ( ! Detector.webgl ) Detector.addGetWebGLMessage();
+
 			var statsEnabled = false;
 
 			var container, stats;
@@ -61,7 +64,7 @@
 			document.addEventListener( 'mousemove', onDocumentMouseMove, false );
 
 			init();
-			setInterval( loop, 1000 / 60 );
+			animate();
 
 			function init() {
 
@@ -87,8 +90,7 @@
 						path + 'pz' + format, path + 'nz' + format
 					];
 
-				var images = ImageUtils.loadArray( urls );
-				var textureCube = new THREE.Texture( images, new THREE.CubeRefractionMapping() );
+				var textureCube = ImageUtils.loadTextureCube( urls, new THREE.CubeRefractionMapping() );
 				var material = new THREE.MeshBasicMaterial( { color: 0xffffff, env_map: textureCube, refraction_ratio: 0.95 } );
 
 				for ( var i = 0; i < 200; i ++ ) {
@@ -129,7 +131,18 @@
 
 			}
 
-			function loop() {
+			//
+
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+				if ( statsEnabled ) stats.update();
+
+			}
+
+			function render() {
 
 				camera.position.x += ( mouseX - camera.position.x ) * .05;
 				camera.position.y += ( - mouseY - camera.position.y ) * .05;
@@ -142,8 +155,6 @@
 				webglRenderer.render( sceneCube, cameraCube );
 				webglRenderer.render( scene, camera );
 
-				if ( statsEnabled ) stats.update();
-
 			}
 
 		</script>

+ 22 - 15
examples/materials_cubemap_escher.html → examples/webgl_materials_cubemap_escher.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - materials - cube reflection [Escher] - webgl</title>
+		<title>three.js webgl - materials - cube reflection [Escher]</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -14,11 +14,10 @@
 				text-align:center;
 			}
 			a {	color: #ff0080;	text-decoration: none; }
-			a:hover { color: #0080ff; }			
+			a:hover { color: #0080ff; }
 			#log { position:absolute; top:50px; text-align:left; display:block; z-index:100; pointer-events:none; }
 			#d { text-align:center; margin:1em auto -9.0em; z-index:1000; position:relative; display:block; 
 				 background:rgba(0,0,0,0.75); padding:0.25em; width:300px; border-radius:10px; -webkit-box-shadow: 0px 0px 10px rgba(0,0,0,0.5) }
-				 
 			#oldie { margin-top:15em !important }
 		</style>
 	</head>
@@ -32,13 +31,16 @@
 
 		<pre id="log"></pre>
 
-		<script type="text/javascript" src="../build/ThreeExtras.js"></script>
+		<script type="text/javascript" src="../build/Three.js"></script>
+
+		<script type="text/javascript" src="js/Detector.js"></script>
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
 		<script type="text/javascript" src="js/Stats.js"></script>
 
 		<script type="text/javascript">
 
-			if ( ! THREE.Detector.webgl ) THREE.Detector.addGetWebGLMessage();
-			
+			if ( ! Detector.webgl ) Detector.addGetWebGLMessage();
+
 			var statsEnabled = false;
 
 			var container, stats;
@@ -58,7 +60,7 @@
 			document.addEventListener( 'mousemove', onDocumentMouseMove, false );
 
 			init();
-			setInterval( loop, 1000 / 60 );
+			animate();
 
 			function init() {
 
@@ -77,9 +79,7 @@
 							 r + "py.jpg", r + "ny.jpg", 
 							 r + "pz.jpg", r + "nz.jpg" ];
 
-				var images = ImageUtils.loadArray( urls );
-
-				var textureCube = new THREE.Texture( images );
+				var textureCube = ImageUtils.loadTextureCube( urls );
 				var material = new THREE.MeshBasicMaterial( { color: 0xffffff, env_map: textureCube } )
 				var geometry = new Sphere( 100, 96, 64 );
 
@@ -87,8 +87,6 @@
 				mesh.scale.x = mesh.scale.y = mesh.scale.z = 16;
 				scene.addObject( mesh );
 
-				//SceneUtils.addPanoramaCubePlanes( scene, 6000, images );
-				//SceneUtils.addPanoramaCube( scene, 6000, images );
 				SceneUtils.addPanoramaCubeWebGL( scene, 6000, textureCube );
 
 				webglRenderer = new THREE.WebGLRenderer();
@@ -114,15 +112,24 @@
 
 			}
 
-			function loop() {
+			//
+
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+				if ( statsEnabled ) stats.update();
+
+			}
+
+			function render() {
 
 				camera.position.x += ( mouseX - camera.position.x ) * .05;
 				camera.position.y += ( - mouseY - camera.position.y ) * .05;
 
 				webglRenderer.render( scene, camera );
 
-				if ( statsEnabled ) stats.update();
-
 			}
 
 			function log(text) {

+ 31 - 23
examples/materials_cubemap_refraction.html → examples/webgl_materials_cubemap_refraction.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - materials - cube refraction [Lucy] - webgl</title>
+		<title>three.js webgl - materials - cube refraction [Lucy]</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -20,7 +20,7 @@
 			#log { position:absolute; top:50px; text-align:left; display:block; z-index:100; pointer-events:none; }
 			#d { text-align:center; margin:1em auto -9.5em; z-index:200; position:relative; display:block; 
 				background:rgba(0,0,0,0.5); padding:0.5em; width:400px; border-radius:15px; -webkit-box-shadow: 0px 0px 10px rgba(0,0,0,0.5) }
-				
+
 			#oldie { margin-top:15em !important }
 		</style>
 	</head>
@@ -35,13 +35,16 @@
 
 		<pre id="log"></pre>
 
-		<script type="text/javascript" src="../build/ThreeExtras.js"></script> 
+		<script type="text/javascript" src="../build/Three.js"></script>
+
+		<script type="text/javascript" src="js/Detector.js"></script>
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
 		<script type="text/javascript" src="js/Stats.js"></script>
 
 		<script type="text/javascript">
 
-			if ( ! THREE.Detector.webgl ) THREE.Detector.addGetWebGLMessage();
-			
+			if ( ! Detector.webgl ) Detector.addGetWebGLMessage();
+
 			var FLOOR = -250;
 
 			var container, stats;
@@ -52,19 +55,16 @@
 			var mesh, zmesh, lightMesh, geometry;
 
 			var loader;
-			
+
 			var directionalLight, pointLight;
 
-			var mouseX = 0;
-			var mouseY = 0;
+			var mouseX = 0, mouseY = 0;
 
 			var windowHalfX = window.innerWidth / 2;
 			var windowHalfY = window.innerHeight / 2;
 
-			document.addEventListener('mousemove', onDocumentMouseMove, false);
-
 			init();
-			setInterval( loop, 1000 / 60 );
+			animate();
 
 			function init() {
 
@@ -102,8 +102,7 @@
 							 r + "py.jpg", r + "ny.jpg", 
 							 r + "pz.jpg", r + "nz.jpg" ];
 
-				var images = ImageUtils.loadArray( urls );
-				var textureCube = new THREE.Texture( images, new THREE.CubeRefractionMapping() );
+				var textureCube = ImageUtils.loadTextureCube( urls, new THREE.CubeRefractionMapping() );
 
 				var cubeMaterial3 = new THREE.MeshBasicMaterial( { color: 0xccddff, env_map: textureCube, refraction_ratio: 0.98, reflectivity:0.9 } );
 				var cubeMaterial2 = new THREE.MeshBasicMaterial( { color: 0xccfffd, env_map: textureCube, refraction_ratio: 0.985 } );
@@ -126,9 +125,11 @@
 
 				loader = new THREE.Loader( true );
 				document.body.appendChild( loader.statusDomElement );
-				
+
 				loader.loadBinary( { model: 'obj/lucy/Lucy100k_bin.js', callback: function( geometry ) { createScene( geometry, cubeMaterial1, cubeMaterial2, cubeMaterial3 ) } } );
 
+				document.addEventListener('mousemove', onDocumentMouseMove, false);
+
 			}
 
 			function createScene( geometry, m1, m2, m3 ) {
@@ -138,7 +139,7 @@
 				SceneUtils.addMesh( scene, geometry, s,      0, 0, z, 0,0,0, m1 );
 				SceneUtils.addMesh( scene, geometry, s,   -900, 0, z, 0,0,0, m2 );
 				SceneUtils.addMesh( scene, geometry, s,    900, 0, z, 0,0,0, m3 );
-				
+
 				loader.statusDomElement.style.display = "none";
 
 			}
@@ -150,9 +151,20 @@
 
 			}
 
-			var r = 0;
+			//
+
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+				stats.update();
+
+			}
+
+			function render() {
 
-			function loop() {
+				var timer = - new Date().getTime() * 0.0002;
 
 				camera.position.x += ( mouseX - camera.position.x ) * .05;
 				camera.position.y += ( - mouseY - camera.position.y ) * .05;
@@ -162,17 +174,13 @@
 				cameraCube.target.position.z = - camera.position.z;
 
 
-				lightMesh.position.x = 1500 * Math.cos( r );
-				lightMesh.position.z = 1500 * Math.sin( r );
-
-				r += 0.01;
+				lightMesh.position.x = 1500 * Math.cos( timer );
+				lightMesh.position.z = 1500 * Math.sin( timer );
 
 				webglRenderer.clear();
 				webglRenderer.render( sceneCube, cameraCube );
 				webglRenderer.render( scene, camera );
 
-				stats.update();
-
 			}
 
 			function log(text) {

+ 20 - 9
examples/materials_grass.html → examples/webgl_materials_grass.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - materials - grass - webgl</title>
+		<title>three.js webgl - materials - grass</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -18,18 +18,19 @@
 
 	<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" src="js/Detector.js"></script>
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
 
 		<script type="text/javascript">
 
-			if ( ! THREE.Detector.webgl ) THREE.Detector.addGetWebGLMessage();
-			
+			if ( ! Detector.webgl ) Detector.addGetWebGLMessage();
+
 			var camera, scene, renderer,
 			mesh, levels = [];
 
 			init();
-			setInterval( loop, 1000 / 60 );
+			animate();
 
 			function init() {
 
@@ -42,10 +43,12 @@
 				var geometry = new Plane( 100, 100 );
 
 				var texture = generateTextureBase();
+				texture.needsUpdate = true;
 
 				for ( var i = 0; i < 10; i ++ ) {
 
 					mesh = levels[ i ] = new THREE.Mesh( geometry, new THREE.MeshBasicMaterial( { map: new THREE.Texture( generateTextureLevel( texture ), new THREE.UVMapping(), THREE.ClampToEdgeWrapping, THREE.ClampToEdgeWrapping ) } ) );
+					mesh.materials[0].map.needsUpdate = true;
 					mesh.rotation.x = - 90 * ( Math.PI / 180 );
 					mesh.position.y = i * 0.5;
 					scene.addObject( mesh );
@@ -62,7 +65,6 @@
 			function generateTextureBase() {
 
 				var canvas = document.createElement( 'canvas' );
-				canvas.loaded = true;
 				canvas.width = 1024;
 				canvas.height = 1024;
 
@@ -89,7 +91,6 @@
 				texture.getContext( '2d' ).drawImage( texture, 0, 0 );
 
 				var canvas = document.createElement( 'canvas' );
-				canvas.loaded = true;
 				canvas.width = texture.width;
 				canvas.height = texture.height;
 
@@ -99,7 +100,17 @@
 
 			}
 
-			function loop() {
+			//
+
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+
+			}
+
+			function render() {
 
 				var time = new Date().getTime() / 6000;
 

+ 56 - 44
examples/materials_normalmap.html → examples/webgl_materials_normalmap.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - materials - normal map - webgl</title>
+		<title>three.js webgl - materials - normal map</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -23,29 +23,29 @@
 				font-family:Monospace;
 				font-size:13px;
 				text-align:center;
-				z-index:1000; 
+				z-index:1000;
 			}
-			
+
 			#oldie {
 				background:rgb(200,100,0) !important;
-				color:#fff;				
+				color:#fff;
 			}
-			
-			#vt { display:none } 
+
+			#vt { display:none }
 			#vt, #vt a { color:orange; }
 			.code { }
-			
+
 			#log { position:absolute; top:50px; text-align:left; display:block; z-index:100 }
 		</style>
 	</head>
 
 	<body>
 		<pre id="log"></pre>
-		
+
 		<div id="info">
-			<a href="http://github.com/mrdoob/three.js" target="_blank">three.js</a> - webgl (<span id="description">normal + ao + displacement</span>) map demo. 
+			<a href="http://github.com/mrdoob/three.js" target="_blank">three.js</a> - webgl (<span id="description">normal + ao + displacement</span>) map demo.
 			ninja head from <a href="http://developer.amd.com/archive/gpu/MeshMapper/pages/default.aspx" target="_blank">AMD GPU MeshMapper</a>
-			
+
 			<div id="vt">displacement mapping needs vertex textures (GPU with Shader Model 3.0)<br/>
 			on Windows use <span class="code">Chrome --use-gl=desktop</span> <br/>
 			or Firefox 4 (about:config => webgl.mochitest_native_gl=true)<br/>
@@ -53,13 +53,16 @@
 			</div>
 		</div>
 
-		<script type="text/javascript" src="../build/ThreeExtras.js"></script> 
+		<script type="text/javascript" src="../build/Three.js"></script>
+
+		<script type="text/javascript" src="js/Detector.js"></script>
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
 		<script type="text/javascript" src="js/Stats.js"></script>
-		
+
 		<script type="text/javascript">
 
-			if ( ! THREE.Detector.webgl ) THREE.Detector.addGetWebGLMessage();
-			
+			if ( ! Detector.webgl ) Detector.addGetWebGLMessage();
+
 			var statsEnabled = true;
 
 			var container, stats, loader;
@@ -68,7 +71,7 @@
 
 			var mesh, zmesh, lightMesh, geometry;
 			var mesh1, mesh2;
-	
+
 			var directionalLight, pointLight, ambientLight;
 
 			var mouseX = 0;
@@ -82,7 +85,7 @@
 			document.addEventListener( 'mousemove', onDocumentMouseMove, false );
 
 			init();
-			setInterval( loop, 1000 / 60 );
+			animate();
 
 			function init() {
 
@@ -112,7 +115,7 @@
 				scene.addLight( directionalLight );
 
 				// light representation
-				
+
 				var sphere = new Sphere( 100, 16, 8 );
 				lightMesh = new THREE.Mesh( sphere, new THREE.MeshBasicMaterial( { color:0xffaa00 } ) );
 				lightMesh.position = pointLight.position;
@@ -120,36 +123,36 @@
 				scene.addObject(lightMesh);
 
 				// common material parameters
-				
+
 				var ambient = 0x050505, diffuse = 0x555555, specular = 0xaa6600, shininess = 10, scale = 23;
 
 				// normal map shader
-				
+
 				var shader = ShaderUtils.lib[ "normal" ];
 				var uniforms = Uniforms.clone( shader.uniforms );
 
 				uniforms[ "enableAO" ].value = true;
 				uniforms[ "enableDiffuse" ].value = false;
-				
+
 				uniforms[ "tNormal" ].texture = ImageUtils.loadTexture( "textures/normal/ninja/normal.jpg" );
 				uniforms[ "tAO" ].texture = ImageUtils.loadTexture( "textures/normal/ninja/ao.jpg" );
-				
+
 				uniforms[ "tDisplacement" ].texture = ImageUtils.loadTexture( "textures/normal/ninja/displacement.jpg" );
 				uniforms[ "uDisplacementBias" ].value = -0.428408 * scale;
 				uniforms[ "uDisplacementScale" ].value = 2.436143 * scale;
-				
+
 				uniforms[ "uPointLightPos" ].value = pointLight.position;
 				uniforms[ "uPointLightColor" ].value = pointLight.color;
 
 				uniforms[ "uDirLightPos" ].value = directionalLight.position;
 				uniforms[ "uDirLightColor" ].value = directionalLight.color;
-				
+
 				uniforms[ "uAmbientLightColor" ].value = ambientLight.color;
-				
+
 				uniforms[ "uDiffuseColor" ].value.setHex( diffuse );
 				uniforms[ "uSpecularColor" ].value.setHex( specular );
 				uniforms[ "uAmbientColor" ].value.setHex( ambient );
-				
+
 				uniforms[ "uShininess" ].value = shininess;
 
 				var parameters = { fragment_shader: shader.fragment_shader, vertex_shader: shader.vertex_shader, uniforms: uniforms };
@@ -159,7 +162,7 @@
 
 				loader = new THREE.Loader( true );
 				document.body.appendChild( loader.statusDomElement );
-				
+
 				loader.loadBinary( { model: "obj/ninja/NinjaLo_bin.js", callback: function( geometry ) { createScene( geometry, scale, material1, material2 ) } } );
 
 				webglRenderer = new THREE.WebGLRenderer();
@@ -169,7 +172,7 @@
 				var description = "normal + ao" + ( webglRenderer.supportsVertexTextures() ? " + displacement" : " + <strike>displacement</strike>" );
 				document.getElementById( "description" ).innerHTML = description;
 				document.getElementById( "vt" ).style.display = webglRenderer.supportsVertexTextures() ? "none" : "block";
-				
+
 				if ( statsEnabled ) {
 
 					stats = new Stats();
@@ -183,41 +186,52 @@
 			}
 
 			function createScene( geometry, scale, material1, material2 ) {
-				
+
 				geometry.computeTangents();
-				
+
 				mesh1 = SceneUtils.addMesh( scene, geometry, scale, -scale * 12, 0, 0, 0,0,0, material1 );
 				mesh2 = SceneUtils.addMesh( scene, geometry, scale,  scale * 12, 0, 0, 0,0,0, material2 );
-				
+
 				loader.statusDomElement.style.display = "none";
-				
+
 			}
-			
+
 			function onDocumentMouseMove(event) {
 
 				mouseX = ( event.clientX - windowHalfX ) * 10;
 				mouseY = ( event.clientY - windowHalfY ) * 10;
 
 			}
-			
-			function loop() {
+
+			//
+
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+				if ( statsEnabled ) stats.update();
+
+			}
+
+			function render() {
 
 				var ry = mouseX * 0.0003, rx = mouseY * 0.0003;
-				
+
 				if( mesh1 ) {
-				
+
 					mesh1.rotation.y = ry;
 					mesh1.rotation.x = rx;
-					
+
 				}
-				
+
 				if( mesh2 ) {
-					
+
 					mesh2.rotation.y = ry;
 					mesh2.rotation.x = rx;
-					
+
 				}
-				
+
 				lightMesh.position.x = 2500 * Math.cos( r );
 				lightMesh.position.z = 2500 * Math.sin( r );
 
@@ -225,8 +239,6 @@
 
 				webglRenderer.render( scene, camera );
 
-				if ( statsEnabled ) stats.update();
-
 			}
 
 			function log( text ) {
@@ -235,7 +247,7 @@
 				e.innerHTML = text + "<br/>" + e.innerHTML;
 
 			}
-			
+
 
 		</script>
 

+ 21 - 9
examples/materials_normalmap2.html → examples/webgl_materials_normalmap2.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - materials - normal map [Lee Perry-Smith] - webgl</title>
+		<title>three.js webgl - materials - normal map [Lee Perry-Smith]</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -52,12 +52,15 @@
 			</div>
 		</div>
 
-		<script type="text/javascript" src="../build/ThreeExtras.js"></script>
+		<script type="text/javascript" src="../build/Three.js"></script>
+
+		<script type="text/javascript" src="js/Detector.js"></script>
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
 		<script type="text/javascript" src="js/Stats.js"></script>
 
 		<script type="text/javascript">
 
-			if ( ! THREE.Detector.webgl ) THREE.Detector.addGetWebGLMessage();
+			if ( ! Detector.webgl ) Detector.addGetWebGLMessage();
 
 			var statsEnabled = true;
 
@@ -76,10 +79,8 @@
 			var windowHalfX = window.innerWidth / 2;
 			var windowHalfY = window.innerHeight / 2;
 
-			document.addEventListener( 'mousemove', onDocumentMouseMove, false );
-
 			init();
-			setInterval( loop, 1000 / 60 );
+			animate();
 
 			function init() {
 
@@ -159,6 +160,8 @@
 
 				}
 
+				document.addEventListener( 'mousemove', onDocumentMouseMove, false );
+
 			}
 
 			function createScene( geometry, scale, material ) {
@@ -178,7 +181,18 @@
 
 			}
 
-			function loop() {
+			//
+
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+				if ( statsEnabled ) stats.update();
+
+			}
+
+			function render() {
 
 				var ry = mouseX * 0.0003, rx = mouseY * 0.0003;
 
@@ -191,8 +205,6 @@
 
 				webglRenderer.render( scene, camera );
 
-				if ( statsEnabled ) stats.update();
-
 			}
 
 			function log( text ) {

+ 61 - 63
examples/materials_shaders.html → examples/webgl_materials_shaders.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - materials - shaders [Phong, Lambert] - webgl</title>
+		<title>three.js webgl - materials - shaders [Phong, Lambert]</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -22,7 +22,7 @@
 			.inactive { background:#999; color:#eee }
 		</style>
 	</head>
-	
+
 	<body>
 		<div id="d">
 			<h1>Blinn-Phong / Lambert materials</h1>
@@ -30,22 +30,21 @@
 			<span id="rcanvas" class="button inactive">2d canvas renderer</span>
 			<span id="rwebgl" class="button">WebGL renderer</span>
 			<br/>
-			
+
 			<p><a href="http://github.com/mrdoob/three.js">Three.js</a> example
-			
+
 			<br/>
 			<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>
-		
-		<pre id="log"></pre>
 
-		<script type="text/javascript" src="../build/Three.js"></script> 
+		<pre id="log"></pre>
 
-		<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="../build/Three.js"></script>
 
+		<script type="text/javascript" src="js/Detector.js"></script>
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
 		<script type="text/javascript" src="js/Stats.js"></script>
 
 		<script type="text/javascript">
@@ -54,43 +53,34 @@
 			var SCREEN_HEIGHT = window.innerHeight;
 			var FLOOR = -250;
 
-			var container;
-			var stats;
+			var container, stats;
 
-			var camera;
-			var scene;
-			var canvasRenderer, webglRenderer;
+			var camera, scene, canvasRenderer, webglRenderer;
 
 			var mesh, zmesh, lightMesh, geometry;
-			
+
 			var directionalLight, pointLight;
-			
-			var mouseX = 0;
-			var mouseY = 0;
 
-			var windowHalfX = window.innerWidth >> 1;
-			var windowHalfY = window.innerHeight >> 1;
+			var mouseX = 0, mouseY = 0;
+
+			var windowHalfX = window.innerWidth / 2;
+			var windowHalfY = window.innerHeight / 2;
 
 			var render_canvas = 1, render_gl = 1;
 			var has_gl = 0;
-			
+
 			var bcanvas = document.getElementById("rcanvas");
 			var bwebgl = document.getElementById("rwebgl");
-			
-			document.addEventListener('mousemove', onDocumentMouseMove, false);
 
 			init();
-			
-			loop();
-			
+			animate();
+
 			render_canvas = !has_gl;
 			bwebgl.style.display = has_gl ? "inline" : "none";
 			bcanvas.className = render_canvas ? "button" : "button inactive";
-			
-			setInterval(loop, 1000/60);
-			
+
 			function addMesh( geometry, scale, x, y, z, rx, ry, rz, material ) {
-				
+
 				mesh = new THREE.Mesh( geometry, material );
 				mesh.scale.x = mesh.scale.y = mesh.scale.z = scale;
 				mesh.position.x = x;
@@ -102,9 +92,9 @@
 				mesh.overdraw = true;
 				mesh.updateMatrix();
 				scene.addObject(mesh);
-				
+
 			}
-			
+
 			function init() {
 
 				container = document.createElement('div');
@@ -147,7 +137,7 @@
 				sphere = new Sphere( 100, 32, 32 );
 
 				var y1 = 0, y2 = -200;
-				
+
 				addMesh( sphere, 1, -600, y1, 0, 0,0,0, new THREE.MeshPhongMaterial( { ambient: 0x050505, color: 0x000000, specular: 0x555555, shininess: 30 } ) );
 				addMesh( sphere, 1, -600, y2, 0, 0,0,0, new THREE.MeshLambertMaterial( { color: 0x050505 } ) );
 
@@ -180,7 +170,7 @@
 					catch (e) {
 					}
 				}
-				
+
 				if( render_canvas ) {
 					canvasRenderer = new THREE.CanvasRenderer();
 					canvasRenderer.setSize( SCREEN_WIDTH, SCREEN_HEIGHT );
@@ -193,7 +183,7 @@
 				stats.domElement.style.top = '0px';
 				stats.domElement.style.zIndex = 100;
 				container.appendChild( stats.domElement );
-				
+
 				bcanvas.addEventListener("click", toggleCanvas, false);
 				bwebgl.addEventListener("click", toggleWebGL, false);
 
@@ -201,12 +191,14 @@
 				loader.loadAscii( { model: "obj/torus/Torus_slim.js", callback: function( geometry ) { createScene( geometry ) } } );
 				//loader.loadBinary( { model: "obj/torus/Torus_bin.js", callback: function( geometry ) { createScene( geometry ) } } );
 
+				document.addEventListener('mousemove', onDocumentMouseMove, false);
+
 			}
 
 			function createScene( geometry ) {
-				
+
 				var s = 80, t = s + 20, y = 200;
-				
+
 				addMesh( geometry, s, -6*t, y, 0, 1.57,0,0, new THREE.MeshPhongMaterial( { ambient: 0x000000, color: 0x000000, specular: 0x333333, shininess: 10 } ) );
 				addMesh( geometry, s, -4*t, y, 0, 1.57,0,0, new THREE.MeshPhongMaterial( { ambient: 0x030303, color: 0x888888, specular: 0x333333, shininess: 10 } ) );
 				addMesh( geometry, s, -2*t, y, 0, 1.57,0,0, new THREE.MeshPhongMaterial( { ambient: 0x030303, color: 0x030303, specular: 0xff5500, shininess: 10 } ) );
@@ -217,7 +209,7 @@
 
 			}
 
-			
+
 			function onDocumentMouseMove(event) {
 
 				mouseX = ( event.clientX - windowHalfX );
@@ -225,63 +217,69 @@
 
 			}
 
-			var r = 0;
-			
-			function loop() {
+			//
+
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+				stats.update();
+
+			}
+
+			function render() {
+
+				var timer = - new Date().getTime() * 0.0002;
 
 				camera.position.x += ( mouseX - camera.position.x ) * .05;
 				camera.position.y += ( - mouseY - camera.position.y ) * .05;
 				camera.updateMatrix();
-				
-				lightMesh.position.x = 700*Math.cos(r);
-				lightMesh.position.z = 700*Math.sin(r);
+
+				lightMesh.position.x = 700*Math.cos( timer );
+				lightMesh.position.z = 700*Math.sin( timer );
 				lightMesh.updateMatrix();
 
-				r += 0.01;
-				
-				
 				if ( render_canvas ) canvasRenderer.render( scene, camera );
 				if ( render_gl && has_gl ) webglRenderer.render( scene, camera );
 
-				stats.update();
-
 			}
 
 			function log(text) {
-			
+
 				var e = document.getElementById("log");
 				e.innerHTML = text + "<br/>" + e.innerHTML;
-				
+
 			}
-			
+
 			function toggleCanvas() {
-			
+
 				render_canvas = !render_canvas;
 				bcanvas.className = render_canvas ? "button" : "button inactive";
-				
+
 				render_gl = !render_canvas;
 				bwebgl.className = render_gl ? "button" : "button inactive";
-				
+
 				if( has_gl )
 					webglRenderer.domElement.style.display = render_gl ? "block" : "none";
-				
+
 				canvasRenderer.domElement.style.display = render_canvas ? "block" : "none";
-				
+
 			}
-			
+
 			function toggleWebGL() {
-			
+
 				render_gl = !render_gl;
 				bwebgl.className = render_gl ? "button" : "button inactive";
-				
+
 				render_canvas = !render_gl;
 				bcanvas.className = render_canvas ? "button" : "button inactive";
-				
+
 				if( has_gl )
 					webglRenderer.domElement.style.display = render_gl ? "block" : "none";
-					
+
 				canvasRenderer.domElement.style.display = render_canvas ? "block" : "none";
-				
+
 			}
 		</script>
 

+ 28 - 16
examples/materials_shaders_fresnel.html → examples/webgl_materials_shaders_fresnel.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - materials - shaders [Fresnel] - webgl</title>
+		<title>three.js webgl - materials - shaders [Fresnel]</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -27,22 +27,25 @@
 				color: #ffffff;
 			}
 			#log { position:absolute; top:50px; text-align:left; display:block; z-index:100 }
-			
+
 			#oldie a { color:#0b0 }
 		</style>
 	</head>
 
 	<body>
 		<pre id="log"></pre>
-		
+
 		<div id="info"><a href="http://github.com/mrdoob/three.js" target="_blank">three.js</a> - webgl cube Fresnel shader demo. texture by <a href="http://www.humus.name/index.php?page=Textures" target="_blank">Humus</a> </div>
 
-		<script type="text/javascript" src="../build/ThreeExtras.js"></script> 
+		<script type="text/javascript" src="../build/Three.js"></script>
+
+		<script type="text/javascript" src="js/Detector.js"></script>
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
 		<script type="text/javascript" src="js/Stats.js"></script>
-		
+
 		<script type="text/javascript">
 
-			if ( ! THREE.Detector.webgl ) THREE.Detector.addGetWebGLMessage();
+			if ( ! Detector.webgl ) Detector.addGetWebGLMessage();
 
 			var statsEnabled = true;
 
@@ -55,8 +58,7 @@
 
 			var directionalLight, pointLight;
 
-			var mouseX = 0;
-			var mouseY = 0;
+			var mouseX = 0, mouseY = 0;
 
 			var windowHalfX = window.innerWidth / 2;
 			var windowHalfY = window.innerHeight / 2;
@@ -64,7 +66,7 @@
 			document.addEventListener( 'mousemove', onDocumentMouseMove, false );
 
 			init();
-			setInterval( loop, 1000 / 60 );
+			animate();
 
 			function init() {
 
@@ -90,8 +92,7 @@
 					];
 
 
-				var images = ImageUtils.loadArray( urls );
-				var textureCube = new THREE.Texture( images );
+				var textureCube = ImageUtils.loadTextureCube( urls );
 
 				var shader = ShaderUtils.lib["fresnel"];
 				var uniforms = Uniforms.clone( shader.uniforms );
@@ -108,12 +109,14 @@
 					mesh.position.y = Math.random() * 10000 - 5000;
 					mesh.position.z = Math.random() * 10000 - 5000;
 					mesh.scale.x = mesh.scale.y = mesh.scale.z = Math.random() * 4 + 1;
-					mesh.autoUpdateMatrix = false;
+					mesh.matrixAutoUpdate = false;
 					mesh.updateMatrix();
 					scene.addObject( mesh );
-					
+
 				}
 
+				scene.matrixAutoUpdate = false;
+
 				SceneUtils.addPanoramaCubeWebGL( sceneCube, 100000, textureCube );
 
 				webglRenderer = new THREE.WebGLRenderer();
@@ -140,7 +143,18 @@
 
 			}
 
-			function loop() {
+			//
+
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+				if ( statsEnabled ) stats.update();
+
+			}
+
+			function render() {
 
 				camera.position.x += ( mouseX - camera.position.x ) * .05;
 				camera.position.y += ( - mouseY - camera.position.y ) * .05;
@@ -153,8 +167,6 @@
 				webglRenderer.render( sceneCube, cameraCube );
 				webglRenderer.render( scene, camera );
 
-				if ( statsEnabled ) stats.update();
-
 			}
 
 			function log( text ) {

+ 376 - 0
examples/webgl_materials_video.html

@@ -0,0 +1,376 @@
+<!DOCTYPE HTML>
+<html lang="en">
+	<head>
+		<title>three.js webgl - materials - video</title>
+		<meta charset="utf-8">
+		<style type="text/css">
+			body {
+				background-color: #000;
+				color: #fff;
+				margin: 0px;
+				overflow: hidden;
+				font-family:Monospace;
+				font-size:13px;
+				text-align:center;
+				font-weight: bold;
+				text-align:center;
+			}
+
+			a {
+				color:#0078ff;
+			}
+
+			#info {
+				color:#fff;
+				position: absolute;
+				top: 0px; width: 100%;
+				padding: 5px;
+				z-index:100;
+			}
+
+		</style>
+	</head>
+	<body>
+
+		<div id="info">
+			<a href="http://github.com/mrdoob/three.js" target="_blank">three.js</a> - webgl video demo. playing <a href="http://durian.blender.org/" target="_blank">sintel</a> trailer
+		</div>
+
+		<script type="text/javascript" src="../build/Three.js"></script>
+
+		<script type="text/javascript" src="js/Detector.js"></script>
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
+		<script type="text/javascript" src="js/Stats.js"></script>
+
+		<video id="video" autoplay loop style="display:none">
+			<source src="textures/sintel.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"'>
+			<source src="textures/sintel.ogv" type='video/ogg; codecs="theora, vorbis"'>
+		</video>
+
+		<script type="text/javascript">
+
+			if ( ! Detector.webgl ) Detector.addGetWebGLMessage();
+
+			var container, stats;
+
+			var camera, scene, renderer;
+
+			var video, texture, material, mesh;
+
+			var mouseX = 0;
+			var mouseY = 0;
+
+			var windowHalfX = window.innerWidth / 2;
+			var windowHalfY = window.innerHeight / 2;
+
+			var postprocessing = { enabled: true };
+
+			var cube_count,
+
+				meshes = [],
+				materials = [],
+
+				xgrid = 20,
+				ygrid = 10;
+
+			init();
+			animate();
+
+			function init() {
+
+				container = document.createElement('div');
+				document.body.appendChild( container );
+
+				camera = new THREE.Camera( 40, window.innerWidth / window.innerHeight, 1, 10000 );
+				camera.position.z = 500;
+
+				scene = new THREE.Scene();
+
+				var light = new THREE.DirectionalLight( 0xffffff );
+				light.position.set( 0.5, 1, 1 );
+				light.position.normalize();
+				scene.addLight( light );
+
+				renderer = new THREE.WebGLRenderer();
+				renderer.setSize( window.innerWidth, window.innerHeight );
+
+				container.appendChild( renderer.domElement );
+
+				video = document.getElementById( 'video' );
+
+				//video.volume = 0;
+				//video.muted = true;
+
+				texture = new THREE.Texture( video );
+				texture.min_filter = THREE.LinearFilter;
+				texture.mag_filter = THREE.LinearFilter;
+
+				//
+
+				var i, j, ux, uy, ox, oy,
+					geometry,
+					xsize, ysize;
+
+				ux = 1 / xgrid;
+				uy = 1 / ygrid;
+
+				xsize = 480 / xgrid;
+				ysize = 204 / ygrid;
+
+				var parameters = { color: 0xffffff, map: texture },
+					material_base = new THREE.MeshLambertMaterial( parameters );
+
+				renderer.initMaterial( material_base, scene.lights, scene.fog );
+
+				cube_count = 0;
+
+				for( i = 0; i < xgrid; i++)
+				for( j = 0; j < ygrid; j++) {
+
+					ox = i;
+					oy = j;
+
+					geometry = new Cube( xsize, ysize, xsize );
+					change_uvs( geometry, ux, uy, ox, oy );
+
+					materials[ cube_count ] = new THREE.MeshLambertMaterial( parameters );
+
+					material = materials[ cube_count ];
+
+					material.program = material_base.program;
+					material.uniforms = Uniforms.clone( THREE.ShaderLib[ 'lambert' ].uniforms );
+
+					material.hue = i/xgrid;
+					material.saturation = j/ygrid;
+
+					material.color.setHSV( material.hue, material.saturation, 1 );
+
+					mesh = new THREE.Mesh( geometry, material );
+
+					mesh.position.x =   ( i - xgrid/2 ) * xsize;
+					mesh.position.y = - ( j - ygrid/2 ) * ysize;
+					mesh.position.z = 0;
+
+					mesh.scale.x = mesh.scale.y = mesh.scale.z = 1;
+
+					scene.addObject(mesh);
+
+					mesh.dx = 0.001 * ( 0.5 - Math.random() );
+					mesh.dy = 0.001 * ( 0.5 - Math.random() );
+
+					meshes[ cube_count ] = mesh;
+
+					cube_count += 1;
+
+				}
+
+				initPostprocessing();
+				renderer.autoClear = false;
+
+				stats = new Stats();
+				stats.domElement.style.position = 'absolute';
+				stats.domElement.style.top = '0px';
+				//container.appendChild( stats.domElement );
+
+				document.addEventListener( 'mousemove', onDocumentMouseMove, false );
+
+			}
+
+			function change_uvs( geometry, unitx, unity, offsetx, offsety ) {
+
+				var i, j, uv;
+
+				for ( i = 0; i < geometry.uvs.length; i++ ) {
+
+					uv = geometry.uvs[ i ];
+
+					for ( j = 0; j < uv.length; j++ ) {
+
+						uv[j].u = ( uv[j].u + offsetx ) * unitx;
+						uv[j].v = ( uv[j].v + offsety ) * unity;
+
+					}
+
+				}
+
+			}
+
+
+			function initPostprocessing() {
+
+				postprocessing.scene = new THREE.Scene();
+
+				postprocessing.camera = new THREE.Camera();
+				postprocessing.camera.projectionMatrix = THREE.Matrix4.makeOrtho( window.innerWidth / - 2, window.innerWidth / 2,  window.innerHeight / 2, window.innerHeight / - 2, -10000, 10000 );
+				postprocessing.camera.position.z = 100;
+
+				var pars = { min_filter: THREE.LinearFilter, mag_filter: THREE.LinearFilter };
+				postprocessing.rtTexture1 = new THREE.RenderTarget( window.innerWidth, window.innerHeight, pars );
+				postprocessing.rtTexture2 = new THREE.RenderTarget( 512, 512, pars );
+				postprocessing.rtTexture3 = new THREE.RenderTarget( 512, 512, pars );
+
+				var screen_shader = ShaderUtils.lib["screen"];
+				var screen_uniforms = Uniforms.clone( screen_shader.uniforms );
+
+				screen_uniforms["tDiffuse"].texture = postprocessing.rtTexture1;
+				screen_uniforms["opacity"].value = 1.0;
+
+				postprocessing.materialScreen = new THREE.MeshShaderMaterial( {
+
+					uniforms: screen_uniforms,
+					vertex_shader: screen_shader.vertex_shader,
+					fragment_shader: screen_shader.fragment_shader,
+					blending: THREE.AdditiveBlending
+
+				} );
+
+				var convolution_shader = ShaderUtils.lib["convolution"];
+				var convolution_uniforms = Uniforms.clone( convolution_shader.uniforms );
+
+				postprocessing.blurx = new THREE.Vector2( 0.001953125, 0.0 ),
+				postprocessing.blury = new THREE.Vector2( 0.0, 0.001953125 );
+
+				convolution_uniforms["tDiffuse"].texture = postprocessing.rtTexture1;
+				convolution_uniforms["uImageIncrement"].value = postprocessing.blurx;
+				convolution_uniforms["cKernel"].value = ShaderUtils.buildKernel( 4.0 );
+
+				postprocessing.materialConvolution = new THREE.MeshShaderMaterial( {
+
+					uniforms: convolution_uniforms,
+					vertex_shader:   "#define KERNEL_SIZE 25.0\n" + convolution_shader.vertex_shader,
+					fragment_shader: "#define KERNEL_SIZE 25\n"   + convolution_shader.fragment_shader
+
+				} );
+
+				postprocessing.quad = new THREE.Mesh( new Plane( window.innerWidth, window.innerHeight ), postprocessing.materialConvolution );
+				postprocessing.quad.position.z = -500;
+				postprocessing.scene.addObject( postprocessing.quad );
+
+			}
+
+			function onDocumentMouseMove(event) {
+
+				mouseX = ( event.clientX - windowHalfX );
+				mouseY = ( event.clientY - windowHalfY ) * 0.3;
+
+			}
+
+			//
+
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+				stats.update();
+
+			}
+
+			var h, counter = 1;
+
+			function render() {
+
+				var time = new Date().getTime() * 0.00005;
+
+				camera.position.x += ( mouseX - camera.position.x ) * 0.05;
+				camera.position.y += ( - mouseY - camera.position.y ) * 0.05;
+
+				if ( video.readyState === video.HAVE_ENOUGH_DATA ) {
+
+					if ( texture ) texture.needsUpdate = true;
+
+				}
+
+				for( i = 0; i < cube_count; i++ ) {
+
+					material = materials[i];
+
+					h = ( 360 * ( material.hue + time ) % 360 ) / 360;
+					material.color.setHSV( h, material.saturation, 1 );
+
+				}
+
+				if( counter % 1000  > 200 ) {
+
+					for( i = 0; i < cube_count; i++ ) {
+
+						mesh = meshes[i];
+
+						mesh.rotation.x += 10 * mesh.dx;
+						mesh.rotation.y += 10 * mesh.dy;
+
+						mesh.position.x += 200 * mesh.dx;
+						mesh.position.y += 200 * mesh.dy;
+						mesh.position.z += 400 * mesh.dx;
+
+					}
+
+				}
+
+				if( counter % 1000  == 0 ) {
+
+					for( i = 0; i < cube_count; i++ ) {
+
+						mesh = meshes[i];
+
+						mesh.dx *= -1;
+						mesh.dy *= -1;
+
+					}
+
+				}
+
+				counter++;
+
+				if ( postprocessing.enabled ) {
+
+					renderer.clear();
+
+					// Render scene into texture
+
+					renderer.render( scene, camera, postprocessing.rtTexture1 );
+
+					// Render quad with blured scene into texture (convolution pass 1)
+
+					postprocessing.quad.materials = [ postprocessing.materialConvolution ];
+
+					postprocessing.materialConvolution.uniforms.tDiffuse.texture = postprocessing.rtTexture1;
+					postprocessing.materialConvolution.uniforms.uImageIncrement.value = postprocessing.blurx;
+
+					renderer.render( postprocessing.scene, postprocessing.camera, postprocessing.rtTexture2 );
+
+					// Render quad with blured scene into texture (convolution pass 2)
+
+					postprocessing.materialConvolution.uniforms.tDiffuse.texture = postprocessing.rtTexture2;
+					postprocessing.materialConvolution.uniforms.uImageIncrement.value = postprocessing.blury;
+
+					renderer.render( postprocessing.scene, postprocessing.camera, postprocessing.rtTexture3 );
+
+					// Render original scene with superimposed blur to texture
+
+					postprocessing.quad.materials = [ postprocessing.materialScreen ];
+
+					postprocessing.materialScreen.uniforms.tDiffuse.texture = postprocessing.rtTexture3;
+					postprocessing.materialScreen.uniforms.opacity.value = 1.3;
+
+					renderer.render( postprocessing.scene, postprocessing.camera, postprocessing.rtTexture1, false );
+
+					// Render to screen
+
+					postprocessing.materialScreen.uniforms.tDiffuse.texture = postprocessing.rtTexture1;
+					renderer.render( postprocessing.scene, postprocessing.camera );
+
+				} else {
+
+					renderer.clear();
+					renderer.render( scene, camera );
+
+				}
+
+			}
+
+
+		</script>
+
+	</body>
+</html>

+ 21 - 18
examples/obj_convert_test.html → examples/webgl_objconvert_test.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - io - OBJ converter - webgl</title>
+		<title>three.js webgl - io - OBJ converter</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -44,10 +44,8 @@
 
 		<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/Plane.js"></script>
-
+		<script type="text/javascript" src="js/Detector.js"></script>
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
 		<script type="text/javascript" src="js/Stats.js"></script>
 
 		<script type="text/javascript">
@@ -77,16 +75,12 @@
 			document.addEventListener('mousemove', onDocumentMouseMove, false);
 
 			init();
-
-			loop();
+			animate();
 
 			render_canvas = !has_gl;
 			bwebgl.style.display = has_gl ? "inline" : "none";
 			bcanvas.className = render_canvas ? "button" : "button inactive";
 
-			setInterval(loop, 1000/60);
-
-
 			function init() {
 
 				container = document.createElement('div');
@@ -115,8 +109,8 @@
 				xc.fillRect(96, 96, 32, 32);
 
 				var xm = new THREE.MeshBasicMaterial( { map: new THREE.Texture( x, THREE.UVMapping, THREE.RepeatWrapping, THREE.RepeatWrapping ) } );
-				xm.map.image.loaded = 1;
-
+				xm.map.needsUpdate = true;
+				
 				geometry = new Plane( 100, 100, 15, 10 );
 				for(var i=0; i<geometry.uvs.length; i++) {
 					var uvs = geometry.uvs[i];
@@ -197,10 +191,10 @@
 				var loader = new THREE.Loader(),
 					callbackMale   = function( geometry ) { createScene( geometry,  90, 50, FLOOR, 105 ) },
 					callbackFemale = function( geometry ) { createScene( geometry, -80, 50, FLOOR, 0 ) };
-					
+
 				//loader.loadAscii( { model: "obj/male02/Male02_slim.js", callback: callbackMale } );
 				//loader.loadAscii( { model: "obj/female02/Female02_slim.js", callback: callbackFemale } );
-				
+
 				loader.loadBinary( { model: "obj/male02/Male02_bin.js", callback: callbackMale } );
 				loader.loadBinary( { model: "obj/female02/Female02_bin.js", callback: callbackFemale } );
 
@@ -246,7 +240,7 @@
 					xc.fillText(i, 10, 64);
 
 					var xm = new THREE.MeshBasicMaterial( { map: new THREE.Texture( x ) } );
-					xm.map.image.loaded = 1;
+					xm.map.needsUpdate = true;
 
 					mesh = new THREE.Mesh( new Plane( size, size ), xm );
 					mesh.position.x = i * (size + 5) - ( ( materials.length - 1 )* ( size + 5 )/2);
@@ -267,7 +261,18 @@
 
 			}
 
-			function loop() {
+			//
+
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+				stats.update();
+
+			}
+
+			function render() {
 
 				camera.position.x += ( mouseX - camera.position.x ) * .05;
 				camera.position.y += ( - mouseY - camera.position.y ) * .05;
@@ -281,8 +286,6 @@
 				if ( render_canvas ) canvasRenderer.render( scene, camera );
 				if ( render_gl && has_gl ) webglRenderer.render( scene, camera );
 
-				stats.update();
-
 			}
 
 			function log( text ) {

+ 49 - 38
examples/particles_billboards_gl.html → examples/webgl_particles_billboards.html

@@ -1,47 +1,49 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - particles - billboards - webgl</title>
+		<title>three.js webgl - particles - billboards</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
 				background-color: #000000;
 				margin: 0px;
 				overflow: hidden;
-                font-family:Monospace;
-                font-size:13px;
-                text-align:center;
-                font-weight: bold;
+				font-family:Monospace;
+				font-size:13px;
+				text-align:center;
+				font-weight: bold;
 				text-align:center;
 			}
 
 			a {
 				color:#0078ff;
 			}
-			
-            #info {
+
+			#info {
 				color:#fff;
-                position: absolute;
-                top: 0px; width: 100%;
-                padding: 5px;
+				position: absolute;
+				top: 0px; width: 100%;
+				padding: 5px;
 				z-index:100;
-				
-            }
-			
+			}
+
 		</style>
 	</head>
 	<body>
-	
-        <div id="info">
+
+		<div id="info">
 			<a href="http://github.com/mrdoob/three.js" target="_blank">three.js</a> - webgl particle billboards example
 		</div>
 
-		<script type="text/javascript" src="../build/ThreeExtras.js"></script>
+		<script type="text/javascript" src="../build/Three.js"></script>
+
+		<script type="text/javascript" src="js/Detector.js"></script>
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
 		<script type="text/javascript" src="js/Stats.js"></script>
 
 		<script type="text/javascript">
-		
-			if ( ! THREE.Detector.webgl ) THREE.Detector.addGetWebGLMessage();
+
+			if ( ! Detector.webgl ) Detector.addGetWebGLMessage();
 
 			var container, stats;
 			var camera, scene, renderer, particles, geometry, material, i, h, color, sprite, size, x, y, z;
@@ -51,8 +53,7 @@
 			var windowHalfY = window.innerHeight / 2;
 
 			init();
-			setInterval( loop, 1000 / 60 );
-			//loop();
+			animate();
 
 			function init() {
 
@@ -64,19 +65,20 @@
 
 				scene = new THREE.Scene();
 				scene.fog = new THREE.FogExp2( 0x000000, 0.001 );
-				
+
 				geometry = new THREE.Geometry();
-				
+
 				sprite = ImageUtils.loadTexture( "textures/sprites/circle.png" );
-				
+
 				for ( i = 0; i < 5000; i++ ) {
 
 					x = 2000 * Math.random() - 1000;
 					y = 2000 * Math.random() - 1000;
 					z = 2000 * Math.random() - 1000;
+
 					vector = new THREE.Vector3( x, y, z );
-					geometry.vertices.push( new THREE.Vertex( vector ) );					
-					
+					geometry.vertices.push( new THREE.Vertex( vector ) );
+
 				}
 
 				material = new THREE.ParticleBasicMaterial( { size: 35, map: sprite, blending: THREE.BillboardBlending } );
@@ -86,7 +88,7 @@
 				particles.sortParticles = true;
 				particles.updateMatrix();
 				scene.addObject( particles );
-				
+
 				var light = new THREE.DirectionalLight( 0xffffff );
 				light.position.x = 0;
 				light.position.y = 0;
@@ -105,14 +107,14 @@
 				document.addEventListener( 'mousemove', onDocumentMouseMove, false );
 				document.addEventListener( 'touchstart', onDocumentTouchStart, false );
 				document.addEventListener( 'touchmove', onDocumentTouchMove, false );
-				
+
 			}
 
 			function onDocumentMouseMove( event ) {
 
 				mouseX = event.clientX - windowHalfX;
 				mouseY = event.clientY - windowHalfY;
-				
+
 			}
 
 			function onDocumentTouchStart( event ) {
@@ -123,7 +125,7 @@
 
 					mouseX = event.touches[ 0 ].pageX - windowHalfX;
 					mouseY = event.touches[ 0 ].pageY - windowHalfY;
-					
+
 				}
 			}
 
@@ -135,33 +137,42 @@
 
 					mouseX = event.touches[ 0 ].pageX - windowHalfX;
 					mouseY = event.touches[ 0 ].pageY - windowHalfY;
-					
+
 				}
-				
+
 			}
 
-			function loop() {
+			//
+
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+				stats.update();
+
+			}
+
+			function render() {
 
 				var time = new Date().getTime() * 0.00005;
-				
+
 				camera.position.x += ( mouseX - camera.position.x ) * 0.05;
 				camera.position.y += ( - mouseY - camera.position.y ) * 0.05;
 
 				/*
 				for( i = 0; i < scene.objects.length; i++ ) {
-				
+
 					scene.objects[i].rotation.y = 5*time * ( i < 4 ? i+1 : - (i+1) );
-					
+
 				}
 				*/
 
 				h = ( 360 * ( 1.0 + time ) % 360 ) / 360;
 				material.color.setHSV( h, 0.75, 0.8 );
-					
-				
+
 				renderer.render( scene, camera );
 
-				stats.update();
 			}
 
 		</script>

+ 47 - 36
examples/particles_billboards_colors_gl.html → examples/webgl_particles_billboards_colors.html

@@ -1,47 +1,49 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - particles - billboards - colors - webgl</title>
+		<title>three.js webgl - particles - billboards - colors</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
 				background-color: #000000;
 				margin: 0px;
 				overflow: hidden;
-                font-family:Monospace;
-                font-size:13px;
-                text-align:center;
-                font-weight: bold;
+				font-family:Monospace;
+				font-size:13px;
+				text-align:center;
+				font-weight: bold;
 				text-align:center;
 			}
 
 			a {
 				color:#0078ff;
 			}
-			
-            #info {
+
+			#info {
 				color:#fff;
-                position: absolute;
-                top: 0px; width: 100%;
-                padding: 5px;
+				position: absolute;
+				top: 0px; width: 100%;
+				padding: 5px;
 				z-index:100;
-				
-            }
-			
+			}
+
 		</style>
 	</head>
 	<body>
-	
-        <div id="info">
+
+		<div id="info">
 			<a href="http://github.com/mrdoob/three.js" target="_blank">three.js</a> - webgl particle billboards colors example
 		</div>
 
-		<script type="text/javascript" src="../build/ThreeExtras.js"></script>
+		<script type="text/javascript" src="../build/Three.js"></script>
+
+		<script type="text/javascript" src="js/Detector.js"></script>
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
 		<script type="text/javascript" src="js/Stats.js"></script>
 
 		<script type="text/javascript">
-		
-			if ( ! THREE.Detector.webgl ) THREE.Detector.addGetWebGLMessage();
+
+			if ( ! Detector.webgl ) Detector.addGetWebGLMessage();
 
 			var container, stats;
 			var camera, scene, renderer, particles, geometry, material, i, h, color, colors = [], sprite, size, x, y, z;
@@ -51,8 +53,7 @@
 			var windowHalfY = window.innerHeight / 2;
 
 			init();
-			setInterval( loop, 1000 / 60 );
-			//loop();
+			animate();
 
 			function init() {
 
@@ -64,11 +65,11 @@
 
 				scene = new THREE.Scene();
 				scene.fog = new THREE.FogExp2( 0x000000, 0.0009 );
-				
+
 				geometry = new THREE.Geometry();
-				
+
 				sprite = ImageUtils.loadTexture( "textures/sprites/ball.png" );
-				
+
 				for ( i = 0; i < 5000; i++ ) {
 
 					x = 2000 * Math.random() - 1000;
@@ -76,12 +77,12 @@
 					z = 2000 * Math.random() - 1000;
 					vector = new THREE.Vector3( x, y, z );
 					geometry.vertices.push( new THREE.Vertex( vector ) );
-					
+
 					colors[ i ] = new THREE.Color( 0xffffff );
 					colors[ i ].setHSV( (x+1000)/2000, 1.0, 1.0 );
-					
+
 				}
-				
+
 				geometry.colors = colors;
 
 				material = new THREE.ParticleBasicMaterial( { size: 35, map: sprite, blending: THREE.BillboardBlending, vertex_colors: true } );
@@ -91,7 +92,7 @@
 				particles.sortParticles = true;
 				particles.updateMatrix();
 				scene.addObject( particles );
-				
+
 				var light = new THREE.DirectionalLight( 0xffffff );
 				light.position.x = 0;
 				light.position.y = 0;
@@ -110,14 +111,14 @@
 				document.addEventListener( 'mousemove', onDocumentMouseMove, false );
 				document.addEventListener( 'touchstart', onDocumentTouchStart, false );
 				document.addEventListener( 'touchmove', onDocumentTouchMove, false );
-				
+
 			}
 
 			function onDocumentMouseMove( event ) {
 
 				mouseX = event.clientX - windowHalfX;
 				mouseY = event.clientY - windowHalfY;
-				
+
 			}
 
 			function onDocumentTouchStart( event ) {
@@ -128,7 +129,7 @@
 
 					mouseX = event.touches[ 0 ].pageX - windowHalfX;
 					mouseY = event.touches[ 0 ].pageY - windowHalfY;
-					
+
 				}
 			}
 
@@ -140,24 +141,34 @@
 
 					mouseX = event.touches[ 0 ].pageX - windowHalfX;
 					mouseY = event.touches[ 0 ].pageY - windowHalfY;
-					
+
 				}
-				
+
+			}
+
+			//
+
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+				stats.update();
+
 			}
 
-			function loop() {
+			function render() {
 
 				var time = new Date().getTime() * 0.00005;
-				
+
 				camera.position.x += ( mouseX - camera.position.x ) * 0.05;
 				camera.position.y += ( - mouseY - camera.position.y ) * 0.05;
 
 				h = ( 360 * ( 1.0 + time ) % 360 ) / 360;
 				material.color.setHSV( h, 0.8, 1.0 );
-				
+
 				renderer.render( scene, camera );
 
-				stats.update();
 			}
 
 		</script>

+ 54 - 42
examples/particles_random_gl.html → examples/webgl_particles_random.html

@@ -1,47 +1,49 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - particles - webgl</title>
+		<title>three.js webgl - particles</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
 				background-color: #000000;
 				margin: 0px;
 				overflow: hidden;
-                font-family:Monospace;
-                font-size:13px;
-                text-align:center;
-                font-weight: bold;
+				font-family:Monospace;
+				font-size:13px;
+				text-align:center;
+				font-weight: bold;
 				text-align:center;
 			}
 
 			a {
 				color:#0078ff;
 			}
-			
-            #info {
-				color:#fff;
-                position: absolute;
-                top: 0px; width: 100%;
-                padding: 5px;
-				z-index:100;
-				
-            }
-			
+
+			#info {
+				color: #fff;
+				position: absolute;
+				top: 0px; width: 100%;
+				padding: 5px;
+				z-index: 100;
+			}
+
 		</style>
 	</head>
 	<body>
-	
+
         <div id="info">
 			<a href="http://github.com/mrdoob/three.js" target="_blank">three.js</a> - webgl particles example
 		</div>
 
-		<script type="text/javascript" src="../build/ThreeExtras.js"></script>
+		<script type="text/javascript" src="../build/Three.js"></script>
+
+		<script type="text/javascript" src="js/Detector.js"></script>
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
 		<script type="text/javascript" src="js/Stats.js"></script>
 
 		<script type="text/javascript">
-		
-			if ( ! THREE.Detector.webgl ) THREE.Detector.addGetWebGLMessage();
+
+			if ( ! Detector.webgl ) Detector.addGetWebGLMessage();
 
 			var container, stats;
 			var camera, scene, renderer, particles, geometry, materials = [], parameters, i, h, color;
@@ -51,7 +53,7 @@
 			var windowHalfY = window.innerHeight / 2;
 
 			init();
-			setInterval( loop, 1000 / 60 );
+			animate();
 
 			function init() {
 
@@ -63,27 +65,27 @@
 
 				scene = new THREE.Scene();
 				scene.fog = new THREE.FogExp2( 0x000000, 0.0007 );
-				
+
 				geometry = new THREE.Geometry();
-				
+
 				for ( i = 0; i < 4000; i++ ) {
 
 					vector = new THREE.Vector3( Math.random() * 2000 - 1000, Math.random() * 2000 - 1000, Math.random() * 2000 - 1000 );
-					geometry.vertices.push( new THREE.Vertex( vector ) );					
-					
+					geometry.vertices.push( new THREE.Vertex( vector ) );
+
 				}
 
 				parameters = [ [ [1.0, 1.0, 1.0], 5 ], [ [0.95, 1, 1], 4 ], [ [0.90, 1, 1], 3 ], [ [0.85, 1, 1], 2 ], [ [0.80, 1, 1], 1 ] ];
 				//parameters = [ [ 0xff0000, 5 ], [ 0xff3300, 4 ], [ 0xff6600, 3 ], [ 0xff9900, 2 ], [ 0xffaa00, 1 ] ];
 				//parameters = [ [ 0xffffff, 5 ], [ 0xdddddd, 4 ], [ 0xaaaaaa, 3 ], [ 0x999999, 2 ], [ 0x777777, 1 ] ];
-				
+
 				for ( i = 0; i < parameters.length; i++ ) {
 
 					size  = parameters[i][1];
 					color = parameters[i][0];
-					
+
 					//materials[i] = new THREE.ParticleBasicMaterial( { color: color, size: size } );
-					
+
 					materials[i] = new THREE.ParticleBasicMaterial( { size: size } );
 					materials[i].color.setHSV( color[0], color[1], color[2] );
 
@@ -92,7 +94,7 @@
 					particles.rotation.y = Math.random() * 6;
 					particles.rotation.z = Math.random() * 6;
 					scene.addObject( particles );
-					
+
 				}
 
 				renderer = new THREE.WebGLRenderer();
@@ -107,14 +109,14 @@
 				document.addEventListener( 'mousemove', onDocumentMouseMove, false );
 				document.addEventListener( 'touchstart', onDocumentTouchStart, false );
 				document.addEventListener( 'touchmove', onDocumentTouchMove, false );
-				
+
 			}
 
 			function onDocumentMouseMove( event ) {
 
 				mouseX = event.clientX - windowHalfX;
 				mouseY = event.clientY - windowHalfY;
-				
+
 			}
 
 			function onDocumentTouchStart( event ) {
@@ -125,7 +127,7 @@
 
 					mouseX = event.touches[ 0 ].pageX - windowHalfX;
 					mouseY = event.touches[ 0 ].pageY - windowHalfY;
-					
+
 				}
 			}
 
@@ -137,36 +139,46 @@
 
 					mouseX = event.touches[ 0 ].pageX - windowHalfX;
 					mouseY = event.touches[ 0 ].pageY - windowHalfY;
-					
+
 				}
-				
+
+			}
+
+			//
+
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+				stats.update();
+
 			}
 
-			function loop() {
+			function render() {
 
 				var time = new Date().getTime() * 0.00005;
-				
+
 				camera.position.x += ( mouseX - camera.position.x ) * 0.05;
 				camera.position.y += ( - mouseY - camera.position.y ) * 0.05;
 
 				for( i = 0; i < scene.objects.length; i++ ) {
-				
+
 					scene.objects[i].rotation.y = time * ( i < 4 ? i+1 : - (i+1) );
-					
+
 				}
 
 				for( i = 0; i < materials.length; i++ ) {
-					
+
 					color = parameters[i][0];
-					
+
 					h = ( 360 * ( color[0] + time ) % 360 ) / 360;
 					materials[i].color.setHSV( h, color[1], color[2] );
-					
+
 				}
-				
+
 				renderer.render( scene, camera );
 
-				stats.update();
 			}
 
 

+ 53 - 41
examples/particles_sprites_gl.html → examples/webgl_particles_sprites.html

@@ -1,48 +1,50 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - particles - sprites - webgl</title>
+		<title>three.js webgl - particles - sprites</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
 				background-color: #000000;
 				margin: 0px;
 				overflow: hidden;
-                font-family:Monospace;
-                font-size:13px;
-                text-align:center;
-                font-weight: bold;
+				font-family:Monospace;
+				font-size:13px;
+				text-align:center;
+				font-weight: bold;
 				text-align:center;
 			}
 
 			a {
 				color:#0078ff;
 			}
-			
-            #info {
+
+			#info {
 				color:#fff;
-                position: absolute;
-                top: 0px; width: 100%;
-                padding: 5px;
+				position: absolute;
+				top: 0px; width: 100%;
+				padding: 5px;
 				z-index:100;
-				
-            }
-			
+			}
+
 		</style>
 	</head>
 	<body>
-	
+
         <div id="info">
 			<a href="http://github.com/mrdoob/three.js" target="_blank">three.js</a> - webgl particle sprites example -
 			snowflakes by <a href="http://en.wikipedia.org/wiki/File:Sketch_of_snow_crystal_by_Ren%C3%A9_Descartes.jpg">Ren&eacute;  Descartes</a>
 		</div>
 
-		<script type="text/javascript" src="../build/ThreeExtras.js"></script>
+		<script type="text/javascript" src="../build/Three.js"></script>
+
+		<script type="text/javascript" src="js/Detector.js"></script>
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
 		<script type="text/javascript" src="js/Stats.js"></script>
 
 		<script type="text/javascript">
-		
-			if ( ! THREE.Detector.webgl ) THREE.Detector.addGetWebGLMessage();
+
+			if ( ! Detector.webgl ) Detector.addGetWebGLMessage();
 
 			var container, stats;
 			var camera, scene, renderer, particles, geometry, materials = [], parameters, i, h, color, sprite, size;
@@ -52,7 +54,7 @@
 			var windowHalfY = window.innerHeight / 2;
 
 			init();
-			setInterval( loop, 1000 / 60 );
+			animate();
 
 			function init() {
 
@@ -64,31 +66,31 @@
 
 				scene = new THREE.Scene();
 				scene.fog = new THREE.FogExp2( 0x000000, 0.0008 );
-				
+
 				geometry = new THREE.Geometry();
-				
+
 				sprite1 = ImageUtils.loadTexture( "textures/sprites/snowflake1.png" );
 				sprite2 = ImageUtils.loadTexture( "textures/sprites/snowflake2.png" );
 				sprite3 = ImageUtils.loadTexture( "textures/sprites/snowflake3.png" );
 				sprite4 = ImageUtils.loadTexture( "textures/sprites/snowflake4.png" );
 				sprite5 = ImageUtils.loadTexture( "textures/sprites/snowflake5.png" );
-				
+
 				for ( i = 0; i < 2000; i++ ) {
 
 					vector = new THREE.Vector3( Math.random() * 2000 - 1000, Math.random() * 2000 - 1000, Math.random() * 2000 - 1000 );
-					geometry.vertices.push( new THREE.Vertex( vector ) );					
-					
+					geometry.vertices.push( new THREE.Vertex( vector ) );
+
 				}
 
-				parameters = [ [ [1.0, 0.2, 1.0], sprite2, 20 ], [ [0.95, 0.1, 1], sprite3, 15 ], [ [0.90, 0.05, 1], sprite1, 10 ], [ [0.85, 0, 0.8], sprite5, 8 ], [ [0.80, 0, 0.7], sprite4, 5 ],			
+				parameters = [ [ [1.0, 0.2, 1.0], sprite2, 20 ], [ [0.95, 0.1, 1], sprite3, 15 ], [ [0.90, 0.05, 1], sprite1, 10 ], [ [0.85, 0, 0.8], sprite5, 8 ], [ [0.80, 0, 0.7], sprite4, 5 ],
 							   ];
-				
+
 				for ( i = 0; i < parameters.length; i++ ) {
 
 					color  = parameters[i][0];
 					sprite = parameters[i][1];
 					size   = parameters[i][2];
-					
+
 					materials[i] = new THREE.ParticleBasicMaterial( { size: size, map: sprite, blending: THREE.AdditiveBlending, depth_test: false } );
 					materials[i].color.setHSV( color[0], color[1], color[2] );
 
@@ -97,7 +99,7 @@
 					particles.rotation.y = Math.random() * 6;
 					particles.rotation.z = Math.random() * 6;
 					scene.addObject( particles );
-					
+
 				}
 
 				renderer = new THREE.WebGLRenderer( { clearAlpha: 1 });
@@ -112,14 +114,14 @@
 				document.addEventListener( 'mousemove', onDocumentMouseMove, false );
 				document.addEventListener( 'touchstart', onDocumentTouchStart, false );
 				document.addEventListener( 'touchmove', onDocumentTouchMove, false );
-				
+
 			}
 
 			function onDocumentMouseMove( event ) {
 
 				mouseX = event.clientX - windowHalfX;
 				mouseY = event.clientY - windowHalfY;
-				
+
 			}
 
 			function onDocumentTouchStart( event ) {
@@ -130,7 +132,7 @@
 
 					mouseX = event.touches[ 0 ].pageX - windowHalfX;
 					mouseY = event.touches[ 0 ].pageY - windowHalfY;
-					
+
 				}
 			}
 
@@ -142,36 +144,46 @@
 
 					mouseX = event.touches[ 0 ].pageX - windowHalfX;
 					mouseY = event.touches[ 0 ].pageY - windowHalfY;
-					
+
 				}
-				
+
+			}
+
+			//
+
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+				stats.update();
+
 			}
 
-			function loop() {
+			function render() {
 
 				var time = new Date().getTime() * 0.00005;
-				
+
 				camera.position.x += ( mouseX - camera.position.x ) * 0.05;
 				camera.position.y += ( - mouseY - camera.position.y ) * 0.05;
 
 				for( i = 0; i < scene.objects.length; i++ ) {
-				
+
 					scene.objects[i].rotation.y = time * ( i < 4 ? i+1 : - (i+1) );
-					
+
 				}
 
 				for( i = 0; i < materials.length; i++ ) {
-					
+
 					color = parameters[i][0];
-					
+
 					h = ( 360 * ( color[0] + time ) % 360 ) / 360;
 					materials[i].color.setHSV( h, color[1], color[2] );
-					
+
 				}
-				
+
 				renderer.render( scene, camera );
 
-				stats.update();
 			}
 
 

+ 217 - 0
examples/webgl_performance.html

@@ -0,0 +1,217 @@
+<!DOCTYPE HTML>
+<html lang="en">
+	<head>
+		<title>three.js webgl - performance</title>
+		<meta charset="utf-8">
+		<style type="text/css">
+			body {
+				background:#fff;
+				padding:0;
+				margin:0;
+				font-weight: bold;
+				overflow:hidden;
+			}
+		</style>
+	</head>
+	<body>
+
+		<!-- <script type="text/javascript" src="../build/Three.js"></script> -->
+
+		<script type="text/javascript" src="../src/Three.js"></script>
+		<script type="text/javascript" src="../src/core/Color.js"></script>
+		<script type="text/javascript" src="../src/core/Vector2.js"></script>
+		<script type="text/javascript" src="../src/core/Vector3.js"></script>
+		<script type="text/javascript" src="../src/core/Vector4.js"></script>
+		<script type="text/javascript" src="../src/core/Ray.js"></script>
+		<script type="text/javascript" src="../src/core/Rectangle.js"></script>
+		<script type="text/javascript" src="../src/core/Matrix3.js"></script>
+		<script type="text/javascript" src="../src/core/Matrix4.js"></script>
+		<script type="text/javascript" src="../src/core/Object3D.js"></script>
+		<script type="text/javascript" src="../src/core/Quaternion.js"></script>
+		<script type="text/javascript" src="../src/core/Vertex.js"></script>
+		<script type="text/javascript" src="../src/core/Face3.js"></script>
+		<script type="text/javascript" src="../src/core/Face4.js"></script>
+		<script type="text/javascript" src="../src/core/UV.js"></script>
+		<script type="text/javascript" src="../src/core/Geometry.js"></script>
+		<script type="text/javascript" src="../src/animation/AnimationHandler.js"></script>
+		<script type="text/javascript" src="../src/animation/Animation.js"></script>
+		<script type="text/javascript" src="../src/cameras/Camera.js"></script>
+		<script type="text/javascript" src="../src/cameras/QuakeCamera.js"></script>
+		<script type="text/javascript" src="../src/lights/Light.js"></script>
+		<script type="text/javascript" src="../src/lights/AmbientLight.js"></script>
+		<script type="text/javascript" src="../src/lights/DirectionalLight.js"></script>
+		<script type="text/javascript" src="../src/lights/PointLight.js"></script>
+		<script type="text/javascript" src="../src/materials/Material.js"></script>
+		<script type="text/javascript" src="../src/materials/Mappings.js"></script>
+		<script type="text/javascript" src="../src/materials/LineBasicMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/MeshBasicMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/MeshLambertMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/MeshPhongMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/MeshDepthMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/MeshNormalMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/MeshFaceMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/MeshShaderMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/ParticleBasicMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/ParticleCircleMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/ParticleDOMMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/Texture.js"></script>
+		<script type="text/javascript" src="../src/materials/RenderTarget.js"></script>
+		<script type="text/javascript" src="../src/materials/Uniforms.js"></script>
+		<script type="text/javascript" src="../src/objects/Particle.js"></script>
+		<script type="text/javascript" src="../src/objects/ParticleSystem.js"></script>
+		<script type="text/javascript" src="../src/objects/Line.js"></script>
+		<script type="text/javascript" src="../src/objects/Mesh.js"></script>
+		<script type="text/javascript" src="../src/objects/Bone.js"></script>
+		<script type="text/javascript" src="../src/objects/SkinnedMesh.js"></script>
+		<script type="text/javascript" src="../src/objects/Ribbon.js"></script>
+		<script type="text/javascript" src="../src/objects/Sound.js"></script>
+		<script type="text/javascript" src="../src/scenes/Scene.js"></script>
+		<script type="text/javascript" src="../src/scenes/Fog.js"></script>
+		<script type="text/javascript" src="../src/scenes/FogExp2.js"></script>
+		<script type="text/javascript" src="../src/renderers/Projector.js"></script>
+		<script type="text/javascript" src="../src/renderers/DOMRenderer.js"></script>
+		<script type="text/javascript" src="../src/renderers/CanvasRenderer.js"></script>
+		<script type="text/javascript" src="../src/renderers/SVGRenderer.js"></script>
+		<script type="text/javascript" src="../src/renderers/WebGLRenderer.js"></script>
+		<script type="text/javascript" src="../src/renderers/SoundRenderer.js"></script>
+		<script type="text/javascript" src="../src/renderers/renderables/RenderableObject.js"></script>
+		<script type="text/javascript" src="../src/renderers/renderables/RenderableFace3.js"></script>
+		<script type="text/javascript" src="../src/renderers/renderables/RenderableParticle.js"></script>
+		<script type="text/javascript" src="../src/renderers/renderables/RenderableLine.js"></script>
+		<script type="text/javascript" src="../src/extras/GeometryUtils.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/ShaderUtils.js"></script>
+		<script type="text/javascript" src="../src/extras/primitives/Cube.js"></script>
+		<script type="text/javascript" src="../src/extras/primitives/Cylinder.js"></script>
+		<script type="text/javascript" src="../src/extras/primitives/Plane.js"></script>
+		<script type="text/javascript" src="../src/extras/primitives/Sphere.js"></script>
+		<script type="text/javascript" src="../src/extras/primitives/Torus.js"></script>
+		<script type="text/javascript" src="../src/extras/primitives/Icosahedron.js"></script>
+		<script type="text/javascript" src="../src/extras/primitives/LathedObject.js"></script>
+		<script type="text/javascript" src="../src/extras/objects/MarchingCubes.js"></script>
+		<script type="text/javascript" src="../src/extras/io/Loader.js"></script>
+
+		<script type="text/javascript" src="js/Stats.js"></script>
+
+		<script type="text/javascript">
+
+			var container, stats;
+
+			var camera, scene, renderer;
+
+			var mesh, zmesh, lightMesh, geometry;
+
+			var mouseX = 0, mouseY = 0;
+
+			var windowHalfX = window.innerWidth / 2;
+			var windowHalfY = window.innerHeight / 2;
+
+			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( 60, window.innerWidth / window.innerHeight, 1, 10000 );
+				camera.position.z = 3200;
+
+				scene = new THREE.Scene();
+
+				var geometry = new Cube( 50, 50, 50 );
+				var material = new THREE.MeshNormalMaterial();
+
+				for ( var i = 0; i < 5000; i ++ ) {
+
+					var mesh = new THREE.Mesh( geometry, material );
+					mesh.position.x = Math.random() * 10000 - 5000;
+					mesh.position.y = Math.random() * 10000 - 5000;
+					mesh.position.z = Math.random() * 10000 - 5000;
+					mesh.rotation.x = Math.random() * 360 * ( Math.PI / 180 );
+					mesh.rotation.y = Math.random() * 360 * ( Math.PI / 180 );
+					mesh.scale.x = mesh.scale.y = mesh.scale.z = Math.random() * 4 + 1;
+					mesh.updateMatrix();
+					mesh.autoUpdateMatrix = false;
+					scene.addObject( mesh );
+
+				}
+
+				renderer = new THREE.WebGLRenderer();
+				renderer.setSize( window.innerWidth, window.innerHeight );
+				renderer.sortObjects = false;
+				container.appendChild( renderer.domElement );
+
+				stats = new Stats();
+				stats.domElement.style.position = 'absolute';
+				stats.domElement.style.top = '0px';
+				stats.domElement.style.zIndex = 100;
+				container.appendChild( stats.domElement );
+
+			}
+
+			function generateTexture( r, g, b ) {
+
+				var canvas = document.createElement( 'canvas' );
+				canvas.loaded = true;
+				canvas.width = 256;
+				canvas.height = 256;
+
+				var context = canvas.getContext( '2d' );
+				var image = context.getImageData( 0, 0, 256, 256 );
+
+				var x = 0, y = 0, p;
+
+				for ( var i = 0, j = 0, l = image.data.length; i < l; i += 4, j ++ ) {
+
+					x = j % 256;
+					y = x == 0 ? y + 1 : y;
+					p = Math.floor( x ^ y );
+
+					image.data[ i ] = ~~ p * r;
+					image.data[ i + 1 ] = ~~ p * g;
+					image.data[ i + 2 ] = ~~ p * b;
+					image.data[ i + 3 ] = 255;
+
+				}
+
+				context.putImageData( image, 0, 0 );
+
+				return canvas;
+
+			}
+
+			function onDocumentMouseMove(event) {
+
+				mouseX = ( event.clientX - windowHalfX ) * 10;
+				mouseY = ( event.clientY - windowHalfY ) * 10;
+
+			}
+
+			function loop() {
+
+				camera.position.x += ( mouseX - camera.position.x ) * .05;
+				camera.position.y += ( - mouseY - camera.position.y ) * .05;
+
+				renderer.render( scene, camera );
+
+				stats.update();
+
+			}
+
+			function log( text ) {
+
+				var e = document.getElementById("log");
+				e.innerHTML = text + "<br/>" + e.innerHTML;
+
+			}
+
+		</script>
+
+	</body>
+</html>

+ 158 - 149
examples/postprocessing.html → examples/webgl_postprocessing.html

@@ -1,95 +1,102 @@
 <!DOCTYPE HTML>
 <html lang="en">
-    <head>
-        <title>three.js - postprocessing - webgl</title>
-        <meta charset="utf-8">
-        <style type="text/css">
-            body {
-                color: #000;
-                font-family:Monospace;
-                font-size:13px;
-                text-align:center;
-                font-weight: bold;
-
-                background-color: #fff;
-                margin: 0px;
-                overflow: hidden;
-            }
-
-            #info {
-				color:#000;
-                position: absolute;
-                top: 0px; width: 100%;
-                padding: 5px;
-				
-            }
-
-            a { color: red; }
-
-        </style>
-    </head>
-    <body>
-
-        <div id="container"></div>
-        <div id="info">
+	<head>
+		<title>three.js webgl - postprocessing</title>
+		<meta charset="utf-8">
+		<style type="text/css">
+		    body {
+			color: #000;
+			font-family:Monospace;
+			font-size:13px;
+			text-align:center;
+			font-weight: bold;
+
+			background-color: #fff;
+			margin: 0px;
+			overflow: hidden;
+		    }
+
+		    #info {
+					color:#000;
+			position: absolute;
+			top: 0px; width: 100%;
+			padding: 5px;
+
+		    }
+
+		    a { color: red; }
+
+		</style>
+	</head>
+	<body>
+
+		<div id="container"></div>
+		<div id="info">
 			<a href="http://github.com/mrdoob/three.js" target="_blank">three.js</a> - webgl postprocessing example -
 			<a href="http://www.ir-ltd.net/infinite-3d-head-scan-released/" target="_blank">Lee Perry-Smith</a> head
 		</div>
 
-        <script type="text/javascript" src="js/Stats.js"></script>
-        <script type="text/javascript" src="../build/ThreeExtras.js"></script>
+		<script type="text/javascript" src="../build/Three.js"></script>
+
+		<script type="text/javascript" src="js/Detector.js"></script>
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
+		<script type="text/javascript" src="js/Stats.js"></script>
 
 		<!-- Time modulated procedural color fragment shader -->
-        <script id="fs-colors" type="x-shader/x-fragment">
+		<script id="fs-colors" type="x-shader/x-fragment">
 			varying vec2 vUv;
 			uniform float time;
-			
-            void main(void)
-            {
-                gl_FragColor = vec4( time, vUv.x, vUv.y, 1.0 );
-            }
-        </script>
+
+			void main(void) {
+
+				gl_FragColor = vec4( time, vUv.x, vUv.y, 1.0 );
+
+			}
+		</script>
 
 		<!-- Generic vertex shader -->
-        <script id="vs-generic" type="x-shader/x-vertex">
-            varying vec2 vUv;
+		<script id="vs-generic" type="x-shader/x-vertex">
+			varying vec2 vUv;
 
-            void main()
-            {
-               vUv = vec2( uv.x, 1.0 - uv.y );
-			   gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );
-           }
-        </script>
+			void main() {
 
+				vUv = vec2( uv.x, 1.0 - uv.y );
+				gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );
+
+			}
+		</script>
 
-        <script type="text/javascript">
 
-			if ( ! THREE.Detector.webgl ) THREE.Detector.addGetWebGLMessage();
+		<script type="text/javascript">
 
-            var container, stats;
+			if ( ! Detector.webgl ) Detector.addGetWebGLMessage();
+
+			var container, stats;
+
+			var cameraOrtho, cameraPerspective, sceneModel, sceneScreen, sceneBG, renderer, mesh, directionalLight;
 
-            var cameraOrtho, cameraPerspective, sceneModel, sceneScreen, sceneBG, renderer, mesh, directionalLight;
-			
 			var windowHalfX = window.innerWidth / 2;
 			var windowHalfY = window.innerHeight / 2;
-			
-            var rtTexture, materialColor, materialScreen, materialFilm, materialConvolution, blurx, blury, quadBG, quadScreen;
 
-            init();
-            setInterval( loop, 1000 / 60 );
+			var rtTexture, materialColor, materialScreen, materialFilm, materialConvolution, blurx, blury, quadBG, quadScreen;
+
+			var delta = 0.01;
 
-            function init() {
+			init();
+			animate();
 
-                container = document.getElementById( 'container' );
+			function init() {
 
-                cameraOrtho = new THREE.Camera();
+				container = document.getElementById( 'container' );
+
+				cameraOrtho = new THREE.Camera();
 				cameraOrtho.projectionMatrix = THREE.Matrix4.makeOrtho( window.innerWidth / - 2, window.innerWidth / 2, window.innerHeight / 2, window.innerHeight / - 2, -10000, 10000 );
-                cameraOrtho.position.z = 100;
+				cameraOrtho.position.z = 100;
 
 				cameraPerspective = new THREE.Camera( 50, window.innerWidth / window.innerHeight, 1, 10000 );
 				cameraPerspective.position.z = 900;
 
-                sceneModel = new THREE.Scene();
+				sceneModel = new THREE.Scene();
 				sceneScreen = new THREE.Scene();
 				sceneBG = new THREE.Scene();
 
@@ -100,108 +107,110 @@
 				directionalLight.position.normalize();
 				sceneModel.addLight( directionalLight );
 
-                rtTexture1 = new THREE.RenderTarget( window.innerWidth, window.innerHeight, { min_filter: THREE.LinearFilter, mag_filter: THREE.NearestFilter } );
-                rtTexture2 = new THREE.RenderTarget( 256, 512, { min_filter: THREE.LinearFilter, mag_filter: THREE.LinearFilter } );
-                rtTexture3 = new THREE.RenderTarget( 512, 256, { min_filter: THREE.LinearFilter, mag_filter: THREE.LinearFilter } );
+				rtTexture1 = new THREE.RenderTarget( window.innerWidth, window.innerHeight, { min_filter: THREE.LinearFilter, mag_filter: THREE.NearestFilter } );
+				rtTexture2 = new THREE.RenderTarget( 256, 512, { min_filter: THREE.LinearFilter, mag_filter: THREE.LinearFilter } );
+				rtTexture3 = new THREE.RenderTarget( 512, 256, { min_filter: THREE.LinearFilter, mag_filter: THREE.LinearFilter } );
 
-                materialColor = new THREE.MeshShaderMaterial( {
+				materialColor = new THREE.MeshShaderMaterial( {
 
-                    uniforms: { time: { type: "f", value: 0.0 } },
-                    vertex_shader: getText( 'vs-generic' ),
-                    fragment_shader: getText( 'fs-colors' ),
+					uniforms: { time: { type: "f", value: 0.0 } },
+					vertex_shader: getText( 'vs-generic' ),
+					fragment_shader: getText( 'fs-colors' ),
 					depth_test: false
-					
-                } );
+
+				} );
 
 				var screen_shader = ShaderUtils.lib["screen"];
 				var screen_uniforms = Uniforms.clone( screen_shader.uniforms );
-				
+
 				screen_uniforms["tDiffuse"].texture = rtTexture1;
 				screen_uniforms["opacity"].value = 0.4;
-				
-                materialScreen = new THREE.MeshShaderMaterial( {
 
-                    uniforms: screen_uniforms,
-                    vertex_shader: screen_shader.vertex_shader,
-                    fragment_shader: screen_shader.fragment_shader,
+				materialScreen = new THREE.MeshShaderMaterial( {
+
+					uniforms: screen_uniforms,
+					vertex_shader: screen_shader.vertex_shader,
+					fragment_shader: screen_shader.fragment_shader,
 					blending: THREE.AdditiveBlending
 
-                } );
+				} );
 
 				var film_shader = ShaderUtils.lib["film"];
 				var film_uniforms = Uniforms.clone( film_shader.uniforms );
-				
+
 				film_uniforms["tDiffuse"].texture = rtTexture1;
-				
-                materialFilm = new THREE.MeshShaderMaterial( {
+				film_uniforms["nIntensity"].value = 0.25;
+				film_uniforms["sIntensity"].value = 0.5;
 
-                    uniforms: film_uniforms,
-                    vertex_shader: film_shader.vertex_shader,
-                    fragment_shader: film_shader.fragment_shader
+				materialFilm = new THREE.MeshShaderMaterial( {
 
-                } );
+					uniforms: film_uniforms,
+					vertex_shader: film_shader.vertex_shader,
+					fragment_shader: film_shader.fragment_shader
 
+				} );
 
 				var increment = 0.001953125;
-				
+
 				blurx = new THREE.Vector2( increment, 0.0 ),
 				blury = new THREE.Vector2( 0.0, increment );
-				
+
 				var convolution_shader = ShaderUtils.lib["convolution"];
 				var convolution_uniforms = Uniforms.clone( convolution_shader.uniforms );
-				
+
 				convolution_uniforms["tDiffuse"].texture = rtTexture1;
 				convolution_uniforms["uImageIncrement"].value = blurx;
 				convolution_uniforms["cKernel"].value = ShaderUtils.buildKernel( 4.0 );
-				
-                materialConvolution = new THREE.MeshShaderMaterial( {
 
-                    uniforms: convolution_uniforms,
-                    vertex_shader:   "#define KERNEL_SIZE 25.0\n" + convolution_shader.vertex_shader,
-                    fragment_shader: "#define KERNEL_SIZE 25\n"   + convolution_shader.fragment_shader
+				materialConvolution = new THREE.MeshShaderMaterial( {
+
+					uniforms: convolution_uniforms,
+					vertex_shader:   "#define KERNEL_SIZE 25.0\n" + convolution_shader.vertex_shader,
+					fragment_shader: "#define KERNEL_SIZE 25\n"   + convolution_shader.fragment_shader
 
-                } );
+				} );
 
 				var plane = new Plane( window.innerWidth, window.innerHeight );
-				
-                quadBG = new THREE.Mesh( plane, materialColor );
+
+				quadBG = new THREE.Mesh( plane, materialColor );
 				quadBG.position.z = -500;
-                sceneBG.addObject( quadBG );
+				sceneBG.addObject( quadBG );
 
 				loader = new THREE.Loader( true );
 				document.body.appendChild( loader.statusDomElement );
 				loader.loadAscii( { model: "obj/leeperrysmith/LeePerrySmith.js", callback: function( geometry ) { createMesh( geometry, sceneModel, 100 ) } } );
-				
-                quadScreen = new THREE.Mesh( plane, materialConvolution );
+
+				quadScreen = new THREE.Mesh( plane, materialConvolution );
 				quadScreen.position.z = -100;
-                sceneScreen.addObject( quadScreen );
+				sceneScreen.addObject( quadScreen );
 
-                renderer = new THREE.WebGLRenderer();
+				renderer = new THREE.WebGLRenderer();
 				renderer.setSize( window.innerWidth, window.innerHeight );
 				renderer.autoClear = false;
-                container.appendChild( renderer.domElement );
-				
-                stats = new Stats();
-                stats.domElement.style.position = 'absolute';
-                stats.domElement.style.top = '0px';
-                //container.appendChild( stats.domElement );
+				container.appendChild( renderer.domElement );
+
+				stats = new Stats();
+				stats.domElement.style.position = 'absolute';
+				stats.domElement.style.top = '0px';
+				//container.appendChild( stats.domElement );
 
-            }
+			}
 
 			function getText( id ) {
-				
+
 				return document.getElementById( id ).textContent;
+
 			}
-			
+
 			function createMesh( geometry, scene, scale ) {
 
 				geometry.computeTangents();
-				
+
 				var ambient = 0x444444, diffuse = 0x888888, specular = 0x080810, shininess = 2;
 
 				var shader = ShaderUtils.lib[ "normal" ];
 				var uniforms = Uniforms.clone( shader.uniforms );
- 
+
 				uniforms[ "tNormal" ].texture = ImageUtils.loadTexture( "obj/leeperrysmith/Infinite-Level_02_Tangent_SmoothUV.jpg" );
 				uniforms[ "uNormalScale" ].value = - 0.75;
 
@@ -226,7 +235,7 @@
 
 				var parameters = { fragment_shader: shader.fragment_shader, vertex_shader: shader.vertex_shader, uniforms: uniforms };
 				var mat2 = new THREE.MeshShaderMaterial( parameters );
-				
+
 				mesh = new THREE.Mesh( geometry, mat2 );
 				mesh.position.x = 0;
 				mesh.position.y = -50;
@@ -234,63 +243,66 @@
 				mesh.scale.x = mesh.scale.y = mesh.scale.z = scale;
 				mesh.updateMatrix();
 				scene.addObject( mesh );
-				
+
 				loader.statusDomElement.style.display = "none";
 
 			}
 
-			var delta = 0.01;
-			var start = 0;
-			
-            function loop() {
+			//
 
-				if ( ! start ) start = new Date().getTime();
-				var time = ( new Date().getTime() - start ) * 0.0004;
+			function animate() {
 
-				if ( mesh  ) {
-				
-					mesh.rotation.y = -time;
+				requestAnimationFrame( animate );
+
+				render();
+				stats.update();
+
+			}
+
+			function render() {
+
+				var time = new Date().getTime() * 0.0004;
+
+				if ( mesh ) mesh.rotation.y = -time;
 
-				}
-				
 				if ( materialColor.uniforms.time.value > 1 || materialColor.uniforms.time.value < 0 ) {
-				
+
 					delta *= -1;
-					
+
 				}
-					
+
 				materialColor.uniforms.time.value += delta/2;
 				materialFilm.uniforms.time.value += delta;
-				
+
 				renderer.clear();
-				
+
 				// Render scene into texture
-				
-				// background 
-				
+
+				// background
+
 				renderer.render( sceneBG, cameraOrtho, rtTexture1 );
-				
+
 				// model
-				
-                renderer.render( sceneModel, cameraPerspective, rtTexture1 );
+
+				renderer.render( sceneModel, cameraPerspective, rtTexture1 );
 
 				// Render quad with blured scene into texture (convolution pass 1)
-				
+
 				quadScreen.materials = [ materialConvolution ];
 				materialConvolution.uniforms.tDiffuse.texture = rtTexture1;
 				materialConvolution.uniforms.uImageIncrement.value = blurx;
 				renderer.render( sceneScreen, cameraOrtho, rtTexture2 );
-				
+
 				// Render quad with blured scene into texture (convolution pass 2)
-				
+
 				materialConvolution.uniforms.tDiffuse.texture = rtTexture2;
 				materialConvolution.uniforms.uImageIncrement.value = blury;
 				renderer.render( sceneScreen, cameraOrtho, rtTexture3 );
-				
+
 				// Render original scene with superimposed blur into texture
-				
+
 				quadScreen.materials = [ materialScreen ];
-				
+
 				materialScreen.uniforms.tDiffuse.texture = rtTexture3;
 				materialScreen.uniforms.opacity.value = 1.0;
 				renderer.render( sceneScreen, cameraOrtho, rtTexture1, false );
@@ -301,12 +313,9 @@
 				quadScreen.materials = [ materialFilm ];
 				renderer.render( sceneScreen, cameraOrtho );
 
-                stats.update();
-
-            }			
-			
+			}
 
-        </script>
 
-    </body>
+		</script>
+	</body>
 </html>

+ 336 - 0
examples/webgl_postprocessing_dof.html

@@ -0,0 +1,336 @@
+<!DOCTYPE HTML>
+<html lang="en">
+	<head>
+		<title>three.js - postprocessing - depth-of-field - webgl</title>
+		<meta charset="utf-8">
+		<style type="text/css">
+			body {
+				background-color: #000000;
+				margin: 0px;
+				overflow: hidden;
+				font-family:Monospace;
+				font-size:13px;
+				text-align:center;
+				font-weight: bold;
+				text-align:center;
+			}
+
+			a {
+				color:#0078ff;
+			}
+
+			#info {
+				color:#fff;
+				position: absolute;
+				top: 0px; width: 100%;
+				padding: 5px;
+				z-index:100;
+			}
+		</style>
+	</head>
+
+	<body>
+		<script type="text/javascript" src="../build/Three.js"></script>
+
+		<script type="text/javascript" src="js/Detector.js"></script>
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
+		<script type="text/javascript" src="js/ShaderExtras.js"></script>
+		<script type="text/javascript" src="js/Stats.js"></script>
+
+		<link href="js/gui/gui.css" media="screen" rel="stylesheet" type="text/css" />
+		<script type="text/javascript" src="js/gui/gui.min.js"></script>
+
+        <div id="info">
+			<a href="http://github.com/mrdoob/three.js" target="_blank">three.js</a> - webgl depth-of-field with bokeh example -
+			shader by <a href="http://artmartinsh.blogspot.com/2010/02/glsl-lens-blur-filter-with-bokeh.html">Martins Upitis</a>
+		</div>
+
+
+		<script type="text/javascript">
+
+			if ( ! Detector.webgl ) Detector.addGetWebGLMessage();
+
+			var container, stats;
+			var camera, scene, renderer,
+				materials = [], objects = [],
+				singleMaterial, zmaterial = [],
+				parameters, i, j, k, h, color, x, y, z, s, n, nobjects,
+				material_depth, material_base, cubeMaterial;
+
+			var mouseX = 0, mouseY = 0;
+
+			var windowHalfX = window.innerWidth / 2;
+			var windowHalfY = window.innerHeight / 2;
+
+			var height = window.innerHeight - 300;
+
+			var postprocessing = { enabled  : true };
+
+			init();
+			animate();
+
+			function init() {
+
+				container = document.createElement( 'div' );
+				document.body.appendChild( container );
+
+				camera = new THREE.Camera( 70, window.innerWidth / height, 1, 3000 );
+				camera.position.z = 200;
+
+				scene = new THREE.Scene();
+
+				/*
+				var light = new THREE.DirectionalLight( 0xffffff );
+				light.position.set( 0, 0.5, 1 );
+				light.position.normalize();
+				scene.addLight( light );
+				*/
+
+				renderer = new THREE.WebGLRenderer();
+				renderer.setSize( window.innerWidth, height );
+				container.appendChild( renderer.domElement );
+
+				material_depth = new THREE.MeshDepthMaterial();
+
+				var path = "textures/cube/SwedishRoyalCastle/";
+				var format = '.jpg';
+				var urls = [
+						path + 'px' + format, path + 'nx' + format,
+						path + 'py' + format, path + 'ny' + format,
+						path + 'pz' + format, path + 'nz' + format
+					];
+
+				var textureCube = ImageUtils.loadTextureCube( urls );
+
+				parameters = { color: 0xff1100, env_map: textureCube, shading: THREE.FlatShading };
+				//parameters = { color: 0xff1100, shading: THREE.FlatShading };
+				cubeMaterial = new THREE.MeshBasicMaterial( parameters );
+
+				singleMaterial = false;
+
+				if( singleMaterial ) zmaterial = [ cubeMaterial ];
+
+				//var geo = new Cube( 1, 1, 1 );
+				var geo = new Sphere( 1, 20, 10 );
+				//var geo = new Icosahedron( 2 );
+
+				material_base = cubeMaterial;
+
+				renderer.initMaterial( material_base, scene.lights, scene.fog );
+
+				var xgrid = 14,
+					ygrid = 9,
+					zgrid = 14;
+
+				nobjects = xgrid * ygrid * zgrid;
+
+				c = 0;
+
+				//var s = 0.25;
+				var s = 60;
+
+				for ( i = 0; i < xgrid; i++ )
+				for ( j = 0; j < ygrid; j++ )
+				for ( k = 0; k < zgrid; k++ ) {
+
+					materials[c] = new THREE.MeshBasicMaterial( parameters );
+					materials[c].program = material_base.program;
+					materials[c].uniforms = Uniforms.clone( THREE.ShaderLib[ 'basic' ].uniforms );
+
+					if ( singleMaterial )
+						mesh = new THREE.Mesh( geo, zmaterial );
+					else
+						mesh = new THREE.Mesh( geo, materials[c] );
+
+					x = 200 * ( i - xgrid/2 );
+					y = 200 * ( j - ygrid/2 );
+					z = 200 * ( k - zgrid/2 );
+
+					mesh.position.set( x, y, z );
+					mesh.scale.set( s, s, s );
+
+					mesh.matrixAutoUpdate = false;
+					mesh.updateMatrix();
+
+					scene.addObject( mesh );
+					objects.push( mesh );
+
+					c++;
+
+				}
+
+				scene.matrixAutoUpdate = false;
+
+				initPostprocessing();
+
+				renderer.autoClear = false;
+
+				renderer.domElement.style.position = 'absolute';
+				renderer.domElement.style.top = "150px";
+				renderer.domElement.style.left = "0px";
+
+				stats = new Stats();
+				stats.domElement.style.position = 'absolute';
+				stats.domElement.style.top = '0px';
+				//container.appendChild( stats.domElement );
+
+				document.addEventListener( 'mousemove', onDocumentMouseMove, false );
+				document.addEventListener( 'touchstart', onDocumentTouchStart, false );
+				document.addEventListener( 'touchmove', onDocumentTouchMove, false );
+
+				var effectController  = {
+
+					focus: 		1.0,
+					aperture:	0.025,
+					maxblur:	1.0
+
+				};
+
+				var matChanger = function( ) {
+
+					postprocessing.bokeh_uniforms["focus"].value = effectController.focus;
+					postprocessing.bokeh_uniforms["aperture"].value = effectController.aperture;
+					postprocessing.bokeh_uniforms["maxblur"].value = effectController.maxblur;
+
+				};
+
+				var gui = new GUI();
+				gui.add( effectController, "focus", 0.0, 3.0, 0.025 ).onChange( matChanger );
+				gui.add( effectController, "aperture", 0.001, 0.2, 0.001 ).onChange( matChanger );
+				gui.add( effectController, "maxblur", 0.0, 3.0, 0.025 ).onChange( matChanger );
+
+			}
+
+			function onDocumentMouseMove( event ) {
+
+				mouseX = event.clientX - windowHalfX;
+				mouseY = event.clientY - windowHalfY;
+
+			}
+
+			function onDocumentTouchStart( event ) {
+
+				if ( event.touches.length == 1 ) {
+
+					event.preventDefault();
+
+					mouseX = event.touches[ 0 ].pageX - windowHalfX;
+					mouseY = event.touches[ 0 ].pageY - windowHalfY;
+
+				}
+			}
+
+			function onDocumentTouchMove( event ) {
+
+				if ( event.touches.length == 1 ) {
+
+					event.preventDefault();
+
+					mouseX = event.touches[ 0 ].pageX - windowHalfX;
+					mouseY = event.touches[ 0 ].pageY - windowHalfY;
+
+				}
+
+			}
+
+			function initPostprocessing() {
+
+				postprocessing.scene = new THREE.Scene();
+
+				postprocessing.camera = new THREE.Camera();
+				postprocessing.camera.projectionMatrix = THREE.Matrix4.makeOrtho( window.innerWidth / - 2, window.innerWidth / 2,  window.innerHeight / 2, window.innerHeight / - 2, -10000, 10000 );
+				postprocessing.camera.position.z = 100;
+
+				var pars = { min_filter: THREE.LinearFilter, mag_filter: THREE.LinearFilter };
+				postprocessing.rtTextureDepth = new THREE.RenderTarget( window.innerWidth, height, pars );
+				postprocessing.rtTextureColor = new THREE.RenderTarget( window.innerWidth, height, pars );
+
+				var bokeh_shader = ShaderExtras["bokeh"];
+
+				postprocessing.bokeh_uniforms = Uniforms.clone( bokeh_shader.uniforms );
+
+				postprocessing.bokeh_uniforms["tColor"].texture = postprocessing.rtTextureColor;
+				postprocessing.bokeh_uniforms["tDepth"].texture = postprocessing.rtTextureDepth;
+				postprocessing.bokeh_uniforms["focus"].value = 1.1;
+				postprocessing.bokeh_uniforms["aspect"].value = window.innerWidth / height;
+
+				postprocessing.materialBokeh = new THREE.MeshShaderMaterial( {
+
+					uniforms: postprocessing.bokeh_uniforms,
+					vertex_shader: bokeh_shader.vertex_shader,
+					fragment_shader: bokeh_shader.fragment_shader
+
+				} );
+
+				postprocessing.quad = new THREE.Mesh( new Plane( window.innerWidth, window.innerHeight ), postprocessing.materialBokeh );
+				postprocessing.quad.position.z = -500;
+				postprocessing.scene.addObject( postprocessing.quad );
+
+			}
+
+			function animate() {
+
+				requestAnimationFrame( animate, renderer.domElement );
+
+				render();
+				stats.update();
+
+			}
+
+			function render() {
+
+				var time = new Date().getTime() * 0.00005;
+
+				camera.position.x += ( mouseX - camera.position.x ) * 0.036;
+				camera.position.y += ( - (mouseY) - camera.position.y ) * 0.036;
+
+				for( i = 0; i < nobjects; i++ ) {
+
+					h = ( 360 * ( i/nobjects + time ) % 360 ) / 360;
+					//materials[i].color.setHSV( h, 0.5 + 0.5 * ( i % 20 / 20 ), 1 );
+					materials[i].color.setHSV( h, 1, 1 );
+
+				}
+
+
+				if ( postprocessing.enabled ) {
+
+					renderer.clear();
+
+					// Render scene into texture
+
+					if ( singleMaterial )
+						zmaterial[0] = cubeMaterial;
+					else
+						for( i = 0; i < nobjects; i++ ) objects[i].materials = [ materials[i] ];
+
+
+					renderer.render( scene, camera, postprocessing.rtTextureColor );
+
+					// Render depth into texture
+
+					if ( singleMaterial )
+						zmaterial[0] = material_depth;
+					else
+						for( i = 0; i < nobjects; i++ ) objects[i].materials = [ material_depth ];
+
+					renderer.render( scene, camera, postprocessing.rtTextureDepth );
+
+					// Render bokeh composite
+
+					renderer.render( postprocessing.scene, postprocessing.camera );
+
+
+				} else {
+
+					renderer.clear();
+					renderer.render( scene, camera );
+
+				}
+
+			}
+
+
+		</script>
+	</body>
+</html>

+ 369 - 0
examples/webgl_ribbons.html

@@ -0,0 +1,369 @@
+<!DOCTYPE HTML>
+<html lang="en">
+	<head>
+		<title>three.js webgl - ribbons</title>
+		<meta charset="utf-8">
+		<style type="text/css">
+			body {
+				background-color: #000000;
+				margin: 0px;
+				overflow: hidden;
+				font-family:Monospace;
+				font-size:13px;
+				text-align:center;
+				font-weight: bold;
+				text-align:center;
+			}
+
+			a {
+				color:#0078ff;
+			}
+
+			#info {
+				color:#fff;
+				position: absolute;
+				top: 0px; width: 100%;
+				padding: 5px;
+				z-index:100;
+			}
+		</style>
+	</head>
+
+	<body>
+
+		<script type="text/javascript" src="../build/Three.js"></script>
+
+		<script type="text/javascript" src="js/Detector.js"></script>
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
+		<script type="text/javascript" src="js/Stats.js"></script>
+
+		<div id="info">
+			<a href="http://github.com/mrdoob/three.js" target="_blank">three.js</a> - webgl ribbons example
+		</div>
+
+
+		<script type="text/javascript">
+
+			if ( ! Detector.webgl ) Detector.addGetWebGLMessage();
+
+			var container, stats;
+			var camera, scene, renderer, ribbon, geometry, geometry2, materials = [], ribbons = [],
+				parameters, i, i2, h, color, x, y, z, z2, s, n, n2, nribbons, grid;
+
+			var mouseX = 0, mouseY = 0;
+
+			var windowHalfX = window.innerWidth / 2;
+			var windowHalfY = window.innerHeight / 2;
+
+			var postprocessing = { enabled  : true };
+
+			init();
+			animate();
+
+			function init() {
+
+				container = document.createElement( 'div' );
+				document.body.appendChild( container );
+
+				camera = new THREE.Camera( 70, window.innerWidth / window.innerHeight, 1, 3000 );
+				camera.position.z = 1200;
+
+				scene = new THREE.Scene();
+				scene.fog = new THREE.FogExp2( 0x000000, 0.0016 );
+
+				renderer = new THREE.WebGLRenderer();
+				renderer.setSize( window.innerWidth, window.innerHeight );
+				container.appendChild( renderer.domElement );
+
+				renderer.setClearColor( scene.fog.color, 1 );
+
+				geometry = new THREE.Geometry();
+				geometry2 = new THREE.Geometry();
+
+				n = 1000;
+				n2 = 2 * n;
+
+				for ( i = -n; i < n; i++ ) {
+
+					i2 = i + n;
+
+					x = i * 1.175;
+					y = ( i2 % 2 ) * 5;
+
+					if ( i2 % 2 )  {
+
+						z = 10 * Math.sin( i2 * 0.3 ) * Math.cos( i2 * 0.1 );
+
+					}
+
+					vector = new THREE.Vector3( x, y, z );
+					geometry.vertices.push( new THREE.Vertex( vector ) );
+
+
+					vector = new THREE.Vector3( x, y, z );
+					geometry2.vertices.push( new THREE.Vertex( vector ) );
+
+					h = i2%2 ? 1 : 0.15;
+					if( i2%4 <= 2 ) h -= 0.15;
+
+					color = new THREE.Color( 0xffffff );
+					color.setHSV( 0.1 , 0, h );
+					geometry.colors.push( color );
+					geometry2.colors.push( color );
+
+				}
+
+				var tmpRot = new THREE.Matrix4();
+				tmpRot.setRotAxis( new THREE.Vector3( 1, 0, 0 ), 1.57 );
+				
+				var material_base = new THREE.MeshBasicMaterial( { color:0xffffff, vertex_colors:true } );
+
+				renderer.initMaterial( material_base, scene.lights, scene.fog );
+
+				xgrid = 34;
+				ygrid = 15;
+				nribbons = xgrid * ygrid;
+
+				c = 0;
+				for ( i = 0; i < xgrid; i++ )
+				for ( j = 0; j < ygrid; j++ ) {
+
+					materials[c] = new THREE.MeshBasicMaterial( { color:0xffffff, vertex_colors:true } );
+					materials[c].program = material_base.program;
+					materials[c].uniforms = Uniforms.clone( THREE.ShaderLib[ 'basic' ].uniforms );
+
+					ribbon = new THREE.Ribbon( i % 2 ? geometry : geometry2, materials[c] );
+					ribbon.rotation.x = 0;
+					ribbon.rotation.y = 1.57;
+					ribbon.rotation.z = 3.14;	
+
+					x = 40 * ( i - xgrid/2 );
+					y = 40 * ( j - ygrid/2 );
+					z = 0;
+					ribbon.position.set( x, y, z );
+
+					materials[c].color.setHSV( i/xgrid, 0.3 +  0.7*j/ygrid, 1 );
+
+					ribbon.doubleSided = true;
+					ribbon.matrixAutoUpdate = false;
+
+					// manually create local matrix
+
+					ribbon.matrix.setPosition( ribbon.position );
+					ribbon.matrixRotation.setRotationFromEuler( ribbon.rotation );
+
+					ribbon.matrix.n11 = ribbon.matrixRotation.n11;
+					ribbon.matrix.n12 = ribbon.matrixRotation.n12;
+					ribbon.matrix.n13 = ribbon.matrixRotation.n13;
+
+					ribbon.matrix.n21 = ribbon.matrixRotation.n21;
+					ribbon.matrix.n22 = ribbon.matrixRotation.n22;
+					ribbon.matrix.n23 = ribbon.matrixRotation.n23;
+
+					ribbon.matrix.n31 = ribbon.matrixRotation.n31;
+					ribbon.matrix.n32 = ribbon.matrixRotation.n32;
+					ribbon.matrix.n33 = ribbon.matrixRotation.n33;
+
+					ribbon.matrix.multiplySelf( tmpRot );
+
+					ribbon.matrix.scale( ribbon.scale );
+					ribbon.boundRadiusScale = Math.max( ribbon.scale.x, Math.max( ribbon.scale.y, ribbon.scale.z ) );
+
+					ribbons.push( ribbon );
+					scene.addObject( ribbon );
+
+					c++;
+
+				}
+
+				scene.matrixAutoUpdate = false;
+
+				initPostprocessing();
+				renderer.autoClear = false;
+
+				stats = new Stats();
+				stats.domElement.style.position = 'absolute';
+				stats.domElement.style.top = '0px';
+				container.appendChild( stats.domElement );
+
+				document.addEventListener( 'mousemove', onDocumentMouseMove, false );
+				document.addEventListener( 'touchstart', onDocumentTouchStart, false );
+				document.addEventListener( 'touchmove', onDocumentTouchMove, false );
+
+			}
+
+			function onDocumentMouseMove( event ) {
+
+				mouseX = event.clientX - windowHalfX;
+				mouseY = event.clientY - windowHalfY;
+
+			}
+
+			function onDocumentTouchStart( event ) {
+
+				if ( event.touches.length == 1 ) {
+
+					event.preventDefault();
+
+					mouseX = event.touches[ 0 ].pageX - windowHalfX;
+					mouseY = event.touches[ 0 ].pageY - windowHalfY;
+
+				}
+			}
+
+			function onDocumentTouchMove( event ) {
+
+				if ( event.touches.length == 1 ) {
+
+					event.preventDefault();
+
+					mouseX = event.touches[ 0 ].pageX - windowHalfX;
+					mouseY = event.touches[ 0 ].pageY - windowHalfY;
+
+				}
+
+			}
+
+			function initPostprocessing() {
+
+				postprocessing.scene = new THREE.Scene();
+
+				postprocessing.camera = new THREE.Camera();
+				postprocessing.camera.projectionMatrix = THREE.Matrix4.makeOrtho( window.innerWidth / - 2, window.innerWidth / 2,  window.innerHeight / 2, window.innerHeight / - 2, -10000, 10000 );
+				postprocessing.camera.position.z = 100;
+
+				var pars = { min_filter: THREE.LinearFilter, mag_filter: THREE.LinearFilter };
+				postprocessing.rtTexture1 = new THREE.RenderTarget( window.innerWidth, window.innerHeight, pars );
+				postprocessing.rtTexture2 = new THREE.RenderTarget( 512, 512, pars );
+				postprocessing.rtTexture3 = new THREE.RenderTarget( 512, 512, pars );
+
+				var screen_shader = ShaderUtils.lib["screen"];
+				var screen_uniforms = Uniforms.clone( screen_shader.uniforms );
+
+				screen_uniforms["tDiffuse"].texture = postprocessing.rtTexture1;
+				screen_uniforms["opacity"].value = 1.0;
+
+				postprocessing.materialScreen = new THREE.MeshShaderMaterial( {
+
+					uniforms: screen_uniforms,
+					vertex_shader: screen_shader.vertex_shader,
+					fragment_shader: screen_shader.fragment_shader,
+					blending: THREE.AdditiveBlending
+
+				} );
+
+				var convolution_shader = ShaderUtils.lib["convolution"];
+				var convolution_uniforms = Uniforms.clone( convolution_shader.uniforms );
+
+				postprocessing.blurx = new THREE.Vector2( 0.001953125, 0.0 ),
+				postprocessing.blury = new THREE.Vector2( 0.0, 0.001953125 );
+
+				convolution_uniforms["tDiffuse"].texture = postprocessing.rtTexture1;
+				convolution_uniforms["uImageIncrement"].value = postprocessing.blurx;
+				convolution_uniforms["cKernel"].value = ShaderUtils.buildKernel( 4.0 );
+
+				postprocessing.materialConvolution = new THREE.MeshShaderMaterial( {
+
+					uniforms: convolution_uniforms,
+					vertex_shader:   "#define KERNEL_SIZE 25.0\n" + convolution_shader.vertex_shader,
+					fragment_shader: "#define KERNEL_SIZE 25\n"   + convolution_shader.fragment_shader
+
+				} );
+
+				postprocessing.quad = new THREE.Mesh( new Plane( window.innerWidth, window.innerHeight ), postprocessing.materialConvolution );
+				postprocessing.quad.position.z = -500;
+				postprocessing.scene.addObject( postprocessing.quad );
+
+			}
+
+			//
+
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+				stats.update();
+
+			}
+
+			function render() {
+
+				var time = new Date().getTime() * 0.00005;
+
+				camera.position.x += ( mouseX - camera.position.x ) * 0.036;
+				camera.position.y += ( - (mouseY) - camera.position.y ) * 0.036;
+
+				for ( i = -n; i < n; i++ ) {
+
+					i2 = i + n;
+
+					z  =  10 * Math.sin( i2 * 0.1 + time*30 );
+					z2 =  20 * Math.cos( Math.sin( i2 * 0.1 + time * 20 ) );
+
+					geometry.vertices[i2].position.z = z;
+					geometry2.vertices[i2].position.z = z2;
+
+				}
+
+				geometry.__dirtyVertices = true;
+				geometry2.__dirtyVertices = true;
+
+
+				for( i = 0; i < nribbons; i++ ) {
+
+					h = ( 360 * ( i/nribbons + time ) % 360 ) / 360;
+					materials[i].color.setHSV( h, 0.5+0.5*(i%20/20), 1 );
+
+				}
+
+				if ( postprocessing.enabled ) {
+
+					renderer.clear();
+
+					// Render scene into texture
+
+					renderer.render( scene, camera, postprocessing.rtTexture1 );
+
+					// Render quad with blured scene into texture (convolution pass 1)
+
+					postprocessing.quad.materials = [ postprocessing.materialConvolution ];
+
+					postprocessing.materialConvolution.uniforms.tDiffuse.texture = postprocessing.rtTexture1;
+					postprocessing.materialConvolution.uniforms.uImageIncrement.value = postprocessing.blurx;
+
+					renderer.render( postprocessing.scene, postprocessing.camera, postprocessing.rtTexture2 );
+
+					// Render quad with blured scene into texture (convolution pass 2)
+
+					postprocessing.materialConvolution.uniforms.tDiffuse.texture = postprocessing.rtTexture2;
+					postprocessing.materialConvolution.uniforms.uImageIncrement.value = postprocessing.blury;
+
+					renderer.render( postprocessing.scene, postprocessing.camera, postprocessing.rtTexture3 );
+
+					// Render original scene with superimposed blur to texture
+
+					postprocessing.quad.materials = [ postprocessing.materialScreen ];
+
+					postprocessing.materialScreen.uniforms.tDiffuse.texture = postprocessing.rtTexture3;
+					postprocessing.materialScreen.uniforms.opacity.value = 1.2;
+
+					renderer.render( postprocessing.scene, postprocessing.camera, postprocessing.rtTexture1, false );
+
+					// Render to screen
+
+					postprocessing.materialScreen.uniforms.tDiffuse.texture = postprocessing.rtTexture1;
+					renderer.render( postprocessing.scene, postprocessing.camera );
+
+				} else {
+
+					renderer.clear();
+					renderer.render( scene, camera );
+
+				}
+
+			}
+
+		</script>
+	</body>
+</html>

+ 286 - 0
examples/webgl_rtt.html

@@ -0,0 +1,286 @@
+<!DOCTYPE HTML>
+<html lang="en">
+	<head>
+		<title>three.js webgl - render-to-texture</title>
+		<meta charset="utf-8">
+		<style type="text/css">
+			body {
+				color: #ffffff;
+				font-family:Monospace;
+				font-size:13px;
+				text-align:center;
+				font-weight: bold;
+				background-color: #000000;
+				margin: 0px;
+				overflow: hidden;
+			}
+
+			#info {
+				position: absolute;
+				top: 0px; width: 100%;
+				padding: 5px;
+			}
+
+			a {
+				color: #ffffff;
+			}
+
+		</style>
+	</head>
+	<body>
+
+		<div id="container"></div>
+		<div id="info"><a href="http://github.com/mrdoob/three.js" target="_blank">three.js</a> render-to-texture webgl example</div>
+
+		<script type="text/javascript" src="../build/Three.js"></script>
+
+		<script type="text/javascript" src="js/Detector.js"></script>
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
+		<script type="text/javascript" src="js/Stats.js"></script>
+
+		<script id="fragment_shader_screen" type="x-shader/x-fragment">
+			varying vec2 vUv;
+			uniform sampler2D tDiffuse;
+
+			void main(void) {
+
+				//gl_FragColor = texture2D( tDiffuse, vec2( vUv.x, 1.0 - vUv.y ) );
+				gl_FragColor = texture2D( tDiffuse, vUv );
+
+			}
+		</script>
+
+		<script id="fragment_shader_pass_1" type="x-shader/x-fragment">
+			varying vec2 vUv;
+			uniform float time;
+
+			void main(void) {
+
+				//gl_FragColor = vec4( time, vUv.x, vUv.y, 1.0 );
+				float r = vUv.x;
+				if( vUv.y < 0.5 ) r = 0.0;
+				float g = vUv.y;
+				if( vUv.x < 0.5 ) g = 0.0;
+
+				gl_FragColor = vec4( r, g, time, 1.0 );
+
+			}
+		</script>
+
+		<script id="vertex_shader" type="x-shader/x-vertex">
+			varying vec2 vUv;
+
+			void main() {
+
+				vUv = uv;
+				//gl_Position = vec4( position, 1.0 );
+				gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );
+
+			}
+		</script>
+
+
+		<script type="text/javascript">
+
+			if ( ! Detector.webgl ) Detector.addGetWebGLMessage();
+
+			var container, stats;
+
+			var cameraRTT, camera, sceneRTT, sceneScreen, scene, renderer, zmesh1, zmesh2;
+
+			var mouseX = 0, mouseY = 0;
+
+			var windowHalfX = window.innerWidth / 2;
+			var windowHalfY = window.innerHeight / 2;
+
+			var rtTexture, material, quad;
+
+			var delta = 0.01;
+
+			init();
+			animate();
+
+			function init() {
+
+				container = document.getElementById( 'container' );
+
+				cameraRTT = new THREE.Camera();
+				cameraRTT.projectionMatrix = THREE.Matrix4.makeOrtho( window.innerWidth / - 2, window.innerWidth / 2, window.innerHeight / 2, window.innerHeight / - 2, -10000, 10000 );
+				cameraRTT.position.z = 100;
+
+				camera = new THREE.Camera( 30, window.innerWidth / window.innerHeight, 1, 10000 );
+				camera.position.z = 100;
+				camera.updateMatrix();
+
+				scene = new THREE.Scene();
+				sceneRTT = new THREE.Scene();
+				sceneScreen = new THREE.Scene();
+
+				var light = new THREE.DirectionalLight( 0xffffff );
+				light.position.x = 0;
+				light.position.y = 0;
+				light.position.z = 1;
+				light.position.normalize();
+				sceneRTT.addLight( light );
+				
+				light = new THREE.DirectionalLight( 0xffaaaa, 1.5 );
+				light.position.x = 0;
+				light.position.y = 0;
+				light.position.z = -1;
+				light.position.normalize();
+				sceneRTT.addLight( light );
+
+				rtTexture = new THREE.RenderTarget( window.innerWidth, window.innerHeight, { min_filter: THREE.LinearFilter, mag_filter: THREE.NearestFilter } );
+
+				material = new THREE.MeshShaderMaterial( {
+
+					uniforms: { time: { type: "f", value: 0.0 } },
+					vertex_shader: document.getElementById( 'vertex_shader' ).textContent,
+					fragment_shader: document.getElementById( 'fragment_shader_pass_1' ).textContent
+
+				} );
+
+				var materialScreen = new THREE.MeshShaderMaterial( {
+
+					uniforms: { tDiffuse: { type: "t", value: 0, texture: rtTexture } },
+					vertex_shader: document.getElementById( 'vertex_shader' ).textContent,
+					fragment_shader: document.getElementById( 'fragment_shader_screen' ).textContent
+
+				} );
+
+				// var mt = new THREE.MeshBasicMaterial( { color:0xffffff, map: ImageUtils.loadTexture( "textures/land_ocean_ice_cloud_2048.jpg" ) } );
+
+				var plane = new Plane( window.innerWidth, window.innerHeight );
+
+				quad = new THREE.Mesh( plane, material );
+				quad.position.z = -100;
+				sceneRTT.addObject( quad );
+
+				var loader = new THREE.Loader();
+				loader.loadBinary( { model: "obj/torus/Torus_bin.js", callback: function( geometry ) { createMesh( geometry, sceneRTT ) } } );
+
+				quad = new THREE.Mesh( plane, materialScreen );
+				quad.position.z = -100;
+				sceneScreen.addObject( quad );
+
+				var n = 5,
+					geometry = new Sphere( 10, 64, 32 ),
+					material2 = new THREE.MeshLambertMaterial( { color:0xffffff, map: rtTexture } );
+					//material2 = new THREE.MeshBasicMaterial( { color:0xffffff, map: rtTexture } );
+
+				for( var j = 0; j < n; j++ ) {
+
+					for( var i = 0; i < n; i++ ) {
+
+						mesh = new THREE.Mesh( geometry, material2 );
+						mesh.position.x = ( i - (n-1)/2 ) * 20;
+						mesh.position.y = ( j - (n-1)/2 ) * 20;
+						mesh.position.z = 0;
+						mesh.rotation.y = 1.57;
+						scene.addObject( mesh );
+
+					}
+				}
+
+				renderer = new THREE.WebGLRenderer();
+				renderer.setSize( window.innerWidth, window.innerHeight );
+				renderer.autoClear = false;
+				container.appendChild( renderer.domElement );
+
+				stats = new Stats();
+				stats.domElement.style.position = 'absolute';
+				stats.domElement.style.top = '0px';
+				container.appendChild( stats.domElement );
+
+				document.addEventListener( 'mousemove', onDocumentMouseMove, false );
+
+			}
+
+			function createMesh( geometry, xscene ) {
+
+				var mat1 = new THREE.MeshPhongMaterial( { color: 0x555555, specular:0xffaa00, shininess:5 } ),
+					mat2 = new THREE.MeshPhongMaterial( { color: 0x550000, specular:0xff2200, shininess:5 } );
+
+				zmesh1 = new THREE.Mesh( geometry, mat1 );
+				zmesh1.position.x = 0;
+				zmesh1.position.y = 0;
+				zmesh1.position.z = 100;
+				zmesh1.scale.x = zmesh1.scale.y = zmesh1.scale.z = 150;
+				xscene.addObject( zmesh1 );
+
+				zmesh2 = new THREE.Mesh( geometry, mat2 );
+				zmesh2.position.x = 0;
+				zmesh2.position.y = 150;
+				zmesh2.position.z = 100;
+				zmesh2.scale.x = zmesh2.scale.y = zmesh2.scale.z = 75;
+				xscene.addObject( zmesh2 );
+
+			}
+
+			function onDocumentMouseMove( event ) {
+
+				mouseX = ( event.clientX - windowHalfX );
+				mouseY = ( event.clientY - windowHalfY );
+
+			}
+
+			//
+
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+				stats.update();
+
+			}
+
+			function render() {
+
+				var time = new Date().getTime() * 0.0015;
+
+				camera.position.x += ( mouseX - camera.position.x ) * .05;
+				camera.position.y += ( - mouseY - camera.position.y ) * .05;
+
+				if ( zmesh1 && zmesh2 ) {
+
+					zmesh1.rotation.x = 1.57;
+					zmesh1.rotation.z = time;
+
+					zmesh2.rotation.z = 1.57;
+					zmesh2.rotation.y = -time;
+
+				}
+
+				if ( material.uniforms.time.value > 1 || material.uniforms.time.value < 0 ) {
+
+					delta *= -1;
+
+				}
+
+				material.uniforms.time.value += delta;
+
+				renderer.clear();
+
+				// Render first scene into texture
+
+				renderer.render( sceneRTT, cameraRTT, rtTexture );
+
+				// Render full screen quad with generated texture
+				// (disable depth writing so that it stays in the background)
+
+				renderer.context.depthMask( 0 );
+				renderer.render( sceneScreen, cameraRTT );
+				//renderer.render( sceneRTT, cameraRTT );
+				renderer.context.depthMask( 1 );
+
+				// Render second scene to screen
+				// (using first scene as regular texture)
+
+				renderer.render( scene, camera );
+
+			}
+
+		</script>
+	</body>
+</html>

+ 47 - 31
examples/webglrenderer2_sandbox.html → examples/webgl_sandbox.html

@@ -26,18 +26,14 @@
 			a {
 				color: #ffffff;
 			}
-			#log { position:absolute; top:50px; text-align:left; display:block; z-index:100 }
+
 		</style>
 	</head>
 
 	<body>
-		<pre id="log"></pre>
-
 		<div id="info"><a href="http://github.com/mrdoob/three.js" target="_blank">three.js</a> - webgl cube Fresnel shader demo.</div>
 
-		<!-- 
-		<script type="text/javascript" src="../build/Three.js"></script>
-		-->
+		<!-- <script type="text/javascript" src="../build/Three.js"></script> -->
 
 		<script type="text/javascript" src="../src/Three.js"></script>
 		<script type="text/javascript" src="../src/core/Color.js"></script>
@@ -48,21 +44,23 @@
 		<script type="text/javascript" src="../src/core/Rectangle.js"></script>
 		<script type="text/javascript" src="../src/core/Matrix3.js"></script>
 		<script type="text/javascript" src="../src/core/Matrix4.js"></script>
+		<script type="text/javascript" src="../src/core/Object3D.js"></script>
+		<script type="text/javascript" src="../src/core/Quaternion.js"></script>
 		<script type="text/javascript" src="../src/core/Vertex.js"></script>
 		<script type="text/javascript" src="../src/core/Face3.js"></script>
 		<script type="text/javascript" src="../src/core/Face4.js"></script>
 		<script type="text/javascript" src="../src/core/UV.js"></script>
 		<script type="text/javascript" src="../src/core/Geometry.js"></script>
+		<script type="text/javascript" src="../src/animation/AnimationHandler.js"></script>
+		<script type="text/javascript" src="../src/animation/Animation.js"></script>
 		<script type="text/javascript" src="../src/cameras/Camera.js"></script>
+		<script type="text/javascript" src="../src/cameras/QuakeCamera.js"></script>
 		<script type="text/javascript" src="../src/lights/Light.js"></script>
 		<script type="text/javascript" src="../src/lights/AmbientLight.js"></script>
 		<script type="text/javascript" src="../src/lights/DirectionalLight.js"></script>
 		<script type="text/javascript" src="../src/lights/PointLight.js"></script>
-		<script type="text/javascript" src="../src/objects/Object3D.js"></script>
-		<script type="text/javascript" src="../src/objects/Particle.js"></script>
-		<script type="text/javascript" src="../src/objects/Line.js"></script>
-		<script type="text/javascript" src="../src/objects/Mesh.js"></script>
 		<script type="text/javascript" src="../src/materials/Material.js"></script>
+		<script type="text/javascript" src="../src/materials/Mappings.js"></script>
 		<script type="text/javascript" src="../src/materials/LineBasicMaterial.js"></script>
 		<script type="text/javascript" src="../src/materials/MeshBasicMaterial.js"></script>
 		<script type="text/javascript" src="../src/materials/MeshLambertMaterial.js"></script>
@@ -77,30 +75,42 @@
 		<script type="text/javascript" src="../src/materials/Texture.js"></script>
 		<script type="text/javascript" src="../src/materials/RenderTarget.js"></script>
 		<script type="text/javascript" src="../src/materials/Uniforms.js"></script>
-		<script type="text/javascript" src="../src/materials/mappings/CubeReflectionMapping.js"></script>
-		<script type="text/javascript" src="../src/materials/mappings/CubeRefractionMapping.js"></script>
-		<script type="text/javascript" src="../src/materials/mappings/LatitudeReflectionMapping.js"></script>
-		<script type="text/javascript" src="../src/materials/mappings/LatitudeRefractionMapping.js"></script>
-		<script type="text/javascript" src="../src/materials/mappings/SphericalReflectionMapping.js"></script>
-		<script type="text/javascript" src="../src/materials/mappings/SphericalRefractionMapping.js"></script>
-		<script type="text/javascript" src="../src/materials/mappings/UVMapping.js"></script>
+		<script type="text/javascript" src="../src/objects/Particle.js"></script>
+		<script type="text/javascript" src="../src/objects/ParticleSystem.js"></script>
+		<script type="text/javascript" src="../src/objects/Line.js"></script>
+		<script type="text/javascript" src="../src/objects/Mesh.js"></script>
+		<script type="text/javascript" src="../src/objects/Bone.js"></script>
+		<script type="text/javascript" src="../src/objects/SkinnedMesh.js"></script>
+		<script type="text/javascript" src="../src/objects/Ribbon.js"></script>
+		<script type="text/javascript" src="../src/objects/Sound.js"></script>
 		<script type="text/javascript" src="../src/scenes/Scene.js"></script>
 		<script type="text/javascript" src="../src/scenes/Fog.js"></script>
+		<script type="text/javascript" src="../src/scenes/FogExp2.js"></script>
 		<script type="text/javascript" src="../src/renderers/Projector.js"></script>
 		<script type="text/javascript" src="../src/renderers/DOMRenderer.js"></script>
 		<script type="text/javascript" src="../src/renderers/CanvasRenderer.js"></script>
 		<script type="text/javascript" src="../src/renderers/SVGRenderer.js"></script>
 		<script type="text/javascript" src="../src/renderers/WebGLRenderer.js"></script>
-		<script type="text/javascript" src="../src/renderers/WebGLRenderer2.js"></script>
+		<script type="text/javascript" src="../src/renderers/SoundRenderer.js"></script>
 		<script type="text/javascript" src="../src/renderers/renderables/RenderableObject.js"></script>
 		<script type="text/javascript" src="../src/renderers/renderables/RenderableFace3.js"></script>
 		<script type="text/javascript" src="../src/renderers/renderables/RenderableParticle.js"></script>
 		<script type="text/javascript" src="../src/renderers/renderables/RenderableLine.js"></script>
-
-		<script type="text/javascript" src="../src/extras/primitives/Sphere.js"></script>
+		<script type="text/javascript" src="../src/extras/GeometryUtils.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/ShaderUtils.js"></script>
+		<script type="text/javascript" src="../src/extras/primitives/Cube.js"></script>
+		<script type="text/javascript" src="../src/extras/primitives/Cylinder.js"></script>
+		<script type="text/javascript" src="../src/extras/primitives/Plane.js"></script>
+		<script type="text/javascript" src="../src/extras/primitives/Sphere.js"></script>
+		<script type="text/javascript" src="../src/extras/primitives/Torus.js"></script>
+		<script type="text/javascript" src="../src/extras/primitives/Icosahedron.js"></script>
+		<script type="text/javascript" src="../src/extras/primitives/LathedObject.js"></script>
+		<script type="text/javascript" src="../src/extras/objects/MarchingCubes.js"></script>
+		<script type="text/javascript" src="../src/extras/io/Loader.js"></script>
 
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
 		<script type="text/javascript" src="js/Stats.js"></script>
 
 		<script type="text/javascript">
@@ -118,12 +128,8 @@
 			var windowHalfX = window.innerWidth / 2;
 			var windowHalfY = window.innerHeight / 2;
 
-			document.addEventListener( 'mousemove', onDocumentMouseMove, false );
-
 			init();
-			// loop();
-			setInterval( loop, 1000 / 60 );
-
+			animate();
 
 			function init() {
 
@@ -191,13 +197,13 @@
 					mesh.rotation.x = Math.random() * 360 * ( Math.PI / 180 );
 					mesh.rotation.y = Math.random() * 360 * ( Math.PI / 180 );
 					mesh.scale.x = mesh.scale.y = mesh.scale.z = Math.random() * 4 + 1;
+					mesh.matrixAutoUpdate = false;
 					mesh.updateMatrix();
-					mesh.autoUpdateMatrix = false;
 					scene.addObject( mesh );
 
 				}
 
-				renderer = new THREE.WebGLRenderer2();
+				renderer = new THREE.WebGLRenderer();
 				renderer.setSize( window.innerWidth, window.innerHeight );
 				// renderer.sortObjects = false;
 				container.appendChild( renderer.domElement );
@@ -212,12 +218,13 @@
 
 				}
 
+				document.addEventListener( 'mousemove', onDocumentMouseMove, false );
+
 			}
 
 			function generateTexture( r, g, b ) {
 
 				var canvas = document.createElement( 'canvas' );
-				canvas.loaded = true;
 				canvas.width = 256;
 				canvas.height = 256;
 
@@ -252,15 +259,24 @@
 
 			}
 
-			function loop() {
+			//
+
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+				if ( statsEnabled ) stats.update();
+
+			}
+
+			function render() {
 
 				camera.position.x += ( mouseX - camera.position.x ) * .05;
 				camera.position.y += ( - mouseY - camera.position.y ) * .05;
 
 				renderer.render( scene, camera );
 
-				if ( statsEnabled ) stats.update();
-
 			}
 
 			function log( text ) {

+ 138 - 123
examples/scene_test.html → examples/webgl_scene_test.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - io - scene loader - webgl</title>
+		<title>three.js webgl - io - scene loader</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -13,7 +13,7 @@
 				font-family:georgia;
 				text-align:center;
 			}
-			
+
 			#info {
 				position: absolute;
 				top: 0px; width: 100%;
@@ -23,7 +23,7 @@
 				text-align: center;
 				z-index:100;
 			}
-			
+
 			#progress {
 				color:red;
 				top:7em;
@@ -37,7 +37,7 @@
 				text-shadow: #000 0px 0px 10px;
 				display:none;
 			}
-			
+
 			#start {
 				color:#fff;
 				text-shadow: #000 0px 0px 2px;
@@ -46,44 +46,44 @@
 				text-align: center;
 				display:none;
 			}
-			
+
 			.shadow {
 				-moz-box-shadow: 0px 0px 5px #000;
 				-webkit-box-shadow: 0px 0px 5px #000;
 				box-shadow: 0px 0px 5px #000;
 			}
-			
+
 			#progressbar {
 				text-align: center;
 				background: white;
 				width: 250px;
 				height: 10px;
 			}
-			
+
 			#bar {
 				background:#d00;
 				width:50px;
 				height:10px;
 			}
-			
+
 			.enabled {
 				color: lime!important;
 				cursor:pointer;
 			}
-			
+
 			.enabled:hover {
 				text-shadow: #0f0 0px 0px 5px !important;
 			}
-			
+
 			.disabled {
 				background:gray;
 				cursor:default;
 			}
-			
+
 			a { color:red }
 			canvas { pointer-events:none; z-index:10; }
 			#log { position:absolute; top:0; display:block; text-align:left; z-index:1000; pointer-events:none; }
-			
+
 			#scene_explorer {
 				background:transparent;
 				color:#fff;
@@ -94,20 +94,20 @@
 				z-index:200;
 				overflow:auto;
 			}
-			
+
 			#section_exp {
 				background:rgba(0,0,50,0.5);
 				padding:0.5em 0;
 				display:none;
 			}
-			
-			#scene_explorer h3 { 
+
+			#scene_explorer h3 {
 				font-size:1em;
 				padding:0;
 				margin:0;
 				color:orange;
 			}
-			
+
 			#scene_explorer a {
 				color:#555;
 				font-weight:bold;
@@ -119,12 +119,12 @@
 				background:#555;
 				color:rgba(0,0,50,1);
 			}
-			
+
 			.part {
 				display:none;
 				padding:0 0 0.5em 2em;
 			}
-			
+
 		</style>
 	</head>
 
@@ -132,7 +132,7 @@
 		<div id="info">
 			<a href="http://github.com/mrdoob/three.js">three.js</a> - scene loader test
 		</div>
-		
+
 		<div id="scene_explorer">
 			<a id="plus_exp" href="#">[+]</a>
 			<div id="section_exp"></div>
@@ -140,22 +140,25 @@
 
 		<div id="progress">
 			<span id="message">Loading ...</span>
-			
+
 			<center>
 				<div id="progressbar" class="shadow"><div id="bar" class="shadow"></div></div>
 				<div id="start" class="disabled">Start</div>
 			</center>
 		</div>
-		
+
 		<pre id="log"></pre>
 
-		<script type="text/javascript" src="../build/ThreeExtras.js"></script>
+		<script type="text/javascript" src="../build/Three.js"></script>
+
+		<script type="text/javascript" src="js/Detector.js"></script>
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
 		<script type="text/javascript" src="js/Stats.js"></script>
 
 		<script type="text/javascript">
 
-			if ( ! THREE.Detector.webgl ) THREE.Detector.addGetWebGLMessage();
-			
+			if ( ! Detector.webgl ) Detector.addGetWebGLMessage();
+
 			var SCREEN_WIDTH = window.innerWidth;
 			var SCREEN_HEIGHT = window.innerHeight;
 
@@ -174,46 +177,47 @@
 			document.addEventListener( 'mousemove', onDocumentMouseMove, false );
 
 			init();
+			animate();
 
 			function $( id ) {
-				
+
 				return document.getElementById( id );
-				
+
 			}
-			
+
 			function handle_update( result, pieces ) {
-				
+
 				refreshSceneView( result );
 				renderer.initWebGLObjects( result.scene );
-				
+
 				var m, material, count = 0;
-				
+
 				for ( m in result.materials ) {
-				
+
 					material = result.materials[ m ];
 					if ( ! ( material instanceof THREE.MeshFaceMaterial ) ) {
-						
+
 						if( !material.program ) {
-						
+
 							console.log(m);
 							renderer.initMaterial( material, result.scene.lights, result.scene.fog );
-							
+
 							count += 1;
 							if( count > pieces ) {
-								
+
 								//console.log("xxxxxxxxx");
 								break;
-							
+
 							}
-							
+
 						}
-						
+
 					}
-					
+
 				}
-				
+
 			}
-			
+
 			function init() {
 
 				container = document.createElement( 'div' );
@@ -222,60 +226,65 @@
 				var loadScene = createLoadScene();
 				scene  = loadScene.scene;
 				camera = loadScene.camera;
-				
+
 				renderer = new THREE.WebGLRenderer();
 				renderer.setSize( SCREEN_WIDTH, SCREEN_HEIGHT );
 				renderer.domElement.style.position = "relative";
 				container.appendChild( renderer.domElement );
 
-				$( "start" ).addEventListener( 'click', onStartClick, false );
+				stats = new Stats();
+				stats.domElement.style.position = 'absolute';
+				stats.domElement.style.top = '0px';
+				stats.domElement.style.right = '0px';
+				stats.domElement.style.zIndex = 100;
+				container.appendChild( stats.domElement );
 
-				setInterval( loop, 1000/60 );
+				$( "start" ).addEventListener( 'click', onStartClick, false );
 
 				var callback_progress = function( progress, result ) {
-				
-					var bar = 250, 
+
+					var bar = 250,
 						total = progress.total_models + progress.total_textures,
 						loaded = progress.loaded_models + progress.loaded_textures;
-					
+
 					if ( total )
 						bar = Math.floor( bar * loaded / total );
-					
+
 					$( "bar" ).style.width = bar + "px";
-					
+
 					count = 0;
 					for ( var m in result.materials ) count++;
 
 					handle_update( result, Math.floor( count/total ) );
-					
+
 				}
-				
+
 				var callback_sync = function( result ) {
-				
+
 					/*
-					
+
 					// uncomment to see progressive scene loading
-					
+
 					scene = result.scene;
 					camera = result.currentCamera;
-					
+
 					camera.aspect = window.innerWidth / window.innerHeight;
 					camera.updateProjectionMatrix();
-					
+
 					renderer.setClearColor( result.bgColor, result.bgAlpha );
-					
+
 					*/
 
 					//handle_update( result, 1 );
-					
+
 				}
-				
+
 				var callback_async = function( result ) {
-				
+
 					loaded = result;
-					
+
 					var mat_veyron = result.geometries[ "veyron" ].materials;
-					
+
 					mat_veyron[ 0 ][ 0 ] = result.materials[ "interior" ];
 					mat_veyron[ 1 ][ 0 ] = result.materials[ "chrome" ];
 					mat_veyron[ 2 ][ 0 ] = result.materials[ "darkerchrome" ];
@@ -284,50 +293,43 @@
 					mat_veyron[ 5 ][ 0 ] = result.materials[ "chrome" ];
 					mat_veyron[ 6 ][ 0 ] = result.materials[ "backlights" ];
 					mat_veyron[ 7 ][ 0 ] = result.materials[ "backsignals" ];
-					
+
 					$( "message" ).style.display = "none";
 					$( "progressbar" ).style.display = "none";
 					$( "start" ).style.display = "block";
 					$( "start" ).className = "enabled";
-					
+
 					handle_update( result, 1 );
-					
+
 				}
-				
+
 				$( "progress" ).style.display = "block";
 				SceneUtils.loadScene( "scenes/test_scene.js", callback_sync, callback_async, callback_progress );
 
-				stats = new Stats();
-				stats.domElement.style.position = 'absolute';
-				stats.domElement.style.top = '0px';
-				stats.domElement.style.right = '0px';
-				stats.domElement.style.zIndex = 100;
-				container.appendChild( stats.domElement );
-				
 				$( "plus_exp" ).addEventListener( 'click', createToggle( "exp" ), false );
 
 			}
 
 			function setButtonActive( id ) {
-			
+
 				$( "start" ).style.backgroundColor = "green";
-					
+
 			}
-			
+
 			function onStartClick() {
-			
+
 				$( "progress" ).style.display = "none";
-				
+
 				scene = loaded.scene;
 				camera = loaded.currentCamera;
-				
+
 				camera.aspect = window.innerWidth / window.innerHeight;
 				camera.updateProjectionMatrix();
-				
+
 				renderer.setClearColor( loaded.bgColor, loaded.bgAlpha );
-				
+
 			}
-			
+
 			function onDocumentMouseMove(event) {
 
 				mouseX = ( event.clientX - windowHalfX );
@@ -336,23 +338,23 @@
 			}
 
 			function createLoadScene() {
-			
+
 				var result = {
-				
+
 					scene:  new THREE.Scene(),
 					camera: new THREE.Camera( 65, window.innerWidth / window.innerHeight, 1, 1000 )
-					
+
 				};
-				
+
 				result.camera.position.z = 100;
-				
-				var object, geometry, material, light, count = 100, range = 150;
-				
+
+				var object, geometry, material, light, count = 500, range = 200;
+
 				material = new THREE.MeshLambertMaterial( { color:0xffffff } );
 				geometry = new Cube( 5, 5, 5 );
-				
+
 				for( var i = 0; i < count; i++ ) {
-				
+
 					object = new THREE.Mesh( geometry, material );
 					object.position.x = ( Math.random() - 0.5 ) * range;
 					object.position.y = ( Math.random() - 0.5 ) * range;
@@ -360,10 +362,14 @@
 					object.rotation.x = Math.random() * 6;
 					object.rotation.y = Math.random() * 6;
 					object.rotation.z = Math.random() * 6;
+					object.matrixAutoUpdate = false;
+					object.updateMatrix();
 					result.scene.addObject( object );
-					
+
 				}
-				
+
+				result.scene.matrixAutoUpdate = false;
+
 				light = new THREE.PointLight( 0xffffff );
 				result.scene.addLight( light );
 
@@ -372,18 +378,27 @@
 				result.scene.addLight( light );
 
 				return result;
-				
+
 			}
-			
-			function loop() {
+
+			//
+
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+				stats.update();
+
+			}
+
+			function render() {
 
 				camera.position.x += ( mouseX - camera.position.x ) * .001;
 				camera.position.y += ( - mouseY - camera.position.y ) * .001;
 
 				renderer.render( scene, camera );
 
-				stats.update();
-
 			}
 
 			function log( text ) {
@@ -394,60 +409,60 @@
 			}
 
 			// Scene explorer user interface
-			
+
 			function toggle( id ) {
-				
+
 				var scn = $( "section_" + id ).style,
 					btn = $( "plus_" + id );
-				
+
 				if ( scn.display == "block" ) {
-				
+
 					scn.display = "none";
 					btn.innerHTML = "[+]";
-					
+
 				}
 				else {
-					
+
 					scn.display = "block";
 					btn.innerHTML = "[-]";
-					
+
 				}
-					
+
 			}
-			
+
 			function createToggle( label ) { return function() { toggle( label ) } };
-			
+
 			function refreshSceneView( result ) {
-				
+
 				$( "section_exp" ).innerHTML = generateSceneView( result );
 
 				var config = [ "obj", "geo", "mat", "tex", "lit", "cam" ];
-				
+
 				for ( var i = 0; i < config.length; i++ )
 					$( "plus_" + config[i] ).addEventListener( 'click', createToggle( config[i] ), false );
 
 			}
-			
+
 			function generateSection( label, id, objects ) {
-				
+
 				var html = "";
-				
+
 				html += "<h3><a id='plus_" + id + "' href='#'>[+]</a> " + label + "</h3>";
 				html += "<div id='section_" + id + "' class='part'>";
-				
+
 				for( var o in objects ) {
-				
+
 					html += o + "<br/>";
-					
+
 				}
 				html += "</div>";
-				
+
 				return html;
-			
+
 			}
-			
+
 			function generateSceneView( result ) {
-				
+
 				var config = [
 				[ "Objects",    "obj", result.objects ],
 				[ "Geometries", "geo", result.geometries ],
@@ -456,14 +471,14 @@
 				[ "Lights",     "lit", result.lights ],
 				[ "Cameras",    "cam", result.cameras ]
 				];
-				
+
 				var html = "";
-				
+
 				for ( var i = 0; i < config.length; i++ )
 					html += generateSection( config[i][0], config[i][1], config[i][2] );
 
 				return html;
-				
+
 			}
 
 		</script>

+ 43 - 33
examples/shader.html → examples/webgl_shader.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - materials - shaders [Monjori] - webgl</title>
+		<title>three.js webgl - materials - shaders [Monjori]</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -35,11 +35,11 @@
 		<div id="container"></div> 
 		<div id="info"><a href="http://github.com/mrdoob/three.js" target="_blank">three.js</a> - shader 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/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" src="js/Detector.js"></script>
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
+		<script type="text/javascript" src="js/Stats.js"></script>
 
 		<script id="vertex_shader" type="x-shader/x-vertex">
 			void main()
@@ -58,35 +58,35 @@
 
 			void main(void)
 			{
-			    vec2 p = -1.0 + 2.0 * gl_FragCoord.xy / resolution.xy;
-			    float a = time*40.0;
-			    float d,e,f,g=1.0/40.0,h,i,r,q;
-			    e=400.0*(p.x*0.5+0.5);
-			    f=400.0*(p.y*0.5+0.5);
-			    i=200.0+sin(e*g+a/150.0)*20.0;
-			    d=200.0+cos(f*g/2.0)*18.0+cos(e*g)*7.0;
-			    r=sqrt(pow(i-e,2.0)+pow(d-f,2.0));
-			    q=f/r;
-			    e=(r*cos(q))-a/2.0;f=(r*sin(q))-a/2.0;
-			    d=sin(e*g)*176.0+sin(e*g)*164.0+r;
-			    h=((f+d)+a/2.0)*g;
-			    i=cos(h+r*p.x/1.3)*(e+e+a)+cos(q*g*6.0)*(r+h/3.0);
-			    h=sin(f*g)*144.0-sin(e*g)*212.0*p.x;
-			    h=(h+(f-e)*q+sin(r-(a+h)/7.0)*10.0+i/4.0)*g;
-			    i+=cos(h*2.3*sin(a/350.0-q))*184.0*sin(q-(r*4.3+a/12.0)*g)+tan(r*g+h)*184.0*cos(r*g+h);
-			    i=mod(i/5.6,256.0)/64.0;
-			    if(i<0.0) i+=4.0;
-			    if(i>=2.0) i=4.0-i;
-			    d=r/350.0;
-			    d+=sin(d*d*8.0)*0.52;
-			    f=(sin(a*g)+1.0)/2.0;
-			    gl_FragColor=vec4(vec3(f*i/1.6,i/2.0+d/13.0,i)*d*p.x+vec3(i/1.3+d/8.0,i/2.0+d/18.0,i)*d*(1.0-p.x),1.0);
+				vec2 p = -1.0 + 2.0 * gl_FragCoord.xy / resolution.xy;
+				float a = time*40.0;
+				float d,e,f,g=1.0/40.0,h,i,r,q;
+				e=400.0*(p.x*0.5+0.5);
+				f=400.0*(p.y*0.5+0.5);
+				i=200.0+sin(e*g+a/150.0)*20.0;
+				d=200.0+cos(f*g/2.0)*18.0+cos(e*g)*7.0;
+				r=sqrt(pow(i-e,2.0)+pow(d-f,2.0));
+				q=f/r;
+				e=(r*cos(q))-a/2.0;f=(r*sin(q))-a/2.0;
+				d=sin(e*g)*176.0+sin(e*g)*164.0+r;
+				h=((f+d)+a/2.0)*g;
+				i=cos(h+r*p.x/1.3)*(e+e+a)+cos(q*g*6.0)*(r+h/3.0);
+				h=sin(f*g)*144.0-sin(e*g)*212.0*p.x;
+				h=(h+(f-e)*q+sin(r-(a+h)/7.0)*10.0+i/4.0)*g;
+				i+=cos(h*2.3*sin(a/350.0-q))*184.0*sin(q-(r*4.3+a/12.0)*g)+tan(r*g+h)*184.0*cos(r*g+h);
+				i=mod(i/5.6,256.0)/64.0;
+				if(i<0.0) i+=4.0;
+				if(i>=2.0) i=4.0-i;
+				d=r/350.0;
+				d+=sin(d*d*8.0)*0.52;
+				f=(sin(a*g)+1.0)/2.0;
+				gl_FragColor=vec4(vec3(f*i/1.6,i/2.0+d/13.0,i)*d*p.x+vec3(i/1.3+d/8.0,i/2.0+d/18.0,i)*d*(1.0-p.x),1.0);
 			}
 		</script>
 
 		<script type="text/javascript">
-		
-			if ( ! THREE.Detector.webgl ) THREE.Detector.addGetWebGLMessage();
+
+			if ( ! Detector.webgl ) Detector.addGetWebGLMessage();
 
 			var container, stats;
 
@@ -101,7 +101,7 @@
 			var windowHalfY = window.innerHeight / 2;
 
 			init();
-			setInterval( loop, 1000 / 60 );
+			animate();
 
 			function init() {
 
@@ -150,12 +150,22 @@
 
 			}
 
-			function loop() {
+			//
+
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+				stats.update();
+
+			}
+
+			function render() {
 
 				uniforms.time.value += 0.05;
 
 				renderer.render( scene, camera );
-				stats.update();
 
 			}
 

+ 76 - 64
examples/shader2.html → examples/webgl_shader2.html

@@ -1,7 +1,7 @@
 <!DOCTYPE HTML>
 <html lang="en">
 	<head>
-		<title>three.js - materials - shaders [custom] - webgl</title>
+		<title>three.js webgl - materials - shaders [custom]</title>
 		<meta charset="utf-8">
 		<style type="text/css">
 			body {
@@ -32,12 +32,14 @@
 	</head>
 	<body>
 
-		<div id="container"></div> 
-		<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> 
+		<div id="container"></div>
+		<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>
+		<script type="text/javascript" src="../build/Three.js"></script>
 
+		<script type="text/javascript" src="js/Detector.js"></script>
+		<script type="text/javascript" src="js/RequestAnimationFrame.js"></script>
+		<script type="text/javascript" src="js/Stats.js"></script>
 
 		<script id="fragment_shader4" type="x-shader/x-fragment">
 
@@ -45,11 +47,11 @@
 			uniform vec2 resolution;
 
 			varying vec2 vUv;
-			
+
 			void main( void ) {
 
 				vec2 position = -1.0 + 2.0 * vUv;
-				
+
 				float red = abs( sin( position.x * position.y + time / 5.0 ) );
 				float green = abs( sin( position.x * position.y + time / 4.0 ) );
 				float blue = abs( sin( position.x * position.y + time / 3.0 ) );
@@ -58,18 +60,18 @@
 			}
 
 		</script>
-		
+
 		<script id="fragment_shader3" type="x-shader/x-fragment">
 
 			uniform float time;
 			uniform vec2 resolution;
-			
+
 			varying vec2 vUv;
-			
+
 			void main( void ) {
 
 				vec2 position = vUv;
-				
+
 				float color = 0.0;
 				color += sin( position.x * cos( time / 15.0 ) * 80.0 ) + cos( position.y * cos( time / 15.0 ) * 10.0 );
 				color += sin( position.y * sin( time / 10.0 ) * 40.0 ) + cos( position.x * sin( time / 25.0 ) * 40.0 );
@@ -83,18 +85,18 @@
 		</script>
 
 		<script id="fragment_shader2" type="x-shader/x-fragment">
-		
+
 			uniform float time;
 			uniform vec2 resolution;
 
 			uniform sampler2D texture;
-			
+
 			varying vec2 vUv;
-			
+
 			void main( void ) {
 
 				vec2 position = -1.0 + 2.0 * vUv;
-				
+
 				float a = atan( position.y, position.x );
 				float r = sqrt( dot( position, position ) );
 
@@ -120,60 +122,60 @@
 			uniform float time;
 
 			varying vec2 vUv;
-			
+
 			void main(void)
 			{
-			    
+
 				vec2 p = -1.0 + 2.0 * vUv;
-			    float a = time*40.0;
-			    float d,e,f,g=1.0/40.0,h,i,r,q;
-				
-			    e=400.0*(p.x*0.5+0.5);
-			    f=400.0*(p.y*0.5+0.5);
-			    i=200.0+sin(e*g+a/150.0)*20.0;
-			    d=200.0+cos(f*g/2.0)*18.0+cos(e*g)*7.0;
-			    r=sqrt(pow(i-e,2.0)+pow(d-f,2.0));
-			    q=f/r;
-			    e=(r*cos(q))-a/2.0;f=(r*sin(q))-a/2.0;
-			    d=sin(e*g)*176.0+sin(e*g)*164.0+r;
-			    h=((f+d)+a/2.0)*g;
-			    i=cos(h+r*p.x/1.3)*(e+e+a)+cos(q*g*6.0)*(r+h/3.0);
-			    h=sin(f*g)*144.0-sin(e*g)*212.0*p.x;
-			    h=(h+(f-e)*q+sin(r-(a+h)/7.0)*10.0+i/4.0)*g;
-			    i+=cos(h*2.3*sin(a/350.0-q))*184.0*sin(q-(r*4.3+a/12.0)*g)+tan(r*g+h)*184.0*cos(r*g+h);
-			    i=mod(i/5.6,256.0)/64.0;
-			    if(i<0.0) i+=4.0;
-			    if(i>=2.0) i=4.0-i;
-			    d=r/350.0;
-			    d+=sin(d*d*8.0)*0.52;
-			    f=(sin(a*g)+1.0)/2.0;
-			    gl_FragColor=vec4(vec3(f*i/1.6,i/2.0+d/13.0,i)*d*p.x+vec3(i/1.3+d/8.0,i/2.0+d/18.0,i)*d*(1.0-p.x),1.0);
-				
+				float a = time*40.0;
+				float d,e,f,g=1.0/40.0,h,i,r,q;
+
+				e=400.0*(p.x*0.5+0.5);
+				f=400.0*(p.y*0.5+0.5);
+				i=200.0+sin(e*g+a/150.0)*20.0;
+				d=200.0+cos(f*g/2.0)*18.0+cos(e*g)*7.0;
+				r=sqrt(pow(i-e,2.0)+pow(d-f,2.0));
+				q=f/r;
+				e=(r*cos(q))-a/2.0;f=(r*sin(q))-a/2.0;
+				d=sin(e*g)*176.0+sin(e*g)*164.0+r;
+				h=((f+d)+a/2.0)*g;
+				i=cos(h+r*p.x/1.3)*(e+e+a)+cos(q*g*6.0)*(r+h/3.0);
+				h=sin(f*g)*144.0-sin(e*g)*212.0*p.x;
+				h=(h+(f-e)*q+sin(r-(a+h)/7.0)*10.0+i/4.0)*g;
+				i+=cos(h*2.3*sin(a/350.0-q))*184.0*sin(q-(r*4.3+a/12.0)*g)+tan(r*g+h)*184.0*cos(r*g+h);
+				i=mod(i/5.6,256.0)/64.0;
+				if(i<0.0) i+=4.0;
+				if(i>=2.0) i=4.0-i;
+				d=r/350.0;
+				d+=sin(d*d*8.0)*0.52;
+				f=(sin(a*g)+1.0)/2.0;
+				gl_FragColor=vec4(vec3(f*i/1.6,i/2.0+d/13.0,i)*d*p.x+vec3(i/1.3+d/8.0,i/2.0+d/18.0,i)*d*(1.0-p.x),1.0);
+
 			}
-			
+
 		</script>
 
 		<script id="vertex_shader" type="x-shader/x-vertex">
-		
+
 			varying vec2 vUv;
-			
+
 			void main()
 			{
 				vUv = uv;
 				vec4 mvPosition = modelViewMatrix * vec4( position, 1.0 );
 				gl_Position = projectionMatrix * mvPosition;
 			}
-			
+
 		</script>
 
 		<script type="text/javascript">
 
-			if ( ! THREE.Detector.webgl ) THREE.Detector.addGetWebGLMessage();
-			
+			if ( ! Detector.webgl ) Detector.addGetWebGLMessage();
+
 			var container, stats;
 
 			var start_time;
-			
+
 			var camera, scene, renderer;
 
 			var uniforms1, uniforms2, material1, material2, mesh, meshes = [];
@@ -185,7 +187,7 @@
 			var windowHalfY = window.innerHeight / 2;
 
 			init();
-			setInterval( loop, 1000 / 60 );
+			animate();
 
 			function init() {
 
@@ -197,7 +199,7 @@
 				scene = new THREE.Scene();
 
 				start_time = new Date().getTime();
-				
+
 				uniforms1 = {
 					time: { type: "f", value: 1.0 },
 					resolution: { type: "v2", value: new THREE.Vector2() }
@@ -208,14 +210,14 @@
 					resolution: { type: "v2", value: new THREE.Vector2() },
 					texture: { type: "t", value: 0, texture: ImageUtils.loadTexture( "textures/disturb.jpg" ) }
 				};
-				
+
 				uniforms2.texture.texture.wrap_s = uniforms2.texture.texture.wrap_t = THREE.Repeat;
 
-				var size = 0.75, mlib = [], 
+				var size = 0.75, mlib = [],
 					params = [ [ 'fragment_shader1', uniforms1 ],  [ 'fragment_shader2', uniforms2 ], [ 'fragment_shader3', uniforms1 ], [ 'fragment_shader4', uniforms1 ] ];
-				
+
 				for( var i = 0; i < params.length; i++ ) {
-				
+
 					material = new THREE.MeshShaderMaterial( {
 
 						uniforms: params[ i ][ 1 ],
@@ -223,18 +225,18 @@
 						fragment_shader: document.getElementById( params[ i ][ 0 ] ).textContent
 
 						} );
-						
+
 					mlib[ i ] = material;
 
 					mesh = new THREE.Mesh( new Cube( size, size, size, 1, 1, [ mlib[ i ], mlib[ i ], mlib[ i ], mlib[ i ], mlib[ i ], mlib[ i ] ], false ), new THREE.MeshFaceMaterial() );
 					mesh.position.x = i - (params.length - 1)/2;
 					mesh.position.y = i % 2 - 0.5;
 					scene.addObject( mesh );
-					
+
 					meshes[ i ] = mesh;
 
 				}
-				
+
 				renderer = new THREE.WebGLRenderer();
 				container.appendChild( renderer.domElement );
 
@@ -253,28 +255,38 @@
 
 				uniforms1.resolution.value.x = window.innerWidth;
 				uniforms1.resolution.value.y = window.innerHeight;
-				
+
 				uniforms2.resolution.value.x = window.innerWidth;
 				uniforms2.resolution.value.y = window.innerHeight;
-				
+
 				renderer.setSize( window.innerWidth, window.innerHeight );
 
 			}
 
-			function loop() {
+			//
+
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+				stats.update();
+
+			}
+
+			function render() {
 
 				uniforms1.time.value += 0.05;
 				uniforms2.time.value = ( new Date().getTime() - start_time ) / 1000;
-				
+
 				for( var i = 0; i < meshes.length; ++i ) {
-					
+
 					meshes[ i ].rotation.y += 0.01 * ( i % 2 ? 1 : -1 );
 					meshes[ i ].rotation.x += 0.01 * ( i % 2 ? -1 : 1 );
-					
+
 				}
 
 				renderer.render( scene, camera );
-				stats.update();
 
 			}
 

+ 297 - 0
src/animation/Animation.js

@@ -0,0 +1,297 @@
+/**
+ * @author mikael emtinger / http://gomo.se/
+ */
+
+THREE.Animation = function( root, data ) {
+
+	this.root = root;
+	this.data = data;
+	this.hierarchy = [];
+
+	this.startTime = 0;
+	this.isPlaying = false;
+	this.loop = true;
+
+	this.offset = 0;
+
+	// need to initialize data?
+
+	if( !this.data.initialized ) {
+
+		THREE.AnimationHandler.initData( this.data );
+
+	}
+
+
+	// setup hierarchy
+
+	if ( root instanceof THREE.SkinnedMesh ) {
+
+		for( var b = 0; b < this.root.bones.length; b++ ) {
+
+			this.hierarchy.push( this.root.bones[ b ] );
+
+		}
+
+	} else {
+
+		// parse hierarchy and match against animation (somehow)
+
+	}
+
+}
+
+
+/*
+ * Play
+ */
+
+THREE.Animation.prototype.play = function( loop ) {
+
+	if( !this.isPlaying ) {
+
+		this.isPlaying = true;
+		this.startTime = new Date().getTime() * 0.001;
+
+		// reset key cache
+
+		for ( var h = 0; h < this.hierarchy.length; h++ ) {
+
+			this.hierarchy[ h ].useQuaternion    = true;
+			this.hierarchy[ h ].matrixAutoUpdate = true;
+
+			if ( this.hierarchy[ h ].prevKey === undefined ) {
+
+				this.hierarchy[ h ].prevKey = { pos: 0, rot: 0, scl: 0 };
+				this.hierarchy[ h ].nextKey = { pos: 0, rot: 0, scl: 0 };
+
+			}
+
+			this.hierarchy[ h ].prevKey.pos = this.data.hierarchy[ h ].keys[ 0 ];
+			this.hierarchy[ h ].prevKey.rot = this.data.hierarchy[ h ].keys[ 0 ];
+			this.hierarchy[ h ].prevKey.scl = this.data.hierarchy[ h ].keys[ 0 ];
+
+			this.hierarchy[ h ].nextKey.pos = this.getNextKeyWith( "pos", h, 1 );
+			this.hierarchy[ h ].nextKey.rot = this.getNextKeyWith( "rot", h, 1 );
+			this.hierarchy[ h ].nextKey.scl = this.getNextKeyWith( "scl", h, 1 );
+		}
+
+		this.update();
+
+		THREE.AnimationHandler.add( this );
+
+	}
+
+};
+
+
+/*
+ * Pause
+ */
+
+THREE.Animation.prototype.pause = function() {
+
+	THREE.AnimationHandler.remove( this );
+
+	// todo
+}
+
+
+/*
+ * Stop
+ */
+
+THREE.Animation.prototype.stop = function() {
+
+	this.isPlaying = false;
+	THREE.AnimationHandler.remove( this );
+}
+
+
+/*
+ * Update
+ */
+
+THREE.Animation.prototype.update = function( time ) {
+
+	// TODO: add input time
+
+	// early out
+
+	if( !this.isPlaying ) return;
+
+
+	// vars
+
+	var types = [ "pos", "rot", "scl" ];
+	var scale;
+	var relative;
+	var vector;
+	var prevXYZ, nextXYZ;
+	var object;
+	var frame;
+	var JIThierarchy = this.data.JIT.hierarchy;
+
+	// update
+
+	var currentTime         = new Date().getTime() * 0.001 - this.startTime + this.offset;
+	var unloopedCurrentTime = currentTime;
+
+
+	// looped?
+
+	if ( currentTime > this.data.length ) {
+
+		while( currentTime > this.data.length ) {
+
+			currentTime -= this.data.length;
+
+		}
+
+		this.startTime = new Date().getTime() * 0.001 - currentTime;
+		currentTime    = new Date().getTime() * 0.001 - this.startTime;
+
+	}
+
+	frame = Math.min( parseInt( currentTime * this.data.fps ), parseInt( this.data.length * this.data.fps ) );
+
+	// update
+
+	for ( var h = 0, hl = this.hierarchy.length; h < hl; h++ ) {
+
+		object = this.hierarchy[ h ];
+
+		if ( JIThierarchy[ h ][ frame ] !== undefined ) {
+
+			object.skinMatrix = JIThierarchy[ h ][ frame ];
+			object.matrixAutoUpdate = false;
+			object.matrixNeedsUpdate = false;
+
+			object.skinMatrix.flattenToArrayOffset( this.root.boneMatrices, h * 16 );
+
+		} else {
+
+			for ( var t = 0; t < 3; t++ ) {
+
+				// get keys
+
+				var type    = types[ t ];
+				var prevKey = object.prevKey[ type ];
+				var nextKey = object.nextKey[ type ];
+
+				// switch keys?
+
+				if ( nextKey.time < unloopedCurrentTime ) {
+
+					// did we loop?
+
+					if ( currentTime < unloopedCurrentTime ) {
+
+						if ( this.loop ) {
+
+							prevKey = this.data.hierarchy[ h ].keys[ 0 ];
+							nextKey = this.getNextKeyWith( type, h, 1 );
+
+						} else {
+
+							this.stop();
+							return;
+
+						}
+
+					} else {
+
+						do {
+
+							prevKey = nextKey;
+							nextKey = this.getNextKeyWith( type, h, nextKey.index + 1 );
+
+						} while( nextKey.time < currentTime )
+
+					}
+
+					object.prevKey[ type ] = prevKey;
+					object.nextKey[ type ] = nextKey;
+
+				}
+
+				// interpolate rot (quaternion slerp)
+
+				object.matrixAutoUpdate = true;
+				object.matrixNeedsUpdate = true;
+
+				scale = ( currentTime - prevKey.time ) / ( nextKey.time - prevKey.time );
+				prevXYZ = prevKey[ type ];
+				nextXYZ = nextKey[ type ];
+
+				if ( type === "rot" ) {
+
+					if ( scale < 0 || scale > 1 ) {
+
+						console.log( "Scale out of bounds:" + scale ); 
+						scale = scale < 0 ? 0 : 1;
+
+					}
+
+					THREE.Quaternion.slerp( prevXYZ, nextXYZ, object.quaternion, scale );
+
+				}
+
+				// lerp pos/scl 
+
+				else {
+
+					vector   = type === "pos" ? object.position : object.scale; 
+					vector.x = prevXYZ[ 0 ] + ( nextXYZ[ 0 ] - prevXYZ[ 0 ] ) * scale;
+					vector.y = prevXYZ[ 1 ] + ( nextXYZ[ 1 ] - prevXYZ[ 1 ] ) * scale;
+					vector.z = prevXYZ[ 2 ] + ( nextXYZ[ 2 ] - prevXYZ[ 2 ] ) * scale;
+
+				}
+
+			}
+
+		}
+
+	}
+
+	// update JIT?
+
+	if ( JIThierarchy[ 0 ][ frame ] === undefined ) {
+
+		this.hierarchy[ 0 ].update( undefined, true );
+
+		for ( var h = 0; h < this.hierarchy.length; h++ ) {
+
+			JIThierarchy[ h ][ frame ] = this.hierarchy[ h ].skinMatrix.clone();
+
+		}
+
+	}
+
+};
+
+
+/*
+ * Update Object
+ */
+
+THREE.Animation.prototype.updateObject = function( h, currentTime, unloopedCurrentTime ) {}
+
+
+THREE.Animation.prototype.getNextKeyWith = function( type, h, key ) {
+
+	var keys = this.data.hierarchy[ h ].keys;
+
+	for ( ; key < keys.length; key++ ) {
+
+		if ( keys[ key ][ type ] !== undefined ) {
+
+			return keys[ key ];
+
+		}
+
+	}
+
+	return this.data.hierarchy[ h ].keys[ 0 ];
+
+}

+ 98 - 0
src/animation/AnimationHandler.js

@@ -0,0 +1,98 @@
+/**
+ * @author mikael emtinger / http://gomo.se/
+ */
+
+THREE.AnimationHandler = (function() {
+	
+	var playing = [];
+	var that    = {};
+	
+	
+	//--- update ---
+	
+	that.update = function( time ) {
+		
+		for( var i = 0; i < playing.length; i++ )
+			playing[ i ].update( time );
+
+	};
+	
+	
+	//--- add ---
+	
+	that.add = function( animation ) {
+		
+		if( playing.indexOf( animation ) === -1 )
+			playing.push( animation );
+
+	};
+	
+	
+	//--- remove ---
+	
+	that.remove = function( animation ) {
+		
+		var index = playing.indexOf( animation ); 
+		
+		if( index !== -1 )
+			playing.splice( childIndex, 1 );
+
+	};
+	
+	
+	//--- init data ---
+	
+	that.initData = function( data ) {
+		
+		if( data.initialized === true )
+			return;
+		
+		// loop through all keys		
+		
+		for( var h = 0; h < data.hierarchy.length; h++ ) {
+			
+			for( var k = 0; k < data.hierarchy[ h ].keys.length; k++ ) {
+			
+				// remove minus times
+				
+				if( data.hierarchy[ h ].keys[ k ].time < 0 )
+					data.hierarchy[ h ].keys[ k ].time = 0;
+			
+			
+				// set index
+				
+				data.hierarchy[ h ].keys[ k ].index = k;
+		
+			
+				// create quaternions
+			
+				if( data.hierarchy[ h ].keys[ k ].rot !== undefined &&
+				  !( data.hierarchy[ h ].keys[ k ].rot instanceof THREE.Quaternion ) ) {
+					
+					var quat = data.hierarchy[ h ].keys[ k ].rot;
+					data.hierarchy[ h ].keys[ k ].rot = new THREE.Quaternion( quat[0], quat[1], quat[2], quat[3] ); 
+
+				}	
+			}
+		}
+		
+		
+		// JIT
+
+		var lengthInFrames = parseInt( data.length * data.fps, 10 );
+		
+		data.JIT = {};
+		data.JIT.hierarchy = [];
+		
+		for( var h = 0; h < data.hierarchy.length; h++ )
+			data.JIT.hierarchy.push( new Array( lengthInFrames ));
+		
+		
+		// done
+		
+		data.initialized = true;
+
+	};
+	
+	return that;
+}());

+ 164 - 21
src/cameras/Camera.js

@@ -1,31 +1,39 @@
 /**
  * @author mr.doob / http://mrdoob.com/
+ * @author mikael emtinger / http://gomo.se/
  */
 
-THREE.Camera = function ( fov, aspect, near, far ) {
+THREE.Camera = function( fov, aspect, near, far, target ) {
 
-	this.fov = fov;
-	this.aspect = aspect;
-	this.near = near;
-	this.far = far;
+	THREE.Object3D.call( this );
 
-	this.position = new THREE.Vector3();
-	this.target = { position: new THREE.Vector3() };
+	this.fov = fov || 50;
+	this.aspect = aspect || 1.0;
+	this.near = near || 0.1;
+	this.far = far || 2000;
 
-	this.autoUpdateMatrix = true;
+	this.screenCenterX = 0;
+	this.screenCenterY = 0;
 
-	this.projectionMatrix = null;
-	this.matrix = new THREE.Matrix4();
+	this.target = target || new THREE.Object3D();
+	this.useTarget = true;
 
 	this.up = new THREE.Vector3( 0, 1, 0 );
 
+	this.inverseMatrix     = new THREE.Matrix4();
+	this.projectionMatrix = null;
+
+	// movement
+
 	this.tmpVec = new THREE.Vector3();
 
-	this.translateX = function ( amount ) {
+	this.translateX = function ( amount, nofly ) {
 
 		this.tmpVec.sub( this.target.position, this.position ).normalize().multiplyScalar( amount );
 		this.tmpVec.crossSelf( this.up );
 
+		if ( nofly ) this.tmpVec.y = 0;
+
 		this.position.addSelf( this.tmpVec );
 		this.target.position.addSelf( this.tmpVec );
 
@@ -37,37 +45,172 @@ THREE.Camera = function ( fov, aspect, near, far ) {
 	};
 	*/
 
-	this.translateZ = function ( amount ) {
+	this.translateZ = function ( amount, nofly ) {
 
 		this.tmpVec.sub( this.target.position, this.position ).normalize().multiplyScalar( amount );
 
+		if ( nofly ) this.tmpVec.y = 0;
+
 		this.position.subSelf( this.tmpVec );
 		this.target.position.subSelf( this.tmpVec );
 
 	};
 
-	this.updateMatrix = function () {
+	this.updateProjectionMatrix();
+
+}
+
+THREE.Camera.prototype = new THREE.Object3D();
+THREE.Camera.prototype.constructor = THREE.Camera;
+THREE.Camera.prototype.supr = THREE.Object3D.prototype;
+
+
+/*
+ * Update projection matrix
+ *
+ * TODO: make it work also for ortho camera
+*/
+
+THREE.Camera.prototype.updateProjectionMatrix = function() {
+
+	this.projectionMatrix = THREE.Matrix4.makePerspective( this.fov, this.aspect, this.near, this.far );
+
+}
+
+
+/*
+ * Update
+ */
+
+THREE.Camera.prototype.update = function( parentMatrixWorld, forceUpdate, camera ) {
+
+	if( this.useTarget ) {
+
+		// local
 
 		this.matrix.lookAt( this.position, this.target.position, this.up );
 
-	};
 
-	this.updateProjectionMatrix = function () {
+		// global
 
-		this.projectionMatrix = THREE.Matrix4.makePerspective( this.fov, this.aspect, this.near, this.far );
+		if( parentMatrixWorld ) {
 
-	};
+			this.matrixWorld.multiply( parentMatrixWorld, this.matrix );
 
-	this.updateProjectionMatrix();
+		} else {
+
+			this.matrixWorld.copy( this.matrix );
+
+		}
+
+		THREE.Matrix4.makeInvert( this.matrixWorld, this.inverseMatrix );
+		//THREE.Matrix4.makeInvertTo( this.matrixWorld, this.inverseMatrix );
+
+		forceUpdate = true;
+
+	} else {
+
+		if( this.matrixAutoUpdate )
+			forceUpdate |= this.updateMatrix();
+
+		if( forceUpdate || this.matrixNeedsUpdate ) {
+
+			if( parentMatrixWorld ) {
+
+				this.matrixWorld.multiply( parentMatrixWorld, this.matrix );
+
+			} else {
+
+				this.matrixWorld.copy( this.matrix );
+
+			}
+
+			this.matrixNeedsUpdate = false;
+			forceUpdate              = true;
+
+			THREE.Matrix4.makeInvert( this.matrixWorld, this.inverseMatrix );
+			//THREE.Matrix4.makeInvertTo( this.matrixWorld, this.inverseMatrix );
+
+		}
+
+	}
+
+	// update children
+
+	for ( var i = 0; i < this.children.length; i++ ) {
+
+		this.children[ i ].update( this.matrixWorld, forceUpdate, camera );
+
+	}
 
 };
 
-THREE.Camera.prototype = {
 
-	toString: function () {
+/*
+ * FrustumContains
+ * Checks object against projected image (as opposed to ordinary frustum check)
+ *
+ * TODO: make it work also for ortho camera
+ */
+
+THREE.Camera.prototype.frustumContains = function( object3D ) {
+
+	// object pos
+
+	var vx0 = object3D.matrixWorld.n14,
+	vy0 = object3D.matrixWorld.n24,
+	vz0 = object3D.matrixWorld.n34;
 
-		return 'THREE.Camera ( ' + this.position + ', ' + this.target.position + ' )';
+	// check z
+
+	var inverse = this.inverseMatrix;
+	var radius = object3D.boundRadius * object3D.boundRadiusScale;
+	var vz1 = ( inverse.n31 * vx0 + inverse.n32 * vy0 + inverse.n33 * vz0 + inverse.n34 );
+
+	if( vz1 - radius > - this.near ) {
+
+		return false;
 
 	}
 
+	if( vz1 + radius < - this.far ) {
+
+		return false;
+
+	}
+
+	// check x
+
+	vz1 -= radius;
+
+	var perspective      = this.projectionMatrix;
+	var ooZ              = 1 / ( perspective.n43 * vz1 );
+	var ooZscreenCenterX = ooZ * this.screenCenterX;
+	var vx1              = ( inverse.n11 * vx0 + inverse.n12 * vy0 + inverse.n13 * vz0 + inverse.n14 ) * perspective.n11 * ooZscreenCenterX;
+	radius               = perspective.n11 * radius * ooZscreenCenterX;
+
+	if( vx1 + radius < -this.screenCenterX )
+		return false;
+
+	if( vx1 - radius > this.screenCenterX )
+		return false;
+
+
+	// check y
+
+	var vy1 = ( inverse.n21 * vx0 + inverse.n22 * vy0 + inverse.n23 * vz0 + inverse.n24 ) * perspective.n22 * ooZ * this.screenCenterY;
+
+	if( vy1 + radius < -this.screenCenterY )
+		return false;
+
+	if( vy1 - radius > this.screenCenterY )
+		return false;
+
+
+	// inside
+
+	object3D.positionScreen.set( vx1, vy1, vz1, radius );
+
+	return true;
+
 };

部分文件因为文件数量过多而无法显示