About Error while using shadertoy.com examples

[Marcio dos Santos Amorim]

feature request?

-- OR --

bug report?

Hello good afternoon

About Error while using shadertoy.com examples

I tried to use the following GLSL script, but it generated an error, you can do a simulation please

https://www.shadertoy.com/view/Ms2SD1

library version

npm ls gl-react gl-react-dom gl-react-native gl-react-expo # Please run and paste the output of this

├── gl-react@3.15.0
└── gl-react-dom@3.15.0

Expected behavior

Work

Actual behavior

Not Work

Steps to reproduce the behavior

https://gist.github.com/mozgbrasil/42b46029db7304b79192321ee1e84735

[@greweb]

Looks like you pasted a non ASCII character in the shader

[Marcio dos Santos Amorim]

Hello good afternoon

I had an error in my sample script

See as pictures that I created 2 examples

The first example is based on the following example

https://github.com/gre/gl-react

See that example works!

The following example is based on the following example

https://www.shadertoy.com/view/Ms2SD1

See that 2 error is displayed which one applied the support

And then the error is returned

'main' : function cannot take any parameter(s)

[Marcio dos Santos Amorim]

Hello good afternoon

To facilitate the interaction and testing I have just isolated the script in

https://codesandbox.io/s/n5rll41xy4

[@greweb]

 14:       uniform samplerXX iChannel0..3;          // input channel. XX = 2D/Cube

this syntax is not valid GLSL. Shadertoy have its own language modification 😭. you basically have to change it to

uniform sampler2D iChannel0, iChannel1, iChannel2, iChannel3;

[@greweb]

similarly there is no such void main( out vec4 fragColor, in vec2 fragCoord ) { entry point in GLSL.

entry point is void main (void) . it does not take parameters. and fragColor is actually a global variable called gl_FragColor

gl-react however will send a varying vec2 uv; (need to declare it)

that is a value in [0, 1] range

[Marcio dos Santos Amorim]

Hello good Morning

Thanks for the clarification

I'll try some tests

Thank you in advance for your attention.

[Andrew Bryson]

@mozgbrasil

This is a bit closer to what you are looking for https://codesandbox.io/s/zz2w9llpml

There are many things you must change in your example to make it work.

Here is a summary -

1. As @gre stated replace void main( out vec4 fragColor, in vec2 fragCoord ) with void main (void)
2. Set resolution yourself. Resolution won't change so vec3(1) is enough.
3. Set the position of the scene

vec2 ouv = -1.0 + 2.0 * uv;
    ouv.x *= resolution.x / resolution.y;

This helped - https://stackoverflow.com/questions/24820004/how-to-implement-a-shadertoy-shader-in-three-js
4. Set the time yourself. I built a loop and passed time as a uniform.

The lighting isn't quite right in my example, I haven't figured that one out yet. Let me know if you manage to find a solution for that.

[Marcio dos Santos Amorim]

Thank you very much

[Andrew Bryson]

You're welcome, your post here helped get me started with converting ShaderToy examples.