Browse Source

Documentation: Set 100char linewidths on Manual section.

Don McCurdy 7 years ago
parent
commit
d8bdec2de2

+ 9 - 9
docs/api/Polyfills.html

@@ -11,33 +11,33 @@
 
 		<h1>Polyfills</h1>
 
-		<div class="desc">Three.js includes polyfills for the following functions and constants.</div>
+		<p class="desc">Three.js includes polyfills for the following functions and constants.</p>
 
 		<h3>[page:Number.EPSILON Number.EPSILON]</h3>
-		<div>
+		<p>
 			 The difference between one and the smallest value greater than one that can be represented as a Number.
 			 [link:https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number/EPSILON MDN reference].
-		</div>
+		</p>
 
 		<h3>[page:Math.sign Math.sign]( [page:Number x] )</h3>
-		<div>
+		<p>
 			If the argument is a positive number, negative number, positive zero or negative zero,
 			the function will return 1, -1, 0 or -0 respectively. Otherwise, NaN is returned.
 			[link:https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/sign MDN reference].
-		</div>
+		</p>
 
 		<h3>[page:Function.prototype.name Function.prototype.name]( [page:Number x] )</h3>
-		<div>
+		<p>
 			Returns the name of a function, or (before ES6 implementations) an empty string for anonymous functions.
 			[link:https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/name MDN reference].
-		</div>
+		</p>
 
 		<h3>[page:Object.assign Object.assign]( [page:Object target], [page:Object ...sources] )</h3>
-		<div>
+		<p>
 			The Object.assign() method is used to copy the values of all enumerable own properties from one or more source objects to a target object.
 			It will return the target object.
 			[link:https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/assign MDN reference].
-		</div>
+		</p>
 
 		<h2>Source</h2>
 

+ 12 - 12
docs/api/renderers/webgl/WebGLProgram.html

@@ -10,7 +10,7 @@
 	<body>
 		<h1>[name]</h1>
 
-		<div class="desc">Constructor for the GLSL program sent to vertex and fragment shaders, including default uniforms and attributes.</div>
+		<p class="desc">Constructor for the GLSL program sent to vertex and fragment shaders, including default uniforms and attributes.</p>
 
 		<h2>Built-in uniforms and attributes</h2>
 
@@ -106,39 +106,39 @@
 		<h2>Constructor</h2>
 
 		<h3>[name]( [param:WebGLRenderer renderer], [param:Object code], [param:Material material], [param:Object parameters] )</h3>
-		<div>For parameters see [page:WebGLRenderer WebGLRenderer]</div>
+		<p>For parameters see [page:WebGLRenderer WebGLRenderer]</p>
 
 		<h2>Properties</h2>
 
 		<h3>[property:String id]</h3>
-		<div></div>
+		<p></p>
 
 		<h3>[property:String code]</h3>
-		<div></div>
+		<p></p>
 
 		<h3>[property:Integer usedTimes]</h3>
-		<div></div>
+		<p></p>
 
 		<h3>[property:Object program]</h3>
-		<div></div>
+		<p></p>
 
 		<h3>[property:WebGLShader vertexShader]</h3>
-		<div></div>
+		<p></p>
 
 		<h3>[property:WebGLShader fragmentShader]</h3>
-		<div></div>
+		<p></p>
 
 		<h2>Methods</h2>
 
 		<h3>[method:Object getUniforms]()</h3>
-		<div>
+		<p>
 		Returns a name-value mapping of all active uniform locations.
-		</div>
+		</p>
 
 		<h3>[method:Object getAttributes]()</h3>
-		<div>
+		<p>
 		Returns a name-value mapping of all active vertex attribute locations.
-		</div>
+		</p>
 
 		<h2>Source</h2>
 

+ 5 - 5
docs/api/renderers/webgl/WebGLShader.html

@@ -10,7 +10,7 @@
 	<body>
 		<h1>[name]</h1>
 
-		<div class="desc">A lower level function to compile either a vertex or fragment shader.</div>
+		<p class="desc">A lower level function to compile either a vertex or fragment shader.</p>
 
 		<h2>Example</h2>
 
@@ -32,15 +32,15 @@
 
 		<h3>[page:WebGLShader objects]([page:WebGLContext gl], [page:WebGLEnum type], [page:String source])</h3>
 
-		<div>
+		<p>
 		gl -- The current WebGL context
 		type -- The WebGL type, either gl.VERTEX_SHADER or gl.FRAGMENT_SHADER
 		source -- The source code for the shader
-		</div>
-		<div>
+		</p>
+		<p>
 		This will compile an individual shader, but won't link it to be a complete [page:WebGLProgram]. Note: this
 		is a function so the new operator should not be used.
