Browse Source

Merge branch 'dev' into fixWebXR

Mr.doob 6 years ago
parent
commit
034df4ab88
100 changed files with 2544 additions and 1332 deletions
  1. 1 1
      .github/ISSUE_TEMPLATE.md
  2. 2 2
      README.md
  3. 44 47
      build/three.js
  4. 414 411
      build/three.min.js
  5. 44 47
      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. 7 3
      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. 2 0
      docs/api/en/geometries/ExtrudeBufferGeometry.html
  22. 2 0
      docs/api/en/geometries/ExtrudeGeometry.html
  23. 1 1
      docs/api/en/geometries/IcosahedronBufferGeometry.html
  24. 1 1
      docs/api/en/geometries/OctahedronBufferGeometry.html
  25. 1 1
      docs/api/en/geometries/TetrahedronBufferGeometry.html
  26. 3 1
      docs/api/en/geometries/TextBufferGeometry.html
  27. 3 1
      docs/api/en/geometries/TextGeometry.html
  28. 1 1
      docs/api/en/helpers/AxesHelper.html
  29. 1 1
      docs/api/en/helpers/Box3Helper.html
  30. 7 7
      docs/api/en/helpers/BoxHelper.html
  31. 1 1
      docs/api/en/helpers/CameraHelper.html
  32. 1 1
      docs/api/en/helpers/FaceNormalsHelper.html
  33. 2 2
      docs/api/en/helpers/GridHelper.html
  34. 1 1
      docs/api/en/helpers/PlaneHelper.html
  35. 1 1
      docs/api/en/helpers/PointLightHelper.html
  36. 1 1
      docs/api/en/helpers/PolarGridHelper.html
  37. 1 1
      docs/api/en/helpers/VertexNormalsHelper.html
  38. 3 2
      docs/api/en/lights/Light.html
  39. 2 2
      docs/api/en/materials/Material.html
  40. 131 0
      docs/api/en/materials/MeshDistanceMaterial.html
  41. 150 0
      docs/api/en/materials/MeshMatcapMaterial.html
  42. 61 1
      docs/api/en/materials/MeshNormalMaterial.html
  43. 2 2
      docs/api/en/materials/MeshToonMaterial.html
  44. 1 1
      docs/api/en/materials/RawShaderMaterial.html
  45. 22 2
      docs/api/en/math/Box3.html
  46. 1 0
      docs/api/en/math/Matrix4.html
  47. 2 2
      docs/api/en/objects/LOD.html
  48. 18 5
      docs/api/en/renderers/WebGLRenderer.html
  49. 3 2
      docs/api/en/scenes/Scene.html
  50. 10 5
      docs/api/en/textures/Texture.html
  51. 1 1
      docs/api/zh/animation/KeyframeTrack.html
  52. 1 1
      docs/api/zh/cameras/ArrayCamera.html
  53. 2 2
      docs/api/zh/core/Clock.html
  54. 1 1
      docs/api/zh/core/Object3D.html
  55. 112 0
      docs/api/zh/materials/MeshDistanceMaterial.html
  56. 120 0
      docs/api/zh/materials/MeshMatcapMaterial.html
  57. 42 1
      docs/api/zh/materials/MeshNormalMaterial.html
  58. 2 2
      docs/api/zh/materials/MeshToonMaterial.html
  59. 2 2
      docs/api/zh/objects/LOD.html
  60. 9 0
      docs/api/zh/renderers/WebGLRenderer.html
  61. 4 0
      docs/api/zh/textures/Texture.html
  62. 2 2
      docs/examples/controls/OrbitControls.html
  63. 1 1
      docs/examples/loaders/MTLLoader.html
  64. 3 3
      docs/examples/loaders/OBJLoader.html
  65. 1 1
      docs/examples/loaders/OBJLoader2.html
  66. 83 67
      docs/examples/math/convexhull/ConvexHull.html
  67. 2 2
      docs/examples/math/convexhull/Face.html
  68. 2 2
      docs/examples/math/convexhull/HalfEdge.html
  69. 2 2
      docs/examples/math/convexhull/VertexList.html
  70. 2 2
      docs/examples/math/convexhull/VertexNode.html
  71. 7 0
      docs/examples/renderers/SVGRenderer.html
  72. 0 20
      docs/examples/utils/SceneUtils.html
  73. BIN
      docs/files/inconsolata.woff
  74. 0 213
      docs/index.css
  75. 70 32
      docs/index.html
  76. 10 6
      docs/list.js
  77. 1 1
      docs/manual/en/introduction/Drawing-lines.html
  78. 8 1
      docs/manual/en/introduction/How-to-dispose-of-objects.html
  79. 0 2
      docs/manual/en/introduction/How-to-update-things.html
  80. 241 5
      docs/manual/en/introduction/Import-via-modules.html
  81. 22 17
      docs/manual/en/introduction/Useful-links.html
  82. 20 12
      docs/manual/zh/introduction/Useful-links.html
  83. 131 40
      docs/page.css
  84. 1 2
      docs/page.js
  85. 4 2
      docs/prettify/threejs.css
  86. 5 16
      docs/scenes/bones-browser.html
  87. 6 17
      docs/scenes/geometry-browser.html
  88. 14 4
      docs/scenes/js/geometry.js
  89. 171 49
      docs/scenes/js/material.js
  90. 5 16
      docs/scenes/material-browser.html
  91. 6 0
      editor/index.html
  92. 7 1
      editor/js/Editor.js
  93. 2 2
      editor/js/History.js
  94. 161 98
      editor/js/Menubar.Add.js
  95. 62 0
      editor/js/Menubar.Edit.js
  96. 1 4
      editor/js/Menubar.File.js
  97. 22 19
      editor/js/Script.js
  98. 145 0
      editor/js/Sidebar.Geometry.ExtrudeGeometry.js
  99. 3 84
      editor/js/Sidebar.Geometry.LatheGeometry.js
  100. 54 0
      editor/js/Sidebar.Geometry.OctahedronGeometry.js

+ 1 - 1
.github/ISSUE_TEMPLATE.md

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

+ 2 - 2
README.md

@@ -24,13 +24,13 @@ The aim of the project is to create an easy to use, lightweight, 3D library with
 ### Usage ###
 ### 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),
 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
 ```html
 <script src="js/three.min.js"></script>
 <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
 ```javascript
 var camera, scene, renderer;
 var camera, scene, renderer;

File diff suppressed because it is too large
+ 44 - 47
build/three.js


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


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


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

@@ -58,7 +58,7 @@
 
 
 		<p>
 		<p>
 			Some examples of how to manually create [page:AnimationClip AnimationClips] with different sorts
 			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.
 			file.
 		</p>
 		</p>
 
 

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

@@ -8,13 +8,13 @@
 		<link type="text/css" rel="stylesheet" href="page.css" />
 		<link type="text/css" rel="stylesheet" href="page.css" />
 	</head>
 	</head>
 	<body>
 	<body>
-		[page:PerspectiveCamera] &rarr;
+		[page:Object3D] &rarr; [page:Camera] &rarr; [page:PerspectiveCamera] &rarr;
 
 
 		<h1>[name]</h1>
 		<h1>[name]</h1>
 
 
 		<p class="desc">
 		<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 />
 			[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>
 		</p>
 
 
 		<h2>Example</h2>
 		<h2>Example</h2>

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

@@ -130,12 +130,12 @@ scene.add( camera );</code>
 		Updates the camera projection matrix. Must be called after any change of parameters.
 		Updates the camera projection matrix. Must be called after any change of parameters.
 		</p>
 		</p>
 
 
-		<h3>[method:JSON toJSON]()</h3>
+		<h3>[method:Object toJSON](param:object meta])</h3>
 		<p>
 		<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>
 		</p>
 
 
-
 		<h2>Source</h2>
 		<h2>Source</h2>
 
 
 		[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
 		[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]

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

@@ -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.
 		Updates the camera projection matrix. Must be called after any change of parameters.
 		</p>
 		</p>
 
 
-		<h3>[method:JSON toJSON]()</h3>
+		<h3>[method:Object toJSON](param:object meta])</h3>
 		<p>
 		<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>
 		</p>
 
 
 		<h2>Source</h2>
 		<h2>Source</h2>

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

@@ -327,7 +327,7 @@
 		<p>Sets the attributes for this BufferGeometry from an array of points.</p>
 		<p>Sets the attributes for this BufferGeometry from an array of points.</p>
 
 
 		<h3>[method:Object toJSON]()</h3>
 		<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>
 		<h3>[method:BufferGeometry toNonIndexed]()</h3>
 		<p>Return a non-index version of an indexed BufferGeometry.</p>
 		<p>Return a non-index version of an indexed BufferGeometry.</p>

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

@@ -11,8 +11,8 @@
 		<h1>[name]</h1>
 		<h1>[name]</h1>
 
 
 		<p class="desc">
 		<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>
 		</p>
 
 
 
 

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

@@ -327,8 +327,10 @@
 		Use [page:Object3D.scale] for typical real-time mesh scaling.
 		Use [page:Object3D.scale] for typical real-time mesh scaling.
 		</p>
 		</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>
 		<h3>[method:Geometry translate] ( [param:Float x], [param:Float y], [param:Float z] )</h3>
 		<p>
 		<p>

+ 7 - 3
docs/api/en/core/Object3D.html

@@ -46,7 +46,7 @@
 
 
 		<h3>[property:Material customDistanceMaterial]</h3>
 		<h3>[property:Material customDistanceMaterial]</h3>
 		<p>
 		<p>
-		Same as customDepthMaterial, but used with [page:PointLight]. Default is *undefined*.
+		Same as [page:.customDepthMaterial customDepthMaterial], but used with [page:PointLight]. Default is *undefined*.
 		</p>
 		</p>
 
 
 		<h3>[property:Boolean frustumCulled]</h3>
 		<h3>[property:Boolean frustumCulled]</h3>
@@ -217,6 +217,9 @@
 		<h3>[method:this applyQuaternion]( [param:Quaternion quaternion] )</h3>
 		<h3>[method:this applyQuaternion]( [param:Quaternion quaternion] )</h3>
 		<p>Applies the rotation represented by the quaternion to the object.</p>
 		<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>
 		<h3>[method:Object3D clone]( [param:Boolean recursive] )</h3>
 		<p>
 		<p>
 		recursive -- if true, descendants of the object are also cloned. Default is true.<br /><br />
 		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].
 			Copy the given quaternion into [page:.quaternion].
 		</p>
 		</p>
 
 
-		<h3>[method:null toJSON]( [param:Quaternion q] )</h3>
+		<h3>[method:Object toJSON]( [param:object meta] )</h3>
 		<p>
 		<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>
 		</p>
 
 
 		<h3>[method:this translateOnAxis]( [param:Vector3 axis], [param:Float distance] )</h3>
 		<h3>[method:this translateOnAxis]( [param:Vector3 axis], [param:Float distance] )</h3>

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

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

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

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

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

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

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

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

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

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

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

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

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

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

+ 2 - 0
docs/api/en/geometries/ExtrudeBufferGeometry.html

@@ -51,6 +51,7 @@
 			bevelEnabled: true,
 			bevelEnabled: true,
 			bevelThickness: 1,
 			bevelThickness: 1,
 			bevelSize: 1,
 			bevelSize: 1,
+			bevelOffset: 0,
 			bevelSegments: 1
 			bevelSegments: 1
 		};
 		};
 
 
@@ -76,6 +77,7 @@
 				<li>bevelEnabled — bool. Apply beveling to the shape. Default is true.</li>
 				<li>bevelEnabled — bool. Apply beveling to the shape. Default is true.</li>
 				<li>bevelThickness — float. How deep into the original shape the bevel goes. Default is 6.</li>
 				<li>bevelThickness — float. How deep into the original shape the bevel goes. Default is 6.</li>
 				<li>bevelSize — float. Distance from the shape outline that the bevel extends. Default is bevelThickness - 2.</li>
 				<li>bevelSize — float. Distance from the shape outline that the bevel extends. Default is bevelThickness - 2.</li>
+				<li>bevelOffset — float. Distance from the shape outline that the bevel starts. Default is 0.</li>
 				<li>bevelSegments — int. Number of bevel layers. Default is 3.</li>
 				<li>bevelSegments — int. Number of bevel layers. Default is 3.</li>
 				<li>extrudePath — THREE.CurvePath. A 3D spline path along which the shape should be extruded.</li>
 				<li>extrudePath — THREE.CurvePath. A 3D spline path along which the shape should be extruded.</li>
 				<li>UVGenerator —  Object. object that provides UV generator functions</li>
 				<li>UVGenerator —  Object. object that provides UV generator functions</li>

+ 2 - 0
docs/api/en/geometries/ExtrudeGeometry.html

@@ -51,6 +51,7 @@
 			bevelEnabled: true,
 			bevelEnabled: true,
 			bevelThickness: 1,
 			bevelThickness: 1,
 			bevelSize: 1,
 			bevelSize: 1,
+			bevelOffset: 0,
 			bevelSegments: 1
 			bevelSegments: 1
 		};
 		};
 
 
@@ -76,6 +77,7 @@
 				<li>bevelEnabled — bool. Apply beveling to the shape. Default is true.</li>
 				<li>bevelEnabled — bool. Apply beveling to the shape. Default is true.</li>
 				<li>bevelThickness — float. How deep into the original shape the bevel goes. Default is 6.</li>
 				<li>bevelThickness — float. How deep into the original shape the bevel goes. Default is 6.</li>
 				<li>bevelSize — float. Distance from the shape outline that the bevel extends. Default is bevelThickness - 2.</li>
 				<li>bevelSize — float. Distance from the shape outline that the bevel extends. Default is bevelThickness - 2.</li>
+				<li>bevelOffset — float. Distance from the shape outline that the bevel starts. Default is 0.</li>
 				<li>bevelSegments — int. Number of bevel layers. Default is 3.</li>
 				<li>bevelSegments — int. Number of bevel layers. Default is 3.</li>
 				<li>extrudePath — THREE.CurvePath. A 3D spline path along which the shape should be extruded.</li>
 				<li>extrudePath — THREE.CurvePath. A 3D spline path along which the shape should be extruded.</li>
 				<li>UVGenerator —  Object. object that provides UV generator functions</li>
 				<li>UVGenerator —  Object. object that provides UV generator functions</li>

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

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

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

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

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

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

+ 3 - 1
docs/api/en/geometries/TextBufferGeometry.html

@@ -8,7 +8,7 @@
 		<link type="text/css" rel="stylesheet" href="page.css" />
 		<link type="text/css" rel="stylesheet" href="page.css" />
 	</head>
 	</head>
 	<body>
 	<body>
-		[page:ExtrudeBufferGeometry] &rarr;
+		[page:BufferGeometry] &rarr; [page:ExtrudeBufferGeometry] &rarr;
 
 
 		<h1>[name]</h1>
 		<h1>[name]</h1>
 
 
@@ -55,6 +55,7 @@
 				bevelEnabled: true,
 				bevelEnabled: true,
 				bevelThickness: 10,
 				bevelThickness: 10,
 				bevelSize: 8,
 				bevelSize: 8,
+				bevelOffset: 0,
 				bevelSegments: 5
 				bevelSegments: 5
 			} );
 			} );
 		} );
 		} );
@@ -74,6 +75,7 @@
 			<li>bevelEnabled — Boolean. Turn on bevel. Default is False.</li>
 			<li>bevelEnabled — Boolean. Turn on bevel. Default is False.</li>
 			<li>bevelThickness — Float. How deep into text bevel goes. Default is 10.</li>
 			<li>bevelThickness — Float. How deep into text bevel goes. Default is 10.</li>
 			<li>bevelSize — Float. How far from text outline is bevel. Default is 8.</li>
 			<li>bevelSize — Float. How far from text outline is bevel. Default is 8.</li>
+			<li>bevelOffset — Float. How far from text outline bevel starts. Default is 0.</li>
 			<li>bevelSegments — Integer. Number of bevel segments. Default is 3.</li>
 			<li>bevelSegments — Integer. Number of bevel segments. Default is 3.</li>
 		</ul>
 		</ul>
 		</p>
 		</p>

+ 3 - 1
docs/api/en/geometries/TextGeometry.html

@@ -8,7 +8,7 @@
 		<link type="text/css" rel="stylesheet" href="page.css" />
 		<link type="text/css" rel="stylesheet" href="page.css" />
 	</head>
 	</head>
 	<body>
 	<body>
-		[page:ExtrudeGeometry] &rarr;
+		[page:Geometry] &rarr; [page:ExtrudeGeometry] &rarr;
 
 
 		<h1>[name]</h1>
 		<h1>[name]</h1>
 
 
@@ -55,6 +55,7 @@
 				bevelEnabled: true,
 				bevelEnabled: true,
 				bevelThickness: 10,
 				bevelThickness: 10,
 				bevelSize: 8,
 				bevelSize: 8,
+				bevelOffset: 0,
 				bevelSegments: 5
 				bevelSegments: 5
 			} );
 			} );
 		} );
 		} );
@@ -74,6 +75,7 @@
 			<li>bevelEnabled — Boolean. Turn on bevel. Default is False.</li>
 			<li>bevelEnabled — Boolean. Turn on bevel. Default is False.</li>
 			<li>bevelThickness — Float. How deep into text bevel goes. Default is 10.</li>
 			<li>bevelThickness — Float. How deep into text bevel goes. Default is 10.</li>
 			<li>bevelSize — Float. How far from text outline is bevel. Default is 8.</li>
 			<li>bevelSize — Float. How far from text outline is bevel. Default is 8.</li>
+			<li>bevelOffset — Float. How far from text outline bevel starts. Default is 0.</li>
 			<li>bevelSegments — Integer. Number of bevel segments. Default is 3.</li>
 			<li>bevelSegments — Integer. Number of bevel segments. Default is 3.</li>
 		</ul>
 		</ul>
 		</p>
 		</p>

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

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

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

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

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

@@ -8,13 +8,13 @@
 		<link type="text/css" rel="stylesheet" href="page.css" />
 		<link type="text/css" rel="stylesheet" href="page.css" />
 	</head>
 	</head>
 	<body>
 	<body>
-		[page:LineSegments] &rarr;
+		[page:Object3D] &rarr; [page:Line] &rarr; [page:LineSegments] &rarr;
 
 
 		<h1>[name]</h1>
 		<h1>[name]</h1>
 
 
 		<p class="desc">
 		<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,
 			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].
 			so it won't work with [page:Sprite Sprites].
 		</p>
 		</p>
@@ -28,10 +28,10 @@
 
 
 
 
 		<code>
 		<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>
 		</code>
 
 
 
 

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

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

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

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

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

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

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

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

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

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

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

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

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

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

@@ -67,9 +67,10 @@
 		[page:Light source] light into this one.
 		[page:Light source] light into this one.
 		</p>
 		</p>
 
 
-		<h3>[method:JSON toJSON]( [param:String meta] )</h3>
+		<h3>[method:Object toJSON]( [param:object meta] )</h3>
 		<p>
 		<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>
 		</p>
 
 
 		<h2>Source</h2>
 		<h2>Source</h2>

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

@@ -307,10 +307,10 @@
 		Sets the properties based on the *values*.
 		Sets the properties based on the *values*.
 		</p>
 		</p>
 
 
-		<h3>[method:null toJSON]( [param:object meta] )</h3>
+		<h3>[method:Object toJSON]( [param:object meta] )</h3>
 		<p>
 		<p>
 		meta -- object containing metadata such as textures or images for the material.<br />
 		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>
 		</p>
 
 
 		<h2>Source</h2>
 		<h2>Source</h2>

+ 131 - 0
docs/api/en/materials/MeshDistanceMaterial.html

