Przeglądaj źródła

Documentation: Some more layout tweaks and deeplink improvements.

Mr.doob 13 lat temu
rodzic
commit
bbca893155

+ 8 - 8
docs/api/cameras/Camera.html

@@ -1,27 +1,27 @@
-<h1>Camera &larr; [page:Object3D]</h1>
+<h1>[name] &larr; [page:Object3D]</h1>
 
-<div>Abstract base class for cameras.</div>
+<div class="desc">Abstract base class for cameras.</div>
 
 
 <h2>Constructor</h2>
 
-<h3>Camera()</h3>
+<h3>[name]()</h3>
 
 
 <h2>Properties</h2>
 
-<h3>matrixWorldInverse [page:Matrix4]</h3>
+<h3>.matrixWorldInverse [page:Matrix4]</h3>
 
-<h3>projectionMatrix [page:Matrix4]</h3>
+<h3>.projectionMatrix [page:Matrix4]</h3>
 
-<h3>projectionMatrixInverse [page:Matrix4]</h3>
+<h3>.projectionMatrixInverse [page:Matrix4]</h3>
 
 
 <h2>Methods</h2>
 
-<h3>lookAt( vector [page:Vector3] )</h3>
+<h3>.lookAt( vector [page:Vector3] )</h3>
 <div>
-Orient camera to look at Vector3()
+vector — point to look at<br />
 </div>
 
 

+ 0 - 39
docs/api/cameras/Camera.rst

@@ -1,39 +0,0 @@
-Camera - Abstract base class for cameras
-----------------------------------------
-
-.. ...............................................................................
-.. rubric:: Constructor
-.. ...............................................................................
-
-.. class:: Camera()
-
-    Abstract base class for cameras
-
-    Inherits from :class:`Object3D`
-
-
-.. ...............................................................................
-.. rubric:: Attributes
-.. ...............................................................................
-
-.. attribute:: Camera.matrixWorldInverse
-
-    :class:`Matrix4`
-
-.. attribute:: Camera.projectionMatrix
-
-    :class:`Matrix4`
-
-.. attribute:: Camera.projectionMatrixInverse
-
-    :class:`Matrix4`
-
-
-
-.. ...............................................................................
-.. rubric:: Methods
-.. ...............................................................................
-
-.. function:: Camera.lookAt( vector )
-
-    Orient camera to look at :class:`Vector3`

+ 37 - 12
docs/api/cameras/PerspectiveCamera.html

@@ -1,6 +1,7 @@
-<h1>PerspectiveCamera &larr; [page:Camera] &larr; [page:Object3D]</h1>
+<h1>[name] &larr; [page:Camera] &larr; [page:Object3D]</h1>
+
+<div class="desc">Camera with perspective projection.</div>
 
-<div>Camera with perspective projection.</div>
 
 <h2>Example</h2>
 
@@ -8,38 +9,61 @@
 scene.add( camera );
 </code>
 
+
 <h2>Constructor</h2>
 
-<h3>PerspectiveCamera( fov [page:Number], aspect [page:Number], near [page:Number], far [page:Number] )</h3>
+<h3>[name]( fov [page:Number], aspect [page:Number], near [page:Number], far [page:Number] )</h3>
+<div>
+fov — camera frustum vertical field of view.<br />
+aspect — camera frustum aspect ratio.<br />
+near — camera frustum near plane.<br />
+far — camera frustum far plane.
+</div>
 
 
 <h2>Properties</h2>
 
-<h3>fov [page:Number]</h3>
+<h3>.fov [page:Number]</h3>
 <div>Camera frustum vertical field of view.</div>
 
-<h3>aspect [page:Number]</h3>
+<h3>.aspect [page:Number]</h3>
 <div>Camera frustum aspect ratio.</div>
 
-<h3>near [page:Number]</h3>
+<h3>.near [page:Number]</h3>
 <div>Camera frustum near plane.</div>
 
-<h3>far [page:Number]</h3>
+<h3>.far [page:Number]</h3>
 <div>Camera frustum far plane.</div>
 
 
 <h2>Methods</h2>
 
