diff --git a/repo_assets/wiki/02_Usage.md b/repo_assets/wiki/02_Usage.md index 12ec367..eddf350 100644 --- a/repo_assets/wiki/02_Usage.md +++ b/repo_assets/wiki/02_Usage.md @@ -222,7 +222,7 @@ Adds a gradient/pattern-based ASCII conversion layer to the rendering pipeline. #### Example -work-in-progress! As of now, please refer to the following demo sketch from the p5.asciify examples folder: [`gradient_patterns`](#) +work-in-progress! As of now, please refer to the following demo sketch in the p5.js web editor: [`p5.asciify | gradients test`](https://editor.p5js.org/humanbydefinition/sketches/_hg3L2cKk)
@@ -246,7 +246,7 @@ Removes a gradient/pattern-based ASCII conversion layer from the rendering pipel #### Example -work-in-progress! As of now, please refer to the following demo sketch from the p5.asciify examples folder: [`gradient_patterns`](#) +work-in-progress! As of now, please refer to the following demo sketch in the p5.js web editor: [`p5.asciify | gradients test`](https://editor.p5js.org/humanbydefinition/sketches/_hg3L2cKk)
diff --git a/tests/gradients/sketch.js b/tests/gradients/sketch.js index 373ad6a..792357f 100644 --- a/tests/gradients/sketch.js +++ b/tests/gradients/sketch.js @@ -20,8 +20,8 @@ let gridCols = 3; let fillColors = [ [150, 160, 170], [180, 190, 200], - [210, 220, 230] -] + [210, 220, 230], +]; function setup() { createCanvas(windowWidth, windowHeight, WEBGL); @@ -35,7 +35,7 @@ function setup() { renderMode: "brightness", enabled: true, characterColorMode: 0, - characters: "-" + characters: ".", }, edge: { enabled: true, @@ -48,15 +48,35 @@ function setup() { characterColorMode: 1, characterColor: "#ff0000", invertMode: true, - } + }, }); - linearGradient = addAsciiGradient("linear", 150, 150, "gradients ", { direction: 1, angle: 0, speed: 0.1 }); - spiralGradient = addAsciiGradient("spiral", 160, 160, "are ", { direction: 1, speed: 0.01, density: 0.5 }); - radialGradient = addAsciiGradient("radial", 170, 170, "now ", { direction: -1, radius: 1.0 }); - zigzagGradient = addAsciiGradient("zigzag", 180, 180, "available ", { direction: 1, speed: 0.1 }); - conicalGradient = addAsciiGradient("conical", 190, 190, "in ", { speed: 0.01 }); - noiseGradient = addAsciiGradient("noise", 210, 240, "p5.asciify ", { noiseScale: 0.5, speed: 0.1, direction: 1 }); + linearGradient = addAsciiGradient("linear", 150, 150, "gradients ", { + direction: 1, + angle: 0, + speed: 0.1, + }); + spiralGradient = addAsciiGradient("spiral", 160, 160, "are ", { + direction: 1, + speed: 0.01, + density: 0.5, + }); + radialGradient = addAsciiGradient("radial", 170, 170, "now ", { + direction: -1, + radius: 1.0, + }); + zigzagGradient = addAsciiGradient("zigzag", 180, 180, "available ", { + direction: 1, + speed: 0.1, + }); + conicalGradient = addAsciiGradient("conical", 190, 190, "in ", { + speed: 0.01, + }); + noiseGradient = addAsciiGradient("noise", 210, 240, "p5.asciify ", { + noiseScale: 0.5, + speed: 0.1, + direction: 1, + }); } function getFillColor(row, col) { @@ -76,7 +96,12 @@ function draw() { for (let col = 0; col < gridCols; col++) { let fillColor = getFillColor(row, col); fill(fillColor); - rect(-windowWidth / 2 + col * rectWidth, -windowHeight / 2 + row * rectHeight, rectWidth, rectHeight); + rect( + -windowWidth / 2 + col * rectWidth, + -windowHeight / 2 + row * rectHeight, + rectWidth, + rectHeight + ); } } @@ -108,4 +133,4 @@ function draw() { function windowResized() { resizeCanvas(windowWidth, windowHeight); -} \ No newline at end of file +}