@@ -0,0 +1,131 @@
+<!DOCTYPE html>
+<html lang="en">
+	<head>
+		<meta charset="utf-8" />
+		<base href="../../../" />
+		<script src="list.js"></script>
+		<script src="page.js"></script>
+		<link type="text/css" rel="stylesheet" href="page.css" />
+	</head>
+	<body>
+		[page:Material] &rarr;
+
+		<h1>[name]</h1>
+
+		<p class="desc">
+			[name] is internally used for implementing shadow mapping with [page:PointLight]s.<br/><br/>
+
+			Can also be used to customize the shadow casting of an object by assigning an instance of [name] to [page:Object3D.customDistanceMaterial].
+			The following examples demonstrates this approach in order to ensure transparent parts of objects do no cast shadows.
+		</p>
+
+		<h2>Example</h2>
+
+		[example:webgl_shadowmap_pointlight WebGL / shadowmap / pointlight]
+
+		<script>
+
+		// iOS iframe auto-resize workaround
+
+		if ( /(iPad|iPhone|iPod)/g.test( navigator.userAgent ) ) {
+
+			var scene = document.getElementById( 'scene' );
+
+			scene.style.width = getComputedStyle( scene ).width;
+			scene.style.height = getComputedStyle( scene ).height;
+			scene.setAttribute( 'scrolling', 'no' );
+
+		}
+
+		</script>
+
+		<h2>Constructor</h2>
+
+		<h3>[name]( [param:Object parameters] )</h3>
+		<p>
+			[page:Object parameters] - (optional) an object with one or more properties defining the material's appearance.
+			Any property of the material (including any property inherited from [page:Material]) can be passed in here.
+		</p>
+
+		<h2>Properties</h2>
+		<p>See the base [page:Material] class for common properties.</p>
+
+		<h3>[property:Texture alphaMap]</h3>
+		<p>The alpha map is a grayscale texture that controls the opacity across the surface
+			(black: fully transparent; white: fully opaque). Default is null.<br /><br />
+
+			Only the color of the texture is used, ignoring the alpha channel if one exists.
+			For RGB and RGBA textures, the [page:WebGLRenderer WebGL] renderer will use the
+			green channel when sampling this texture due to the extra bit of precision provided
+			for green in DXT-compressed and uncompressed RGB 565 formats. Luminance-only and
+			luminance/alpha textures will also still work as expected.
+		</p>
+
+		<h3>[property:Texture displacementMap]</h3>
+		<p>
+			The displacement map affects the position of the mesh's vertices. Unlike other maps
+			which only affect the light and shade of the material the displaced vertices can cast shadows,
+			block other objects, and otherwise act as real geometry. The displacement texture is
+			an image where the value of each pixel (white being the highest) is mapped against,
+			and repositions, the vertices of the mesh.
+		</p>
+
+		<h3>[property:Float displacementScale]</h3>
+		<p>
+			How much the displacement map affects the mesh (where black is no displacement,
+			and white is maximum displacement). Without a displacement map set, this value is not applied.
+			 Default is 1.
+		</p>
+
+		<h3>[property:Float displacementBias]</h3>
+		<p>
+			The offset of the displacement map's values on the mesh's vertices.
+			Without a displacement map set, this value is not applied. Default is 0.
+		</p>
+
+		<h3>[property:Float farDistance]</h3>
+		<p>
+			The far value of the point light's internal shadow camera.
+		</p>
+
+		<h3>[property:Boolean fog]</h3>
+		<p>Whether the material is affected by fog. Default is *false*.</p>
+
+		<h3>[property:Boolean isMeshDistanceMaterial]</h3>
+		<p>
+			Used to check whether this or derived classes are mesh depth materials. Default is *true*.<br /><br />
+
+			You should not change this, as it used internally for optimisation.
+		</p>
+
+		<h3>[property:Boolean lights]</h3>
+		<p>Whether the material is affected by lights. Default is *false*.</p>
+
+		<h3>[property:Texture map]</h3>
+		<p>The color map. Default is  null.</p>
+
+		<h3>[property:boolean morphTargets]</h3>
+		<p>Define whether the material uses morphTargets. Default is false.</p>
+
+		<h3>[property:Float nearDistance]</h3>
+		<p>
+			The near value of the point light's internal shadow camera.
+		</p>
+
+		<h3>[property:Vector3 referencePosition]</h3>
+		<p>
+			The position of the point light in world space.
+		</p>
+
+		<h3>[property:Boolean skinning]</h3>
+		<p>Define whether the material uses skinning. Default is false.</p>
+
+		<h2>Methods</h2>
+		<p>See the base [page:Material] class for common methods.</p>
+
+
+		<h2>Source</h2>
+
+		[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
+	</body>
+</html>

+ 150 - 0
docs/api/en/materials/MeshMatcapMaterial.html

@@ -0,0 +1,150 @@
+<!DOCTYPE html>
+<html lang="en">
+	<head>
+		<meta charset="utf-8" />
+		<base href="../../../" />
+		<script src="list.js"></script>
+		<script src="page.js"></script>
+		<link type="text/css" rel="stylesheet" href="page.css" />
+	</head>
+	<body>
+		[page:Material] &rarr;
+
+		<h1>[name]</h1>
+
+		<p class="desc">
+			[name] is defined by a MatCap (or Lit Sphere) texture, which encodes the material color and shading.<br/><br/>
+			[name] does not respond to lights since the matcap image file encodes baked lighting.
+			It will cast a shadow onto an object that receives shadows (and shadow clipping works), but it will not self-shadow or receive shadows.
+		</p>
+
+		<iframe id="scene" src="scenes/material-browser.html#MeshMatcapMaterial"></iframe>
+
+		<script>
+
+		// iOS iframe auto-resize workaround
+
+		if ( /(iPad|iPhone|iPod)/g.test( navigator.userAgent ) ) {
+
+			var scene = document.getElementById( 'scene' );
+
+			scene.style.width = getComputedStyle( scene ).width;
+			scene.style.height = getComputedStyle( scene ).height;
+			scene.setAttribute( 'scrolling', 'no' );
+
+		}
+
+		</script>
+
+		<h2>Constructor</h2>
+
+		<h3>[name]( [param:Object parameters] )</h3>
+		<p>
+			[page:Object parameters] - (optional) an object with one or more properties defining the material's appearance.
+			Any property of the material (including any property inherited from [page:Material]) can be passed in here.<br /><br />
+
+			The exception is the property [page:Hexadecimal color], which can be passed in as a hexadecimal
+			string and is *0xffffff* (white) by default. [page:Color.set]( color ) is called internally.
+		</p>
+
+		<h2>Properties</h2>
+		<p>See the base [page:Material] class for common properties.</p>
+
+		<h3>[property:Texture alphaMap]</h3>
+		<p>The alpha map is a grayscale texture that controls the opacity across the surface
+			(black: fully transparent; white: fully opaque). Default is null.<br /><br />
+
+			Only the color of the texture is used, ignoring the alpha channel if one exists.
+			For RGB and RGBA textures, the [page:WebGLRenderer WebGL] renderer will use the
+			green channel when sampling this texture due to the extra bit of precision provided
+			for green in DXT-compressed and uncompressed RGB 565 formats. Luminance-only and
+			luminance/alpha textures will also still work as expected.
+		</p>
+
+		<h3>[property:Texture bumpMap]</h3>
+		<p>
+			The texture to create a bump map. The black and white values map to the perceived depth in relation to the lights.
+			Bump doesn't actually affect the geometry of the object, only the lighting. If a normal map is defined this will
+			be ignored.
+		</p>
+
+		<h3>[property:Float bumpScale]</h3>
+		<p>How much the bump map affects the material. Typical ranges are 0-1. Default is 1.</p>
+
+		<h3>[property:Color color]</h3>
+		<p>[page:Color] of the material, by default set to white (0xffffff).</p>
+
+		<h3>[property:Texture displacementMap]</h3>
+		<p>
+			The displacement map affects the position of the mesh's vertices. Unlike other maps
+			which only affect the light and shade of the material the displaced vertices can cast shadows,
+			block other objects, and otherwise act as real geometry. The displacement texture is
+			an image where the value of each pixel (white being the highest) is mapped against,
+			and repositions, the vertices of the mesh.
+		</p>
+
+		<h3>[property:Float displacementScale]</h3>
+		<p>
+			How much the displacement map affects the mesh (where black is no displacement,
+			and white is maximum displacement). Without a displacement map set, this value is not applied.
+			 Default is 1.
+		</p>
+
+		<h3>[property:Float displacementBias]</h3>
+		<p>
+			The offset of the displacement map's values on the mesh's vertices.
+			Without a displacement map set, this value is not applied. Default is 0.
+		</p>
+
+		<h3>[property:Boolean isMeshMatcapMaterial]</h3>
+		<p>
+			Used to check whether this or derived classes are mesh Matcap materials. Default is *true*.<br /><br />
+
+			You should not change this, as it used internally for optimisation.
+		</p>
+
+		<h3>[property:Texture map]</h3>
+		<p>The color map. Default is null. The texture map color is modulated by the diffuse [page:.color].</p>
+
+		<h3>[property:Texture matcap]</h3>
+		<p>The matcap map. Default is null.</p>
+
+		<h3>[property:boolean morphNormals]</h3>
+		<p>
+			Defines whether the material uses morphNormals. Set as true to pass morphNormal
+			attributes from the [page:Geometry]	to the shader. Default is *false*.
+		</p>
+
+		<h3>[property:Boolean morphTargets]</h3>
+		<p>Define whether the material uses morphTargets. Default is false.</p>
+
+		<h3>[property:Texture normalMap]</h3>
+		<p>
+			The texture to create a normal map. The RGB values affect the surface normal for each pixel fragment and change
+			the way the color is lit. Normal maps do not change the actual shape of the surface, only the lighting.
+		</p>
+
+		<h3>[property:Integer normalMapType]</h3>
+		<p>
+			The type of normal map.<br /><br />
+
+			Options are [page:constant THREE.TangentSpaceNormalMap] (default), and [page:constant THREE.ObjectSpaceNormalMap].
+		</p>
+
+		<h3>[property:Vector2 normalScale]</h3>
+		<p>
+			How much the normal map affects the material. Typical ranges are 0-1.
+			Default is a [page:Vector2] set to (1,1).
+		</p>
+
+		<h3>[property:Boolean skinning]</h3>
+		<p>Define whether the material uses skinning. Default is false.</p>
+
+		<h2>Methods</h2>
+		<p>See the base [page:Material] class for common methods.</p>
+
+		<h2>Source</h2>
+
+		[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
+	</body>
+</html>

+ 61 - 1
docs/api/en/materials/MeshNormalMaterial.html

@@ -44,6 +44,38 @@
 		<h2>Properties</h2>
 		<h2>Properties</h2>
 		<p>See the base [page:Material] class for common properties.</p>
 		<p>See the base [page:Material] class for common properties.</p>
 
 
+		<h3>[property:Texture bumpMap]</h3>
+		<p>
+			The texture to create a bump map. The black and white values map to the perceived depth in relation to the lights.
+			Bump doesn't actually affect the geometry of the object, only the lighting. If a normal map is defined this will
+			be ignored.
+		</p>
+
+		<h3>[property:Float bumpScale]</h3>
+		<p>How much the bump map affects the material. Typical ranges are 0-1. Default is 1.</p>
+
+		<h3>[property:Texture displacementMap]</h3>
+		<p>
+			The displacement map affects the position of the mesh's vertices. Unlike other maps
+			which only affect the light and shade of the material the displaced vertices can cast shadows,
+			block other objects, and otherwise act as real geometry. The displacement texture is
+			an image where the value of each pixel (white being the highest) is mapped against,
+			and repositions, the vertices of the mesh.
+		</p>
+
+		<h3>[property:Float displacementScale]</h3>
+		<p>
+			How much the displacement map affects the mesh (where black is no displacement,
+			and white is maximum displacement). Without a displacement map set, this value is not applied.
+			 Default is 1.
+		</p>
+
+		<h3>[property:Float displacementBias]</h3>
+		<p>
+			The offset of the displacement map's values on the mesh's vertices.
+			Without a displacement map set, this value is not applied. Default is 0.
+		</p>
+
 		<h3>[property:Boolean fog]</h3>
 		<h3>[property:Boolean fog]</h3>
 		<p>Whether the material is affected by fog. Default is *false*.</p>
 		<p>Whether the material is affected by fog. Default is *false*.</p>
 
 
@@ -57,9 +89,37 @@
 		<h3>[property:Boolean lights]</h3>
 		<h3>[property:Boolean lights]</h3>
 		<p>Whether the material is affected by lights. Default is *false*.</p>
 		<p>Whether the material is affected by lights. Default is *false*.</p>
 
 
-		<h3>[property:boolean morphTargets]</h3>
+		<h3>[property:boolean morphNormals]</h3>
+		<p>
+			Defines whether the material uses morphNormals. Set as true to pass morphNormal
+			attributes from the [page:Geometry]	to the shader. Default is *false*.
+		</p>
+
+		<h3>[property:Boolean morphTargets]</h3>
 		<p>Define whether the material uses morphTargets. Default is false.</p>
 		<p>Define whether the material uses morphTargets. Default is false.</p>
 
 
+		<h3>[property:Texture normalMap]</h3>
+		<p>
+			The texture to create a normal map. The RGB values affect the surface normal for each pixel fragment and change
+			the way the color is lit. Normal maps do not change the actual shape of the surface, only the lighting.
+		</p>
+
+		<h3>[property:Integer normalMapType]</h3>
+		<p>
+			The type of normal map.<br /><br />
+
+			Options are [page:constant THREE.TangentSpaceNormalMap] (default), and [page:constant THREE.ObjectSpaceNormalMap].
+		</p>
+
+		<h3>[property:Vector2 normalScale]</h3>
+		<p>
+			How much the normal map affects the material. Typical ranges are 0-1.
+			Default is a [page:Vector2] set to (1,1).
+		</p>
+
+		<h3>[property:Boolean skinning]</h3>
+		<p>Define whether the material uses skinning. Default is false.</p>
+
 		<h3>[property:boolean wireframe]</h3>
 		<h3>[property:boolean wireframe]</h3>
 		<p>
 		<p>
 			Render geometry as wireframe. Default is false (i.e. render as smooth shaded).
 			Render geometry as wireframe. Default is false (i.e. render as smooth shaded).

+ 2 - 2
docs/api/en/materials/MeshToonMaterial.html

@@ -14,7 +14,7 @@
 
 
 		<div class="desc">An extension of the [page:MeshPhongMaterial] with toon shading.</div>
 		<div class="desc">An extension of the [page:MeshPhongMaterial] with toon shading.</div>
 
 
-		<!-- <iframe id="scene" src="scenes/material-browser.html#MeshStandardMaterial"></iframe>
+		<iframe id="scene" src="scenes/material-browser.html#MeshToonMaterial"></iframe>
 
 
 		<script>
 		<script>
 
 
@@ -30,7 +30,7 @@
 
 
 		}
 		}
 
 
-		</script> -->
+		</script>
 
 
 		<h2>Examples</h2>
 		<h2>Examples</h2>
 		[example:webgl_materials_variations_toon materials / variations / toon]<br />
 		[example:webgl_materials_variations_toon materials / variations / toon]<br />

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

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

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

@@ -12,11 +12,31 @@
 
 
 		<p class="desc">
 		<p class="desc">
 			Represents a box or cube in 3D space. The main purpose of this is to represent
 			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>
 		</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>
 		<h2>Constructor</h2>
 
 
 
 

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

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

+ 2 - 2
docs/api/en/objects/LOD.html

@@ -72,7 +72,7 @@ scene.add( lod );
 		<h2>Methods</h2>
 		<h2>Methods</h2>
 		<p>See the base [page:Object3D] class for common methods.</p>
 		<p>See the base [page:Object3D] class for common methods.</p>
 
 
-		<h3>[method:null addLevel]( [param:Object3D object], [param:Float distance] )</h3>
+		<h3>[method:this addLevel]( [param:Object3D object], [param:Float distance] )</h3>
 		<p>
 		<p>
 		[page:Object3D object] - The [page:Object3D] to display at this level.<br />
 		[page:Object3D object] - The [page:Object3D] to display at this level.<br />
 		[page:Float distance] - The distance at which to display this level of detail.<br /><br />
 		[page:Float distance] - The distance at which to display this level of detail.<br /><br />
@@ -100,7 +100,7 @@ scene.add( lod );
 
 
 
 
 
 
-		<h3>[method:null toJSON]( meta )</h3>
+		<h3>[method:Object toJSON]( meta )</h3>
 		<p>
 		<p>
 		Create a JSON structure with details of this LOD object.
 		Create a JSON structure with details of this LOD object.
 		</p>
 		</p>

+ 18 - 5
docs/api/en/renderers/WebGLRenderer.html

