Loading shadertoy .glsl or .frag

#1

Afternoon all!!

Is there anything like ofxShadertoy or any block to quick load a .glsl or .frag shader into an object on MacOS? Something straightforward close to openframeworks where we can embed the file into an object. (i.e. ofShader).

It seems to exist one but only for windows (https://github.com/paulhoux/Cinder-Samples/tree/master/ShaderToy)

Thanks in advance!!
Luis

#2

Well,

you can simply load a shader like this:

mShader = gl::GlslProg::create( loadAsset( "shader.vert" ), loadAsset( "shader.frag" ) );

Just put the two files inside your assets folder.

Regarding the use of ShaderToy files: their format has changed since I last updated the sample. ShaderToy shaders now have a void mainImage( out vec4 fragColor, in vec2 fragCoord ) function, instead of a void main(void), so you can’t use the shaders directly. There’s also a bunch of uniforms you need to supply for the shaders to function.

At the very least, you need to provide some additional code in your fragment shader:

#version 330 core

uniform vec3      iResolution;           // viewport resolution (in pixels)
uniform float     iTime;                 // shader playback time (in seconds)
uniform float     iTimeDelta;            // render time (in seconds)
uniform int       iFrame;                // shader playback frame
uniform float     iChannelTime[4];       // channel playback time (in seconds)
uniform vec3      iChannelResolution[4]; // channel resolution (in pixels)
uniform vec4      iMouse;                // mouse pixel coords. xy: current (if MLB down), zw: click
uniform samplerXX iChannel0..3;          // input channel. XX = 2D/Cube
uniform vec4      iDate;                 // (year, month, day, time in seconds)
uniform float     iSampleRate;           // sound sample rate (i.e., 44100)

out vec4 fragColor;

// ...paste the shadertoy code here...

void main(void)
{
    mainImage( fragColor, gl_FragCoord );
}

If you’re unsure about how to load and use shaders, have a look at the SimpleShader sample.

-Paul

#3

Thank you very much for the answer @paul.houx

Luis

#4

I’ve been meaning to update this with a cleaner approach but this might also be helpful… this example shows how to depth compare a triangulated fbo render into a raymarched “Shadertoy” texture…
https://github.com/earjuice/rayFboDepthCompare_CinderExample/blob/master/src/rayDepthApp.cpp