added describe() to all 3d reference examples, resolving issue proces…

…sing#5705

src/webgl/3d_primitives.js

@@ -33,6 +33,8 @@ import * as constants from '../core/constants';
  *   background(200);
  *   plane(50, 50);
  * }
+ *
+ * describe('a white plane with black wireframe lines');
  * </code>
  * </div>
  *
@@ -120,6 +122,8 @@ p5.prototype.plane = function(width, height, detailX, detailY) {
  *   rotateY(frameCount * 0.01);
  *   box(50);
  * }
+ *
+ * describe('a white box rotating in 3D space');
  * </code>
  * </div>
  */
@@ -237,6 +241,8 @@ p5.prototype.box = function(width, height, depth, detailX, detailY) {
  *   background(205, 102, 94);
  *   sphere(40);
  * }
+ *
+ * describe('a white sphere with black wireframe lines');
  * </code>
  * </div>
  *
@@ -257,6 +263,10 @@ p5.prototype.box = function(width, height, depth, detailX, detailY) {
  *   rotateY(millis() / 1000);
  *   sphere(40, detailX.value(), 16);
  * }
+ *
+ * describe(
+ *   'a white sphere with low detail on the x-axis, including a slider to adjust detailX'
+ * );
  * </code>
  * </div>
  *
@@ -277,6 +287,10 @@ p5.prototype.box = function(width, height, depth, detailX, detailY) {
  *   rotateY(millis() / 1000);
  *   sphere(40, 16, detailY.value());
  * }
+ *
+ * describe(
+ *   'a white sphere with low detail on the y-axis, including a slider to adjust detailY'
+ * );
  * </code>
  * </div>
  */
@@ -449,6 +463,8 @@ const _truncatedCone = function(
  *   rotateZ(frameCount * 0.01);
  *   cylinder(20, 50);
  * }
+ *
+ * describe('a rotating white cylinder');
  * </code>
  * </div>
  *
@@ -469,6 +485,10 @@ const _truncatedCone = function(
  *   rotateY(millis() / 1000);
  *   cylinder(20, 75, detailX.value(), 1);
  * }
+ *
+ * describe(
+ *   'a rotating white cylinder with limited X detail, with a slider that adjusts detailX'
+ * );
  * </code>
  * </div>
  *
@@ -489,6 +509,10 @@ const _truncatedCone = function(
  *   rotateY(millis() / 1000);
  *   cylinder(20, 75, 16, detailY.value());
  * }
+ *
+ * describe(
+ *   'a rotating white cylinder with limited Y detail, with a slider that adjusts detailY'
+ * );
  * </code>
  * </div>
  */
@@ -584,6 +608,8 @@ p5.prototype.cylinder = function(
  *   rotateZ(frameCount * 0.01);
  *   cone(40, 70);
  * }
+ *
+ * describe('a rotating white cone');
  * </code>
  * </div>
  *
@@ -604,6 +630,10 @@ p5.prototype.cylinder = function(
  *   rotateY(millis() / 1000);
  *   cone(30, 65, detailX.value(), 16);
  * }
+ *
+ * describe(
+ *   'a rotating white cone with limited X detail, with a slider that adjusts detailX'
+ * );
  * </code>
  * </div>
  *
@@ -624,6 +654,10 @@ p5.prototype.cylinder = function(
  *   rotateY(millis() / 1000);
  *   cone(30, 65, 16, detailY.value());
  * }
+ *
+ * describe(
+ *   'a rotating white cone with limited Y detail, with a slider that adjusts detailY'
+ * );
  * </code>
  * </div>
  */
@@ -698,6 +732,8 @@ p5.prototype.cone = function(radius, height, detailX, detailY, cap) {
  *   background(205, 105, 94);
  *   ellipsoid(30, 40, 40);
  * }
+ *
+ * describe('a white 3d ellipsoid');
  * </code>
  * </div>
  *
@@ -718,6 +754,10 @@ p5.prototype.cone = function(radius, height, detailX, detailY, cap) {
  *   rotateY(millis() / 1000);
  *   ellipsoid(30, 40, 40, detailX.value(), 8);
  * }