@@ -55,7 +55,10 @@
 
 
 		[page:String powerPreference] - Provides a hint to the user agent indicating what configuration
 		[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"*.
 		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
 		[page:Boolean depth] - whether the drawing buffer has a
 		[link:https://en.wikipedia.org/wiki/Z-buffering depth buffer] of at least 16 bits.
 		[link:https://en.wikipedia.org/wiki/Z-buffering depth buffer] of at least 16 bits.
@@ -92,6 +95,15 @@
 			Default is *true*.
 			Default is *true*.
 		</p>
 		</p>
 
 
+		<h3>[property:Boolean debug.checkShaderErrors]</h3>
+		<p>
+			If [page:.checkShaderErrors checkShaderErrors] is true, defines whether material shader programs are checked
+			for errors during compilation and linkage process. It may be useful to disable this check in production for performance gain.
+			It is strongly recommended to keep these checks enabled during development.
+			If the shader does not compile and link - it will not work and associated material will not render.
+			Default is *true*.
+		</p>
+
 		<h3>[property:Object capabilities]</h3>
 		<h3>[property:Object capabilities]</h3>
 		<p>
 		<p>
 		An object containing details about the capabilities of the current [link:https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext RenderingContext].<br />
 		An object containing details about the capabilities of the current [link:https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext RenderingContext].<br />
@@ -101,6 +113,7 @@
 		- [page:Boolean floatVertexTextures]: *true* if [page:Boolean floatFragmentTextures] and [page:Boolean vertexTextures] are both true.<br />
 		- [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 getMaxAnisotropy](): Returns the maximum available anisotropy.<br />
 		- [page:Method getMaxPrecision](): Returns the maximum available precision for vertex and fragment shaders. <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
 		- [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.
 		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 />
 			According to [link:https://webglstats.com/ WebGLStats], as of February 2016 around 66% of WebGL enabled devices support this.<br />
@@ -385,11 +398,11 @@
 		<h3>[method:null resetGLState]( )</h3>
 		<h3>[method:null resetGLState]( )</h3>
 		<p>Reset the GL state to default. Called internally if the WebGL context is lost.</p>
 		<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>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>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>
 		<h3>[method:null render]( [param:Scene scene], [param:Camera camera] )</h3>
@@ -416,7 +429,7 @@
 
 
 		<h3>[method:null setAnimationLoop]( [param:Function callback] )</h3>
 		<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>[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>
 		<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>
 		<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

@@ -46,9 +46,10 @@
 
 
 		<h2>Methods</h2>
 		<h2>Methods</h2>
 
 
-		<h3>[method:JSON toJSON]</h3>
+		<h3>[method:Object toJSON]</h3>
 		<p>
 		<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>
 		</p>
 
 
 		<h3>[method:null dispose]()</h3>
 		<h3>[method:null dispose]()</h3>

+ 10 - 5
docs/api/en/textures/Texture.html

@@ -187,13 +187,18 @@
 
 
 		<h3>[property:boolean premultiplyAlpha]</h3>
 		<h3>[property:boolean premultiplyAlpha]</h3>
 		<p>
 		<p>
-		False by default, which is the norm for PNG images. Set to true if the RGB values have
-		been stored premultiplied by alpha.
+		If set to *true*, the alpha channel, if present, is multiplied into the color channels when the texture is uploaded to the GPU. Defaut is *false*.<br /><br />
+
+		Note that this property has no effect for [link:https://developer.mozilla.org/de/docs/Web/API/ImageBitmap ImageBitmap].
+		You need to configure on bitmap creation instead. See [page:ImageBitmapLoader].
 		</p>
 		</p>
 
 
 		<h3>[property:boolean flipY]</h3>
 		<h3>[property:boolean flipY]</h3>
 		<p>
 		<p>
-		True by default. Flips the image's Y axis to match the WebGL texture coordinate space.
+		If set to *true*, the texture is flipped along the vertical axis when uploaded to the GPU. Default is *true*.<br /><br />
+
+		Note that this property has no effect for [link:https://developer.mozilla.org/de/docs/Web/API/ImageBitmap ImageBitmap].
+		You need to configure on bitmap creation instead. See [page:ImageBitmapLoader].
 		</p>
 		</p>
 
 
 		<h3>[property:number unpackAlignment]</h3>
 		<h3>[property:number unpackAlignment]</h3>
@@ -246,10 +251,10 @@
 		Make copy of the texture. Note this is not a "deep copy", the image is shared.
 		Make copy of the texture. Note this is not a "deep copy", the image is shared.
 		</p>
 		</p>
 
 
-		<h3>[method:Texture toJSON]( [param:Object meta] )</h3>
+		<h3>[method:Object toJSON]( [param:Object meta] )</h3>
 		<p>
 		<p>
 		meta -- optional object containing metadata.<br />
 		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>
 		</p>
 
 
 		<h3>[method:null dispose]()</h3>
 		<h3>[method:null dispose]()</h3>

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

@@ -49,7 +49,7 @@
 		</ul>
 		</ul>
 
 
 		<p>
 		<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>
 
 
 		<p>
 		<p>

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

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

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

@@ -10,8 +10,8 @@
 	<body>
 	<body>
 		<h1>[name]</h1>
 		<h1>[name]</h1>
 		<p class="desc">
 		<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>
 		</p>
 
 
 
 

+ 1 - 1
docs/api/zh/core/Object3D.html

@@ -44,7 +44,7 @@
 	</p>
 	</p>
 
 
 	<h3>[property:Material customDistanceMaterial]</h3>
 	<h3>[property:Material customDistanceMaterial]</h3>
-	<p>与customDepthMaterial相同,但与[page:PointLight]一起使用。默认值为*undefined*。
+	<p>与[page:.customDepthMaterial customDepthMaterial]相同,但与[page:PointLight]一起使用。默认值为*undefined*。
 	</p>
 	</p>
 
 
 	<h3>[property:Boolean frustumCulled]</h3>
 	<h3>[property:Boolean frustumCulled]</h3>

+ 112 - 0
docs/api/zh/materials/MeshDistanceMaterial.html

@@ -0,0 +1,112 @@
+<!DOCTYPE html>
+<html lang="en">
+	<head>
+		<meta charset="utf-8" />
+		<base href="../../../" />
+		<script src="list.js"></script>
+		<script src="page.js"></script>
+		<link type="text/css" rel="stylesheet" href="page.css" />
+	</head>
+	<body>
+		[page:Material] &rarr;
+
+		<h1>[name]</h1>
+
+		<p class="desc">
+			TODO
+		</p>
+
+		<h2>Example</h2>
+
+		[example:webgl_shadowmap_pointlight WebGL / shadowmap / pointlight]
+
+		<script>
+
+		// iOS iframe auto-resize workaround
+
+		if ( /(iPad|iPhone|iPod)/g.test( navigator.userAgent ) ) {
+
+			var scene = document.getElementById( 'scene' );
+
+			scene.style.width = getComputedStyle( scene ).width;
+			scene.style.height = getComputedStyle( scene ).height;
+			scene.setAttribute( 'scrolling', 'no' );
+
+		}
+
+		</script>
+
+		<h2>构造函数(Constructor)</h2>
+
+		<h3>[name]( [param:Object parameters] )</h3>
+		<p>[page:Object parameters] - (可选)用于定义材质外观的对象,具有一个或多个属性。
+			材质的任何属性都可以从此处传入(包括从[page:Material]继承的任何属性)。
+		</p>
+
+		<h2>属性(Properties)</h2>
+		<p>常用属性请参见基类[page:Material]。</p>
+
+		<h3>[property:Texture alphaMap]</h3>
+		<p>alpha贴图是一种灰度纹理,用于控制整个表面的不透明度(黑色:完全透明;白色:完全不透明)。默认值为null。<br /><br />
+			仅使用纹理的颜色,忽略alpha通道(如果存在)。对于RGB和RGBA纹理,[page:WebGLRenderer WebGL]渲染器在采样此纹理时将使用绿色通道,
+			因为在DXT压缩和未压缩RGB 565格式中为绿色提供了额外的精度。Luminance-only以及luminance/alpha纹理也仍然有效。
+		</p>
+
+		<h3>[property:Texture displacementMap]</h3>
+		<p> 位移贴图会影响网格顶点的位置,与仅影响材质的光照和阴影的其他贴图不同,移位的顶点可以投射阴影,阻挡其他对象,以及充当真实的几何体。
+			位移纹理是指:网格的所有顶点被映射为图像中每个像素的值(白色是最高的),并且被重定位。
+		</p>
+
+		<h3>[property:Float displacementScale]</h3>
+		<p>位移贴图对网格的影响程度(黑色是无位移,白色是最大位移)。如果没有设置位移贴图,则不会应用此值。默认值为1。
+		</p>
+
+		<h3>[property:Float displacementBias]</h3>
+		<p> 位移贴图在网格顶点上的偏移量。如果没有设置位移贴图,则不会应用此值。默认值为0。
+		</p>
+
+		<h3>[property:Float farDistance]</h3>
+		<p>
+			TODO
+		</p>
+
+		<h3>[property:Boolean fog]</h3>
+		<p> 材质是否受雾影响。默认值为*false*。</p>
+
+		<h3>[property:Boolean isMeshDistanceMaterial]</h3>
+		<p> 用于检查此类或派生类是否为深度网格材质。默认值为 *true*。<br /><br />
+
+			因为其通常用在内部优化,所以不应该更改该属性值。
+		</p>
+
+		<h3>[property:Boolean lights]</h3>
+		<p>材质是否受到光照的影响。默认值为 *false*。</p>
+
+		<h3>[property:Texture map]</h3>
+		<p>颜色贴图。默认为null。</p>
+
+		<h3>[property:boolean morphTargets]</h3>
+		<p>材质是否使用morphTargets。默认值为false。</p>
+
+		<h3>[property:Float nearDistance]</h3>
+		<p>
+			TODO
+		</p>
+
+		<h3>[property:Vector3 referencePosition]</h3>
+		<p>
+			TODO
+		</p>
+
+		<h3>[property:Boolean skinning]</h3>
+		<p>材质是否使用蒙皮。默认值为false。</p>
+
+		<h2>方法(Methods)</h2>
+		<p>常用方法请参见基类[page:Material]。</p>
+
+
+		<h2>源码(Source)</h2>
+
+		[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
+	</body>
+</html>

+ 120 - 0
docs/api/zh/materials/MeshMatcapMaterial.html

@@ -0,0 +1,120 @@
+<!DOCTYPE html>
+<html lang="en">
+	<head>
+		<meta charset="utf-8" />
+		<base href="../../../" />
+		<script src="list.js"></script>
+		<script src="page.js"></script>
+		<link type="text/css" rel="stylesheet" href="page.css" />
+	</head>
+	<body>
+		[page:Material] &rarr;
+
+		<h1>[name]</h1>
+
+		<p class="desc">
+			TODO
+		</p>
+
+		<iframe id="scene" src="scenes/material-browser.html#MeshMatcapMaterial"></iframe>
+
+		<script>
+
+		// iOS iframe auto-resize workaround
+
+		if ( /(iPad|iPhone|iPod)/g.test( navigator.userAgent ) ) {
+
+			var scene = document.getElementById( 'scene' );
+
+			scene.style.width = getComputedStyle( scene ).width;
+			scene.style.height = getComputedStyle( scene ).height;
+			scene.setAttribute( 'scrolling', 'no' );
+
+		}
+
+		</script>
+
+		<h2>构造函数(Constructor)</h2>
+
+		<h3>[name]( [param:Object parameters] )</h3>
+		<p>[page:Object parameters] - (可选)用于定义材质外观的对象,具有一个或多个属性。
+			材质的任何属性都可以从此处传入(包括从[page:Material]继承的任何属性)。<br /><br />
+			属性[page:Hexadecimal color]例外,其可以作为十六进制字符串传递,默认情况下为 *0xffffff*(白色),内部调用[page:Color.set](color)。
+		</p>
+
+		<h2>属性(Properties)</h2>
+		<p>常用属性请参见基类[page:Material]。</p>
+
+		<h3>[property:Texture alphaMap]</h3>
+		<p>Talpha贴图是一种灰度纹理,用于控制整个表面的不透明度(黑色:完全透明;白色:完全不透明)。默认值为null。<br /><br />
+			仅使用纹理的颜色,忽略alpha通道(如果存在)。对于RGB和RGBA纹理,[page:WebGLRenderer WebGL]渲染器在采样此纹理时将使用绿色通道,
+			因为在DXT压缩和未压缩RGB 565格式中为绿色提供了额外的精度。Luminance-only以及luminance/alpha纹理也仍然有效。
+		</p>
+
+		<h3>[property:Texture bumpMap]</h3>
+		<p> 用于创建凹凸贴图的纹理。黑色和白色值映射到与光照相关的感知深度。凹凸实际上不会影响对象的几何形状,只影响光照。如果定义了法线贴图,则将忽略该贴图。
+		</p>
+
+		<h3>[property:Float bumpScale]</h3>
+		<p> 凹凸贴图会对材质产生多大影响。典型范围是0-1。默认值为1。</p>
+
+		<h3>[property:Color color]</h3>
+		<p>材质的颜色([page:Color]),默认值为白色 (0xffffff)。</p>
+
+		<h3>[property:Texture displacementMap]</h3>
+		<p> 位移贴图会影响网格顶点的位置,与仅影响材质的光照和阴影的其他贴图不同,移位的顶点可以投射阴影,阻挡其他对象,
+			以及充当真实的几何体。位移纹理是指:网格的所有顶点被映射为图像中每个像素的值(白色是最高的),并且被重定位。
+		</p>
+
+		<h3>[property:Float displacementScale]</h3>
+		<p> 位移贴图对网格的影响程度(黑色是无位移,白色是最大位移)。如果没有设置位移贴图,则不会应用此值。默认值为1。
+		</p>
+
+		<h3>[property:Float displacementBias]</h3>
+		<p>
+			位移贴图在网格顶点上的偏移量。如果没有设置位移贴图,则不会应用此值。默认值为0。
+		</p>
+
+		<h3>[property:Boolean isMeshMatcapMaterial]</h3>
+		<p>TODO<br /><br />
+
+			因为其通常用在内部优化,所以不应该更改该属性值。
+		</p>
+
+		<h3>[property:Texture map]</h3>
+		<p>颜色贴图。默认为null。纹理贴图颜色由漫反射颜色[page:.color]调节。</p>
+
+		<h3>[property:Texture matcap]</h3>
+		<p>TODO</p>
+
+		<h3>[property:boolean morphNormals]</h3>
+		<p> 定义是否使用morphNormals。设置为true可将morphNormal属性从[page:Geometry]传递到shader。默认值为*false*。
+		</p>
+
+		<h3>[property:Boolean morphTargets]</h3>
+		<p>定义材质是否使用morphTargets。默认值为false。</p>
+
+		<h3>[property:Texture normalMap]</h3>
+		<p> 用于创建法线贴图的纹理。RGB值会影响每个像素片段的曲面法线,并更改颜色照亮的方式。法线贴图不会改变曲面的实际形状,只会改变光照。
+		</p>
+
+		<h3>[property:Integer normalMapType]</h3>
+		<p> 法线贴图的类型。<br /><br />
+			选项为[page:constant THREE.TangentSpaceNormalMap](默认)和[page:constant THREE.ObjectSpaceNormalMap]。
+		</p>
+
+		<h3>[property:Vector2 normalScale]</h3>
+		<p> 法线贴图对材质的影响程度。典型范围是0-1。默认值是[page:Vector2]设置为(1,1)。
+		</p>
+
+		<h3>[property:Boolean skinning]</h3>
+		<p>材质是否使用蒙皮。默认值为false。</p>
+
+		<h2>方法(Methods)</h2>
+		<p>常用方法请参见基类[page:Material]。</p>
+
+		<h2>源码(Source)</h2>
+
+		[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
+	</body>
+</html>

+ 42 - 1
docs/api/zh/materials/MeshNormalMaterial.html

@@ -42,6 +42,27 @@
 		<h2>属性(Properties)</h2>
 		<h2>属性(Properties)</h2>
 		<p>常用属性请参见基类[page:Material]。</p>
 		<p>常用属性请参见基类[page:Material]。</p>
 
 
+		<h3>[property:Texture bumpMap]</h3>
+		<p> 用于创建凹凸贴图的纹理。黑色和白色值映射到与光照相关的感知深度。凹凸实际上不会影响对象的几何形状,只影响光照。如果定义了法线贴图,则将忽略该贴图。
+		</p>
+
+		<h3>[property:Float bumpScale]</h3>
+		<p> 凹凸贴图会对材质产生多大影响。典型范围是0-1。默认值为1。</p>
+
+		<h3>[property:Texture displacementMap]</h3>
+		<p> 位移贴图会影响网格顶点的位置,与仅影响材质的光照和阴影的其他贴图不同,移位的顶点可以投射阴影,阻挡其他对象,
+			以及充当真实的几何体。位移纹理是指:网格的所有顶点被映射为图像中每个像素的值(白色是最高的),并且被重定位。
+		</p>
+
+		<h3>[property:Float displacementScale]</h3>
+		<p> 位移贴图对网格的影响程度(黑色是无位移,白色是最大位移)。如果没有设置位移贴图,则不会应用此值。默认值为1。
+		</p>
+
+		<h3>[property:Float displacementBias]</h3>
+		<p>
+			位移贴图在网格顶点上的偏移量。如果没有设置位移贴图,则不会应用此值。默认值为0。
+		</p>
+
 		<h3>[property:Boolean fog]</h3>
 		<h3>[property:Boolean fog]</h3>
 		<p>材质是否受雾影响。默认值为*false*。</p>
 		<p>材质是否受雾影响。默认值为*false*。</p>
 
 
@@ -54,9 +75,29 @@
 		<h3>[property:Boolean lights]</h3>
 		<h3>[property:Boolean lights]</h3>
 		<p>材质是否受到光照的影响。默认值为 *false*。</p>
 		<p>材质是否受到光照的影响。默认值为 *false*。</p>
 
 
-		<h3>[property:boolean morphTargets]</h3>
+		<h3>[property:boolean morphNormals]</h3>
+		<p> 定义是否使用morphNormals。设置为true可将morphNormal属性从[page:Geometry]传递到shader。默认值为*false*。
+		</p>
+
+		<h3>[property:Boolean morphTargets]</h3>
 		<p>定义材质是否使用morphTargets。默认值为false。</p>
 		<p>定义材质是否使用morphTargets。默认值为false。</p>
 
 
+		<h3>[property:Texture normalMap]</h3>
+		<p> 用于创建法线贴图的纹理。RGB值会影响每个像素片段的曲面法线,并更改颜色照亮的方式。法线贴图不会改变曲面的实际形状,只会改变光照。
+		</p>
+
+		<h3>[property:Integer normalMapType]</h3>
+		<p> 法线贴图的类型。<br /><br />
+			选项为[page:constant THREE.TangentSpaceNormalMap](默认)和[page:constant THREE.ObjectSpaceNormalMap]。
+		</p>
+
+		<h3>[property:Vector2 normalScale]</h3>
+		<p> 法线贴图对材质的影响程度。典型范围是0-1。默认值是[page:Vector2]设置为(1,1)。
+		</p>
+
+		<h3>[property:Boolean skinning]</h3>
+		<p>材质是否使用蒙皮。默认值为false。</p>
+
 		<h3>[property:boolean wireframe]</h3>
 		<h3>[property:boolean wireframe]</h3>
 		<p>
 		<p>
 			将几何体渲染为线框。默认值为*false*(即渲染为平滑着色)。
 			将几何体渲染为线框。默认值为*false*(即渲染为平滑着色)。

+ 2 - 2
docs/api/zh/materials/MeshToonMaterial.html

@@ -14,7 +14,7 @@
 
 
 		<div class="desc">[page:MeshPhongMaterial]卡通着色的扩展。</div>
 		<div class="desc">[page:MeshPhongMaterial]卡通着色的扩展。</div>
 
 
-		<!-- <iframe id="scene" src="scenes/material-browser.html#MeshStandardMaterial"></iframe>
+		<iframe id="scene" src="scenes/material-browser.html#MeshToonMaterial"></iframe>
 
 
 		<script>
 		<script>
 
 
@@ -30,7 +30,7 @@
 
 
 		}
 		}
 
 
-		</script> -->
+		</script>
 
 
 		<h2>例子(Examples)</h2>
 		<h2>例子(Examples)</h2>
 		[example:webgl_materials_variations_toon materials / variations / toon]<br />
 		[example:webgl_materials_variations_toon materials / variations / toon]<br />

+ 2 - 2
docs/api/zh/objects/LOD.html

@@ -69,7 +69,7 @@ scene.add( lod );
 		<h2>方法</h2>
 		<h2>方法</h2>
 		<p>请参阅其基类[page:Object3D]来查看共有方法。</p>
 		<p>请参阅其基类[page:Object3D]来查看共有方法。</p>
 
 
-		<h3>[method:null addLevel]( [param:Object3D object], [param:Float distance] )</h3>
+		<h3>[method:this addLevel]( [param:Object3D object], [param:Float distance] )</h3>
 		<p>
 		<p>
 		[page:Object3D object] —— 在这个层次中将要显示的[page:Object3D]。<br />
 		[page:Object3D object] —— 在这个层次中将要显示的[page:Object3D]。<br />
 		[page:Float distance] —— 将显示这一细节层次的距离。<br /><br />
 		[page:Float distance] —— 将显示这一细节层次的距离。<br /><br />
@@ -96,7 +96,7 @@ scene.add( lod );
 
 
 
 
 
 
-		<h3>[method:null toJSON]( meta )</h3>
+		<h3>[method:Object toJSON]( meta )</h3>
 		<p>
 		<p>
 			使用这个方法,为LOD对象中的每个细节层次创建一个JSON结构。
 			使用这个方法,为LOD对象中的每个细节层次创建一个JSON结构。
 		</p>
 		</p>

+ 9 - 0
docs/api/zh/renderers/WebGLRenderer.html

@@ -79,6 +79,15 @@
 			默认是*true*
 			默认是*true*
 		</p>
 		</p>
 
 
+		<h3>[property:Boolean debug.checkShaderErrors]</h3>
+		<p>
+			如果[page:.checkShaderErrors checkShaderErrors]为true,定义是否检查材质着色器程序
+			编译和链接过程中的错误。 禁用此检查生产以获得性能增益可能很有用。
+			强烈建议在开发期间保持启用这些检查。
+			如果着色器没有编译和链接 - 它将无法工作,并且相关材料将不会呈现。
+			默认是*true*
+		</p>
+
 		<h3>[property:Object capabilities]</h3>
 		<h3>[property:Object capabilities]</h3>
 		<p>
 		<p>
             一个包含当前渲染环境([link:https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext RenderingContext])的功能细节的对象。<br />
             一个包含当前渲染环境([link:https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext RenderingContext])的功能细节的对象。<br />

+ 4 - 0
docs/api/zh/textures/Texture.html

@@ -188,11 +188,15 @@
 		<p>
 		<p>
 			默认为false,这是PNG图像的规范。
 			默认为false,这是PNG图像的规范。
 			如果RGB值已被Alpha预乘,请将其设为true。
 			如果RGB值已被Alpha预乘,请将其设为true。
+			Note that this property has no effect for [link:https://developer.mozilla.org/de/docs/Web/API/ImageBitmap ImageBitmap].
+			You need to configure on bitmap creation instead. See [page:ImageBitmapLoader].
 		</p>
 		</p>
 
 
 		<h3>[property:boolean flipY]</h3>
 		<h3>[property:boolean flipY]</h3>
 		<p>
 		<p>
 		默认为true。翻转图像的Y轴以匹配WebGL纹理坐标空间。
 		默认为true。翻转图像的Y轴以匹配WebGL纹理坐标空间。
+		Note that this property has no effect for [link:https://developer.mozilla.org/de/docs/Web/API/ImageBitmap ImageBitmap].
+		You need to configure on bitmap creation instead. See [page:ImageBitmapLoader].
 		</p>
 		</p>
 
 
 		<h3>[property:number unpackAlignment]</h3>
 		<h3>[property:number unpackAlignment]</h3>

+ 2 - 2
docs/examples/controls/OrbitControls.html

@@ -32,7 +32,7 @@ var scene = new THREE.Scene();
 
 
 var camera = new THREE.PerspectiveCamera( 45, window.innerWidth / window.innerHeight, 1, 10000 );
 var camera = new THREE.PerspectiveCamera( 45, window.innerWidth / window.innerHeight, 1, 10000 );
 
 
-var controls = new THREE.OrbitControls( camera );
+var controls = new THREE.OrbitControls( camera, renderer.domElement );
 
 
 //controls.update() must be called after any manual changes to the camera's transform
 //controls.update() must be called after any manual changes to the camera's transform
 camera.position.set( 0, 20, 100 );
 camera.position.set( 0, 20, 100 );
@@ -54,7 +54,7 @@ function animate() {
 
 
 		<h3>[name]( [param:Camera object], [param:HTMLDOMElement domElement] )</h3>
 		<h3>[name]( [param:Camera object], [param:HTMLDOMElement domElement] )</h3>
 		<p>
 		<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,
 			[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.
 			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

@@ -94,7 +94,7 @@
 			[page:String path] — The path to the MTL file.
 			[page:String path] — The path to the MTL file.
 		</p>
 		</p>
 		<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>
 		</p>
 
 
 
 

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

@@ -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.
 		If an <em>obj</em> object or group uses multiple materials while declaring faces, geometry groups and an array of materials are used.
 		</p>
 		</p>
 
 
-		<h3>[method:OBJLoader setMaterials]( [param:Array materials] )</h3>
+		<h3>[method:OBJLoader setMaterials]( [param:MTLLoader.MaterialCreator materials] )</h3>
 		<p>
 		<p>
-		[page:Array materials] - Array of [page:Material Materials].
+		[page:MTLLoaderMaterialCreator MTLLoader.MaterialCreator materials] - A MaterialCreator instance.
 		</p>
 		</p>
 		<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>
 		</p>
 
 
 		<h3>[method:OBJLoader setPath]( [param:String path] )</h3>
 		<h3>[method:OBJLoader setPath]( [param:String path] )</h3>

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

@@ -13,7 +13,7 @@
 
 
 		<p class="desc">A loader for loading a <em>.obj</em> resource.<br />
 		<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
 			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
 			each texture coordinate vertex, vertex normals, and the faces that make each polygon defined as a list of
 			vertices, and texture vertices.
 			vertices, and texture vertices.
 		</p>
 		</p>

+ 83 - 67
docs/examples/quickhull/QuickHull.html → docs/examples/math/convexhull/ConvexHull.html

@@ -2,7 +2,7 @@
 <html lang="en">
 <html lang="en">
 	<head>
 	<head>
 		<meta charset="utf-8" />
 		<meta charset="utf-8" />
-		<base href="../../" />
+		<base href="../../../" />
 		<script src="list.js"></script>
 		<script src="list.js"></script>
 		<script src="page.js"></script>
 		<script src="page.js"></script>
 		<link type="text/css" rel="stylesheet" href="page.css" />
 		<link type="text/css" rel="stylesheet" href="page.css" />
@@ -11,7 +11,7 @@
 		<h1>[name]</h1>
 		<h1>[name]</h1>
 
 
 		<p class="desc">
 		<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>
 		</p>
 
 
 
 
@@ -24,9 +24,9 @@
 
 
 		<h2>Properties</h2>
 		<h2>Properties</h2>
 
 
-		<h3>[property:Float tolerance]</h3>
+		<h3>[property:VertexList assigned]</h3>
 		<p>
 		<p>
-			The epsilon value that is used for internal comparative operations. The calculation of this value depends on the size of the geometry. Default is -1.
+			This [page:VertexList vertex list] holds all vertices that are assigned to a face. Default is an empty vertex list.
 		</p>
 		</p>
 
 
 		<h3>[property:Array faces]</h3>
 		<h3>[property:Array faces]</h3>
@@ -39,9 +39,9 @@
 			This array holds the faces that are generated within a single iteration. Default is an empty array.
 			This array holds the faces that are generated within a single iteration. Default is an empty array.
 		</p>
 		</p>
 
 
-		<h3>[property:VertexList assigned]</h3>
+		<h3>[property:Float tolerance]</h3>
 		<p>
 		<p>
-			This [page:VertexList vertex list] holds all vertices that are assigned to a face. Default is an empty vertex list.
+			The epsilon value that is used for internal comparative operations. The calculation of this value depends on the size of the geometry. Default is -1.
 		</p>
 		</p>
 
 
 		<h3>[property:VertexList unassigned]</h3>
 		<h3>[property:VertexList unassigned]</h3>
@@ -56,39 +56,67 @@
 
 
 		<h2>Methods</h2>
 		<h2>Methods</h2>
 
 
-		<h3>[method:QuickHull 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>
-
-		<h3>[method:QuickHull setFromObject]( [param:Object3D object] )</h3>
-		[page:Object3D object] - [page:Object3D] to compute the convex hull of.<br /><br />
+		<h3>[method:HalfEdge addAdjoiningFace]( [param:VertexNode eyeVertex], [param:HalfEdge horizonEdge] )</h3>
+		[page:VertexNode eyeVertex] - The vertex that is added to the hull.<br /><br />
+		[page:HalfEdge horizonEdge] - A single edge of the horizon.<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>
+		<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 makeEmpty]()</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>Makes this convex hull empty.</p>
+		<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:VertexNodeNode vertex] - The vertex to add.<br /><br />
 		[page:Face face] - The target face.<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>
 		<p>Adds a vertex to the 'assigned' list of vertices and assigns it to the given face.</p>
 
 
-		<h3>[method:QuickHull 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 />
+		<h3>[method:ConvexHull addVertexToHull]( [param:VertexNode eyeVertex] )</h3>
+		[page:VertexNode eyeVertex] - The vertex that is added to the hull.<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>
+		<p>Adds a vertex to the hull with the following algorithm
+			<ul>
+				<li>Compute the 'horizon' which is a chain of half edges. For an edge to belong to this group it must be the edge connecting a face that can see 'eyeVertex' and a face which cannot see 'eyeVertex'.</li>
+				<li>All the faces that can see 'eyeVertex' have its visible vertices removed from the assigned vertex list.</li>
+				<li>A new set of faces is created with each edge of the 'horizon' and 'eyeVertex'. Each face is connected with the opposite horizon face and the face on the left/right.</li>
+				<li>The vertices removed from all the visible faces are assigned to the new faces if possible.</li>
+			</ul>
+		</p>
 
 
-		<h3>[method:VertexNode removeAllVerticesFromFace]( [param:Face face]	)</h3>
-		[page:Face face] - The given face.<br /><br />
+		<h3>[method:ConvexHull cleanup]()</h3>
 
 
-		<p>Removes all the visible vertices that a given face is able to see which are stored in the 'assigned' vertext list.</p>
+		<p>Cleans up internal properties after computing the convex hull.</p>
+
+		<h3>[method:ConvexHull compute]()</h3>
+
+		<p>Starts the execution of the quick hull algorithm.</p>
+
+		<h3>[method:Object computeExtremes]()</h3>
+
+		<p>Computes the extremes values (min/max vectors) which will be used to compute the inital hull.</p>
+
+		<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 />
+		[page:Array horizon] - The edges that form part of the horizon in CCW order.<br /><br />
+
+		<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: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 deleteFaceVertices]( [param:Face face], [param:Face absorbingFace]	)</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:ConvexHull deleteFaceVertices]( [param:Face face], [param:Face absorbingFace]	)</h3>
 		[page:Face face] - The given face.<br /><br />
 		[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 />
 		[page:Face absorbingFace] - An optional face that tries to absorb the vertices of the first face.<br /><br />
 
 
@@ -100,22 +128,20 @@
 			</ul>
 			</ul>
 		</p>
 		</p>
 
 
-		<h3>[method:QuickHull 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:Vector3 intersectRay]( [param:Ray ray], [param:Vector3 target] )</h3>
+		[page:Ray ray] - The given ray.<br /><br />
+		[page:Vector3 target] - The target vector representing the intersection point.<br /><br />
 
 
-		<h3>[method:Object computeExtremes]()</h3>
+		<p>Performs a ray intersection test with this convext hull. If no intersection is found, *null* is returned.</p>
 
 
-		<p>Computes the extremes values (min/max vectors) which will be used to compute the inital hull.</p>
+		<h3>[method:Boolean intersectsRay]( [param:Ray ray] )</h3>
+		[page:Ray ray] - The given ray.<br /><br />
 
 
-		<h3>[method:QuickHull computeInitialHull]()</h3>
+		<p>Returns *true* if the given ray intersects with this convex hull.</p>
 
 
-		<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 reindexFaces]()</h3>
+		<h3>[method:ConvexHull makeEmpty]()</h3>
 
 
-		<p>Removes inactive (e.g. deleted) faces from the internal face list.</p>
+		<p>Makes this convex hull empty.</p>
 
 
 		<h3>[method:VertexNode nextVertexToAdd]()</h3>
 		<h3>[method:VertexNode nextVertexToAdd]()</h3>
 
 
@@ -127,49 +153,39 @@
 			</ul>
 			</ul>
 		</p>
 		</p>
 
 
-		<h3>[method:QuickHull 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 />
-		[page:Array horizon] - The edges that form part of the horizon in CCW order.<br /><br />
+		<h3>[method:ConvexHull reindexFaces]()</h3>
 
 
-		<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>
+		<p>Removes inactive (e.g. deleted) faces from the internal face list.</p>
 
 
-		<h3>[method:HalfEdge addAdjoiningFace]( [param:VertexNode eyeVertex], [param:HalfEdge horizonEdge] )</h3>
-		[page:VertexNode eyeVertex] - The vertex that is added to the hull.<br /><br />
-		[page:HalfEdge horizonEdge] - A single edge of the horizon.<br /><br />
+		<h3>[method:VertexNode removeAllVerticesFromFace]( [param:Face face]	)</h3>
+		[page:Face face] - The given face.<br /><br />
 
 
-		<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>
+		<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 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 />
+		<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>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>
+		<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 addVertexToHull]( [param:VertexNode eyeVertex] )</h3>
-		[page:VertexNode eyeVertex] - The vertex that is added to the hull.<br /><br />
+		<h3>[method:ConvexHull resolveUnassignedPoints]( [param:Array newFaces]	)</h3>
+		[page:Face newFaces] - An array of new faces.<br /><br />
 
 
-		<p>Adds a vertex to the hull with the following algorithm
-			<ul>
-				<li>Compute the 'horizon' which is a chain of half edges. For an edge to belong to this group it must be the edge connecting a face that can see 'eyeVertex' and a face which cannot see 'eyeVertex'.</li>
-				<li>All the faces that can see 'eyeVertex' have its visible vertices removed from the assigned vertex list.</li>
-				<li>A new set of faces is created with each edge of the 'horizon' and 'eyeVertex'. Each face is connected with the opposite horizon face and the face on the left/right.</li>
-				<li>The vertices removed from all the visible faces are assigned to the new faces if possible.</li>
-			</ul>
-		</p>
+		<p>Reassigns as many vertices as possible from the unassigned list to the new faces.</p>
 
 
-		<h3>[method:QuickHull cleanup]()</h3>
+		<h3>[method:ConvexHull setFromObject]( [param:Object3D object] )</h3>
+		[page:Object3D object] - [page:Object3D] to compute the convex hull of.<br /><br />
 
 
-		<p>Cleans up internal properties after computing the convex hull.</p>
+		<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 compute]()</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>Starts the execution of the quick hull algorithm.</p>
+		<p>Computes to convex hull for the given array of points.</p>
 
 
 		<h2>Source</h2>
 		<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>
 	</body>
 </html>
 </html>

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

@@ -2,7 +2,7 @@
 <html lang="en">
 <html lang="en">
 	<head>
 	<head>
 		<meta charset="utf-8" />
 		<meta charset="utf-8" />
-		<base href="../../" />
+		<base href="../../../" />
 		<script src="list.js"></script>
 		<script src="list.js"></script>
 		<script src="page.js"></script>
 		<script src="page.js"></script>
 		<link type="text/css" rel="stylesheet" href="page.css" />
 		<link type="text/css" rel="stylesheet" href="page.css" />
@@ -84,6 +84,6 @@
 
 
 		<h2>Source</h2>
 		<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>
 	</body>
 </html>
 </html>

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

@@ -2,7 +2,7 @@
 <html lang="en">
 <html lang="en">
 	<head>
 	<head>
 		<meta charset="utf-8" />
 		<meta charset="utf-8" />
-		<base href="../../" />
+		<base href="../../../" />
 		<script src="list.js"></script>
 		<script src="list.js"></script>
 		<script src="page.js"></script>
 		<script src="page.js"></script>
 		<link type="text/css" rel="stylesheet" href="page.css" />
 		<link type="text/css" rel="stylesheet" href="page.css" />
@@ -74,6 +74,6 @@
 
 
 		<h2>Source</h2>
 		<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>
 	</body>
 </html>
 </html>

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

@@ -2,7 +2,7 @@
 <html lang="en">
 <html lang="en">
 	<head>
 	<head>
 		<meta charset="utf-8" />
 		<meta charset="utf-8" />
-		<base href="../../" />
+		<base href="../../../" />
 		<script src="list.js"></script>
 		<script src="list.js"></script>
 		<script src="page.js"></script>
 		<script src="page.js"></script>
 		<link type="text/css" rel="stylesheet" href="page.css" />
 		<link type="text/css" rel="stylesheet" href="page.css" />
@@ -86,6 +86,6 @@
 
 
 		<h2>Source</h2>
 		<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>
 	</body>
 </html>
 </html>

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

@@ -2,7 +2,7 @@
 <html lang="en">
 <html lang="en">
 	<head>
 	<head>
 		<meta charset="utf-8" />
 		<meta charset="utf-8" />
-		<base href="../../" />
+		<base href="../../../" />
 		<script src="list.js"></script>
 		<script src="list.js"></script>
 		<script src="page.js"></script>
 		<script src="page.js"></script>
 		<link type="text/css" rel="stylesheet" href="page.css" />
 		<link type="text/css" rel="stylesheet" href="page.css" />
@@ -47,6 +47,6 @@
 
 
 		<h2>Source</h2>
 		<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>
 	</body>
 </html>
 </html>

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

@@ -61,6 +61,13 @@
 
 
 		<h3>[name]()</h3>
 		<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>
 		<h2>Methods</h2>
 
 
 		<h3>[method:null clear]()</h3>
 		<h3>[method:null clear]()</h3>

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

@@ -26,26 +26,6 @@
 		This is mostly useful for objects that need both a material and a wireframe implementation.
 		This is mostly useful for objects that need both a material and a wireframe implementation.
 		</p>
 		</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>
 		<h2>Source</h2>
 
 
 		[link:https://github.com/mrdoob/three.js/blob/master/examples/js/utils/SceneUtils.js examples/js/utils/SceneUtils.js]
 		[link:https://github.com/mrdoob/three.js/blob/master/examples/js/utils/SceneUtils.js examples/js/utils/SceneUtils.js]

BIN
docs/files/inconsolata.woff


+ 0 - 213
docs/index.css

@@ -1,213 +0,0 @@
-@font-face {
-	font-family: 'inconsolata';
-	src: url('files/inconsolata.woff') format('woff');
-	font-weight: normal;
-	font-style: normal;
-}
-
-* {
-	box-sizing: border-box;
-}
-
-html {
-	height: 100%;
-}
-
-body {
-	background-color: #ffffff;
-	margin: 0px;
-	height: 100%;
-	color: #555;
-	font-family: 'inconsolata';
-	font-size: 15px;
-	line-height: 18px;
-	overflow: hidden;
-}
-
-h1 {
-	margin-top: 30px;
-	margin-bottom: 40px;
-	font-size: 25px;
-	font-weight: normal;
-}
-
-h2 {
-	color: #454545;
-	font-size: 18px;
-	font-weight: normal;
-
-	margin-top: 20px;
-}
-
-h3 {
-	color: #666;
-	font-size: 16px;
-	font-weight: normal;
-
-	margin-top: 20px;
-}
-
-a {
-	color: #2194CE;
-	text-decoration: none;
-}
-
-#panel {
-	position: fixed;
-	left: 0px;
-	width: 260px;
-	height: 100%;
-	overflow: auto;
-	padding: 0px 20px 0px 20px;
-	background: #fafafa;
-}
-
-#panel ul {
-	list-style-type: none;
-	padding: 0px;
-}
-
-iframe {
-	position: absolute;
-	border: 0px;
-	left: 260px;
-	width: calc(100% - 260px);
-	height: 100%;
-	overflow: auto;
-}
-
-.filterBlock {
-	position: relative;
-}
-
-.filterBlock p {
-	margin: 0;
-}
-
-#filterInput {
-	width: 100%;
-	padding: 5px;
-	font-family: inherit;
-	font-size: 15px;
-	outline: none;
-	border: 1px solid #dedede;
-}
-
-#filterInput:focus{
-	border: 1px solid #2194CE;
-}
-
-#clearFilterButton {
-	position: absolute;
-	right: 6px;
-	top: 50%;
-	margin-top: -8px;
-	width: 16px;
-	height: 16px;
-	font-size: 14px;
-	color: grey;
-	text-align: center;
-	line-height: 0;
-	padding-top: 7px;
-	opacity: .5;
-}
-
-#clearFilterButton:hover {
-	opacity: 1;
-}
-
-.hidden {
-	display: none;
-}
-
-#panel li b {
-	font-weight: bold;
-}
-
-/* mobile */
-
-#expandButton {
-	display: none;
-	position: absolute;
-	right: 20px;
-	top: 12px;
-	width: 32px;
-	height: 32px;
-}
-
-#expandButton span {
-	height: 2px;
-	background-color: #2194CE;
-	width: 16px;
-	position: absolute;
-	left: 8px;
-	top: 10px;
-}
-
-#expandButton span:nth-child(1) {
-	top: 16px;
-}
-
-#expandButton span:nth-child(2) {
-	top: 22px;
-}
-
-@media all and ( max-width: 640px ) {
-
-	h1 {
-		margin-top: 20px;
-		margin-bottom: 20px;
-	}
-
-	#panel {
-		position: absolute;
-		left: 0;
-		top: 0;
-		height: 100%;
-		width: 100%;
-		right: 0;
-		z-index: 100;
-		overflow: hidden;
-		border-bottom: 1px solid #dedede;
-	}
-
-	#content {
-		position: absolute;
-		left: 0;
-		top: 120px;
-		right: 0;
-		bottom: 0;
-		font-size: 17px;
-		line-height: 22px;
-		padding-left: 20px;
-		overflow: auto;
-	}
-
-	#navigation {
-		position: absolute;
-		left: 0;
-		top: 90px;
-		right: 0;
-		bottom: 0;
-		font-size: 17px;
-		line-height: 22px;
-		overflow: auto;
-	}
-
-	iframe {
-		position: absolute;
-		left: 0;
-		top: 56px;
-		width: 100%;
-		height: calc(100% - 56px);
-	}
-
-	#expandButton {
-		display: block;
-	}
-
-	#panel.collapsed {
-		height: 56px;
-	}
-
-}