-<h3>setLens( focalLength [page:Number], frameSize [page:Number] )</h3>
+<h3>.setLens( focalLength [page:Number], frameSize [page:Number] )</h3>
+<div>
+focalLength — focal length<br />
+frameSize — frame size
+</div>
+
 <div>
 Uses focal length (in mm) to estimate and set FOV 35mm (fullframe) camera is used if frame size is not specified.<br />
 Formula based on <a href="http://www.bobatkins.com/photography/technical/field_of_view.html" target="_blank">http://www.bobatkins.com/photography/technical/field_of_view.html</a>
 </div>
 
-<h3>setViewOffset( fullWidth [page:Number], fullHeight [page:Number], x [page:Number], y [page:Number], width [page:Number], height [page:Number] )</h3>
+<h3>.setViewOffset( fullWidth [page:Number], fullHeight [page:Number], x [page:Number], y [page:Number], width [page:Number], height [page:Number] )</h3>
 <div>
-Sets an offset in a larger frustum. This is useful for multi-window or multi-monitor/multi-machine setups.<br /><br />
+fullWidth — full width of multiview setup<br />
+fullHeight — full height of multiview setup<br />
+x — horizontal offset of subcamera<br />
+y — vertical offset of subcamera<br />
+width — width of subcamera<br />
+height — height of subcamera
+</div>
+
+<div>
+Sets an offset in a larger frustum. This is useful for multi-window or multi-monitor/multi-machine setups.
+</div>
 
+<div>
 For example, if you have 3x2 monitors and each monitor is 1920x1080 and the monitors are in grid like this:<br />
 
 <pre>+---+---+---+
@@ -73,11 +97,12 @@ camera.setOffset( fullWidth, fullHeight, w * 2, h * 1, w, h );
 Note there is no reason monitors have to be the same size or in a grid.
 </div>
 
-<h3>updateProjectionMatrix()</h3>
+<h3>.updateProjectionMatrix()</h3>
 <div>
-Updates camera's projection matrix. Must be called after change of parameters.
+Updates the camera projection matrix. Must be called after change of parameters.
 </div>
 
+
 <h2>Source</h2>
 
 <div><a href="https://github.com/mrdoob/three.js/blob/master/src/[path].js" target="_blank">src/[path].js</a></div>

+ 0 - 125
docs/api/cameras/PerspectiveCamera.rst