+ *
+ * describe(
+ *   'a rotating white ellipsoid with limited X detail, with a slider that adjusts detailX'
+ * );
  * </code>
  * </div>
  *
@@ -738,6 +778,10 @@ p5.prototype.cone = function(radius, height, detailX, detailY, cap) {
  *   rotateY(millis() / 1000);
  *   ellipsoid(30, 40, 40, 12, detailY.value());
  * }
+ *
+ * describe(
+ *   'a rotating white ellipsoid with limited Y detail, with a slider that adjusts detailY'
+ * );
  * </code>
  * </div>
  */
@@ -834,6 +878,8 @@ p5.prototype.ellipsoid = function(radiusX, radiusY, radiusZ, detailX, detailY) {
  *   rotateY(frameCount * 0.01);
  *   torus(30, 15);
  * }
+ *
+ * describe('a rotating white torus');
  * </code>
  * </div>
  *
@@ -854,6 +900,10 @@ p5.prototype.ellipsoid = function(radiusX, radiusY, radiusZ, detailX, detailY) {
  *   rotateY(millis() / 1000);
  *   torus(30, 15, detailX.value(), 12);
  * }
+ *
+ * describe(
+ *   'a rotating white torus with limited X detail, with a slider that adjusts detailX'
+ * );
  * </code>
  * </div>
  *
@@ -874,6 +924,10 @@ p5.prototype.ellipsoid = function(radiusX, radiusY, radiusZ, detailX, detailY) {
  *   rotateY(millis() / 1000);
  *   torus(30, 15, 16, detailY.value());
  * }
+ *
+ * describe(
+ *   'a rotating white torus with limited Y detail, with a slider that adjusts detailY'
+ * );
  * </code>
  * </div>
  */

src/webgl/interaction.js

@@ -37,6 +37,7 @@ import * as constants from '../core/constants';
  *   rotateY(0.5);
  *   box(30, 50);
  * }
+ * describe('Camera orbits around a box when mouse is hold-clicked & then moved.');
  * </code>
  * </div>
  *
@@ -178,6 +179,9 @@ p5.prototype.orbitControl = function(sensitivityX, sensitivityY, sensitivityZ) {
  *     noDebugMode();
  *   }
  * }
+ * describe(
+ *   'a 3D box is centered on a grid in a 3D sketch. an icon indicates the direction of each axis: a red line points +X, a green line +Y, and a blue line +Z. the grid and icon disappear when the spacebar is pressed.'
+ * );
  * </code>
  * </div>
  * @alt
@@ -201,6 +205,8 @@ p5.prototype.orbitControl = function(sensitivityX, sensitivityY, sensitivityZ) {
  *   orbitControl();
  *   box(15, 30);
  * }
+ *
+ * describe('a 3D box is centered on a grid in a 3D sketch.');
  * </code>
  * </div>
  * @alt
@@ -221,6 +227,10 @@ p5.prototype.orbitControl = function(sensitivityX, sensitivityY, sensitivityZ) {
  *   orbitControl();
  *   box(15, 30);
  * }
+ *
+ * describe(
+ *   'a 3D box is centered in a 3D sketch. an icon indicates the direction of each axis: a red line points +X, a green line +Y, and a blue line +Z.'
+ * );
  * </code>
  * </div>
  * @alt
@@ -243,6 +253,8 @@ p5.prototype.orbitControl = function(sensitivityX, sensitivityY, sensitivityZ) {
  *   orbitControl();
  *   box(15, 30);
  * }
+ *
+ * describe('a 3D box is centered on a grid in a 3D sketch');
  * </code>
  * </div>
  * @alt
@@ -267,6 +279,10 @@ p5.prototype.orbitControl = function(sensitivityX, sensitivityY, sensitivityZ) {
  *   stroke(255, 0, 150);
  *   strokeWeight(0.8);
  * }
+ *
+ * describe(
+ *   'a 3D box is centered on a grid in a 3D sketch. an icon indicates the direction of each axis: a red line points +X, a green line +Y, and a blue line +Z.'
+ * );
  * </code>
  * </div>
  * @alt
