提交 6b812c75 编写于 作者: M Mr.doob

r67

上级 ed39bcdb
此差异已折叠。
此差异已折叠。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<script src="../../list.js"></script>
<script src="../../page.js"></script>
<link type="text/css" rel="stylesheet" href="../../page.css" />
</head>
<body>
[page:Geometry] &rarr;
<h1>[name]</h1>
<div class="desc">todo</div>
<h2>Example</h2>
<code>todo</code>
<h2>Constructor</h2>
<h3>todo</h3>
<div></div>
<h2>Properties</h2>
<h3>todo</h3>
<div>
todo
</div>
<h2>Methods</h2>
<h3>todo</h3>
<div>todo</div>
<div>
todo
</div>
<h2>Source</h2>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<script src="../../list.js"></script>
<script src="../../page.js"></script>
<link type="text/css" rel="stylesheet" href="../../page.css" />
</head>
<body>
<h1>[name]</h1>
<div class="desc">todo</div>
<h2>Example</h2>
<code>todo</code>
<h2>Constructor</h2>
<h3>todo</h3>
<div></div>
<h2>Properties</h2>
<h3>todo</h3>
<div>
todo
</div>
<h2>Methods</h2>
<h3>todo</h3>
<div>todo</div>
<div>
todo
</div>
<h2>Source</h2>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
</body>
</html>
......@@ -10,7 +10,7 @@
<h1>[name]</h1>
<div class="desc">
This is a superefficent class for geometries because it saves all data in buffers. <br />
This is a super efficient class for geometries because it saves all data in buffers. <br />
It reduces memory costs and cpu cycles. But it is not as easy to work with because of all the necessary buffer calculations.<br />
It is mainly interesting when working with static objects.
</div>
......@@ -21,7 +21,7 @@
<h3>[name]()</h3>
<div>
This creates a new [name]. It also sets several properties to an default value.
This creates a new [name]. It also sets several properties to a default value.
</div>
......
......@@ -81,11 +81,6 @@
Material index (points to [page:MeshFaceMaterial MeshFaceMaterial.materials]).
</div>
<h3>.[page:Vector3 centroid]</h3>
<div>
Face centroid.
</div>
<h2>Methods</h2>
<h3>.clone()</h3>
......
......@@ -188,11 +188,6 @@
Bakes matrix transform directly into vertex coordinates.
</div>
<h3>.computeCentroids()</h3>
<div>
Computes centroids for all faces.
</div>
<h3>.computeFaceNormals()</h3>
<div>
Computes face normals.
......
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<script src="../../list.js"></script>
<script src="../../page.js"></script>
<link type="text/css" rel="stylesheet" href="../../page.css" />
</head>
<body>
<h1>[name]</h1>
<div class="desc">
Represents a lookup table for colormaps. It is used to determine the color values from a range of data values.
</div>
<h2>Example</h2>
<code>var lut = new THREE.Lut( "rainbow", 512 );</code>
<code>var data = [0, 10.1, 4.2, 3.4, 63, 28];</code>
<code>lut.setMax(63);</code>
<code>color = lut.getColor(10);</code>
<h2>Constructor</h2>
<h3>[name]( colormap, numberOfColors )</h3>
<div>
colormap - optional argument that sets a colormap from prefefined colormaps. Available colormaps are : "rainbow", "cooltowarm", "blackbody".
numberOfColors - optional argument that sets the number of colors used to represent the data array.
</div>
<h2>Properties</h2>
<h3>.[page:Float minV]</h3>
<div>
The minimum value to be represented with the lookup table. Default is 0.
</div>
<h3>.[page:Float maxV]</h3>
<div>
The maximum value to be represented with the lookup table. Default is 1.
</div>
<h2>Methods</h2>
<h3>.copy( [page:Lut lut] ) [page:Lut this]</h3>
<div>
color — Lut to copy.
</div>
<div>
Copies given lut.
</div>
<h3>.setminV( [page:Float minV] ) [page:Lut this]</h3>
<div>
minV — The minimum value to be represented with the lookup table.<br />
</div>
<div>
Sets this Lut with the minimum value to be represented.
</div>
<h3>.setmaxV( [page:Float maxV] ) [page:Lut this]</h3>
<div>
maxV — The maximum value to be represented with the lookup table.<br />
</div>
<div>
Sets this Lut with the maximum value to be represented.
</div>
<h3>.changeNumberOfColors( [page:Float numberOfColors] ) [page:Lut this]</h3>
<div>
numberOfColors — The number of colors to be used to represent the data array.<br />
</div>
<div>
Sets this Lut with the number of colors to be used.
</div>
<h3>.changeColorMap( [page:Float colorMap] ) [page:Lut this]</h3>
<div>
colorMap — The name of the color map to be used to represent the data array.<br />
</div>
<div>
Sets this Lut with the colormap to be used.
</div>
<h3>.addColorMap( colorMapName, arrayOfColors ) [page:Lut this]</h3>
<div>
Insert a new color map into the set of available color maps.
</div>
<h3>.getColor( value ) [page:Lut this]</h3>
<div>
value -- the data value to be displayed as a color.
</div>
<div>
Returns a Three.Color.
</div>
<h2>Source</h2>
[link:https://github.com/mrdoob/three.js/blob/master/examples/js/math/[path].js examples/js/math/[path].js]
</body>
</html>
......@@ -73,7 +73,7 @@
face -- The face to use. <br />
scale -- The scale of the character. <br />
offset -- The offset of the character compared to begin of the path. <br />
path -- THe path to which to add the character points.
path -- The path to which to add the character points.
</div>
<div>
This ectracts the glyphPoints of the character of the face and returns an object containing the path and the new offset.
......
......@@ -9,7 +9,11 @@
<body>
<h1>[name]</h1>
<div class="desc">todo</div>
<div class="desc">
The AnimationHandler handles the initialisation of the Animation data and
the animations itself. It keeps track of every animation and if it's active or not.
It also update all animations which are active if its method *update* is called.
</div>
<h2>Constructor</h2>
......@@ -17,7 +21,7 @@
<h3>[name]()</h3>
<div>
todo
The animationHandler can't be called as constructor.
</div>
<h2>Properties</h2>
......@@ -25,69 +29,69 @@
<h3>.[page:number CATMULLROM]</h3>
<div>
todo
Enum Value to indicate that the animation needs to be interpolated as CATMULLROM.
</div>
<h3>.[page:number CATMULLROM_FORWARD]</h3>
<div>
todo
Enum Value to indicate that the animation needs to be interpolated as CATMULLROM_FORWARD.
</div>
<h3>.[page:number LINEAR]</h3>
<div>
todo
Enum Value to indicate that the animation needs to be interpolated as LINEAR.
</div>
<h2>Methods</h2>
<h3>.removeFromUpdate([page:todo animation]) [page:todo]</h3>
<h3>.removeFromUpdate([page:Animation animation])</h3>
<div>
animation -- todo
animation -- The Animation to remove from the update.
</div>
<div>
todo
Removes the animation from the update cycle. This gets called when the animation stops. This shouldn't be called by usercode.
</div>
<h3>.get([page:todo name]) [page:todo]</h3>
<h3>.get([page:String name]) [page:Object]</h3>
<div>
name -- todo
name -- The name of the animationData
</div>
<div>
todo
Gets the animationData from its library.
</div>
<h3>.update([page:todo deltaTimeMS]) [page:todo]</h3>
<h3>.update([page:Number deltaTimeMS]) </h3>
<div>
deltaTimeMS -- todo
deltaTimeMS -- Time elapsed since last update in milliseconds.
</div>
<div>
todo
Updates all active animations with deltaTime.
</div>
<h3>.parse([page:todo root]) [page:todo]</h3>
<h3>.parse([page:Object root])</h3>
<div>
root -- todo
root -- object
</div>
<div>
todo
Parses the object to get the hierachy.
</div>
<h3>.add([page:todo data]) [page:todo]</h3>
<h3>.add([page:object data])</h3>
<div>
data -- todo
data -- The animationData
</div>
<div>
todo
Adds the animationData from its library.
</div>
<h3>.addToUpdate([page:todo animation]) [page:todo]</h3>
<h3>.addToUpdate([page:Animation animation]) </h3>
<div>
animation -- todo
animation -- The Animation to add from the update.
</div>
<div>
todo
Adds the animation from the update cycle. This gets called when the animation starts. This shouldn't be called by user code.
</div>
<h2>Source</h2>
......
......@@ -7,26 +7,31 @@
<link type="text/css" rel="stylesheet" href="../../../page.css" />
</head>
<body>
[page:Camera] &rarr;
<h1>[name]</h1>
<div class="desc">todo</div>
<div class="desc">A general perpose camera, for setting FOV, Lens Focal Length,
and switching between perspective and orthographic views easily.
Use this only if you do not wish to manage
both a Orthographic and Perspective Camera</div>
<h2>Constructor</h2>
<h3>[name]([page:todo width], [page:todo height], [page:todo fov], [page:todo near], [page:todo far], [page:todo orthoNear], [page:todo orthoFar])</h3>
<h3>[name]([page:Number width], [page:Number height], [page:Number fov], [page:Number near], [page:Number far], [page:Number orthoNear], [page:Number orthoFar])</h3>
<div>
width -- todo <br />
height -- todo <br />
fov -- todo <br />
near -- todo <br />
far -- todo <br />
orthoNear -- todo <br />
orthoFar -- todo
width -- Camera frustum width.<br />
height -- Camera frustum height.<br />
fov — Camera frustum vertical field of view in perspective view.<br />
near — Camera frustum near plane in perspective view.<br />
far — Camera frustum far plane in perspective view.<br />
orthoNear — Camera frustum near plane in orthographic view.<br />
orthoFar — Camera frustum far plane in orthographic view.
</div>
<div>
todo
Creates a [name]. This initializes 2 cameras, an OrthographicCamera and a PerspectiveCamera. The default is the perspective Camera.
</div>
......@@ -34,147 +39,145 @@
<h3>.[page:todo fov]</h3>
<h3>.[page:Number fov]</h3>
<div>
todo
Gets or sets the camera frustum vertical field of view in perspective view.
</div>
<h3>.[page:number right]</h3>
<h3>.[page:number left]</h3>
<div>
todo
Gets or sets the camera frustum left plane in orthographic view.
</div>
<h3>.[page:number bottom]</h3>
<h3>.[page:Number right]</h3>
<div>
todo
Gets or sets the camera frustum right plane in orthographic view.
</div>
<h3>.[page:PerspectiveCamera cameraP]</h3>
<h3>.[page:number top]</h3>
<div>
todo
Gets or sets the camera frustum top plane in orthographic view.
</div>
<h3>.[page:number top]</h3>
<h3>.[page:Number bottom]</h3>
<div>
todo
Gets or sets the camera frustum bottom plane in orthographic view.
</div>
<h3>.[page:number zoom]</h3>
<div>
todo
Gets or sets the zoom factor of the camera.
</div>
<h3>.[page:number far]</h3>
<div>
todo
Gets camera frustum far plane.
</div>
<h3>.[page:number near]</h3>
<div>
todo
Gets camera frustum near plane.
</div>
<h3>.[page:boolean inPerspectiveMode]</h3>
<h3>.[page:OrthographicCamera cameraO]</h3>
<div>
todo
Gets or sets the internal OrthographicCamera used as camera.
</div>
<h3>.[page:OrthographicCamera cameraO]</h3>
<h3>.[page:PerspectiveCamera cameraP]</h3>
<div>
todo
Gets or sets the internal PerspectiveCamera used as camera.
</div>
<h3>.[page:boolean inOrthographicMode]</h3>
<div>
todo
Gets whether the combinedCamera is in Orthographic Mode.
</div>
<h3>.[page:number left]</h3>
<h3>.[page:boolean inPerspectiveMode]</h3>
<div>
todo
Gets whether the combinedCamera is in Perspective Mode.
</div>
<h2>Methods</h2>
<h3>.toBottomView() [page:todo]</h3>
<h3>.setFov([page:Number fov])</h3>
<div>
todo
fov -- Camera frustum vertical field of view in perspective view.
</div>
<h3>.setFov([page:todo fov]) [page:todo]</h3>
<div>
fov -- todo
sets the camera frustum vertical field of view in perspective view.
</div>
<h3>.setZoom([page:Number zoom]) [page:todo]</h3>
<div>
todo
zoom -- The zoom factor.
</div>
<h3>.toBackView() [page:todo]</h3>
<div>
todo
Sets the zoomfactor.
</div>
<h3>.setZoom([page:todo zoom]) [page:todo]</h3>
<h3>.setLens([page:number focalLength], [page:Number frameHeight]) [page:todo]</h3>
<div>
zoom -- todo
focalLength -- The focal length of a lens is defined as the distance from the optical center of a lens (or, the secondary principal point for a complex lens like a camera lens) to the focal point (sensor) when the lens is focused on an object at infinity. <br />
frameHeight -- the size of the frame in mm. (default is *35*)
</div>
<div>
todo
Sets the fov based on lens data.
</div>
<h3>.setLens([page:todo focalLength], [page:todo frameHeight]) [page:todo]</h3>
<h3>.toFrontView()</h3>
<div>
focalLength -- todo <br />
frameHeight -- todo
Sets the camera to view the front of the target.
</div>
<h3>.toBackView() </h3>
<div>
todo
Sets the camera to view the back of the target.
</div>
<h3>.toFrontView() [page:todo]</h3>
<h3>.toLeftView() </h3>
<div>
todo
Sets the camera to view the left of the target.
</div>
<h3>.toLeftView() [page:todo]</h3>
<h3>.toRightView()</h3>
<div>
todo
Sets the camera to view the right of the target.
</div>
<h3>.updateProjectionMatrix() [page:todo]</h3>
<h3>.toTopView()</h3>
<div>
todo
Sets the camera to view the top.
</div>
<h3>.toTopView() [page:todo]</h3>
<h3>.toBottomView()</h3>
<div>
todo
Sets the camera to view the bottom.
</div>
<h3>.toOrthographic() [page:todo]</h3>
<h3>.setSize([page:Number width], [page:Number height]) </h3>
<div>
todo
width -- The width of the orthographic view.<br />
height -- The height of the orthographic view.
</div>
<h3>.setSize([page:todo width], [page:todo height]) [page:todo]</h3>
<div>
width -- todo <br />
height -- todo
Sets the size of the orthographic view.
</div>
<h3>.toOrthographic()</h3>
<div>
todo
Change the camera to orthographic view.
</div>
<h3>.toPerspective() [page:todo]</h3>
<h3>.toPerspective()</h3>
<div>
todo
Change the camera to Perspective view.
</div>
<h3>.toRightView() [page:todo]</h3>
<h3>.updateProjectionMatrix()</h3>
<div>
todo
Updates the ProjectionMatrix.
</div>
<h2>Source</h2>
......
......@@ -7,6 +7,8 @@
<link type="text/css" rel="stylesheet" href="../../../page.css" />
</head>
<body>
[page:Object3D] &rarr;
<h1>[name]</h1>
<div class="desc">todo</div>
......
......@@ -7,6 +7,8 @@
<link type="text/css" rel="stylesheet" href="../../../page.css" />
</head>
<body>
[page:Curve] &rarr;
<h1>[name]</h1>
<div class="desc">todo</div>
......
......@@ -7,6 +7,8 @@
<link type="text/css" rel="stylesheet" href="../../../page.css" />
</head>
<body>
[page:Object3D] &rarr;
<h1>[name]</h1>
<div class="desc">todo</div>
......
......@@ -7,6 +7,8 @@
<link type="text/css" rel="stylesheet" href="../../../page.css" />
</head>
<body>
[page:CurvePath] &rarr;
<h1>[name]</h1>
<div class="desc">A 2d path representation, comprising of points, lines, and cubes, similar to the html5 2d canvas api. It extends CurvePath.</div>
......
......@@ -7,6 +7,8 @@
<link type="text/css" rel="stylesheet" href="../../../page.css" />
</head>
<body>
[page:Path] &rarr;
<h1>[name]</h1>
<div class="desc">Defines a 2d shape plane using paths.</div>
......
......@@ -7,41 +7,40 @@
<link type="text/css" rel="stylesheet" href="../../../page.css" />
</head>
<body>
[page:EllipseCurve] &rarr;
<h1>[name]</h1>
<div class="desc">todo</div>
<h2>Example</h2>
<code>todo</code>
<h2>Constructor</h2>
<h3>[name]([page:todo size])</h3>
<div>
size -- todo
</div>
<div>
todo
</div>
<h3>todo</h3>
<div></div>
<h2>Properties</h2>
<h2>Properties</h2>
<h3>.[page:array vertices]</h3>
<h3>todo</h3>
<div>
todo
</div>
<h2>Methods</h2>
<h2>Methods</h2>
<h3>.update([page:todo object]) [page:todo]</h3>
<div>
object -- todo
</div>
<h3>todo</h3>
<div>todo</div>
<div>
todo
</div>
<h2>Source</h2>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
......
......@@ -7,66 +7,40 @@
<link type="text/css" rel="stylesheet" href="../../../page.css" />
</head>
<body>
[page:Curve] &rarr;
<h1>[name]</h1>
<div class="desc">todo</div>
<h2>Example</h2>
<h2>Constructor</h2>
<code>todo</code>
<h3>[name]()</h3>
<div>
todo
</div>
<h2>Constructor</h2>
<h3>[name]()</h3>
<h3>todo</h3>
<div></div>
<h2>Properties</h2>
<h3>.[page:Vector2 scale]</h3>
<div>
todo
</div>
<h3>.[page:object material]</h3>
<div>
todo
</div>
<h3>.[page:object object]</h3>
<div>
todo
</div>
<h3>.[page:object y]</h3>
<h3>todo</h3>
<div>
todo
</div>
<h3>.[page:object x]</h3>
<div>
todo
</div>
<h3>.[page:object rotation]</h3>
<div>
todo
</div>
<h2>Methods</h2>
<h3>.[page:object z]</h3>
<h3>todo</h3>
<div>todo</div>
<div>
todo
</div>
<h2>Methods</h2>
</div>
<h2>Source</h2>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
......
......@@ -7,96 +7,40 @@
<link type="text/css" rel="stylesheet" href="../../../page.css" />
</head>
<body>
[page:Curve] &rarr;
<h1>[name]</h1>
<div class="desc">todo</div>
<h2>Example</h2>
<h2>Constructor</h2>
<code>todo</code>
<h3>[name]()</h3>
<div>
todo
</div>
<h2>Constructor</h2>
<h3>[name]()</h3>
<h3>todo</h3>
<div></div>
<h2>Properties</h2>
<h3>.[page:array vertexNormalsModelView]</h3>
<div>
todo
</div>
<h3>.[page:Vector3 normalModel]</h3>
<div>
todo
</div>
<h3>.[page:object color]</h3>
<div>
todo
</div>
<h3>.[page:object material]</h3>
<div>
todo
</div>
<h3>.[page:array uvs]</h3>
<div>
todo
</div>
<h3>.[page:RenderableVertex v1]</h3>
<div>
todo
</div>
<h3>.[page:RenderableVertex v2]</h3>
<h3>todo</h3>
<div>
todo
</div>
<h3>.[page:RenderableVertex v3]</h3>
<div>
todo
</div>
<h3>.[page:Vector3 normalModelView]</h3>
<div>
todo
</div>
<h3>.[page:Vector3 centroidModel]</h3>
<div>
todo
</div>
<h3>.[page:number vertexNormalsLength]</h3>
<div>
todo
</div>
<h3>.[page:object z]</h3>
<div>
todo
</div>
<h2>Methods</h2>
<h3>.[page:array vertexNormalsModel]</h3>
<h3>todo</h3>
<div>todo</div>
<div>
todo
</div>
<h2>Methods</h2>
</div>
<h2>Source</h2>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
......
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<script src="../../../list.js"></script>
<script src="../../../page.js"></script>
<link type="text/css" rel="stylesheet" href="../../../page.css" />
</head>
<body>
[page:Curve] &rarr;
<h1>[name]</h1>
<div class="desc">todo</div>
<h2>Example</h2>
<code>todo</code>
<h2>Constructor</h2>
<h3>todo</h3>
<div></div>
<h2>Properties</h2>
<h3>todo</h3>
<div>
todo
</div>
<h2>Methods</h2>
<h3>todo</h3>
<div>todo</div>
<div>
todo
</div>
<h2>Source</h2>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<script src="../../../list.js"></script>
<script src="../../../page.js"></script>
<link type="text/css" rel="stylesheet" href="../../../page.css" />
</head>
<body>
[page:Curve] &rarr;
<h1>[name]</h1>
<div class="desc">todo</div>
<h2>Example</h2>
<code>todo</code>
<h2>Constructor</h2>
<h3>todo</h3>
<div></div>
<h2>Properties</h2>
<h3>todo</h3>
<div>
todo
</div>
<h2>Methods</h2>
<h3>todo</h3>
<div>todo</div>
<div>
todo
</div>
<h2>Source</h2>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<script src="../../../list.js"></script>
<script src="../../../page.js"></script>
<link type="text/css" rel="stylesheet" href="../../../page.css" />
</head>
<body>
[page:Curve] &rarr;
<h1>[name]</h1>
<div class="desc">todo</div>
<h2>Example</h2>
<code>todo</code>
<h2>Constructor</h2>
<h3>todo</h3>
<div></div>
<h2>Properties</h2>
<h3>todo</h3>
<div>
todo
</div>
<h2>Methods</h2>
<h3>todo</h3>
<div>todo</div>
<div>
todo
</div>
<h2>Source</h2>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<script src="../../../list.js"></script>
<script src="../../../page.js"></script>
<link type="text/css" rel="stylesheet" href="../../../page.css" />
</head>
<body>
[page:Curve] &rarr;
<h1>[name]</h1>
<div class="desc">todo</div>
<h2>Example</h2>
<code>todo</code>
<h2>Constructor</h2>
<h3>todo</h3>
<div></div>
<h2>Properties</h2>
<h3>todo</h3>
<div>
todo
</div>
<h2>Methods</h2>
<h3>todo</h3>
<div>todo</div>
<div>
todo
</div>
<h2>Source</h2>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<script src="../../../list.js"></script>
<script src="../../../page.js"></script>
<link type="text/css" rel="stylesheet" href="../../../page.css" />
</head>
<body>
[page:Curve] &rarr;
<h1>[name]</h1>
<div class="desc">todo</div>
<h2>Example</h2>
<code>todo</code>
<h2>Constructor</h2>
<h3>todo</h3>
<div></div>
<h2>Properties</h2>
<h3>todo</h3>
<div>
todo
</div>
<h2>Methods</h2>
<h3>todo</h3>
<div>todo</div>
<div>
todo
</div>
<h2>Source</h2>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<script src="../../../list.js"></script>
<script src="../../../page.js"></script>
<link type="text/css" rel="stylesheet" href="../../../page.css" />
</head>
<body>
[page:Curve] &rarr;
<h1>[name]</h1>
<div class="desc">todo</div>
<h2>Example</h2>
<code>todo</code>
<h2>Constructor</h2>
<h3>todo</h3>
<div></div>
<h2>Properties</h2>
<h3>todo</h3>
<div>
todo
</div>
<h2>Methods</h2>
<h3>todo</h3>
<div>todo</div>
<div>
todo
</div>
<h2>Source</h2>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<script src="../../../list.js"></script>
<script src="../../../page.js"></script>
<link type="text/css" rel="stylesheet" href="../../../page.css" />
</head>
<body>
[page:Curve] &rarr;
<h1>[name]</h1>
<div class="desc">todo</div>
<h2>Example</h2>
<code>todo</code>
<h2>Constructor</h2>
<h3>todo</h3>
<div></div>
<h2>Properties</h2>
<h3>todo</h3>
<div>
todo
</div>
<h2>Methods</h2>
<h3>todo</h3>
<div>todo</div>
<div>
todo
</div>
<h2>Source</h2>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<script src="../../../list.js"></script>
<script src="../../../page.js"></script>
<link type="text/css" rel="stylesheet" href="../../../page.css" />
</head>
<body>
[page:Curve] &rarr;
<h1>[name]</h1>
<div class="desc">todo</div>
<h2>Example</h2>
<code>todo</code>
<h2>Constructor</h2>
<h3>todo</h3>
<div></div>
<h2>Properties</h2>
<h3>todo</h3>
<div>
todo
</div>
<h2>Methods</h2>
<h3>todo</h3>
<div>todo</div>
<div>
todo
</div>
<h2>Source</h2>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
</body>
</html>
......@@ -8,24 +8,39 @@
</head>
<body>
[page:Geometry] &rarr;
<h1>[name]</h1>
<div class="desc">todo</div>
<h2>Example</h2>
<code>todo</code>
<h2>Constructor</h2>
<h3>[name]([page:Array vertices])</h3>
<div>
vertices — todo
</div>
<h3>todo</h3>
<div></div>
<h2>Properties</h2>
<h3>todo</h3>
<div>
todo
</div>
</div>
<h2>Methods</h2>
<h3>todo</h3>
<div>todo</div>
<div>
todo
</div>
<h2>Source</h2>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
......
......@@ -7,6 +7,8 @@
<link type="text/css" rel="stylesheet" href="../../../page.css" />
</head>
<body>
[page:Geometry] &rarr;
<h1>[name]</h1>
<div class="desc">CircleGeometry is a simple shape of Euclidean geometry. It is contructed from a number of triangular segments that are oriented around a central point and extend as far out as a given radius. It is built counter-clockwise from a start angle and a given central angle. It can also be used to create regular polygons, where the number of segments determines the number of sides.
......
......@@ -11,40 +11,9 @@
<h1>[name]</h1>
<div class="desc">CubeGeometry is the quadrilateral primitive geometry class. It is typically used for creating a cube or irregular quadrilateral of the dimensions provided with the 'width', 'height', and 'depth' constructor arguments.</div>
<h2>Example</h2>
<code>var geometry = new THREE.CubeGeometry( 1, 1, 1 );
var material = new THREE.MeshBasicMaterial( {color: 0x00ff00} );
var cube = new THREE.Mesh( geometry, material );
scene.add( cube );
</code>
<div class="desc">Renamed CubeGeometry to BoxGeometry. see [page:BoxGeometry].</div>
<h2>Constructor</h2>
<h3>[name]([page:Float width], [page:Float height], [page:Float depth], [page:Integer widthSegments], [page:Integer heightSegments], [page:Integer depthSegments])</h3>
<div>
width — Width of the sides on the X axis.<br />
height — Height of the sides on the Y axis.<br />
depth — Depth of the sides on the Z axis.<br />
widthSegments — Optional. Number of segmented faces along the width of the sides. Default is 1.<br />
heightSegments — Optional. Number of segmented faces along the height of the sides. Default is 1.<br />
depthSegments — Optional. Number of segmented faces along the depth of the sides. Default is 1.
</div>
<h2>Properties</h2>
<div>
Each of the constructor parameters is accessible as a property of the same name. Any modification of these properties after instantiation does not change the geometry.
</div>
<h2>Source</h2>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
</body>
</html>
......@@ -7,6 +7,8 @@
<link type="text/css" rel="stylesheet" href="../../../page.css" />
</head>
<body>
[page:Object3D] &rarr;
<h1>[name]</h1>
<div class="desc">An 3D arrow Object.</div>
......
......@@ -7,6 +7,8 @@
<link type="text/css" rel="stylesheet" href="../../../page.css" />
</head>
<body>
[page:Line] &rarr;
<h1>[name]</h1>
<div class="desc">An axis object to visualize the the 3 axes in a simple way. <br />
......
......@@ -7,6 +7,8 @@
<link type="text/css" rel="stylesheet" href="../../../page.css" />
</head>
<body>
[page:Mesh] &rarr;
<h1>[name]</h1>
<div class="desc">A helper object to show the world-axis-aligned bounding box for an object.</div>
......
......@@ -7,6 +7,8 @@
<link type="text/css" rel="stylesheet" href="../../../page.css" />
</head>
<body>
[page:Line] &rarr;
<h1>[name]</h1>
<div class="desc">
......
......@@ -7,6 +7,8 @@
<link type="text/css" rel="stylesheet" href="../../../page.css" />
</head>
<body>
[page:Object3D] &rarr;
<h1>[name]</h1>
<div class="desc">todo</div>
......
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<script src="../../../list.js"></script>
<script src="../../../page.js"></script>
<link type="text/css" rel="stylesheet" href="../../../page.css" />
</head>
<body>
[page:Line] &rarr;
<h1>[name]</h1>
<div class="desc">todo</div>
<h2>Example</h2>
<code>todo</code>
<h2>Constructor</h2>
<h3>todo</h3>
<div></div>
<h2>Properties</h2>
<h3>todo</h3>
<div>
todo
</div>
<h2>Methods</h2>
<h3>todo</h3>
<div>todo</div>
<div>
todo
</div>
<h2>Source</h2>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<script src="../../../list.js"></script>
<script src="../../../page.js"></script>
<link type="text/css" rel="stylesheet" href="../../../page.css" />
</head>
<body>
[page:Line] &rarr;
<h1>[name]</h1>
<div class="desc">todo</div>
<h2>Example</h2>
<code>todo</code>
<h2>Constructor</h2>
<h3>todo</h3>
<div></div>
<h2>Properties</h2>
<h3>todo</h3>
<div>
todo
</div>
<h2>Methods</h2>
<h3>todo</h3>
<div>todo</div>
<div>
todo
</div>
<h2>Source</h2>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
</body>
</html>
......@@ -7,6 +7,8 @@
<link type="text/css" rel="stylesheet" href="../../../page.css" />
</head>
<body>
[page:Line] &rarr;
<h1>[name]</h1>
<div class="desc">The GridHelper is an object to define grids. Grids are two-dimensional arrays of lines.</div>
......
......@@ -7,6 +7,8 @@
<link type="text/css" rel="stylesheet" href="../../../page.css" />
</head>
<body>
[page:Object3D] &rarr;
<h1>[name]</h1>
<div class="desc">todo</div>
......
......@@ -7,6 +7,8 @@
<link type="text/css" rel="stylesheet" href="../../../page.css" />
</head>
<body>
[page:Mesh] &rarr;
<h1>[name]</h1>
<div class="desc">This display a helper for a pointLight </div>
......
......@@ -7,6 +7,8 @@
<link type="text/css" rel="stylesheet" href="../../../page.css" />
</head>
<body>
[page:Object3D] &rarr;
<h1>[name]</h1>
<div class="desc">todo</div>
......
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<script src="../../../list.js"></script>
<script src="../../../page.js"></script>
<link type="text/css" rel="stylesheet" href="../../../page.css" />
</head>
<body>
[page:Line] &rarr;
<h1>[name]</h1>
<div class="desc">todo</div>
<h2>Example</h2>
<code>todo</code>
<h2>Constructor</h2>
<h3>todo</h3>
<div></div>
<h2>Properties</h2>
<h3>todo</h3>
<div>
todo
</div>
<h2>Methods</h2>
<h3>todo</h3>
<div>todo</div>
<div>
todo
</div>
<h2>Source</h2>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<script src="../../../list.js"></script>
<script src="../../../page.js"></script>
<link type="text/css" rel="stylesheet" href="../../../page.css" />
</head>
<body>
[page:Line] &rarr;
<h1>[name]</h1>
<div class="desc">todo</div>
<h2>Example</h2>
<code>todo</code>
<h2>Constructor</h2>
<h3>todo</h3>
<div></div>
<h2>Properties</h2>
<h3>todo</h3>
<div>
todo
</div>
<h2>Methods</h2>
<h3>todo</h3>
<div>todo</div>
<div>
todo
</div>
<h2>Source</h2>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<script src="../../../list.js"></script>
<script src="../../../page.js"></script>
<link type="text/css" rel="stylesheet" href="../../../page.css" />
</head>
<body>
[page:Line] &rarr;
<h1>[name]</h1>
<div class="desc">todo</div>
<h2>Example</h2>
<code>todo</code>
<h2>Constructor</h2>
<h3>todo</h3>
<div></div>
<h2>Properties</h2>
<h3>todo</h3>
<div>
todo
</div>
<h2>Methods</h2>
<h3>todo</h3>
<div>todo</div>
<div>
todo
</div>
<h2>Source</h2>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
</body>
</html>
......@@ -7,6 +7,8 @@
<link type="text/css" rel="stylesheet" href="../../../page.css" />
</head>
<body>
[page:Object3D] &rarr;
<h1>[name]</h1>
<div class="desc">base class for immediate rendering objects.</div>
......
......@@ -7,6 +7,8 @@
<link type="text/css" rel="stylesheet" href="../../../page.css" />
</head>
<body>
[page:Object3D] &rarr;
<h1>[name]</h1>
<div class="desc">todo</div>
......
......@@ -7,6 +7,8 @@
<link type="text/css" rel="stylesheet" href="../../../page.css" />
</head>
<body>
[page:Mesh] &rarr;
<h1>[name]</h1>
<div class="desc">todo</div>
......
......@@ -42,43 +42,43 @@ scene.add( areaLight1 );</code>
<h3>.[page:Vector3 right]</h3>
<div>
todo
Sets or gets an unit vector that indicates the right side of the light. This is calculated in local space.
</div>
<h3>.[page:Vector3 normal]</h3>
<div>
todo
</div>
<h3>.[page:number quadraticAttenuation]</h3>
<div>
todo
Sets or gets an unit vectorSets or gets an unit vector that indicates the right side of the light. This is calculated in local space.
</div>
<h3>.[page:number height]</h3>
<div>
todo
</div>
<h3>.[page:number linearAttenuation]</h3>
<div>
todo
Sets or gets the height of the illuminating plane.
</div>
<h3>.[page:number width]</h3>
<div>
todo
Sets or gets the width of the illuminating plane.
</div>
<h3>.[page:Float intensity]</h3>
<div>
Light's intensity.<br />
Default — *1.0*.
Light's intensity.<br />
Default — *1.0*.
</div>
<h3>.[page:number constantAttenuation]</h3>
<div>
todo
Sets or gets the attention of the light in constant space. This is independant of the distance of the light.
</div>
<h3>.[page:number linearAttenuation]</h3>
<div>
Sets or gets the attention of the light in linear space. This increases the attenuation linearly with the distance from the light.
</div>
<h3>.[page:number quadraticAttenuation]</h3>
<div>
Sets or gets the attention of the light in linear space. This increases the attenuation quadratic with the distance from the light.
</div>
......
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<script src="../../list.js"></script>
<script src="../../page.js"></script>
<link type="text/css" rel="stylesheet" href="../../page.css" />
</head>
<body>
<h1>[name]</h1>
<div class="desc">todo</div>
<h2>Example</h2>
<code>todo</code>
<h2>Constructor</h2>
<h3>todo</h3>
<div></div>
<h2>Properties</h2>
<h3>todo</h3>
<div>
todo
</div>
<h2>Methods</h2>
<h3>todo</h3>
<div>todo</div>
<div>
todo
</div>
<h2>Source</h2>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<script src="../../list.js"></script>
<script src="../../page.js"></script>
<link type="text/css" rel="stylesheet" href="../../page.css" />
</head>
<body>
<h1>[name]</h1>
<div class="desc">todo</div>
<h2>Example</h2>
<code>todo</code>
<h2>Constructor</h2>
<h3>todo</h3>
<div></div>
<h2>Properties</h2>
<h3>todo</h3>
<div>
todo
</div>
<h2>Methods</h2>
<h3>todo</h3>
<div>todo</div>
<div>
todo
</div>
<h2>Source</h2>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<script src="../../list.js"></script>
<script src="../../page.js"></script>
<link type="text/css" rel="stylesheet" href="../../page.css" />
</head>
<body>
<h1>[name]</h1>
<div class="desc">A loader for loading a geometry out of a JSON file.</div>
<div class="desc">Unlike other loaders, this one emits events instead of using predefined callbacks. So if you're interested in getting notified when <em>things</em> happen, you need to add listeners to the object.</div>
<div class="desc">Possible events:<br />
<ul>
<li>type: error, message: error message</li>
<li>type: load, content: loaded geometry</li>
</ul>
</div>
<h2>Constructor</h2>
<h3>[name]()</h3>
<div>
todo
</div>
<h2>Methods</h2>
<h3>.load( [page:String url] )</h3>
<div>
url — required
</div>
<div class="desc">Begin loading from <em>url</em></div>
<h3>.parse( [page:Object data], [page:LoadingMonitor monitor] )</h3>
<div>
data — required<br />
monitor — optional
</div>
<div class="desc">Parses the geometry in the <em>data</em> object, optionally monitoring its progress via the <em>monitor</em> object, if provided.</div>
<h3>.dispatchEvent([page:todo event]) [page:todo]</h3>
<div>
event -- todo
</div>
<div>
todo
</div>
<h3>.hasEventListener([page:todo type], [page:todo listener]) [page:todo]</h3>
<div>
type -- todo <br />
listener -- todo
</div>
<div>
todo
</div>
<h3>.removeEventListener([page:todo type], [page:todo listener]) [page:todo]</h3>
<div>
type -- todo <br />
listener -- todo
</div>
<div>
todo
</div>
<h3>.addEventListener([page:todo type], [page:todo listener]) [page:todo]</h3>
<div>
type -- todo <br />
listener -- todo
</div>
<div>
todo
</div>
<h2>Source</h2>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
</body>
</html>
......@@ -2,9 +2,9 @@
<html lang="en">
<head>
<meta charset="utf-8" />
<script src="../../../list.js"></script>
<script src="../../../page.js"></script>
<link type="text/css" rel="stylesheet" href="../../../page.css" />
<script src="../../list.js"></script>
<script src="../../page.js"></script>
<link type="text/css" rel="stylesheet" href="../../page.css" />
</head>
<body>
<h1>[name]</h1>
......
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<script src="../../list.js"></script>
<script src="../../page.js"></script>
<link type="text/css" rel="stylesheet" href="../../page.css" />
</head>
<body>
<h1>[name]</h1>
<div class="desc">todo</div>
<h2>Example</h2>
<code>todo</code>
<h2>Constructor</h2>
<h3>todo</h3>
<div></div>
<h2>Properties</h2>
<h3>todo</h3>
<div>
todo
</div>
<h2>Methods</h2>
<h3>todo</h3>
<div>todo</div>
<div>
todo
</div>
<h2>Source</h2>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<script src="../../list.js"></script>
<script src="../../page.js"></script>
<link type="text/css" rel="stylesheet" href="../../page.css" />
</head>
<body>
<h1>[name]</h1>
<div class="desc">todo</div>
<h2>Example</h2>
<code>todo</code>
<h2>Constructor</h2>
<h3>todo</h3>
<div></div>
<h2>Properties</h2>
<h3>todo</h3>
<div>
todo
</div>
<h2>Methods</h2>
<h3>todo</h3>
<div>todo</div>
<div>
todo
</div>
<h2>Source</h2>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<script src="../../list.js"></script>
<script src="../../page.js"></script>
<link type="text/css" rel="stylesheet" href="../../page.css" />
</head>
<body>
[page:ShaderMaterial] &rarr;
<h1>[name]</h1>
<div class="desc">todo</div>
<h2>Example</h2>
<code>todo</code>
<h2>Constructor</h2>
<h3>todo</h3>
<div></div>
<h2>Properties</h2>
<h3>todo</h3>
<div>
todo
</div>
<h2>Methods</h2>
<h3>todo</h3>
<div>todo</div>
<div>
todo
</div>
<h2>Source</h2>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
</body>
</html>
......@@ -212,7 +212,7 @@
<h3>.containsPoint([page:Vector2 point]) [page:Boolean]</h3>
<div>
point -- Point to check for inclusion.
point -- [page:Vector2] to check for inclusion.
</div>
<div>
Returns true if the specified point lies within the boundaries of this box.
......
......@@ -17,11 +17,11 @@
<h3>[name]([page:Vector3 min], [page:Vector3 max])</h3>
<div>
min -- Lower (x, y, z) boundary of the box. <br />
min -- Lower (x, y, z) boundary of the box.<br />
max -- Upper (x, y, z) boundary of the box.
</div>
<div>
Creates a box bounded by min and max
Creates a box bounded by min and max.
</div>
<h2>Properties</h2>
......@@ -36,7 +36,7 @@
<h3>.[page:Vector3 min]</h3>
<div>
Lower (x, y, z) boundary of this box.
</div>
</div>
<h2>Methods</h2>
......@@ -44,113 +44,134 @@
<h3>.set([page:Vector3 min], [page:Vector3 max]) [page:Box3 this]</h3>
<div>
min -- Upper (x, y, z) boundary of this box. <br />
max -- Lower (x, y, z) boundary of this box.
min -- Lower (x, y, z) boundary of the box. <br />
max -- Upper (x, y, z) boundary of the box.
</div>
<div>
Sets the lower and upper (x, y, z) boundaries of this box.
</div>
<h3>.applyMatrix4([page:Matrix4 matrix]) [page:Box3 this]</h3>
<h3>.addPoint([page:Vector3 point]) [page:Box3 this]</h3>
<div>
matrix -- [page:Matrix4].
point -- [page:Vector3] to add to the box <br />
</div>
<div>
Transform the box with a Matrix4.
If the *point* is outside the bounds of the box, the bounds are expanded
so that the point is within the bounds.
</div>
<h3>.applyMatrix4([page:Matrix4 matrix]) [page:Box3 this]</h3>
<div>
matrix -- The [page:Matrix4] to apply
</div>
<h3>.expandByPoint([page:Vector3 point]) [page:Box3 this]</h3>
<div>
Expands the box outwards by the point. It takes the min and max values of the box.
Transforms this Box3 with the supplied matrix.
</div>
<h3>.clampPoint([page:Vector3 point], [page:Vector3 optionalTarget]) [page:Vector3]</h3>
<div>
point -- [page:Vector3] <br />
optionalTarget -- [page:Vector3] An optional target point.
point -- Position to clamp. <br />
optionalTarget -- If specified, the clamped result will be copied here.
</div>
<div>
Clamp a point within the min and max boundaries of the box. Returns either a new point or the modified passed target.
Clamps *point* within the bounds of this box.
</div>
<h3>.isIntersectionBox([page:Box3 box]) [page:Boolean]</h3>
<div>
box -- [page:Box3]
box -- Box to check for intersection against.
</div>
<div>
Return whether or not the passed box intersects with this Box3.
Determines whether or not this box intersects *box*.
</div>
<h3>.setFromPoints([page:Array points])</h3>
<h3>.setFromPoints([page:Array points]) [page:Box3 this]</h3>
<div>
points -- [page:Array] of [page:Vector3] points
points -- Set of points that the resulting box will envelop.
</div>
<div>
Sets this box to the min value and max value of all the points in the array. If the array is empty, then it sets the box as empty.
Sets the upper and lower bounds of this box to include all of the points in *points*.
</div>
<h3>.size([page:Vector3 optionalTarget]) [page:Vector3]</h3>
<h3>.setFromObject([page:Object3D object]) [page:Box3 this]</h3>
<div>
optionalTarget -- [page:Vector3] (optional)
object -- [page:Object3D] to compute the bounding box for.
</div>
<div>
Returns either a new Vector3 or the target Vector3 that represents the size of the box from the min point to max point.
Computes the world-axis-aligned bounding box of an object (including its children),
accounting for both the object's, and childrens', world transforms
</div>
<h3>.union([page:Box3 box]) [page:Box3 this]</h3>
<h3>.size([page:Vector3 optionalTarget]) [page:Vector3]</h3>
<div>
box -- [page:Box3]
optionalTarget -- If specified, the result will be copied here.
</div>
<div>
Sets the box's min and max boundaries to union of the two boxes.
Returns the width, height, and depth of this box.
</div>
<h3>.getParameter([page:Vector3 point], [page:Vector3 optionalTarget]) [page:Vector3]</h3>
<h3>.union([page:Box3 box]) [page:Box3]</h3>
<div>
point -- [page:Vector3]<br/>
optionalTarget -- [page:Vector3]
box -- Box that will be unioned with this box.
</div>
<div>
Returns a point as a proportion of this box's width, height, and depth. If the point is contained by the box the x, y, and z of the returned vector will be between 0 and 1.
Unions this box with *box* setting the upper bound of this box to the greater of the
two boxes' upper bounds and the lower bound of this box to the lesser of the two boxes'
lower bounds.
</div>
<h3>.expandByScalar([page:Float scalar]) [page:Box3 this]</h3>
<h3>.getParameter([page:Vector3 point], [page:Vector3 optionalTarget]) [page:Vector3]</h3>
<div>
scalar -- [page:Float] representing the distance to expand
point -- Point to parametrize.
optionalTarget -- If specified, the result will be copied here.
</div>
<div>
Expands or contracts the box by adding the scalar value to the box's min and max vectors.
Returns point as a proportion of this box's width and height.
</div>
<h3>.intersect([page:Box3 box]) [page:Box3 this]</h3>
<div>
box -- [page:Box3]
box -- Box to intersect with.
</div>
<div>
Returns the intersection of the two boxes, setting the upper bound of this box to the lesser of the two boxes' upper bounds and the lower bound of this box to the greater of the two boxes' lower bounds.
Returns the intersection of this and *box*, setting the upper bound of this box to the lesser </br>
of the two boxes' upper bounds and the lower bound of this box to the greater of the two boxes' </br>
lower bounds.
</div>
<h3>.containsBox([page:Box3 box]) [page:Boolean]</h3>
<div>
box -- [page:Box3]
box -- Box to test for inclusion.
</div>
<div>
Returns true if this box includes the entirety of box. If this and box overlap exactly, this function also returns true.
Returns true if this box includes the entirety of *box*. If this and *box* overlap exactly,</br>
this function also returns true.
</div>
<h3>.containsPoint([page:Vector3 point]) [page:Boolean]</h3>
<div>
point -- [page:Vector3] to check for inclusion.
</div>
<div>
Returns true if the specified point lies within the boundaries of this box.
</div>
<h3>.translate([page:Vector3 offset]) [page:Box3 this]</h3>
<div>
offset -- [page:Vector3]
offset -- Direction and distance of offset.
</div>
<div>
Translates the box the distance of the offset.
Adds *offset* to both the upper and lower bounds of this box, effectively moving this box </br>
*offset* units in 3D space.
</div>
<h3>.empty() [page:Boolean]</h3>
<div>
Checks to see if the box is empty. If the lower and upper bounds of the box are equal, this function still returns false as the box would still contain one point.
Returns true if this box includes zero points within its bounds.</br>
Note that a box with equal lower and upper bounds still includes one point, the
one both bounds share.
</div>
<h3>.clone() [page:Box3]</h3>
......@@ -160,72 +181,87 @@
<h3>.equals([page:Box3 box]) [page:Boolean]</h3>
<div>
box -- [page:Box3]
box -- Box to compare.
</div>
<div>
Returns true if the boes share the same lower and upper bounds.
Returns true if this box and *box* share the same lower and upper bounds.
</div>
<h3>.expandByPoint([page:Vector3 point]) [page:Box3 this]</h3>
<div>
point -- Point that should be included in the box.
</div>
<div>
Expands the boundaries of this box to include *point*.
</div>
<h3>.expandByScalar([page:float scalar]) [page:Box3 this]</h3>
<div>
scalar -- Distance to expand.
</div>
<div>
Expands each dimension of the box by *scalar*. If negative, the dimensions of the box <br/>
will be contracted.
</div>
<h3>.expandByVector([page:Vector3 vector]) [page:Box3 this]</h3>
<div>
vector -- [page:Vector3] representing the amount to expand this box in each dimension.
vector -- Amount to expand this box in each dimension.
</div>
<div>
Adds the passed vector to the upper boundary, and subtracts it from the lower boundary.
Expands this box equilaterally by *vector*. The width of this box will be
expanded by the x component of *vector* in both directions. The height of
this box will be expanded by the y component of *vector* in both directions.
The depth of this box will be expanded by the z component of *vector* in
both directions.
</div>
<h3>.copy([page:Box3 box]) [page:Box3 this]</h3>
<div>
box -- [page:Box3] to copy.
box -- Box to copy.
</div>
<div>
Copies the values of the passed box to this box.
Copies the values of *box* to this box.
</div>
<h3>.makeEmpty() [page:Box3 this]</h3>
<div>
Makes this box empty so that it cannot contain any points.
Makes this box empty.
</div>
<h3>.center([page:Vector3 optionalTarget]) [page:Vector3]</h3>
<div>
optionalTarget -- [page:Vector3] If specified, the result will be copied here.
optionalTarget -- If specified, the result will be copied here.
</div>
<div>
Returns the center point of this box.
Returns the center point of this box.
</div>
<h3>.getBoundingSphere([page:Sphere optionalTarget]) [page:Sphere]</h3>
<div>
optionalTarget -- [page:Sphere]
optionalTarget -- [page:Sphere] to optionally set the result to.
</div>
<div>
Returns a bounding sphere.
Gets a sphere that bounds the box.
</div>
<h3>.distanceToPoint([page:Vector3 point]) [page:Float]</h3>
<div>
point -- [page:Vector3]
point -- Point to measure distance to.
</div>
<div>
Returns the distance from any edge of this box to the specified point. If the point lies inside of this box, the distance will be 0.
</div>
<h3>.containsPoint([page:Vector3 point]) [page:Boolean]</h3>
<div>
point -- [page:Vector3]
</div>
<div>
Returns true if the specified point lies within the boundaries of this box.
Returns the distance from any edge of this box to the specified point. </br>
If the point lies inside of this box, the distance will be 0.
</div>
<h3>.setFromCenterAndSize([page:Vector3 center], [page:Vector3 size]) [page:Box3 this]</h3>
<div>
center -- [page:Vector3] representing the center position.<br />
size -- [page:Vector3] representing the dimensions of the box.
center -- Desired center position of the box. <br />
size -- Desired x and y dimensions of the box.
</div>
<div>
Sets this box based on a center vector, and width, height, and depth vector.
Centers this box on *center* and sets this box's width and height to the values specified
in *size*.
</div>
<h2>Source</h2>
......
......@@ -54,8 +54,8 @@
<h3>.set( [page:Float x], [page:Float y], [page:Float z], [page:String order] ) [page:Euler this]</h3>
<div>
x -- [page:Float] Angle in x axis in radians<br />
x -- [page:Float] Angle in x axis in radians<br />
x -- [page:Float] Angle in x axis in radians<br />
y -- [page:Float] Angle in y axis in radians<br />
z -- [page:Float] Angle in z axis in radians<br />
order -- [page:string] Order of axes, defaults to 'XYZ' (must be upper case)
</div>
<div>
......@@ -124,4 +124,4 @@
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
</body>
</html>
\ No newline at end of file
</html>
......@@ -92,12 +92,12 @@
Multiply every component of the matrix by a scalar value.
</div>
<h3>.multiplyVector3Array([page:Array array]) [page:Array]</h3>
<h3>.applyToVector3Array([page:Array array]) [page:Array]</h3>
<div>
array -- An array in the form [vector1x, vector1y, vector1z, vector2x, vector2y, vector2z, ...]
</div>
<div>
Multiply (apply) this matrix against every vector3 in the array.
Multiply (apply) this matrix to every vector3 in the array.
</div>
<h3>.getNormalMatrix([page:Matrix4 matrix4]) [page:Matrix3 this]</h3>
......
......@@ -113,11 +113,6 @@
Transposes this matrix.
</div>
<h3>.flattenToArray( [page:Array flat] ) [page:Array]</h3>
<div>
Flattens this matrix into supplied *flat* array.
</div>
<h3>.flattenToArrayOffset( [page:Array flat], [page:Integer offset] ) [page:Array]</h3>
<div>
Flattens this matrix into supplied *flat* array starting from *offset* position in the array.
......@@ -229,12 +224,12 @@
Clones this matrix.
</div>
<h3>.multiplyVector3Array([page:Array a]) [page:Array]</h3>
<h3>.applyToVector3Array([page:Array a]) [page:Array]</h3>
<div>
array -- An array in the form [vector1x, vector1y, vector1z, vector2x, vector2y, vector2z, ...]
</div>
<div>
Multiply (apply) this matrix against every vector3 in the array.
Multiply (apply) this matrix to every vector3 in the array.
</div>
<h3>.getMaxScaleOnAxis() [page:Float]</h3>
......
......@@ -57,24 +57,31 @@
Copies values of *q* to this quaternion.
</div>
<h3>.setFromEuler( [page:Vector3 vector] ) [page:Quaternion]</h3>
<h3>.setFromEuler( [page:Euler euler] ) [page:Quaternion]</h3>
<div>
Sets this quaternion from rotation specified by Euler angles.
Sets this quaternion from rotation specified by Euler angle.
</div>
<h3>.setFromAxisAngle( [page:Vector3 axis], [page:Float angle] ) [page:Quaternion]</h3>
<div>
Sets this quaternion from rotation specified by axis and angle.<br />
Adapted from [link:http://www.euclideanspace.com/maths/geometry/rotations/conversions/angleToQuaternion/index.htm].<br />
*Axis* have to be normalized, *angle* is in radians.
*Axis* is asumed to be normalized, *angle* is in radians.
</div>
<h3>.setFromRotationMatrix( [page:Matrix4 m] ) [page:Quaternion]</h3>
<div>
Sets this quaternion from rotation component of *m*.
Sets this quaternion from rotation component of *m*.<br />
Adapted from [link:http://www.euclideanspace.com/maths/geometry/rotations/conversions/matrixToQuaternion/index.htm].
</div>
<h3>.setFromUnitVectors( [page:Vector3 vFrom], [page:Vector3 vTo] ) [page:Quaternion]</h3>
<div>
Sets this quaternion to the rotation required to rotate direction vector *vFrom* to direction vector *vTo*.<br />
Adapted from [link:http://lolengine.net/blog/2013/09/18/beautiful-maths-quaternion-from-vectors].<br />
*vFrom* and *vTo* are assumed to be normalized.
</div>
<h3>.inverse() [page:Quaternion]</h3>
<div>
Inverts this quaternion.
......
......@@ -11,7 +11,7 @@
<h1>[name]</h1>
<div class="desc">A sprite is an plane in an 3d scene which faces always towards the camera. </div>
<div class="desc">A sprite is a plane in an 3d scene which faces always towards the camera. </div>
<h2>Example</h2>
......
......@@ -126,7 +126,7 @@
<h3>.[page:Boolean autoScaleCubemaps]</h3>
<div>Default is true. If set, then Cubemaps are scaled, when the are bigger the the maximum size, to make sure that they aren't bigger then the maximum size.</div>
<div>Default is true. If set, then Cubemaps are scaled, when they are bigger than the maximum size, to make sure that they aren't bigger than the maximum size.</div>
<h3>.[page:Boolean renderPluginsPre]</h3>
......@@ -253,7 +253,7 @@
<h3>.render( [page:Scene scene], [page:Camera camera], [page:WebGLRenderTarget renderTarget], [page:Boolean forceClear] )</h3>
<div>Render a scene using a camera.</div>
<div>The render is done to the renderTarget (if specified) or to the canvas as usual.</div>
<div>If forceClear is true the depth, stencil and color buffers will be cleared before rendering even if the renderer's autoClear property is false.</div>
<div>If forceClear is true, the depth, stencil and color buffers will be cleared before rendering even if the renderer's autoClear property is false.</div>
<div>Even with forceClear set to true you can prevent certain buffers being cleared by setting either the .autoClearColor, .autoClearStencil or .autoClearDepth properties to false.</div>
<h3>.renderImmediateObject( camera, lights, fog, material, object )</h3>
......
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<script src="../../../list.js"></script>
<script src="../../../page.js"></script>
<link type="text/css" rel="stylesheet" href="../../../page.css" />
</head>
<body>
<h1>[name]</h1>
<div class="desc">todo</div>
<h2>Example</h2>
<code>todo</code>
<h2>Constructor</h2>
<h3>todo</h3>
<div></div>
<h2>Properties</h2>
<h3>todo</h3>
<div>
todo
</div>
<h2>Methods</h2>
<h3>todo</h3>
<div>todo</div>
<div>
todo
</div>
<h2>Source</h2>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<script src="../../../list.js"></script>
<script src="../../../page.js"></script>
<link type="text/css" rel="stylesheet" href="../../../page.css" />
</head>
<body>
<h1>[name]</h1>
<div class="desc">todo</div>
<h2>Example</h2>
<code>todo</code>
<h2>Constructor</h2>
<h3>todo</h3>
<div></div>
<h2>Properties</h2>
<h3>todo</h3>
<div>
todo
</div>
<h2>Methods</h2>
<h3>todo</h3>
<div>todo</div>
<div>
todo
</div>
<h2>Source</h2>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<script src="../../../list.js"></script>
<script src="../../../page.js"></script>
<link type="text/css" rel="stylesheet" href="../../../page.css" />
</head>
<body>
<h1>[name]</h1>
<div class="desc">todo</div>
<h2>Example</h2>
<code>todo</code>
<h2>Constructor</h2>
<h3>todo</h3>
<div></div>
<h2>Properties</h2>
<h3>todo</h3>
<div>
todo
</div>
<h2>Methods</h2>
<h3>todo</h3>
<div>todo</div>
<div>
todo
</div>
<h2>Source</h2>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<script src="../../../list.js"></script>
<script src="../../../page.js"></script>
<link type="text/css" rel="stylesheet" href="../../../page.css" />
</head>
<body>
<h1>[name]</h1>
<div class="desc">todo</div>
<h2>Example</h2>
<code>todo</code>
<h2>Constructor</h2>
<h3>todo</h3>
<div></div>
<h2>Properties</h2>
<h3>todo</h3>
<div>
todo
</div>
<h2>Methods</h2>
<h3>todo</h3>
<div>todo</div>
<div>
todo
</div>
<h2>Source</h2>
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
</body>
</html>
......@@ -7,6 +7,8 @@
<link type="text/css" rel="stylesheet" href="../../page.css" />
</head>
<body>
[page:Texture] &rarr;
<h1>[name]</h1>
<div class="desc">
......
......@@ -16,6 +16,7 @@
}
body {
background-color: #ffffff;
margin: 0;
padding: 0 0 0 260px;
height: 100%;
......@@ -33,14 +34,15 @@
#panel {
position: fixed;
left: 0;
left: 0px;
width: 260px;
height: 100%;
overflow: auto;
background: #fafafa;
}
#panel h1 {
margin-top: 20px;
margin-top: 30px;
margin-bottom: 40px;
margin-left: 20px;
font-size: 25px;
......@@ -81,20 +83,6 @@
</style>
</head>
<body>
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-86951-15']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>
<div id="panel"></div>
<iframe id="viewer"></iframe>
......
......@@ -7,13 +7,13 @@ var list = {
},
"Reference": {
"Constants": [
[ "CustomBlendingEquation", "api/constants/CustomBlendingEquations"],
[ "GLState", "api/constants/GLState"],
[ "Materials", "api/constants/Materials"],
[ "ShadowingTypes", "api/constants/ShadowingTypes"],
[ "Textures", "api/constants/Textures"]
],
"Constants": [
[ "CustomBlendingEquation", "api/constants/CustomBlendingEquations"],
[ "GLState", "api/constants/GLState"],
[ "Materials", "api/constants/Materials"],
[ "ShadowingTypes", "api/constants/ShadowingTypes"],
[ "Textures", "api/constants/Textures"]
],
"Cameras": [
[ "Camera", "api/cameras/Camera" ],
......@@ -22,6 +22,7 @@ var list = {
],
"Core": [
[ "BufferAttribute", "api/core/BufferAttribute" ],
[ "BufferGeometry", "api/core/BufferGeometry" ],
[ "Clock", "api/core/Clock" ],
[ "EventDispatcher", "api/core/EventDispatcher" ],
......@@ -33,30 +34,34 @@ var list = {
],
"Lights": [
[ "Light", "api/lights/Light" ],
[ "AmbientLight", "api/lights/AmbientLight" ],
[ "AreaLight", "api/lights/AreaLight" ],
[ "DirectionalLight", "api/lights/DirectionalLight" ],
[ "HemisphereLight", "api/lights/HemisphereLight" ],
[ "Light", "api/lights/Light" ],
[ "PointLight", "api/lights/PointLight" ],
[ "SpotLight", "api/lights/SpotLight" ]
],
"Loaders": [
[ "Loader", "api/loaders/Loader" ],
[ "GeometryLoader", "api/loaders/GeometryLoader" ],
[ "BufferGeometryLoader", "api/loaders/BufferGeometryLoader" ],
[ "Cache", "api/loaders/Cache" ],
[ "ImageLoader", "api/loaders/ImageLoader" ],
[ "JSONLoader", "api/loaders/JSONLoader" ],
[ "Loader", "api/loaders/Loader" ],
[ "LoadingManager", "api/loaders/LoadingManager" ],
[ "MaterialLoader", "api/loaders/MaterialLoader" ],
[ "ObjectLoader", "api/loaders/ObjectLoader" ],
[ "SceneLoader", "api/loaders/SceneLoader" ],
[ "TextureLoader", "api/loaders/TextureLoader" ],
[ "XHRLoader", "api/loaders/XHRLoader" ]
],
"Materials": [
[ "Material", "api/materials/Material" ],
[ "LineBasicMaterial", "api/materials/LineBasicMaterial" ],
[ "LineDashedMaterial", "api/materials/LineDashedMaterial" ],
[ "Material", "api/materials/Material" ],
[ "MeshBasicMaterial", "api/materials/MeshBasicMaterial" ],
[ "MeshDepthMaterial", "api/materials/MeshDepthMaterial" ],
[ "MeshFaceMaterial", "api/materials/MeshFaceMaterial" ],
......@@ -64,9 +69,10 @@ var list = {
[ "MeshNormalMaterial", "api/materials/MeshNormalMaterial" ],
[ "MeshPhongMaterial", "api/materials/MeshPhongMaterial" ],
[ "ParticleSystemMaterial", "api/materials/ParticleSystemMaterial" ],
[ "RawShaderMaterial", "api/materials/RawShaderMaterial" ],
[ "ShaderMaterial", "api/materials/ShaderMaterial" ],
[ "SpriteMaterial", "api/materials/SpriteMaterial" ],
[ "SpriteCanvasMaterial", "api/materials/SpriteCanvasMaterial" ]
[ "SpriteCanvasMaterial", "api/materials/SpriteCanvasMaterial" ],
[ "SpriteMaterial", "api/materials/SpriteMaterial" ]
],
"Math": [
......@@ -99,7 +105,6 @@ var list = {
[ "ParticleSystem", "api/objects/ParticleSystem" ],
[ "SkinnedMesh", "api/objects/SkinnedMesh" ],
[ "Sprite", "api/objects/Sprite" ]
],
"Renderers": [
......@@ -110,18 +115,23 @@ var list = {
],
"Renderers / Renderables": [
[ "RenderableFace3", "api/renderers/renderables/RenderableFace3" ],
[ "RenderableFace", "api/renderers/renderables/RenderableFace" ],
[ "RenderableLine", "api/renderers/renderables/RenderableLine" ],
[ "RenderableObject", "api/renderers/renderables/RenderableObject" ],
[ "RenderableParticle", "api/renderers/renderables/RenderableParticle" ],
[ "RenderableSprite", "api/renderers/renderables/RenderableSprite" ],
[ "RenderableVertex", "api/renderers/renderables/RenderableVertex" ]
],
"Renderers / Shaders": [
[ "ShaderChunk", "api/renderers/shaders/ShaderChunk" ],
[ "UniformsUtils", "api/renderers/shaders/UniformsUtils" ],
[ "ShaderLib", "api/renderers/shaders/ShaderLib" ],
[ "UniformsLib", "api/renderers/shaders/UniformsLib" ],
[ "ShaderLib", "api/renderers/shaders/ShaderLib" ]
[ "UniformsUtils", "api/renderers/shaders/UniformsUtils" ]
],
"Renderers / WebGL": [
[ "WebGLProgram", "api/renderers/webgl/WebGLProgram" ],
[ "WebGLShader", "api/renderers/webgl/WebGLShader" ]
],
"Scenes": [
......@@ -146,8 +156,8 @@ var list = {
"Extras / Animation": [
[ "Animation", "api/extras/animation/Animation" ],
[ "AnimationHandler", "api/extras/animation/AnimationHandler" ],
[ "AnimationMorphTarget", "api/extras/animation/AnimationMorphTarget" ],
[ "KeyFrameAnimation", "api/extras/animation/KeyFrameAnimation" ]
[ "KeyFrameAnimation", "api/extras/animation/KeyFrameAnimation" ],
[ "AnimationMorphTarget", "api/extras/animation/AnimationMorphTarget" ]
],
"Extras / Cameras": [
......@@ -155,6 +165,7 @@ var list = {
[ "CubeCamera", "api/extras/cameras/CubeCamera" ]
],
"Extras / Core": [
[ "Curve", "api/extras/core/Curve" ],
[ "CurvePath", "api/extras/core/CurvePath" ],
......@@ -163,9 +174,23 @@ var list = {
[ "Shape", "api/extras/core/Shape" ]
],
"Extras / Curves": [
[ "ArcCurve", "api/extras/curves/ArcCurve" ],
[ "ClosedSplineCurve3", "api/extras/curves/ClosedSplineCurve3" ],
[ "CubicBezierCurve", "api/extras/curves/CubicBezierCurve" ],
[ "CubicBezierCurve3", "api/extras/curves/CubicBezierCurve3" ],
[ "EllipseCurve", "api/extras/curves/EllipseCurve" ],
[ "LineCurve", "api/extras/curves/LineCurve" ],
[ "LineCurve3", "api/extras/curves/LineCurve3" ],
[ "QuadraticBezierCurve", "api/extras/curves/QuadraticBezierCurve" ],
[ "QuadraticBezierCurve3", "api/extras/curves/QuadraticBezierCurve3" ],
[ "SplineCurve", "api/extras/curves/SplineCurve" ],
[ "SplineCurve3", "api/extras/curves/SplineCurve3" ]
],
"Extras / Geometries": [
[ "BoxGeometry", "api/extras/geometries/BoxGeometry" ],
[ "CircleGeometry", "api/extras/geometries/CircleGeometry" ],
[ "ConvexGeometry", "api/extras/geometries/ConvexGeometry" ],
[ "CubeGeometry", "api/extras/geometries/CubeGeometry" ],
[ "CylinderGeometry", "api/extras/geometries/CylinderGeometry" ],
[ "ExtrudeGeometry", "api/extras/geometries/ExtrudeGeometry" ],
......@@ -191,10 +216,15 @@ var list = {
[ "BoundingBoxHelper", "api/extras/helpers/BoundingBoxHelper" ],
[ "CameraHelper", "api/extras/helpers/CameraHelper" ],
[ "DirectionalLightHelper", "api/extras/helpers/DirectionalLightHelper" ],
[ "EdgesHelper", "api/extras/helpers/EdgesHelper" ],
[ "FaceNormalsHelper", "api/extras/helpers/FaceNormalsHelper" ],
[ "GridHelper", "api/extras/helpers/GridHelper" ],
[ "HemisphereLightHelper", "api/extras/helpers/HemisphereLightHelper" ],
[ "PointLightHelper", "api/extras/helpers/PointLightHelper" ],
[ "SpotLightHelper", "api/extras/helpers/SpotLightHelper" ]
[ "SpotLightHelper", "api/extras/helpers/SpotLightHelper" ],
[ "VertexNormalsHelper", "api/extras/helpers/VertexNormalsHelper" ],
[ "VertexTangentsHelper", "api/extras/helpers/VertexTangentsHelper" ],
[ "WireframeHelper", "api/extras/helpers/WireframeHelper" ]
],
"Extras / Objects": [
......@@ -211,9 +241,14 @@ var list = {
],
"Extras / Shaders": [
[ "ShaderFlares", "api/extras/shaders/ShaderFlares" ],
[ "ShaderSprite", "api/extras/shaders/ShaderSprite" ]
[ "ShaderFlares", "api/extras/shaders/ShaderFlares" ]
],
"Examples" : [
[ "LookupTable", "api/examples/Lut" ]
]
}
};
......
......@@ -6,7 +6,7 @@
}
body {
margin: 25px 20px;
margin: 30px 20px;
color: #555;
font-family: 'inconsolata';
font-size: 15px;
......
......@@ -55,6 +55,28 @@ button {
user-select: none;
}
.CollapsiblePanel .CollapsiblePanelButton {
float: left;
margin-right: 6px;
width: 0px;
height: 0px;
border: 6px solid transparent;
}
.CollapsiblePanel.collapsed .CollapsiblePanelButton {
margin-top: 2px;
border-left-color: #555;
}
.CollapsiblePanel:not(.collapsed) .CollapsiblePanelButton {
margin-top: 6px;
border-top-color: #555;
}
.CollapsiblePanel.collapsed .CollapsibleContent {
display: none;
}
.FancySelect {
background: #222;
border: 1px solid #3C3C3C;
......@@ -158,6 +180,10 @@ input.Number {
margin-bottom: 10px;
}
#sidebar .Panel.collapsed {
margin-bottom: 0px;
}
#sidebar > .Panel {
color: #888;
padding: 10px;
......
......@@ -28,6 +28,28 @@ button {
user-select: none;
}
.CollapsiblePanel .CollapsiblePanelButton {
float: left;
margin-right: 6px;
width: 0px;
height: 0px;
border: 6px solid transparent;
}
.CollapsiblePanel.collapsed .CollapsiblePanelButton {
margin-top: 2px;
border-left-color: #bbb;
}
.CollapsiblePanel:not(.collapsed) .CollapsiblePanelButton {
margin-top: 6px;
border-top-color: #bbb;
}
.CollapsiblePanel.collapsed .CollapsibleContent {
display: none;
}
.FancySelect {
background: #fff;
border: 1px solid #ccc;
......@@ -131,6 +153,10 @@ input.Number {
margin-bottom: 10px;
}
#sidebar .Panel.collapsed {
margin-bottom: 0px;
}
#sidebar > .Panel {
color: #888;
padding: 10px;
......
......@@ -27,6 +27,8 @@
<script src="../examples/js/loaders/ctm/CTMLoader.js"></script>
<script src="../examples/js/exporters/SceneExporter.js"></script>
<script src="../examples/js/exporters/OBJExporter.js"></script>
<script src="../examples/js/exporters/STLExporter.js"></script>
<script src="../examples/js/renderers/RaytracingRenderer.js"></script>
<script src="../examples/js/renderers/SoftwareRenderer.js"></script>
<script src="../examples/js/renderers/SVGRenderer.js"></script>
......@@ -35,7 +37,7 @@
<script src="../examples/js/BufferGeometryUtils.js"></script>
<script src="../examples/js/exporters/BufferGeometryExporter.js"></script>
<script src="../examples/js/exporters/Geometry2Exporter.js"></script>
<script src="../examples/js/exporters/TypedGeometryExporter.js"></script>
<script src="../examples/js/exporters/GeometryExporter.js"></script>
<script src="../examples/js/exporters/MaterialExporter.js"></script>
<script src="../examples/js/exporters/ObjectExporter.js"></script>
......@@ -43,6 +45,7 @@
<script src="js/libs/signals.min.js"></script>
<script src="js/libs/ui.js"></script>
<script src="js/libs/ui.editor.js"></script>
<script src="js/libs/ui.three.js"></script>
<script src="js/Storage.js"></script>
......@@ -171,8 +174,9 @@
event.preventDefault();
break;
case 46: // delete
var parent = editor.selected.parent;
editor.removeObject( editor.selected );
editor.deselect();
editor.select( parent );
break;
}
......
......@@ -357,7 +357,6 @@ Editor.prototype = {
'TorusKnotGeometry': THREE.TorusKnotGeometry,
'TubeGeometry': THREE.TubeGeometry,
'Geometry': THREE.Geometry,
'Geometry2': THREE.Geometry2,
'BufferGeometry': THREE.BufferGeometry
};
......
......@@ -39,7 +39,7 @@ var Loader = function ( editor ) {
stream.offset = 0;
var loader = new THREE.CTMLoader();
loader.createModelBuffers( new CTM.File( stream ), function( geometry ) {
loader.createModel( new CTM.File( stream ), function( geometry ) {
geometry.sourceType = "ctm";
geometry.sourceFile = file.name;
......@@ -316,9 +316,25 @@ var Loader = function ( editor ) {
var result = loader.parse( data );
var geometry = result.geometry;
var material = result.materials !== undefined
? new THREE.MeshFaceMaterial( result.materials )
: new THREE.MeshPhongMaterial();
var material;
if ( result.materials !== undefined ) {
if ( result.materials.length > 1 ) {
material = new THREE.MeshFaceMaterial( result.materials );
} else {
material = result.materials[ 0 ];
}
} else {
material = new THREE.MeshPhongMaterial();
}
geometry.sourceType = "ascii";
geometry.sourceFile = file.name;
......
Menubar.Add = function ( editor ) {
var container = new UI.Panel();
container.setClass( 'menu' );
var title = new UI.Panel();
title.setTextContent( 'Add' );
title.setMargin( '0px' );
title.setPadding( '8px' );
container.add( title );
//
var options = new UI.Panel();
options.setClass( 'options' );
container.add( options );
var meshCount = 0;
var lightCount = 0;
// add object
// event handlers
var option = new UI.Panel();
option.setClass( 'option' );
option.setTextContent( 'Object3D' );
option.onClick( function () {
function onObject3DOptionClick () {
var mesh = new THREE.Object3D();
mesh.name = 'Object3D ' + ( ++ meshCount );
......@@ -31,19 +13,9 @@ Menubar.Add = function ( editor ) {
editor.addObject( mesh );
editor.select( mesh );
} );
options.add( option );
}
// divider
options.add( new UI.HorizontalRule() );
// add plane
var option = new UI.Panel();
option.setClass( 'option' );
option.setTextContent( 'Plane' );
option.onClick( function () {
function onPlaneOptionClick () {
var width = 200;
var height = 200;
......@@ -59,15 +31,9 @@ Menubar.Add = function ( editor ) {
editor.addObject( mesh );
editor.select( mesh );
} );
options.add( option );
// add box
};
var option = new UI.Panel();
option.setClass( 'option' );
option.setTextContent( 'Box' );
option.onClick( function () {
function onBoxOptionClick () {
var width = 100;
var height = 100;
......@@ -84,15 +50,9 @@ Menubar.Add = function ( editor ) {
editor.addObject( mesh );
editor.select( mesh );
} );
options.add( option );
// add circle
var option = new UI.Panel();
option.setClass( 'option' );
option.setTextContent( 'Circle' );
option.onClick( function () {
}
function onCircleOptionClick () {
var radius = 20;
var segments = 8;
......@@ -104,15 +64,9 @@ Menubar.Add = function ( editor ) {
editor.addObject( mesh );
editor.select( mesh );
} );
options.add( option );
}
// add cylinder
var option = new UI.Panel();
option.setClass( 'option' );
option.setTextContent( 'Cylinder' );
option.onClick( function () {
function onCylinderOptionClick () {
var radiusTop = 20;
var radiusBottom = 20;
......@@ -128,15 +82,9 @@ Menubar.Add = function ( editor ) {
editor.addObject( mesh );
editor.select( mesh );
} );
options.add( option );
// add sphere
}
var option = new UI.Panel();
option.setClass( 'option' );
option.setTextContent( 'Sphere' );
option.onClick( function () {
function onSphereOptionClick () {
var radius = 75;
var widthSegments = 32;
......@@ -149,15 +97,9 @@ Menubar.Add = function ( editor ) {
editor.addObject( mesh );
editor.select( mesh );
} );
options.add( option );
}
// add icosahedron
var option = new UI.Panel();
option.setClass( 'option' );
option.setTextContent( 'Icosahedron' );
option.onClick( function () {
function onIcosahedronOptionClick () {
var radius = 75;
var detail = 2;
......@@ -169,15 +111,9 @@ Menubar.Add = function ( editor ) {
editor.addObject( mesh );
editor.select( mesh );
} );
options.add( option );
// add torus
}
var option = new UI.Panel();
option.setClass( 'option' );
option.setTextContent( 'Torus' );
option.onClick( function () {
function onTorusOptionClick () {
var radius = 100;
var tube = 40;
......@@ -192,15 +128,9 @@ Menubar.Add = function ( editor ) {
editor.addObject( mesh );
editor.select( mesh );
} );
options.add( option );
}
// add torus knot
var option = new UI.Panel();
option.setClass( 'option' );
option.setTextContent( 'TorusKnot' );
option.onClick( function () {
function onTorusKnotOptionClick () {
var radius = 100;
var tube = 40;
......@@ -217,19 +147,9 @@ Menubar.Add = function ( editor ) {
editor.addObject( mesh );
editor.select( mesh );
} );
options.add( option );
// divider
}
options.add( new UI.HorizontalRule() );
// add sprite
var option = new UI.Panel();
option.setClass( 'option' );
option.setTextContent( 'Sprite' );
option.onClick( function () {
function onSpriteOptionClick () {
var sprite = new THREE.Sprite( new THREE.SpriteMaterial() );
sprite.name = 'Sprite ' + ( ++ meshCount );
......@@ -237,19 +157,9 @@ Menubar.Add = function ( editor ) {
editor.addObject( sprite );
editor.select( sprite );
} );
options.add( option );
// divider
options.add( new UI.HorizontalRule() );
}
// add point light
var option = new UI.Panel();
option.setClass( 'option' );
option.setTextContent( 'Point light' );
option.onClick( function () {
function onPointLightOptionClick () {
var color = 0xffffff;
var intensity = 1;
......@@ -261,15 +171,9 @@ Menubar.Add = function ( editor ) {
editor.addObject( light );
editor.select( light );
} );
options.add( option );
// add spot light
}
var option = new UI.Panel();
option.setClass( 'option' );
option.setTextContent( 'Spot light' );
option.onClick( function () {
function onSpotLightOptionClick () {
var color = 0xffffff;
var intensity = 1;
......@@ -286,15 +190,9 @@ Menubar.Add = function ( editor ) {
editor.addObject( light );
editor.select( light );
} );
options.add( option );
}
// add directional light
var option = new UI.Panel();
option.setClass( 'option' );
option.setTextContent( 'Directional light' );
option.onClick( function () {
function onDirectionalLightOptionClick () {
var color = 0xffffff;
var intensity = 1;
......@@ -308,15 +206,9 @@ Menubar.Add = function ( editor ) {
editor.addObject( light );
editor.select( light );
} );
options.add( option );
// add hemisphere light
}
var option = new UI.Panel();
option.setClass( 'option' );
option.setTextContent( 'Hemisphere light' );
option.onClick( function () {
function onHemisphereLightOptionClick () {
var skyColor = 0x00aaff;
var groundColor = 0xffaa00;
......@@ -330,15 +222,9 @@ Menubar.Add = function ( editor ) {
editor.addObject( light );
editor.select( light );
} );
options.add( option );
}
// add ambient light
var option = new UI.Panel();
option.setClass( 'option' );
option.setTextContent( 'Ambient light' );
option.onClick( function () {
function onAmbientLightOptionClick() {
var color = 0x222222;
......@@ -348,11 +234,39 @@ Menubar.Add = function ( editor ) {
editor.addObject( light );
editor.select( light );
} );
options.add( option );
}
// configure menu contents
var createOption = UI.MenubarHelper.createOption;
var createDivider = UI.MenubarHelper.createDivider;
var menuConfig = [
createOption( 'Object3D', onObject3DOptionClick ),
createDivider(),
createOption( 'Plane', onPlaneOptionClick ),
createOption( 'Box', onBoxOptionClick ),
createOption( 'Circle', onCircleOptionClick ),
createOption( 'Cylinder', onCylinderOptionClick ),
createOption( 'Sphere', onSphereOptionClick ),
createOption( 'Icosahedron', onIcosahedronOptionClick ),
createOption( 'Torus', onTorusOptionClick ),
createOption( 'Torus Knot', onTorusKnotOptionClick ),
createDivider(),
createOption( 'Sprite', onSpriteOptionClick ),
createDivider(),
createOption( 'Point light', onPointLightOptionClick ),
createOption( 'Spot light', onSpotLightOptionClick ),
createOption( 'Directional light', onDirectionalLightOptionClick ),
createOption( 'Hemisphere light', onHemisphereLightOptionClick ),
createOption( 'Ambient light', onAmbientLightOptionClick )
];
//
var optionsPanel = UI.MenubarHelper.createOptionsPanel( menuConfig );
return container;
return UI.MenubarHelper.createMenuContainer( 'Add', optionsPanel );
}
Menubar.Edit = function ( editor ) {
var container = new UI.Panel();
container.setClass( 'menu' );
// event handlers
var title = new UI.Panel();
title.setTextContent( 'Edit' );
title.setMargin( '0px' );
title.setPadding( '8px' );
container.add( title );
// function onUndoOptionClick () {
//
// console.log( 'UNDO not implemented yet' );
var options = new UI.Panel();
options.setClass( 'options' );
container.add( options );
// }
// clone
// function onRedoOptionClick () {
var option = new UI.Panel();
option.setClass( 'option' );
option.setTextContent( 'Clone' );
option.onClick( function () {
// console.log( 'REDO not implemented yet' );
// }
function onCloneOptionClick () {
var object = editor.selected;
......@@ -31,33 +25,21 @@ Menubar.Edit = function ( editor ) {
editor.addObject( object );
editor.select( object );
} );
options.add( option );
// delete
}
var option = new UI.Panel();
option.setClass( 'option' );
option.setTextContent( 'Delete' );
option.onClick( function () {
function onDeleteOptionClick () {
var parent = editor.selected.parent;
editor.removeObject( editor.selected );
editor.deselect();
editor.select( parent );
} );
options.add( option );
}
options.add( new UI.HorizontalRule() );
// convert to BufferGeometry
var option = new UI.Panel();
option.setClass( 'option' );
option.setTextContent( 'Convert' );
option.onClick( function () {
function onConvertOptionClick () {
// convert to BufferGeometry
var object = editor.selected;
if ( object.geometry instanceof THREE.Geometry ) {
if ( object.parent === undefined ) return; // avoid flattening the camera or scene
......@@ -69,18 +51,11 @@ Menubar.Edit = function ( editor ) {
object.geometry = THREE.BufferGeometryUtils.fromGeometry( object.geometry );
editor.signals.objectChanged.dispatch( object );
}
} );
options.add( option );
// flatten
}
var option = new UI.Panel();
option.setClass( 'option' );
option.setTextContent( 'Flatten' );
option.onClick( function () {
function onFlattenOptionClick () {
var object = editor.selected;
......@@ -101,12 +76,27 @@ Menubar.Edit = function ( editor ) {
editor.signals.objectChanged.dispatch( object );
} );
options.add( option );
}
// configure menu contents
var createOption = UI.MenubarHelper.createOption;
var createDivider = UI.MenubarHelper.createDivider;
var menuConfig = [
// createOption( 'Undo', onUndoOptionClick ),
// createOption( 'Redo', onRedoOptionClick ),
// createDivider(),
createOption( 'Clone', onCloneOptionClick ),
createOption( 'Delete', onDeleteOptionClick ),
createDivider(),
//
createOption( 'Convert', onConvertOptionClick ),
createOption( 'Flatten', onFlattenOptionClick )
];
return container;
var optionsPanel = UI.MenubarHelper.createOptionsPanel( menuConfig );
return UI.MenubarHelper.createMenuContainer( 'Edit', optionsPanel );
}
Menubar.File = function ( editor ) {
var container = new UI.Panel();
container.setClass( 'menu' );
// helpers
function exportGeometry ( exporterClass ) {
var title = new UI.Panel();
title.setTextContent( 'File' );
title.setMargin( '0px' );
title.setPadding( '8px' );
container.add( title );
var object = editor.selected;
var exporter = new exporterClass();
//
var output = exporter.parse( object.geometry );
var options = new UI.Panel();
options.setClass( 'options' );
container.add( options );
if ( exporter instanceof THREE.BufferGeometryExporter ||
exporter instanceof THREE.GeometryExporter ) {
// new
output = JSON.stringify( output, null, '\t' );
output = output.replace( /[\n\t]+([\d\.e\-\[\]]+)/g, '$1' );
var option = new UI.Panel();
option.setClass( 'option' );
option.setTextContent( 'New' );
option.onClick( function () {
}
if ( confirm( 'Are you sure?' ) ) {
var blob = new Blob( [ output ], { type: 'text/plain' } );
var objectURL = URL.createObjectURL( blob );
editor.config.clear();
editor.storage.clear( function () {
window.open( objectURL, '_blank' );
window.focus();
location.href = location.pathname;
};
} );
function exportObject ( exporterClass ) {
var object = editor.selected;
var exporter = new exporterClass();
var output = JSON.stringify( exporter.parse( object ), null, '\t' );
output = output.replace( /[\n\t]+([\d\.e\-\[\]]+)/g, '$1' );
var blob = new Blob( [ output ], { type: 'text/plain' } );
var objectURL = URL.createObjectURL( blob );
window.open( objectURL, '_blank' );
window.focus();
}
function exportScene ( exporterClass ) {
var exporter = new exporterClass();
var output = exporter.parse( editor.scene );
if ( exporter instanceof THREE.ObjectExporter ) {
output = JSON.stringify( output, null, '\t' );
output = output.replace( /[\n\t]+([\d\.e\-\[\]]+)/g, '$1' );
}
} );
options.add( option );
var blob = new Blob( [ output ], { type: 'text/plain' } );
var objectURL = URL.createObjectURL( blob );
window.open( objectURL, '_blank' );
window.focus();
options.add( new UI.HorizontalRule() );
}
// event handlers
// import
function onNewOptionClick () {
var input = document.createElement( 'input' );
input.type = 'file';
input.addEventListener( 'change', function ( event ) {
if ( confirm( 'Are you sure?' ) ) {
editor.config.clear();
editor.storage.clear( function () {
location.href = location.pathname;
editor.loader.loadFile( input.files[ 0 ] );
} );
} );
}
var option = new UI.Panel();
option.setClass( 'option' );
option.setTextContent( 'Import' );
option.onClick( function () {
}
input.click();
function onImportOptionClick () {
} );
options.add( option );
fileInput.click();
options.add( new UI.HorizontalRule() );
}
function onFileInputChange ( event ) {
// export geometry
editor.loader.loadFile( fileInput.files[ 0 ] );
var option = new UI.Panel();
option.setClass( 'option' );
option.setTextContent( 'Export Geometry' );
option.onClick( function () {
}
function onExportGeometryOptionClick () {
var object = editor.selected;
if ( object === null ) {
......@@ -91,25 +115,15 @@ Menubar.File = function ( editor ) {
exportGeometry( THREE.BufferGeometryExporter );
} else if ( geometry instanceof THREE.Geometry2 ) {
exportGeometry( THREE.Geometry2Exporter );
} else if ( geometry instanceof THREE.Geometry ) {
exportGeometry( THREE.GeometryExporter );
}
} );
options.add( option );
// export object
}
var option = new UI.Panel();
option.setClass( 'option' );
option.setTextContent( 'Export Object' );
option.onClick( function () {
function onExportObjectOptionClick () {
if ( editor.selected === null ) {
......@@ -120,92 +134,53 @@ Menubar.File = function ( editor ) {
exportObject( THREE.ObjectExporter );
} );
options.add( option );
// export scene
}
var option = new UI.Panel();
option.setClass( 'option' );
option.setTextContent( 'Export Scene' );
option.onClick( function () {
function onExportSceneOptionClick () {
exportScene( THREE.ObjectExporter );
} );
options.add( option );
}
// export OBJ
var option = new UI.Panel();
option.setClass( 'option' );
option.setTextContent( 'Export OBJ' );
option.onClick( function () {
function onExportOBJOptionClick () {
exportGeometry( THREE.OBJExporter );
} );
options.add( option );
var exportGeometry = function ( exporterClass ) {
var object = editor.selected;
var exporter = new exporterClass();
var output;
}
if ( exporter instanceof THREE.BufferGeometryExporter ||
exporter instanceof THREE.Geometry2Exporter ||
exporter instanceof THREE.GeometryExporter ) {
output = JSON.stringify( exporter.parse( object.geometry ), null, '\t' );
output = output.replace( /[\n\t]+([\d\.e\-\[\]]+)/g, '$1' );
function onExportSTLOptionClick () {
} else {
exportScene( THREE.STLExporter );
output = exporter.parse( object.geometry );
}
}
// create file input element for scene import
var blob = new Blob( [ output ], { type: 'text/plain' } );
var objectURL = URL.createObjectURL( blob );
var fileInput = document.createElement( 'input' );
fileInput.type = 'file';
fileInput.addEventListener( 'change', onFileInputChange);
window.open( objectURL, '_blank' );
window.focus();
// configure menu contents
};
var createOption = UI.MenubarHelper.createOption;
var createDivider = UI.MenubarHelper.createDivider;
var menuConfig = [
createOption( 'New', onNewOptionClick ),
createDivider(),
var exportObject = function ( exporterClass ) {
createOption( 'Import', onImportOptionClick ),
createDivider(),
var object = editor.selected;
var exporter = new exporterClass();
createOption( 'Export Geometry', onExportGeometryOptionClick ),
createOption( 'Export Object', onExportObjectOptionClick ),
createOption( 'Export Scene', onExportSceneOptionClick ),
createOption( 'Export OBJ', onExportOBJOptionClick ),
createOption( 'Export STL', onExportSTLOptionClick )
];
var output = JSON.stringify( exporter.parse( object ), null, '\t' );
output = output.replace( /[\n\t]+([\d\.e\-\[\]]+)/g, '$1' );
var blob = new Blob( [ output ], { type: 'text/plain' } );
var objectURL = URL.createObjectURL( blob );
window.open( objectURL, '_blank' );
window.focus();
};
var exportScene = function ( exporterClass ) {
var exporter = new exporterClass();
var output = JSON.stringify( exporter.parse( editor.scene ), null, '\t' );
output = output.replace( /[\n\t]+([\d\.e\-\[\]]+)/g, '$1' );
var blob = new Blob( [ output ], { type: 'text/plain' } );
var objectURL = URL.createObjectURL( blob );
window.open( objectURL, '_blank' );
window.focus();
};
var optionsPanel = UI.MenubarHelper.createOptionsPanel( menuConfig );
return container;
return UI.MenubarHelper.createMenuContainer( 'File', optionsPanel );
}
Menubar.Help = function ( editor ) {
var container = new UI.Panel();
container.setClass( 'menu' );
// event handlers
var title = new UI.Panel();
title.setTextContent( 'Help' );
title.setMargin( '0px' );
title.setPadding( '8px' );
container.add( title );
function onSourcecodeOptionClick () {
//
window.open( 'https://github.com/mrdoob/three.js/tree/master/editor', '_blank' )
var options = new UI.Panel();
options.setClass( 'options' );
container.add( options );
}
// source code
function onAboutOptionClick () {
var option = new UI.Panel();
option.setClass( 'option' );
option.setTextContent( 'Source code' );
option.onClick( function () { window.open( 'https://github.com/mrdoob/three.js/tree/master/editor', '_blank' ) } );
options.add( option );
window.open( 'http://threejs.org', '_blank' );
// about
}
var option = new UI.Panel();
option.setClass( 'option' );
option.setTextContent( 'About' );
option.onClick( function () { window.open( 'http://threejs.org', '_blank' ) } );
options.add( option );
// configure menu contents
//
var createOption = UI.MenubarHelper.createOption;
var createDivider = UI.MenubarHelper.createDivider;
return container;
var menuConfig = [
createOption( 'Source code', onSourcecodeOptionClick ),
createOption( 'About', onAboutOptionClick )
];
var optionsPanel = UI.MenubarHelper.createOptionsPanel( menuConfig );
return UI.MenubarHelper.createMenuContainer( 'Help', optionsPanel );
}
Menubar.View = function ( editor ) {
var menuConfig,
optionsPanel,
createOption,
createDivider;
var container = new UI.Panel();
container.setClass( 'menu' );
var title = new UI.Panel();
title.setTextContent( 'View' );
title.setMargin( '0px' );
title.setPadding( '8px' );
container.add( title );
//
var options = new UI.Panel();
options.setClass( 'options' );
container.add( options );
// themes
var option = new UI.Panel();
option.setClass( 'option' );
option.setTextContent( 'Light theme' );
option.onClick( function () {
function onLightThemeOptionClick () {
editor.setTheme( 'css/light.css' );
editor.config.setKey( 'theme', 'css/light.css' );
} );
options.add( option );
}
// about
var option = new UI.Panel();
option.setClass( 'option' );
option.setTextContent( 'Dark theme' );
option.onClick( function () {
function onDarkThemeOptionClick () {
editor.setTheme( 'css/dark.css' );
editor.config.setKey( 'theme', 'css/dark.css' );
} );
options.add( option );
}
// configure menu contents
createOption = UI.MenubarHelper.createOption;
createDivider = UI.MenubarHelper.createDivider;
menuConfig = [
createOption( 'Light theme', onLightThemeOptionClick ),
createOption( 'Dark theme', onDarkThemeOptionClick )
];
//
optionsPanel = UI.MenubarHelper.createOptionsPanel( menuConfig );
return container;
return UI.MenubarHelper.createMenuContainer( 'View', optionsPanel );
}
......@@ -7,7 +7,7 @@ Sidebar.Geometry.BoxGeometry = function ( signals, object ) {
// width
var widthRow = new UI.Panel();
var width = new UI.Number( geometry.width ).onChange( update );
var width = new UI.Number( geometry.parameters.width ).onChange( update );
widthRow.add( new UI.Text( 'Width' ).setWidth( '90px' ) );
widthRow.add( width );
......@@ -17,7 +17,7 @@ Sidebar.Geometry.BoxGeometry = function ( signals, object ) {
// height
var heightRow = new UI.Panel();
var height = new UI.Number( geometry.height ).onChange( update );
var height = new UI.Number( geometry.parameters.height ).onChange( update );
heightRow.add( new UI.Text( 'Height' ).setWidth( '90px' ) );
heightRow.add( height );
......@@ -27,7 +27,7 @@ Sidebar.Geometry.BoxGeometry = function ( signals, object ) {
// depth
var depthRow = new UI.Panel();
var depth = new UI.Number( geometry.depth ).onChange( update );
var depth = new UI.Number( geometry.parameters.depth ).onChange( update );
depthRow.add( new UI.Text( 'Depth' ).setWidth( '90px' ) );
depthRow.add( depth );
......@@ -37,7 +37,7 @@ Sidebar.Geometry.BoxGeometry = function ( signals, object ) {
// widthSegments
var widthSegmentsRow = new UI.Panel();
var widthSegments = new UI.Integer( geometry.widthSegments ).setRange( 1, Infinity ).onChange( update );
var widthSegments = new UI.Integer( geometry.parameters.widthSegments ).setRange( 1, Infinity ).onChange( update );
widthSegmentsRow.add( new UI.Text( 'Width segments' ).setWidth( '90px' ) );
widthSegmentsRow.add( widthSegments );
......@@ -47,7 +47,7 @@ Sidebar.Geometry.BoxGeometry = function ( signals, object ) {
// heightSegments
var heightSegmentsRow = new UI.Panel();
var heightSegments = new UI.Integer( geometry.heightSegments ).setRange( 1, Infinity ).onChange( update );
var heightSegments = new UI.Integer( geometry.parameters.heightSegments ).setRange( 1, Infinity ).onChange( update );
heightSegmentsRow.add( new UI.Text( 'Height segments' ).setWidth( '90px' ) );
heightSegmentsRow.add( heightSegments );
......@@ -57,7 +57,7 @@ Sidebar.Geometry.BoxGeometry = function ( signals, object ) {
// depthSegments
var depthSegmentsRow = new UI.Panel();
var depthSegments = new UI.Integer( geometry.depthSegments ).setRange( 1, Infinity ).onChange( update );
var depthSegments = new UI.Integer( geometry.parameters.depthSegments ).setRange( 1, Infinity ).onChange( update );
depthSegmentsRow.add( new UI.Text( 'Height segments' ).setWidth( '90px' ) );
depthSegmentsRow.add( depthSegments );
......
......@@ -7,7 +7,7 @@ Sidebar.Geometry.CircleGeometry = function ( signals, object ) {
// radius
var radiusRow = new UI.Panel();
var radius = new UI.Number( geometry.radius ).onChange( update );
var radius = new UI.Number( geometry.parameters.radius ).onChange( update );
radiusRow.add( new UI.Text( 'Radius' ).setWidth( '90px' ) );
radiusRow.add( radius );
......@@ -17,7 +17,7 @@ Sidebar.Geometry.CircleGeometry = function ( signals, object ) {
// segments
var segmentsRow = new UI.Panel();
var segments = new UI.Integer( geometry.segments ).onChange( update );
var segments = new UI.Integer( geometry.parameters.segments ).setRange( 3, Infinity ).onChange( update );
segmentsRow.add( new UI.Text( 'Segments' ).setWidth( '90px' ) );
segmentsRow.add( segments );
......
......@@ -7,7 +7,7 @@ Sidebar.Geometry.CylinderGeometry = function ( signals, object ) {
// radiusTop
var radiusTopRow = new UI.Panel();
var radiusTop = new UI.Number( geometry.radiusTop ).onChange( update );
var radiusTop = new UI.Number( geometry.parameters.radiusTop ).onChange( update );
radiusTopRow.add( new UI.Text( 'Radius top' ).setWidth( '90px' ) );
radiusTopRow.add( radiusTop );
......@@ -17,7 +17,7 @@ Sidebar.Geometry.CylinderGeometry = function ( signals, object ) {
// radiusBottom
var radiusBottomRow = new UI.Panel();
var radiusBottom = new UI.Number( geometry.radiusBottom ).onChange( update );
var radiusBottom = new UI.Number( geometry.parameters.radiusBottom ).onChange( update );
radiusBottomRow.add( new UI.Text( 'Radius bottom' ).setWidth( '90px' ) );
radiusBottomRow.add( radiusBottom );
......@@ -27,7 +27,7 @@ Sidebar.Geometry.CylinderGeometry = function ( signals, object ) {
// height
var heightRow = new UI.Panel();
var height = new UI.Number( geometry.height ).onChange( update );
var height = new UI.Number( geometry.parameters.height ).onChange( update );
heightRow.add( new UI.Text( 'Height' ).setWidth( '90px' ) );
heightRow.add( height );
......@@ -37,7 +37,7 @@ Sidebar.Geometry.CylinderGeometry = function ( signals, object ) {
// radialSegments
var radialSegmentsRow = new UI.Panel();
var radialSegments = new UI.Integer( geometry.radialSegments ).setRange( 1, Infinity ).onChange( update );
var radialSegments = new UI.Integer( geometry.parameters.radialSegments ).setRange( 1, Infinity ).onChange( update );
radialSegmentsRow.add( new UI.Text( 'Radial segments' ).setWidth( '90px' ) );
radialSegmentsRow.add( radialSegments );
......@@ -47,7 +47,7 @@ Sidebar.Geometry.CylinderGeometry = function ( signals, object ) {
// heightSegments
var heightSegmentsRow = new UI.Panel();
var heightSegments = new UI.Integer( geometry.heightSegments ).setRange( 1, Infinity ).onChange( update );
var heightSegments = new UI.Integer( geometry.parameters.heightSegments ).setRange( 1, Infinity ).onChange( update );
heightSegmentsRow.add( new UI.Text( 'Height segments' ).setWidth( '90px' ) );
heightSegmentsRow.add( heightSegments );
......@@ -57,7 +57,7 @@ Sidebar.Geometry.CylinderGeometry = function ( signals, object ) {
// openEnded
var openEndedRow = new UI.Panel();
var openEnded = new UI.Checkbox( geometry.openEnded ).onChange( update );
var openEnded = new UI.Checkbox( geometry.parameters.openEnded ).onChange( update );
openEndedRow.add( new UI.Text( 'Open ended' ).setWidth( '90px' ) );
openEndedRow.add( openEnded );
......
......@@ -7,7 +7,7 @@ Sidebar.Geometry.IcosahedronGeometry = function ( signals, object ) {
// radius
var radiusRow = new UI.Panel();
var radius = new UI.Number( geometry.radius ).onChange( update );
var radius = new UI.Number( geometry.parameters.radius ).onChange( update );
radiusRow.add( new UI.Text( 'Radius' ).setWidth( '90px' ) );
radiusRow.add( radius );
......@@ -17,7 +17,7 @@ Sidebar.Geometry.IcosahedronGeometry = function ( signals, object ) {
// detail
var detailRow = new UI.Panel();
var detail = new UI.Integer( geometry.detail ).setRange( 0, Infinity ).onChange( update );
var detail = new UI.Integer( geometry.parameters.detail ).setRange( 0, Infinity ).onChange( update );
detailRow.add( new UI.Text( 'Detail' ).setWidth( '90px' ) );
detailRow.add( detail );
......
......@@ -7,7 +7,7 @@ Sidebar.Geometry.PlaneGeometry = function ( signals, object ) {
// width
var widthRow = new UI.Panel();
var width = new UI.Number( geometry.width ).onChange( update );
var width = new UI.Number( geometry.parameters.width ).onChange( update );
widthRow.add( new UI.Text( 'Width' ).setWidth( '90px' ) );
widthRow.add( width );
......@@ -17,7 +17,7 @@ Sidebar.Geometry.PlaneGeometry = function ( signals, object ) {
// height
var heightRow = new UI.Panel();
var height = new UI.Number( geometry.height ).onChange( update );
var height = new UI.Number( geometry.parameters.height ).onChange( update );
heightRow.add( new UI.Text( 'Height' ).setWidth( '90px' ) );
heightRow.add( height );
......@@ -27,7 +27,7 @@ Sidebar.Geometry.PlaneGeometry = function ( signals, object ) {
// widthSegments
var widthSegmentsRow = new UI.Panel();
var widthSegments = new UI.Integer( geometry.widthSegments ).setRange( 1, Infinity ).onChange( update );
var widthSegments = new UI.Integer( geometry.parameters.widthSegments ).setRange( 1, Infinity ).onChange( update );
widthSegmentsRow.add( new UI.Text( 'Width segments' ).setWidth( '90px' ) );
widthSegmentsRow.add( widthSegments );
......@@ -37,7 +37,7 @@ Sidebar.Geometry.PlaneGeometry = function ( signals, object ) {
// heightSegments
var heightSegmentsRow = new UI.Panel();
var heightSegments = new UI.Integer( geometry.heightSegments ).setRange( 1, Infinity ).onChange( update );
var heightSegments = new UI.Integer( geometry.parameters.heightSegments ).setRange( 1, Infinity ).onChange( update );
heightSegmentsRow.add( new UI.Text( 'Height segments' ).setWidth( '90px' ) );
heightSegmentsRow.add( heightSegments );
......
......@@ -7,7 +7,7 @@ Sidebar.Geometry.SphereGeometry = function ( signals, object ) {
// radius
var radiusRow = new UI.Panel();
var radius = new UI.Number( geometry.radius ).onChange( update );
var radius = new UI.Number( geometry.parameters.radius ).onChange( update );
radiusRow.add( new UI.Text( 'Radius' ).setWidth( '90px' ) );
radiusRow.add( radius );
......@@ -17,7 +17,7 @@ Sidebar.Geometry.SphereGeometry = function ( signals, object ) {
// widthSegments
var widthSegmentsRow = new UI.Panel();
var widthSegments = new UI.Integer( geometry.widthSegments ).setRange( 1, Infinity ).onChange( update );
var widthSegments = new UI.Integer( geometry.parameters.widthSegments ).setRange( 1, Infinity ).onChange( update );
widthSegmentsRow.add( new UI.Text( 'Width segments' ).setWidth( '90px' ) );
widthSegmentsRow.add( widthSegments );
......@@ -27,7 +27,7 @@ Sidebar.Geometry.SphereGeometry = function ( signals, object ) {
// heightSegments
var heightSegmentsRow = new UI.Panel();
var heightSegments = new UI.Integer( geometry.heightSegments ).setRange( 1, Infinity ).onChange( update );
var heightSegments = new UI.Integer( geometry.parameters.heightSegments ).setRange( 1, Infinity ).onChange( update );
heightSegmentsRow.add( new UI.Text( 'Height segments' ).setWidth( '90px' ) );
heightSegmentsRow.add( heightSegments );
......@@ -37,7 +37,7 @@ Sidebar.Geometry.SphereGeometry = function ( signals, object ) {
// phiStart
var phiStartRow = new UI.Panel();
var phiStart = new UI.Number( geometry.phiStart ).onChange( update );
var phiStart = new UI.Number( geometry.parameters.phiStart ).onChange( update );
phiStartRow.add( new UI.Text( 'Phi start' ).setWidth( '90px' ) );
phiStartRow.add( phiStart );
......@@ -47,7 +47,7 @@ Sidebar.Geometry.SphereGeometry = function ( signals, object ) {
// phiLength
var phiLengthRow = new UI.Panel();
var phiLength = new UI.Number( geometry.phiLength ).onChange( update );
var phiLength = new UI.Number( geometry.parameters.phiLength ).onChange( update );
phiLengthRow.add( new UI.Text( 'Phi length' ).setWidth( '90px' ) );
phiLengthRow.add( phiLength );
......@@ -57,7 +57,7 @@ Sidebar.Geometry.SphereGeometry = function ( signals, object ) {
// thetaStart
var thetaStartRow = new UI.Panel();
var thetaStart = new UI.Number( geometry.thetaStart ).onChange( update );
var thetaStart = new UI.Number( geometry.parameters.thetaStart ).onChange( update );
thetaStartRow.add( new UI.Text( 'Theta start' ).setWidth( '90px' ) );
thetaStartRow.add( thetaStart );
......@@ -67,7 +67,7 @@ Sidebar.Geometry.SphereGeometry = function ( signals, object ) {
// thetaLength
var thetaLengthRow = new UI.Panel();
var thetaLength = new UI.Number( geometry.thetaLength ).onChange( update );
var thetaLength = new UI.Number( geometry.parameters.thetaLength ).onChange( update );
thetaLengthRow.add( new UI.Text( 'Theta length' ).setWidth( '90px' ) );
thetaLengthRow.add( thetaLength );
......
......@@ -7,7 +7,7 @@ Sidebar.Geometry.TorusGeometry = function ( signals, object ) {
// radius
var radiusRow = new UI.Panel();
var radius = new UI.Number( geometry.radius ).onChange( update );
var radius = new UI.Number( geometry.parameters.radius ).onChange( update );
radiusRow.add( new UI.Text( 'Radius' ).setWidth( '90px' ) );
radiusRow.add( radius );
......@@ -17,7 +17,7 @@ Sidebar.Geometry.TorusGeometry = function ( signals, object ) {
// tube
var tubeRow = new UI.Panel();
var tube = new UI.Number( geometry.tube ).onChange( update );
var tube = new UI.Number( geometry.parameters.tube ).onChange( update );
tubeRow.add( new UI.Text( 'Tube' ).setWidth( '90px' ) );
tubeRow.add( tube );
......@@ -27,7 +27,7 @@ Sidebar.Geometry.TorusGeometry = function ( signals, object ) {
// radialSegments
var radialSegmentsRow = new UI.Panel();
var radialSegments = new UI.Integer( geometry.radialSegments ).setRange( 1, Infinity ).onChange( update );
var radialSegments = new UI.Integer( geometry.parameters.radialSegments ).setRange( 1, Infinity ).onChange( update );
radialSegmentsRow.add( new UI.Text( 'Radial segments' ).setWidth( '90px' ) );
radialSegmentsRow.add( radialSegments );
......@@ -37,7 +37,7 @@ Sidebar.Geometry.TorusGeometry = function ( signals, object ) {
// tubularSegments
var tubularSegmentsRow = new UI.Panel();
var tubularSegments = new UI.Integer( geometry.tubularSegments ).setRange( 1, Infinity ).onChange( update );
var tubularSegments = new UI.Integer( geometry.parameters.tubularSegments ).setRange( 1, Infinity ).onChange( update );
tubularSegmentsRow.add( new UI.Text( 'Tubular segments' ).setWidth( '90px' ) );
tubularSegmentsRow.add( tubularSegments );
......@@ -47,7 +47,7 @@ Sidebar.Geometry.TorusGeometry = function ( signals, object ) {
// arc
var arcRow = new UI.Panel();
var arc = new UI.Number( geometry.arc ).onChange( update );
var arc = new UI.Number( geometry.parameters.arc ).onChange( update );
arcRow.add( new UI.Text( 'Arc' ).setWidth( '90px' ) );
arcRow.add( arc );
......
......@@ -7,7 +7,7 @@ Sidebar.Geometry.TorusKnotGeometry = function ( signals, object ) {
// radius
var radiusRow = new UI.Panel();
var radius = new UI.Number( geometry.radius ).onChange( update );
var radius = new UI.Number( geometry.parameters.radius ).onChange( update );
radiusRow.add( new UI.Text( 'Radius' ).setWidth( '90px' ) );
radiusRow.add( radius );
......@@ -17,7 +17,7 @@ Sidebar.Geometry.TorusKnotGeometry = function ( signals, object ) {
// tube
var tubeRow = new UI.Panel();
var tube = new UI.Number( geometry.tube ).onChange( update );
var tube = new UI.Number( geometry.parameters.tube ).onChange( update );
tubeRow.add( new UI.Text( 'Tube' ).setWidth( '90px' ) );
tubeRow.add( tube );
......@@ -27,7 +27,7 @@ Sidebar.Geometry.TorusKnotGeometry = function ( signals, object ) {
// radialSegments
var radialSegmentsRow = new UI.Panel();
var radialSegments = new UI.Integer( geometry.radialSegments ).setRange( 1, Infinity ).onChange( update );
var radialSegments = new UI.Integer( geometry.parameters.radialSegments ).setRange( 1, Infinity ).onChange( update );
radialSegmentsRow.add( new UI.Text( 'Radial segments' ).setWidth( '90px' ) );
radialSegmentsRow.add( radialSegments );
......@@ -37,7 +37,7 @@ Sidebar.Geometry.TorusKnotGeometry = function ( signals, object ) {
// tubularSegments
var tubularSegmentsRow = new UI.Panel();
var tubularSegments = new UI.Integer( geometry.tubularSegments ).setRange( 1, Infinity ).onChange( update );
var tubularSegments = new UI.Integer( geometry.parameters.tubularSegments ).setRange( 1, Infinity ).onChange( update );
tubularSegmentsRow.add( new UI.Text( 'Tubular segments' ).setWidth( '90px' ) );
tubularSegmentsRow.add( tubularSegments );
......@@ -47,7 +47,7 @@ Sidebar.Geometry.TorusKnotGeometry = function ( signals, object ) {
// p
var pRow = new UI.Panel();
var p = new UI.Number( geometry.p ).onChange( update );
var p = new UI.Number( geometry.parameters.p ).onChange( update );
pRow.add( new UI.Text( 'P' ).setWidth( '90px' ) );
pRow.add( p );
......@@ -57,7 +57,7 @@ Sidebar.Geometry.TorusKnotGeometry = function ( signals, object ) {
// q
var qRow = new UI.Panel();
var q = new UI.Number( geometry.q ).onChange( update );
var q = new UI.Number( geometry.parameters.q ).onChange( update );
pRow.add( new UI.Text( 'Q' ).setWidth( '90px' ) );
pRow.add( q );
......@@ -67,7 +67,7 @@ Sidebar.Geometry.TorusKnotGeometry = function ( signals, object ) {
// heightScale
var heightScaleRow = new UI.Panel();
var heightScale = new UI.Number( geometry.heightScale ).onChange( update );
var heightScale = new UI.Number( geometry.parameters.heightScale ).onChange( update );
pRow.add( new UI.Text( 'Height scale' ).setWidth( '90px' ) );
pRow.add( heightScale );
......
......@@ -2,11 +2,11 @@ Sidebar.Geometry = function ( editor ) {
var signals = editor.signals;
var container = new UI.Panel();
var container = new UI.CollapsiblePanel();
container.setDisplay( 'none' );
container.add( new UI.Text().setValue( 'GEOMETRY' ) );
container.add( new UI.Break(), new UI.Break() );
container.addStatic( new UI.Text().setValue( 'GEOMETRY' ) );
container.add( new UI.Break() );
// uuid
......@@ -165,11 +165,6 @@ Sidebar.Geometry = function ( editor ) {
geometryVertices.setValue( geometry.vertices.length );
geometryFaces.setValue( geometry.faces.length );
} else if ( geometry instanceof THREE.Geometry2 ) {
geometryVertices.setValue( geometry.vertices.length / 3 );
geometryFaces.setValue( geometry.vertices.length / 9 );
} else if ( geometry instanceof THREE.BufferGeometry ) {
geometryVertices.setValue( geometry.attributes.position.array.length / 3 );
......
......@@ -20,12 +20,12 @@ Sidebar.Material = function ( editor ) {
};
var container = new UI.Panel();
var container = new UI.CollapsiblePanel();
container.setDisplay( 'none' );
container.dom.classList.add( 'Material' );
container.add( new UI.Text().setValue( 'MATERIAL' ) );
container.add( new UI.Break(), new UI.Break() );
container.addStatic( new UI.Text().setValue( 'MATERIAL' ) );
container.add( new UI.Break() );
// uuid
......@@ -313,7 +313,6 @@ Sidebar.Material = function ( editor ) {
if ( object instanceof THREE.Sprite ) objectHasUvs = true;
if ( geometry instanceof THREE.Geometry && geometry.faceVertexUvs[ 0 ].length > 0 ) objectHasUvs = true;
if ( geometry instanceof THREE.Geometry2 && geometry.uvs.length > 0 ) objectHasUvs = true;
if ( geometry instanceof THREE.BufferGeometry && geometry.attributes.uv !== undefined ) objectHasUvs = true;
if ( material ) {
......
......@@ -2,12 +2,12 @@ Sidebar.Object3D = function ( editor ) {
var signals = editor.signals;
var container = new UI.Panel();
var container = new UI.CollapsiblePanel();
container.setDisplay( 'none' );
var objectType = new UI.Text().setTextTransform( 'uppercase' );
container.add( objectType );
container.add( new UI.Break(), new UI.Break() );
container.addStatic( objectType );
container.add( new UI.Break() );
// uuid
......
......@@ -7,15 +7,17 @@ Sidebar.Renderer = function ( editor ) {
'WebGLRenderer': THREE.WebGLRenderer,
'WebGLRenderer3': THREE.WebGLRenderer3,
'CanvasRenderer': THREE.CanvasRenderer,
'SVGRenderer': THREE.SVGRenderer,
'SoftwareRenderer': THREE.SoftwareRenderer,
'SVGRenderer': THREE.SVGRenderer
'RaytracingRenderer': THREE.RaytracingRenderer
};
var container = new UI.Panel();
var container = new UI.CollapsiblePanel();
container.setCollapsed( true );
container.add( new UI.Text( 'RENDERER' ) );
container.add( new UI.Break(), new UI.Break() );
container.addStatic( new UI.Text( 'RENDERER' ) );
container.add( new UI.Break() );
// class
......
......@@ -2,16 +2,22 @@ Sidebar.Scene = function ( editor ) {
var signals = editor.signals;
var container = new UI.Panel();
var container = new UI.CollapsiblePanel();
container.add( new UI.Text( 'SCENE' ) );
container.add( new UI.Break(), new UI.Break() );
container.addStatic( new UI.Text( 'SCENE' ) );
container.add( new UI.Break() );
var ignoreObjectSelectedSignal = false;
var outliner = new UI.FancySelect().setId( 'outliner' );
outliner.onChange( function () {
ignoreObjectSelectedSignal = true;
editor.selectById( parseInt( outliner.getValue() ) );
ignoreObjectSelectedSignal = false;
} );
container.add( outliner );
container.add( new UI.Break() );
......@@ -123,9 +129,9 @@ Sidebar.Scene = function ( editor ) {
var scene = editor.scene;
var sceneType = editor.getObjectType( scene );
var options = {};
var options = [];
options[ scene.id ] = '<span class="type ' + sceneType + '"></span> ' + scene.name;
options.push( { value: scene.id, html: '<span class="type ' + sceneType + '"></span> ' + scene.name } );
( function addObjects( objects, pad ) {
......@@ -134,7 +140,7 @@ Sidebar.Scene = function ( editor ) {
var object = objects[ i ];
var objectType = editor.getObjectType( object );
var option = pad + '<span class="type ' + objectType + '"></span> ' + object.name;
var html = pad + '<span class="type ' + objectType + '"></span> ' + object.name;
if ( object instanceof THREE.Mesh ) {
......@@ -144,12 +150,12 @@ Sidebar.Scene = function ( editor ) {
var geometryType = editor.getGeometryType( geometry );
var materialType = editor.getMaterialType( material );
option += ' <span class="type ' + geometryType + '"></span> ' + geometry.name;
option += ' <span class="type ' + materialType + '"></span> ' + material.name;
html += ' <span class="type ' + geometryType + '"></span> ' + geometry.name;
html += ' <span class="type ' + materialType + '"></span> ' + material.name;
}
options[ object.id ] = option;
options.push( { value: object.id, html: html } );
addObjects( object.children, pad + '&nbsp;&nbsp;&nbsp;' );
......@@ -194,6 +200,8 @@ Sidebar.Scene = function ( editor ) {
signals.objectSelected.add( function ( object ) {
if ( ignoreObjectSelectedSignal === true ) return;
outliner.setValue( object !== null ? object.id : null );
} );
......
......@@ -61,7 +61,7 @@ var Storage = function () {
var request = objectStore.put( data, 0 );
request.onsuccess = function ( event ) {
console.log( '[' + /\d\d\:\d\d\:\d\d/.exec( new Date() )[ 0 ] + ']', 'Saved state to IndexedDB in ' + ( performance.now() - start ).toFixed( 2 ) + 'ms.' );
console.log( '[' + /\d\d\:\d\d\:\d\d/.exec( new Date() )[ 0 ] + ']', 'Saved state to IndexedDB. ' + ( performance.now() - start ).toFixed( 2 ) + 'ms' );
};
......
......@@ -497,11 +497,6 @@ var Viewport = function ( editor ) {
vertices += geometry.vertices.length;
faces += geometry.faces.length;
} else if ( geometry instanceof THREE.Geometry2 ) {
vertices += geometry.vertices.length / 3;
faces += geometry.vertices.length / 9;
} else if ( geometry instanceof THREE.BufferGeometry ) {
vertices += geometry.attributes.position.array.length / 3;
......@@ -577,7 +572,12 @@ var Viewport = function ( editor ) {
renderer.clear();
renderer.render( scene, camera );
renderer.render( sceneHelpers, camera );
if ( renderer instanceof THREE.RaytracingRenderer === false ) {
renderer.render( sceneHelpers, camera );
}
}
......
UI.MenubarHelper = {
createMenuContainer: function ( name, optionsPanel ) {
var container = new UI.Panel();
var title = new UI.Panel();
title.setTextContent( name );
title.setMargin( '0px' );
title.setPadding( '8px' );
container.setClass( 'menu' );
container.add( title );
container.add( optionsPanel );
return container;
},
createOption: function ( name, callbackHandler ) {
var option = new UI.Panel();
option.setClass( 'option' );
option.setTextContent( name );
option.onClick( callbackHandler );
return option;
},
createOptionsPanel: function ( menuConfig ) {
var options = new UI.Panel();
options.setClass( 'options' );
menuConfig.forEach(function(option) {
options.add(option);
});
return options;
},
createDivider: function () {
return new UI.HorizontalRule();
}
};
......@@ -137,6 +137,134 @@ UI.Panel.prototype.clear = function () {
};
// Collapsible Panel
UI.CollapsiblePanel = function () {
UI.Panel.call( this );
this.dom.className = 'Panel CollapsiblePanel';
this.button = document.createElement( 'div' );
this.button.className = 'CollapsiblePanelButton';
this.dom.appendChild( this.button );
var scope = this;
this.button.addEventListener( 'click', function ( event ) {
scope.toggle();
}, false );
this.content = document.createElement( 'div' );
this.content.className = 'CollapsibleContent';
this.dom.appendChild( this.content );
this.isCollapsed = false;
return this;
};
UI.CollapsiblePanel.prototype = Object.create( UI.Panel.prototype );
UI.CollapsiblePanel.prototype.addStatic = function () {
for ( var i = 0; i < arguments.length; i ++ ) {
this.dom.insertBefore( arguments[ i ].dom, this.content );
}
return this;
};
UI.CollapsiblePanel.prototype.removeStatic = UI.Panel.prototype.remove;
UI.CollapsiblePanel.prototype.clearStatic = function () {
this.dom.childNodes.forEach( function ( child ) {
if ( child !== this.content ) {
this.dom.removeChild( child );
}
});
};
UI.CollapsiblePanel.prototype.add = function () {
for ( var i = 0; i < arguments.length; i ++ ) {
this.content.appendChild( arguments[ i ].dom );
}
return this;
};
UI.CollapsiblePanel.prototype.remove = function () {
for ( var i = 0; i < arguments.length; i ++ ) {
this.content.removeChild( arguments[ i ].dom );
}
return this;
};
UI.CollapsiblePanel.prototype.clear = function () {
while ( this.content.children.length ) {
this.content.removeChild( this.content.lastChild );
}
};
UI.CollapsiblePanel.prototype.toggle = function() {
this.setCollapsed( !this.isCollapsed );
};
UI.CollapsiblePanel.prototype.collapse = function() {
this.setCollapsed( true );
};
UI.CollapsiblePanel.prototype.expand = function() {
this.setCollapsed( false );
};
UI.CollapsiblePanel.prototype.setCollapsed = function( setCollapsed ) {
if ( setCollapsed ) {
this.dom.classList.add('collapsed');
} else {
this.dom.classList.remove('collapsed');
}
this.isCollapsed = setCollapsed;
};
// Text
UI.Text = function ( text ) {
......@@ -367,13 +495,13 @@ UI.FancySelect = function () {
// Highlight selected dom elem and scroll parent if needed
scope.setValue( scope.options[ scope.selectedIndex ].value );
// Invoke object/helper/mesh selection logic
scope.dom.dispatchEvent( changeEvent );
}
break;
}
}, false);
this.dom = dom;
......@@ -403,17 +531,19 @@ UI.FancySelect.prototype.setOptions = function ( options ) {
scope.options = [];
for ( var key in options ) {
for ( var i = 0; i < options.length; i ++ ) {
var option = document.createElement('div');
option.className = 'option';
option.innerHTML = options[ key ];
option.value = key;
scope.dom.appendChild( option );
var option = options[ i ];
var div = document.createElement( 'div' );
div.className = 'option';
div.innerHTML = option.html;
div.value = option.value;
scope.dom.appendChild( div );
scope.options.push( option );
scope.options.push( div );
option.addEventListener( 'click', function ( event ) {
div.addEventListener( 'click', function ( event ) {
scope.setValue( this.value );
scope.dom.dispatchEvent( changeEvent );
......@@ -434,8 +564,6 @@ UI.FancySelect.prototype.getValue = function () {
UI.FancySelect.prototype.setValue = function ( value ) {
if ( typeof value === 'number' ) value = value.toString();
for ( var i = 0; i < this.options.length; i ++ ) {
var element = this.options[ i ];
......@@ -944,4 +1072,4 @@ UI.Button.prototype.setLabel = function ( value ) {
return this;
};
};
\ No newline at end of file
......@@ -69,7 +69,7 @@
var geometry = new THREE.SphereGeometry( 200, 20, 20 );
var material = new THREE.MeshBasicMaterial( { map: texture, overdraw: true } );
var material = new THREE.MeshBasicMaterial( { map: texture, overdraw: 0.5 } );
var mesh = new THREE.Mesh( geometry, material );
group.add( mesh );
......@@ -100,7 +100,7 @@
texture.needsUpdate = true;
var geometry = new THREE.PlaneGeometry( 300, 300, 3, 3 );
var material = new THREE.MeshBasicMaterial( { map: texture, overdraw: true } );
var material = new THREE.MeshBasicMaterial( { map: texture, overdraw: 0.5 } );
var mesh = new THREE.Mesh( geometry, material );
mesh.position.y = - 250;
......
......@@ -113,7 +113,7 @@
function loadTexture( path ) {
var texture = new THREE.Texture( texture_placeholder );
var material = new THREE.MeshBasicMaterial( { map: texture, overdraw: true } );
var material = new THREE.MeshBasicMaterial( { map: texture, overdraw: 0.5 } );
var image = new Image();
image.onload = function () {
......
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
此差异已折叠。
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册