@@ -1,125 +0,0 @@
-PerspectiveCamera - Camera with perspective projection
----------------------------------------------------------
-
-.. ...............................................................................
-.. rubric:: Constructor
-.. ...............................................................................
-
-.. class:: PerspectiveCamera( fov, aspect, near, far )
-
-    Camera with perspective projection
-
-    Part of scene graph
-
-    Inherits from :class:`Object3D` :class:`Camera`
-
-    :param float fov: field of view
-    :param float aspect: aspect ratio
-    :param float near: near
-    :param float far: far
-
-
-.. ...............................................................................
-.. rubric:: Attributes
-.. ...............................................................................
-
-.. attribute:: PerspectiveCamera.fov
-
-    Camera frustum vertical field of view
-
-.. attribute:: PerspectiveCamera.aspect
-
-    Camera frustum aspect ratio
-
-.. attribute:: PerspectiveCamera.near
-
-    Camera frustum near plane
-
-.. attribute:: PerspectiveCamera.far
-
-    Camera frustum far plane
-
-.. ...............................................................................
-.. rubric:: Multi-view attributes
-.. ...............................................................................
-
-.. attribute:: PerspectiveCamera.fullWidth
-.. attribute:: PerspectiveCamera.fullHeight
-.. attribute:: PerspectiveCamera.x
-.. attribute:: PerspectiveCamera.y
-.. attribute:: PerspectiveCamera.width
-.. attribute:: PerspectiveCamera.height
-
-
-.. ...............................................................................
-.. rubric:: Methods
-.. ...............................................................................
-
-.. function:: PerspectiveCamera.updateProjectionMatrix()
-
-    Updates camera's projection matrix. Must be called after change of parameters.
-
-.. function:: PerspectiveCamera.setLens ( focalLength, frameSize )
-
-    Uses focal length (in mm) to estimate and set FOV
-    35mm (fullframe) camera is used if frame size is not specified.
-
-    Formula based on http://www.bobatkins.com/photography/technical/field_of_view.html
-
-    :param float focalLength: focal length
-    :param float frameSize: frame size
-
-.. function:: PerspectiveCamera.setViewOffset ( fullWidth, fullHeight, x, y, width, height )
-
-    Sets an offset in a larger frustum. This is useful for multi-window or
-    multi-monitor/multi-machine setups.
-
-    For example, if you have 3x2 monitors and each monitor is 1920x1080 and
-    the monitors are in grid like this:
-
-    +---+---+---+
-    | A | B | C |
-    +---+---+---+
-    | D | E | F |
-    +---+---+---+
-
-    then for each monitor you would call it like this:
-
-    ::
-
-        var w = 1920;
-        var h = 1080;
-        var fullWidth = w * 3;
-        var fullHeight = h * 2;
-
-        // --A--
-        camera.setOffset( fullWidth, fullHeight, w * 0, h * 0, w, h );
-        //--B--
-        camera.setOffset( fullWidth, fullHeight, w * 1, h * 0, w, h );
-        //--C--
-        camera.setOffset( fullWidth, fullHeight, w * 2, h * 0, w, h );
-        //--D--
-        camera.setOffset( fullWidth, fullHeight, w * 0, h * 1, w, h );
-        //--E--
-        camera.setOffset( fullWidth, fullHeight, w * 1, h * 1, w, h );
-        //--F--
-        camera.setOffset( fullWidth, fullHeight, w * 2, h * 1, w, h );
-
-    Note there is no reason monitors have to be the same size or in a grid.
-
-    :param float fullWidth: full width of multi-view setup
-    :param float fullHeight: full height of multi-view setup
-    :param float x: x-offset of subcamera
-    :param float y: y-offset of subcamera
-    :param float width: width of subcamera
-    :param float height: height of subcamera
-
-
-.. ...............................................................................
-.. rubric:: Example
-.. ...............................................................................
-
-::
-
-    var camera = new THREE.PerspectiveCamera( 45, window.innerWidth / window.innerHeight, 1, 1000 );
-    scene.add( camera );

+ 17 - 10
docs/index.html

@@ -47,18 +47,27 @@
 				}
 
 				#viewer h2 {
-					color: #999;
+					color: #8B2;
 					font-size: 18px;
 					margin-top: 40px;
 				}
 
 				#viewer h3 {
+					color: #000;
 					font-size: 16px;
 					margin-top: 30px;
+					font-weight: normal;
 				}
 
 				#viewer div {
 					padding-left: 30px;
+					margin-bottom: 20px;
+				}
+
+				#viewer div.desc {
+
+					padding-left: 0px;
+
 				}
 
 				#viewer pre, code {
@@ -297,7 +306,7 @@
 
 					var page = list[ category ][ i ];
 					pages[ page.name ] = page.path;
-					html += '<li><a href="javascript:goTo(\'' + page.path + '\')">' + page.name + '</a></li>';
+					html += '<li><a href="javascript:goTo(\'' + page.name + '\')">' + page.name + '</a></li>';
 
 				}
 
@@ -309,11 +318,12 @@
 
 			// Page loading
 
-			function goTo( path ) {
+			function goTo( name ) {
 
-				viewer.innerHTML = '';
+				var path = pages[ name ];
 
-				window.location.hash = path
+				window.location.hash = name;
+				viewer.innerHTML = '';
 
 				var xhr = new XMLHttpRequest();
 				xhr.open( 'GET', 'api/' + path + '.html', true );
@@ -323,12 +333,9 @@
 
 						var text = xhr.responseText;
 						
+						text = text.replace(/\[name\]/gi, name);
 						text = text.replace(/\[path\]/gi, path);
-						text = text.replace(/\[page:(\w+)\]/gi, function ( str, p1 ) {
-
-							return "<a href=\"javascript:goTo('" + pages[ p1 ] + "')\">" + p1 + "</a>";
-
-						} );
+						text = text.replace(/\[page:(\w+)\]/gi, "<a href=\"javascript:goTo('$1')\">$1</a>" );
 
 						viewer.innerHTML = text + '<br>';