Home Explore Help
Sign In
javascript
/
three.js
mirror of https://github.com/tazdij/three.js.git
2
0
Fork 0
Files Issues 0 Wiki
Browse Source

Merge branch 'dev' into SessionEvent

Takahiro 6 years ago
parent
5cd8fe02fe 399f52d3f5
commit
4ac589714a
100 changed files with 1372 additions and 2786 deletions
Split View Show Diff Stats
  1. 1 1
      .github/ISSUE_TEMPLATE.md
  2. 2 2
      README.md
  3. 15 5
      build/three.js
  4. 75 298
      build/three.min.js
  5. 15 5
      build/three.module.js
  6. 1 1
      docs/api/en/animation/KeyframeTrack.html
  7. 2 2
      docs/api/en/cameras/ArrayCamera.html
  8. 3 3
      docs/api/en/cameras/OrthographicCamera.html
  9. 3 2
      docs/api/en/cameras/PerspectiveCamera.html
  10. 1 1
      docs/api/en/core/BufferGeometry.html
  11. 2 2
      docs/api/en/core/Clock.html
  12. 4 2
      docs/api/en/core/Geometry.html
  13. 6 2
      docs/api/en/core/Object3D.html
  14. 1 1
      docs/api/en/extras/core/Path.html
  15. 1 1
      docs/api/en/extras/core/Shape.html
  16. 1 1
      docs/api/en/extras/core/ShapePath.html
  17. 1 1
      docs/api/en/extras/curves/ArcCurve.html
  18. 1 1
      docs/api/en/geometries/ConeBufferGeometry.html
  19. 1 1
      docs/api/en/geometries/ConeGeometry.html
  20. 1 1
      docs/api/en/geometries/DodecahedronBufferGeometry.html
  21. 1 1
      docs/api/en/geometries/IcosahedronBufferGeometry.html
  22. 1 1
      docs/api/en/geometries/OctahedronBufferGeometry.html
  23. 1 1
      docs/api/en/geometries/TetrahedronBufferGeometry.html
  24. 1 1
      docs/api/en/geometries/TextBufferGeometry.html
  25. 1 1
      docs/api/en/geometries/TextGeometry.html
  26. 1 1
      docs/api/en/helpers/AxesHelper.html
  27. 1 1
      docs/api/en/helpers/Box3Helper.html
  28. 7 7
      docs/api/en/helpers/BoxHelper.html
  29. 1 1
      docs/api/en/helpers/CameraHelper.html
  30. 1 1
      docs/api/en/helpers/FaceNormalsHelper.html
  31. 2 2
      docs/api/en/helpers/GridHelper.html
  32. 1 1
      docs/api/en/helpers/PlaneHelper.html
  33. 1 1
      docs/api/en/helpers/PointLightHelper.html
  34. 1 1
      docs/api/en/helpers/PolarGridHelper.html
  35. 1 1
      docs/api/en/helpers/VertexNormalsHelper.html
  36. 3 2
      docs/api/en/lights/Light.html
  37. 2 2
      docs/api/en/materials/Material.html
  38. 1 1
      docs/api/en/materials/RawShaderMaterial.html
  39. 22 2
      docs/api/en/math/Box3.html
  40. 1 0
      docs/api/en/math/Matrix4.html
  41. 15 5
      docs/api/en/renderers/WebGLRenderer.html
  42. 3 2
      docs/api/en/scenes/Scene.html
  43. 2 2
      docs/api/en/textures/Texture.html
  44. 1 1
      docs/api/zh/animation/KeyframeTrack.html
  45. 1 1
      docs/api/zh/cameras/ArrayCamera.html
  46. 2 2
      docs/api/zh/core/Clock.html
  47. 1 1
      docs/examples/controls/OrbitControls.html
  48. 1 1
      docs/examples/loaders/MTLLoader.html
  49. 3 3
      docs/examples/loaders/OBJLoader.html
  50. 1 1
      docs/examples/loaders/OBJLoader2.html
  51. 18 18
      docs/examples/math/convexhull/ConvexHull.html
  52. 2 2
      docs/examples/math/convexhull/Face.html
  53. 2 2
      docs/examples/math/convexhull/HalfEdge.html
  54. 2 2
      docs/examples/math/convexhull/VertexList.html
  55. 2 2
      docs/examples/math/convexhull/VertexNode.html
  56. 7 0
      docs/examples/renderers/SVGRenderer.html
  57. 0 20
      docs/examples/utils/SceneUtils.html
  58. 60 17
      docs/index.html
  59. 6 6
      docs/list.js
  60. 1 1
      docs/manual/en/introduction/Creating-a-scene.html
  61. 1 1
      docs/manual/en/introduction/Drawing-lines.html
  62. 0 2
      docs/manual/en/introduction/How-to-update-things.html
  63. 3 1
      docs/manual/en/introduction/How-to-use-WebGL2.html
  64. 201 2
      docs/manual/en/introduction/Import-via-modules.html
  65. 22 17
      docs/manual/en/introduction/Useful-links.html
  66. 20 12
      docs/manual/zh/introduction/Useful-links.html
  67. 159 76
      docs/page.css
  68. 1 3
      docs/prettify/threejs.css
  69. 1 1
      docs/scenes/geometry-browser.html
  70. 2 0
      editor/index.html
  71. 145 0
      editor/js/Sidebar.Geometry.ExtrudeGeometry.js
  72. 3 84
      editor/js/Sidebar.Geometry.LatheGeometry.js
  73. 55 0
      editor/js/Sidebar.Geometry.ShapeGeometry.js
  74. 2 83
      editor/js/Sidebar.Geometry.TubeGeometry.js
  75. 18 1
      editor/js/Sidebar.Project.js
  76. 13 0
      editor/js/Strings.js
  77. 256 0
      editor/js/libs/ui.three.js
  78. 5 4
      editor/manifest.json
  79. 9 1
      editor/sw.js
  80. 3 24
      examples/css2d_label.html
  81. 21 45
      examples/css3d_molecules.html
  82. 6 17
      examples/css3d_orthographic.html
  83. 1 24
      examples/css3d_panorama.html
  84. 3 26
      examples/css3d_panorama_deviceorientation.html
  85. 7 26
      examples/css3d_periodictable.html
  86. 4 20
      examples/css3d_sandbox.html
  87. 5 24
      examples/css3d_sprites.html
  88. 10 9
      examples/css3d_youtube.html
  89. 3 1
      examples/files.js
  90. 51 33
      examples/index.html
  91. 0 71
      examples/js/ImprovedNoise.js
  92. 0 23
      examples/js/PRNG.js
  93. 0 332
      examples/js/ShaderGodRays.js
  94. 0 694
      examples/js/ShaderSkin.js
  95. 0 324
      examples/js/ShaderTerrain.js
  96. 0 324
      examples/js/SimplexNoise.js
  97. 0 0
      examples/js/animation/AnimationClipCreator.js
  98. 21 27
      examples/js/animation/TimelinerController.js
  99. 2 2
      examples/js/cameras/CinematicCamera.js
  100. 1 1
      examples/js/controls/DragControls.js

+ 1 - 1
.github/ISSUE_TEMPLATE.md
View File 

@@ -19,7 +19,7 @@ Please also include a live example if possible. You can start from these templat
 
 ##### Three.js version
 
 
 - [ ] Dev
 
-- [ ] r104
 
+- [ ] r105
 
 - [ ] ...
 
 
 ##### Browser

+ 2 - 2
README.md
View File 