+ 70 - 32
docs/index.html

@@ -4,32 +4,38 @@
 		<meta charset="utf-8">
 		<meta charset="utf-8">
 		<title>three.js / documentation</title>
 		<title>three.js / documentation</title>
 		<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
 		<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="index.css">
+		<link rel="shortcut icon" href="../files/favicon.ico" />
+		<link rel="stylesheet" type="text/css" href="../files/main.css">
+		<!-- console sandbox -->
+		<script src="../build/three.min.js" async defer></script>
 	</head>
 	</head>
 	<body>
 	<body>
+		<div id="panel" class="">
 
 
-		<div id="panel" class="collapsed">
-
-			<h1><a href="http://threejs.org">three.js</a> / docs</h1>
+			<div id="header">
+				<h1><a href="http://threejs.org">three.js</a></h1>
 
 
-			<a id="expandButton" href="#">
-				<span></span>
-				<span></span>
-				<span></span>
-			</a>
+				<div id="sections">
+					<span class="selected">docs</span>
+					<a href="../examples/">examples</a>
+				</div>
 
 
-			<div class="filterBlock" >
-				<input type="text" id="filterInput" placeholder="Type to filter" autocorrect="off" autocapitalize="off" spellcheck="false">
-				<a href="#" id="clearFilterButton">x</a>
+				<img id="expandButton" src="../files/ic_menu_black_24dp.svg">
 			</div>
 			</div>
 
 
-			<div style="text-align:center">
-				<br />
-				<a href="javascript:setLanguage('en')">en</a> |
-				<a href="javascript:setLanguage('zh')">zh</a>
-			</div>
+			<div id="panelScrim"></div>
 
 
-			<div id="content"></div>
+			<div id="contentWrapper">
+				<input placeholder="Search" 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 id="content"></div>
+			</div>
 
 
 		</div>
 		</div>
 
 
@@ -65,9 +71,18 @@
 
 
 			//
 			//
 
 
+			var languageSelect = document.getElementById( 'language' );
+			languageSelect.value = language;
+			languageSelect.addEventListener( 'change', function ( event ) {
+
+				setLanguage( this.value );
+
+			} );
+
 			function setLanguage( value ) {
 			function setLanguage( value ) {
 
 
 				language = value;
 				language = value;
+
 				createNavigation();
 				createNavigation();
 				updateFilter();
 				updateFilter();
 				autoChangeUrlLanguage( language );
 				autoChangeUrlLanguage( language );
@@ -76,9 +91,10 @@
 
 
 			var panel = document.getElementById( 'panel' );
 			var panel = document.getElementById( 'panel' );
 			var content = document.getElementById( 'content' );
 			var content = document.getElementById( 'content' );
-			var clearFilterButton = document.getElementById( 'clearFilterButton' );
 			var expandButton = document.getElementById( 'expandButton' );
 			var expandButton = document.getElementById( 'expandButton' );
-			var filterInput = document.getElementById( 'filterInput' );
+			var exitSearchButton = document.getElementById( 'exitSearchButton' );
+			var panelScrim = document.getElementById( 'panelScrim' );
+			var filterInput = document.getElementById( 'filter' );
 			var iframe = document.querySelector( 'iframe' );
 			var iframe = document.querySelector( 'iframe' );
 
 
 			var pageProperties = {};
 			var pageProperties = {};
@@ -93,28 +109,44 @@
 			expandButton.onclick = function ( event ) {
 			expandButton.onclick = function ( event ) {
 
 
 				event.preventDefault();
 				event.preventDefault();
-				panel.classList.toggle( 'collapsed' );
+				panel.classList.toggle( 'open' );
 
 
 			};
 			};
 
 
+			panelScrim.onclick = function ( event ) {
 
 
-			// Functionality for search/filter input field
+				event.preventDefault();
+				panel.classList.toggle( 'open' );
 
 
-			filterInput.oninput = function ( event ) {
+			};
 
 
-				updateFilter();
 
 
-			};
+			// Functionality for search/filter input field
+			filterInput.onfocus = function ( event ) {
+
+				panel.classList.add('searchFocused');
 
 
+			}
 
 
-			// Functionality for filter clear button
+			filterInput.onblur = function ( event ) {
 
 
-			clearFilterButton.onclick = function ( event ) {
+				if(filterInput.value === '') {
+					panel.classList.remove('searchFocused');
+				}
 
 
-				event.preventDefault();
+			}
+
+			exitSearchButton.onclick = function( event ) {
 
 
 				filterInput.value = '';
 				filterInput.value = '';
 				updateFilter();
 				updateFilter();
+				panel.classList.remove('searchFocused');
+
+			}
+
+			filterInput.oninput = function ( event ) {
+
+				updateFilter();
 
 
 			};
 			};
 
 
@@ -140,7 +172,16 @@
 					if ( event.button !== 0 || event.ctrlKey || event.altKey || event.metaKey ) return;
 					if ( event.button !== 0 || event.ctrlKey || event.altKey || event.metaKey ) return;
 
 
 					window.location.hash = pageURL;
 					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');
 
 
 				} );
 				} );
 
 
@@ -433,9 +474,6 @@
 
 
 		</script>
 		</script>
 
 
-		<!-- console sandbox -->
-		<script src="../build/three.min.js"></script>
-
 	</body>
 	</body>
 
 
 </html>
 </html>

+ 10 - 6
docs/list.js