-		</div>
+		</p>
 
 		<h2>Source</h2>
 

+ 17 - 17
docs/api/renderers/webgl/WebGLState.html

@@ -10,47 +10,47 @@
 	<body>
 		<h1>[name]</h1>
 
-		<div class="desc"></div>
+		<p class="desc"></p>
 
 
 		<h2>Methods</h2>
 
 		<h3>[method:null enable]( [param:integer id], [param:boolean boolean] )</h3>
-		<div>
+		<p>
 		TODO
-		</div>
+		</p>
 
 		<h3>[method:null disable]( [param:integer id], [param:boolean boolean] )</h3>
-		<div>
+		<p>
 		TODO
-		</div>
+		</p>
 
 		<h3>[method:null setDepthTest]( [param:boolean depthTest] )</h3>
-		<div>
+		<p>
 		depthTest -- The boolean to decide if depth of a fragment needs to be tested against the depth buffer . <br />
-		</div>
-		<div>
+		</p>
+		<p>
 		This sets, based on depthTest, whether or not the depth data needs to be tested against the depth buffer.
-		</div>
+		</p>
 
 		<h3>[method:null setDepthWrite]( [param:boolean depthWrite] )</h3>
-		<div>
+		<p>
 		depthWrite -- The boolean to decide if depth of a fragment needs to be kept. <br />
-		</div>
-		<div>
+		</p>
+		<p>
 		This sets, based on depthWrite, whether or not the depth data needs to be written in the depth buffer.
-		</div>
+		</p>
 
 		<h3>[method:null setBlending]( [param:number blending], [param:number blendEquation], [param:number blendSrc], [param:number blendDst] )</h3>
-		<div>
+		<p>
 		blending -- A number indicating the blending mode. Possible value are THREE.NoBlending, THREE.NormalBlending, THREE.AdditiveBlending, THREE.SubtractiveBlending, THREE.MultiplyBlending or THREE.CustomBlending <br />
 		blendEquation -- When blending is THREE.CustomBlending, then you can set the blendEquation. Possible values are THREE.AddEquation, THREE.SubtractEquation or THREE.ReverseSubtractEquation.<br />
 		blendSrc -- When blending is THREE.CustomBlending, then you can set the blendSrc. Possible values are THREE.ZeroFactor, THREE.OneFactor,THREE.SrcColorFactor, THREE.OneMinusSrcColorFactor, THREE.SrcAlphaFactor, THREE.OneMinusSrcAlphaFactor, THREE.DstAlphaFactor, THREE.OneMinusDstAlphaFactor, THREE.DstColorFactor,THREE.OneMinusDstColorFactor or THREE.SrcAlphaSaturateFactor<br />
 		blendDst -- When blending is THREE.CustomBlending, then you can set the blendDst. Possible values are THREE.ZeroFactor, THREE.OneFactor,THREE.SrcColorFactor, THREE.OneMinusSrcColorFactor, THREE.SrcAlphaFactor, THREE.OneMinusSrcAlphaFactor, THREE.DstAlphaFactor, THREE.OneMinusDstAlphaFactor, THREE.DstColorFactor,THREE.OneMinusDstColorFactor or THREE.SrcAlphaSaturateFactor
-		</div>
-		<div>
+		</p>
+		<p>
 		This method sets the correct blending.
-		</div>
+		</p>
 
 
 		<h2>Source</h2>

+ 7 - 7
docs/api/renderers/webgl/plugins/SpritePlugin.html

@@ -10,27 +10,27 @@
 	<body>
 		<h1>[name]</h1>
 
-		<div class="desc">The Webglrenderer plugin class that allows Sprites to be rendered in the WebglRenderer. This plugin is automatically loaded in the Webglrenderer.</div>
+		<p class="desc">The Webglrenderer plugin class that allows Sprites to be rendered in the WebglRenderer. This plugin is automatically loaded in the Webglrenderer.</p>
 
 
 		<h2>Constructor</h2>
 
 		<h3>[name]()</h3>
-		<div>
+		<p>
 		Creates a new [name].
-		</div>
+		</p>
 
 
 		<h2>Methods</h2>
 
 		<h3>[method:null render]( [param:Scene scene], [param:Camera camera] )</h3>
-		<div>
+		<p>
 		scene -- The scene to render. <br />
 		camera -- The camera to render.
-		</div>
-		<div>
+		</p>
+		<p>
 		Renders the sprites defined in the scene. This gets automatically called as post-render function to draw the lensflares.
-		</div>
+		</p>
 
 		<h2>Source</h2>
 