@@ -24,13 +24,13 @@ The aim of the project is to create an easy to use, lightweight, 3D library with
 
 ### Usage ###
 
 
 Download the [minified library](http://threejs.org/build/three.min.js) and include it in your HTML, or install and import it as a [module](http://threejs.org/docs/#manual/introduction/Import-via-modules),
 
-Alternatively see [how to build the library yourself](https://github.com/mrdoob/three.js/wiki/Build-instructions).
 
+Alternatively, see [how to build the library yourself](https://github.com/mrdoob/three.js/wiki/Build-instructions).
 
 
 ```html
 
 <script src="js/three.min.js"></script>
 
 ```
 
 
-This code creates a scene, a camera, and a geometric cube, and it adds the cube to the scene. It then creates a `WebGL` renderer for the scene and camera, and it adds that viewport to the document.body element. Finally, it animates the cube within the scene for the camera.
 
+This code creates a scene, a camera, and a geometric cube, and it adds the cube to the scene. It then creates a `WebGL` renderer for the scene and camera, and it adds that viewport to the `document.body` element. Finally, it animates the cube within the scene for the camera.
 
 
 ```javascript
 
 var camera, scene, renderer;

File diff suppressed because it is too large
+ 15 - 5
build/three.js


File diff suppressed because it is too large
+ 75 - 298
build/three.min.js


File diff suppressed because it is too large
+ 15 - 5
build/three.module.js


+ 1 - 1
docs/api/en/animation/KeyframeTrack.html
View File 

@@ -58,7 +58,7 @@
 
 
 		<p>
 
 			Some examples of how to manually create [page:AnimationClip AnimationClips] with different sorts
 
-			of KeyframeTracks can be found in the [link:https://threejs.org/examples/js/AnimationClipCreator.js]
 
+			of KeyframeTracks can be found in the [link:https://threejs.org/examples/js/animation/AnimationClipCreator.js AnimationClipCreator]
 
 			file.
 
 		</p>

+ 2 - 2
docs/api/en/cameras/ArrayCamera.html
View File 

@@ -8,13 +8,13 @@
 
 		<link type="text/css" rel="stylesheet" href="page.css" />
 
 	</head>
 
 	<body>
 
-		[page:PerspectiveCamera] &rarr;
 
+		[page:Object3D] &rarr; [page:Camera] &rarr; [page:PerspectiveCamera] &rarr;
 
 
 		<h1>[name]</h1>
 
 
 		<p class="desc">
 
 			[name] can be used in order to efficiently render a scene with a predefined set of cameras. This is an important performance aspect for rendering VR scenes.<br />
 
-			An instance of [name] always has an array of sub cameras. It's mandatory to define for each sub camera the *bounds* property which determines the part of the viewport that is rendered with this camera.
 
+			An instance of [name] always has an array of sub cameras. It's mandatory to define for each sub camera the *viewport* property which determines the part of the viewport that is rendered with this camera.
 
 		</p>
 
 
 		<h2>Example</h2>

+ 3 - 3
docs/api/en/cameras/OrthographicCamera.html
View File 

@@ -130,12 +130,12 @@ scene.add( camera );</code>
 
 		Updates the camera projection matrix. Must be called after any change of parameters.
 
 		</p>
 
 
-		<h3>[method:JSON toJSON]()</h3>
 
+		<h3>[method:Object toJSON](param:object meta])</h3>
 
 		<p>
 
-		Return the camera's data in JSON format.
 
+		meta -- object containing metadata such as textures or images in objects' descendants.<br />
 
+		Convert the camera to three.js [link:https://github.com/mrdoob/three.js/wiki/JSON-Object-Scene-format-4 JSON Object/Scene format].
 
 		</p>
 
 
-
 
 		<h2>Source</h2>
 
 
 		[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]

+ 3 - 2
docs/api/en/cameras/PerspectiveCamera.html
View File 

@@ -190,9 +190,10 @@ camera.setViewOffset( fullWidth, fullHeight, w * 2, h * 1, w, h );
 
 		Updates the camera projection matrix. Must be called after any change of parameters.
 
 		</p>
 
 
-		<h3>[method:JSON toJSON]()</h3>
 
+		<h3>[method:Object toJSON](param:object meta])</h3>
 
 		<p>
 
-		Return camera data in JSON format.
 
+		meta -- object containing metadata such as textures or images in objects' descendants.<br />
 
+		Convert the camera to three.js [link:https://github.com/mrdoob/three.js/wiki/JSON-Object-Scene-format-4 JSON Object/Scene format].
 
 		</p>
 
 
 		<h2>Source</h2>

+ 1 - 1
docs/api/en/core/BufferGeometry.html
View File 

@@ -327,7 +327,7 @@
 
 		<p>Sets the attributes for this BufferGeometry from an array of points.</p>
 
 
 		<h3>[method:Object toJSON]()</h3>
 
-		<p>Returns a JSON object representation of the BufferGeometry.</p>
 
+		<p>Convert the buffer geometry to three.js [link:https://github.com/mrdoob/three.js/wiki/JSON-Object-Scene-format-4 JSON Object/Scene format].</p>
 
 
 		<h3>[method:BufferGeometry toNonIndexed]()</h3>
 
 		<p>Return a non-index version of an indexed BufferGeometry.</p>

+ 2 - 2
docs/api/en/core/Clock.html
View File 

@@ -11,8 +11,8 @@
 
 		<h1>[name]</h1>
 
 
 		<p class="desc">
 
-		Object for keeping track of time. This uses <a href="https://developer.mozilla.org/en-US/docs/Web/API/Performance/now">performance.now()</a>
 
-		if it is available, otherwise it reverts to the less accurate <a href="https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Date/now">Date.now()</a>.
 
+		Object for keeping track of time. This uses [link:https://developer.mozilla.org/en-US/docs/Web/API/Performance/now performance.now]
 
+		if it is available, otherwise it reverts to the less accurate [link:https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Date/now Date.now].
 
 		</p>

+ 4 - 2
docs/api/en/core/Geometry.html
View File 

@@ -327,8 +327,10 @@
 
 		Use [page:Object3D.scale] for typical real-time mesh scaling.
 
 		</p>
 
 
-		<h3>[method:JSON toJSON] ( )</h3>
 
-		<p>Convert the geometry to JSON format.</p>
 
+		<h3>[method:Object toJSON] ( )</h3>
 
+		<p>Convert the geometry to JSON format.<br />
 
+		Convert the geometry to three.js [link:https://github.com/mrdoob/three.js/wiki/JSON-Object-Scene-format-4 JSON Object/Scene format].
 
+		</p>
 
 
 		<h3>[method:Geometry translate] ( [param:Float x], [param:Float y], [param:Float z] )</h3>
 
 		<p>

+ 6 - 2
docs/api/en/core/Object3D.html
View File 

@@ -217,6 +217,9 @@
 
 		<h3>[method:this applyQuaternion]( [param:Quaternion quaternion] )</h3>
 
 		<p>Applies the rotation represented by the quaternion to the object.</p>
 
 
+		<h3>[method:this attach]( [param:Object3D object] )</h3>
 
+		<p>Adds *object* as a child of this, while maintaining the object's world transform.</p>
 
+
 
 		<h3>[method:Object3D clone]( [param:Boolean recursive] )</h3>
 
 		<p>
 
 		recursive -- if true, descendants of the object are also cloned. Default is true.<br /><br />
 
@@ -389,9 +392,10 @@
 
 			Copy the given quaternion into [page:.quaternion].
 
 		</p>
 
 
-		<h3>[method:null toJSON]( [param:Quaternion q] )</h3>
 
+		<h3>[method:Object toJSON]( [param:object meta] )</h3>
 
 		<p>
 
-			Convert the object to JSON format.
 
+		meta -- object containing metadata such as materials, textures or images for the object.<br />
 
+		Convert the object to three.js [link:https://github.com/mrdoob/three.js/wiki/JSON-Object-Scene-format-4 JSON Object/Scene format].
 
 		</p>
 
 
 		<h3>[method:this translateOnAxis]( [param:Vector3 axis], [param:Float distance] )</h3>

+ 1 - 1
docs/api/en/extras/core/Path.html
View File 

@@ -8,7 +8,7 @@
 
 		<link type="text/css" rel="stylesheet" href="page.css" />
 
 	</head>
 
 	<body>
 
-		[page:CurvePath] &rarr;
 
+		[page:Curve] &rarr; [page:CurvePath] &rarr;
 
 
 		<h1>[name]</h1>

+ 1 - 1
docs/api/en/extras/core/Shape.html
View File 

@@ -8,7 +8,7 @@
 
 		<link type="text/css" rel="stylesheet" href="page.css" />
 
 	</head>
 
 	<body>
 
-		[page:Path] &rarr;
 
+		[page:Curve] &rarr; [page:CurvePath] &rarr; [page:Path] &rarr;
 
 
 		<h1>[name]</h1>

+ 1 - 1
docs/api/en/extras/core/ShapePath.html
View File 

@@ -8,7 +8,7 @@
 
 		<link type="text/css" rel="stylesheet" href="page.css" />
 
 	</head>
 
 	<body>
 
-		[page:CurvePath] &rarr;
 
+		[page:Curve] &rarr; [page:CurvePath] &rarr;
 
 
 		<h1>[name]</h1>

+ 1 - 1
docs/api/en/extras/curves/ArcCurve.html
View File 

@@ -8,7 +8,7 @@
 
 		<link type="text/css" rel="stylesheet" href="page.css" />
 
 	</head>
 
 	<body>
 
-		[page:EllipseCurve] &rarr;
 
+		[page:Curve] &rarr; [page:EllipseCurve] &rarr;
 
 
 		<h1>[name]</h1>

+ 1 - 1
docs/api/en/geometries/ConeBufferGeometry.html
View File 

@@ -8,7 +8,7 @@
 
 		<link type="text/css" rel="stylesheet" href="page.css" />
 
 	</head>
 
 	<body>
 
-		[page:CylinderBufferGeometry] &rarr;
 
+		[page:BufferGeometry] &rarr; [page:CylinderBufferGeometry] &rarr;
 
 
 		<h1>[name]</h1>

+ 1 - 1
docs/api/en/geometries/ConeGeometry.html
View File 

@@ -8,7 +8,7 @@
 
 		<link type="text/css" rel="stylesheet" href="page.css" />
 
 	</head>
 
 	<body>
 
-		[page:CylinderGeometry] &rarr;
 
+		[page:Geometry] &rarr; [page:CylinderGeometry] &rarr;
 
 
 		<h1>[name]</h1>

+ 1 - 1
docs/api/en/geometries/DodecahedronBufferGeometry.html
View File 

@@ -8,7 +8,7 @@
 
 		<link type="text/css" rel="stylesheet" href="page.css" />
 
 	</head>
 
 	<body>
 
-		[page:PolyhedronBufferGeometry] &rarr;
 
+		[page:BufferGeometry] &rarr; [page:PolyhedronBufferGeometry] &rarr;
 
 
 		<h1>[name]</h1>

+ 1 - 1
docs/api/en/geometries/IcosahedronBufferGeometry.html
View File 

@@ -8,7 +8,7 @@
 
 		<link type="text/css" rel="stylesheet" href="page.css" />
 
 	</head>
 
 	<body>
 
-		[page:PolyhedronBufferGeometry] &rarr;
 
+		[page:BufferGeometry] &rarr; [page:PolyhedronBufferGeometry] &rarr;
 
 		<h1>[name]</h1>
 
 
 		<p class="desc">A class for generating an icosahedron geometry.</p>

+ 1 - 1
docs/api/en/geometries/OctahedronBufferGeometry.html
View File 

@@ -8,7 +8,7 @@
 
 		<link type="text/css" rel="stylesheet" href="page.css" />
 
 	</head>
 
 	<body>
 
-		[page:PolyhedronBufferGeometry] &rarr;
 
+		[page:BufferGeometry] &rarr; [page:PolyhedronBufferGeometry] &rarr;
 
 		<h1>[name]</h1>
 
 
 		<p class="desc">A class for generating an octahedron geometry.</p>

+ 1 - 1
docs/api/en/geometries/TetrahedronBufferGeometry.html
View File 

@@ -8,7 +8,7 @@
 
 		<link type="text/css" rel="stylesheet" href="page.css" />
 
 	</head>
 
 	<body>
 
-		[page:PolyhedronBufferGeometry] &rarr;
 
+		[page:BufferGeometry] &rarr; [page:PolyhedronBufferGeometry] &rarr;
 
 
 		<h1>[name]</h1>

+ 1 - 1
docs/api/en/geometries/TextBufferGeometry.html
View File 

@@ -8,7 +8,7 @@
 
 		<link type="text/css" rel="stylesheet" href="page.css" />
 
 	</head>
 
 	<body>
 
-		[page:ExtrudeBufferGeometry] &rarr;
 
+		[page:BufferGeometry] &rarr; [page:ExtrudeBufferGeometry] &rarr;
 
 
 		<h1>[name]</h1>

+ 1 - 1
docs/api/en/geometries/TextGeometry.html
View File 

@@ -8,7 +8,7 @@
 
 		<link type="text/css" rel="stylesheet" href="page.css" />
 
 	</head>
 
 	<body>
 
-		[page:ExtrudeGeometry] &rarr;
 
+		[page:Geometry] &rarr; [page:ExtrudeGeometry] &rarr;
 
 
 		<h1>[name]</h1>

+ 1 - 1
docs/api/en/helpers/AxesHelper.html
View File 

@@ -8,7 +8,7 @@
 
 		<link type="text/css" rel="stylesheet" href="page.css" />
 
 	</head>
 
 	<body>
 
-		[page:LineSegments] &rarr;
 
+		[page:Object3D] &rarr; [page:Line] &rarr; [page:LineSegments] &rarr;
 
 
 		<h1>[name]</h1>

+ 1 - 1
docs/api/en/helpers/Box3Helper.html
View File 

@@ -8,7 +8,7 @@
 
 		<link type="text/css" rel="stylesheet" href="page.css" />
 
 	</head>
 
 	<body>
 
-		[page:LineSegments] &rarr;
 
+		[page:Object3D] &rarr; [page:Line] &rarr; [page:LineSegments] &rarr;
 
 
 		<h1>[name]</h1>

+ 7 - 7
docs/api/en/helpers/BoxHelper.html
View File 

@@ -8,13 +8,13 @@
 
 		<link type="text/css" rel="stylesheet" href="page.css" />
 
 	</head>
 
 	<body>
 
-		[page:LineSegments] &rarr;
 
+		[page:Object3D] &rarr; [page:Line] &rarr; [page:LineSegments] &rarr;
 
 
 		<h1>[name]</h1>
 
 
 		<p class="desc">
 
-			Helper object to show the world-axis-aligned bounding box around an object.
 
-
 
+			Helper object to graphically show the world-axis-aligned bounding box around an object. The actual bounding box is handled with [page:Box3], this is just a visual helper for debugging.
 
+			It can be automatically resized with the [page:BoxHelper.update] method when the object it's created from is transformed.
 
 			Note that the object must have a [page:Geometry] or [page:BufferGeometry] for this to work,
 
 			so it won't work with [page:Sprite Sprites].
 
 		</p>
 
@@ -28,10 +28,10 @@
 
 
 
 		<code>
 
-		var sphere = new THREE.SphereGeometry();
 
-		var object = new THREE.Mesh( sphere, new THREE.MeshBasicMaterial( 0xff0000 ) );
 
-		var box = new THREE.BoxHelper( object, 0xffff00 );
 
-		scene.add( box );
 
+			var sphere = new THREE.SphereGeometry();
 
+			var object = new THREE.Mesh( sphere, new THREE.MeshBasicMaterial( 0xff0000 ) );
 
+			var box = new THREE.BoxHelper( object, 0xffff00 );
 
+			scene.add( box );
 
 		</code>

+ 1 - 1
docs/api/en/helpers/CameraHelper.html
View File 

@@ -8,7 +8,7 @@
 
 		<link type="text/css" rel="stylesheet" href="page.css" />
 
 	</head>
 
 	<body>
 
-		[page:LineSegments] &rarr;
 
+		[page:Object3D] &rarr; [page:Line] &rarr; [page:LineSegments] &rarr;
 
 
 		<h1>[name]</h1>

+ 1 - 1
docs/api/en/helpers/FaceNormalsHelper.html
View File 

@@ -8,7 +8,7 @@
 
 		<link type="text/css" rel="stylesheet" href="page.css" />
 
 	</head>
 
 	<body>
 
-		[page:LineSegments] &rarr;
 
+		[page:Object3D] &rarr; [page:Line] &rarr; [page:LineSegments] &rarr;
 
 
 		<h1>[name]</h1>

+ 2 - 2
docs/api/en/helpers/GridHelper.html
View File 

@@ -8,8 +8,8 @@
 
 		<link type="text/css" rel="stylesheet" href="page.css" />
 
 	</head>
 
 	<body>
 
-		[page:Line] &rarr;
 
-
 
+		[page:Object3D] &rarr; [page:Line] &rarr;
 
+		
 		<h1>[name]</h1>
 
 
 		<p class="desc">The GridHelper is an object to define grids. Grids are two-dimensional arrays of lines.</p>

+ 1 - 1
docs/api/en/helpers/PlaneHelper.html
View File 

@@ -8,7 +8,7 @@
 
 		<link type="text/css" rel="stylesheet" href="page.css" />
 
 	</head>
 
 	<body>
 
-		[page:LineSegments] &rarr;
 
+		[page:Object3D] &rarr; [page:Line] &rarr; [page:LineSegments] &rarr;
 
 
 		<h1>[name]</h1>

+ 1 - 1
docs/api/en/helpers/PointLightHelper.html
View File 

@@ -8,7 +8,7 @@
 
 		<link type="text/css" rel="stylesheet" href="page.css" />
 
 	</head>
 
 	<body>
 
-		[page:Mesh] &rarr;
 
+		[page:Object3D] &rarr; [page:Mesh] &rarr;
 
 
 		<h1>[name]</h1>

+ 1 - 1
docs/api/en/helpers/PolarGridHelper.html
View File 

@@ -8,7 +8,7 @@
 
 		<link type="text/css" rel="stylesheet" href="page.css" />
 
 	</head>
 
 	<body>
 
-		[page:Line] &rarr;
 
+		[page:Object3D] &rarr; [page:Line] &rarr;
 
 
 		<h1>[name]</h1>

+ 1 - 1
docs/api/en/helpers/VertexNormalsHelper.html
View File 

@@ -8,7 +8,7 @@
 
 		<link type="text/css" rel="stylesheet" href="page.css" />
 
 	</head>
 
 	<body>
 
-		[page:Line] &rarr;
 
+		[page:Object3D] &rarr; [page:Line] &rarr;
 
 
 		<h1>[name]</h1>

+ 3 - 2
docs/api/en/lights/Light.html
View File 

@@ -67,9 +67,10 @@
 
 		[page:Light source] light into this one.
 
 		</p>
 
 
-		<h3>[method:JSON toJSON]( [param:String meta] )</h3>
 
+		<h3>[method:Object toJSON]( [param:object meta] )</h3>
 
 		<p>
 
-		Return Light data in JSON format.
 
+		meta -- object containing metadata such as materials, textures for objects.<br />
 
+		Convert the light to three.js [link:https://github.com/mrdoob/three.js/wiki/JSON-Object-Scene-format-4 JSON Object/Scene format].
 
 		</p>
 
 
 		<h2>Source</h2>

+ 2 - 2
docs/api/en/materials/Material.html
View File 

@@ -307,10 +307,10 @@
 
 		Sets the properties based on the *values*.
 
 		</p>
 
 
-		<h3>[method:null toJSON]( [param:object meta] )</h3>
 
+		<h3>[method:Object toJSON]( [param:object meta] )</h3>
 
 		<p>
 
 		meta -- object containing metadata such as textures or images for the material.<br />
 
-		Convert the material to three.js JSON format.
 
+		Convert the material to three.js [link:https://github.com/mrdoob/three.js/wiki/JSON-Object-Scene-format-4 JSON Object/Scene format].
 
 		</p>
 
 
 		<h2>Source</h2>

+ 1 - 1
docs/api/en/materials/RawShaderMaterial.html
View File 

@@ -8,7 +8,7 @@
 
 		<link type="text/css" rel="stylesheet" href="page.css" />
 
 	</head>
 
 	<body>
 
-		[page:ShaderMaterial] &rarr;
 
+		[page:Material] &rarr; [page:ShaderMaterial] &rarr;
 
 
 		<h1>[name]</h1>

+ 22 - 2
docs/api/en/math/Box3.html
View File 

@@ -12,11 +12,31 @@
 
 
 		<p class="desc">
 
 			Represents a box or cube in 3D space. The main purpose of this is to represent
 
-			the [link:https://en.wikipedia.org/wiki/Minimum_bounding_box Minimum Bounding Boxes]
 
-			for objects.
 
+			the world-axis-aligned bounding boxes for objects. 
 		</p>
 
 
+		
+		<h2>Example</h2>
 
 
+		<code>
 
+		// Creating the object whose bounding box we want to compute
 
+		var sphereObject = new THREE.Mesh( 
+			new THREE.SphereGeometry(), 
+			new THREE.MeshBasicMaterial( 0xff0000 ) 
+		);
 
+		// Creating the actual bounding box with Box3
 
+		sphereObject.geometry.computeBoundingBox();
 
+		var box = sphereObject.geometry.boundingBox.clone();
 
+
 
+		// ...
 
+		
+		// In the animation loop, to keep the bounding box updated after move/rotate/scale operations
 
+		sphereObject.updateMatrixWorld( true );
 
+		box.copy( sphereObject.geometry.boundingBox ).applyMatrix4( sphereObject.matrixWorld );
 
+		</code>
 
+
 
+
 
+		
 		<h2>Constructor</h2>

+ 1 - 0
docs/api/en/math/Matrix4.html
View File 

@@ -375,6 +375,7 @@ x, y, 1, 0,
 
 		</p>
 
 
 		<h3>[method:this setPosition]( [param:Vector3 v] )</h3>
 
+		<h3>[method:this setPosition]( [param:Float x], [param:Float y], [param:Float z] ) // optional API</h3>
 
 		<p>
 
 			Sets the position component for this matrix from vector [page:Vector3 v], without affecting the
 
 			rest of the matrix - i.e. if the matrix is currently:

+ 15 - 5
docs/api/en/renderers/WebGLRenderer.html
View File 

@@ -55,7 +55,10 @@
 
 
 		[page:String powerPreference] - Provides a hint to the user agent indicating what configuration
 
 		of GPU is suitable for this WebGL context. Can be *"high-performance"*, *"low-power"* or *"default"*. Default is *"default"*.
 
-		See the [link:https://www.khronos.org/registry/webgl/specs/latest/1.0/#5.2 WebGL spec] for more information.<br />
 
+		See [link:https://www.khronos.org/registry/webgl/specs/latest/1.0/#5.14.12 WebGL spec] for details.<br />
 
+
 
+		[page:Boolean failIfMajorPerformanceCaveat] - whether the renderer creation will fail upon low perfomance is detected. Default is *false*.
 
+		See [link:https://www.khronos.org/registry/webgl/specs/latest/1.0/#5.14.12 WebGL spec] for details.<br />
 
 
 		[page:Boolean depth] - whether the drawing buffer has a
 
 		[link:https://en.wikipedia.org/wiki/Z-buffering depth buffer] of at least 16 bits.
 
@@ -110,6 +113,7 @@
 
 		- [page:Boolean floatVertexTextures]: *true* if [page:Boolean floatFragmentTextures] and [page:Boolean vertexTextures] are both true.<br />
 
 		- [page:Method getMaxAnisotropy](): Returns the maximum available anisotropy.<br />
 
 		- [page:Method getMaxPrecision](): Returns the maximum available precision for vertex and fragment shaders. <br />
 
+		- [page:Boolean isWebGL2]: *true* if the context in use is a WebGL2RenderingContext object.<br />
 
 		- [page:Boolean logarithmicDepthBuffer]: *true* if the [page:parameter logarithmicDepthBuffer] was set to true in the constructor and
 
 		the context supports the [link:https://developer.mozilla.org/en-US/docs/Web/API/EXT_frag_depth EXT_frag_depth] extension.
 
 			According to [link:https://webglstats.com/ WebGLStats], as of February 2016 around 66% of WebGL enabled devices support this.<br />
 
@@ -347,6 +351,12 @@
 
 		<h3>[method:WebGLContextAttributes getContextAttributes]()</h3>
 
 		<p>Returns an object that describes the attributes set on the WebGL context when it was created.</p>
 
 
+		<h3>[method:Integer getActiveCubeFace]()</h3>
 
+		<p>Returns the current active cube face.</p>
 
+
 
+		<h3>[method:Integer getActiveMipMapLevel]()</h3>
 
+		<p>Returns the current active mipmap level.</p>
 
+
 
 		<h3>[method:RenderTarget getRenderTarget]()</h3>
 
 		<p>Returns the current [page:RenderTarget RenderTarget] if there are; returns *null* otherwise.</p>
 
 
@@ -394,11 +404,11 @@
 
 		<h3>[method:null resetGLState]( )</h3>
 
 		<p>Reset the GL state to default. Called internally if the WebGL context is lost.</p>
 
 
-		<h3>[method:null readRenderTargetPixels]( [param:WebGLRenderTarget renderTarget], [param:Float x], [param:Float y], [param:Float width], [param:Float height], [param:TypedArray buffer] )</h3>
 
+		<h3>[method:null readRenderTargetPixels]( [param:WebGLRenderTarget renderTarget], [param:Float x], [param:Float y], [param:Float width], [param:Float height], [param:TypedArray buffer], [param:Integer activeCubeFaceIndex] )</h3>
 
 		<p>buffer - Uint8Array is the only destination type supported in all cases, other types are renderTarget and platform dependent. See [link:https://www.khronos.org/registry/webgl/specs/latest/1.0/#5.14.12 WebGL spec] for details.</p>
 
 		<p>Reads the pixel data from the renderTarget into the buffer you pass in. This is a wrapper around [link:https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/readPixels WebGLRenderingContext.readPixels]().</p>
 
-		<p>See the [example:webgl_interactive_cubes_gpu interactive / cubes / gpu] example.
 
-		</p>
 
+		<p>See the [example:webgl_interactive_cubes_gpu interactive / cubes / gpu] example.</p>
 
+		<p>For reading out a [page:WebGLRenderTargetCube WebGLRenderTargetCube] use the optional parameter activeCubeFaceIndex to determine which face should be read.</p>
 
 
 
 		<h3>[method:null render]( [param:Scene scene], [param:Camera camera] )</h3>
 
@@ -425,7 +435,7 @@
 
 
 		<h3>[method:null setAnimationLoop]( [param:Function callback] )</h3>
 
 		<p>[page:Function callback] — The function will be called every available frame. If `null` is passed it will stop any already ongoing animation.</p>
 
-		<p>A build in function that can be used instead of [link:https://developer.mozilla.org/en-US/docs/Web/API/window/requestAnimationFrame requestAnimationFrame]. For WebVR projects this function must be used.</p>
 
+		<p>A built in function that can be used instead of [link:https://developer.mozilla.org/en-US/docs/Web/API/window/requestAnimationFrame requestAnimationFrame]. For WebVR projects this function must be used.</p>
 
 
 		<h3>[method:null setClearAlpha]( [param:Float alpha] )</h3>
 
 		<p>Sets the clear alpha. Valid input is a float between *0.0* and *1.0*.</p>

+ 3 - 2
docs/api/en/scenes/Scene.html
View File 

@@ -46,9 +46,10 @@
 
 
 		<h2>Methods</h2>
 
 
-		<h3>[method:JSON toJSON]</h3>
 
+		<h3>[method:Object toJSON]</h3>
 
 		<p>
 
-		Return the scene data in JSON format.
 
+		meta -- object containing metadata such as textures or images for the scene.<br />
 
+		Convert the scene to three.js [link:https://github.com/mrdoob/three.js/wiki/JSON-Object-Scene-format-4 JSON Object/Scene format].
 
 		</p>
 
 
 		<h3>[method:null dispose]()</h3>

+ 2 - 2
docs/api/en/textures/Texture.html
View File 

@@ -251,10 +251,10 @@
 
 		Make copy of the texture. Note this is not a "deep copy", the image is shared.
 
 		</p>
 
 
-		<h3>[method:Texture toJSON]( [param:Object meta] )</h3>
 
+		<h3>[method:Object toJSON]( [param:Object meta] )</h3>
 
 		<p>
 
 		meta -- optional object containing metadata.<br />
 
-		Convert the material to three.js JSON format.
 
+		Convert the texture to three.js [link:https://github.com/mrdoob/three.js/wiki/JSON-Object-Scene-format-4 JSON Object/Scene format].
 
 		</p>
 
 
 		<h3>[method:null dispose]()</h3>

+ 1 - 1
docs/api/zh/animation/KeyframeTrack.html
View File 

@@ -49,7 +49,7 @@
 
 		</ul>
 
 
 		<p>
 
-            可以在[link:https://threejs.org/examples/js/AnimationClipCreator.js]文件中找到用不同类型的关键帧轨道创建动画剪辑([page:AnimationClip AnimationClips])的示例。
 
+            可以在[link:https://threejs.org/examples/js/animation/AnimationClipCreator.js AnimationClipCreator]文件中找到用不同类型的关键帧轨道创建动画剪辑([page:AnimationClip AnimationClips])的示例。
 
 		</p>
 
 
 		<p>

+ 1 - 1
docs/api/zh/cameras/ArrayCamera.html
View File 

@@ -15,7 +15,7 @@
 
 		<p class="desc">
 
 
 			[name] 用于更加高效地使用一组已经预定义的摄像机来渲染一个场景。这将能够更好地提升VR场景的渲染性能。<br />
 
-			一个 [name] 的实例中总是包含着一组子摄像机，应当为每一个子摄像机定义*bound*(边界)这个属性，这一属性决定了由该子摄像机所渲染的视口区域的大小。
 
+			一个 [name] 的实例中总是包含着一组子摄像机，应当为每一个子摄像机定义*viewport*(边界)这个属性，这一属性决定了由该子摄像机所渲染的视口区域的大小。
 
 		</p>
 
 
 		<h2>示例</h2>

+ 2 - 2
docs/api/zh/core/Clock.html
View File 

@@ -10,8 +10,8 @@
 
 	<body>
 
 		<h1>[name]</h1>
 
 		<p class="desc">
 
-			该对象用于跟踪时间。如果<a href="https://developer.mozilla.org/en-US/docs/Web/API/Performance/now">performance.now()</a>可用，则
 
-			Clock 对象通过该方法实现，否则通过歉精准的<a href="https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Date/now">Date.now()</a>实现。
 
+			该对象用于跟踪时间。如果[link:https://developer.mozilla.org/en-US/docs/Web/API/Performance/now performance.now]可用，则
 
+			Clock 对象通过该方法实现，否则通过歉精准的[link:https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Date/now Date.now]实现。
 
 		</p>

+ 1 - 1
docs/examples/controls/OrbitControls.html
View File 

@@ -54,7 +54,7 @@ function animate() {
 
 
 		<h3>[name]( [param:Camera object], [param:HTMLDOMElement domElement] )</h3>
 
 		<p>
 
-			[page:Camera object]: (required) The camera to be controlled.<br><br>
 
+			[page:Camera object]: (required) The camera to be controlled. The camera must not be a child of another object, unless that object is the scene itself.<br><br>
 
 
 			[page:HTMLDOMElement domElement]: (optional) The HTML element used for event listeners. By default this is the whole document,
 
 			however if you only want the controls to work over a specific element (e.g. the canvas) you can specify that here.

+ 1 - 1
docs/examples/loaders/MTLLoader.html
View File 

@@ -94,7 +94,7 @@
 
 			[page:String path] — The path to the MTL file.
 
 		</p>
 
 		<p>
 
-			Parse a <em>mtl</em> text structure and return a [page:MTLLoaderMaterialCreator] instance.<br />
 
+			Parse a <em>mtl</em> text structure and return a [page:MTLLoaderMaterialCreator MTLLoader.MaterialCreator] instance.<br />
 
 		</p>

+ 3 - 3
docs/examples/loaders/OBJLoader.html
View File 

@@ -89,12 +89,12 @@
 
 		If an <em>obj</em> object or group uses multiple materials while declaring faces, geometry groups and an array of materials are used.
 
 		</p>
 
 
-		<h3>[method:OBJLoader setMaterials]( [param:Array materials] )</h3>
 
+		<h3>[method:OBJLoader setMaterials]( [param:MTLLoader.MaterialCreator materials] )</h3>
 
 		<p>
 
-		[page:Array materials] - Array of [page:Material Materials].
 
+		[page:MTLLoaderMaterialCreator MTLLoader.MaterialCreator materials] - A MaterialCreator instance.
 
 		</p>
 
 		<p>
 
-		Sets materials loaded by MTLLoader or any other supplier of an Array of [page:Material Materials].
 
+		Sets materials loaded by MTLLoader or any other supplier of a [page:MTLLoaderMaterialCreator MTLLoader.MaterialCreator].
 
 		</p>
 
 
 		<h3>[method:OBJLoader setPath]( [param:String path] )</h3>

+ 1 - 1
docs/examples/loaders/OBJLoader2.html
View File 

@@ -13,7 +13,7 @@
 
 
 		<p class="desc">A loader for loading a <em>.obj</em> resource.<br />
 
 			The <a href="https://en.wikipedia.org/wiki/Wavefront_.obj_file">OBJ file format</a> is a simple data-format
 
-			that represents 3D geometry in a human redeable format as, the position of each vertex, the UV position of
 
+			that represents 3D geometry in a human readable format as, the position of each vertex, the UV position of
 
 			each texture coordinate vertex, vertex normals, and the faces that make each polygon defined as a list of
 
 			vertices, and texture vertices.
 
 		</p>

+ 18 - 18
docs/examples/quickhull/QuickHull.html → docs/examples/math/convexhull/ConvexHull.html
View File 

@@ -2,7 +2,7 @@
 
 <html lang="en">
 
 	<head>
 
 		<meta charset="utf-8" />
 
-		<base href="../../" />
 
+		<base href="../../../" />
 
 		<script src="list.js"></script>
 
 		<script src="page.js"></script>
 
 		<link type="text/css" rel="stylesheet" href="page.css" />
 
@@ -11,7 +11,7 @@
 
 		<h1>[name]</h1>
 
 
 		<p class="desc">
 
-			General information about the Quickhull algorithm: Dirk Gregorius. March 2014, Game Developers Conference: [link:http://media.steampowered.com/apps/valve/2014/DirkGregorius_ImplementingQuickHull.pdf Implementing QuickHull].
 
+			A convex hull class. Implements the Quickhull algorithm by: Dirk Gregorius. March 2014, Game Developers Conference: [link:http://media.steampowered.com/apps/valve/2014/DirkGregorius_ImplementingQuickHull.pdf Implementing QuickHull].
 
 		</p>
 
 
 
@@ -63,19 +63,19 @@
 
 		<p>Creates a face with the vertices 'eyeVertex.point', 'horizonEdge.tail' and 'horizonEdge.head' in CCW order.
 
 			All the half edges are created in CCW order thus the face is always pointing outside the hull</p>
 
 
-		<h3>[method:QuickHull addNewFaces]( [param:VertexNode eyeVertex], [param:HalfEdge horizonEdge] )</h3>
 
+		<h3>[method:ConvexHull addNewFaces]( [param:VertexNode eyeVertex], [param:HalfEdge horizonEdge] )</h3>
 
 		[page:VertexNode eyeVertex] - The vertex that is added to the hull.<br /><br />
 
 		[page:HalfEdge horizon] - An array of half-edges that form the horizon.<br /><br />
 
 
 		<p>Adds 'horizon.length' faces to the hull, each face will be linked with the horizon opposite face and the face on the left/right.</p>
 
 
-		<h3>[method:QuickHull addVertexToFace]( [param:VertexNode vertex], [param:Face face]	)</h3>
 
+		<h3>[method:ConvexHull addVertexToFace]( [param:VertexNode vertex], [param:Face face]	)</h3>
 
 		[page:VertexNodeNode vertex] - The vertex to add.<br /><br />
 
 		[page:Face face] - The target face.<br /><br />
 
 
 		<p>Adds a vertex to the 'assigned' list of vertices and assigns it to the given face.</p>
 
 
-		<h3>[method:QuickHull addVertexToHull]( [param:VertexNode eyeVertex] )</h3>
 
+		<h3>[method:ConvexHull addVertexToHull]( [param:VertexNode eyeVertex] )</h3>
 
 		[page:VertexNode eyeVertex] - The vertex that is added to the hull.<br /><br />
 
 
 		<p>Adds a vertex to the hull with the following algorithm
 
@@ -87,11 +87,11 @@
 
 			</ul>
 
 		</p>
 
 
-		<h3>[method:QuickHull cleanup]()</h3>
 
+		<h3>[method:ConvexHull cleanup]()</h3>
 
 
 		<p>Cleans up internal properties after computing the convex hull.</p>
 
 
-		<h3>[method:QuickHull compute]()</h3>
 
+		<h3>[method:ConvexHull compute]()</h3>
 
 
 		<p>Starts the execution of the quick hull algorithm.</p>
 
 
@@ -99,7 +99,7 @@
 
 
 		<p>Computes the extremes values (min/max vectors) which will be used to compute the inital hull.</p>
 
 
-		<h3>[method:QuickHull computeHorizon]( [param:Vector3 eyePoint], [param:HalfEdge crossEdge], [param:Face face], [param:Array horizon]	)</h3>
 
+		<h3>[method:ConvexHull computeHorizon]( [param:Vector3 eyePoint], [param:HalfEdge crossEdge], [param:Face face], [param:Array horizon]	)</h3>
 
 		[page:Vector3 eyePoint] - The 3D-coordinates of a point.<br /><br />
 
 		[page:HalfEdge crossEdge] - The edge used to jump to the current face.<br /><br />
 
 		[page:Face face] - The current face being tested.<br /><br />
 
@@ -107,16 +107,16 @@
 
 
 		<p>Computes a chain of half edges in CCW order called the 'horizon'. For an edge to be part of the horizon it must join a face that can see 'eyePoint' and a face that cannot see 'eyePoint'.</p>
 
 
-		<h3>[method:QuickHull computeInitialHull]()</h3>
 
+		<h3>[method:ConvexHull computeInitialHull]()</h3>
 
 
 		<p>Computes the initial simplex assigning to its faces all the points that are candidates to form part of the hull.</p>
 
 
-		<h3>[method:QuickHull containsPoint]( [param:Vector3 point] )</h3>
 
+		<h3>[method:ConvexHull containsPoint]( [param:Vector3 point] )</h3>
 
 		[page:Vector3 point] - A point in 3D space.<br /><br />
 
 
 		<p>Returns *true* if the given point is inside this convex hull.</p>
 
 
-		<h3>[method:QuickHull deleteFaceVertices]( [param:Face face], [param:Face absorbingFace]	)</h3>
 
+		<h3>[method:ConvexHull deleteFaceVertices]( [param:Face face], [param:Face absorbingFace]	)</h3>
 
 		[page:Face face] - The given face.<br /><br />
 
 		[page:Face absorbingFace] - An optional face that tries to absorb the vertices of the first face.<br /><br />
 
 
@@ -139,7 +139,7 @@
 
 
 		<p>Returns *true* if the given ray intersects with this convex hull.</p>
 
 
-		<h3>[method:QuickHull makeEmpty]()</h3>
 
+		<h3>[method:ConvexHull makeEmpty]()</h3>
 
 
 		<p>Makes this convex hull empty.</p>
 
 
@@ -153,7 +153,7 @@
 
 			</ul>
 
 		</p>
 
 
-		<h3>[method:QuickHull reindexFaces]()</h3>
 
+		<h3>[method:ConvexHull reindexFaces]()</h3>
 
 
 		<p>Removes inactive (e.g. deleted) faces from the internal face list.</p>
 
 
@@ -162,30 +162,30 @@
 
 
 		<p>Removes all the visible vertices that a given face is able to see which are stored in the 'assigned' vertext list.</p>
 
 
-		<h3>[method:QuickHull removeVertexFromFace]( [param:VertexNode vertex], [param:Face face]	)</h3>
 
+		<h3>[method:ConvexHull removeVertexFromFace]( [param:VertexNode vertex], [param:Face face]	)</h3>
 
 		[page:VertexNode vertex] - The vertex to remove.<br /><br />
 
 		[page:Face face] - The target face.<br /><br />
 
 
 		<p>Removes a vertex from the 'assigned' list of vertices and from the given face. It also makes sure that the link from 'face' to the first vertex it sees in 'assigned' is linked correctly after the removal.</p>
 
 
-		<h3>[method:QuickHull resolveUnassignedPoints]( [param:Array newFaces]	)</h3>
 
+		<h3>[method:ConvexHull resolveUnassignedPoints]( [param:Array newFaces]	)</h3>
 
 		[page:Face newFaces] - An array of new faces.<br /><br />
 
 
 		<p>Reassigns as many vertices as possible from the unassigned list to the new faces.</p>
 
 
-		<h3>[method:QuickHull setFromObject]( [param:Object3D object] )</h3>
 
+		<h3>[method:ConvexHull setFromObject]( [param:Object3D object] )</h3>
 
 		[page:Object3D object] - [page:Object3D] to compute the convex hull of.<br /><br />
 
 
 		<p>Computes the convex hull of an [page:Object3D] (including its children),
 
 		accounting for the world transforms of both the object and its childrens.</p>
 
 
-		<h3>[method:QuickHull setFromPoints]( [param:Array points] )</h3>
 
+		<h3>[method:ConvexHull setFromPoints]( [param:Array points] )</h3>
 
 		[page:Array points] - Array of [page:Vector3 Vector3s] that the resulting convex hull will contain.<br /><br />
 
 
 		<p>Computes to convex hull for the given array of points.</p>
 
 
 		<h2>Source</h2>
 
 
-		[link:https://github.com/mrdoob/three.js/blob/master/examples/js/QuickHull.js examples/js/QuickHull.js]
 
+		[link:https://github.com/mrdoob/three.js/blob/master/examples/js/math/ConvexHull.js examples/js/ConvexHull.js]
 
 	</body>
 
 </html>

+ 2 - 2
docs/examples/quickhull/Face.html → docs/examples/math/convexhull/Face.html
View File 

@@ -2,7 +2,7 @@
 
 <html lang="en">
 
 	<head>
 
 		<meta charset="utf-8" />
 
-		<base href="../../" />
 
+		<base href="../../../" />
 
 		<script src="list.js"></script>
 
 		<script src="page.js"></script>
 
 		<link type="text/css" rel="stylesheet" href="page.css" />
 
@@ -84,6 +84,6 @@
 
 
 		<h2>Source</h2>
 
 
-		[link:https://github.com/mrdoob/three.js/blob/master/examples/js/QuickHull.js examples/js/QuickHull.js]
 
+		[link:https://github.com/mrdoob/three.js/blob/master/examples/js/math/ConvexHull.js examples/js/math/ConvexHull.js]
 
 	</body>
 
 </html>

+ 2 - 2
docs/examples/quickhull/HalfEdge.html → docs/examples/math/convexhull/HalfEdge.html
View File 

@@ -2,7 +2,7 @@
 
 <html lang="en">
 
 	<head>
 
 		<meta charset="utf-8" />
 
-		<base href="../../" />
 
+		<base href="../../../" />
 
 		<script src="list.js"></script>
 
 		<script src="page.js"></script>
 
 		<link type="text/css" rel="stylesheet" href="page.css" />
 
@@ -74,6 +74,6 @@
 
 
 		<h2>Source</h2>
 
 
-		[link:https://github.com/mrdoob/three.js/blob/master/examples/js/QuickHull.js examples/js/QuickHull.js]
 
+		[link:https://github.com/mrdoob/three.js/blob/master/examples/js/math/ConvexHull.js examples/js/math/ConvexHull.js]
 
 	</body>
 
 </html>

+ 2 - 2
docs/examples/quickhull/VertexList.html → docs/examples/math/convexhull/VertexList.html
View File 

@@ -2,7 +2,7 @@
 
 <html lang="en">
 
 	<head>
 
 		<meta charset="utf-8" />
 
-		<base href="../../" />
 
+		<base href="../../../" />
 
 		<script src="list.js"></script>
 
 		<script src="page.js"></script>
 
 		<link type="text/css" rel="stylesheet" href="page.css" />
 
@@ -86,6 +86,6 @@
 
 
 		<h2>Source</h2>
 
 
-		[link:https://github.com/mrdoob/three.js/blob/master/examples/js/QuickHull.js examples/js/QuickHull.js]
 
+		[link:https://github.com/mrdoob/three.js/blob/master/examples/js/math/ConvexHull.js examples/js/math/ConvexHull.js]
 
 	</body>
 
 </html>

+ 2 - 2
docs/examples/quickhull/VertexNode.html → docs/examples/math/convexhull/VertexNode.html
View File 

@@ -2,7 +2,7 @@
 
 <html lang="en">
 
 	<head>
 
 		<meta charset="utf-8" />
 
-		<base href="../../" />
 
+		<base href="../../../" />
 
 		<script src="list.js"></script>
 
 		<script src="page.js"></script>
 
 		<link type="text/css" rel="stylesheet" href="page.css" />
 
@@ -47,6 +47,6 @@
 
 
 		<h2>Source</h2>
 
 
-		[link:https://github.com/mrdoob/three.js/blob/master/examples/js/QuickHull.js examples/js/QuickHull.js]
 
+		[link:https://github.com/mrdoob/three.js/blob/master/examples/js/math/ConvexHull.js examples/js/math/ConvexHull.js]
 
 	</body>
 
 </html>

+ 7 - 0
docs/examples/renderers/SVGRenderer.html
View File 

@@ -61,6 +61,13 @@
 
 
 		<h3>[name]()</h3>
 
 
+		<h2>Properties</h2>
 
+
 
+		<h3>[property:Number overdraw]</h3>
 
+		<p>
 
+		Number of fractional pixels to enlarge polygons in order to prevent anti-aliasing gaps. Range is [0..1]. Default is *0.5*.
 
+		</p>
 
+
 
 		<h2>Methods</h2>
 
 
 		<h3>[method:null clear]()</h3>

+ 0 - 20
docs/examples/utils/SceneUtils.html
View File 

@@ -26,26 +26,6 @@
 
 		This is mostly useful for objects that need both a material and a wireframe implementation.
 
 		</p>
 
 
-		<h3>[method:null attach]( [param:Object3D child], [param:Object3D scene], [param:Object3D parent] )</h3>
 
-		<p>
 
-		child -- The object to add to the parent  <br />
 
-		scene -- The scene to detach the object from. <br />
 
-		parent -- The parent to attach the object to.
 
-		</p>
 
-		<p>
 
-		Attaches the object to the parent without the moving the object in the worldspace. Beware that to do this the matrixWorld needs to be updated. This can be done by calling the updateMatrixWorld method on the parent object.
 
-		</p>
 
-
 
-		<h3>[method:null detach]( [param:Object3D child], [param:Object3D parent], [param:Object3D scene] )</h3>
 
-		<p>
 
-		child -- The object to remove from the parent  <br />
 
-		scene -- The scene to attach the object on. <br />
 
-		parent -- The parent to detach the object from.
 
-		</p>
 
-		<p>
 
-		Detaches the object from the parent and adds it back to the scene without moving in worldspace. Beware that to do this the matrixWorld needs to be updated. This can be done by calling the updateMatrixWorld method on the parent object.
 
-		</p>
 
-
 
 		<h2>Source</h2>
 
 
 		[link:https://github.com/mrdoob/three.js/blob/master/examples/js/utils/SceneUtils.js examples/js/utils/SceneUtils.js]

+ 60 - 17
docs/index.html
View File 

@@ -2,7 +2,7 @@
 
 <html lang="en">
 
 	<head>
 
 		<meta charset="utf-8">
 
-		<title>three.js / documentation</title>
 
+		<title>three.js docs</title>
 
 		<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
 
 		<link rel="shortcut icon" href="../files/favicon.ico" />
 
 		<link rel="stylesheet" type="text/css" href="../files/main.css">
 
@@ -10,30 +10,33 @@
 
 		<script src="../build/three.min.js" async defer></script>
 
 	</head>
 
 	<body>
 
-
 
-		<div id="panel" class="collapsed">
 
+		<div id="panel" class="">
 
 
 			<div id="header">
 
-
 
 				<h1><a href="http://threejs.org">three.js</a></h1>
 
 
-				<img id="expandButton" src="../files/ic_menu_black_24dp.svg">
 
-
 
 				<div id="sections">
 
-					<span class="selected">docs</span> <a href="../examples/">examples</a>
 
+					<span class="selected">docs</span>
 
+					<a href="../examples/#webgl_animation_cloth">examples</a>
 
 				</div>
 
 
-				<input type="text" id="filter" autocorrect="off" autocapitalize="off" spellcheck="false">
 
+				<div id="expandButton"></div>
 
+			</div>
 
 
-				<select id="language">
 
-					<option value="en">en</option>
 
-					<option value="zh">zh</option>
 
-				</select>
 
+			<div id="panelScrim"></div>
 
 
+			<div id="contentWrapper">
 
+				<div id="inputWrapper">
 
+					<input placeholder="" type="text" id="filter" autocorrect="off" autocapitalize="off" spellcheck="false" />
 
+					<div id="exitSearchButton"></div>
 
+					<select id="language">
 
+						<option value="en">en</option>
 
+						<option value="zh">zh</option>
 
+					</select>
 
+				</div>
 
+				<div id="content"></div>
 
 			</div>
 
 
-			<div id="content"></div>
 
-
 
 		</div>
 
 
 		<iframe name="viewer"></iframe>
 
@@ -89,6 +92,8 @@
 
 			var panel = document.getElementById( 'panel' );
 
 			var content = document.getElementById( 'content' );
 
 			var expandButton = document.getElementById( 'expandButton' );
 
+			var exitSearchButton = document.getElementById( 'exitSearchButton' );
 
+			var panelScrim = document.getElementById( 'panelScrim' );
 
 			var filterInput = document.getElementById( 'filter' );
 
 			var iframe = document.querySelector( 'iframe' );
 
 
@@ -104,12 +109,40 @@
 
 			expandButton.onclick = function ( event ) {
 
 
 				event.preventDefault();
 
-				panel.classList.toggle( 'collapsed' );
 
+				panel.classList.toggle( 'open' );
 
+
 
+			};
 
+
 
+			panelScrim.onclick = function ( event ) {
 
+
 
+				event.preventDefault();
 
+				panel.classList.toggle( 'open' );
 
 
 			};
 
 
 
 			// Functionality for search/filter input field
 
+			filterInput.onfocus = function ( event ) {
 
+
 
+				panel.classList.add('searchFocused');
 
+
 
+			}
 
+
 
+			filterInput.onblur = function ( event ) {
 
+
 
+				if(filterInput.value === '') {
 
+					panel.classList.remove('searchFocused');
 
+				}
 
+
 
+			}
 
+
 
+			exitSearchButton.onclick = function( event ) {
 
+
 
+				filterInput.value = '';
 
+				updateFilter();
 
+				panel.classList.remove('searchFocused');
 
+
 
+			}
 
 
 			filterInput.oninput = function ( event ) {
 
 
@@ -139,7 +172,16 @@
 
 					if ( event.button !== 0 || event.ctrlKey || event.altKey || event.metaKey ) return;
 
 
 					window.location.hash = pageURL;
 
-					panel.classList.add( 'collapsed' );
 
+					panel.classList.remove( 'open' );
 
+
 
+
 
+					content.querySelectorAll( 'a' ).forEach( function ( item ) {
 
+
 
+						item.classList.remove( 'selected' );
 
+
 
+					} );
 
+
 
+					link.classList.add('selected');
 
 
 				} );
 
 
@@ -375,7 +417,7 @@
 
 				if(hash) {
 
 
 					iframe.src = splitHash[ 0 ] + '.html' + splitHash[ 1 ];
 
-					subtitle = titles[ splitHash[ 0 ] ] + splitHash[ 1 ] + ' - ';
 
+					subtitle = titles[ splitHash[ 0 ] ] + splitHash[ 1 ] + ' – ';
 
 
 				} else {
 
 
@@ -387,6 +429,7 @@
 
 				document.body.replaceChild( iframe, oldIframe );
 
 				document.title = subtitle + 'three.js docs';
 
 
+
 
 			}
 
 
 			function decomposePageName( pageName, oldDelimiter, newDelimiter ) {

+ 6 - 6
docs/list.js
View File 

@@ -393,12 +393,12 @@ var list = {
 
 				"LookupTable": "examples/Lut",
 
 			},
 
 
-			"QuickHull": {
 
-				"Face": "examples/quickhull/Face",
 
-				"HalfEdge": "examples/quickhull/HalfEdge",
 
-				"QuickHull": "examples/quickhull/QuickHull",
 
-				"VertexNode": "examples/quickhull/VertexNode",
 
-				"VertexList": "examples/quickhull/VertexList"
 
+			"ConvexHull": {
 
+				"Face": "examples/math/convexhull/Face",
 
+				"HalfEdge": "examples/math/convexhull/HalfEdge",
 
+				"ConvexHull": "examples/math/convexhull/ConvexHull",
 
+				"VertexNode": "examples/math/convexhull/VertexNode",
 
+				"VertexList": "examples/math/convexhull/VertexList"
 
 			},
 
 
 			"Renderers": {

+ 1 - 1
docs/manual/en/introduction/Creating-a-scene.html
View File 

@@ -8,7 +8,7 @@
 
 		<link type="text/css" rel="stylesheet" href="page.css" />
 
 	</head>
 
 	<body>
 
-		<h1>[name]</h1><br />
 
+		<h1>[name]</h1>
 
 
 		<p>The goal of this section is to give a brief introduction to three.js. We will start by setting up a scene, with a spinning cube. A working example is provided at the bottom of the page in case you get stuck and need help.</p>

+ 1 - 1
docs/manual/en/introduction/Drawing-lines.html
View File 

@@ -12,7 +12,7 @@
 
 		<div>
 
 			<p>
 
 				Let's say you want to draw a line or a circle, not a wireframe [page:Mesh].
 
-				First we need to setup the [page:WebGLRenderer renderer], [page:Scene scene] and camera (see the Creating a scene page).
 
+				First we need to set up the [page:WebGLRenderer renderer], [page:Scene scene] and camera (see the Creating a scene page).
 
 			</p>
 
 
 			<p>Here is the code that we will use:</p>

+ 0 - 2
docs/manual/en/introduction/How-to-update-things.html
View File 

@@ -178,8 +178,6 @@ geometry.tangentsNeedUpdate = true;
 
 
 			<p>Also GLstate related parameters can change any time (depthTest, blending, polygonOffset, etc).</p>
 
 
-			<p>Flat / smooth shading is baked into normals. You need to reset normals buffer (see above).</p>
 
-
 
 			<p>The following properties can't be easily changed at runtime (once the material is rendered at least once):</p>
 
 			<ul>
 
 				<li>numbers and types of uniforms</li>

+ 3 - 1
docs/manual/en/introduction/How-to-use-WebGL2.html
View File 

@@ -100,7 +100,7 @@ var material = new THREE.ShaderMaterial( {
 
 		Have a look at one of the official examples in order to see WebGL 2 features in action.<br /><br />
 
 
 		[example:webgl2_materials_texture3d WebGL2 / materials / texture3d]<br />
 
-		[example:webgl2_materials_texture3d_volume WebGL2 / materials / texture3d / volume]<br />
 
+		[example:webgl2_materials_texture2darray WebGL2 / materials / texture2darray]<br />
 
 		[example:webgl2_multisampled_renderbuffers WebGL2 / multisampled renderbuffers]
 
 	</p>
 
 
@@ -111,7 +111,9 @@ var material = new THREE.ShaderMaterial( {
 
 		overview about what's already available in the latest version of three.js.
 
 		<ul>
 
 			<li>3D Textures</li>
 
+			<li>2D Texture Arrays</li>
 
 			<li>Multisampled Renderbuffers</li>
 
+			<li>Non-power of two (POT) textures work just the same as POT textures now. No resizing is required for best quality.</li>
 
 		</ul>
 
 
 	</p>

+ 201 - 2
docs/manual/en/introduction/Import-via-modules.html
View File 

@@ -27,7 +27,7 @@
 
 
 		<h2>Importing the module</h2>
 
 
-		<p>Assuming that you're bundling your files with a tool such as [link:https://webpack.github.io/ Webpack] or [link:https://github.com/substack/node-browserify Browserify], which allow you to "require('modules') in the browser by bundling up all of your dependencies."</p>
 
+		<p>Assuming that you're bundling your files with a tool such as [link:https://webpack.github.io/ Webpack] or [link:https://github.com/substack/node-browserify Browserify], which allow you to "require('modules')" in the browser by bundling up all of your dependencies.</p>
 
 
 		<p>
 
 			You should now be able to import the module into your source files and continue to use it as per normal.
 
@@ -76,11 +76,42 @@
 
 		<p>
 
 			The following examples files are already available as modules:
 
 			<ul>
 
+				<li>cameras
 
+					<ul>
 
+						<li>CinematicCamera</li>
 
+					</ul>
 
+				</li>
 
 				<li>controls
 
 					<ul>
 
+						<li>DeviceOrientationControls</li>
 
+						<li>DragControls</li>
 
+						<li>EditorControls</li>
 
+						<li>FirstPersonControls</li>
 
+						<li>FlyControls</li>
 
 						<li>MapControls</li>
 
 						<li>OrbitControls</li>
 
+						<li>OrthographicTrackballControls</li>
 
+						<li>PointerLockControls</li>
 
 						<li>TrackballControls</li>
 
+						<li>TransformControls</li>
 
+					</ul>
 
+				</li>
 
+				<li>curves
 
+					<ul>
 
+						<li>CurveExtras</li>
 
+						<li>NURBSCurve</li>
 
+						<li>NURBSSurface</li>
 
+						<li>NURBSUtils</li>
 
+					</ul>
 
+				</li>
 
+				<li>effects
 
+					<ul>
 
+						<li>AnaglyphEffect</li>
 
+						<li>AsciiEffect</li>
 
+						<li>OutlineEffect</li>
 
+						<li>ParallaxBarrierEffect</li>
 
+						<li>PeppersGhostEffect</li>
 
+						<li>StereoEffect</li>
 
 					</ul>
 
 				</li>
 
 				<li>exporters
 
@@ -94,12 +125,88 @@
 
 						<li>TypedGeometryExporter</li>
 
 					</ul>
 
 				</li>
 
+				<li>geometries
 
+					<ul>
 
+						<li>BoxLineGeometry</li>
 
+						<li>ConvexGeometry</li>
 
+						<li>DecalGeometry</li>
 
+						<li>ParametricGeometries</li>
 
+						<li>TeapotBufferGeometry</li>
 
+					</ul>
 
+				</li>
 
+				<li>interactive
 
+					<ul>
 
+						<li>SelectionBox</li>
 
+						<li>SelectionHelper</li>
 
+					</ul>
 
+				</li>
 
+				<li>lines
 
+					<ul>
 
+						<li>Line2</li>
 
+						<li>LineGeometry</li>
 
+						<li>LineMaterial</li>
 
+						<li>LineSegments2</li>
 
+						<li>LineSegmentsGeometry</li>
 
+						<li>Wireframe</li>
 
+						<li>WireframeGeometry2</li>
 
+					</ul>
 
+				</li>
 
 				<li>loaders
 
 					<ul>
 
+						<li>3MFLoader</li>
 
+						<li>AMFLoader</li>
 
+						<li>AssimpJSONLoader</li>
 
+						<li>AssimpLoader</li>
 
+						<li>BabylonLoader</li>
 
+						<li>BVHLoader</li>
 
+						<li>ColladaLoader</li>
 
+						<li>DDSLoader</li>
 
+						<li>EXRLoader</li>
 
+						<li>FBXLoader</li>
 
+						<li>GCodeLoader</li>
 
 						<li>GLTFLoader</li>
 
+						<li>KMZLoader</li>
 
+						<li>KTXLoader</li>
 
 						<li>MTLLoader</li>
 
 						<li>OBJLoader</li>
 
+						<li>PCDLoader</li>
 
+						<li>PDBLoader</li>
 
+						<li>PlayCanvasLoader</li>
 
+						<li>PLYLoader</li>
 
+						<li>RGBELoader</li>
 
 						<li>STLLoader</li>
 
+						<li>SVGLoader</li>
 
+						<li>TGALoader</li>
 
+						<li>VRMLLoader</li>
 
+					</ul>
 
+				</li>
 
+				<li>math
 
+					<ul>
 
+						<li>ColorConverter</li>
 
+						<li>ConvexHull</li>
 
+						<li>ImprovedNoise</li>
 
+						<li>Lut</li>
 
+						<li>SimplexNoise</li>
 
+					</ul>
 
+				</li>
 
+				<li>modifiers
 
+					<ul>
 
+						<li>ExplodeModifier</li>
 
+						<li>SimplifyModifier</li>
 
+						<li>SubdivisionModifier</li>
 
+						<li>TessellateModifier</li>
 
+					</ul>
 
+				</li>
 
+				<li>objects
 
+					<ul>
 
+						<li>Lensflare</li>
 
+						<li>Reflector</li>
 
+						<li>Refractor</li>
 
+						<li>ReflectorRTT</li>
 
+						<li>ShadowMesh</li>
 
+						<li>Sky</li>
 
+						<li>Water</li>
 
+						<li>Water2</li>
 
 					</ul>
 
 				</li>
 
 				<li>pmrem
 
@@ -108,6 +215,98 @@
 
 						<li>PMREMGenerator</li>
 
 					</ul>
 
 				</li>
 
+				<li>postprocessing
 
+					<ul>
 
+						<li>AdaptiveToneMappingPass</li>
 
+						<li>AfterimagePass</li>
 
+						<li>BloomPass</li>
 
+						<li>BokehPass</li>
 
+						<li>ClearPass</li>
 
+						<li>CubeTexturePass</li>
 
+						<li>DotScreenPass</li>
 
+						<li>EffectComposer</li>
 
+						<li>FilmPass</li>
 
+						<li>GlitchPass</li>
 
+						<li>HalftonePass</li>
 
+						<li>MaskPass</li>
 
+						<li>OutlinePass</li>
 
+						<li>RenderPass</li>
 
+						<li>SAOPass</li>
 
+						<li>SavePass</li>
 
+						<li>ShaderPass</li>
 
+						<li>SMAAPass</li>
 
+						<li>SSAARenderPass</li>
 
+						<li>SSAOPass</li>
 
+						<li>TAARenderPass</li>
 
+						<li>TexturePass</li>
 
+						<li>UnrealBloomPass</li>
 
+					</ul>
 
+				</li>
 
+				<li>renderers
 
+					<ul>
 
+						<li>CSS2DRenderer</li>
 
+						<li>CSS3DRenderer</li>
 
+						<li>Projector</li>
 
+						<li>SoftwareRenderer</li>
 
+						<li>SVGRenderer</li>
 
+						<li>RaytracingRenderer</li>
 
+						<li>WebGLDeferredRenderer</li>
 
+					</ul>
 
+				</li>
 
+				<li>shaders
 
+					<ul>
 
+						<li>AfterimageShader</li>
 
+						<li>BasicShader</li>
 
+						<li>BleachBypassShader</li>
 
+						<li>BlendShader</li>
 
+						<li>BokehShader</li>
 
+						<li>BokehShader2</li>
 
+						<li>BrightnessContrastShader</li>
 
+						<li>ColorCorrectionShader</li>
 
+						<li>ColorifyShader</li>
 
+						<li>ConvolutionShader</li>
 
+						<li>CopyShader</li>
 
+						<li>DepthLimitedBlurShader</li>
 
+						<li>DigitalGlitch</li>
 
+						<li>DOFMipMapShader</li>
 
+						<li>DotScreenShader</li>
 
+						<li>FilmShader</li>
 
+						<li>FocusShader</li>
 
+						<li>FreiChenShader</li>
 
+						<li>FresnelShader</li>
 
+						<li>FXAAShader</li>
 
+						<li>GammaCorrectionShader</li>
 
+						<li>GodRaysShader</li>
 
+						<li>HalftoneShader</li>
 
+						<li>HorizontalBlurShader</li>
 
+						<li>HorizontalTiltShiftShader</li>
 
+						<li>HueSaturationShader</li>
 
+						<li>KaleidoShader</li>
 
+						<li>LuminosityHighPassShader</li>
 
+						<li>LuminosityShader</li>
 
+						<li>MirrorShader</li>
 
+						<li>NormalMapShader</li>
 
+						<li>ParallaxShader</li>
 
+						<li>PixelShader</li>
 
+						<li>RGBShiftShader</li>
 
+						<li>SAOShader</li>
 
+						<li>SepiaShader</li>
 
+						<li>SkinShader</li>
 
+						<li>SMAAShader</li>
 
+						<li>SobelOperatorShader</li>
 
+						<li>SSAOShader</li>
 
+						<li>TechnicolorShader</li>
 
+						<li>TerrainShader</li>
 
+						<li>ToneMapShader</li>
 
+						<li>TranslucentShader</li>
 
+						<li>TriangleBlurShader</li>
 
+						<li>UnpackDepthRGBAShader</li>
 
+						<li>VerticalBlurShader</li>
 
+						<li>VerticalTiltShiftShader</li>
 
+						<li>VignetteShader</li>
 
+						<li>WaterRefractionShader</li>
 
+					</ul>
 
+				</li>
 
 				<li>utils
 
 					<ul>
 
 						<li>BufferGeometryUtils</li>
 
@@ -124,7 +323,7 @@
 
 		</p>
 
 		<p>
 
 			Note: When using code from the examples directory, it's important that all files match the version of
 
-			your three.js main file. For example it's no good approach to use *GLTFLoader* and *OrbitControls* from R96 together
 
+			your three.js main file. For example, it's not acceptable to use *GLTFLoader* and *OrbitControls* from R96 together
 
 			with three.js R103. You can easily keep your files in sync by using the modules from the JSM directory. If the file
 
 			is not available as a module, you can still use third-party npm packages or convert the file to a module by yourself.
 
 			In both cases, ensure the code is compatible with your three.js main file.

+ 22 - 17
docs/manual/en/introduction/Useful-links.html
View File 

@@ -17,15 +17,12 @@
 
 
 			Note also that as three.js is under rapid development, a lot of these links will contain information that is
 
 			out of date - if something isn't working as you'd expect or as one of these links says it should,
 
-			check the browser console for warnings or errors, the relevant docs pages and especially the [page:DeprecatedList].<br /><br />
 
-
 
-			In addition to this page, mrdoob maintains a collection of links related to three.js over on Google+.
 
-			Check them out <a href="https://plus.google.com/+ThreejsOrg">here</a>.
 
+			check the browser console for warnings or errors, the relevant docs pages and especially the [page:DeprecatedList].
 
 		</p>
 
 
 		<h2>Help forums</h2>
 
 		<p>
 
-			Three.js officially uses [link:http://stackoverflow.com/tags/three.js/info Stack Overflow] for help requests.
 
+			Three.js officially uses the [link:https://discourse.threejs.org/ forum] and [link:http://stackoverflow.com/tags/three.js/info Stack Overflow] for help requests.
 
 			If you need assistance with something, that's the place to go. Do NOT open an issue on Github for help requests.
 
 		</p>
 
 
@@ -33,6 +30,9 @@
 
 
 		<h3>Getting started with three.js</h3>
 
 		<ul>
 
+			<li>
 
+				[link:https://threejsfundamentals.org/threejs/lessons/threejs-fundamentals.html Three.js Fundamentals starting lesson]
 
+			</li>
 
 			<li>
 
 				[link:https://codepen.io/rachsmith/post/beginning-with-3d-webgl-pt-1-the-scene Beginning with 3D WebGL] by [link:https://codepen.io/rachsmith/ Rachel Smith].
 
 			</li>
 
@@ -43,6 +43,12 @@
 
 
 		<h3>More extensive / advanced articles and courses</h3>
 
 		<ul>
 
+			<li>
 
+				[link:https://discoverthreejs.com/ Discover three.js]
 
+			</li>
 
+			<li>
 
+				[link:https://threejsfundamentals.org/ Three.js Fundamentals]
 
+			</li>
 
 			<li>
 
 				[link:http://blog.cjgammon.com/ Collection of tutorials] by [link:http://www.cjgammon.com/ CJ Gammon].
 
 			</li>
 
@@ -60,21 +66,16 @@
 
 			 [link:http://learningthreejs.com/ Learning Three.js] – a blog with articles dedicated to teaching three.js
 
 		 </li>
 
 		 <li>
 
-			 [link:http://bkcore.com/blog/3d/webgl-three-js-animated-selective-glow.html Animated selective glow in Three.js]
 
-			 by [link:https://github.com/BKcore BKcore]
 
+			 [link:https://discourse.threejs.org/t/three-js-bookshelf/2468 Three.js Bookshelf] - Looking for more resources about three.js or computer graphics in general?
 
+			 Check out the selection of literature recommended by the community.
 
 		 </li>
 
 		</ul>
 
 
-		<h3>Tutorials in other languages</h3>
 
+		<h2>News and Updates</h2>
 
 		<ul>
 
 			<li>
 
-				[link:http://www.natural-science.or.jp/article/20120220155529.php Building A Physics Simulation Environment] - three.js tutorial in Japanese
 
+				[link:https://twitter.com/hashtag/threejs Three.js on Twitter]
 
 			</li>
 
-
 
-		</ul>
 
-
 
-		<h2>News and Updates</h2>
 
-		<ul>
 
 			<li>
 
 				[link:http://www.reddit.com/r/threejs/ Three.js on reddit]
 
 			</li>
 
@@ -84,9 +85,6 @@
 
 			<li>
 
 				[link:http://learningwebgl.com/blog/ Learning WebGL Blog] – The authoritive news source for WebGL.
 
 			</li>
 
-			<li>
 
-				[link:https://plus.google.com/104300307601542851567/posts Three.js posts] on Google+ – frequent posts on Three.js
 
-			</li>
 
 		</ul>
 
 
 		<h2>Examples</h2>
 
@@ -173,6 +171,13 @@
 
 			[link:http://12devsofxmas.co.uk/2012/01/webgl-and-three-js/ A whirlwind look at Three.js]
 
 			by [link:http://github.com/nrocy Paul King]
 
 		</li>
 
+		<li>
 
+			[link:http://bkcore.com/blog/3d/webgl-three-js-animated-selective-glow.html Animated selective glow in Three.js]
 
+			by [link:https://github.com/BKcore BKcore]
 
+		</li>
 
+		<li>
 
+			[link:http://www.natural-science.or.jp/article/20120220155529.php Building A Physics Simulation Environment] - three.js tutorial in Japanese
 
+		</li>
 
 	 </ul>
 
 
 	</body>

+ 20 - 12
docs/manual/zh/introduction/Useful-links.html
View File 

@@ -31,6 +31,9 @@
 
 
 		<h3>three.js入门</h3>
 
 		<ul>
 
+			<li>
 
+				[link:https://threejsfundamentals.org/threejs/lessons/threejs-fundamentals.html Three.js Fundamentals starting lesson]
 
+			</li>
 
 			<li>
 
 				[link:https://codepen.io/rachsmith/post/beginning-with-3d-webgl-pt-1-the-scene Beginning with 3D WebGL] by [link:https://codepen.io/rachsmith/ Rachel Smith].
 
 			</li>
 
@@ -41,6 +44,12 @@
 
 
 		<h3>更加广泛、高级的文章与教程</h3>
 
 		<ul>
 
+			<li>
 
+				[link:https://discoverthreejs.com/ Discover three.js]
 
+			</li>
 
+			<li>
 
+				[link:https://threejsfundamentals.org/ Three.js Fundamentals]
 
+			</li>
 
 			<li>
 
 				[link:http://blog.cjgammon.com/ Collection of tutorials] by [link:http://www.cjgammon.com/ CJ Gammon].
 
 			</li>
 
@@ -58,21 +67,16 @@
 
 			 [link:http://learningthreejs.com/ Learning Three.js] – a blog with articles dedicated to teaching three.js
 
 		 </li>
 
 		 <li>
 
-			 [link:http://bkcore.com/blog/3d/webgl-three-js-animated-selective-glow.html Animated selective glow in Three.js]
 
-			 by [link:https://github.com/BKcore BKcore]
 
+			 [link:https://discourse.threejs.org/t/three-js-bookshelf/2468 Three.js Bookshelf] - Looking for more resources about three.js or computer graphics in general?
 
+			 Check out the selection of literature recommended by the community.
 
 		 </li>
 
 		</ul>
 
 
-		<h3>其它非英语的教程</h3>
 
+		<h2>新闻与更新</h2>
 
 		<ul>
 
 			<li>
 
-				[link:http://www.natural-science.or.jp/article/20120220155529.php Building A Physics Simulation Environment] - three.js tutorial in Japanese
 
+				[link:https://twitter.com/hashtag/threejs Three.js on Twitter]
 
 			</li>
 
-
 
-		</ul>
 
-
 
-		<h2>新闻与更新</h2>
 
-		<ul>
 
 			<li>
 
 				[link:http://www.reddit.com/r/threejs/ Three.js on reddit]
 
 			</li>
 
@@ -82,9 +86,6 @@
 
 			<li>
 
 				[link:http://learningwebgl.com/blog/ Learning WebGL Blog] – The authoritive news source for WebGL.
 
 			</li>
 
-			<li>
 
-				[link:https://plus.google.com/104300307601542851567/posts Three.js posts] on Google+ – frequent posts on Three.js
 
-			</li>
 
 		</ul>
 
 		<h2>示例</h2>
 
 		<ul>
 
@@ -165,6 +166,13 @@
 
 			[link:http://12devsofxmas.co.uk/2012/01/webgl-and-three-js/ A whirlwind look at Three.js]
 
 			by [link:http://github.com/nrocy Paul King]
 
 		</li>
 
+		<li>
 
+			[link:http://bkcore.com/blog/3d/webgl-three-js-animated-selective-glow.html Animated selective glow in Three.js]
 
+			by [link:https://github.com/BKcore BKcore]
 
+		</li>
 
+		<li>
 
+			[link:http://www.natural-science.or.jp/article/20120220155529.php Building A Physics Simulation Environment] - three.js tutorial in Japanese
 
+		</li>
 
 	 </ul>
 
 
 	</body>

+ 159 - 76
docs/page.css
View File 

@@ -1,84 +1,168 @@
 
+:root {
 
+	--color-blue: #049EF4;
 
+	--text-color: #444;
 
+
 
+	--font-size: 14px;
 
+	--line-height: 24px;
 
+	--font-size-sanserif: 1.14285714286rem;
 
+	--line-height-sanserif: 1.71428571rem;
 
+
 
+	--border-style: 1px solid #E8E8E8;
 
+	--header-height: 48px;
 
+	--panel-width: 300px;
 
+	--panel-padding: 1.143rem;
 
+	--page-padding: 1.75rem;
 
+	--max-width: 760px;
 
+	--icon-size: 1.428rem;
 
+}
 
+
 
 @font-face {
 
-	font-family: 'RobotoMono';
 
-	src: local('RobotoMono'), url('../files/RobotoMono-Regular.woff2') format('woff2');
 
-	font-weight: normal;
 
+	font-family: 'Roboto Mono';
 
+	src: local('Roboto Mono'), local('RobotoMono-Regular'), url('../files/RobotoMono-Regular.woff2') format('woff2');
 
 	font-style: normal;
 
+	font-weight: 400;
 
 }
 
-
 
 @font-face {
 
-	font-family: 'SF-Pro-Text';
 
-	src: local('SF-Pro-Text'), url('../files/SF-Pro-Text-Regular.otf');
 
-	font-weight: normal;
 
+	font-family: 'Inter';
 
 	font-style: normal;
 
+	font-weight: 400;
 
+	src: local('Inter-Regular'), url("../files/Inter-Regular.woff2?v=3.6") format("woff2");
 
+}
 
+@font-face {
 
+	font-family: 'Inter';
 
+	font-style: normal;
 
+	font-weight: 600;
 
+	src: local('Inter-SemiBold'), url("../files/Inter-SemiBold.woff2?v=3.6") format("woff2");
 
+}
 
+
 
+html {
 
+	font-family: 'Inter', sans-serif;
 
+	font-size: var(--font-size);
 
+	line-height: var(--line-height);
 
 }
 
 
 body {
 
-	margin: 78px auto;
 
-	padding: 0px 24px;
 
-	max-width: 780px;
 
-	color: #555;
 
-	font-family: 'SF-Pro-Text', sans-serif;
 
-	font-size: 16px;
 
-	line-height: 23px;
 
+	color: var(--text-color);
 
 	tab-size: 4;
 
 	overflow: auto;
 
+	max-width: var(--max-width);
 
+	margin: 0 auto;
 
+	padding-top: var(--page-padding);
 
+	padding-bottom: var(--page-padding);
 
+	padding-right: var(--page-padding);
 
+	padding-left: calc(var(--page-padding) + var(--panel-width));
 
 }
 
 
 a {
 
-	color: #1184CE;
 
+	color: var(--color-blue);
 
 	cursor: pointer;
 
-	text-decoration: underline;
 
+	text-decoration: none;
 
 }
 
 
 h1 {
 
-	color: #049EF4;
 
-	font-size: 32px;
 
+	font-size: 2.8rem;
 
+	line-height: 3.4rem;
 
 	font-weight: normal;
 
-	line-height: 42px;
 
+	margin-top: 1rem;
 
+	margin-bottom: -0.2rem;
 
+	margin-left: -2px;
 
 }
 
 
 h2 {
 
-	color: #4B0;
 
-
 
-	font-size: 22px;
 
+	font-size: 2rem;
 
+	line-height: 2.6rem;
 
 	font-weight: normal;
 
-	line-height: 31px;
 
+	margin-top: 2rem;
 
+	margin-bottom: -0.4rem;
 
 }
 
 
 h3 {
 
-	color: #000;
 
-	font-size: 16px;
 
+	font-size: 1.42857143rem;
 
+	line-height: 2.14285714rem;
 
 	font-weight: normal;
 
+	margin-top: 1.8rem;
 
+	margin-bottom: -0.4rem;
 
+}
 
+
 
+p,
 
+div,
 
+table,
 
+ol,
 
+ul {
 
+	font-size: var(--font-size-sanserif);
 
+	line-height: var(--line-height-sanserif);
 
+	margin-top: .8rem;
 
+	margin-bottom: .8rem;
 
+}
 
+
 
+p {
 
+	padding-right: 1rem;
 
+}
 
 
-	margin-top: 40px;
 
+ul, ol {
 
+	box-sizing: border-box;
 
+	padding-left: 24px;
 
+}
 
+ul li,
 
+ol li {
 
+	padding-left: 0.25rem;
 
+	margin-bottom: 0.25rem;
 
 }
 
 
-p, ul, ol {
 
-	margin-top: 0;
 
-	margin-bottom: 20px;
 
-	max-width: 780px;
 
+li ul,
 
+li ol {
 
+	margin-top: 0.25rem;
 
 }
 
 
-div {
 
-	/* padding-left: 30px; */
 
-	margin-bottom: 20px;
 
+code {
 
+	margin: 1.2rem calc(-1 * var(--page-padding));
 
+}
 
+
 
+ol code,
 
+ul code {
 
+	margin: 1.2rem 0;
 
+}
 
+
 
+code.inline {
 
+	display: inline-block;
 
+	vertical-align: middle;
 
+	border-radius: 4px;
 
+	padding: 0px 5px;
 
+	background: #F5F5F5;
 
+	margin: 0;
 
+}
 
+
 
+table {
 
+	width: 100%;
 
+	border-collapse: collapse;
 
 }
 
 
 .desc {
 
 	padding-left: 0px;
 
 }
 
 
-pre, code {
 
-	margin-top: 20px;
 
-	margin-bottom: 20px;
 
+table th,
 
+table td {
 
+	text-align: left;
 
+	vertical-align: top;
 
+	padding: .6rem .4rem;
 
+	border-bottom: var(--border-style);
 
 }
 
 
-code {
 
+table th {
 
+	text-decoration: none;
 
+}
 
+table th:first-child,
 
+table td:first-child {
 
+	padding-left: 0;
 
+}
 
+
 
+code:not(.inline) {
 
 	display: block;
 
-	padding: 20px;
 
+	padding: 1.25rem var(--page-padding);
 
 	white-space: pre-wrap;
 
-	background-color: #f9f9f9;
 
 	overflow: auto;
 
+	box-sizing: border-box;
 
 }
 
 
 iframe {
 
@@ -87,51 +171,46 @@ iframe {
 
 	border:0;
 
 }
 
 
-th {
 
-	padding: 10px;
 
-	text-decoration: underline;
 
-}
 
-
 
-td {
 
-	text-align: center;
 
-}
 
-
 
 table code {
 
-	padding: 2px;
 
+	padding: 0px;
 
 	margin: 0px;
 
 	width: auto;
 
 }
 
 
 strong {
 
-	color: #000;
 
-	font-weight: normal;
 
+	font-weight: 600;
 
 }
 
 
+
 
+/* TODO: Duplicate styles in main.css. Needed here cause button is inside the iframe */
 
 #button {
 
 	position: fixed;
 
-	bottom: 16px;
 
-	right: 16px;
 
+	bottom: 1rem;
 
+	right: 1rem;
 
 
-	padding: 8px;
 
-	border-radius: 50%;
 
-	margin-bottom: 0px; /* TODO div sets it to 20px */
 
+	padding: 0.75rem;
 
+	border-radius: 2rem;
 
+	margin-bottom: 0px;
 
 
-	background-color: #dddddd;
 
-	opacity: 0.4;
 
-}
 
+	background-color: #FFF;
 
+	opacity: .9;
 
+	z-index: 999;
 
 
+	box-shadow: 0 0 4px rgba(0,0,0,.15);
 
+}
 
 	#button:hover {
 
 		cursor: pointer;
 
 		opacity: 1;
 
 	}
 
-
 
 	#button img {
 
 		display: block;
 
+		width: calc(1.125 * var(--icon-size));
 
 	}
 
 
 a.permalink {
 
 	float: right;
 
 	margin-left: 5px;
 
+	display: none;
 
 }
 
 
 a.param,
 
@@ -140,37 +219,41 @@ span.param {
 
 }
 
 
 a.param:hover {
 
-	color: #777;
 
+	color: var(--text-color);
 
 }
 
 
-sup, sub {
 
-	/* prevent superscript and subscript elements from affecting line-height */
 
-	vertical-align: baseline;
 
-	position: relative;
 
-	top: -0.4em;
 
-}
 
 
-sub {
 
-	top: 0.4em;
 
+@media all and ( min-width: 1700px ) {
 
+	:root {
 
+		--panel-width: 360px;
 
+		--font-size: 18px;
 
+		--line-height: 28px;
 
+		--header-height: 56px;
 
+		--max-width: 1160px;
 
+	}
 
 }
 
 
 /* mobile */
 
 
 @media all and ( max-width: 640px ) {
 
+	:root {
 
+		--page-padding: var(--panel-padding);
 
+	}
 
 
 	body {
 
-		margin: 14px auto;
 
-		padding: 0px 14px;
 
-		font-size: 14px;
 
-		line-height: 22px;
 
+		padding: var(--page-padding);
 
 	}
 
 
 	h1 {
 
-		font-size: 26px;
 
+		font-size: 2rem;
 
+		line-height: 2.6rem;
 
+		padding-right: 2rem;
 
+		margin-top: 0;
 
 	}
 
 
 	h2 {
 
-		font-size: 18px;
 
-		line-height: 25px;
 
+		font-size: 1.6rem;
 
+		line-height: 2.2rem;
 
+		margin-top: 1.6rem;
 
 	}
 
 }

+ 1 - 3
docs/prettify/threejs.css
View File 

@@ -11,7 +11,5 @@ pre .dec, code .dec { color: #22c0c4; } /* decimal */
 
 
 pre.prettyprint, code.prettyprint {
 
 	background-color: #F5F5F5;
 
-	font-family: 'RobotoMono', monospace;
 
-	font-size: 14px;
 
-	line-height: 21px;
 
+	font-family: 'Roboto Mono', monospace;
 
 }

+ 1 - 1
docs/scenes/geometry-browser.html
View File 

@@ -24,7 +24,7 @@
 
 		<script src="../../build/three.min.js"></script>
 
 		<script src='../../examples/js/libs/dat.gui.min.js'></script>
 
 		<script src="../../examples/js/controls/OrbitControls.js"></script>
 
-		<script src="../../examples/js/ParametricGeometries.js"></script>
 
+		<script src="../../examples/js/geometries/ParametricGeometries.js"></script>
 
 
 		<script src='js/geometry.js'></script>

+ 2 - 0
editor/index.html
View File 

@@ -126,11 +126,13 @@
 
 		<script src="js/Sidebar.Geometry.BoxGeometry.js"></script>
 
 		<script src="js/Sidebar.Geometry.CircleGeometry.js"></script>
 
 		<script src="js/Sidebar.Geometry.CylinderGeometry.js"></script>
 
+		<script src="js/Sidebar.Geometry.ExtrudeGeometry.js"></script>
 
 		<script src="js/Sidebar.Geometry.IcosahedronGeometry.js"></script>
 
 		<script src="js/Sidebar.Geometry.OctahedronGeometry.js"></script>
 
 		<script src="js/Sidebar.Geometry.PlaneGeometry.js"></script>
 
 		<script src="js/Sidebar.Geometry.RingGeometry.js"></script>
 
 		<script src="js/Sidebar.Geometry.SphereGeometry.js"></script>
 
+		<script src="js/Sidebar.Geometry.ShapeGeometry.js"></script>
 
 		<script src="js/Sidebar.Geometry.TetrahedronGeometry.js"></script>
 
 		<script src="js/Sidebar.Geometry.TorusGeometry.js"></script>
 
 		<script src="js/Sidebar.Geometry.TorusKnotGeometry.js"></script>

+ 145 - 0
editor/js/Sidebar.Geometry.ExtrudeGeometry.js
View File 

@@ -0,0 +1,145 @@
 
+/**
 
+ * @author Temdog007 / http://github.com/Temdog007
 
+ */
 
+
 
+Sidebar.Geometry.ExtrudeGeometry = function ( editor, object ) {
 
+
 
+	var strings = editor.strings;
 
+
 
+	var signals = editor.signals;
 
+
 
+	var container = new UI.Row();
 
+
 
+	var geometry = object.geometry;
 
+	var parameters = geometry.parameters;
 
+	var options = parameters.options;
 
+	options.curveSegments = options.curveSegments != undefined ? options.curveSegments : 12;
 
+	options.steps = options.steps != undefined ? options.steps : 1;
 
+	options.depth = options.depth != undefined ? options.depth : 100;
 
+	options.bevelThickness = options.bevelThickness !== undefined ? options.bevelThickness : 6;
 
+	options.bevelSize = options.bevelSize !== undefined ? options.bevelSize : 4;
 
+	options.bevelOffset = options.bevelOffset !== undefined ? options.bevelOffset : 0;
 
+	options.bevelSegments = options.bevelSegments !== undefined ? options.bevelSegments : 3;
 
+
 
+
 
+	// curveSegments
 
+
 
+	var curveSegmentsRow = new UI.Row();
 
+	var curveSegments = new UI.Integer( options.curveSegments ).onChange( update ).setRange( 1, Infinity );
 
+
 
+	curveSegmentsRow.add( new UI.Text( strings.getKey( 'sidebar/geometry/extrude_geometry/curveSegments' ) ).setWidth( '90px' ) );
 
+	curveSegmentsRow.add( curveSegments );
 
+
 
+	container.add( curveSegmentsRow );
 
+
 
+	// steps
 
+
 
+	var stepsRow = new UI.Row();
 
+	var steps = new UI.Integer( options.steps ).onChange( update ).setRange( 1, Infinity );
 
+
 
+	stepsRow.add( new UI.Text( strings.getKey( 'sidebar/geometry/extrude_geometry/steps' ) ).setWidth( '90px' ) );
 
+	stepsRow.add( steps );
 
+
 
+	container.add( stepsRow );
 
+
 
+	// depth
 
+
 
+	var depthRow = new UI.Row();
 
+	var depth = new UI.Number( options.depth ).onChange( update ).setRange( 1, Infinity );
 
+
 
+	depthRow.add( new UI.Text( strings.getKey( 'sidebar/geometry/extrude_geometry/depth' ) ).setWidth( '90px' ) );
 
+	depthRow.add( depth );
 
+
 
+	container.add( depthRow );
 
+
 
+	// enabled
 
+
 
+	var enabledRow = new UI.Row();
 
+	var enabled = new UI.Checkbox( options.bevelEnabled ).onChange( update );
 
+
 
+	enabledRow.add( new UI.Text( strings.getKey( 'sidebar/geometry/extrude_geometry/bevelEnabled' ) ).setWidth( '90px' ) );
 
+	enabledRow.add( enabled );
 
+
 
+	container.add( enabledRow );
 
+
 
+	if ( options.bevelEnabled === true ) {
 
+
 
+		// thickness
 
+
 
+		var thicknessRow = new UI.Row();
 
+		var thickness = new UI.Number( options.bevelThickness ).onChange( update );
 
+
 
+		thicknessRow.add( new UI.Text( strings.getKey( 'sidebar/geometry/extrude_geometry/bevelThickness' ) ).setWidth( '90px' ) );
 
+		thicknessRow.add( thickness );
 
+
 
+		container.add( thicknessRow );
 
+
 
+		// size
 
+
 
+		var sizeRow = new UI.Row();
 
+		var size = new UI.Number( options.bevelSize ).onChange( update );
 
+
 
+		sizeRow.add( new UI.Text( strings.getKey( 'sidebar/geometry/extrude_geometry/bevelSize' ) ).setWidth( '90px' ) );
 
+		sizeRow.add( size );
 
+
 
+		container.add( sizeRow );
 
+
 
+		// offset
 
+
 
+		var offsetRow = new UI.Row();
 
+		var offset = new UI.Number( options.bevelOffset ).onChange( update );
 
+
 
+		offsetRow.add( new UI.Text( strings.getKey( 'sidebar/geometry/extrude_geometry/bevelOffset' ) ).setWidth( '90px' ) );
 
+		offsetRow.add( offset );
 
+
 
+		container.add( offsetRow );
 
+
 
+		// segments
 
+
 
+		var segmentsRow = new UI.Row();
 
+		var segments = new UI.Integer( options.bevelSegments ).onChange( update ).setRange( 0, Infinity );
 
+
 
+		segmentsRow.add( new UI.Text( strings.getKey( 'sidebar/geometry/extrude_geometry/bevelSegments' ) ).setWidth( '90px' ) );
 
+		segmentsRow.add( segments );
 
+
 
+		container.add( segmentsRow );
 
+
 
+	}
 
+
 
+	var button = new UI.Button( strings.getKey( 'sidebar/geometry/extrude_geometry/shape' ) ).onClick( toShape ).setWidth( '90px' ).setMarginLeft( '90px' );
 
+	container.add( button );
 
+
 
+	//
 
+
 
+	function update() {
 
+
 
+		editor.execute( new SetGeometryCommand( object, new THREE[ geometry.type ](
 
+			parameters.shapes,
 
+			{
 
+				curveSegments: curveSegments.getValue(),
 
+				steps: steps.getValue(),
 
+				depth: depth.getValue(),
 
+				bevelEnabled: enabled.getValue(),
 
+				bevelThickness: thickness !== undefined ? thickness.getValue() : options.bevelThickness,
 
+				bevelSize: size !== undefined ? size.getValue() : options.bevelSize,
 
+				bevelOffset: offset !== undefined ? offset.getValue() : options.bevelOffset,
 
+				bevelSegments: segments !== undefined ? segments.getValue() : options.bevelSegments
 
+			}
 
+		) ) );
 
+
 
+	}
 
+
 
+	function toShape() {
 
+
 
+		editor.execute( new SetGeometryCommand( object, new THREE.ShapeBufferGeometry(
 
+			parameters.shapes,
 
+			options.curveSegments
 
+		) ) );
 
+
 
+	}
 
+
 
+	return container;
 
+
 
+};
 
+
 
+Sidebar.Geometry.ExtrudeBufferGeometry = Sidebar.Geometry.ExtrudeGeometry;

+ 3 - 84
editor/js/Sidebar.Geometry.LatheGeometry.js
View File 

@@ -2,7 +2,7 @@
 
  * @author rfm1201
 
  */
 
 
-Sidebar.Geometry.LatheGeometry = function( editor, object ) {
 
+Sidebar.Geometry.LatheGeometry = function ( editor, object ) {
 
 
 	var strings = editor.strings;
 
 
@@ -45,99 +45,18 @@ Sidebar.Geometry.LatheGeometry = function( editor, object ) {
 
 
 	// points
 
 
-	var lastPointIdx = 0;
 
-	var pointsUI = [];
 
-
 
 	var pointsRow = new UI.Row();
 
 	pointsRow.add( new UI.Text( strings.getKey( 'sidebar/geometry/lathe_geometry/points' ) ).setWidth( '90px' ) );
 
 
-	var points = new UI.Span().setDisplay( 'inline-block' );
 
+	var points = new UI.Points2().setValue( parameters.points ).onChange( update );
 
 	pointsRow.add( points );
 
 
-	var pointsList = new UI.Div();
 
-	points.add( pointsList );
 
-
 
-	for ( var i = 0; i < parameters.points.length; i ++ ) {
 
-
 
-		var point = parameters.points[ i ];
 
-		pointsList.add( createPointRow( point.x, point.y ) );
 
-
 
-	}
 
-
 
-	var addPointButton = new UI.Button( '+' ).onClick( function() {
 
-
 
-		if( pointsUI.length === 0 ){
 
-
 
-			pointsList.add( createPointRow( 0, 0 ) );
 
-
 
-		} else {
 
-
 
-			var point = pointsUI[ pointsUI.length - 1 ];
 
-
 
-			pointsList.add( createPointRow( point.x.getValue(), point.y.getValue() ) );
 
-
 
-		}
 
-
 
-		update();
 
-
 
-	} );
 
-	points.add( addPointButton );
 
-
 
 	container.add( pointsRow );
 
 
-	//
 
-
 
-	function createPointRow( x, y ) {
 
-
 
-		var pointRow = new UI.Div();
 
-		var lbl = new UI.Text( lastPointIdx + 1 ).setWidth( '20px' );
 
-		var txtX = new UI.Number( x ).setRange( 0, Infinity ).setWidth( '40px' ).onChange( update );
 
-		var txtY = new UI.Number( y ).setWidth( '40px' ).onChange( update );
 
-		var idx = lastPointIdx;
 
-		var btn = new UI.Button( '-' ).onClick( function() {
 
-
 
-			deletePointRow( idx );
 
-
 
-		} );
 
-
 
-		pointsUI.push( { row: pointRow, lbl: lbl, x: txtX, y: txtY } );
 
-		lastPointIdx ++;
 
-		pointRow.add( lbl, txtX, txtY, btn );
 
-
 
-		return pointRow;
 
-
 
-	}
 
-
 
-	function deletePointRow( idx ) {
 
-
 
-		if ( ! pointsUI[ idx ] ) return;
 
-
 
-		pointsList.remove( pointsUI[ idx ].row );
 
-		pointsUI[ idx ] = null;
 
-
 
-		update();
 
-
 
-	}
 
-
 
 	function update() {
 
 
-		var points = [];
 
-		var count = 0;
 
-
 
-		for ( var i = 0; i < pointsUI.length; i ++ ) {
 
-
 
-			var pointUI = pointsUI[ i ];
 
-
 
-			if ( ! pointUI ) continue;
 
-
 
-			points.push( new THREE.Vector2( pointUI.x.getValue(), pointUI.y.getValue() ) );
 
-			count ++;
 
-			pointUI.lbl.setValue( count );
 
-
 
-		}
 
-
 
 		editor.execute( new SetGeometryCommand( object, new THREE[ geometry.type ](
 
-			points,
 
+			points.getValue(),
 
 			segments.getValue(),
 
 			phiStart.getValue() / 180 * Math.PI,
 
 			phiLength.getValue() / 180 * Math.PI

+ 55 - 0
editor/js/Sidebar.Geometry.ShapeGeometry.js
View File 

@@ -0,0 +1,55 @@
 
+/**
 
+ * @author Temdog007 / http://github.com/Temdog007
 
+ */
 
+
 
+Sidebar.Geometry.ShapeGeometry = function ( editor, object ) {
 
+
 
+	var strings = editor.strings;
 
+
 
+	var signals = editor.signals;
 
+
 
+	var container = new UI.Row();
 
+
 
+	var geometry = object.geometry;
 
+	var parameters = geometry.parameters;
 
+
 
+	// curveSegments
 
+
 
+	var curveSegmentsRow = new UI.Row();
 
+	var curveSegments = new UI.Integer( parameters.curveSegments || 12 ).onChange( changeShape ).setRange( 1, Infinity );
 
+
 
+	curveSegmentsRow.add( new UI.Text( strings.getKey( 'sidebar/geometry/shape_geometry/curveSegments' ) ).setWidth( '90px' ) );
 
+	curveSegmentsRow.add( curveSegments );
 
+
 
+	container.add( curveSegmentsRow );
 
+
 
+	// to extrude
 
+	var button = new UI.Button( strings.getKey( 'sidebar/geometry/shape_geometry/extrude' ) ).onClick( toExtrude ).setWidth( '90px' ).setMarginLeft( '90px' );
 
+	container.add( button );
 
+
 
+	//
 
+
 
+	function changeShape() {
 
+
 
+		editor.execute( new SetGeometryCommand( object, new THREE[ geometry.type ](
 
+			parameters.shapes,
 
+			curveSegments.getValue()
 
+		) ) );
 
+
 
+	}
 
+
 
+	function toExtrude() {
 
+
 
+		editor.execute( new SetGeometryCommand( object, new THREE.ExtrudeBufferGeometry(
 
+			parameters.shapes, {
 
+				curveSegments: curveSegments.getValue()
 
+			}
 
+		) ) );
 
+
 
+	}
 
+
 
+	return container;
 
+
 
+};
 
+
 
+Sidebar.Geometry.ShapeBufferGeometry = Sidebar.Geometry.ShapeGeometry;

+ 2 - 83
editor/js/Sidebar.Geometry.TubeGeometry.js
View File 

@@ -15,45 +15,12 @@ Sidebar.Geometry.TubeGeometry = function ( editor, object ) {
 
 
 	// points
 
 
-	var lastPointIdx = 0;
 
-	var pointsUI = [];
 
-
 
 	var pointsRow = new UI.Row();
 
 	pointsRow.add( new UI.Text( strings.getKey( 'sidebar/geometry/tube_geometry/path' ) ).setWidth( '90px' ) );
 
 
-	var points = new UI.Span().setDisplay( 'inline-block' );
 
+	var points = new UI.Points3().setValue( parameters.path.points ).onChange( update );
 
 	pointsRow.add( points );
 
 
-	var pointsList = new UI.Div();
 
-	points.add( pointsList );
 
-
 
-	var parameterPoints = parameters.path.points;
 
-	for ( var i = 0; i < parameterPoints.length; i ++ ) {
 
-
 
-		var point = parameterPoints[ i ];
 
-		pointsList.add( createPointRow( point.x, point.y, point.z ) );
 
-
 
-	}
 
-
 
-	var addPointButton = new UI.Button( '+' ).onClick( function () {
 
-
 
-		if ( pointsUI.length === 0 ) {
 
-
 
-			pointsList.add( createPointRow( 0, 0, 0 ) );
 
-
 
-		} else {
 
-
 
-			var point = pointsUI[ pointsUI.length - 1 ];
 
-
 
-			pointsList.add( createPointRow( point.x.getValue(), point.y.getValue(), point.z.getValue() ) );
 
-
 
-		}
 
-
 
-		update();
 
-
 
-	} );
 
-	points.add( addPointButton );
 
-
 
 	container.add( pointsRow );
 
 
 	// radius
 
@@ -118,25 +85,10 @@ Sidebar.Geometry.TubeGeometry = function ( editor, object ) {
 
 
 	function update() {
 
 
-		var points = [];
 
-		var count = 0;
 
-
 
-		for ( var i = 0; i < pointsUI.length; i ++ ) {
 
-
 
-			var pointUI = pointsUI[ i ];
 
-
 
-			if ( ! pointUI ) continue;
 
-
 
-			points.push( new THREE.Vector3( pointUI.x.getValue(), pointUI.y.getValue(), pointUI.z.getValue() ) );
 
-			count ++;
 
-			pointUI.lbl.setValue( count );
 
-
 
-		}
 
-
 
 		tensionRow.setDisplay( curveType.getValue() == 'catmullrom' ? '' : 'none' );
 
 
 		editor.execute( new SetGeometryCommand( object, new THREE[ geometry.type ](
 
-			new THREE.CatmullRomCurve3( points, closed.getValue(), curveType.getValue(), tension.getValue() ),
 
+			new THREE.CatmullRomCurve3( points.getValue(), closed.getValue(), curveType.getValue(), tension.getValue() ),
 
 			tubularSegments.getValue(),
 
 			radius.getValue(),
 
 			radialSegments.getValue(),
 
@@ -145,39 +97,6 @@ Sidebar.Geometry.TubeGeometry = function ( editor, object ) {
 
 
 	}
 
 
-	function createPointRow( x, y, z ) {
 
-
 
-		var pointRow = new UI.Div();
 
-		var lbl = new UI.Text( lastPointIdx + 1 ).setWidth( '20px' );
 
-		var txtX = new UI.Number( x ).setWidth( '30px' ).onChange( update );
 
-		var txtY = new UI.Number( y ).setWidth( '30px' ).onChange( update );
 
-		var txtZ = new UI.Number( z ).setWidth( '30px' ).onChange( update );
 
-		var idx = lastPointIdx;
 
-		var btn = new UI.Button( '-' ).onClick( function () {
 
-
 
-			deletePointRow( idx );
 
-
 
-		} );
 
-
 
-		pointsUI.push( { row: pointRow, lbl: lbl, x: txtX, y: txtY, z: txtZ } );
 
-		lastPointIdx ++;
 
-		pointRow.add( lbl, txtX, txtY, txtZ, btn );
 
-
 
-		return pointRow;
 
-
 
-	}
 
-
 
-	function deletePointRow( idx ) {
 
-
 
-		if ( ! pointsUI[ idx ] ) return;
 
-
 
-		pointsList.remove( pointsUI[ idx ].row );
 
-		pointsUI[ idx ] = null;
 
-
 
-		update();
 
-
 
-	}
 
-
 
 	return container;
 
 
 };

+ 18 - 1
editor/js/Sidebar.Project.js
View File 

@@ -133,7 +133,24 @@ Sidebar.Project = function ( editor ) {
 
 
 		rendererPropertiesRow.setDisplay( type === 'WebGLRenderer' ? '' : 'none' );
 
 
-		var renderer = new rendererTypes[ type ]( { antialias: antialias } );
 
+		var parameters = {};
 
+
 
+		switch ( type ) {
 
+
 
+			case 'WebGLRenderer':
 
+				parameters.antialias = antialias;
 
+				break;
 
+
 
+			case 'RaytracingRenderer':
 
+				parameters.workers = navigator.hardwareConcurrency || 4;
 
+				parameters.workerPath = '../examples/js/renderers/RaytracingWorker.js';
 
+				parameters.randomize = true;
 
+				parameters.blockSize = 64;
 
+				break;
 
+
 
+		}
 
+
 
+		var renderer = new rendererTypes[ type ]( parameters );
 
 
 		if ( shadows && renderer.shadowMap ) {

+ 13 - 0
editor/js/Strings.js
View File 

@@ -135,6 +135,16 @@ var Strings = function ( config ) {
 
 			'sidebar/geometry/cylinder_geometry/heightsegments': 'Height segments',
 
 			'sidebar/geometry/cylinder_geometry/openended': 'Open ended',
 
 
+			'sidebar/geometry/extrude_geometry/curveSegments': 'Curve Segments',
 
+			'sidebar/geometry/extrude_geometry/steps': 'Steps',
 
+			'sidebar/geometry/extrude_geometry/depth': 'Depth',
 
+			'sidebar/geometry/extrude_geometry/bevelEnabled': 'Bevel?',
 
+			'sidebar/geometry/extrude_geometry/bevelThickness': 'Thickness',
 
+			'sidebar/geometry/extrude_geometry/bevelSize': 'Size',
 
+			'sidebar/geometry/extrude_geometry/bevelOffset': 'Offset',
 
+			'sidebar/geometry/extrude_geometry/bevelSegments': 'Segments',
 
+			'sidebar/geometry/extrude_geometry/shape': 'Convert to Shape',
 
+
 
 			'sidebar/geometry/geometry/vertices': 'Vertices',
 
 			'sidebar/geometry/geometry/faces': 'Faces',
 
 
@@ -164,6 +174,9 @@ var Strings = function ( config ) {
 
 			'sidebar/geometry/ring_geometry/thetastart': 'Theta start',
 
 			'sidebar/geometry/ring_geometry/thetalength': 'Theta length',
 
 
+			'sidebar/geometry/shape_geometry/curveSegments': 'Curve Segments',
 
+			'sidebar/geometry/shape_geometry/extrude': 'Extrude',
 
+
 
 			'sidebar/geometry/sphere_geometry/radius': 'Radius',
 
 			'sidebar/geometry/sphere_geometry/widthsegments': 'Width segments',
 
 			'sidebar/geometry/sphere_geometry/heightsegments': 'Height segments',

+ 256 - 0
editor/js/libs/ui.three.js
View File 

@@ -453,6 +453,262 @@ UI.Outliner.prototype.setValue = function ( value ) {
 
 
 };
 
 
+var Points = function ( onAddClicked ) {
 
+
 
+	UI.Element.call( this );
 
+
 
+	var span = new UI.Span().setDisplay( 'inline-block' );
 
+
 
+	this.pointsList = new UI.Div();
 
+	span.add( this.pointsList );
 
+
 
+	var row = new UI.Row();
 
+	span.add( row );
 
+
 
+	var addPointButton = new UI.Button( '+' ).onClick( onAddClicked );
 
+	row.add( addPointButton );
 
+
 
+	this.update = function () {
 
+
 
+		if ( this.onChangeCallback !== null ) {
 
+
 
+			this.onChangeCallback();
 
+
 
+		}
 
+
 
+	}.bind( this );
 
+
 
+	this.dom = span.dom;
 
+	this.pointsUI = [];
 
+	this.lastPointIdx = 0;
 
+	this.onChangeCallback = null;
 
+	return this;
 
+
 
+};
 
+
 
+Points.prototype = Object.create( UI.Element.prototype );
 
+Points.prototype.constructor = Points;
 
+
 
+Points.prototype.onChange = function ( callback ) {
 
+
 
+	this.onChangeCallback = callback;
 
+
 
+	return this;
 
+
 
+};
 
+
 
+Points.prototype.clear = function () {
 
+
 
+	for ( var i = 0; i < this.pointsUI.length; ++ i ) {
 
+
 
+		if ( this.pointsUI[ i ] ) {
 
+
 
+			this.deletePointRow( i, true );
 
+
 
+		}
 
+
 
+	}
 
+
 
+	this.lastPointIdx = 0;
 
+
 
+};
 
+
 
+Points.prototype.deletePointRow = function ( idx, dontUpdate ) {
 
+
 
+	if ( ! this.pointsUI[ idx ] ) return;
 
+
 
+	this.pointsList.remove( this.pointsUI[ idx ].row );
 
+	this.pointsUI[ idx ] = null;
 
+
 
+	if ( dontUpdate !== true ) {
 
+
 
+		this.update();
 
+
 
+	}
 
+
 
+};
 
+
 
+UI.Points2 = function () {
 
+
 
+	Points.call( this, UI.Points2.addRow.bind( this ) );
 
+
 
+	return this;
 
+
 
+};
 
+
 
+UI.Points2.prototype = Object.create( Points.prototype );
 
+UI.Points2.prototype.constructor = UI.Points2;
 
+
 
+UI.Points2.addRow = function () {
 
+
 
+	if ( this.pointsUI.length === 0 ) {
 
+
 
+		this.pointsList.add( this.createPointRow( 0, 0 ) );
 
+
 
+	} else {
 
+
 
+		var point = this.pointsUI[ this.pointsUI.length - 1 ];
 
+
 
+		this.pointsList.add( this.createPointRow( point.x.getValue(), point.y.getValue() ) );
 
+
 
+	}
 
+
 
+	this.update();
 
+
 
+};
 
+
 
+UI.Points2.prototype.getValue = function () {
 
+
 
+	var points = [];
 
+	var count = 0;
 
+
 
+	for ( var i = 0; i < this.pointsUI.length; i ++ ) {
 
+
 
+		var pointUI = this.pointsUI[ i ];
 
+
 
+		if ( ! pointUI ) continue;
 
+
 
+		points.push( new THREE.Vector2( pointUI.x.getValue(), pointUI.y.getValue() ) );
 
+		++ count;
 
+		pointUI.lbl.setValue( count );
 
+
 
+	}
 
+
 
+	return points;
 
+
 
+};
 
+
 
+UI.Points2.prototype.setValue = function ( points ) {
 
+
 
+	this.clear();
 
+
 
+	for ( var i = 0; i < points.length; i ++ ) {
 
+
 
+		var point = points[ i ];
 
+		this.pointsList.add( this.createPointRow( point.x, point.y ) );
 
+
 
+	}
 
+
 
+	this.update();
 
+	return this;
 
+
 
+};
 
+
 
+UI.Points2.prototype.createPointRow = function ( x, y ) {
 
+
 
+	var pointRow = new UI.Div();
 
+	var lbl = new UI.Text( this.lastPointIdx + 1 ).setWidth( '20px' );
 
+	var txtX = new UI.Number( x ).setWidth( '30px' ).onChange( this.update );
 
+	var txtY = new UI.Number( y ).setWidth( '30px' ).onChange( this.update );
 
+
 
+	var idx = this.lastPointIdx;
 
+	var scope = this;
 
+	var btn = new UI.Button( '-' ).onClick( function () {
 
+
 
+		if ( scope.isEditing ) return;
 
+		scope.deletePointRow( idx );
 
+
 
+	} );
 
+
 
+	this.pointsUI.push( { row: pointRow, lbl: lbl, x: txtX, y: txtY } );
 
+	++ this.lastPointIdx;
 
+	pointRow.add( lbl, txtX, txtY, btn );
 
+
 
+	return pointRow;
 
+
 
+};
 
+
 
+UI.Points3 = function () {
 
+
 
+	Points.call( this, UI.Points3.addRow.bind( this ) );
 
+
 
+	return this;
 
+
 
+};
 
+
 
+UI.Points3.prototype = Object.create( Points.prototype );
 
+UI.Points3.prototype.constructor = UI.Points3;
 
+
 
+UI.Points3.addRow = function () {
 
+
 
+	if ( this.pointsUI.length === 0 ) {
 
+
 
+		this.pointsList.add( this.createPointRow( 0, 0, 0 ) );
 
+
 
+	} else {
 
+
 
+		var point = this.pointsUI[ this.pointsUI.length - 1 ];
 
+
 
+		this.pointsList.add( this.createPointRow( point.x.getValue(), point.y.getValue(), point.z.getValue() ) );
 
+
 
+	}
 
+
 
+	this.update();
 
+
 
+};
 
+
 
+UI.Points3.prototype.getValue = function () {
 
+
 
+	var points = [];
 
+	var count = 0;
 
+
 
+	for ( var i = 0; i < this.pointsUI.length; i ++ ) {
 
+
 
+		var pointUI = this.pointsUI[ i ];
 
+
 
+		if ( ! pointUI ) continue;
 
+
 
+		points.push( new THREE.Vector3( pointUI.x.getValue(), pointUI.y.getValue(), pointUI.z.getValue() ) );
 
+		++ count;
 
+		pointUI.lbl.setValue( count );
 
+
 
+	}
 
+
 
+	return points;
 
+
 
+};
 
+
 
+UI.Points3.prototype.setValue = function ( points ) {
 
+
 
+	this.clear();
 
+
 
+	for ( var i = 0; i < points.length; i ++ ) {
 
+
 
+		var point = points[ i ];
 
+		this.pointsList.add( this.createPointRow( point.x, point.y, point.z ) );
 
+
 
+	}
 
+
 
+	this.update();
 
+	return this;
 
+
 
+};
 
+
 
+UI.Points3.prototype.createPointRow = function ( x, y, z ) {
 
+
 
+	var pointRow = new UI.Div();
 
+	var lbl = new UI.Text( this.lastPointIdx + 1 ).setWidth( '20px' );
 
+	var txtX = new UI.Number( x ).setWidth( '30px' ).onChange( this.update );
 
+	var txtY = new UI.Number( y ).setWidth( '30px' ).onChange( this.update );
 
+	var txtZ = new UI.Number( z ).setWidth( '30px' ).onChange( this.update );
 
+
 
+	var idx = this.lastPointIdx;
 
+	var scope = this;
 
+	var btn = new UI.Button( '-' ).onClick( function () {
 
+
 
+		if ( scope.isEditing ) return;
 
+		scope.deletePointRow( idx );
 
+
 
+	} );
 
+
 
+	this.pointsUI.push( { row: pointRow, lbl: lbl, x: txtX, y: txtY, z: txtZ } );
 
+	++ this.lastPointIdx;
 
+	pointRow.add( lbl, txtX, txtY, txtZ, btn );
 
+
 
+	return pointRow;
 
+
 
+};
 
+
 
 UI.THREE = {};
 
 
 UI.THREE.Boolean = function ( boolean, text ) {

+ 5 - 4
editor/manifest.json
View File 

@@ -1,13 +1,14 @@
 
 {
 
-  "short_name": "Editor",
 
   "name": "Three.js Editor",
 
+  "short_name": "Three.js",
 
+  "start_url": ".",
 
+  "scope": ".",
 
+  "display": "standalone",
 
   "icons": [
 
     {
 
       "src": "./images/icon.png",
 
       "type": "image/png",
 
       "sizes": "144x144"
 
     }
 
-  ],
 
-  "start_url": ".",
 
-  "display": "standalone"
 
+  ]
 
 }

+ 9 - 1
editor/sw.js
View File 

@@ -1,8 +1,10 @@
 
-// r104
 
+// r105
 
 
 const staticAssets = [
 
 	'./',
 
 
+	'../files/favicon.ico',
 
+
 
 	'../build/three.js',
 
 	'../examples/js/libs/system.min.js',
 
 
@@ -125,9 +127,14 @@ const staticAssets = [
 
 	'./js/Sidebar.Geometry.BoxGeometry.js',
 
 	'./js/Sidebar.Geometry.CircleGeometry.js',
 
 	'./js/Sidebar.Geometry.CylinderGeometry.js',
 
+	'./js/Sidebar.Geometry.ExtrudeGeometry.js',
 
 	'./js/Sidebar.Geometry.IcosahedronGeometry.js',
 
+	'./js/Sidebar.Geometry.OctahedronGeometry.js',
 
 	'./js/Sidebar.Geometry.PlaneGeometry.js',
 
+	'./js/Sidebar.Geometry.RingGeometry.js',
 
 	'./js/Sidebar.Geometry.SphereGeometry.js',
 
+	'./js/Sidebar.Geometry.ShapeGeometry.js',
 
+	'./js/Sidebar.Geometry.TetrahedronGeometry.js',
 
 	'./js/Sidebar.Geometry.TorusGeometry.js',
 
 	'./js/Sidebar.Geometry.TorusKnotGeometry.js',
 
 	'./js/Sidebar.Geometry.TubeGeometry.js',
 
@@ -141,6 +148,7 @@ const staticAssets = [
 
 	'./js/Strings.js',
 
 	'./js/Toolbar.js',
 
 	'./js/Viewport.js',
 
+	'./js/Viewport.Camera.js',
 
 	'./js/Viewport.Info.js',
 
 
 	'./js/Command.js',

+ 3 - 24
examples/css2d_label.html
View File 

@@ -4,39 +4,18 @@
 
 		<meta charset="utf-8">
 
 		<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
 
 		<title>three.js css2d - label</title>
 
+		<link type="text/css" rel="stylesheet" href="main.css">
 
 		<style>
 
-			body {
 
-				background-color: #000;
 
-				margin: 0;
 
-				overflow: hidden;
 
-			}
 
-			#info {
 
-				position: absolute;
 
-				top: 0px;
 
-				width: 100%;
 
-				color: #FFF;
 
-				padding: 5px;
 
-				font-family: Monospace;
 
-				font-size: 13px;
 
-				text-align: center;
 
-				z-index: 1;
 
-			}
 
-
 
-			.label{
 
+			.label {
 
 				color: #FFF;
 
 				font-family: sans-serif;
 
 				padding: 2px;
 
 				background: rgba( 0, 0, 0, .6 );
 
 			}
 
-
 
-			a {
 
-				color: #000000;
 
-			}
 
-
 
 		</style>
 
 	</head>
 
 	<body>
 
-		<div id="info"><a href="http://threejs.org" target="_blank" rel="noopener">three.js</a> - three.js css2d - label</div>
 
+		<div id="info"><a href="http://threejs.org" target="_blank" rel="noopener">three.js</a> css2d - label</div>
 
 
 		<script src="../build/three.js"></script>

+ 21 - 45
examples/css3d_molecules.html
View File 

@@ -4,71 +4,49 @@
 
 		<title>three.js css3d - molecules</title>
 
 		<meta charset="utf-8">
 
 		<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
 
+		<link type="text/css" rel="stylesheet" href="main.css">
 
 		<style>
 
-			html, body {
 
-				height: 100%;
 
-			}
 
-
 
 			body {
 
 				background-color: #050505;
 
 				background: radial-gradient(ellipse at center,  rgba(43,45,48,1) 0%,rgba(0,0,0,1) 100%);
 
-
 
-				margin: 0;
 
-				font-family: Arial;
 
-				overflow: hidden;
 
-			}
 
-
 
-			a {
 
-				color: #ffffff;
 
 			}
 
 
-			#info {
 
+			#topmenu {
 
 				position: absolute;
 
-				top: 0px;
 
+				top: 50px;
 
 				width: 100%;
 
-				color: #ffffff;
 
-				padding: 5px;
 
-				font-family: Monospace;
 
-				font-size: 13px;
 
-				font-weight: bold;
 
+				padding: 10px;
 
+				box-sizing: border-box;
 
 				text-align: center;
 
-				z-index: 1;
 
 			}
 
 
 			#menu {
 
 				position: absolute;
 
 				bottom: 20px;
 
 				width: 100%;
 
+				padding: 10px;
 
+				box-sizing: border-box;
 
 				text-align: center;
 
-				padding: 0;
 
-				margin: 0;
 
-			}
 
-
 
-			#topmenu {
 
-				position: absolute;
 
-				top: 10px;
 
-				right: 10px;
 
-				width: 100%;
 
-				text-align: right;
 
-				padding: 0;
 
-				margin: 0;
 
-				z-index: 1;
 
 			}
 
 
 			button {
 
 				color: rgb(255,255,255);
 
-				background: transparent;
 
+				background: rgb(255,255,255,0.1);
 
 				border: 0px;
 
 				padding: 5px 10px;
 
+				margin: 2px;
 
+				font-size: 14px;
 
 				cursor: pointer;
 
 			}
 
-			button:hover {
 
-				background-color: rgba(0,255,255,0.5);
 
-			}
 
-			button:active {
 
-				color: #000000;
 
-				background-color: rgba(0,255,255,1);
 
-			}
 
+
 
+				button:hover {
 
+					background-color: rgba(0,255,255,0.5);
 
+				}
 
+
 
+				button:active {
 
+					color: #000000;
 
+					background-color: rgba(0,255,255,1);
 
+				}
 
 
 			.bond {
 
 				width: 5px;
 
@@ -85,11 +63,9 @@
 
 		<script src="js/loaders/PDBLoader.js"></script>
 
 
 		<div id="container"></div>
 
-		<div id="info"><a href="http://threejs.org" target="_blank" rel="noopener">three.js css3d</a> - molecules</div>
 
+		<div id="info"><a href="http://threejs.org" target="_blank" rel="noopener">three.js</a> css3d - molecules</div>
 
 		<div id="topmenu">
 
-			<button id="b_a">Atoms</button>
 
-			<button id="b_b">Bonds</button>
 
-			<button id="b_ab">Atoms + Bonds</button>
 
+			<button id="b_a">Atoms</button><button id="b_b">Bonds</button><button id="b_ab">Atoms + Bonds</button>
 
 		</div>
 
 		<div id="menu"></div>

+ 6 - 17
examples/css3d_orthographic.html
View File 

@@ -3,32 +3,21 @@
 
 	<head>
 
 		<meta charset="utf-8">
 
 		<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
 
+		<link type="text/css" rel="stylesheet" href="main.css">
 
 		<style>
 
 			body {
 
-				background-color: #ffffff;
 
-				margin: 0;
 
-				overflow: hidden;
 
+				background-color: #f0f0f0;
 
 			}
 
-			#info {
 
-				position: absolute;
 
-				top: 0px;
 
-				width: 100%;
 
-				color: #000000;
 
-				padding: 5px;
 
-				font-family: Monospace;
 
-				font-size: 13px;
 
-				text-align: center;
 
-				z-index: 1;
 
-			}
 
-
 
 			a {
 
+				color: #f00;
 
+			}
 
+			#info {
 
 				color: #000000;
 
 			}
 
-
 
 		</style>
 
 	</head>
 
 	<body>
 
-		<div id="info"><a href="http://threejs.org" target="_blank" rel="noopener">three.js</a> - css3d orthographic</div>
 
+		<div id="info"><a href="http://threejs.org" target="_blank" rel="noopener">three.js</a> css3d - orthographic</div>
 
 
 		<script src="../build/three.js"></script>

+ 1 - 24
examples/css3d_panorama.html
View File 

@@ -4,30 +4,7 @@
 
 		<title>three.js css3d - panorama</title>
 
 		<meta charset="utf-8">
 
 		<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
 
-		<style>
 
-			body {
 
-				background-color: #000000;
 
-				margin: 0;
 
-				cursor: move;
 
-				overflow: hidden;
 
-			}
 
-
 
-			a {
 
-				color: #ffffff;
 
-			}
 
-
 
-			#info {
 
-				position: absolute;
 
-				width: 100%;
 
-				color: #ffffff;
 
-				padding: 5px;
 
-				font-family: Monospace;
 
-				font-size: 13px;
 
-				font-weight: bold;
 
-				text-align: center;
 
-				z-index: 1;
 
-			}
 
-		</style>
 
+		<link type="text/css" rel="stylesheet" href="main.css">
 
 	</head>
 
 	<body>
 
 		<script src="../build/three.js"></script>

+ 3 - 26
examples/css3d_panorama_deviceorientation.html
View File 

@@ -1,40 +1,17 @@
 
 <!DOCTYPE html>
 
 <html>
 
 	<head>
 
-		<title>three.js css3d - panorama - deviceorientation</title>
 
+		<title>three.js css3d - panorama - device orientation</title>
 
 		<meta charset="utf-8">
 
 		<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
 
-		<style>
 
-			body {
 
-				background-color: #000000;
 
-				margin: 0;
 
-				cursor: move;
 
-				overflow: hidden;
 
-			}
 
-
 
-			a {
 
-				color: #ffffff;
 
-			}
 
-
 
-			#info {
 
-				position: absolute;
 
-				width: 100%;
 
-				color: #ffffff;
 
-				padding: 5px;
 
-				font-family: Monospace;
 
-				font-size: 13px;
 
-				font-weight: bold;
 
-				text-align: center;
 
-				z-index: 1;
 
-			}
 
-		</style>
 
+		<link type="text/css" rel="stylesheet" href="main.css">
 
 	</head>
 
 	<body>
 
 		<script src="../build/three.js"></script>
 
 		<script src="js/controls/DeviceOrientationControls.js"></script>
 
 		<script src="js/renderers/CSS3DRenderer.js"></script>
 
 
-		<div id="info"><a href="http://threejs.org" target="_blank" rel="noopener">three.js css3d</a> - panorama - decideorientation. cubemap by <a href="http://www.humus.name/index.php?page=Textures" target="_blank" rel="noopener">Humus</a>.</div>
 
+		<div id="info"><a href="http://threejs.org" target="_blank" rel="noopener">three.js</a> css3d - panorama - device orientation.<br/>cubemap by <a href="http://www.humus.name/index.php?page=Textures" target="_blank" rel="noopener">Humus</a>.</div>
 
 
 		<script>

+ 7 - 26
examples/css3d_periodictable.html
View File 

@@ -4,32 +4,10 @@
 
 		<title>three.js css3d - periodic table</title>
 
 		<meta charset="utf-8">
 
 		<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
 
+		<link type="text/css" rel="stylesheet" href="main.css">
 
 		<style>
 
-			html, body {
 
-				height: 100%;
 
-			}
 
-
 
-			body {
 
-				background-color: #000000;
 
-				margin: 0;
 
-				font-family: Helvetica, sans-serif;;
 
-				overflow: hidden;
 
-			}
 
-
 
 			a {
 
-				color: #ffffff;
 
-			}
 
-
 
-			#info {
 
-				position: absolute;
 
-				width: 100%;
 
-				color: #ffffff;
 
-				padding: 5px;
 
-				font-family: Monospace;
 
-				font-size: 13px;
 
-				font-weight: bold;
 
-				text-align: center;
 
-				z-index: 1;
 
+				color: #8ff;
 
 			}
 
 
 			#menu {
 
@@ -44,7 +22,9 @@
 
 				height: 160px;
 
 				box-shadow: 0px 0px 12px rgba(0,255,255,0.5);
 
 				border: 1px solid rgba(127,255,255,0.25);
 
+				font-family: Helvetica, sans-serif;
 
 				text-align: center;
 
+				line-height: normal;
 
 				cursor: default;
 
 			}
 
 
@@ -89,9 +69,11 @@
 
 				padding: 5px 10px;
 
 				cursor: pointer;
 
 			}
 
+
 
 			button:hover {
 
 				background-color: rgba(0,255,255,0.5);
 
 			}
 
+
 
 			button:active {
 
 				color: #000000;
 
 				background-color: rgba(0,255,255,0.75);
 
@@ -104,7 +86,7 @@
 
 		<script src="js/controls/TrackballControls.js"></script>
 
 		<script src="js/renderers/CSS3DRenderer.js"></script>
 
 
-		<div id="info"><a href="http://threejs.org" target="_blank" rel="noopener">three.js css3d</a> - periodic table. <a href="https://plus.google.com/113862800338869870683/posts/QcFk5HrWran" target="_blank" rel="noopener">info</a>.</div>
 
+		<div id="info"><a href="http://threejs.org" target="_blank" rel="noopener">three.js</a> css3d - periodic table. <a href="https://plus.google.com/113862800338869870683/posts/QcFk5HrWran" target="_blank" rel="noopener">info</a>.</div>
 
 		<div id="container"></div>
 
 		<div id="menu">
 
 			<button id="table">TABLE</button>
 
@@ -360,7 +342,6 @@
 
 				//
 
 
 				controls = new THREE.TrackballControls( camera, renderer.domElement );
 
-				controls.rotateSpeed = 0.5;
 
 				controls.minDistance = 500;
 
 				controls.maxDistance = 6000;
 
 				controls.addEventListener( 'change', render );

+ 4 - 20
examples/css3d_sandbox.html
View File 

@@ -3,37 +3,21 @@
 
 	<head>
 
 		<meta charset="utf-8">
 
 		<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
 
+		<link type="text/css" rel="stylesheet" href="main.css">
 
 		<style>
 
 			body {
 
-				background-color: #ffffff;
 
-				margin: 0;
 
-				overflow: hidden;
 
+				color: #000;
 
 			}
 
-			#info {
 
-				position: absolute;
 
-				top: 0px;
 
-				width: 100%;
 
-				color: #000000;
 
-				padding: 5px;
 
-				font-family: Monospace;
 
-				font-size: 13px;
 
-				text-align: center;
 
-				z-index: 1;
 
-			}
 
-
 
 			a {
 
-				color: #000000;
 
+				color: #080;
 
 			}
 
-
 
 		</style>
 
 	</head>
 
 	<body>
 
-		<div id="info"><a href="http://threejs.org" target="_blank" rel="noopener">three.js</a> - css3d sandbox</div>
 
+		<div id="info"><a href="http://threejs.org" target="_blank" rel="noopener">three.js</a> css3d - sandbox</div>
 
 
 		<script src="../build/three.js"></script>
 
-
 
 		<script src="js/controls/TrackballControls.js"></script>
 
-
 
 		<script src="js/renderers/CSS3DRenderer.js"></script>
 
 
 		<script>

+ 5 - 24
examples/css3d_sprites.html
View File 

@@ -4,32 +4,14 @@
 
 		<title>three.js css3d - sprites</title>
 
 		<meta charset="utf-8">
 
 		<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
 
+		<link type="text/css" rel="stylesheet" href="main.css">
 
 		<style>
 
-			html, body {
 
-				height: 100%;
 
-			}
 
-
 
 			body {
 
-				background-color: #ffffff;
 
-				margin: 0;
 
-				font-family: Arial;
 
-				overflow: hidden;
 
+				background-color: #fff;
 
+				color: #000;
 
 			}
 
-
 
 			a {
 
-				color: #8888ff;
 
-			}
 
-
 
-			#info {
 
-				position: absolute;
 
-				width: 100%;
 
-				color: #000000;
 
-				padding: 5px;
 
-				font-family: Monospace;
 
-				font-size: 13px;
 
-				font-weight: bold;
 
-				text-align: center;
 
-				z-index: 1;
 
+				color: #48f;
 
 			}
 
 		</style>
 
 	</head>
 
@@ -39,7 +21,7 @@
 
 		<script src="js/controls/TrackballControls.js"></script>
 
 		<script src="js/renderers/CSS3DRenderer.js"></script>
 
 
-		<div id="info"><a href="http://threejs.org" target="_blank" rel="noopener">three.js css3d</a> - sprites.</div>
 
+		<div id="info"><a href="http://threejs.org" target="_blank" rel="noopener">three.js</a> css3d - sprites</div>
 
 		<div id="container"></div>
 
 
 		<script>
 
@@ -155,7 +137,6 @@
 
 				//
 
 
 				controls = new THREE.TrackballControls( camera, renderer.domElement );
 
-				controls.rotateSpeed = 0.5;
 
 
 				//

+ 10 - 9
examples/css3d_youtube.html
View File 

@@ -4,17 +4,18 @@
 
 		<title>three.js css3d - youtube</title>
 
 		<meta charset="utf-8">
 
 		<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
 
+		<link type="text/css" rel="stylesheet" href="main.css">
 
 		<style>
 
-			html, body {
 
-				height: 100%;
 
-				overflow: hidden;
 
+			body {
 
+				background-color: #ffffff;
 
 			}
 
+
 
 			#blocker {
 
 				position: absolute;
 
-				top: 0px;
 
-				left: 0px;
 
-				width: 100%;
 
-				height: 100%;
 
+				top: 0;
 
+				left: 0;
 
+				bottom: 0;
 
+				right: 0;
 
 			}
 
 		</style>
 
 	</head>
 
@@ -86,12 +87,12 @@
 
 				var blocker = document.getElementById( 'blocker' );
 
 				blocker.style.display = 'none';
 
 
-				document.addEventListener( 'mousedown', function () {
 
+				controls.addEventListener( 'start', function () {
 
 
 					blocker.style.display = '';
 
 
 				} );
 
-				document.addEventListener( 'mouseup', function () {
 
+				controls.addEventListener( 'end', function () {
 
 
 					blocker.style.display = 'none';

+ 3 - 1
examples/files.js
View File 

@@ -45,7 +45,6 @@ var files = {
 
 		"webgl_geometry_text",
 
 		"webgl_geometry_text_shapes",
 
 		"webgl_geometry_text_stroke",
 
-		"webgl_hdr",
 
 		"webgl_helpers",
 
 		"webgl_interactive_buffergeometry",
 
 		"webgl_interactive_cubes",
 
@@ -75,6 +74,7 @@ var files = {
 
 		"webgl_lines_sphere",
 
 		"webgl_loader_3ds",
 
 		"webgl_loader_3mf",
 
+		"webgl_loader_3mf_materials",
 
 		"webgl_loader_amf",
 
 		"webgl_loader_assimp",
 
 		"webgl_loader_assimp2json",
 
@@ -126,11 +126,13 @@ var files = {
 
 		"webgl_loader_sea3d_sound",
 
 		"webgl_loader_stl",
 
 		"webgl_loader_svg",
 
+		"webgl_loader_texture_basis",
 
 		"webgl_loader_texture_dds",
 
 		"webgl_loader_texture_exr",
 
 		"webgl_loader_texture_hdr",
 
 		"webgl_loader_texture_ktx",
 
 		"webgl_loader_texture_pvrtc",
 
+		"webgl_loader_texture_rgbm",
 
 		"webgl_loader_texture_tga",
 
 		"webgl_loader_ttf",
 
 		"webgl_loader_vrm",

+ 51 - 33
examples/index.html
View File 

@@ -2,30 +2,13 @@
 
 <html lang="en">
 
 	<head>
 
 		<meta charset="utf-8">
 
-		<title>three.js / examples</title>
 
+		<title>three.js examples</title>
 
 		<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
 
 		<link rel="shortcut icon" href="../files/favicon.ico" />
 
 		<link rel="stylesheet" type="text/css" href="../files/main.css">
 
 		<style>
 
 			#panel #content .link {
 
 				display: block;
 
-				text-decoration: none;
 
-				cursor: pointer;
 
-			}
 
-
 
-			#viewSrcButton {
 
-				position: fixed;
 
-				bottom: 20px;
 
-				right: 20px;
 
-				padding: 8px;
 
-				color: #fff;
 
-				background-color: #555;
 
-				opacity: 0.7;
 
-			}
 
-
 
-			#viewSrcButton:hover {
 
-				cursor: pointer;
 
-				opacity: 1;
 
 			}
 
 		</style>
 
 	</head>
 
@@ -34,25 +17,34 @@
 
 		<div id="panel">
 
 
 			<div id="header">
 
-
 
 				<h1><a href="http://threejs.org">three.js</a></h1>
 
 
-				<img id="expandButton" src="../files/ic_menu_black_24dp.svg">
 
-
 
 				<div id="sections">
 
-					<a href="../docs/">docs</a> <span class="selected">examples</span>
 
+					<a href="../docs/index.html#manual/introduction/Creating-a-scene">docs</a>
 
+					<span class="selected">examples</span>
 
 				</div>
 
 
-				<input type="text" id="filter" autocorrect="off" autocapitalize="off" spellcheck="false"/>
 
-
 
+				<div id="expandButton"></div>
 
 			</div>
 
 
-			<div id="content"></div>
 
+			<div id="panelScrim"></div>
 
+
 
+			<div id="contentWrapper">
 
+
 
+				<div id="inputWrapper">
 
+					<input placeholder="" type="text" id="filter" autocorrect="off" autocapitalize="off" spellcheck="false" />
 
+					<div id="exitSearchButton"></div>
 
+				</div>
 
+
 
+				<div id="content"></div>
 
+			</div>
 
 
 		</div>
 
 
 		<iframe id="viewer" name="viewer" allowfullscreen allowvr onmousewheel=""></iframe>
 
 
+		<a id="button" target="_blank"><img src="../files/ic_code_black_24dp.svg"></a>
 
+
 
 		<script src="files.js"></script>
 
 
 		<script>
 
@@ -70,13 +62,22 @@
 
 		var viewer = document.getElementById( 'viewer' );
 
 
 		var filterInput = document.getElementById( 'filter' );
 
+		var exitSearchButton = document.getElementById( 'exitSearchButton' );
 
 
 		var expandButton = document.getElementById( 'expandButton' );
 
 		expandButton.addEventListener( 'click', function ( event ) {
 
 			event.preventDefault();
 
-			panel.classList.toggle( 'collapsed' );
 
+			panel.classList.toggle( 'open' );
 
 		} );
 
 
+		var panelScrim = document.getElementById( 'panelScrim' );
 
+		panelScrim.onclick = function ( event ) {
 
+
 
+			event.preventDefault();
 
+			panel.classList.toggle( 'open' );
 
+
 
+		};
 
+
 
 		// iOS iframe auto-resize workaround
 
 
 		if ( /(iPad|iPhone|iPod)/g.test( navigator.userAgent ) ) {
 
@@ -90,12 +91,8 @@
 
 		var container = document.createElement( 'div' );
 
 		content.appendChild( container );
 
 
-		var viewSrcButton = document.createElement( 'a' );
 
-		viewSrcButton.id = 'viewSrcButton';
 
-		viewSrcButton.target = '_blank';
 
-		viewSrcButton.textContent = 'View source';
 
+		var viewSrcButton = document.getElementById( 'button' );
 
 		viewSrcButton.style.display = 'none';
 
-		document.body.appendChild( viewSrcButton );
 
 
 		var links = {};
 
 		var selected = null;
 
@@ -157,7 +154,7 @@
 
 			window.location.hash = file;
 
 			viewer.focus();
 
 
-			panel.classList.add( 'collapsed' );
 
+			panel.classList.remove( 'open' );
 
 
 			selected = file;
 
 
@@ -175,6 +172,27 @@
 
 		}
 
 
 		// filter
 
+		filterInput.onfocus = function ( event ) {
 
+
 
+			panel.classList.add('searchFocused');
 
+
 
+		}
 
+
 
+		filterInput.onblur = function ( event ) {
 
+
 
+			if(filterInput.value === '') {
 
+				panel.classList.remove('searchFocused');
 
+			}
 
+
 
+		}
 
+
 
+		exitSearchButton.onclick = function( event ) {
 
+
 
+			filterInput.value = '';
 
+			updateFilter();
 
+			panel.classList.remove('searchFocused');
 
+
 
+		}
 
 
 		filterInput.addEventListener( 'input', function( e ) {
 
 
@@ -238,7 +256,7 @@
 
 
 			var name = file.split( '_' );
 
 			name.shift();
 
-			return name.join( ' / ' );
 
+			return name.join( '<span class="spacer">/</span>' );
 
 
 		}

+ 0 - 71
examples/js/ImprovedNoise.js
View File 

@@ -1,71 +0,0 @@
 
-// http://mrl.nyu.edu/~perlin/noise/
 
-
 
-var ImprovedNoise = function () {
 
-
 
-	var p = [ 151,160,137,91,90,15,131,13,201,95,96,53,194,233,7,225,140,36,103,30,69,142,8,99,37,240,21,10,
 
-		 23,190,6,148,247,120,234,75,0,26,197,62,94,252,219,203,117,35,11,32,57,177,33,88,237,149,56,87,
 
-		 174,20,125,136,171,168,68,175,74,165,71,134,139,48,27,166,77,146,158,231,83,111,229,122,60,211,
 
-		 133,230,220,105,92,41,55,46,245,40,244,102,143,54,65,25,63,161,1,216,80,73,209,76,132,187,208,
 
-		 89,18,169,200,196,135,130,116,188,159,86,164,100,109,198,173,186,3,64,52,217,226,250,124,123,5,
 
-		 202,38,147,118,126,255,82,85,212,207,206,59,227,47,16,58,17,182,189,28,42,223,183,170,213,119,
 
-		 248,152,2,44,154,163,70,221,153,101,155,167,43,172,9,129,22,39,253,19,98,108,110,79,113,224,232,
 
-		 178,185,112,104,218,246,97,228,251,34,242,193,238,210,144,12,191,179,162,241,81,51,145,235,249,
 
-		 14,239,107,49,192,214,31,181,199,106,157,184,84,204,176,115,121,50,45,127,4,150,254,138,236,205,
 
-		 93,222,114,67,29,24,72,243,141,128,195,78,66,215,61,156,180 ];
 
-
 
-	for (var i = 0; i < 256 ; i ++) {
 
-
 
-		p[256 + i] = p[i];
 
-
 
-	}
 
-
 
-	function fade(t) {
 
-
 
-		return t * t * t * (t * (t * 6 - 15) + 10);
 
-
 
-	}
 
-
 
-	function lerp(t, a, b) {
 
-
 
-		return a + t * (b - a);
 
-
 
-	}
 
-
 
-	function grad(hash, x, y, z) {
 
-
 
-		var h = hash & 15;
 
-		var u = h < 8 ? x : y, v = h < 4 ? y : h == 12 || h == 14 ? x : z;
 
-		return ((h&1) == 0 ? u : -u) + ((h&2) == 0 ? v : -v);
 
-
 
-	}
 
-
 
-	return {
 
-
 
-		noise: function (x, y, z) {
 
-
 
-			var floorX = Math.floor(x), floorY = Math.floor(y), floorZ = Math.floor(z);
 
-
 
-			var X = floorX & 255, Y = floorY & 255, Z = floorZ & 255;
 
-
 
-			x -= floorX;
 
-			y -= floorY;
 
-			z -= floorZ;
 
-
 
-			var xMinus1 = x - 1, yMinus1 = y - 1, zMinus1 = z - 1;
 
-
 
-			var u = fade(x), v = fade(y), w = fade(z);
 
-
 
-			var A = p[X] + Y, AA = p[A] + Z, AB = p[A + 1] + Z, B = p[X + 1] + Y, BA = p[B] + Z, BB = p[B + 1] + Z;
 
-
 
-			return lerp(w, lerp(v, lerp(u, grad(p[AA], x, y, z),
 
-							grad(p[BA], xMinus1, y, z)),
 
-						lerp(u, grad(p[AB], x, yMinus1, z),
 
-							grad(p[BB], xMinus1, yMinus1, z))),
 
-					lerp(v, lerp(u, grad(p[AA + 1], x, y, zMinus1),
 
-							grad(p[BA + 1], xMinus1, y, z - 1)),
 
-						lerp(u, grad(p[AB + 1], x, yMinus1, zMinus1),
 
-							grad(p[BB + 1], xMinus1, yMinus1, zMinus1))));
 
-
 
-		}
 
-	}
 
-};

+ 0 - 23
examples/js/PRNG.js
View File 

@@ -1,23 +0,0 @@
 
-// Park-Miller-Carta Pseudo-Random Number Generator
 
-// https://github.com/pnitsch/BitmapData.js/blob/master/js/BitmapData.js
 
-
 
-var PRNG = function () {
 
-
 
-	this.seed = 1;
 
-	this.next = function() {
 
-
 
-		return ( this.gen() / 2147483647 );
 
-
 
-	};
 
-	this.nextRange = function( min, max )	{
 
-
 
-		return min + ( ( max - min ) * this.next() )
 
-
 
-	};
 
-	this.gen = function() {
 
-
 
-		return this.seed = ( this.seed * 16807 ) % 2147483647;
 
-
 
-	};
 
-
 
-};

+ 0 - 332
examples/js/ShaderGodRays.js
View File 

@@ -1,332 +0,0 @@
 
-/**
 
- * @author huwb / http://huwbowles.com/
 
- *
 
- * God-rays (crepuscular rays)
 
- *
 
- * Similar implementation to the one used by Crytek for CryEngine 2 [Sousa2008].
 
- * Blurs a mask generated from the depth map along radial lines emanating from the light
 
- * source. The blur repeatedly applies a blur filter of increasing support but constant
 
- * sample count to produce a blur filter with large support.
 
- *
 
- * My implementation performs 3 passes, similar to the implementation from Sousa. I found
 
- * just 6 samples per pass produced acceptible results. The blur is applied three times,
 
- * with decreasing filter support. The result is equivalent to a single pass with
 
- * 6*6*6 = 216 samples.
 
- *
 
- * References:
 
- *
 
- * Sousa2008 - Crysis Next Gen Effects, GDC2008, http://www.crytek.com/sites/default/files/GDC08_SousaT_CrysisEffects.ppt
 
- */
 
-
 
-THREE.ShaderGodRays = {
 
-
 
-	'godrays_depthMask': {
 
-
 
-		uniforms: {
 
-
 
-			tInput: {
 
-				value: null
 
-			}
 
-
 
-		},
 
-
 
-		vertexShader: [
 
-
 
-			"varying vec2 vUv;",
 
-
 
-			"void main() {",
 
-
 
-			" vUv = uv;",
 
-			" gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );",
 
-
 
-			"}"
 
-
 
-		].join( "\n" ),
 
-
 
-		fragmentShader: [
 
-
 
-			"varying vec2 vUv;",
 
-
 
-			"uniform sampler2D tInput;",
 
-
 
-			"void main() {",
 
-
 
-			"	gl_FragColor = vec4( 1.0 ) - texture2D( tInput, vUv );",
 
-
 
-
 
-			"}"
 
-
 
-		].join( "\n" )
 
-
 
-	},
 
-
 
-
 
-	/**
 
-	 * The god-ray generation shader.
 
-	 *
 
-	 * First pass:
 
-	 *
 
-	 * The depth map is blurred along radial lines towards the "sun". The
 
-	 * output is written to a temporary render target (I used a 1/4 sized
 
-	 * target).
 
-	 *
 
-	 * Pass two & three:
 
-	 *
 
-	 * The results of the previous pass are re-blurred, each time with a
 
-	 * decreased distance between samples.
 
-	 */
 
-
 
-	'godrays_generate': {
 
-
 
-		uniforms: {
 
-
 
-			tInput: {
 
-				value: null
 
-			},
 
-			fStepSize: {
 
-				value: 1.0
 
-			},
 
-			vSunPositionScreenSpace: {
 
-				value: new THREE.Vector2( 0.5, 0.5 )
 
-			}
 
-
 
-		},
 
-
 
-		vertexShader: [
 
-
 
-			"varying vec2 vUv;",
 
-
 
-			"void main() {",
 
-
 
-				"vUv = uv;",
 
-				"gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );",
 
-
 
-			"}"
 
-
 
-		].join( "\n" ),
 
-
 
-		fragmentShader: [
 
-
 
-			"#define TAPS_PER_PASS 6.0",
 
-
 
-			"varying vec2 vUv;",
 
-
 
-			"uniform sampler2D tInput;",
 
-
 
-			"uniform vec2 vSunPositionScreenSpace;",
 
-			"uniform float fStepSize;", // filter step size
 
-
 
-			"void main() {",
 
-
 
-				// delta from current pixel to "sun" position
 
-
 
-				"vec2 delta = vSunPositionScreenSpace - vUv;",
 
-				"float dist = length( delta );",
 
-
 
-				// Step vector (uv space)
 
-
 
-				"vec2 stepv = fStepSize * delta / dist;",
 
-
 
-				// Number of iterations between pixel and sun
 
-
 
-				"float iters = dist/fStepSize;",
 
-
 
-				"vec2 uv = vUv.xy;",
 
-				"float col = 0.0;",
 
-
 
-				// This breaks ANGLE in Chrome 22
 
-				//	- see http://code.google.com/p/chromium/issues/detail?id=153105
 
-
 
-				/*
 
-				// Unrolling didnt do much on my hardware (ATI Mobility Radeon 3450),
 
-				// so i've just left the loop
 
-
 
-				"for ( float i = 0.0; i < TAPS_PER_PASS; i += 1.0 ) {",
 
-
 
-					// Accumulate samples, making sure we dont walk past the light source.
 
-
 
-					// The check for uv.y < 1 would not be necessary with "border" UV wrap
 
-					// mode, with a black border color. I don't think this is currently
 
-					// exposed by three.js. As a result there might be artifacts when the
 
-					// sun is to the left, right or bottom of screen as these cases are
 
-					// not specifically handled.
 
-
 
-					"col += ( i <= iters && uv.y < 1.0 ? texture2D( tInput, uv ).r : 0.0 );",
 
-					"uv += stepv;",
 
-
 
-				"}",
 
-				*/
 
-
 
-				// Unrolling loop manually makes it work in ANGLE
 
-
 
-				"if ( 0.0 <= iters && uv.y < 1.0 ) col += texture2D( tInput, uv ).r;",
 
-				"uv += stepv;",
 
-
 
-				"if ( 1.0 <= iters && uv.y < 1.0 ) col += texture2D( tInput, uv ).r;",
 
-				"uv += stepv;",
 
-
 
-				"if ( 2.0 <= iters && uv.y < 1.0 ) col += texture2D( tInput, uv ).r;",
 
-				"uv += stepv;",
 
-
 
-				"if ( 3.0 <= iters && uv.y < 1.0 ) col += texture2D( tInput, uv ).r;",
 
-				"uv += stepv;",
 
-
 
-				"if ( 4.0 <= iters && uv.y < 1.0 ) col += texture2D( tInput, uv ).r;",
 
-				"uv += stepv;",
 
-
 
-				"if ( 5.0 <= iters && uv.y < 1.0 ) col += texture2D( tInput, uv ).r;",
 
-				"uv += stepv;",
 
-
 
-				// Should technically be dividing by 'iters', but 'TAPS_PER_PASS' smooths out
 
-				// objectionable artifacts, in particular near the sun position. The side
 
-				// effect is that the result is darker than it should be around the sun, as
 
-				// TAPS_PER_PASS is greater than the number of samples actually accumulated.
 
-				// When the result is inverted (in the shader 'godrays_combine', this produces
 
-				// a slight bright spot at the position of the sun, even when it is occluded.
 
-
 
-				"gl_FragColor = vec4( col/TAPS_PER_PASS );",
 
-				"gl_FragColor.a = 1.0;",
 
-
 
-			"}"
 
-
 
-		].join( "\n" )
 
-
 
-	},
 
-
 
-	/**
 
-	 * Additively applies god rays from texture tGodRays to a background (tColors).
 
-	 * fGodRayIntensity attenuates the god rays.
 
-	 */
 
-
 
-	'godrays_combine': {
 
-
 
-		uniforms: {
 
-
 
-			tColors: {
 
-				value: null
 
-			},
 
-
 
-			tGodRays: {
 
-				value: null
 
-			},
 
-
 
-			fGodRayIntensity: {
 
-				value: 0.69
 
-			},
 
-
 
-			vSunPositionScreenSpace: {
 
-				value: new THREE.Vector2( 0.5, 0.5 )
 
-			}
 
-
 
-		},
 
-
 
-		vertexShader: [
 
-
 
-			"varying vec2 vUv;",
 
-
 
-			"void main() {",
 
-
 
-				"vUv = uv;",
 
-				"gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );",
 
-
 
-			"}"
 
-
 
-			].join( "\n" ),
 
-
 
-		fragmentShader: [
 
-
 
-			"varying vec2 vUv;",
 
-
 
-			"uniform sampler2D tColors;",
 
-			"uniform sampler2D tGodRays;",
 
-
 
-			"uniform vec2 vSunPositionScreenSpace;",
 
-			"uniform float fGodRayIntensity;",
 
-
 
-			"void main() {",
 
-
 
-				// Since THREE.MeshDepthMaterial renders foreground objects white and background
 
-				// objects black, the god-rays will be white streaks. Therefore value is inverted
 
-				// before being combined with tColors
 
-
 
-				"gl_FragColor = texture2D( tColors, vUv ) + fGodRayIntensity * vec4( 1.0 - texture2D( tGodRays, vUv ).r );",
 
-				"gl_FragColor.a = 1.0;",
 
-
 
-			"}"
 
-
 
-		].join( "\n" )
 
-
 
-	},
 
-
 
-
 
-	/**
 
-	 * A dodgy sun/sky shader. Makes a bright spot at the sun location. Would be
 
-	 * cheaper/faster/simpler to implement this as a simple sun sprite.
 
-	 */
 
-
 
-	'godrays_fake_sun': {
 
-
 
-		uniforms: {
 
-
 
-			vSunPositionScreenSpace: {
 
-				value: new THREE.Vector2( 0.5, 0.5 )
 
-			},
 
-
 
-			fAspect: {
 
-				value: 1.0
 
-			},
 
-
 
-			sunColor: {
 
-				value: new THREE.Color( 0xffee00 )
 
-			},
 
-
 
-			bgColor: {
 
-				value: new THREE.Color( 0x000000 )
 
-			}
 
-
 
-		},
 
-
 
-		vertexShader: [
 
-
 
-			"varying vec2 vUv;",
 
-
 
-			"void main() {",
 
-
 
-				"vUv = uv;",
 
-				"gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );",
 
-
 
-			"}"
 
-
 
-		].join( "\n" ),
 
-
 
-		fragmentShader: [
 
-
 
-			"varying vec2 vUv;",
 
-
 
-			"uniform vec2 vSunPositionScreenSpace;",
 
-			"uniform float fAspect;",
 
-
 
-			"uniform vec3 sunColor;",
 
-			"uniform vec3 bgColor;",
 
-
 
-			"void main() {",
 
-
 
-				"vec2 diff = vUv - vSunPositionScreenSpace;",
 
-
 
-				// Correct for aspect ratio
 
-
 
-				"diff.x *= fAspect;",
 
-
 
-				"float prop = clamp( length( diff ) / 0.5, 0.0, 1.0 );",
 
-				"prop = 0.35 * pow( 1.0 - prop, 3.0 );",
 
-
 
-				"gl_FragColor.xyz = mix( sunColor, bgColor, 1.0 - prop );",
 
-				"gl_FragColor.w = 1.0;",
 
-
 
-			"}"
 
-
 
-		].join( "\n" )
 
-
 
-	}
 
-
 
-};

+ 0 - 694
examples/js/ShaderSkin.js
View File 

@@ -1,694 +0,0 @@
 
-/**
 
- * @author alteredq / http://alteredqualia.com/
 
- *
 
- */
 
-
 
-
 
-THREE.ShaderSkin = {
 
-
 
-	/* ------------------------------------------------------------------------------------------
 
-	//	Simple skin shader
 
-	//		- per-pixel Blinn-Phong diffuse term mixed with half-Lambert wrap-around term (per color component)
 
-	//		- physically based specular term (Kelemen/Szirmay-Kalos specular reflectance)
 
-	//
 
-	//		- diffuse map
 
-	//		- bump map
 
-	//		- specular map
 
-	//		- point, directional and hemisphere lights (use with "lights: true" material option)
 
-	//		- fog (use with "fog: true" material option)
 
-	//
 
-	// ------------------------------------------------------------------------------------------ */
 
-
 
-	'skinSimple' : {
 
-
 
-		uniforms: THREE.UniformsUtils.merge( [
 
-
 
-			THREE.UniformsLib[ "fog" ],
 
-			THREE.UniformsLib[ "lights" ],
 
-
 
-			{
 
-
 
-				"enableBump": { value: 0 },
 
-				"enableSpecular": { value: 0 },
 
-
 
-				"tDiffuse": { value: null },
 
-				"tBeckmann": { value: null },
 
-
 
-				"diffuse": { value: new THREE.Color( 0xeeeeee ) },
 
-				"specular": { value: new THREE.Color( 0x111111 ) },
 
-				"opacity": { value: 1 },
 
-
 
-				"uRoughness": { value: 0.15 },
 
-				"uSpecularBrightness": { value: 0.75 },
 
-
 
-				"bumpMap": { value: null },
 
-				"bumpScale": { value: 1 },
 
-
 
-				"specularMap": { value: null },
 
-
 
-				"offsetRepeat": { value: new THREE.Vector4( 0, 0, 1, 1 ) },
 
-
 
-				"uWrapRGB": { value: new THREE.Vector3( 0.75, 0.375, 0.1875 ) }
 
-
 
-			}
 
-
 
-		] ),
 
-
 
-		fragmentShader: [
 
-
 
-			"#define USE_BUMPMAP",
 
-
 
-			"uniform bool enableBump;",
 
-			"uniform bool enableSpecular;",
 
-
 
-			"uniform vec3 diffuse;",
 
-			"uniform vec3 specular;",
 
-			"uniform float opacity;",
 
-
 
-			"uniform float uRoughness;",
 
-			"uniform float uSpecularBrightness;",
 
-
 
-			"uniform vec3 uWrapRGB;",
 
-
 
-			"uniform sampler2D tDiffuse;",
 
-			"uniform sampler2D tBeckmann;",
 
-
 
-			"uniform sampler2D specularMap;",
 
-
 
-			"varying vec3 vNormal;",
 
-			"varying vec2 vUv;",
 
-
 
-			"varying vec3 vViewPosition;",
 
-
 
-			THREE.ShaderChunk[ "common" ],
 
-			THREE.ShaderChunk[ "bsdfs" ],
 
-			THREE.ShaderChunk[ "packing" ],
 
-			THREE.ShaderChunk[ "lights_pars_begin" ],
 
-			THREE.ShaderChunk[ "fog_pars_fragment" ],
 
-			THREE.ShaderChunk[ "bumpmap_pars_fragment" ],
 
-
 
-			// Fresnel term
 
-
 
-			"float fresnelReflectance( vec3 H, vec3 V, float F0 ) {",
 
-
 
-				"float base = 1.0 - dot( V, H );",
 
-				"float exponential = pow( base, 5.0 );",
 
-
 
-				"return exponential + F0 * ( 1.0 - exponential );",
 
-
 
-			"}",
 
-
 
-			// Kelemen/Szirmay-Kalos specular BRDF
 
-
 
-			"float KS_Skin_Specular( vec3 N,", 		// Bumped surface normal
 
-									"vec3 L,", 		// Points to light
 
-									"vec3 V,", 		// Points to eye
 
-									"float m,",  	// Roughness
 
-									"float rho_s", 	// Specular brightness
 
-									") {",
 
-
 
-				"float result = 0.0;",
 
-				"float ndotl = dot( N, L );",
 
-
 
-				"if( ndotl > 0.0 ) {",
 
-
 
-					"vec3 h = L + V;", // Unnormalized half-way vector
 
-					"vec3 H = normalize( h );",
 
-
 
-					"float ndoth = dot( N, H );",
 
-
 
-					"float PH = pow( 2.0 * texture2D( tBeckmann, vec2( ndoth, m ) ).x, 10.0 );",
 
-
 
-					"float F = fresnelReflectance( H, V, 0.028 );",
 
-					"float frSpec = max( PH * F / dot( h, h ), 0.0 );",
 
-
 
-					"result = ndotl * rho_s * frSpec;", // BRDF * dot(N,L) * rho_s
 
-
 
-				"}",
 
-
 
-				"return result;",
 
-
 
-			"}",
 
-
 
-			"void main() {",
 
-
 
-				"vec3 outgoingLight = vec3( 0.0 );",	// outgoing light does not have an alpha, the surface does
 
-				"vec4 diffuseColor = vec4( diffuse, opacity );",
 
-
 
-				"vec4 colDiffuse = texture2D( tDiffuse, vUv );",
 
-				"colDiffuse.rgb *= colDiffuse.rgb;",
 
-
 
-				"diffuseColor = diffuseColor * colDiffuse;",
 
-
 
-				"vec3 normal = normalize( vNormal );",
 
-				"vec3 viewerDirection = normalize( vViewPosition );",
 
-
 
-				"float specularStrength;",
 
-
 
-				"if ( enableSpecular ) {",
 
-
 
-					"vec4 texelSpecular = texture2D( specularMap, vUv );",
 
-					"specularStrength = texelSpecular.r;",
 
-
 
-				"} else {",
 
-
 
-					"specularStrength = 1.0;",
 
-
 
-				"}",
 
-
 
-				"#ifdef USE_BUMPMAP",
 
-
 
-					"if ( enableBump ) normal = perturbNormalArb( -vViewPosition, normal, dHdxy_fwd() );",
 
-
 
-				"#endif",
 
-
 
-				// point lights
 
-
 
-				"vec3 totalSpecularLight = vec3( 0.0 );",
 
-				"vec3 totalDiffuseLight = vec3( 0.0 );",
 
-
 
-				"#if NUM_POINT_LIGHTS > 0",
 
-
 
-					"for ( int i = 0; i < NUM_POINT_LIGHTS; i ++ ) {",
 
-
 
-						"vec3 lVector = pointLights[ i ].position + vViewPosition.xyz;",
 
-
 
-						"float attenuation = calcLightAttenuation( length( lVector ), pointLights[ i ].distance, pointLights[ i ].decay );",
 
-
 
-						"lVector = normalize( lVector );",
 
-
 
-						"float pointDiffuseWeightFull = max( dot( normal, lVector ), 0.0 );",
 
-						"float pointDiffuseWeightHalf = max( 0.5 * dot( normal, lVector ) + 0.5, 0.0 );",
 
-						"vec3 pointDiffuseWeight = mix( vec3 ( pointDiffuseWeightFull ), vec3( pointDiffuseWeightHalf ), uWrapRGB );",
 
-
 
-						"float pointSpecularWeight = KS_Skin_Specular( normal, lVector, viewerDirection, uRoughness, uSpecularBrightness );",
 
-
 
-						"totalDiffuseLight += pointLight[ i ].color * ( pointDiffuseWeight * attenuation );",
 
-						"totalSpecularLight += pointLight[ i ].color * specular * ( pointSpecularWeight * specularStrength * attenuation );",
 
-
 
-					"}",
 
-
 
-				"#endif",
 
-
 
-				// directional lights
 
-
 
-				"#if NUM_DIR_LIGHTS > 0",
 
-
 
-					"for( int i = 0; i < NUM_DIR_LIGHTS; i++ ) {",
 
-
 
-						"vec3 dirVector = directionalLights[ i ].direction;",
 
-
 
-						"float dirDiffuseWeightFull = max( dot( normal, dirVector ), 0.0 );",
 
-						"float dirDiffuseWeightHalf = max( 0.5 * dot( normal, dirVector ) + 0.5, 0.0 );",
 
-						"vec3 dirDiffuseWeight = mix( vec3 ( dirDiffuseWeightFull ), vec3( dirDiffuseWeightHalf ), uWrapRGB );",
 
-
 
-						"float dirSpecularWeight = KS_Skin_Specular( normal, dirVector, viewerDirection, uRoughness, uSpecularBrightness );",
 
-
 
-						"totalDiffuseLight += directionalLights[ i ].color * dirDiffuseWeight;",
 
-						"totalSpecularLight += directionalLights[ i ].color * ( dirSpecularWeight * specularStrength );",
 
-
 
-					"}",
 
-
 
-				"#endif",
 
-
 
-				// hemisphere lights
 
-
 
-				"#if NUM_HEMI_LIGHTS > 0",
 
-
 
-					"for ( int i = 0; i < NUM_HEMI_LIGHTS; i ++ ) {",
 
-
 
-						"vec3 lVector = hemisphereLightDirection[ i ];",
 
-
 
-						"float dotProduct = dot( normal, lVector );",
 
-						"float hemiDiffuseWeight = 0.5 * dotProduct + 0.5;",
 
-
 
-						"totalDiffuseLight += mix( hemisphereLightGroundColor[ i ], hemisphereLightSkyColor[ i ], hemiDiffuseWeight );",
 
-
 
-						// specular (sky light)
 
-
 
-						"float hemiSpecularWeight = 0.0;",
 
-						"hemiSpecularWeight += KS_Skin_Specular( normal, lVector, viewerDirection, uRoughness, uSpecularBrightness );",
 
-
 
-						// specular (ground light)
 
-
 
-						"vec3 lVectorGround = -lVector;",
 
-						"hemiSpecularWeight += KS_Skin_Specular( normal, lVectorGround, viewerDirection, uRoughness, uSpecularBrightness );",
 
-
 
-						"vec3 hemiSpecularColor = mix( hemisphereLightGroundColor[ i ], hemisphereLightSkyColor[ i ], hemiDiffuseWeight );",
 
-
 
-						"totalSpecularLight += hemiSpecularColor * specular * ( hemiSpecularWeight * specularStrength );",
 
-
 
-					"}",
 
-
 
-				"#endif",
 
-
 
-				"outgoingLight += diffuseColor.xyz * ( totalDiffuseLight + ambientLightColor * diffuse ) + totalSpecularLight;",
 
-
 
-				"gl_FragColor = linearToOutputTexel( vec4( outgoingLight, diffuseColor.a ) );",	// TODO, this should be pre-multiplied to allow for bright highlights on very transparent objects
 
-
 
-				THREE.ShaderChunk[ "fog_fragment" ],
 
-
 
-			"}"
 
-
 
-		].join( "\n" ),
 
-
 
-		vertexShader: [
 
-
 
-			"uniform vec4 offsetRepeat;",
 
-
 
-			"varying vec3 vNormal;",
 
-			"varying vec2 vUv;",
 
-
 
-			"varying vec3 vViewPosition;",
 
-
 
-			THREE.ShaderChunk[ "common" ],
 
-			THREE.ShaderChunk[ "lights_pars_begin" ],
 
-			THREE.ShaderChunk[ "fog_pars_vertex" ],
 
-
 
-			"void main() {",
 
-
 
-				"vec4 mvPosition = modelViewMatrix * vec4( position, 1.0 );",
 
-				"vec4 worldPosition = modelMatrix * vec4( position, 1.0 );",
 
-
 
-				"vViewPosition = -mvPosition.xyz;",
 
-
 
-				"vNormal = normalize( normalMatrix * normal );",
 
-
 
-				"vUv = uv * offsetRepeat.zw + offsetRepeat.xy;",
 
-
 
-				"gl_Position = projectionMatrix * mvPosition;",
 
-
 
-				THREE.ShaderChunk[ "fog_vertex" ],
 
-
 
-			"}"
 
-
 
-		].join( "\n" )
 
-
 
-	},
 
-
 
-	/* ------------------------------------------------------------------------------------------
 
-	//	Skin shader
 
-	//		- Blinn-Phong diffuse term (using normal + diffuse maps)
 
-	//		- subsurface scattering approximation by four blur layers
 
-	//		- physically based specular term (Kelemen/Szirmay-Kalos specular reflectance)
 
-	//
 
-	//		- point and directional lights (use with "lights: true" material option)
 
-	//
 
-	//		- based on Nvidia Advanced Skin Rendering GDC 2007 presentation
 
-	//		  and GPU Gems 3 Chapter 14. Advanced Techniques for Realistic Real-Time Skin Rendering
 
-	//
 
-	//			http://developer.download.nvidia.com/presentations/2007/gdc/Advanced_Skin.pdf
 
-	//			http://http.developer.nvidia.com/GPUGems3/gpugems3_ch14.html
 
-	// ------------------------------------------------------------------------------------------ */
 
-
 
-	'skin' : {
 
-
 
-		uniforms: THREE.UniformsUtils.merge( [
 
-
 
-			THREE.UniformsLib[ "fog" ],
 
-			THREE.UniformsLib[ "lights" ],
 
-
 
-			{
 
-
 
-				"passID": { value: 0 },
 
-
 
-				"tDiffuse"	: { value: null },
 
-				"tNormal"	: { value: null },
 
-
 
-				"tBlur1"	: { value: null },
 
-				"tBlur2"	: { value: null },
 
-				"tBlur3"	: { value: null },
 
-				"tBlur4"	: { value: null },
 
-
 
-				"tBeckmann"	: { value: null },
 
-
 
-				"uNormalScale": { value: 1.0 },
 
-
 
-				"diffuse":  { value: new THREE.Color( 0xeeeeee ) },
 
-				"specular": { value: new THREE.Color( 0x111111 ) },
 
-				"opacity": 	  { value: 1 },
 
-
 
-				"uRoughness": 	  		{ value: 0.15 },
 
-				"uSpecularBrightness": 	{ value: 0.75 }
 
-
 
-			}
 
-
 
-		] ),
 
-
 
-		fragmentShader: [
 
-
 
-			"uniform vec3 diffuse;",
 
-			"uniform vec3 specular;",
 
-			"uniform float opacity;",
 
-
 
-			"uniform float uRoughness;",
 
-			"uniform float uSpecularBrightness;",
 
-
 
-			"uniform int passID;",
 
-
 
-			"uniform sampler2D tDiffuse;",
 
-			"uniform sampler2D tNormal;",
 
-
 
-			"uniform sampler2D tBlur1;",
 
-			"uniform sampler2D tBlur2;",
 
-			"uniform sampler2D tBlur3;",
 
-			"uniform sampler2D tBlur4;",
 
-
 
-			"uniform sampler2D tBeckmann;",
 
-
 
-			"uniform float uNormalScale;",
 
-
 
-			"varying vec3 vNormal;",
 
-			"varying vec2 vUv;",
 
-
 
-			"varying vec3 vViewPosition;",
 
-
 
-			THREE.ShaderChunk[ "common" ],
 
-			THREE.ShaderChunk[ "lights_pars_begin" ],
 
-			THREE.ShaderChunk[ "fog_pars_fragment" ],
 
-
 
-			"float fresnelReflectance( vec3 H, vec3 V, float F0 ) {",
 
-
 
-				"float base = 1.0 - dot( V, H );",
 
-				"float exponential = pow( base, 5.0 );",
 
-
 
-				"return exponential + F0 * ( 1.0 - exponential );",
 
-
 
-			"}",
 
-
 
-			// Kelemen/Szirmay-Kalos specular BRDF
 
-
 
-			"float KS_Skin_Specular( vec3 N,", 		// Bumped surface normal
 
-									"vec3 L,", 		// Points to light
 
-									"vec3 V,", 		// Points to eye
 
-									"float m,",  	// Roughness
 
-									"float rho_s", 	// Specular brightness
 
-									") {",
 
-
 
-				"float result = 0.0;",
 
-				"float ndotl = dot( N, L );",
 
-
 
-				"if( ndotl > 0.0 ) {",
 
-
 
-					"vec3 h = L + V;", // Unnormalized half-way vector
 
-					"vec3 H = normalize( h );",
 
-
 
-					"float ndoth = dot( N, H );",
 
-
 
-					"float PH = pow( 2.0 * texture2D( tBeckmann, vec2( ndoth, m ) ).x, 10.0 );",
 
-					"float F = fresnelReflectance( H, V, 0.028 );",
 
-					"float frSpec = max( PH * F / dot( h, h ), 0.0 );",
 
-
 
-					"result = ndotl * rho_s * frSpec;", // BRDF * dot(N,L) * rho_s
 
-
 
-				"}",
 
-
 
-				"return result;",
 
-
 
-			"}",
 
-
 
-			"void main() {",
 
-
 
-				"vec3 outgoingLight = vec3( 0.0 );",	// outgoing light does not have an alpha, the surface does
 
-				"vec4 diffuseColor = vec4( diffuse, opacity );",
 
-
 
-				"vec4 mSpecular = vec4( specular, opacity );",
 
-
 
-				"vec4 colDiffuse = texture2D( tDiffuse, vUv );",
 
-				"colDiffuse *= colDiffuse;",
 
-
 
-				"diffuseColor *= colDiffuse;",
 
-
 
-				// normal mapping
 
-
 
-				"vec4 posAndU = vec4( -vViewPosition, vUv.x );",
 
-				"vec4 posAndU_dx = dFdx( posAndU ),  posAndU_dy = dFdy( posAndU );",
 
-				"vec3 tangent = posAndU_dx.w * posAndU_dx.xyz + posAndU_dy.w * posAndU_dy.xyz;",
 
-				"vec3 normal = normalize( vNormal );",
 
-				"vec3 binormal = normalize( cross( tangent, normal ) );",
 
-				"tangent = cross( normal, binormal );",	// no normalization required
 
-				"mat3 tsb = mat3( tangent, binormal, normal );",
 
-
 
-				"vec3 normalTex = texture2D( tNormal, vUv ).xyz * 2.0 - 1.0;",
 
-				"normalTex.xy *= uNormalScale;",
 
-				"normalTex = normalize( normalTex );",
 
-
 
-				"vec3 finalNormal = tsb * normalTex;",
 
-				"normal = normalize( finalNormal );",
 
-
 
-				"vec3 viewerDirection = normalize( vViewPosition );",
 
-
 
-				// point lights
 
-
 
-				"vec3 totalDiffuseLight = vec3( 0.0 );",
 
-				"vec3 totalSpecularLight = vec3( 0.0 );",
 
-
 
-				"#if NUM_POINT_LIGHTS > 0",
 
-
 
-					"for ( int i = 0; i < NUM_POINT_LIGHTS; i ++ ) {",
 
-
 
-						"vec3 pointVector = normalize( pointLights[ i ].direction );",
 
-						"float attenuation = calcLightAttenuation( length( lVector ), pointLights[ i ].distance, pointLights[ i ].decay );",
 
-
 
-						"float pointDiffuseWeight = max( dot( normal, pointVector ), 0.0 );",
 
-
 
-						"totalDiffuseLight += pointLightColor[ i ] * ( pointDiffuseWeight * attenuation );",
 
-
 
-						"if ( passID == 1 ) {",
 
-
 
-							"float pointSpecularWeight = KS_Skin_Specular( normal, pointVector, viewerDirection, uRoughness, uSpecularBrightness );",
 
-
 
-							"totalSpecularLight += pointLightColor[ i ] * mSpecular.xyz * ( pointSpecularWeight * attenuation );",
 
-
 
-						"}",
 
-
 
-					"}",
 
-
 
-				"#endif",
 
-
 
-				// directional lights
 
-
 
-				"#if NUM_DIR_LIGHTS > 0",
 
-
 
-					"for( int i = 0; i < NUM_DIR_LIGHTS; i++ ) {",
 
-
 
-						"vec3 dirVector = directionalLights[ i ].direction;",
 
-
 
-						"float dirDiffuseWeight = max( dot( normal, dirVector ), 0.0 );",
 
-
 
-
 
-						"totalDiffuseLight += directionalLights[ i ].color * dirDiffuseWeight;",
 
-
 
-						"if ( passID == 1 ) {",
 
-
 
-							"float dirSpecularWeight = KS_Skin_Specular( normal, dirVector, viewerDirection, uRoughness, uSpecularBrightness );",
 
-
 
-							"totalSpecularLight += directionalLights[ i ].color * mSpecular.xyz * dirSpecularWeight;",
 
-
 
-						"}",
 
-
 
-					"}",
 
-
 
-				"#endif",
 
-
 
-
 
-				"outgoingLight += diffuseColor.rgb * ( totalDiffuseLight + totalSpecularLight );",
 
-
 
-				"if ( passID == 0 ) {",
 
-
 
-					"outgoingLight = sqrt( outgoingLight );",
 
-
 
-				"} else if ( passID == 1 ) {",
 
-
 
-					//"#define VERSION1",
 
-
 
-					"#ifdef VERSION1",
 
-
 
-						"vec3 nonblurColor = sqrt(outgoingLight );",
 
-
 
-					"#else",
 
-
 
-						"vec3 nonblurColor = outgoingLight;",
 
-
 
-					"#endif",
 
-
 
-					"vec3 blur1Color = texture2D( tBlur1, vUv ).xyz;",
 
-					"vec3 blur2Color = texture2D( tBlur2, vUv ).xyz;",
 
-					"vec3 blur3Color = texture2D( tBlur3, vUv ).xyz;",
 
-					"vec3 blur4Color = texture2D( tBlur4, vUv ).xyz;",
 
-
 
-
 
-					//"gl_FragColor = vec4( blur1Color, gl_FragColor.w );",
 
-
 
-					//"gl_FragColor = vec4( vec3( 0.22, 0.5, 0.7 ) * nonblurColor + vec3( 0.2, 0.5, 0.3 ) * blur1Color + vec3( 0.58, 0.0, 0.0 ) * blur2Color, gl_FragColor.w );",
 
-
 
-					//"gl_FragColor = vec4( vec3( 0.25, 0.6, 0.8 ) * nonblurColor + vec3( 0.15, 0.25, 0.2 ) * blur1Color + vec3( 0.15, 0.15, 0.0 ) * blur2Color + vec3( 0.45, 0.0, 0.0 ) * blur3Color, gl_FragColor.w );",
 
-
 
-
 
-					"outgoingLight = vec3( vec3( 0.22,  0.437, 0.635 ) * nonblurColor + ",
 
-										 "vec3( 0.101, 0.355, 0.365 ) * blur1Color + ",
 
-										 "vec3( 0.119, 0.208, 0.0 )   * blur2Color + ",
 
-										 "vec3( 0.114, 0.0,   0.0 )   * blur3Color + ",
 
-										 "vec3( 0.444, 0.0,   0.0 )   * blur4Color );",
 
-
 
-					"outgoingLight *= sqrt( colDiffuse.xyz );",
 
-
 
-					"outgoingLight += ambientLightColor * diffuse * colDiffuse.xyz + totalSpecularLight;",
 
-
 
-					"#ifndef VERSION1",
 
-
 
-						"outgoingLight = sqrt( outgoingLight );",
 
-
 
-					"#endif",
 
-
 
-				"}",
 
-
 
-				"gl_FragColor = vec4( outgoingLight, diffuseColor.a );",	// TODO, this should be pre-multiplied to allow for bright highlights on very transparent objects
 
-
 
-				THREE.ShaderChunk[ "fog_fragment" ],
 
-
 
-			"}"
 
-
 
-		].join( "\n" ),
 
-
 
-		vertexShader: [
 
-
 
-			"#ifdef VERTEX_TEXTURES",
 
-
 
-				"uniform sampler2D tDisplacement;",
 
-				"uniform float uDisplacementScale;",
 
-				"uniform float uDisplacementBias;",
 
-
 
-			"#endif",
 
-
 
-			"varying vec3 vNormal;",
 
-			"varying vec2 vUv;",
 
-
 
-			"varying vec3 vViewPosition;",
 
-
 
-			THREE.ShaderChunk[ "common" ],
 
-			THREE.ShaderChunk[ "fog_pars_vertex" ],
 
-
 
-			"void main() {",
 
-
 
-				"vec4 worldPosition = modelMatrix * vec4( position, 1.0 );",
 
-
 
-				"vec4 mvPosition = modelViewMatrix * vec4( position, 1.0 );",
 
-
 
-				"vViewPosition = -mvPosition.xyz;",
 
-
 
-				"vNormal = normalize( normalMatrix * normal );",
 
-
 
-				"vUv = uv;",
 
-
 
-				// displacement mapping
 
-
 
-				"#ifdef VERTEX_TEXTURES",
 
-
 
-					"vec3 dv = texture2D( tDisplacement, uv ).xyz;",
 
-					"float df = uDisplacementScale * dv.x + uDisplacementBias;",
 
-					"vec4 displacedPosition = vec4( vNormal.xyz * df, 0.0 ) + mvPosition;",
 
-					"gl_Position = projectionMatrix * displacedPosition;",
 
-
 
-				"#else",
 
-
 
-					"gl_Position = projectionMatrix * mvPosition;",
 
-
 
-				"#endif",
 
-
 
-				THREE.ShaderChunk[ "fog_vertex" ],
 
-
 
-			"}",
 
-
 
-
 
-		].join( "\n" ),
 
-
 
-		vertexShaderUV: [
 
-
 
-			"varying vec3 vNormal;",
 
-			"varying vec2 vUv;",
 
-
 
-			"varying vec3 vViewPosition;",
 
-
 
-			THREE.ShaderChunk[ "common" ],
 
-
 
-			"void main() {",
 
-
 
-				"vec4 worldPosition = modelMatrix * vec4( position, 1.0 );",
 
-
 
-				"vec4 mvPosition = modelViewMatrix * vec4( position, 1.0 );",
 
-
 
-				"vViewPosition = -mvPosition.xyz;",
 
-
 
-				"vNormal = normalize( normalMatrix * normal );",
 
-
 
-				"vUv = uv;",
 
-
 
-				"gl_Position = vec4( uv.x * 2.0 - 1.0, uv.y * 2.0 - 1.0, 0.0, 1.0 );",
 
-
 
-			"}"
 
-
 
-		].join( "\n" )
 
-
 
-	},
 
-
 
-	/* ------------------------------------------------------------------------------------------
 
-	// Beckmann distribution function
 
-	//	- to be used in specular term of skin shader
 
-	//	- render a screen-aligned quad to precompute a 512 x 512 texture
 
-	//
 
-	//		- from http://developer.nvidia.com/node/171
 
-	 ------------------------------------------------------------------------------------------ */
 
-
 
-	"beckmann" : {
 
-
 
-		uniforms: {},
 
-
 
-		vertexShader: [
 
-
 
-			"varying vec2 vUv;",
 
-
 
-			"void main() {",
 
-
 
-				"vUv = uv;",
 
-				"gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );",
 
-
 
-			"}"
 
-
 
-		].join( "\n" ),
 
-
 
-		fragmentShader: [
 
-
 
-			"varying vec2 vUv;",
 
-
 
-			"float PHBeckmann( float ndoth, float m ) {",
 
-
 
-				"float alpha = acos( ndoth );",
 
-				"float ta = tan( alpha );",
 
-
 
-				"float val = 1.0 / ( m * m * pow( ndoth, 4.0 ) ) * exp( -( ta * ta ) / ( m * m ) );",
 
-				"return val;",
 
-
 
-			"}",
 
-
 
-			"float KSTextureCompute( vec2 tex ) {",
 
-
 
-				// Scale the value to fit within [0,1]  invert upon lookup.
 
-
 
-				"return 0.5 * pow( PHBeckmann( tex.x, tex.y ), 0.1 );",
 
-
 
-			"}",
 
-
 
-			"void main() {",
 
-
 
-				"float x = KSTextureCompute( vUv );",
 
-
 
-				"gl_FragColor = vec4( x, x, x, 1.0 );",
 
-
 
-			"}"
 
-
 
-		].join( "\n" )
 
-
 
-	}
 
-
 
-};

+ 0 - 324
examples/js/ShaderTerrain.js
View File 

@@ -1,324 +0,0 @@
 
-/**
 
- * @author alteredq / http://alteredqualia.com/
 
- *
 
- */
 
-
 
-THREE.ShaderTerrain = {
 
-
 
-	/* -------------------------------------------------------------------------
 
-	//	Dynamic terrain shader
 
-	//		- Blinn-Phong
 
-	//		- height + normal + diffuse1 + diffuse2 + specular + detail maps
 
-	//		- point, directional and hemisphere lights (use with "lights: true" material option)
 
-	//		- shadow maps receiving
 
-	 ------------------------------------------------------------------------- */
 
-
 
-	'terrain' : {
 
-
 
-		uniforms: THREE.UniformsUtils.merge( [
 
-
 
-			THREE.UniformsLib[ "fog" ],
 
-			THREE.UniformsLib[ "lights" ],
 
-
 
-			{
 
-
 
-				"enableDiffuse1": { value: 0 },
 
-				"enableDiffuse2": { value: 0 },
 
-				"enableSpecular": { value: 0 },
 
-				"enableReflection": { value: 0 },
 
-
 
-				"tDiffuse1": { value: null },
 
-				"tDiffuse2": { value: null },
 
-				"tDetail": { value: null },
 
-				"tNormal": { value: null },
 
-				"tSpecular": { value: null },
 
-				"tDisplacement": { value: null },
 
-
 
-				"uNormalScale": { value: 1.0 },
 
-
 
-				"uDisplacementBias": { value: 0.0 },
 
-				"uDisplacementScale": { value: 1.0 },
 
-
 
-				"diffuse": { value: new THREE.Color( 0xeeeeee ) },
 
-				"specular": { value: new THREE.Color( 0x111111 ) },
 
-				"shininess": { value: 30 },
 
-				"opacity": { value: 1 },
 
-
 
-				"uRepeatBase": { value: new THREE.Vector2( 1, 1 ) },
 
-				"uRepeatOverlay": { value: new THREE.Vector2( 1, 1 ) },
 
-
 
-				"uOffset": { value: new THREE.Vector2( 0, 0 ) }
 
-
 
-			}
 
-
 
-		] ),
 
-
 
-		fragmentShader: [
 
-
 
-			"uniform vec3 diffuse;",
 
-			"uniform vec3 specular;",
 
-			"uniform float shininess;",
 
-			"uniform float opacity;",
 
-
 
-			"uniform bool enableDiffuse1;",
 
-			"uniform bool enableDiffuse2;",
 
-			"uniform bool enableSpecular;",
 
-
 
-			"uniform sampler2D tDiffuse1;",
 
-			"uniform sampler2D tDiffuse2;",
 
-			"uniform sampler2D tDetail;",
 
-			"uniform sampler2D tNormal;",
 
-			"uniform sampler2D tSpecular;",
 
-			"uniform sampler2D tDisplacement;",
 
-
 
-			"uniform float uNormalScale;",
 
-
 
-			"uniform vec2 uRepeatOverlay;",
 
-			"uniform vec2 uRepeatBase;",
 
-
 
-			"uniform vec2 uOffset;",
 
-
 
-			"varying vec3 vTangent;",
 
-			"varying vec3 vBinormal;",
 
-			"varying vec3 vNormal;",
 
-			"varying vec2 vUv;",
 
-
 
-			"varying vec3 vViewPosition;",
 
-
 
-			THREE.ShaderChunk[ "common" ],
 
-			THREE.ShaderChunk[ "bsdfs" ],
 
-			THREE.ShaderChunk[ "lights_pars_begin" ],
 
-			THREE.ShaderChunk[ "shadowmap_pars_fragment" ],
 
-			THREE.ShaderChunk[ "fog_pars_fragment" ],
 
-
 
-			"float calcLightAttenuation( float lightDistance, float cutoffDistance, float decayExponent ) {",
 
- 				"if ( decayExponent > 0.0 ) {",
 
- 					"return pow( saturate( - lightDistance / cutoffDistance + 1.0 ), decayExponent );",
 
- 				"}",
 
- 				"return 1.0;",
 
- 			"}",
 
-
 
-			"void main() {",
 
-
 
-				"vec3 outgoingLight = vec3( 0.0 );",	// outgoing light does not have an alpha, the surface does
 
-				"vec4 diffuseColor = vec4( diffuse, opacity );",
 
-
 
-				"vec3 specularTex = vec3( 1.0 );",
 
-
 
-				"vec2 uvOverlay = uRepeatOverlay * vUv + uOffset;",
 
-				"vec2 uvBase = uRepeatBase * vUv;",
 
-
 
-				"vec3 normalTex = texture2D( tDetail, uvOverlay ).xyz * 2.0 - 1.0;",
 
-				"normalTex.xy *= uNormalScale;",
 
-				"normalTex = normalize( normalTex );",
 
-
 
-				"if( enableDiffuse1 && enableDiffuse2 ) {",
 
-
 
-					"vec4 colDiffuse1 = texture2D( tDiffuse1, uvOverlay );",
 
-					"vec4 colDiffuse2 = texture2D( tDiffuse2, uvOverlay );",
 
-
 
-					"colDiffuse1 = GammaToLinear( colDiffuse1, float( GAMMA_FACTOR ) );",
 
-					"colDiffuse2 = GammaToLinear( colDiffuse2, float( GAMMA_FACTOR ) );",
 
-
 
-					"diffuseColor *= mix ( colDiffuse1, colDiffuse2, 1.0 - texture2D( tDisplacement, uvBase ) );",
 
-
 
-				" } else if( enableDiffuse1 ) {",
 
-
 
-					"diffuseColor *= texture2D( tDiffuse1, uvOverlay );",
 
-
 
-				"} else if( enableDiffuse2 ) {",
 
-
 
-					"diffuseColor *= texture2D( tDiffuse2, uvOverlay );",
 
-
 
-				"}",
 
-
 
-				"if( enableSpecular )",
 
-					"specularTex = texture2D( tSpecular, uvOverlay ).xyz;",
 
-
 
-				"mat3 tsb = mat3( vTangent, vBinormal, vNormal );",
 
-				"vec3 finalNormal = tsb * normalTex;",
 
-
 
-				"vec3 normal = normalize( finalNormal );",
 
-				"vec3 viewPosition = normalize( vViewPosition );",
 
-
 
-				"vec3 totalDiffuseLight = vec3( 0.0 );",
 
-				"vec3 totalSpecularLight = vec3( 0.0 );",
 
-
 
-				// point lights
 
-
 
-				"#if NUM_POINT_LIGHTS > 0",
 
-
 
-					"for ( int i = 0; i < NUM_POINT_LIGHTS; i ++ ) {",
 
-
 
-						"vec3 lVector = pointLights[ i ].position + vViewPosition.xyz;",
 
-
 
-						"float attenuation = calcLightAttenuation( length( lVector ), pointLights[ i ].distance, pointLights[ i ].decay );",
 
-
 
-						"lVector = normalize( lVector );",
 
-
 
-						"vec3 pointHalfVector = normalize( lVector + viewPosition );",
 
-
 
-						"float pointDotNormalHalf = max( dot( normal, pointHalfVector ), 0.0 );",
 
-						"float pointDiffuseWeight = max( dot( normal, lVector ), 0.0 );",
 
-
 
-						"float pointSpecularWeight = specularTex.r * max( pow( pointDotNormalHalf, shininess ), 0.0 );",
 
-
 
-						"totalDiffuseLight += attenuation * pointLights[ i ].color * pointDiffuseWeight;",
 
-						"totalSpecularLight += attenuation * pointLights[ i ].color * specular * pointSpecularWeight * pointDiffuseWeight;",
 
-
 
-					"}",
 
-
 
-				"#endif",
 
-
 
-				// directional lights
 
-
 
-				"#if NUM_DIR_LIGHTS > 0",
 
-
 
-					"vec3 dirDiffuse = vec3( 0.0 );",
 
-					"vec3 dirSpecular = vec3( 0.0 );",
 
-
 
-					"for( int i = 0; i < NUM_DIR_LIGHTS; i++ ) {",
 
-
 
-						"vec3 dirVector = directionalLights[ i ].direction;",
 
-						"vec3 dirHalfVector = normalize( dirVector + viewPosition );",
 
-
 
-						"float dirDotNormalHalf = max( dot( normal, dirHalfVector ), 0.0 );",
 
-						"float dirDiffuseWeight = max( dot( normal, dirVector ), 0.0 );",
 
-
 
-						"float dirSpecularWeight = specularTex.r * max( pow( dirDotNormalHalf, shininess ), 0.0 );",
 
-
 
-						"totalDiffuseLight += directionalLights[ i ].color * dirDiffuseWeight;",
 
-						"totalSpecularLight += directionalLights[ i ].color * specular * dirSpecularWeight * dirDiffuseWeight;",
 
-
 
-					"}",
 
-
 
-				"#endif",
 
-
 
-				// hemisphere lights
 
-
 
-				"#if NUM_HEMI_LIGHTS > 0",
 
-
 
-					"vec3 hemiDiffuse  = vec3( 0.0 );",
 
-					"vec3 hemiSpecular = vec3( 0.0 );",
 
-
 
-					"for( int i = 0; i < NUM_HEMI_LIGHTS; i ++ ) {",
 
-
 
-						"vec3 lVector = hemisphereLightDirection[ i ];",
 
-
 
-						// diffuse
 
-
 
-						"float dotProduct = dot( normal, lVector );",
 
-						"float hemiDiffuseWeight = 0.5 * dotProduct + 0.5;",
 
-
 
-						"totalDiffuseLight += mix( hemisphereLights[ i ].groundColor, hemisphereLights[ i ].skyColor, hemiDiffuseWeight );",
 
-
 
-						// specular (sky light)
 
-
 
-						"float hemiSpecularWeight = 0.0;",
 
-
 
-						"vec3 hemiHalfVectorSky = normalize( lVector + viewPosition );",
 
-						"float hemiDotNormalHalfSky = 0.5 * dot( normal, hemiHalfVectorSky ) + 0.5;",
 
-						"hemiSpecularWeight += specularTex.r * max( pow( hemiDotNormalHalfSky, shininess ), 0.0 );",
 
-
 
-						// specular (ground light)
 
-
 
-						"vec3 lVectorGround = -lVector;",
 
-
 
-						"vec3 hemiHalfVectorGround = normalize( lVectorGround + viewPosition );",
 
-						"float hemiDotNormalHalfGround = 0.5 * dot( normal, hemiHalfVectorGround ) + 0.5;",
 
-						"hemiSpecularWeight += specularTex.r * max( pow( hemiDotNormalHalfGround, shininess ), 0.0 );",
 
-
 
-						"totalSpecularLight += specular * mix( hemisphereLights[ i ].groundColor, hemisphereLights[ i ].skyColor, hemiDiffuseWeight ) * hemiSpecularWeight * hemiDiffuseWeight;",
 
-
 
-					"}",
 
-
 
-				"#endif",
 
-
 
-				"outgoingLight += diffuseColor.xyz * ( totalDiffuseLight + ambientLightColor + totalSpecularLight );",
 
-
 
-				"gl_FragColor = vec4( outgoingLight, diffuseColor.a );",	// TODO, this should be pre-multiplied to allow for bright highlights on very transparent objects
 
-
 
-				THREE.ShaderChunk[ "fog_fragment" ],
 
-
 
-			"}"
 
-
 
-		].join( "\n" ),
 
-
 
-		vertexShader: [
 
-
 
-			"attribute vec4 tangent;",
 
-
 
-			"uniform vec2 uRepeatBase;",
 
-
 
-			"uniform sampler2D tNormal;",
 
-
 
-			"#ifdef VERTEX_TEXTURES",
 
-
 
-				"uniform sampler2D tDisplacement;",
 
-				"uniform float uDisplacementScale;",
 
-				"uniform float uDisplacementBias;",
 
-
 
-			"#endif",
 
-
 
-			"varying vec3 vTangent;",
 
-			"varying vec3 vBinormal;",
 
-			"varying vec3 vNormal;",
 
-			"varying vec2 vUv;",
 
-
 
-			"varying vec3 vViewPosition;",
 
-
 
-			THREE.ShaderChunk[ "shadowmap_pars_vertex" ],
 
-			THREE.ShaderChunk[ "fog_pars_vertex" ],
 
-
 
-			"void main() {",
 
-
 
-				"vNormal = normalize( normalMatrix * normal );",
 
-
 
-				// tangent and binormal vectors
 
-
 
-				"vTangent = normalize( normalMatrix * tangent.xyz );",
 
-
 
-				"vBinormal = cross( vNormal, vTangent ) * tangent.w;",
 
-				"vBinormal = normalize( vBinormal );",
 
-
 
-				// texture coordinates
 
-
 
-				"vUv = uv;",
 
-
 
-				"vec2 uvBase = uv * uRepeatBase;",
 
-
 
-				// displacement mapping
 
-
 
-				"#ifdef VERTEX_TEXTURES",
 
-
 
-					"vec3 dv = texture2D( tDisplacement, uvBase ).xyz;",
 
-					"float df = uDisplacementScale * dv.x + uDisplacementBias;",
 
-					"vec3 displacedPosition = normal * df + position;",
 
-
 
-					"vec4 worldPosition = modelMatrix * vec4( displacedPosition, 1.0 );",
 
-					"vec4 mvPosition = modelViewMatrix * vec4( displacedPosition, 1.0 );",
 
-
 
-				"#else",
 
-
 
-					"vec4 worldPosition = modelMatrix * vec4( position, 1.0 );",
 
-					"vec4 mvPosition = modelViewMatrix * vec4( position, 1.0 );",
 
-
 
-				"#endif",
 
-
 
-				"gl_Position = projectionMatrix * mvPosition;",
 
-
 
-				"vViewPosition = -mvPosition.xyz;",
 
-
 
-				"vec3 normalTex = texture2D( tNormal, uvBase ).xyz * 2.0 - 1.0;",
 
-				"vNormal = normalMatrix * normalTex;",
 
-
 
-				THREE.ShaderChunk[ "shadowmap_vertex" ],
 
-				THREE.ShaderChunk[ "fog_vertex" ],
 
-
 
-			"}"
 
-
 
-		].join( "\n" )
 
-
 
-	}
 
-
 
-};

+ 0 - 324
examples/js/SimplexNoise.js
View File 

@@ -1,324 +0,0 @@
 
-// Ported from Stefan Gustavson's java implementation
 
-// http://staffwww.itn.liu.se/~stegu/simplexnoise/simplexnoise.pdf
 
-// Read Stefan's excellent paper for details on how this code works.
 
-//
 
-// Sean McCullough [email protected]
 
-//
 
-// Added 4D noise
 
-// Joshua Koo [email protected] 
-
 
-/**
 
- * You can pass in a random number generator object if you like.
 
- * It is assumed to have a random() method.
 
- */
 
-var SimplexNoise = function(r) {
 
-	if (r == undefined) r = Math;
 
-	this.grad3 = [[ 1,1,0 ],[ -1,1,0 ],[ 1,-1,0 ],[ -1,-1,0 ], 
-                                 [ 1,0,1 ],[ -1,0,1 ],[ 1,0,-1 ],[ -1,0,-1 ], 
-                                 [ 0,1,1 ],[ 0,-1,1 ],[ 0,1,-1 ],[ 0,-1,-1 ]]; 
-
 
-	this.grad4 = [[ 0,1,1,1 ], [ 0,1,1,-1 ], [ 0,1,-1,1 ], [ 0,1,-1,-1 ],
 
-	     [ 0,-1,1,1 ], [ 0,-1,1,-1 ], [ 0,-1,-1,1 ], [ 0,-1,-1,-1 ],
 
-	     [ 1,0,1,1 ], [ 1,0,1,-1 ], [ 1,0,-1,1 ], [ 1,0,-1,-1 ],
 
-	     [ -1,0,1,1 ], [ -1,0,1,-1 ], [ -1,0,-1,1 ], [ -1,0,-1,-1 ],
 
-	     [ 1,1,0,1 ], [ 1,1,0,-1 ], [ 1,-1,0,1 ], [ 1,-1,0,-1 ],
 
-	     [ -1,1,0,1 ], [ -1,1,0,-1 ], [ -1,-1,0,1 ], [ -1,-1,0,-1 ],
 
-	     [ 1,1,1,0 ], [ 1,1,-1,0 ], [ 1,-1,1,0 ], [ 1,-1,-1,0 ],
 
-	     [ -1,1,1,0 ], [ -1,1,-1,0 ], [ -1,-1,1,0 ], [ -1,-1,-1,0 ]];
 
-
 
-	this.p = [];
 
-	for (var i = 0; i < 256; i ++) {
 
-		this.p[i] = Math.floor(r.random() * 256);
 
-	}
 
-  // To remove the need for index wrapping, double the permutation table length 
-	this.perm = []; 
-	for (var i = 0; i < 512; i ++) {
 
-		this.perm[i] = this.p[i & 255];
 
-	} 
-
 
-  // A lookup table to traverse the simplex around a given point in 4D. 
-  // Details can be found where this table is used, in the 4D noise method. 
-	this.simplex = [ 
-    [ 0,1,2,3 ],[ 0,1,3,2 ],[ 0,0,0,0 ],[ 0,2,3,1 ],[ 0,0,0,0 ],[ 0,0,0,0 ],[ 0,0,0,0 ],[ 1,2,3,0 ], 
-    [ 0,2,1,3 ],[ 0,0,0,0 ],[ 0,3,1,2 ],[ 0,3,2,1 ],[ 0,0,0,0 ],[ 0,0,0,0 ],[ 0,0,0,0 ],[ 1,3,2,0 ], 
-    [ 0,0,0,0 ],[ 0,0,0,0 ],[ 0,0,0,0 ],[ 0,0,0,0 ],[ 0,0,0,0 ],[ 0,0,0,0 ],[ 0,0,0,0 ],[ 0,0,0,0 ], 
-    [ 1,2,0,3 ],[ 0,0,0,0 ],[ 1,3,0,2 ],[ 0,0,0,0 ],[ 0,0,0,0 ],[ 0,0,0,0 ],[ 2,3,0,1 ],[ 2,3,1,0 ], 
-    [ 1,0,2,3 ],[ 1,0,3,2 ],[ 0,0,0,0 ],[ 0,0,0,0 ],[ 0,0,0,0 ],[ 2,0,3,1 ],[ 0,0,0,0 ],[ 2,1,3,0 ], 
-    [ 0,0,0,0 ],[ 0,0,0,0 ],[ 0,0,0,0 ],[ 0,0,0,0 ],[ 0,0,0,0 ],[ 0,0,0,0 ],[ 0,0,0,0 ],[ 0,0,0,0 ], 
-    [ 2,0,1,3 ],[ 0,0,0,0 ],[ 0,0,0,0 ],[ 0,0,0,0 ],[ 3,0,1,2 ],[ 3,0,2,1 ],[ 0,0,0,0 ],[ 3,1,2,0 ], 
-    [ 2,1,0,3 ],[ 0,0,0,0 ],[ 0,0,0,0 ],[ 0,0,0,0 ],[ 3,1,0,2 ],[ 0,0,0,0 ],[ 3,2,0,1 ],[ 3,2,1,0 ]]; 
-};
 
-
 
-SimplexNoise.prototype.dot = function(g, x, y) { 
-	return g[0] * x + g[1] * y;
 
-};
 
-
 
-SimplexNoise.prototype.dot3 = function(g, x, y, z) {
 
-	return g[0] * x + g[1] * y + g[2] * z; 
-};
 
-
 
-SimplexNoise.prototype.dot4 = function(g, x, y, z, w) {
 
-	return g[0] * x + g[1] * y + g[2] * z + g[3] * w;
 
-};
 
-
 
-SimplexNoise.prototype.noise = function(xin, yin) { 
-	var n0, n1, n2; // Noise contributions from the three corners 
-  // Skew the input space to determine which simplex cell we're in 
-	var F2 = 0.5 * (Math.sqrt(3.0) - 1.0); 
-	var s = (xin + yin) * F2; // Hairy factor for 2D 
-	var i = Math.floor(xin + s); 
-	var j = Math.floor(yin + s); 
-	var G2 = (3.0 - Math.sqrt(3.0)) / 6.0; 
-	var t = (i + j) * G2; 
-	var X0 = i - t; // Unskew the cell origin back to (x,y) space 
-	var Y0 = j - t; 
-	var x0 = xin - X0; // The x,y distances from the cell origin 
-	var y0 = yin - Y0; 
-  // For the 2D case, the simplex shape is an equilateral triangle. 
-  // Determine which simplex we are in. 
-	var i1, j1; // Offsets for second (middle) corner of simplex in (i,j) coords 
-	if (x0 > y0) {i1 = 1; j1 = 0;} // lower triangle, XY order: (0,0)->(1,0)->(1,1) 
-	else {i1 = 0; j1 = 1;}      // upper triangle, YX order: (0,0)->(0,1)->(1,1) 
-  // A step of (1,0) in (i,j) means a step of (1-c,-c) in (x,y), and 
-  // a step of (0,1) in (i,j) means a step of (-c,1-c) in (x,y), where 
-  // c = (3-sqrt(3))/6 
-	var x1 = x0 - i1 + G2; // Offsets for middle corner in (x,y) unskewed coords 
-	var y1 = y0 - j1 + G2; 
-	var x2 = x0 - 1.0 + 2.0 * G2; // Offsets for last corner in (x,y) unskewed coords 
-	var y2 = y0 - 1.0 + 2.0 * G2; 
-  // Work out the hashed gradient indices of the three simplex corners 
-	var ii = i & 255; 
-	var jj = j & 255; 
-	var gi0 = this.perm[ii + this.perm[jj]] % 12; 
-	var gi1 = this.perm[ii + i1 + this.perm[jj + j1]] % 12; 
-	var gi2 = this.perm[ii + 1 + this.perm[jj + 1]] % 12; 
-  // Calculate the contribution from the three corners 
-	var t0 = 0.5 - x0 * x0 - y0 * y0; 
-	if (t0 < 0) n0 = 0.0; 
-	else { 
-		t0 *= t0; 
-		n0 = t0 * t0 * this.dot(this.grad3[gi0], x0, y0);  // (x,y) of grad3 used for 2D gradient 
-	} 
-	var t1 = 0.5 - x1 * x1 - y1 * y1; 
-	if (t1 < 0) n1 = 0.0; 
-	else { 
-		t1 *= t1; 
-		n1 = t1 * t1 * this.dot(this.grad3[gi1], x1, y1); 
-	}
 
-	var t2 = 0.5 - x2 * x2 - y2 * y2; 
-	if (t2 < 0) n2 = 0.0; 
-	else { 
-		t2 *= t2; 
-		n2 = t2 * t2 * this.dot(this.grad3[gi2], x2, y2); 
-	} 
-  // Add contributions from each corner to get the final noise value. 
-  // The result is scaled to return values in the interval [-1,1]. 
-	return 70.0 * (n0 + n1 + n2); 
-};
 
-
 
-// 3D simplex noise 
-SimplexNoise.prototype.noise3d = function(xin, yin, zin) { 
-	var n0, n1, n2, n3; // Noise contributions from the four corners 
-  // Skew the input space to determine which simplex cell we're in 
-	var F3 = 1.0 / 3.0; 
-	var s = (xin + yin + zin) * F3; // Very nice and simple skew factor for 3D 
-	var i = Math.floor(xin + s); 
-	var j = Math.floor(yin + s); 
-	var k = Math.floor(zin + s); 
-	var G3 = 1.0 / 6.0; // Very nice and simple unskew factor, too 
-	var t = (i + j + k) * G3; 
-	var X0 = i - t; // Unskew the cell origin back to (x,y,z) space 
-	var Y0 = j - t; 
-	var Z0 = k - t; 
-	var x0 = xin - X0; // The x,y,z distances from the cell origin 
-	var y0 = yin - Y0; 
-	var z0 = zin - Z0; 
-  // For the 3D case, the simplex shape is a slightly irregular tetrahedron. 
-  // Determine which simplex we are in. 
-	var i1, j1, k1; // Offsets for second corner of simplex in (i,j,k) coords 
-	var i2, j2, k2; // Offsets for third corner of simplex in (i,j,k) coords 
-	if (x0 >= y0) { 
-		if (y0 >= z0) 
-      { i1 = 1; j1 = 0; k1 = 0; i2 = 1; j2 = 1; k2 = 0; } // X Y Z order 
-      else if (x0 >= z0) { i1 = 1; j1 = 0; k1 = 0; i2 = 1; j2 = 0; k2 = 1; } // X Z Y order 
-		else { i1 = 0; j1 = 0; k1 = 1; i2 = 1; j2 = 0; k2 = 1; } // Z X Y order 
-	} 
-	else { // x0<y0 
-		if (y0 < z0) { i1 = 0; j1 = 0; k1 = 1; i2 = 0; j2 = 1; k2 = 1; } // Z Y X order 
-    else if (x0 < z0) { i1 = 0; j1 = 1; k1 = 0; i2 = 0; j2 = 1; k2 = 1; } // Y Z X order 
-		else { i1 = 0; j1 = 1; k1 = 0; i2 = 1; j2 = 1; k2 = 0; } // Y X Z order 
-	} 
-  // A step of (1,0,0) in (i,j,k) means a step of (1-c,-c,-c) in (x,y,z), 
-  // a step of (0,1,0) in (i,j,k) means a step of (-c,1-c,-c) in (x,y,z), and 
-  // a step of (0,0,1) in (i,j,k) means a step of (-c,-c,1-c) in (x,y,z), where 
-  // c = 1/6.
 
-	var x1 = x0 - i1 + G3; // Offsets for second corner in (x,y,z) coords 
-	var y1 = y0 - j1 + G3; 
-	var z1 = z0 - k1 + G3; 
-	var x2 = x0 - i2 + 2.0 * G3; // Offsets for third corner in (x,y,z) coords 
-	var y2 = y0 - j2 + 2.0 * G3; 
-	var z2 = z0 - k2 + 2.0 * G3; 
-	var x3 = x0 - 1.0 + 3.0 * G3; // Offsets for last corner in (x,y,z) coords 
-	var y3 = y0 - 1.0 + 3.0 * G3; 
-	var z3 = z0 - 1.0 + 3.0 * G3; 
-  // Work out the hashed gradient indices of the four simplex corners 
-	var ii = i & 255; 
-	var jj = j & 255; 
-	var kk = k & 255; 
-	var gi0 = this.perm[ii + this.perm[jj + this.perm[kk]]] % 12; 
-	var gi1 = this.perm[ii + i1 + this.perm[jj + j1 + this.perm[kk + k1]]] % 12; 
-	var gi2 = this.perm[ii + i2 + this.perm[jj + j2 + this.perm[kk + k2]]] % 12; 
-	var gi3 = this.perm[ii + 1 + this.perm[jj + 1 + this.perm[kk + 1]]] % 12; 
-  // Calculate the contribution from the four corners 
-	var t0 = 0.6 - x0 * x0 - y0 * y0 - z0 * z0; 
-	if (t0 < 0) n0 = 0.0; 
-	else { 
-		t0 *= t0; 
-		n0 = t0 * t0 * this.dot3(this.grad3[gi0], x0, y0, z0); 
-	}
 
-	var t1 = 0.6 - x1 * x1 - y1 * y1 - z1 * z1; 
-	if (t1 < 0) n1 = 0.0; 
-	else { 
-		t1 *= t1; 
-		n1 = t1 * t1 * this.dot3(this.grad3[gi1], x1, y1, z1); 
-	} 
-	var t2 = 0.6 - x2 * x2 - y2 * y2 - z2 * z2; 
-	if (t2 < 0) n2 = 0.0; 
-	else { 
-		t2 *= t2; 
-		n2 = t2 * t2 * this.dot3(this.grad3[gi2], x2, y2, z2); 
-	} 
-	var t3 = 0.6 - x3 * x3 - y3 * y3 - z3 * z3; 
-	if (t3 < 0) n3 = 0.0; 
-	else { 
-		t3 *= t3; 
-		n3 = t3 * t3 * this.dot3(this.grad3[gi3], x3, y3, z3); 
-	} 
-  // Add contributions from each corner to get the final noise value. 
-  // The result is scaled to stay just inside [-1,1] 
-	return 32.0 * (n0 + n1 + n2 + n3); 
-};
 
-
 
-// 4D simplex noise
 
-SimplexNoise.prototype.noise4d = function( x, y, z, w ) {
 
-	// For faster and easier lookups
 
-	var grad4 = this.grad4;
 
-	var simplex = this.simplex;
 
-	var perm = this.perm;
 
-	
-   // The skewing and unskewing factors are hairy again for the 4D case
 
-	var F4 = (Math.sqrt(5.0) - 1.0) / 4.0;
 
-	var G4 = (5.0 - Math.sqrt(5.0)) / 20.0;
 
-	var n0, n1, n2, n3, n4; // Noise contributions from the five corners
 
-   // Skew the (x,y,z,w) space to determine which cell of 24 simplices we're in
 
-	var s = (x + y + z + w) * F4; // Factor for 4D skewing
 
-	var i = Math.floor(x + s);
 
-	var j = Math.floor(y + s);
 
-	var k = Math.floor(z + s);
 
-	var l = Math.floor(w + s);
 
-	var t = (i + j + k + l) * G4; // Factor for 4D unskewing
 
-	var X0 = i - t; // Unskew the cell origin back to (x,y,z,w) space
 
-	var Y0 = j - t;
 
-	var Z0 = k - t;
 
-	var W0 = l - t;
 
-	var x0 = x - X0;  // The x,y,z,w distances from the cell origin
 
-	var y0 = y - Y0;
 
-	var z0 = z - Z0;
 
-	var w0 = w - W0;
 
-
 
-   // For the 4D case, the simplex is a 4D shape I won't even try to describe.
 
-   // To find out which of the 24 possible simplices we're in, we need to
 
-   // determine the magnitude ordering of x0, y0, z0 and w0.
 
-   // The method below is a good way of finding the ordering of x,y,z,w and
 
-   // then find the correct traversal order for the simplex we’re in.
 
-   // First, six pair-wise comparisons are performed between each possible pair
 
-   // of the four coordinates, and the results are used to add up binary bits
 
-   // for an integer index.
 
-	var c1 = (x0 > y0) ? 32 : 0;
 
-	var c2 = (x0 > z0) ? 16 : 0;
 
-	var c3 = (y0 > z0) ? 8 : 0;
 
-	var c4 = (x0 > w0) ? 4 : 0;
 
-	var c5 = (y0 > w0) ? 2 : 0;
 
-	var c6 = (z0 > w0) ? 1 : 0;
 
-	var c = c1 + c2 + c3 + c4 + c5 + c6;
 
-	var i1, j1, k1, l1; // The integer offsets for the second simplex corner
 
-	var i2, j2, k2, l2; // The integer offsets for the third simplex corner
 
-	var i3, j3, k3, l3; // The integer offsets for the fourth simplex corner
 
-   // simplex[c] is a 4-vector with the numbers 0, 1, 2 and 3 in some order.
 
-   // Many values of c will never occur, since e.g. x>y>z>w makes x<z, y<w and x<w
 
-   // impossible. Only the 24 indices which have non-zero entries make any sense.
 
-   // We use a thresholding to set the coordinates in turn from the largest magnitude.
 
-   // The number 3 in the "simplex" array is at the position of the largest coordinate.
 
-	i1 = simplex[c][0] >= 3 ? 1 : 0;
 
-	j1 = simplex[c][1] >= 3 ? 1 : 0;
 
-	k1 = simplex[c][2] >= 3 ? 1 : 0;
 
-	l1 = simplex[c][3] >= 3 ? 1 : 0;
 
-   // The number 2 in the "simplex" array is at the second largest coordinate.
 
-	i2 = simplex[c][0] >= 2 ? 1 : 0;
 
-	j2 = simplex[c][1] >= 2 ? 1 : 0;    k2 = simplex[c][2] >= 2 ? 1 : 0;
 
-	l2 = simplex[c][3] >= 2 ? 1 : 0;
 
-   // The number 1 in the "simplex" array is at the second smallest coordinate.
 
-	i3 = simplex[c][0] >= 1 ? 1 : 0;
 
-	j3 = simplex[c][1] >= 1 ? 1 : 0;
 
-	k3 = simplex[c][2] >= 1 ? 1 : 0;
 
-	l3 = simplex[c][3] >= 1 ? 1 : 0;
 
-   // The fifth corner has all coordinate offsets = 1, so no need to look that up.
 
-	var x1 = x0 - i1 + G4; // Offsets for second corner in (x,y,z,w) coords
 
-	var y1 = y0 - j1 + G4;
 
-	var z1 = z0 - k1 + G4;
 
-	var w1 = w0 - l1 + G4;
 
-	var x2 = x0 - i2 + 2.0 * G4; // Offsets for third corner in (x,y,z,w) coords
 
-	var y2 = y0 - j2 + 2.0 * G4;
 
-	var z2 = z0 - k2 + 2.0 * G4;
 
-	var w2 = w0 - l2 + 2.0 * G4;
 
-	var x3 = x0 - i3 + 3.0 * G4; // Offsets for fourth corner in (x,y,z,w) coords
 
-	var y3 = y0 - j3 + 3.0 * G4;
 
-	var z3 = z0 - k3 + 3.0 * G4;
 
-	var w3 = w0 - l3 + 3.0 * G4;
 
-	var x4 = x0 - 1.0 + 4.0 * G4; // Offsets for last corner in (x,y,z,w) coords
 
-	var y4 = y0 - 1.0 + 4.0 * G4;
 
-	var z4 = z0 - 1.0 + 4.0 * G4;
 
-	var w4 = w0 - 1.0 + 4.0 * G4;
 
-   // Work out the hashed gradient indices of the five simplex corners
 
-	var ii = i & 255;
 
-	var jj = j & 255;
 
-	var kk = k & 255;
 
-	var ll = l & 255;
 
-	var gi0 = perm[ii + perm[jj + perm[kk + perm[ll]]]] % 32;
 
-	var gi1 = perm[ii + i1 + perm[jj + j1 + perm[kk + k1 + perm[ll + l1]]]] % 32;
 
-	var gi2 = perm[ii + i2 + perm[jj + j2 + perm[kk + k2 + perm[ll + l2]]]] % 32;
 
-	var gi3 = perm[ii + i3 + perm[jj + j3 + perm[kk + k3 + perm[ll + l3]]]] % 32;
 
-	var gi4 = perm[ii + 1 + perm[jj + 1 + perm[kk + 1 + perm[ll + 1]]]] % 32;
 
-   // Calculate the contribution from the five corners
 
-	var t0 = 0.6 - x0 * x0 - y0 * y0 - z0 * z0 - w0 * w0;
 
-	if (t0 < 0) n0 = 0.0;
 
-	else {
 
-		t0 *= t0;
 
-		n0 = t0 * t0 * this.dot4(grad4[gi0], x0, y0, z0, w0);
 
-	}
 
-	var t1 = 0.6 - x1 * x1 - y1 * y1 - z1 * z1 - w1 * w1;
 
-	if (t1 < 0) n1 = 0.0;
 
-	else {
 
-		t1 *= t1;
 
-		n1 = t1 * t1 * this.dot4(grad4[gi1], x1, y1, z1, w1);
 
-	}
 
-	var t2 = 0.6 - x2 * x2 - y2 * y2 - z2 * z2 - w2 * w2;
 
-	if (t2 < 0) n2 = 0.0;
 
-	else {
 
-		t2 *= t2;
 
-		n2 = t2 * t2 * this.dot4(grad4[gi2], x2, y2, z2, w2);
 
-	}   var t3 = 0.6 - x3 * x3 - y3 * y3 - z3 * z3 - w3 * w3;
 
-	if (t3 < 0) n3 = 0.0;
 
-	else {
 
-		t3 *= t3;
 
-		n3 = t3 * t3 * this.dot4(grad4[gi3], x3, y3, z3, w3);
 
-	}
 
-	var t4 = 0.6 - x4 * x4 - y4 * y4 - z4 * z4 - w4 * w4;
 
-	if (t4 < 0) n4 = 0.0;
 
-	else {
 
-		t4 *= t4;
 
-		n4 = t4 * t4 * this.dot4(grad4[gi4], x4, y4, z4, w4);
 
-	}
 
-   // Sum up and scale the result to cover the range [-1,1]
 
-	return 27.0 * (n0 + n1 + n2 + n3 + n4);
 
-};

+ 0 - 0
examples/js/AnimationClipCreator.js → examples/js/animation/AnimationClipCreator.js
View File


+ 21 - 27
examples/js/TimelinerController.js → examples/js/animation/TimelinerController.js
View File 

@@ -3,7 +3,7 @@
 
  *
 
  * Timeliner GUI library (required to use this class):
 
  *
 
- * 		./libs/timeliner_gui.min.js
 
+ * 		../libs/timeliner_gui.min.js
 
  *
 
  * Source code:
 
  *
 
@@ -35,7 +35,7 @@ THREE.TimelinerController.prototype = {
 
 
 	constructor: THREE.TimelinerController,
 
 
-	init: function( timeliner ) {
 
+	init: function () {
 
 
 		var tracks = [],
 
 			trackInfo = this._trackInfo;
 
@@ -44,9 +44,8 @@ THREE.TimelinerController.prototype = {
 
 
 			var spec = trackInfo[ i ];
 
 
-			tracks.push( this._addTrack(
 
-					spec.type, spec.propertyPath,
 
-					spec.initialValue, spec.interpolation ) );
 
+			tracks.push( this._addTrack( spec.type, spec.propertyPath, spec.initialValue, spec.interpolation ) );
 
+
 
 		}
 
 
 		this._clip = new THREE.AnimationClip( 'editclip', 0, tracks );
 
@@ -54,7 +53,7 @@ THREE.TimelinerController.prototype = {
 
 
 	},
 
 
-	setDisplayTime: function( time ) {
 
+	setDisplayTime: function ( time ) {
 
 
 		this._action.time = time;
 
 		this._mixer.update( 0 );
 
@@ -63,25 +62,25 @@ THREE.TimelinerController.prototype = {
 
 
 	},
 
 
-	setDuration: function( duration ) {
 
+	setDuration: function ( duration ) {
 
 
 		this._clip.duration = duration;
 
 
 	},
 
 
-	getChannelNames: function() {
 
+	getChannelNames: function () {
 
 
 		return this._channelNames;
 
 
 	},
 
 
-	getChannelKeyTimes: function( channelName ) {
 
+	getChannelKeyTimes: function ( channelName ) {
 
 
 		return this._tracks[ channelName ].times;
 
 
 	},
 
 
-	setKeyframe: function( channelName, time ) {
 
+	setKeyframe: function ( channelName, time ) {
 
 
 		var track = this._tracks[ channelName ],
 
 			times = track.times,
 
@@ -106,8 +105,7 @@ THREE.TimelinerController.prototype = {
 
 
 			}
 
 
-			for ( var i = nValues - 1,
 
-					e = offset + stride - 1; i !== e; -- i ) {
 
+			for ( var i = nValues - 1, e = offset + stride - 1; i !== e; -- i ) {
 
 
 				values[ i ] = values[ i - stride ];
 
 
@@ -120,7 +118,7 @@ THREE.TimelinerController.prototype = {
 
 
 	},
 
 
-	delKeyframe: function( channelName, time ) {
 
+	delKeyframe: function ( channelName, time ) {
 
 
 		var track = this._tracks[ channelName ],
 
 			times = track.times,
 
@@ -159,7 +157,7 @@ THREE.TimelinerController.prototype = {
 
 
 	},
 
 
-	moveKeyframe: function( channelName, time, delta, moveRemaining ) {
 
+	moveKeyframe: function ( channelName, time, delta, moveRemaining ) {
 
 
 		var track = this._tracks[ channelName ],
 
 			times = track.times,
 
@@ -179,7 +177,7 @@ THREE.TimelinerController.prototype = {
 
 
 	},
 
 
-	serialize: function() {
 
+	serialize: function () {
 
 
 		var result = {
 
 				duration: this._clip.duration,
 
@@ -209,7 +207,7 @@ THREE.TimelinerController.prototype = {
 
 
 	},
 
 
-	deserialize: function( structs ) {
 
+	deserialize: function ( structs ) {
 
 
 		var names = this._channelNames,
 
 			tracks = this._tracks,
 
@@ -234,33 +232,29 @@ THREE.TimelinerController.prototype = {
 
 
 	},
 
 
-	_sort: function( track ) {
 
+	_sort: function ( track ) {
 
 
-		var times = track.times,
 
-			order = THREE.AnimationUtils.getKeyframeOrder( times );
 
+		var times = track.times, order = THREE.AnimationUtils.getKeyframeOrder( times );
 
 
-		this._setArray( times,
 
-				THREE.AnimationUtils.sortedArray( times, 1, order ) );
 
+		this._setArray( times, THREE.AnimationUtils.sortedArray( times, 1, order ) );
 
 
 		var values = track.values,
 
 			stride = track.getValueSize();
 
 
-		this._setArray( values,
 
-				THREE.AnimationUtils.sortedArray( values, stride, order ) );
 
+		this._setArray( values, THREE.AnimationUtils.sortedArray( values, stride, order ) );
 
 
 	},
 
 
-	_setArray: function( dst, src ) {
 
+	_setArray: function ( dst, src ) {
 
 
 		dst.length = 0;
 
 		dst.push.apply( dst, src );
 
 
 	},
 
 
-	_addTrack: function( type, prop, initialValue, interpolation ) {
 
+	_addTrack: function ( type, prop, initialValue, interpolation ) {
 
 
-		var track = new type(
 
-				prop, [ 0 ], initialValue, interpolation );
 
+		var track = new type( prop, [ 0 ], initialValue, interpolation );
 
 
 		// data must be in JS arrays so it can be resized
 
 		track.times = Array.prototype.slice.call( track.times );

+ 2 - 2
examples/js/cameras/CinematicCamera.js
View File 

@@ -186,14 +186,14 @@ THREE.CinematicCamera.prototype.renderCinematic = function ( scene, renderer ) {
 
 		scene.overrideMaterial = null;
 
 		renderer.setRenderTarget( this.postprocessing.rtTextureColor );
 
 		renderer.clear();
 
-		renderer.render( scene, camera );
 
+		renderer.render( scene, this );
 
 
 		// Render depth into texture
 
 
 		scene.overrideMaterial = this.materialDepth;
 
 		renderer.setRenderTarget( this.postprocessing.rtTextureDepth );
 
 		renderer.clear();
 
-		renderer.render( scene, camera );
 
+		renderer.render( scene, this );
 
 
 		// Render bokeh composite

+ 1 - 1
examples/js/controls/DragControls.js
View File 

@@ -21,7 +21,7 @@ THREE.DragControls = function ( _objects, _camera, _domElement ) {
 
 	var _intersection = new THREE.Vector3();
 
 	var _worldPosition = new THREE.Vector3();
 
 	var _inverseMatrix = new THREE.Matrix4();
 
-	
+
 
 	var _selected = null, _hovered = null;
 
 
 	//

Some files were not shown because too many files changed in this diff