@@ -253,7 +253,9 @@ var list = {
 				"Material": "api/en/materials/Material",
 				"Material": "api/en/materials/Material",
 				"MeshBasicMaterial": "api/en/materials/MeshBasicMaterial",
 				"MeshBasicMaterial": "api/en/materials/MeshBasicMaterial",
 				"MeshDepthMaterial": "api/en/materials/MeshDepthMaterial",
 				"MeshDepthMaterial": "api/en/materials/MeshDepthMaterial",
+				"MeshDistanceMaterial": "api/en/materials/MeshDistanceMaterial",
 				"MeshLambertMaterial": "api/en/materials/MeshLambertMaterial",
 				"MeshLambertMaterial": "api/en/materials/MeshLambertMaterial",
+				"MeshMatcapMaterial": "api/en/materials/MeshMatcapMaterial",
 				"MeshNormalMaterial": "api/en/materials/MeshNormalMaterial",
 				"MeshNormalMaterial": "api/en/materials/MeshNormalMaterial",
 				"MeshPhongMaterial": "api/en/materials/MeshPhongMaterial",
 				"MeshPhongMaterial": "api/en/materials/MeshPhongMaterial",
 				"MeshPhysicalMaterial": "api/en/materials/MeshPhysicalMaterial",
 				"MeshPhysicalMaterial": "api/en/materials/MeshPhysicalMaterial",
@@ -391,12 +393,12 @@ var list = {
 				"LookupTable": "examples/Lut",
 				"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": {
 			"Renderers": {
@@ -683,7 +685,9 @@ var list = {
 				"Material": "api/zh/materials/Material",
 				"Material": "api/zh/materials/Material",
 				"MeshBasicMaterial": "api/zh/materials/MeshBasicMaterial",
 				"MeshBasicMaterial": "api/zh/materials/MeshBasicMaterial",
 				"MeshDepthMaterial": "api/zh/materials/MeshDepthMaterial",
 				"MeshDepthMaterial": "api/zh/materials/MeshDepthMaterial",
+				"MeshDistanceMaterial": "api/zh/materials/MeshDistanceMaterial",
 				"MeshLambertMaterial": "api/zh/materials/MeshLambertMaterial",
 				"MeshLambertMaterial": "api/zh/materials/MeshLambertMaterial",
+				"MeshMatcapMaterial": "api/zh/materials/MeshMatcapMaterial",
 				"MeshNormalMaterial": "api/zh/materials/MeshNormalMaterial",
 				"MeshNormalMaterial": "api/zh/materials/MeshNormalMaterial",
 				"MeshPhongMaterial": "api/zh/materials/MeshPhongMaterial",
 				"MeshPhongMaterial": "api/zh/materials/MeshPhongMaterial",
 				"MeshPhysicalMaterial": "api/zh/materials/MeshPhysicalMaterial",
 				"MeshPhysicalMaterial": "api/zh/materials/MeshPhysicalMaterial",

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

@@ -12,7 +12,7 @@
 		<div>
 		<div>
 			<p>
 			<p>
 				Let's say you want to draw a line or a circle, not a wireframe [page:Mesh].
 				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>
 
 
 			<p>Here is the code that we will use:</p>
 			<p>Here is the code that we will use:</p>

+ 8 - 1
docs/manual/en/introduction/How-to-dispose-of-objects.html

@@ -54,6 +54,13 @@
 		for realizing custom rendering destinations. These objects are only deallocated by executing [page:WebGLRenderTarget.dispose]().
 		for realizing custom rendering destinations. These objects are only deallocated by executing [page:WebGLRenderTarget.dispose]().
 	</p>
 	</p>
 
 
+	<h2>Scenes</h2>
+
+	<p>
+		The renderer maintains for scenes special data structures for sorting and rendering. If for some reasons a scene object becomes obsolete in an application,
+		call [page:Scene.dispose]() in order to free these resources.
+	</p>
+
 	<h2>Miscellaneous</h2>
 	<h2>Miscellaneous</h2>
 
 
 	<p>
 	<p>
@@ -91,7 +98,7 @@
 		nothing happens. No resources were allocated so there is also no need for clean up.
 		nothing happens. No resources were allocated so there is also no need for clean up.
 	</p>
 	</p>
 
 
-	<h3>Why happens when you call *dispose()* on a texture but the image is not loaded yet?</h3>
+	<h3>What happens when you call *dispose()* on a texture but the image is not loaded yet?</h3>
 
 
 	<p>
 	<p>
 		Internal resources for a texture are only allocated if the image has fully loaded. If you dispose a texture before the image was loaded,
 		Internal resources for a texture are only allocated if the image has fully loaded. If you dispose a texture before the image was loaded,

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

@@ -178,8 +178,6 @@ geometry.tangentsNeedUpdate = true;
 
 
 			<p>Also GLstate related parameters can change any time (depthTest, blending, polygonOffset, etc).</p>
 			<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>
 			<p>The following properties can't be easily changed at runtime (once the material is rendered at least once):</p>
 			<ul>
 			<ul>
 				<li>numbers and types of uniforms</li>
 				<li>numbers and types of uniforms</li>

+ 241 - 5
docs/manual/en/introduction/Import-via-modules.html

@@ -27,7 +27,7 @@
 
 
 		<h2>Importing the module</h2>
 		<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>
 		<p>
 			You should now be able to import the module into your source files and continue to use it as per normal.
 			You should now be able to import the module into your source files and continue to use it as per normal.
@@ -62,11 +62,247 @@
 		...
 		...
 		</code>
 		</code>
 
 
-		<h2>Caveats</h2>
-
+		<h2>Importable Examples</h2>
+		<p>
+			The core of three.js is focused on the most important components of a 3D engine. Many other components like loaders or controls are part of the
+			examples directory. three.js ensures that these files are kept in sync with the core but users have to import them separately if they are required
+			for their project. However, most of these files are not modules which makes their usage in certain cases inconvenient. In order to address this issue,
+			we are working to provide all the examples as modules in the [link:https://github.com/mrdoob/three.js/tree/master/examples/jsm examples/jsm] directory.
+			If you install three.js via npm, you can import them like so:
+		</p>
+		<code>
+		import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls.js';
+		</code>
+		<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>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
+					<ul>
+						<li>ColladaExporter</li>
+						<li>GLTFExporter</li>
+						<li>MMDExporter</li>
+						<li>OBJExporter</li>
+						<li>PLYExporter</li>
+						<li>STLExporter</li>
+						<li>TypedGeometryExporter</li>
+					</ul>
+				</li>
+				<li>geometries
+					<ul>
+						<li>BoxLineGeometry</li>
+						<li>DecalGeometry</li>
+						<li>ParametricGeometries</li>
+						<li>TeapotBufferGeometry</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>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
+					<ul>
+						<li>PMREMCubeUVPacker</li>
+						<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>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>SMAAShader</li>
+						<li>SobelOperatorShader</li>
+						<li>SSAOShader</li>
+						<li>TechnicolorShader</li>
+						<li>ToneMapShader</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>
+						<li>GeometryUtils</li>
+						<li>MathUtils</li>
+						<li>SceneUtils</li>
+						<li>ShadowMapViewer</li>
+						<li>SkeletonUtils</li>
+						<li>TypedArrayUtils</li>
+						<li>UVsDebug</li>
+					</ul>
+				</li>
+			</ul>
+		</p>
 		<p>
 		<p>
-			Currently it's not possible to import the files within the "examples/js" directory in this way.
-			This is due to some of the files relying on global namespace pollution of THREE. For more information see <a href="https://github.com/mrdoob/three.js/issues/9562" target="_blank">Transform `examples/js` to support modules #9562</a>.
+			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 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.
 		</p>
 		</p>
 	</body>
 	</body>
 </html>
 </html>

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

@@ -17,15 +17,12 @@
 
 
 			Note also that as three.js is under rapid development, a lot of these links will contain information that is
 			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,
 			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>
 		</p>
 
 
 		<h2>Help forums</h2>
 		<h2>Help forums</h2>
 		<p>
 		<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.
 			If you need assistance with something, that's the place to go. Do NOT open an issue on Github for help requests.
 		</p>
 		</p>
 
 
@@ -33,6 +30,9 @@
 
 
 		<h3>Getting started with three.js</h3>
 		<h3>Getting started with three.js</h3>
 		<ul>
 		<ul>
+			<li>
+				[link:https://threejsfundamentals.org/threejs/lessons/threejs-fundamentals.html Three.js Fundamentals starting lesson]
+			</li>
 			<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].
 				[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>
 			</li>
@@ -43,6 +43,12 @@
 
 
 		<h3>More extensive / advanced articles and courses</h3>
 		<h3>More extensive / advanced articles and courses</h3>
 		<ul>
 		<ul>
+			<li>
+				[link:https://discoverthreejs.com/ Discover three.js]
+			</li>
+			<li>
+				[link:https://threejsfundamentals.org/ Three.js Fundamentals]
+			</li>
 			<li>
 			<li>
 				[link:http://blog.cjgammon.com/ Collection of tutorials] by [link:http://www.cjgammon.com/ CJ Gammon].
 				[link:http://blog.cjgammon.com/ Collection of tutorials] by [link:http://www.cjgammon.com/ CJ Gammon].
 			</li>
 			</li>
@@ -60,21 +66,16 @@
 			 [link:http://learningthreejs.com/ Learning Three.js] – a blog with articles dedicated to teaching three.js
 			 [link:http://learningthreejs.com/ Learning Three.js] – a blog with articles dedicated to teaching three.js
 		 </li>
 		 </li>
 		 <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>
 		 </li>
 		</ul>
 		</ul>
 
 
-		<h3>Tutorials in other languages</h3>
+		<h2>News and Updates</h2>
 		<ul>
 		<ul>
 			<li>
 			<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>
 			</li>
-
-		</ul>
-
-		<h2>News and Updates</h2>
-		<ul>
 			<li>
 			<li>
 				[link:http://www.reddit.com/r/threejs/ Three.js on reddit]
 				[link:http://www.reddit.com/r/threejs/ Three.js on reddit]
 			</li>
 			</li>
@@ -84,9 +85,6 @@
 			<li>
 			<li>
 				[link:http://learningwebgl.com/blog/ Learning WebGL Blog] – The authoritive news source for WebGL.
 				[link:http://learningwebgl.com/blog/ Learning WebGL Blog] – The authoritive news source for WebGL.
 			</li>
 			</li>
-			<li>
-				[link:https://plus.google.com/104300307601542851567/posts Three.js posts] on Google+ – frequent posts on Three.js
-			</li>
 		</ul>
 		</ul>
 
 
 		<h2>Examples</h2>
 		<h2>Examples</h2>
@@ -173,6 +171,13 @@
 			[link:http://12devsofxmas.co.uk/2012/01/webgl-and-three-js/ A whirlwind look at Three.js]
 			[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]
 			by [link:http://github.com/nrocy Paul King]
 		</li>
 		</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>
 	 </ul>
 
 
 	</body>
 	</body>

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

@@ -31,6 +31,9 @@
 
 
 		<h3>three.js入门</h3>
 		<h3>three.js入门</h3>
 		<ul>
 		<ul>
+			<li>
+				[link:https://threejsfundamentals.org/threejs/lessons/threejs-fundamentals.html Three.js Fundamentals starting lesson]
+			</li>
 			<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].
 				[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>
 			</li>
@@ -41,6 +44,12 @@
 
 
 		<h3>更加广泛、高级的文章与教程</h3>
 		<h3>更加广泛、高级的文章与教程</h3>
 		<ul>
 		<ul>
+			<li>
+				[link:https://discoverthreejs.com/ Discover three.js]
+			</li>
+			<li>
+				[link:https://threejsfundamentals.org/ Three.js Fundamentals]
+			</li>
 			<li>
 			<li>
 				[link:http://blog.cjgammon.com/ Collection of tutorials] by [link:http://www.cjgammon.com/ CJ Gammon].
 				[link:http://blog.cjgammon.com/ Collection of tutorials] by [link:http://www.cjgammon.com/ CJ Gammon].
 			</li>
 			</li>
@@ -58,21 +67,16 @@
 			 [link:http://learningthreejs.com/ Learning Three.js] – a blog with articles dedicated to teaching three.js
 			 [link:http://learningthreejs.com/ Learning Three.js] – a blog with articles dedicated to teaching three.js
 		 </li>
 		 </li>
 		 <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>
 		 </li>
 		</ul>
 		</ul>
 
 
-		<h3>其它非英语的教程</h3>
+		<h2>新闻与更新</h2>
 		<ul>
 		<ul>
 			<li>
 			<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>
 			</li>
-
-		</ul>
-
-		<h2>新闻与更新</h2>
-		<ul>
 			<li>
 			<li>
 				[link:http://www.reddit.com/r/threejs/ Three.js on reddit]
 				[link:http://www.reddit.com/r/threejs/ Three.js on reddit]
 			</li>
 			</li>
@@ -82,9 +86,6 @@
 			<li>
 			<li>
 				[link:http://learningwebgl.com/blog/ Learning WebGL Blog] – The authoritive news source for WebGL.
 				[link:http://learningwebgl.com/blog/ Learning WebGL Blog] – The authoritive news source for WebGL.
 			</li>
 			</li>
-			<li>
-				[link:https://plus.google.com/104300307601542851567/posts Three.js posts] on Google+ – frequent posts on Three.js
-			</li>
 		</ul>
 		</ul>
 		<h2>示例</h2>
 		<h2>示例</h2>
 		<ul>
 		<ul>
@@ -165,6 +166,13 @@
 			[link:http://12devsofxmas.co.uk/2012/01/webgl-and-three-js/ A whirlwind look at Three.js]
 			[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]
 			by [link:http://github.com/nrocy Paul King]
 		</li>
 		</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>
 	 </ul>
 
 
 	</body>
 	</body>

+ 131 - 40
docs/page.css

@@ -1,58 +1,105 @@
+:root {
+	--color-blue: #049EF4;
+	--text-color: #444;
+	--border-style: 1px solid #EEE;
+	--header-height: 56px;
+}
+
 @font-face {
 @font-face {
-	font-family: 'inconsolata';
-	src: url('files/inconsolata.woff') format('woff');
+	font-family: 'Roboto Mono';
+	src: local('Roboto Mono'), url('../files/RobotoMono-Regular.woff2') format('woff2');
+	font-weight: normal;
+	font-style: normal;
+}
+
+@font-face {
+	font-family: 'SF-Pro-Text';
+	src: local('SF-Pro-Text'), url('../files/SF-Pro-Text-Regular.otf');
 	font-weight: normal;
 	font-weight: normal;
 	font-style: normal;
 	font-style: normal;
 }
 }
 
 
 body {
 body {
-	margin: 30px 20px;
-	color: #555;
-	font-family: 'inconsolata';
-	font-size: 15px;
-	line-height: 18px;
+	padding: 20px 24px 40px 24px;
+	margin: 0;
+	color: var(--text-color);
+	font-family: 'SF-Pro-Text', sans-serif;
+	font-size: 16px;
+	line-height: 24px;
 	tab-size: 4;
 	tab-size: 4;
 	overflow: auto;
 	overflow: auto;
 }
 }
 
 
 a {
 a {
-	color: #1184CE;
+	color: var(--color-blue);
 	cursor: pointer;
 	cursor: pointer;
-	text-decoration: underline;
+	text-decoration: none;
 }
 }
 
 
 h1 {
 h1 {
-	color: #333;
-	font-size: 25px;
+	color: var(--color-blue);
+	font-size: 2.4em;
 	font-weight: normal;
 	font-weight: normal;
-
-	margin-top: 10px;
+	line-height: 1.36em;
+	margin-top: 16px;
+	margin-bottom: -16px;
+	text-indent: -2px;
 }
 }
 
 
 h2 {
 h2 {
-	color: #4B0;
-	font-size: 18px;
+	color: var(--color-blue);
+	font-size: 1.8em;
+	line-height: 1.32em;
 	font-weight: normal;
 	font-weight: normal;
-
 	margin-top: 40px;
 	margin-top: 40px;
+	margin-bottom: 12px;
+	text-indent: -1px;
 }
 }
 
 
 h3 {
 h3 {
-	color: #000;
-	font-size: 16px;
+	font-size: 1.32em;
+	line-height: 1.48em;
 	font-weight: normal;
 	font-weight: normal;
+	text-indent: -1px;
+	margin-top: 24px;
+	margin-bottom: 12px;
+}
 
 
-	margin-top: 40px;
+p {
+	margin-top: 24px;
+	margin-bottom: 24px;
+}
+ul, ol {
+	box-sizing: border-box;
+	padding-left: 20px;
+}
+ul li,
+ol li {
+	padding-left: 4px;
+	margin-bottom: 4px;
+}
+
+li ul,
+li ol {
+	margin-top: 4px;
+}
+
+body {
+	max-width: 760px;
+	margin-left: auto;
+	margin-right: auto;
 }
 }
 
 
-p, ul, ol {
-	margin-top: 0;
+table,
+pre,
+code:not(.inline) {
+	margin-left: -24px;
+	margin-right: -24px;
+	margin-top: 20px;
 	margin-bottom: 20px;
 	margin-bottom: 20px;
-	max-width: 780px;
 }
 }
 
 
 div {
 div {
-	/* padding-left: 30px; */
 	margin-bottom: 20px;
 	margin-bottom: 20px;
 }
 }
 
 
@@ -60,20 +107,37 @@ div {
 	padding-left: 0px;
 	padding-left: 0px;
 }
 }
 
 
-pre, code {
-	margin-top: 20px;
-	margin-bottom: 20px;
+br {
+	display: none;
+}
+
+table {
+	border-spacing: 24px 4px;
+}
+table,
+table tr,
+table td {
+	text-align: left;
+}
+
+table th {
+	text-decoration: none;
+	padding: 2px 0;
 }
 }
 
 
 code {
 code {
 	display: block;
 	display: block;
-	width: -webkit-calc( 100% - 40px );
-	width: -moz-calc( 100% - 40px );
-	width: calc( 100% - 40px );
-	padding: 20px;
+	padding: 20px 24px;
 	white-space: pre-wrap;
 	white-space: pre-wrap;
-	background-color: #f9f9f9;
 	overflow: auto;
 	overflow: auto;
+	box-sizing: border-box;
+}
+
+code.inline {
+	display: inline-block;
+	vertical-align: middle;
+	border-radius: 4px;
+	padding: 2px 5px;
 }
 }
 
 
 iframe {
 iframe {
@@ -104,19 +168,27 @@ strong {
 
 
 #button {
 #button {
 	position: fixed;
 	position: fixed;
-	top: 20px;
-	right: 20px;
+	bottom: 12px;
+	right: 12px;
+
 	padding: 8px;
 	padding: 8px;
-	color: #fff;
-	background-color: #555;
-	opacity: 0.5;
-}
+	border-radius: 50%;
+	margin-bottom: 0px;
 
 
-#button:hover {
-	cursor: pointer;
-	opacity: 1;
+	background-color: #E5E5E5;
+	opacity: .9;
 }
 }
 
 
+	#button:hover {
+		cursor: pointer;
+		opacity: 1;
+	}
+
+	#button img {
+		display: block;
+		width: 20px;
+	}
+
 a.permalink {
 a.permalink {
 	float: right;
 	float: right;
 	margin-left: 5px;
 	margin-left: 5px;
@@ -141,3 +213,22 @@ sup, sub {
 sub {
 sub {
 	top: 0.4em;
 	top: 0.4em;
 }
 }
+
+/* mobile */
+
+@media all and ( max-width: 640px ) {
+	body {
+		padding: 16px 20px;
+	}
+
+	h1 {
+		margin-top: 0;
+		font-size: 26px;
+	}
+
+	h2 {
+		margin-top: 20px;
+		font-size: 18px;
+		line-height: 25px;
+	}
+}

+ 1 - 2
docs/page.js

@@ -97,8 +97,7 @@ function onDocumentLoad( event ) {
 
 
 	var button = document.createElement( 'div' );
 	var button = document.createElement( 'div' );
 	button.id = 'button';
 	button.id = 'button';
-	button.textContent = 'Edit';
-
+	button.innerHTML = '<img src="../files/ic_mode_edit_black_24dp.svg">';
 	button.addEventListener( 'click', function ( event ) {
 	button.addEventListener( 'click', function ( event ) {
 
 
 		window.open( 'https://github.com/mrdoob/three.js/blob/dev/docs/' + section + '/' + localizedPath + '.html' );
 		window.open( 'https://github.com/mrdoob/three.js/blob/dev/docs/' + section + '/' + localizedPath + '.html' );

+ 4 - 2
docs/prettify/threejs.css

@@ -10,6 +10,8 @@ pre .dec, code .dec { color: #22c0c4; } /* decimal */
 
 
 
 
 pre.prettyprint, code.prettyprint {
 pre.prettyprint, code.prettyprint {
-	background-color: #f9f9f9;
-	font-family: 'inconsolata';
+	background-color: #F5F5F5;
+	font-family: 'Roboto Mono', monospace;
+	font-size: 14px;
+	line-height: 24px;
 }
 }

+ 5 - 16
docs/scenes/bones-browser.html

@@ -3,22 +3,9 @@
 	<head>
 	<head>
 		<meta charset="utf-8">
 		<meta charset="utf-8">
 		<title>Three.js Bones Browser</title>
 		<title>Three.js Bones Browser</title>
+		<link rel="shortcut icon" href="../../files/favicon.ico" />
+		<link rel="stylesheet" type="text/css" href="../../files/main.css">
 		<style>
 		<style>
-			@font-face {
-				font-family: 'inconsolata';
-				src: url('../files/inconsolata.woff') format('woff');
-				font-weight: normal;
-				font-style: normal;
-			}
-
-			body {
-				margin:0;
-				font-family: 'inconsolata';
-				font-size: 15px;
-				line-height: 18px;
-				overflow: hidden;
-			}
-
 			canvas { width: 100%; height: 100% }
 			canvas { width: 100%; height: 100% }
 
 
 			#newWindow {
 			#newWindow {
@@ -49,7 +36,10 @@
 			function initScene() {
 			function initScene() {
 
 
 				gui = new dat.GUI();
 				gui = new dat.GUI();
+
 				scene = new THREE.Scene();
 				scene = new THREE.Scene();
+				scene.background = new THREE.Color( 0x444444 );
+
 				camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 0.1, 200 );
 				camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 0.1, 200 );
 				camera.position.z = 30;
 				camera.position.z = 30;
 				camera.position.y = 30;
 				camera.position.y = 30;
@@ -57,7 +47,6 @@
 				renderer = new THREE.WebGLRenderer( { antialias: true } );
 				renderer = new THREE.WebGLRenderer( { antialias: true } );
 				renderer.setPixelRatio( window.devicePixelRatio );
 				renderer.setPixelRatio( window.devicePixelRatio );
 				renderer.setSize( window.innerWidth, window.innerHeight );
 				renderer.setSize( window.innerWidth, window.innerHeight );
-				renderer.setClearColor( 0x000000, 1 );
 				document.body.appendChild( renderer.domElement );
 				document.body.appendChild( renderer.domElement );
 
 
 				orbit = new THREE.OrbitControls( camera, renderer.domElement );
 				orbit = new THREE.OrbitControls( camera, renderer.domElement );

+ 6 - 17
docs/scenes/geometry-browser.html

@@ -3,22 +3,9 @@
 	<head>
 	<head>
 		<meta charset="utf-8">
 		<meta charset="utf-8">
 		<title>Three.js Geometry Browser</title>
 		<title>Three.js Geometry Browser</title>
+		<link rel="shortcut icon" href="../../files/favicon.ico" />
+		<link rel="stylesheet" type="text/css" href="../../files/main.css">
 		<style>
 		<style>
-			@font-face {
-				font-family: 'inconsolata';
-				src: url('../files/inconsolata.woff') format('woff');
-				font-weight: normal;
-				font-style: normal;
-			}
-
-			body {
-				margin:0;
-				font-family: 'inconsolata';
-				font-size: 15px;
-				line-height: 18px;
-				overflow: hidden;
-			}
-
 			canvas { width: 100%; height: 100% }
 			canvas { width: 100%; height: 100% }
 
 
 			#newWindow {
 			#newWindow {
@@ -37,7 +24,7 @@
 		<script src="../../build/three.min.js"></script>
 		<script src="../../build/three.min.js"></script>
 		<script src='../../examples/js/libs/dat.gui.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/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>
 		<script src='js/geometry.js'></script>
 
 
@@ -46,14 +33,16 @@
 			document.getElementById( 'newWindow' ).href += window.location.hash;
 			document.getElementById( 'newWindow' ).href += window.location.hash;
 
 
 			var gui = new dat.GUI();
 			var gui = new dat.GUI();
+
 			var scene = new THREE.Scene();
 			var scene = new THREE.Scene();
+			scene.background = new THREE.Color( 0x444444 );
+
 			var camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 0.1, 50 );
 			var camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 0.1, 50 );
 			camera.position.z = 30;
 			camera.position.z = 30;
 
 
 			var renderer = new THREE.WebGLRenderer( { antialias: true } );
 			var renderer = new THREE.WebGLRenderer( { antialias: true } );
 			renderer.setPixelRatio( window.devicePixelRatio );
 			renderer.setPixelRatio( window.devicePixelRatio );
 			renderer.setSize( window.innerWidth, window.innerHeight );
 			renderer.setSize( window.innerWidth, window.innerHeight );
-			renderer.setClearColor( 0x000000, 1 );
 			document.body.appendChild( renderer.domElement );
 			document.body.appendChild( renderer.domElement );
 
 
 			var orbit = new THREE.OrbitControls( camera, renderer.domElement );
 			var orbit = new THREE.OrbitControls( camera, renderer.domElement );

+ 14 - 4
docs/scenes/js/geometry.js

@@ -860,6 +860,7 @@ var guis = {
 			bevelEnabled: false,
 			bevelEnabled: false,
 			bevelThickness: 1,
 			bevelThickness: 1,
 			bevelSize: 0.5,
 			bevelSize: 0.5,
+			bevelOffset: 0.0,
 			bevelSegments: 3
 			bevelSegments: 3
 		};
 		};
 
 
@@ -887,6 +888,7 @@ var guis = {
 					bevelEnabled: data.bevelEnabled,
 					bevelEnabled: data.bevelEnabled,
 					bevelThickness: data.bevelThickness,
 					bevelThickness: data.bevelThickness,
 					bevelSize: data.bevelSize,
 					bevelSize: data.bevelSize,
+					bevelOffset: data.bevelOffset,
 					bevelSegments: data.bevelSegments
 					bevelSegments: data.bevelSegments
 				} );
 				} );
 				geometry.center();
 				geometry.center();
@@ -910,7 +912,8 @@ var guis = {
 		folder.add( data, 'weight', weights ).onChange( generateGeometry );
 		folder.add( data, 'weight', weights ).onChange( generateGeometry );
 		folder.add( data, 'bevelEnabled' ).onChange( generateGeometry );
 		folder.add( data, 'bevelEnabled' ).onChange( generateGeometry );
 		folder.add( data, 'bevelThickness', 0.1, 3 ).onChange( generateGeometry );
 		folder.add( data, 'bevelThickness', 0.1, 3 ).onChange( generateGeometry );
-		folder.add( data, 'bevelSize', 0.1, 3 ).onChange( generateGeometry );
+		folder.add( data, 'bevelSize', 0, 3 ).onChange( generateGeometry );
+		folder.add( data, 'bevelOffset', -0.5, 1.5 ).onChange( generateGeometry );
 		folder.add( data, 'bevelSegments', 0, 8 ).step( 1 ).onChange( generateGeometry );
 		folder.add( data, 'bevelSegments', 0, 8 ).step( 1 ).onChange( generateGeometry );
 
 
 		generateGeometry();
 		generateGeometry();
@@ -929,6 +932,7 @@ var guis = {
 			bevelEnabled: false,
 			bevelEnabled: false,
 			bevelThickness: 1,
 			bevelThickness: 1,
 			bevelSize: 0.5,
 			bevelSize: 0.5,
+			bevelOffset: 0.0,
 			bevelSegments: 3
 			bevelSegments: 3
 		};
 		};
 
 
@@ -956,6 +960,7 @@ var guis = {
 					bevelEnabled: data.bevelEnabled,
 					bevelEnabled: data.bevelEnabled,
 					bevelThickness: data.bevelThickness,
 					bevelThickness: data.bevelThickness,
 					bevelSize: data.bevelSize,
 					bevelSize: data.bevelSize,
+					bevelOffset: data.bevelOffset,
 					bevelSegments: data.bevelSegments
 					bevelSegments: data.bevelSegments
 				} );
 				} );
 				geometry.center();
 				geometry.center();
@@ -979,7 +984,8 @@ var guis = {
 		folder.add( data, 'weight', weights ).onChange( generateGeometry );
 		folder.add( data, 'weight', weights ).onChange( generateGeometry );
 		folder.add( data, 'bevelEnabled' ).onChange( generateGeometry );
 		folder.add( data, 'bevelEnabled' ).onChange( generateGeometry );
 		folder.add( data, 'bevelThickness', 0.1, 3 ).onChange( generateGeometry );
 		folder.add( data, 'bevelThickness', 0.1, 3 ).onChange( generateGeometry );
-		folder.add( data, 'bevelSize', 0.1, 3 ).onChange( generateGeometry );
+		folder.add( data, 'bevelSize', 0, 3 ).onChange( generateGeometry );
+		folder.add( data, 'bevelOffset', -0.5, 1.5 ).onChange( generateGeometry );
 		folder.add( data, 'bevelSegments', 0, 8 ).step( 1 ).onChange( generateGeometry );
 		folder.add( data, 'bevelSegments', 0, 8 ).step( 1 ).onChange( generateGeometry );
 
 
 		generateGeometry();
 		generateGeometry();
@@ -1276,6 +1282,7 @@ var guis = {
 			bevelEnabled: true,
 			bevelEnabled: true,
 			bevelThickness: 1,
 			bevelThickness: 1,
 			bevelSize: 1,
 			bevelSize: 1,
+			bevelOffset: 0,
 			bevelSegments: 1
 			bevelSegments: 1
 		};
 		};
 
 
@@ -1302,7 +1309,8 @@ var guis = {
 		folder.add( data, 'steps', 1, 10 ).step( 1 ).onChange( generateGeometry );
 		folder.add( data, 'steps', 1, 10 ).step( 1 ).onChange( generateGeometry );
 		folder.add( data, 'depth', 1, 20 ).onChange( generateGeometry );
 		folder.add( data, 'depth', 1, 20 ).onChange( generateGeometry );
 		folder.add( data, 'bevelThickness', 1, 5 ).step( 1 ).onChange( generateGeometry );
 		folder.add( data, 'bevelThickness', 1, 5 ).step( 1 ).onChange( generateGeometry );
-		folder.add( data, 'bevelSize', 1, 5 ).step( 1 ).onChange( generateGeometry );
+		folder.add( data, 'bevelSize', 0, 5 ).step( 1 ).onChange( generateGeometry );
+		folder.add( data, 'bevelOffset', -4, 5 ).step( 1 ).onChange( generateGeometry );
 		folder.add( data, 'bevelSegments', 1, 5 ).step( 1 ).onChange( generateGeometry );
 		folder.add( data, 'bevelSegments', 1, 5 ).step( 1 ).onChange( generateGeometry );
 
 
 		generateGeometry();
 		generateGeometry();
@@ -1317,6 +1325,7 @@ var guis = {
 			bevelEnabled: true,
 			bevelEnabled: true,
 			bevelThickness: 1,
 			bevelThickness: 1,
 			bevelSize: 1,
 			bevelSize: 1,
+			bevelOffset: 0,
 			bevelSegments: 1
 			bevelSegments: 1
 		};
 		};
 
 
@@ -1343,7 +1352,8 @@ var guis = {
 		folder.add( data, 'steps', 1, 10 ).step( 1 ).onChange( generateGeometry );
 		folder.add( data, 'steps', 1, 10 ).step( 1 ).onChange( generateGeometry );
 		folder.add( data, 'depth', 1, 20 ).onChange( generateGeometry );
 		folder.add( data, 'depth', 1, 20 ).onChange( generateGeometry );
 		folder.add( data, 'bevelThickness', 1, 5 ).step( 1 ).onChange( generateGeometry );
 		folder.add( data, 'bevelThickness', 1, 5 ).step( 1 ).onChange( generateGeometry );
-		folder.add( data, 'bevelSize', 1, 5 ).step( 1 ).onChange( generateGeometry );
+		folder.add( data, 'bevelSize', 0, 5 ).step( 1 ).onChange( generateGeometry );
+		folder.add( data, 'bevelOffset', -4, 5 ).step( 1 ).onChange( generateGeometry );
 		folder.add( data, 'bevelSegments', 1, 5 ).step( 1 ).onChange( generateGeometry );
 		folder.add( data, 'bevelSegments', 1, 5 ).step( 1 ).onChange( generateGeometry );
 
 
 		generateGeometry();
 		generateGeometry();

+ 171 - 49
docs/scenes/js/material.js

@@ -87,6 +87,9 @@ function getObjectsKeys( obj ) {
 
 
 }
 }
 
 
+var textureLoader = new THREE.TextureLoader();
+var cubeTextureLoader = new THREE.CubeTextureLoader();
+
 var envMaps = ( function () {
 var envMaps = ( function () {
 
 
 	var path = '../../examples/textures/cube/SwedishRoyalCastle/';
 	var path = '../../examples/textures/cube/SwedishRoyalCastle/';
@@ -97,10 +100,10 @@ var envMaps = ( function () {
 		path + 'pz' + format, path + 'nz' + format
 		path + 'pz' + format, path + 'nz' + format
 	];
 	];
 
 
-	var reflectionCube = new THREE.CubeTextureLoader().load( urls );
+	var reflectionCube = cubeTextureLoader.load( urls );
 	reflectionCube.format = THREE.RGBFormat;
 	reflectionCube.format = THREE.RGBFormat;
 
 
-	var refractionCube = new THREE.CubeTextureLoader().load( urls );
+	var refractionCube = cubeTextureLoader.load( urls );
 	refractionCube.mapping = THREE.CubeRefractionMapping;
 	refractionCube.mapping = THREE.CubeRefractionMapping;
 	refractionCube.format = THREE.RGBFormat;
 	refractionCube.format = THREE.RGBFormat;
 
 
@@ -112,18 +115,81 @@ var envMaps = ( function () {
 
 
 } )();
 } )();
 
 
-var envMapKeys = getObjectsKeys( envMaps );
+var diffuseMaps = ( function () {
+
+	var bricks = textureLoader.load( '../../examples/textures/brick_diffuse.jpg' );
+	bricks.wrapS = THREE.RepeatWrapping;
+	bricks.wrapT = THREE.RepeatWrapping;
+	bricks.repeat.set( 9, 1 );
+
+	return {
+		none: null,
+		bricks: bricks
+	};
+
+} )();
+
+var roughnessMaps = ( function () {
+
+	var bricks = textureLoader.load( '../../examples/textures/brick_roughness.jpg' );
+	bricks.wrapT = THREE.RepeatWrapping;
+	bricks.wrapS = THREE.RepeatWrapping;
+	bricks.repeat.set( 9, 1 );
+
+	return {
+		none: null,
+		bricks: bricks
+	};
+
+} )();
+
+var matcaps = ( function () {
+
+	return {
+		none: null,
+		porcelainWhite: textureLoader.load( '../../examples/textures/matcaps/matcap-porcelain-white.jpg' )
+	};
+
+} )();
 
 
-var textureMaps = ( function () {
+var alphaMaps = ( function () {
+
+	var fibers = textureLoader.load( '../../examples/textures/alphaMap.jpg' );
+	fibers.wrapT = THREE.RepeatWrapping;
+	fibers.wrapS = THREE.RepeatWrapping;
+	fibers.repeat.set( 9, 1 );
 
 
 	return {
 	return {
 		none: null,
 		none: null,
-		grass: new THREE.TextureLoader().load( '../../examples/textures/terrain/grasslight-thin.jpg' )
+		fibers: fibers
 	};
 	};
 
 
 } )();
 } )();
 
 
-var textureMapKeys = getObjectsKeys( textureMaps );
+var gradientMaps = ( function () {
+
+	var threeTone = textureLoader.load( '../../examples/textures/gradientMaps/threeTone.jpg' );
+	threeTone.minFilter = THREE.NearestFilter;
+	threeTone.magFilter = THREE.NearestFilter;
+
+	var fiveTone = textureLoader.load( '../../examples/textures/gradientMaps/fiveTone.jpg' );
+	fiveTone.minFilter = THREE.NearestFilter;
+	fiveTone.magFilter = THREE.NearestFilter;
+
+	return {
+		none: null,
+		threeTone: threeTone,
+		fiveTone: fiveTone
+	};
+
+} )();
+
+var envMapKeys = getObjectsKeys( envMaps );
+var diffuseMapKeys = getObjectsKeys( diffuseMaps );
+var roughnessMapKeys = getObjectsKeys( roughnessMaps );
+var matcapKeys = getObjectsKeys( matcaps );
+var alphaMapKeys = getObjectsKeys( alphaMaps );
+var gradientMapKeys = getObjectsKeys( gradientMaps );
 
 
 function generateVertexColors( geometry ) {
 function generateVertexColors( geometry ) {
 
 
@@ -247,7 +313,7 @@ function guiMaterial( gui, mesh, material, geometry ) {
 	var folder = gui.addFolder( 'THREE.Material' );
 	var folder = gui.addFolder( 'THREE.Material' );
 
 
 	folder.add( material, 'transparent' );
 	folder.add( material, 'transparent' );
-	folder.add( material, 'opacity', 0, 1 );
+	folder.add( material, 'opacity', 0, 1 ).step( 0.01 );
 	// folder.add( material, 'blending', constants.blendingMode );
 	// folder.add( material, 'blending', constants.blendingMode );
 	// folder.add( material, 'blendSrc', constants.destinationFactors );
 	// folder.add( material, 'blendSrc', constants.destinationFactors );
 	// folder.add( material, 'blendDst', constants.destinationFactors );
 	// folder.add( material, 'blendDst', constants.destinationFactors );
@@ -257,7 +323,7 @@ function guiMaterial( gui, mesh, material, geometry ) {
 	// folder.add( material, 'polygonOffset' );
 	// folder.add( material, 'polygonOffset' );
 	// folder.add( material, 'polygonOffsetFactor' );
 	// folder.add( material, 'polygonOffsetFactor' );
 	// folder.add( material, 'polygonOffsetUnits' );
 	// folder.add( material, 'polygonOffsetUnits' );
-	folder.add( material, 'alphaTest', 0, 1 );
+	folder.add( material, 'alphaTest', 0, 1 ).step( 0.01 ).onChange( needsUpdate( material, geometry ) );
 	folder.add( material, 'visible' );
 	folder.add( material, 'visible' );
 	folder.add( material, 'side', constants.side ).onChange( needsUpdate( material, geometry ) );
 	folder.add( material, 'side', constants.side ).onChange( needsUpdate( material, geometry ) );
 
 
@@ -267,10 +333,9 @@ function guiMeshBasicMaterial( gui, mesh, material, geometry ) {
 
 
 	var data = {
 	var data = {
 		color: material.color.getHex(),
 		color: material.color.getHex(),
-		envMaps: envMapKeys,
-		map: textureMapKeys,
-		specularMap: textureMapKeys,
-		alphaMap: textureMapKeys
+		envMaps: envMapKeys[ 0 ],
+		map: diffuseMapKeys[ 0 ],
+		alphaMap: alphaMapKeys[ 0 ]
 	};
 	};
 
 
 	var folder = gui.addFolder( 'THREE.MeshBasicMaterial' );
 	var folder = gui.addFolder( 'THREE.MeshBasicMaterial' );
@@ -282,9 +347,8 @@ function guiMeshBasicMaterial( gui, mesh, material, geometry ) {
 	folder.add( material, 'fog' );
 	folder.add( material, 'fog' );
 
 
 	folder.add( data, 'envMaps', envMapKeys ).onChange( updateTexture( material, 'envMap', envMaps ) );
 	folder.add( data, 'envMaps', envMapKeys ).onChange( updateTexture( material, 'envMap', envMaps ) );
-	folder.add( data, 'map', textureMapKeys ).onChange( updateTexture( material, 'map', textureMaps ) );
-	folder.add( data, 'specularMap', textureMapKeys ).onChange( updateTexture( material, 'specularMap', textureMaps ) );
-	folder.add( data, 'alphaMap', textureMapKeys ).onChange( updateTexture( material, 'alphaMap', textureMaps ) );
+	folder.add( data, 'map', diffuseMapKeys ).onChange( updateTexture( material, 'map', diffuseMaps ) );
+	folder.add( data, 'alphaMap', alphaMapKeys ).onChange( updateTexture( material, 'alphaMap', alphaMaps ) );
 	folder.add( material, 'combine', constants.combine );
 	folder.add( material, 'combine', constants.combine );
 	folder.add( material, 'reflectivity', 0, 1 );
 	folder.add( material, 'reflectivity', 0, 1 );
 	folder.add( material, 'refractionRatio', 0, 1 );
 	folder.add( material, 'refractionRatio', 0, 1 );
@@ -293,11 +357,17 @@ function guiMeshBasicMaterial( gui, mesh, material, geometry ) {
 
 
 function guiMeshDepthMaterial( gui, mesh, material, geometry ) {
 function guiMeshDepthMaterial( gui, mesh, material, geometry ) {
 
 
+	var data = {
+		alphaMap: alphaMapKeys[ 0 ]
+	};
+
 	var folder = gui.addFolder( 'THREE.MeshDepthMaterial' );
 	var folder = gui.addFolder( 'THREE.MeshDepthMaterial' );
 
 
 	folder.add( material, 'wireframe' );
 	folder.add( material, 'wireframe' );
 	folder.add( material, 'wireframeLinewidth', 0, 10 );
 	folder.add( material, 'wireframeLinewidth', 0, 10 );
 
 
+	folder.add( data, 'alphaMap', alphaMapKeys ).onChange( updateTexture( material, 'alphaMap', alphaMaps ) );
+
 }
 }
 
 
 function guiMeshNormalMaterial( gui, mesh, material, geometry ) {
 function guiMeshNormalMaterial( gui, mesh, material, geometry ) {
@@ -332,10 +402,9 @@ function guiMeshLambertMaterial( gui, mesh, material, geometry ) {
 	var data = {
 	var data = {
 		color: material.color.getHex(),
 		color: material.color.getHex(),
 		emissive: material.emissive.getHex(),
 		emissive: material.emissive.getHex(),
-		envMaps: envMapKeys,
-		map: textureMapKeys,
-		specularMap: textureMapKeys,
-		alphaMap: textureMapKeys
+		envMaps: envMapKeys[ 0 ],
+		map: diffuseMapKeys[ 0 ],
+		alphaMap: alphaMapKeys[ 0 ]
 	};
 	};
 
 
 	var folder = gui.addFolder( 'THREE.MeshLambertMaterial' );
 	var folder = gui.addFolder( 'THREE.MeshLambertMaterial' );
@@ -349,26 +418,39 @@ function guiMeshLambertMaterial( gui, mesh, material, geometry ) {
 	folder.add( material, 'fog' );
 	folder.add( material, 'fog' );
 
 
 	folder.add( data, 'envMaps', envMapKeys ).onChange( updateTexture( material, 'envMap', envMaps ) );
 	folder.add( data, 'envMaps', envMapKeys ).onChange( updateTexture( material, 'envMap', envMaps ) );
-	folder.add( data, 'map', textureMapKeys ).onChange( updateTexture( material, 'map', textureMaps ) );
-	folder.add( data, 'specularMap', textureMapKeys ).onChange( updateTexture( material, 'specularMap', textureMaps ) );
-	folder.add( data, 'alphaMap', textureMapKeys ).onChange( updateTexture( material, 'alphaMap', textureMaps ) );
+	folder.add( data, 'map', diffuseMapKeys ).onChange( updateTexture( material, 'map', diffuseMaps ) );
+	folder.add( data, 'alphaMap', alphaMapKeys ).onChange( updateTexture( material, 'alphaMap', alphaMaps ) );
 	folder.add( material, 'combine', constants.combine );
 	folder.add( material, 'combine', constants.combine );
 	folder.add( material, 'reflectivity', 0, 1 );
 	folder.add( material, 'reflectivity', 0, 1 );
 	folder.add( material, 'refractionRatio', 0, 1 );
 	folder.add( material, 'refractionRatio', 0, 1 );
 
 
 }
 }
 
 
+function guiMeshMatcapMaterial( gui, mesh, material ) {
+
+	var data = {
+		color: material.color.getHex(),
+		matcap: matcapKeys[ 1 ],
+		alphaMap: alphaMapKeys[ 0 ]
+	};
+
+	var folder = gui.addFolder( 'THREE.MeshMatcapMaterial' );
+
+	folder.addColor( data, 'color' ).onChange( handleColorChange( material.color ) );
+	folder.add( data, 'matcap', matcapKeys ).onChange( updateTexture( material, 'matcap', matcaps ) );
+	folder.add( data, 'alphaMap', alphaMapKeys ).onChange( updateTexture( material, 'alphaMap', alphaMaps ) );
+
+}
+
 function guiMeshPhongMaterial( gui, mesh, material, geometry ) {
 function guiMeshPhongMaterial( gui, mesh, material, geometry ) {
 
 
 	var data = {
 	var data = {
 		color: material.color.getHex(),
 		color: material.color.getHex(),
 		emissive: material.emissive.getHex(),
 		emissive: material.emissive.getHex(),
 		specular: material.specular.getHex(),
 		specular: material.specular.getHex(),
-		envMaps: envMapKeys,
-		map: textureMapKeys,
-		lightMap: textureMapKeys,
-		specularMap: textureMapKeys,
-		alphaMap: textureMapKeys
+		envMaps: envMapKeys[ 0 ],
+		map: diffuseMapKeys[ 0 ],
+		alphaMap: alphaMapKeys[ 0 ]
 	};
 	};
 
 
 	var folder = gui.addFolder( 'THREE.MeshPhongMaterial' );
 	var folder = gui.addFolder( 'THREE.MeshPhongMaterial' );
@@ -384,10 +466,27 @@ function guiMeshPhongMaterial( gui, mesh, material, geometry ) {
 	folder.add( material, 'vertexColors', constants.colors ).onChange( needsUpdate( material, geometry ) );
 	folder.add( material, 'vertexColors', constants.colors ).onChange( needsUpdate( material, geometry ) );
 	folder.add( material, 'fog' );
 	folder.add( material, 'fog' );
 	folder.add( data, 'envMaps', envMapKeys ).onChange( updateTexture( material, 'envMap', envMaps ) );
 	folder.add( data, 'envMaps', envMapKeys ).onChange( updateTexture( material, 'envMap', envMaps ) );
-	folder.add( data, 'map', textureMapKeys ).onChange( updateTexture( material, 'map', textureMaps ) );
-	folder.add( data, 'lightMap', textureMapKeys ).onChange( updateTexture( material, 'lightMap', textureMaps ) );
-	folder.add( data, 'specularMap', textureMapKeys ).onChange( updateTexture( material, 'specularMap', textureMaps ) );
-	folder.add( data, 'alphaMap', textureMapKeys ).onChange( updateTexture( material, 'alphaMap', textureMaps ) );
+	folder.add( data, 'map', diffuseMapKeys ).onChange( updateTexture( material, 'map', diffuseMaps ) );
+	folder.add( data, 'alphaMap', alphaMapKeys ).onChange( updateTexture( material, 'alphaMap', alphaMaps ) );
+
+}
+
+function guiMeshToonMaterial( gui, mesh, material ) {
+
+	var data = {
+		color: material.color.getHex(),
+		map: diffuseMapKeys[ 0 ],
+		gradientMap: gradientMapKeys[ 1 ],
+		alphaMap: alphaMapKeys[ 0 ]
+	};
+
+	var folder = gui.addFolder( 'THREE.MeshToonMaterial' );
+
+	folder.addColor( data, 'color' ).onChange( handleColorChange( material.color ) );
+
+	folder.add( data, 'map', diffuseMapKeys ).onChange( updateTexture( material, 'map', diffuseMaps ) );
+	folder.add( data, 'gradientMap', gradientMapKeys ).onChange( updateTexture( material, 'gradientMap', gradientMaps ) );
+	folder.add( data, 'alphaMap', alphaMapKeys ).onChange( updateTexture( material, 'alphaMap', alphaMaps ) );
 
 
 }
 }
 
 
@@ -396,11 +495,10 @@ function guiMeshStandardMaterial( gui, mesh, material, geometry ) {
 	var data = {
 	var data = {
 		color: material.color.getHex(),
 		color: material.color.getHex(),
 		emissive: material.emissive.getHex(),
 		emissive: material.emissive.getHex(),
-		envMaps: envMapKeys,
-		map: textureMapKeys,
-		lightMap: textureMapKeys,
-		specularMap: textureMapKeys,
-		alphaMap: textureMapKeys
+		envMaps: envMapKeys[ 0 ],
+		map: diffuseMapKeys[ 0 ],
+		roughnessMap: roughnessMapKeys[ 0 ],
+		alphaMap: alphaMapKeys[ 0 ]
 	};
 	};
 
 
 	var folder = gui.addFolder( 'THREE.MeshStandardMaterial' );
 	var folder = gui.addFolder( 'THREE.MeshStandardMaterial' );
@@ -416,11 +514,11 @@ function guiMeshStandardMaterial( gui, mesh, material, geometry ) {
 	folder.add( material, 'vertexColors', constants.colors ).onChange( needsUpdate( material, geometry ) );
 	folder.add( material, 'vertexColors', constants.colors ).onChange( needsUpdate( material, geometry ) );
 	folder.add( material, 'fog' );
 	folder.add( material, 'fog' );
 	folder.add( data, 'envMaps', envMapKeys ).onChange( updateTexture( material, 'envMap', envMaps ) );
 	folder.add( data, 'envMaps', envMapKeys ).onChange( updateTexture( material, 'envMap', envMaps ) );
-	folder.add( data, 'map', textureMapKeys ).onChange( updateTexture( material, 'map', textureMaps ) );
-	folder.add( data, 'lightMap', textureMapKeys ).onChange( updateTexture( material, 'lightMap', textureMaps ) );
-	folder.add( data, 'alphaMap', textureMapKeys ).onChange( updateTexture( material, 'alphaMap', textureMaps ) );
+	folder.add( data, 'map', diffuseMapKeys ).onChange( updateTexture( material, 'map', diffuseMaps ) );
+	folder.add( data, 'roughnessMap', roughnessMapKeys ).onChange( updateTexture( material, 'roughnessMap', roughnessMaps ) );
+	folder.add( data, 'alphaMap', alphaMapKeys ).onChange( updateTexture( material, 'alphaMap', alphaMaps ) );
 
 
-	// TODO roughnessMap and metalnessMap
+	// TODO metalnessMap
 
 
 }
 }
 
 
@@ -429,11 +527,10 @@ function guiMeshPhysicalMaterial( gui, mesh, material, geometry ) {
 	var data = {
 	var data = {
 		color: material.color.getHex(),
 		color: material.color.getHex(),
 		emissive: material.emissive.getHex(),
 		emissive: material.emissive.getHex(),
-		envMaps: envMapKeys,
-		map: textureMapKeys,
-		lightMap: textureMapKeys,
-		specularMap: textureMapKeys,
-		alphaMap: textureMapKeys
+		envMaps: envMapKeys[ 0 ],
+		map: diffuseMapKeys[ 0 ],
+		roughnessMap: roughnessMapKeys[ 0 ],
+		alphaMap: alphaMapKeys[ 0 ]
 	};
 	};
 
 
 	var folder = gui.addFolder( 'THREE.MeshPhysicalMaterial' );
 	var folder = gui.addFolder( 'THREE.MeshPhysicalMaterial' );
@@ -452,11 +549,11 @@ function guiMeshPhysicalMaterial( gui, mesh, material, geometry ) {
 	folder.add( material, 'vertexColors', constants.colors ).onChange( needsUpdate( material, geometry ) );
 	folder.add( material, 'vertexColors', constants.colors ).onChange( needsUpdate( material, geometry ) );
 	folder.add( material, 'fog' );
 	folder.add( material, 'fog' );
 	folder.add( data, 'envMaps', envMapKeys ).onChange( updateTexture( material, 'envMap', envMaps ) );
 	folder.add( data, 'envMaps', envMapKeys ).onChange( updateTexture( material, 'envMap', envMaps ) );
-	folder.add( data, 'map', textureMapKeys ).onChange( updateTexture( material, 'map', textureMaps ) );
-	folder.add( data, 'lightMap', textureMapKeys ).onChange( updateTexture( material, 'lightMap', textureMaps ) );
-	folder.add( data, 'alphaMap', textureMapKeys ).onChange( updateTexture( material, 'alphaMap', textureMaps ) );
+	folder.add( data, 'map', diffuseMapKeys ).onChange( updateTexture( material, 'map', diffuseMaps ) );
+	folder.add( data, 'roughnessMap', roughnessMapKeys ).onChange( updateTexture( material, 'roughnessMap', roughnessMaps ) );
+	folder.add( data, 'alphaMap', alphaMapKeys ).onChange( updateTexture( material, 'alphaMap', alphaMaps ) );
 
 
-	// TODO roughnessMap and metalnessMap
+	// TODO metalnessMap
 
 
 }
 }
 
 
@@ -487,6 +584,16 @@ function chooseFromHash( gui, mesh, geometry ) {
 
 
 			break;
 			break;
 
 
+		case 'MeshMatcapMaterial' :
+
+			material = new THREE.MeshMatcapMaterial( { matcap: matcaps.porcelainWhite } );
+			guiMaterial( gui, mesh, material, geometry );
+			guiMeshMatcapMaterial( gui, mesh, material, geometry );
+
+			return material;
+
+			break;
+
 		case 'MeshPhongMaterial' :
 		case 'MeshPhongMaterial' :
 
 
 			material = new THREE.MeshPhongMaterial( { color: 0x2194CE } );
 			material = new THREE.MeshPhongMaterial( { color: 0x2194CE } );
@@ -497,6 +604,21 @@ function chooseFromHash( gui, mesh, geometry ) {
 
 
 			break;
 			break;
 
 
+		case 'MeshToonMaterial' :
+
+			material = new THREE.MeshToonMaterial( { color: 0x2194CE, gradientMap: gradientMaps.threeTone } );
+			guiMaterial( gui, mesh, material, geometry );
+			guiMeshToonMaterial( gui, mesh, material, geometry );
+
+			// only use a single point light
+
+			lights[ 0 ].visible = false;
+			lights[ 2 ].visible = false;
+
+			return material;
+
+			break;
+
 		case 'MeshStandardMaterial' :
 		case 'MeshStandardMaterial' :
 
 
 			material = new THREE.MeshStandardMaterial( { color: 0x2194CE } );
 			material = new THREE.MeshStandardMaterial( { color: 0x2194CE } );

+ 5 - 16
docs/scenes/material-browser.html

@@ -3,22 +3,9 @@
 	<head>
 	<head>
 		<meta charset="utf-8">
 		<meta charset="utf-8">
 		<title>Three.js Material Browser</title>
 		<title>Three.js Material Browser</title>
+		<link rel="shortcut icon" href="../../files/favicon.ico" />
+		<link rel="stylesheet" type="text/css" href="../../files/main.css">
 		<style>
 		<style>
-			@font-face {
-				font-family: 'inconsolata';
-				src: url('../files/inconsolata.woff') format('woff');
-				font-weight: normal;
-				font-style: normal;
-			}
-
-			body {
-				margin:0;
-				font-family: 'inconsolata';
-				font-size: 15px;
-				line-height: 18px;
-				overflow: hidden;
-			}
-
 			canvas { width: 100%; height: 100% }
 			canvas { width: 100%; height: 100% }
 
 
 			#newWindow {
 			#newWindow {
@@ -43,14 +30,16 @@
 			document.getElementById( 'newWindow' ).href += window.location.hash;
 			document.getElementById( 'newWindow' ).href += window.location.hash;
 
 
 			var gui = new dat.GUI();
 			var gui = new dat.GUI();
+
 			var scene = new THREE.Scene();
 			var scene = new THREE.Scene();
+			scene.background = new THREE.Color( 0x444444 );
+
 			var camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 10, 50 );
 			var camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 10, 50 );
 			camera.position.z = 30;
 			camera.position.z = 30;
 
 
 			var renderer = new THREE.WebGLRenderer( { antialias: true } );
 			var renderer = new THREE.WebGLRenderer( { antialias: true } );
 			renderer.setPixelRatio( window.devicePixelRatio );
 			renderer.setPixelRatio( window.devicePixelRatio );
 			renderer.setSize( window.innerWidth, window.innerHeight );
 			renderer.setSize( window.innerWidth, window.innerHeight );
-			renderer.setClearColor( 0x000000, 1 );
 			document.body.appendChild( renderer.domElement );
 			document.body.appendChild( renderer.domElement );
 
 
 			var ambientLight = new THREE.AmbientLight( 0x000000 );
 			var ambientLight = new THREE.AmbientLight( 0x000000 );

+ 6 - 0
editor/index.html

@@ -6,6 +6,7 @@
 		<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
 		<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
 		<link rel="apple-touch-icon" href="images/icon.png">
 		<link rel="apple-touch-icon" href="images/icon.png">
 		<link rel="manifest" href="manifest.json">
 		<link rel="manifest" href="manifest.json">
+		<link rel="shortcut icon" href="../files/favicon.ico" />
 	</head>
 	</head>
 	<body ontouchstart="">
 	<body ontouchstart="">
 		<link rel="stylesheet" href="css/main.css">
 		<link rel="stylesheet" href="css/main.css">
@@ -125,9 +126,14 @@
 		<script src="js/Sidebar.Geometry.BoxGeometry.js"></script>
 		<script src="js/Sidebar.Geometry.BoxGeometry.js"></script>
 		<script src="js/Sidebar.Geometry.CircleGeometry.js"></script>
 		<script src="js/Sidebar.Geometry.CircleGeometry.js"></script>
 		<script src="js/Sidebar.Geometry.CylinderGeometry.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.IcosahedronGeometry.js"></script>
+		<script src="js/Sidebar.Geometry.OctahedronGeometry.js"></script>
 		<script src="js/Sidebar.Geometry.PlaneGeometry.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.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.TorusGeometry.js"></script>
 		<script src="js/Sidebar.Geometry.TorusKnotGeometry.js"></script>
 		<script src="js/Sidebar.Geometry.TorusKnotGeometry.js"></script>
 		<script src="js/Sidebar.Geometry.TubeGeometry.js"></script>
 		<script src="js/Sidebar.Geometry.TubeGeometry.js"></script>

+ 7 - 1
editor/js/Editor.js

@@ -482,7 +482,11 @@ Editor.prototype = {
 
 
 	focus: function ( object ) {
 	focus: function ( object ) {
 
 
-		this.signals.objectFocused.dispatch( object );
+		if ( object !== undefined ) {
+
+			this.signals.objectFocused.dispatch( object );
+
+		}
 
 
 	},
 	},
 
 
@@ -498,6 +502,8 @@ Editor.prototype = {
 		this.storage.clear();
 		this.storage.clear();
 
 
 		this.camera.copy( this.DEFAULT_CAMERA );
 		this.camera.copy( this.DEFAULT_CAMERA );
+		this.scene.name = "Scene";
+		this.scene.userData = {};
 		this.scene.background.setHex( 0xaaaaaa );
 		this.scene.background.setHex( 0xaaaaaa );
 		this.scene.fog = null;
 		this.scene.fog = null;
 
 

+ 2 - 2
editor/js/History.js

@@ -173,7 +173,7 @@ History.prototype = {
 
 
 		// Append Undos to History
 		// Append Undos to History
 
 
-		for ( var i = 0 ; i < this.undos.length; i ++ ) {
+		for ( var i = 0; i < this.undos.length; i ++ ) {
 
 
 			if ( this.undos[ i ].hasOwnProperty( "json" ) ) {
 			if ( this.undos[ i ].hasOwnProperty( "json" ) ) {
 
 
@@ -185,7 +185,7 @@ History.prototype = {
 
 
 		// Append Redos to History
 		// Append Redos to History
 
 
-		for ( var i = 0 ; i < this.redos.length; i ++ ) {
+		for ( var i = 0; i < this.redos.length; i ++ ) {
 
 
 			if ( this.redos[ i ].hasOwnProperty( "json" ) ) {
 			if ( this.redos[ i ].hasOwnProperty( "json" ) ) {
 
 

+ 161 - 98
editor/js/Menubar.Add.js

@@ -37,23 +37,6 @@ Menubar.Add = function ( editor ) {
 
 
 	options.add( new UI.HorizontalRule() );
 	options.add( new UI.HorizontalRule() );
 
 
-	// Plane
-
-	var option = new UI.Row();
-	option.setClass( 'option' );
-	option.setTextContent( strings.getKey( 'menubar/add/plane' ) );
-	option.onClick( function () {
-
-		var geometry = new THREE.PlaneBufferGeometry( 1, 1, 1, 1 );
-		var material = new THREE.MeshStandardMaterial();
-		var mesh = new THREE.Mesh( geometry, material );
-		mesh.name = 'Plane';
-
-		editor.execute( new AddObjectCommand( mesh ) );
-
-	} );
-	options.add( option );
-
 	// Box
 	// Box
 
 
 	var option = new UI.Row();
 	var option = new UI.Row();
@@ -102,6 +85,101 @@ Menubar.Add = function ( editor ) {
 	} );
 	} );
 	options.add( option );
 	options.add( option );
 
 
+	// Icosahedron
+
+	var option = new UI.Row();
+	option.setClass( 'option' );
+	option.setTextContent( strings.getKey( 'menubar/add/icosahedron' ) );
+	option.onClick( function () {
+
+		var geometry = new THREE.IcosahedronBufferGeometry( 1, 0 );
+		var mesh = new THREE.Mesh( geometry, new THREE.MeshStandardMaterial() );
+		mesh.name = 'Icosahedron';
+
+		editor.execute( new AddObjectCommand( mesh ) );
+
+	} );
+	options.add( option );
+
+	// Lathe
+
+	var option = new UI.Row();
+	option.setClass( 'option' );
+	option.setTextContent( strings.getKey( 'menubar/add/lathe' ) );
+	option.onClick( function () {
+
+		var points = [
+			new THREE.Vector2( 0, 0 ),
+			new THREE.Vector2( 0.4, 0 ),
+			new THREE.Vector2( 0.35, 0.05 ),
+			new THREE.Vector2( 0.1, 0.075 ),
+			new THREE.Vector2( 0.08, 0.1 ),
+			new THREE.Vector2( 0.08, 0.4 ),
+			new THREE.Vector2( 0.1, 0.42 ),
+			new THREE.Vector2( 0.14, 0.48 ),
+			new THREE.Vector2( 0.2, 0.5 ),
+			new THREE.Vector2( 0.25, 0.54 ),
+			new THREE.Vector2( 0.3, 1.2 )
+		];
+
+		var geometry = new THREE.LatheBufferGeometry( points, 12, 0, Math.PI * 2 );
+		var mesh = new THREE.Mesh( geometry, new THREE.MeshStandardMaterial( { side: THREE.DoubleSide } ) );
+		mesh.name = 'Lathe';
+
+		editor.execute( new AddObjectCommand( mesh ) );
+
+	} );
+	options.add( option );
+
+	// Octahedron
+
+	var option = new UI.Row();
+	option.setClass( 'option' );
+	option.setTextContent( strings.getKey( 'menubar/add/octahedron' ) );
+	option.onClick( function () {
+
+		var geometry = new THREE.OctahedronBufferGeometry( 1, 0 );
+		var mesh = new THREE.Mesh( geometry, new THREE.MeshStandardMaterial() );
+		mesh.name = 'Octahedron';
+
+		editor.execute( new AddObjectCommand( mesh ) );
+
+	} );
+	options.add( option );
+
+	// Plane
+
+	var option = new UI.Row();
+	option.setClass( 'option' );
+	option.setTextContent( strings.getKey( 'menubar/add/plane' ) );
+	option.onClick( function () {
+
+		var geometry = new THREE.PlaneBufferGeometry( 1, 1, 1, 1 );
+		var material = new THREE.MeshStandardMaterial();
+		var mesh = new THREE.Mesh( geometry, material );
+		mesh.name = 'Plane';
+
+		editor.execute( new AddObjectCommand( mesh ) );
+
+	} );
+	options.add( option )
+
+	// Ring
+
+	var option = new UI.Row();
+	option.setClass( 'option' );
+	option.setTextContent( strings.getKey( 'menubar/add/ring' ) );
+	option.onClick( function () {
+
+		var geometry = new THREE.RingBufferGeometry( 0.5, 1, 8, 1, 0, Math.PI * 2 );
+		var mesh = new THREE.Mesh( geometry, new THREE.MeshStandardMaterial() );
+		mesh.name = 'Ring';
+
+		editor.execute( new AddObjectCommand( mesh ) );
+
+	} );
+	options.add( option );
+
 	// Sphere
 	// Sphere
 
 
 	var option = new UI.Row();
 	var option = new UI.Row();
@@ -118,16 +196,31 @@ Menubar.Add = function ( editor ) {
 	} );
 	} );
 	options.add( option );
 	options.add( option );
 
 
-	// Icosahedron
+	// Sprite
 
 
 	var option = new UI.Row();
 	var option = new UI.Row();
 	option.setClass( 'option' );
 	option.setClass( 'option' );
-	option.setTextContent( strings.getKey( 'menubar/add/icosahedron' ) );
+	option.setTextContent( strings.getKey( 'menubar/add/sprite' ) );
 	option.onClick( function () {
 	option.onClick( function () {
 
 
-		var geometry = new THREE.IcosahedronBufferGeometry( 1, 0 );
+		var sprite = new THREE.Sprite( new THREE.SpriteMaterial() );
+		sprite.name = 'Sprite';
+
+		editor.execute( new AddObjectCommand( sprite ) );
+
+	} );
+	options.add( option );
+
+	// Tetrahedron
+
+	var option = new UI.Row();
+	option.setClass( 'option' );
+	option.setTextContent( strings.getKey( 'menubar/add/tetrahedron' ) );
+	option.onClick( function () {
+
+		var geometry = new THREE.TetrahedronBufferGeometry( 1, 0 );
 		var mesh = new THREE.Mesh( geometry, new THREE.MeshStandardMaterial() );
 		var mesh = new THREE.Mesh( geometry, new THREE.MeshStandardMaterial() );
-		mesh.name = 'Icosahedron';
+		mesh.name = 'Tetrahedron';
 
 
 		editor.execute( new AddObjectCommand( mesh ) );
 		editor.execute( new AddObjectCommand( mesh ) );
 
 
@@ -218,161 +311,131 @@ Menubar.Add = function ( editor ) {
 	options.add( option );
 	options.add( option );
 	*/
 	*/
 
 
-	// Lathe
-
-	var option = new UI.Row();
-	option.setClass( 'option' );
-	option.setTextContent( strings.getKey( 'menubar/add/lathe' ) );
-	option.onClick( function () {
-
-		var points = [
-			new THREE.Vector2( 0, 0 ),
-			new THREE.Vector2( 0.4, 0 ),
-			new THREE.Vector2( 0.35, 0.05 ),
-			new THREE.Vector2( 0.1, 0.075 ),
-			new THREE.Vector2( 0.08, 0.1 ),
-			new THREE.Vector2( 0.08, 0.4 ),
-			new THREE.Vector2( 0.1, 0.42 ),
-			new THREE.Vector2( 0.14, 0.48 ),
-			new THREE.Vector2( 0.2, 0.5 ),
-			new THREE.Vector2( 0.25, 0.54 ),
-			new THREE.Vector2( 0.3, 1.2 )
-		];
-
-		var geometry = new THREE.LatheBufferGeometry( points, 12, 0, Math.PI * 2 );
-		var mesh = new THREE.Mesh( geometry, new THREE.MeshStandardMaterial( { side: THREE.DoubleSide } ) );
-		mesh.name = 'Lathe';
-
-		editor.execute( new AddObjectCommand( mesh ) );
+	//
 
 
-	} );
-	options.add( option );
+	options.add( new UI.HorizontalRule() );
 
 
-	// Sprite
+	// AmbientLight
 
 
 	var option = new UI.Row();
 	var option = new UI.Row();
 	option.setClass( 'option' );
 	option.setClass( 'option' );
-	option.setTextContent( strings.getKey( 'menubar/add/sprite' ) );
+	option.setTextContent( strings.getKey( 'menubar/add/ambientlight' ) );
 	option.onClick( function () {
 	option.onClick( function () {
 
 
-		var sprite = new THREE.Sprite( new THREE.SpriteMaterial() );
-		sprite.name = 'Sprite';
+		var color = 0x222222;
 
 
-		editor.execute( new AddObjectCommand( sprite ) );
+		var light = new THREE.AmbientLight( color );
+		light.name = 'AmbientLight';
+
+		editor.execute( new AddObjectCommand( light ) );
 
 
 	} );
 	} );
 	options.add( option );
 	options.add( option );
 
 
-	//
-
-	options.add( new UI.HorizontalRule() );
-
-	// PointLight
+	// DirectionalLight
 
 
 	var option = new UI.Row();
 	var option = new UI.Row();
 	option.setClass( 'option' );
 	option.setClass( 'option' );
-	option.setTextContent( strings.getKey( 'menubar/add/pointlight' ) );
+	option.setTextContent( strings.getKey( 'menubar/add/directionallight' ) );
 	option.onClick( function () {
 	option.onClick( function () {
 
 
 		var color = 0xffffff;
 		var color = 0xffffff;
 		var intensity = 1;
 		var intensity = 1;
-		var distance = 0;
 
 
-		var light = new THREE.PointLight( color, intensity, distance );
-		light.name = 'PointLight';
+		var light = new THREE.DirectionalLight( color, intensity );
+		light.name = 'DirectionalLight';
+		light.target.name = 'DirectionalLight Target';
+
+		light.position.set( 5, 10, 7.5 );
 
 
 		editor.execute( new AddObjectCommand( light ) );
 		editor.execute( new AddObjectCommand( light ) );
 
 
 	} );
 	} );
 	options.add( option );
 	options.add( option );
 
 
-	// SpotLight
+	// HemisphereLight
 
 
 	var option = new UI.Row();
 	var option = new UI.Row();
 	option.setClass( 'option' );
 	option.setClass( 'option' );
-	option.setTextContent( strings.getKey( 'menubar/add/spotlight' ) );
+	option.setTextContent( strings.getKey( 'menubar/add/hemispherelight' ) );
 	option.onClick( function () {
 	option.onClick( function () {
 
 
-		var color = 0xffffff;
+		var skyColor = 0x00aaff;
+		var groundColor = 0xffaa00;
 		var intensity = 1;
 		var intensity = 1;
-		var distance = 0;
-		var angle = Math.PI * 0.1;
-		var penumbra = 0;
 
 
-		var light = new THREE.SpotLight( color, intensity, distance, angle, penumbra );
-		light.name = 'SpotLight';
-		light.target.name = 'SpotLight Target';
+		var light = new THREE.HemisphereLight( skyColor, groundColor, intensity );
+		light.name = 'HemisphereLight';
 
 
-		light.position.set( 5, 10, 7.5 );
+		light.position.set( 0, 10, 0 );
 
 
 		editor.execute( new AddObjectCommand( light ) );
 		editor.execute( new AddObjectCommand( light ) );
 
 
 	} );
 	} );
 	options.add( option );
 	options.add( option );
 
 
-	// DirectionalLight
+	// PointLight
 
 
 	var option = new UI.Row();
 	var option = new UI.Row();
 	option.setClass( 'option' );
 	option.setClass( 'option' );
-	option.setTextContent( strings.getKey( 'menubar/add/directionallight' ) );
+	option.setTextContent( strings.getKey( 'menubar/add/pointlight' ) );
 	option.onClick( function () {
 	option.onClick( function () {
 
 
 		var color = 0xffffff;
 		var color = 0xffffff;
 		var intensity = 1;
 		var intensity = 1;
+		var distance = 0;
 
 
-		var light = new THREE.DirectionalLight( color, intensity );
-		light.name = 'DirectionalLight';
-		light.target.name = 'DirectionalLight Target';
-
-		light.position.set( 5, 10, 7.5 );
+		var light = new THREE.PointLight( color, intensity, distance );
+		light.name = 'PointLight';
 
 
 		editor.execute( new AddObjectCommand( light ) );
 		editor.execute( new AddObjectCommand( light ) );
 
 
 	} );
 	} );
 	options.add( option );
 	options.add( option );
 
 
-	// HemisphereLight
+	// SpotLight
 
 
 	var option = new UI.Row();
 	var option = new UI.Row();
 	option.setClass( 'option' );
 	option.setClass( 'option' );
-	option.setTextContent( strings.getKey( 'menubar/add/hemispherelight' ) );
+	option.setTextContent( strings.getKey( 'menubar/add/spotlight' ) );
 	option.onClick( function () {
 	option.onClick( function () {
 
 
-		var skyColor = 0x00aaff;
-		var groundColor = 0xffaa00;
+		var color = 0xffffff;
 		var intensity = 1;
 		var intensity = 1;
+		var distance = 0;
+		var angle = Math.PI * 0.1;
+		var penumbra = 0;
 
 
-		var light = new THREE.HemisphereLight( skyColor, groundColor, intensity );
-		light.name = 'HemisphereLight';
+		var light = new THREE.SpotLight( color, intensity, distance, angle, penumbra );
+		light.name = 'SpotLight';
+		light.target.name = 'SpotLight Target';
 
 
-		light.position.set( 0, 10, 0 );
+		light.position.set( 5, 10, 7.5 );
 
 
 		editor.execute( new AddObjectCommand( light ) );
 		editor.execute( new AddObjectCommand( light ) );
 
 
 	} );
 	} );
 	options.add( option );
 	options.add( option );
 
 
-	// AmbientLight
+	//
+
+	options.add( new UI.HorizontalRule() );
+
+	// OrthographicCamera
 
 
 	var option = new UI.Row();
 	var option = new UI.Row();
 	option.setClass( 'option' );
 	option.setClass( 'option' );
-	option.setTextContent( strings.getKey( 'menubar/add/ambientlight' ) );
+	option.setTextContent( strings.getKey( 'menubar/add/orthographiccamera' ) );
 	option.onClick( function () {
 	option.onClick( function () {
 
 
-		var color = 0x222222;
+		var camera = new THREE.OrthographicCamera();
+		camera.name = 'OrthographicCamera';
 
 
-		var light = new THREE.AmbientLight( color );
-		light.name = 'AmbientLight';
-
-		editor.execute( new AddObjectCommand( light ) );
+		editor.execute( new AddObjectCommand( camera ) );
 
 
 	} );
 	} );
 	options.add( option );
 	options.add( option );
 
 
-	//
-
-	options.add( new UI.HorizontalRule() );
-
 	// PerspectiveCamera
 	// PerspectiveCamera
 
 
 	var option = new UI.Row();
 	var option = new UI.Row();

+ 62 - 0
editor/js/Menubar.Edit.js

@@ -199,6 +199,68 @@ Menubar.Edit = function ( editor ) {
 	} );
 	} );
 	options.add( option );
 	options.add( option );
 
 
+	options.add( new UI.HorizontalRule() );
+
+	// Set textures to sRGB. See #15903
+
+	var option = new UI.Row();
+	option.setClass( 'option' );
+	option.setTextContent( strings.getKey( 'menubar/edit/fixcolormaps' ) );
+	option.onClick( function () {
+
+		editor.scene.traverse( fixColorMap );
+
+	} );
+	options.add( option );
+
+	var colorMaps = [ 'map', 'envMap', 'emissiveMap' ];
+
+	function fixColorMap( obj ) {
+
+		var material = obj.material;
+
+		if ( material !== undefined ) {
+
+			if ( Array.isArray( material ) === true ) {
+
+				for ( var i = 0; i < material.length; i ++ ) {
+
+					fixMaterial( material[ i ] );
+
+				}
+
+			} else {
+
+				fixMaterial( material );
+
+			}
+
+			editor.signals.sceneGraphChanged.dispatch();
+
+		}
+
+	}
+
+	function fixMaterial( material ) {
+
+		var needsUpdate = material.needsUpdate;
+
+		for ( var i = 0; i < colorMaps.length; i ++ ) {
+
+			var map = material[ colorMaps[ i ] ];
+
+			if ( map ) {
+
+				map.encoding = THREE.sRGBEncoding;
+				needsUpdate = true;
+
+			}
+
+		}
+
+		material.needsUpdate = needsUpdate;
+
+	}
 
 
 	return container;
 	return container;
 
 

+ 1 - 4
editor/js/Menubar.File.js

@@ -393,14 +393,11 @@ Menubar.File = function ( editor ) {
 	//
 	//
 
 
 	var link = document.createElement( 'a' );
 	var link = document.createElement( 'a' );
-	link.style.display = 'none';
-	document.body.appendChild( link ); // Firefox workaround, see #6594
-
 	function save( blob, filename ) {
 	function save( blob, filename ) {
 
 
 		link.href = URL.createObjectURL( blob );
 		link.href = URL.createObjectURL( blob );
 		link.download = filename || 'data.json';
 		link.download = filename || 'data.json';
-		link.click();
+		link.dispatchEvent( new MouseEvent( 'click' ) );
 
 
 		// URL.revokeObjectURL( url ); breaks Firefox...
 		// URL.revokeObjectURL( url ); breaks Firefox...
 
 

+ 22 - 19
editor/js/Script.js

@@ -20,6 +20,7 @@ var Script = function ( editor ) {
 	header.add( title );
 	header.add( title );
 
 
 	var buttonSVG = ( function () {
 	var buttonSVG = ( function () {
+
 		var svg = document.createElementNS( 'http://www.w3.org/2000/svg', 'svg' );
 		var svg = document.createElementNS( 'http://www.w3.org/2000/svg', 'svg' );
 		svg.setAttribute( 'width', 32 );
 		svg.setAttribute( 'width', 32 );
 		svg.setAttribute( 'height', 32 );
 		svg.setAttribute( 'height', 32 );
@@ -28,6 +29,7 @@ var Script = function ( editor ) {
 		path.setAttribute( 'stroke', '#fff' );
 		path.setAttribute( 'stroke', '#fff' );
 		svg.appendChild( path );
 		svg.appendChild( path );
 		return svg;
 		return svg;
+
 	} )();
 	} )();
 
 
 	var close = new UI.Element( buttonSVG );
 	var close = new UI.Element( buttonSVG );
@@ -80,7 +82,7 @@ var Script = function ( editor ) {
 
 
 			if ( ! validate( value ) ) return;
 			if ( ! validate( value ) ) return;
 
 
-			if ( typeof( currentScript ) === 'object' ) {
+			if ( typeof ( currentScript ) === 'object' ) {
 
 
 				if ( value !== currentScript.source ) {
 				if ( value !== currentScript.source ) {
 
 
@@ -88,6 +90,7 @@ var Script = function ( editor ) {
 
 
 				}
 				}
 				return;
 				return;
+
 			}
 			}
 
 
 			if ( currentScript !== 'programInfo' ) return;
 			if ( currentScript !== 'programInfo' ) return;
@@ -118,7 +121,7 @@ var Script = function ( editor ) {
 
 
 		}, 300 );
 		}, 300 );
 
 
-	});
+	} );
 
 
 	// prevent backspace from deleting objects
 	// prevent backspace from deleting objects
 	var wrapper = codemirror.getWrapperElement();
 	var wrapper = codemirror.getWrapperElement();
@@ -177,7 +180,7 @@ var Script = function ( editor ) {
 					for ( var i = 0; i < errors.length; i ++ ) {
 					for ( var i = 0; i < errors.length; i ++ ) {
 
 
 						var error = errors[ i ];
 						var error = errors[ i ];
-						error.message = error.message.replace(/Line [0-9]+: /, '');
+						error.message = error.message.replace( /Line [0-9]+: /, '' );
 
 
 					}
 					}
 
 
@@ -189,7 +192,7 @@ var Script = function ( editor ) {
 
 
 					jsonlint.parseError = function ( message, info ) {
 					jsonlint.parseError = function ( message, info ) {
 
 
-						message = message.split('\n')[3];
+						message = message.split( '\n' )[ 3 ];
 
 
 						errors.push( {
 						errors.push( {
 
 
@@ -217,11 +220,11 @@ var Script = function ( editor ) {
 					try {
 					try {
 
 
 						var shaderType = currentScript === 'vertexShader' ?
 						var shaderType = currentScript === 'vertexShader' ?
-								glslprep.Shader.VERTEX : glslprep.Shader.FRAGMENT;
+							glslprep.Shader.VERTEX : glslprep.Shader.FRAGMENT;
 
 
 						glslprep.parseGlsl( string, shaderType );
 						glslprep.parseGlsl( string, shaderType );
 
 
-					} catch( error ) {
+					} catch ( error ) {
 
 
 						if ( error instanceof glslprep.SyntaxError ) {
 						if ( error instanceof glslprep.SyntaxError ) {
 
 
@@ -254,7 +257,7 @@ var Script = function ( editor ) {
 
 
 					for ( var i = 0, n = programs.length; i !== n; ++ i ) {
 					for ( var i = 0, n = programs.length; i !== n; ++ i ) {
 
 
-						var diagnostics = programs[i].diagnostics;
+						var diagnostics = programs[ i ].diagnostics;
 
 
 						if ( diagnostics === undefined ||
 						if ( diagnostics === undefined ||
 								diagnostics.material !== currentObject.material ) continue;
 								diagnostics.material !== currentObject.material ) continue;
@@ -262,7 +265,7 @@ var Script = function ( editor ) {
 						if ( ! diagnostics.runnable ) valid = false;
 						if ( ! diagnostics.runnable ) valid = false;
 
 
 						var shaderInfo = diagnostics[ currentScript ];
 						var shaderInfo = diagnostics[ currentScript ];
-						var lineOffset = shaderInfo.prefix.split(/\r\n|\r|\n/).length;
+						var lineOffset = shaderInfo.prefix.split( /\r\n|\r|\n/ ).length;
 
 
 						while ( true ) {
 						while ( true ) {
 
 
@@ -305,7 +308,7 @@ var Script = function ( editor ) {
 
 
 			return valid !== undefined ? valid : errors.length === 0;
 			return valid !== undefined ? valid : errors.length === 0;
 
 
-		});
+		} );
 
 
 	};
 	};
 
 
@@ -317,23 +320,23 @@ var Script = function ( editor ) {
 	} );
 	} );
 
 
 	codemirror.setOption( 'extraKeys', {
 	codemirror.setOption( 'extraKeys', {
-		'Ctrl-Space': function(cm) { server.complete(cm); },
-		'Ctrl-I': function(cm) { server.showType(cm); },
-		'Ctrl-O': function(cm) { server.showDocs(cm); },
-		'Alt-.': function(cm) { server.jumpToDef(cm); },
-		'Alt-,': function(cm) { server.jumpBack(cm); },
-		'Ctrl-Q': function(cm) { server.rename(cm); },
-		'Ctrl-.': function(cm) { server.selectName(cm); }
+		'Ctrl-Space': function ( cm ) { server.complete( cm ); },
+		'Ctrl-I': function ( cm ) { server.showType( cm ); },
+		'Ctrl-O': function ( cm ) { server.showDocs( cm ); },
+		'Alt-.': function ( cm ) { server.jumpToDef( cm ); },
+		'Alt-,': function ( cm ) { server.jumpBack( cm ); },
+		'Ctrl-Q': function ( cm ) { server.rename( cm ); },
+		'Ctrl-.': function ( cm ) { server.selectName( cm ); }
 	} );
 	} );
 
 
-	codemirror.on( 'cursorActivity', function( cm ) {
+	codemirror.on( 'cursorActivity', function ( cm ) {
 
 
 		if ( currentMode !== 'javascript' ) return;
 		if ( currentMode !== 'javascript' ) return;
 		server.updateArgHints( cm );
 		server.updateArgHints( cm );
 
 
 	} );
 	} );
 
 
-	codemirror.on( 'keypress', function( cm, kb ) {
+	codemirror.on( 'keypress', function ( cm, kb ) {
 
 
 		if ( currentMode !== 'javascript' ) return;
 		if ( currentMode !== 'javascript' ) return;
 		var typed = String.fromCharCode( kb.which || kb.keyCode );
 		var typed = String.fromCharCode( kb.which || kb.keyCode );
@@ -358,7 +361,7 @@ var Script = function ( editor ) {
 
 
 		var mode, name, source;
 		var mode, name, source;
 
 
-		if ( typeof( script ) === 'object' ) {
+		if ( typeof ( script ) === 'object' ) {
 
 
 			mode = 'javascript';
 			mode = 'javascript';
 			name = script.name;
 			name = script.name;

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

@@ -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

@@ -2,7 +2,7 @@
  * @author rfm1201
  * @author rfm1201
  */
  */
 
 
-Sidebar.Geometry.LatheGeometry = function( editor, object ) {
+Sidebar.Geometry.LatheGeometry = function ( editor, object ) {
 
 
 	var strings = editor.strings;
 	var strings = editor.strings;
 
 
@@ -45,99 +45,18 @@ Sidebar.Geometry.LatheGeometry = function( editor, object ) {
 
 
 	// points
 	// points
 
 
-	var lastPointIdx = 0;
-	var pointsUI = [];
-
 	var pointsRow = new UI.Row();
 	var pointsRow = new UI.Row();
 	pointsRow.add( new UI.Text( strings.getKey( 'sidebar/geometry/lathe_geometry/points' ) ).setWidth( '90px' ) );
 	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 );
 	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 );
 	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() {
 	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 ](
 		editor.execute( new SetGeometryCommand( object, new THREE[ geometry.type ](
-			points,
+			points.getValue(),
 			segments.getValue(),
 			segments.getValue(),
 			phiStart.getValue() / 180 * Math.PI,
 			phiStart.getValue() / 180 * Math.PI,
 			phiLength.getValue() / 180 * Math.PI
 			phiLength.getValue() / 180 * Math.PI

+ 54 - 0
editor/js/Sidebar.Geometry.OctahedronGeometry.js

@@ -0,0 +1,54 @@
+/**
+ * @author Temdog007 / http://github.com/Temdog007
+ */
+
+Sidebar.Geometry.OctahedronGeometry = function ( editor, object ) {
+
+	var strings = editor.strings;
+
+	var signals = editor.signals;
+
+	var container = new UI.Row();
+
+	var geometry = object.geometry;
+	var parameters = geometry.parameters;
+
+	// radius
+
+	var radiusRow = new UI.Row();
+	var radius = new UI.Number( parameters.radius ).onChange( update );
+
+	radiusRow.add( new UI.Text( strings.getKey( 'sidebar/geometry/octahedron_geometry/radius' ) ).setWidth( '90px' ) );
+	radiusRow.add( radius );
+
+	container.add( radiusRow );
+
+	// detail
+
+	var detailRow = new UI.Row();
+	var detail = new UI.Integer( parameters.detail ).setRange( 0, Infinity ).onChange( update );
+
+	detailRow.add( new UI.Text( strings.getKey( 'sidebar/geometry/octahedron_geometry/detail' ) ).setWidth( '90px' ) );
+	detailRow.add( detail );
+
+	container.add( detailRow );
+
+
+	//
+
+	function update() {
+
+		editor.execute( new SetGeometryCommand( object, new THREE[ geometry.type ](
+			radius.getValue(),
+			detail.getValue()
+		) ) );
+
+		signals.objectChanged.dispatch( object );
+
+	}
+
+	return container;
+
+};
+
+Sidebar.Geometry.OctahedronBufferGeometry = Sidebar.Geometry.OctahedronGeometry;

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