@@ -372,6 +388,10 @@ p5.prototype.debugMode = function(...args) {
  *     noDebugMode();
  *   }
  * }
+ *
+ * describe(
+ *   'a 3D box is centered on a grid in a 3D sketch. an icon indicates the direction of each axis: a red line points +X, a green line +Y, and a blue line +Z. the grid and icon disappear when the spacebar is pressed.'
+ * );
  * </code>
  * </div>
  * @alt

src/webgl/light.js

@@ -44,6 +44,7 @@ import * as constants from '../core/constants';
  *   ambientMaterial(255, 127, 80); // coral material
  *   sphere(40);
  * }
+ * describe('sphere with coral color under black light');
  * </code>
  * </div>
  * @alt
@@ -62,6 +63,7 @@ import * as constants from '../core/constants';
  *   ambientMaterial(255, 127, 80); // coral material
  *   sphere(40);
  * }
+ * describe('sphere with coral color under white light');
  * </code>
  * </div>
  * @alt
@@ -172,6 +174,10 @@ p5.prototype.ambientLight = function(v1, v2, v3, a) {
  * function mouseClicked() {
  *   setRedSpecularColor = !setRedSpecularColor;
  * }
+ *
+ * describe(
+ *   'Sphere with specular highlight. Clicking the mouse toggles the specular highlight color between red and the default white.'
+ * );
  * </code>
  * </div>
  *
@@ -266,6 +272,9 @@ p5.prototype.specularColor = function(v1, v2, v3) {
  *   noStroke();
  *   sphere(40);
  * }
+ * describe(
+ *   'scene with sphere and directional light. The direction of the light is controlled with the mouse position.'
+ * );
  * </code>
  * </div>
  *
@@ -391,6 +400,9 @@ p5.prototype.directionalLight = function(v1, v2, v3, x, y, z) {
  *   noStroke();
  *   sphere(40);
  * }
+ * describe(
+ *   'scene with sphere and point light. The position of the light is controlled with the mouse position.'
+ * );
  * </code>
  * </div>
  *
@@ -490,6 +502,7 @@ p5.prototype.pointLight = function(v1, v2, v3, x, y, z) {
  *   rotateZ(millis() / 1000);
  *   box();
  * }
+ * describe('the light is partially ambient and partially directional');
  * </code>
  * </div>
  *
@@ -557,6 +570,9 @@ p5.prototype.lights = function() {
  *   sphere(20);
  *   pop();
  * }
+ * describe(
+ *   'Two spheres with different falloff values show different intensity of light'
+ * );
  * </code>
  * </div>
  *
@@ -672,6 +688,9 @@ p5.prototype.lightFalloff = function(
  *   noStroke();
  *   sphere(40);
  * }
+ * describe(
+ *   'scene with sphere and spot light. The position of the light is controlled with the mouse position.'
+ * );
  * </code>
  * </div>
  *
@@ -1005,6 +1024,9 @@ p5.prototype.spotLight = function(
  *   ambientMaterial(255);
  *   sphere(13);
  * }
+ * describe(
+ *   'Three white spheres. Each appears as a different color due to lighting.'
+ * );
  * </code>
  * </div>
  *

src/webgl/loading.js

@@ -58,6 +58,8 @@ import './p5.Geometry';
  *   rotateY(frameCount * 0.01);
  *   model(octahedron);
  * }
+ *
+ * describe('Vertically rotating 3-d octahedron.');
  * </code>
  * </div>
  *
@@ -87,6 +89,8 @@ import './p5.Geometry';
  *   normalMaterial(); // For effect
  *   model(teapot);
  * }
+ *
+ * describe('Vertically rotating 3-d teapot with red, green and blue gradient.');
  * </code>
  * </div>
  *
@@ -610,6 +614,8 @@ function parseASCIISTL(model, lines) {
  *   rotateY(frameCount * 0.01);
  *   model(octahedron);
  * }
+ *
+ * describe('Vertically rotating 3-d octahedron.');
  * </code>
  * </div>
  *