Hi L&G
I will try to write a tutorial for converting Shadertoy Glsl to C2 FX;
'i will try'===> is the quantum theory that's mean the final result (maybe) will fail depend
of what i will write or how you will understand this.
Ok let's start ; firts we will take the .xml file on C2 basic FX;
--- .xml file is atached to this tutorial;
the xml file and fx file must called like this.
myfx.xml
myfx.fx
And now take .fx file from Shader Toy basic fx;
---- what is this ???? so explain this quickly
We are void mainImage( out--> in)
1 . We must enter with fragment coordinate and out with Fragment color.
Let's translate it to C2 glsl avaiable commands... go to ROJOhound explanation;
scirra.com/forum/documentation-on-built-in-uniforms_t115900
**varying vec2 vTex
This is the vertex co-ordinate of the current pixel
uniform sampler2D samplerFront
this is the source pixels. AKA the object's texture or the result of the previous shader.
uniform sampler2D samplerBack
this is where stuff is being drawn to
uniform float pixelWidth
1.0/width or in other words a pixel width in vertex co-ordinates
uniform float pixelHeight
1.0/height or in other words a pixel height in vertex co-ordinates
uniform vec2 destStart
The top-left vertex co-ordinate of the rectange being drawn to.
uniform vec2 destEnd
The bottom-right vertex co-ordinate of the rectange being drawn to.
For example a rectangle that covers the entire screen would have a destStart of (0,0) and a destEnd of (1,1)
Usually they define a rectangle that covers just the object, but depending on the xml settings it can be larger.
uniform float layerScale
uniform float layerAngle
^ In radians I think.
Both these are basically the same as their counterparts in C2
Now the folling two aren't used in any bundled effects but they'd have the same values as ViewportLeft(0), ViewportTop(0) and scrollx and scroly respectively.
uniform vec2 viewOrigin
Top-left of screen in layout pixels
uniform vec2 scrollPos
Center of screen in layout pixels.
uniform float seconds
Time.
uniform float opacity
Current object/layer opacity in the range of 0.0 to 1.0**
Extract our commands .... and make C2 usable commands we need for all fx we make for future ;
#ifdef GL_ES
precision mediump float;
#endif
uniform mediump sampler2D samplerFront;
varying mediump vec2 vTex;
uniform mediump float seconds;
uniform mediump float pixelWidth;
uniform mediump float pixelHeight;
vec2 iResolution = vec2( 1./pixelWidth, 1./pixelHeight);
Get the shadertoy example again ;
Let's convert it to C2;
ST : void mainImage( out vec4 fragColor, in vec2 fragCoord )
C2: void main()
ST: vec2 uv = fragCoord.xy / iResolution.xy;
C2:vec2 uv = vTex; <== this is declared above
ST:fragColor = vec4(uv,0.5+0.5*sin(iGlobalTime),1.0);
C2:gl_FragColor = vec4(uv,0.5+0.5*sin(seconds),1.0);
Finaly we have our glsl for C2;
void main()
{
vec2 uv =vText;
gl_FragColor = vec4(uv,0.5+0.5*sin(seconds),1.0);
}
explanation
if we look st first line ; void mainImage( out vec4 fragColor, in vec2 fragCoord )
fragcolor have 4 variables ; like a,b,c,d and fragcoord have 2 variables like a,b
In c2 uv=vec2; vec2 mean 2 variables;
gl_FragColor have 4 var...
vec4(uv,0.5+0.5*sin(seconds),1.0);
uv=2
0.5+0.5*sin(seconds=1
1.0=1
2+1+1=4 ; we have our VEC4 variables .
you can write so:
gl_FragColor = vec4(sin(seconds),cos(seconds),cos(-seconds),1.0);
like you see we have 4 ',' a,b,c,d = 4 variables ; no error ,
let's cause error !
gl_FragColor = vec4(cos(seconds),cos(-seconds),1.0);
we want 4 variables but have 3... this cause error !
why ? VEC4 contain 4 variables ! and we have 3;
we have our xml file and our .fx file; we can test it ...
I will continue .... please be patient ;
Regards
ST:
C2:
Some variables are not used... ** As i said Some variables are not used, this is for our work. Ok i would like now include a modifiable variable, for example "Speed" which can used in our project.
Let's take one of the unused variable: in "uniform float r_pass,g_pass,b_pass;".
Take r_pass variable and rename it with speed.
we have now : uniform float speed,g_pass,b_pass; To interact with fx we must add speed
somewhere in our fx. Let's find the correct place to insert speed variable:
gl_FragColor = vec4(uv,0.5+0.5*sin(seconds),1.0); <----- Here is the place add now speed !
-----------------
gl_FragColor = vec4(uv,0.5+0.5sin(secondsspeed),1.0); speed var is now included
-----------------
* See picture if formula is wrong in editor ...du to "" Char !
this will multiply our fx timer by 'speed', if you want to freeze the fx you are understand quickly , if you multiply any number by 0 the result is 0 ! eg 8*0=0 !
So what is now the result ?
It's not finished ... we must include it on our .xml file to load variables into C2.
Now go to our myfx.xml file and look carefully we are going to modify the file.
to :
A quick explanation here ;
<description>Speed of the FX</description>
<type>percent</type>
<initial>0.01</initial>
<uniform>speed</uniform>
Name of the variable visible on C2 fx parameters panel;
Description of the Parameter;
Type: Why is percent instead of float. Cause the value will multiplied by 100 to obtain
integer display. Here we have 0.01 initial value ; in C2 we will have 1.
and then the uniform variable we have used in fx file. is speed variable.
Now we can test our fx in C2.
This tutorial is now achieved for your pleasure. Of course it's not perfect and maybe it's not explained like you want, but consider i am not english.. and GLSLS is not easy.
Have fun
Supreme God bless France
GTR/