+ 10 - 8
docs/manual/buildTools/Testing-with-NPM.html

@@ -10,15 +10,15 @@
 	<body>
 		<h1>[name]</h1>
 
-		<div class="desc">
+		<p class="desc">
 			This article shows how to get three.js into a [link:https://nodejs.org/en/ node.js] environment so that you
 			can execute automated tests. Tests can be run on the command line, or by automated
 			CI tools like [link:https://travis-ci.org/ Travis].
-		</div>
+		</p>
 
 		<h2>The short version</h2>
 
-		<div>
+		<p>
 			If you're comfortable with node and npm,
 			<code>
 				$ npm install three --save-dev
@@ -28,13 +28,13 @@
 			var THREE = require('three');
 		</code>
 			to your test.
-		</div>
+		</p>
 
 		<h2>Create a testable project from scratch</h2>
-		<div>
+		<p>
 			If you're not familiar with these tools, here's a quick guide (for linux, the installation process
 			will be slightly different using windows, but the NPM commands are identical).
-		</div>
+		</p>
 
 		<h3>Basic setup</h3>
 		<div>
@@ -200,8 +200,10 @@ The THREE object should be able to construct a Vector3 with default of x=0: 0ms
 				</li>
 			</ol>
 
-			Items 2 and 3 will vary depending on how you manage your code. In the example of Physics.js
-		  given above, the export part is right at the end. We assign an object to module.exports:
+			<p>
+				Items 2 and 3 will vary depending on how you manage your code. In the example of Physics.js
+		  	given above, the export part is right at the end. We assign an object to module.exports:
+			</p>
 			<code>
 //=============================================================================
 // make available in nodejs

+ 16 - 16
docs/manual/introduction/Animation-system.html

@@ -12,7 +12,7 @@
 
 		<h2>Overview</h2>
 
-		<div class="desc">
+		<p class="desc">
 			Within the three.js animation system you can animate various properties of your models:
 			the bones of a [page:SkinnedMesh skinned and rigged model],
 			[page:Geometry.morphTargets morph targets], different material properties (colors,
@@ -28,11 +28,11 @@
 			Unity/Unreal Engine 4. This page gives a short overview of the main components of the
 			system and how they work together.
 
-		</div>
+		</p>
 
 		<h3>Animation Clips</h3>
 
-		<div class="desc">
+		<p class="desc">
 
 			If you have successfully imported an animated 3D object (it doesn't matter if it has
 			bones or morph targets or both) - for example exporting it from Blender with the
@@ -45,11 +45,11 @@
 			mesh is a character, for example, there may be one AnimationClip for a walkcycle, a second
 			for a jump, a third for sidestepping and so on.
 
-		</div>
+		</p>
 
 		<h3>Keyframe Tracks</h3>
 
-		<div class="desc">
+		<p class="desc">
 
 			Inside of such an *AnimationClip* the data for each animated property are stored in a
 			separate [page:KeyframeTrack]. Assumed a character object has a [page:Skeleton skeleton],
@@ -63,22 +63,22 @@
 			information as to how the [page:Mesh.morphTargetInfluences influence] of a certain morph
 			target changes during the performance of the clip.
 
-		</div>
+		</p>
 
 		<h3>Animation Mixer</h3>
 
-		<div class="desc">
+		<p class="desc">
 
 			The stored data form only the basis for the animations - actual playback is controlled by
 			the [page:AnimationMixer]. You can imagine this not only as a player for animations, but
 			as a simulation of a hardware like a real mixer console, which can control several animations
 			simultaneously, blending and merging them.
 
-		</div>
+		</p>
 
 		<h3>Animation Actions</h3>
 
-		<div class="desc">
+		<p class="desc">
 
 			The *AnimationMixer* itself has only very few (general) properties and methods, because it
 			can be controlled by the [page:AnimationAction AnimationActions]. By configuring an
@@ -87,24 +87,24 @@
 			shall be performed with a fade or a time scaling, and some additional things, such crossfading
 			or synchronizing.
 
-		</div>
+		</p>
 
 		<h3>Animation Object Groups</h3>
 
-		<div class="desc">
+		<p class="desc">
 
 			If you want a group of objects to receive a shared animation state, you can use an
 			[page:AnimationObjectGroup].
 
-		</div>
+		</p>
 
 		<h3>Supported Formats and Loaders</h3>
 
-		<div class="desc">
+		<p class="desc">
 			Note that not all model formats include animation (OBJ notably does not), and that only some
 			three.js loaders support [page:AnimationClip AnimationClip] sequences. Several that <i>do</i>
 			support this animation type:
-		</div>
+		</p>
 
 			<ul>
 				<li>[page:JSONLoader THREE.JSONLoader]</li>
@@ -117,10 +117,10 @@
 				<li>THREE.SEA3DLoader</li>
 			</ul>
 
-		<div class="desc">
+		<p class="desc">
 			Note that 3ds max and Maya currently can't export multiple animations (meaning animations which are not
 			on the same timeline) directly to a single file.
-		</div>
+		</p>
 
 		<h2>Example</h2>
 

+ 2 - 2
docs/manual/introduction/Code-style-guide.html

@@ -10,13 +10,13 @@
 	<body>
 		<h1>[name]</a></h1>
 
-		<div class="desc">
+		<p class="desc">
 			All code and examples in three.js are written using Mr.doob's Code Style.
 			Of course you are free to use whatever style you prefer for your own work, but
 			if you are adding code to the library or examples then you must follow this guide.<br /><br />
 
 			You can find details
 			<a href="https://github.com/mrdoob/three.js/wiki/Mr.doob%27s-Code-Style%E2%84%A2" target="_blank">here</a>.
-		</div>
+		</p>
 	</body>
 </html>

+ 6 - 6
docs/manual/introduction/FAQ.html

@@ -26,13 +26,13 @@
 
 				<p>These tags control viewport size and scale for mobile browsers (where page content may be rendered at different size than visible viewport).</p>
 
-				<p><a href="http://developer.apple.com/library/safari/#documentation/AppleApplications/Reference/SafariWebContent/UsingtheViewport/UsingtheViewport.html">http://developer.apple.com/library/safari/#documentation/AppleApplications/Reference/SafariWebContent/UsingtheViewport/UsingtheViewport.html</a></p>
+				<p><a href="https://developer.apple.com/library/content/documentation/AppleApplications/Reference/SafariWebContent/UsingtheViewport/UsingtheViewport.html">Safari: Using the Viewport</a></p>
 
-				<p><a href="https://developer.mozilla.org/en/Mobile/Viewport_meta_tag">https://developer.mozilla.org/en/Mobile/Viewport_meta_tag</a></p>
+				<p><a href="https://developer.mozilla.org/en/Mobile/Viewport_meta_tag">MDN: Using the viewport meta tag</a></p>
 		</div>
 
 		<h2>How can scene scale be preserved on resize?</h2>
-		<div>
+		<p>
 			We want all objects, regardless of their distance from the camera, to appear the same size, even as the window is resized.
 
 			The key equation to solving this is this formula for the visible height at a given distance:
@@ -45,12 +45,12 @@ visible_height = 2 * Math.tan( ( Math.PI / 180 ) * camera.fov / 2 ) * distance_f
 
 			This can not be done by changing the camera position. Instead you have to change the camera field-of-view.
 			[link:http://jsfiddle.net/Q4Jpu/ Example].
-		</div>
+		</p>
 
 		<h2>Why is part of my object invisible?</h2>
-		<div>
+		<p>
 			This could be because of face culling. Faces have an orientation that  decides which side is which. And the culling removes the backside in normal circumstances. To see if this is your problem, change the material side to THREE.DoubleSide.
 			<code>material.side = THREE.DoubleSide</code>
-		</div>
+		</p>
 	</body>
 </html>

+ 2 - 2
docs/manual/introduction/How-to-run-things-locally.html

@@ -9,11 +9,11 @@
 	</head>
 	<body>
 		<h1>[name]</h1>
-		<div>
+		<p>
 			If you use just procedural geometries and don't load any textures, webpages should work
 			straight from the file system, just double-click on HTML file in a file manager and it
 			should appear working in the browser (you'll see <em>file:///yourFile.html</em> in the address bar).
-		</div>
+		</p>
 
 		<h2>Content loaded from external files</h2>
 		<div>

+ 13 - 13
docs/manual/introduction/Import-via-modules.html

@@ -10,28 +10,28 @@
 	<body>
 		<h1>[name]</h1><br />
 
-		<div>
+		<p>
 			While importing three.js via script tags is a great way to get up and running fast, it has a few drawbacks for longer lived projects, for example:
 			<ul>
 				<li>You have to manually fetch and include a copy of the library as part of your project's source code</li>
 				<li>Updating the library's version is a manual process</li>
 				<li>When checking in a new version of the library your version control diffs are cluttered by the many lines of the build file</li>
 			</ul>
-		</div>
+		</p>
 
-		<div>Using a dependency manager like npm avoids these caveats by allowing you to simply download and import your desired version of the library onto your machine.</div>
+		<p>Using a dependency manager like npm avoids these caveats by allowing you to simply download and import your desired version of the library onto your machine.</p>
 
 		<h2>Installation via npm</h2>
 
-		<div>Three.js is published as an npm module, see: <a href="https://www.npmjs.com/package/three" target="_blank">npm</a>. This means all you need to do to include three.js into your project is run "npm install three"</div>
+		<p>Three.js is published as an npm module, see: <a href="https://www.npmjs.com/package/three" target="_blank">npm</a>. This means all you need to do to include three.js into your project is run "npm install three"</p>
 
 		<h2>Importing the module</h2>
 
-		<div>Assuming that you're bundling your files with a tool such as <a href="https://webpack.github.io/" target="_blank">Webpack</a> or <a href="https://github.com/substack/node-browserify" target="_blank">Browserify</a>, which allow you to "require('modules') in the browser by bundling up all of your dependencies."</div>
+		<p>Assuming that you're bundling your files with a tool such as <a href="https://webpack.github.io/" target="_blank">Webpack</a> or <a href="https://github.com/substack/node-browserify" target="_blank">Browserify</a>, which allow you to "require('modules') in the browser by bundling up all of your dependencies."</p>
 
-		<div>
+		<p>
 			You should now be able to import the module into your source files and continue to use it as per normal.
-		</div>
+		</p>
 
 		<code>
 		var THREE = require('three');
@@ -40,9 +40,9 @@
 		...
 		</code>
 
-		<div>
+		<p>
 			You're also able to leverage <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/import" target="_blank">ES6 import syntax</a>:
-		</div>
+		</p>
 
 		<code>
 		import * as THREE from 'three';
@@ -51,9 +51,9 @@
 		...
 		</code>
 
-		<div>
+		<p>
 			or if you wish to import only select parts of three.js library, for example Scene:
-		</div>
+		</p>
 
 		<code>
 		import { Scene } from 'three';
@@ -64,9 +64,9 @@
 
 		<h2>Caveats</h2>
 
-		<div>
+		<p>
 			Currently it's not possible to import the files within the "examples/js" directory in this way.
 			This is due to some of the files relying on global namespace pollution of THREE. For more information see <a href="https://github.com/mrdoob/three.js/issues/9562" target="_blank">Transform `examples/js` to support modules #9562</a>.
-		</div>
+		</p>
 	</body>
 </html>

+ 2 - 2
docs/manual/introduction/Migration-guide.html

@@ -10,11 +10,11 @@
 	<body>
 		<h1>[name]</a></h1>
 
-		<div class="desc">
+		<p class="desc">
 			The migration guide is maintained on the [link:https://github.com/mrdoob/three.js/wiki wiki].
 			It contains a list of changes for each version of three.js going back to r45.<br /><br />
 
 			You can find it [link:https://github.com/mrdoob/three.js/wiki/Migration-Guide here].
-		</div>
+		</p>
 	</body>
 </html>

+ 6 - 6
docs/manual/introduction/Useful-links.html

@@ -10,7 +10,7 @@
 	<body>
 		<h1>[name]</h1><br />
 
-		<div class="desc">
+		<p class="desc">
 			The following is a collection of links that you might find useful when learning three.js.<br />
 			If you find something that you'd like to add here, or think that one of the links below is no longer
 			relevant or working, feel free to click the 'edit' button in the top right and make some changes!<br /><br />
@@ -21,13 +21,13 @@
 
 			In addition to this page, mrdoob maintains a collection of links related to three.js over on Google+.
 			Check them out <a href="https://plus.google.com/+ThreejsOrg">here</a>.
-		</div>
+		</p>
 
 		<h2>Help forums</h2>
-		<div>
+		<p>
 			Three.js officially uses [link:http://stackoverflow.com/tags/three.js/info Stack Overflow] for help requests.
 			If you need assistance with something, that's the place to go. Do NOT open an issue on Github for help requests.
-		</div>
+		</p>
 
 		<h2>Tutorials and courses</h2>
 
@@ -128,10 +128,10 @@
 	 </ul>
 
 	 <h2>Old Links</h2>
-	 <div>
+	 <p>
 		These links are kept for historical purposes - you may still find them useful, but be warned that
 		they may have information relating to very old versions of three.js.
-	 </div>
+	 </p>
 
 	 <ul>
 		<li>

+ 2 - 2
docs/page.css

@@ -45,7 +45,7 @@ h3 {
 	margin-top: 40px;
 }
 
-p {
+p, ul, ol {
 	margin-top: 0;
 	margin-bottom: 20px;
 	max-width: 780px;
@@ -56,7 +56,7 @@ div {
 	margin-bottom: 20px;
 }
 
-div.desc {
+.desc {
 	padding-left: 0px;
 }