Add sketch 5, "glow lines"

Fix an issue with the displacement fragment shader
This commit is contained in:
Joshua Seigler 2019-11-12 13:57:51 -05:00
parent 1d2c6aa16a
commit d8538524a8
8 changed files with 313 additions and 32 deletions

BIN
app/assets/5/example.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 319 KiB

View file

@ -1,30 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Generative Art - seigler.github.io</title>
<link rel="stylesheet" href="DIGEST(app.css)">
</head>
<body>
<main>
<h1>P5.js generative art</h1>
<figure>
<a class="sketch" href="4/"><img src="4/example.jpg" alt="colored pinstripes distorted by a field of smoothed lenses of varying strength"></a>
<figcaption>2019-11-10 - lenses</figcaption>
</figure>
<figure>
<a class="sketch" href="3/"><img src="3/example.jpg" alt="purple jelly stripes covered with swirling swarms of peanut butter colored lines"></a>
<figcaption>2019-11-09 - peanut butter and jelly</figcaption>
</figure>
<figure>
<a class="sketch" href="2/"><img src="2/example.jpg" alt="multicolored gradients revealing and concealing jungle leaves"></a>
<figcaption>2019-11-07 - gradient jungle</figcaption>
</figure>
<figure>
<a class="sketch" href="1/"><img src="1/example.jpg" alt="multicolored gradients revealing and concealing bars and circles"></a>
<figcaption>2019-11-05 - gradient burst</figcaption>
</figure>
</main>
</body>
</html>

View file

@ -13,12 +13,14 @@ uniform float u_intensity;
void main() {
vec2 uv = vTexCoord;
// the texture is loaded upside down and backwards by default so lets flip it
uv = 1.0 - uv;
// get the displacement map as a vec4 using texture2D
vec4 mapTex = texture2D(u_map, uv);
// the texture is loaded upside down and backwards by default so lets flip it
// uv = 1.0 - uv;
uv[1] = 1.0 - uv[1];
// lets get the average color of the rgb values
float avg = dot(mapTex.rgb, vec3(0.33333));