From 3dd63f1209c1052ba1729c4383b6ab69f06e4168 Mon Sep 17 00:00:00 2001 From: Perminder Date: Sun, 16 Mar 2025 02:17:43 +0530 Subject: [PATCH 1/4] adding-frag-shader for loadFilterShader --- docs/yuidoc-p5-theme/assets/shader.frag | 16 ++++++++++++++++ 1 file changed, 16 insertions(+) create mode 100644 docs/yuidoc-p5-theme/assets/shader.frag diff --git a/docs/yuidoc-p5-theme/assets/shader.frag b/docs/yuidoc-p5-theme/assets/shader.frag new file mode 100644 index 0000000000..64e16d5a65 --- /dev/null +++ b/docs/yuidoc-p5-theme/assets/shader.frag @@ -0,0 +1,16 @@ +precision highp float; varying vec2 vPos; +uniform vec2 p; +uniform float r; +const int I = 500; +void main() { + vec2 c = p + vPos * r, z = c; + float n = 0.0; + for (int i = I; i > 0; i --) { + if(z.x*z.x+z.y*z.y > 4.0) { + n = float(i)/float(I); + break; + } + z = vec2(z.x*z.x-z.y*z.y, 2.0*z.x*z.y) + c; + } + gl_FragColor = vec4(0.5-cos(n*17.0)/2.0,0.5-cos(n*13.0)/2.0,0.5-cos(n*23.0)/2.0,1.0); +} \ No newline at end of file From ec33241974ba96b0943dd9d56e6c86189b8e22f7 Mon Sep 17 00:00:00 2001 From: Perminder Date: Sun, 16 Mar 2025 03:01:04 +0530 Subject: [PATCH 2/4] updating shader --- docs/yuidoc-p5-theme/assets/shader.frag | 18 ++++-------------- lib/empty-example/index.html | 2 +- lib/empty-example/shader.frag | 6 ++++++ lib/empty-example/sketch.js | 16 ++++++++++++---- src/webgl/material.js | 2 +- 5 files changed, 24 insertions(+), 20 deletions(-) create mode 100644 lib/empty-example/shader.frag diff --git a/docs/yuidoc-p5-theme/assets/shader.frag b/docs/yuidoc-p5-theme/assets/shader.frag index 64e16d5a65..f8fee71c26 100644 --- a/docs/yuidoc-p5-theme/assets/shader.frag +++ b/docs/yuidoc-p5-theme/assets/shader.frag @@ -1,16 +1,6 @@ -precision highp float; varying vec2 vPos; -uniform vec2 p; -uniform float r; -const int I = 500; +precision highp float; + void main() { - vec2 c = p + vPos * r, z = c; - float n = 0.0; - for (int i = I; i > 0; i --) { - if(z.x*z.x+z.y*z.y > 4.0) { - n = float(i)/float(I); - break; - } - z = vec2(z.x*z.x-z.y*z.y, 2.0*z.x*z.y) + c; - } - gl_FragColor = vec4(0.5-cos(n*17.0)/2.0,0.5-cos(n*13.0)/2.0,0.5-cos(n*23.0)/2.0,1.0); + + gl_FragColor = vec4(1.0,1.0,0.0,1.0); } \ No newline at end of file diff --git a/lib/empty-example/index.html b/lib/empty-example/index.html index 56c88a89b8..788b9f3ee3 100644 --- a/lib/empty-example/index.html +++ b/lib/empty-example/index.html @@ -12,7 +12,7 @@ background-color: #1b1b1b; } - + diff --git a/lib/empty-example/shader.frag b/lib/empty-example/shader.frag new file mode 100644 index 0000000000..f8fee71c26 --- /dev/null +++ b/lib/empty-example/shader.frag @@ -0,0 +1,6 @@ +precision highp float; + +void main() { + + gl_FragColor = vec4(1.0,1.0,0.0,1.0); +} \ No newline at end of file diff --git a/lib/empty-example/sketch.js b/lib/empty-example/sketch.js index c614f47b93..b5c12a9a9f 100644 --- a/lib/empty-example/sketch.js +++ b/lib/empty-example/sketch.js @@ -1,7 +1,15 @@ -function setup() { - // put setup code here +let myShader; + +async function setup() { + myShader = await loadFilterShader("shader.frag"); + createCanvas(100, 100, WEBGL); + noStroke(); } function draw() { - // put drawing code here -} + // shader() sets the active shader with our shader + shader(myShader); + + // rect gives us some geometry on the screen + rect(-50, -50, width, height); +} \ No newline at end of file diff --git a/src/webgl/material.js b/src/webgl/material.js index 35961812d1..75d8d8bc17 100644 --- a/src/webgl/material.js +++ b/src/webgl/material.js @@ -551,7 +551,7 @@ function material(p5, fn){ * A rectangle with a shader applied to it. */ fn.loadFilterShader = async function (fragFilename, successCallback, failureCallback) { - p5._validateParameters('loadFilterShader', arguments); + // p5._validateParameters('loadFilterShader', arguments); try { // Load the fragment shader const fragSrc = await this.loadStrings(fragFilename); From 53bad90d625814d58f30815c20798eeabd298928 Mon Sep 17 00:00:00 2001 From: Perminder Date: Sun, 16 Mar 2025 03:34:17 +0530 Subject: [PATCH 3/4] loadFilterShader-fixes --- docs/yuidoc-p5-theme/assets/shader.frag | 6 ------ lib/empty-example/index.html | 2 +- lib/empty-example/shader.frag | 6 ------ lib/empty-example/sketch.js | 22 +++++++--------------- 4 files changed, 8 insertions(+), 28 deletions(-) delete mode 100644 docs/yuidoc-p5-theme/assets/shader.frag delete mode 100644 lib/empty-example/shader.frag diff --git a/docs/yuidoc-p5-theme/assets/shader.frag b/docs/yuidoc-p5-theme/assets/shader.frag deleted file mode 100644 index f8fee71c26..0000000000 --- a/docs/yuidoc-p5-theme/assets/shader.frag +++ /dev/null @@ -1,6 +0,0 @@ -precision highp float; - -void main() { - - gl_FragColor = vec4(1.0,1.0,0.0,1.0); -} \ No newline at end of file diff --git a/lib/empty-example/index.html b/lib/empty-example/index.html index 788b9f3ee3..56c88a89b8 100644 --- a/lib/empty-example/index.html +++ b/lib/empty-example/index.html @@ -12,7 +12,7 @@ background-color: #1b1b1b; } - + diff --git a/lib/empty-example/shader.frag b/lib/empty-example/shader.frag deleted file mode 100644 index f8fee71c26..0000000000 --- a/lib/empty-example/shader.frag +++ /dev/null @@ -1,6 +0,0 @@ -precision highp float; - -void main() { - - gl_FragColor = vec4(1.0,1.0,0.0,1.0); -} \ No newline at end of file diff --git a/lib/empty-example/sketch.js b/lib/empty-example/sketch.js index b5c12a9a9f..33ce6b4450 100644 --- a/lib/empty-example/sketch.js +++ b/lib/empty-example/sketch.js @@ -1,15 +1,7 @@ -let myShader; - -async function setup() { - myShader = await loadFilterShader("shader.frag"); - createCanvas(100, 100, WEBGL); - noStroke(); -} - -function draw() { - // shader() sets the active shader with our shader - shader(myShader); - - // rect gives us some geometry on the screen - rect(-50, -50, width, height); -} \ No newline at end of file +function setup() { + // put setup code here + } + + function draw() { + // put drawing code here + } \ No newline at end of file From 961b6a6551fc07c85c3d0f4e15aa4c004a529b7d Mon Sep 17 00:00:00 2001 From: Perminder Date: Sun, 16 Mar 2025 03:48:53 +0530 Subject: [PATCH 4/4] updating the docs --- src/webgl/material.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/webgl/material.js b/src/webgl/material.js index 75d8d8bc17..718a85740e 100644 --- a/src/webgl/material.js +++ b/src/webgl/material.js @@ -533,7 +533,7 @@ function material(p5, fn){ * let myShader; * * async function setup() { - * myShader = await loadFilterShader('assets/shader.frag'); + * myShader = await loadFilterShader('assets/basic.frag'); * createCanvas(100, 100, WEBGL); * noStroke(); * } @@ -543,7 +543,7 @@ function material(p5, fn){ * shader(myShader); * * // rect gives us some geometry on the screen - * rect(0, 0, width, height); + * rect(-50, -50, width, height); * } * *