How to use video texture in a GLSL Shader

[Stefan]

So i saw this nice Shadertoy demo Wrist Slitter , which consists of a Mandelbrot with video in background.

Porting to GeeXLab is pretty simple, just copy the video texture code from demo_video_player_gles2_v2.xml and use it with iChannel

The demo is preset to Timelapse-1.m4v from code sample pack, try Big Buck Bunny instead or whatever makes you happy.

As you can see i don't know how to vertical flip textures in GeeXLab 

Mandelbrot zooming was too fast so i patched the pixelshader

#define slowdown 20.0
    return zoomto(xy, DEST, iGlobalTime/slowdown);

change value dependent on length of video

[JeGX]

To flip the texture in the shader, you have to play with the vec2 texture coordinates. Try something like that to flip the texture around the horizontal axis (by inversing the Y coordinate):

Code Select Expand


vec4 getColor( in vec2 xy )
{

...

if (int(iter) >= ITER_MAX)
{
  vec2 uv = zxy*0.25 + 0.5;
  uv.y *= -1.0;
  return texture2D(iChannel0, uv);
}

...

vec2 uv = vec2(picx, dist);
uv.y *= -1.0;
vec4 color = texture2D(iChannel0, uv);

...

}


[Stefan]

I was hoping you already have a function in LUA (equivalent to the magic button at Shadertoy.com)

Anyway i found the sweet spot in the pixelshader: simply replace iResolution.y with -iResolution.y or -1*iResolution.y
But it's only that easy in this particular shader because iResolution is split into x and y

>>>download fixed version here<<<

[Stefan]

OK,
here is a generic flip code:

replace
iResolution.xy
with
vec2(iResolution.x, -iResolution.y)

Tested in toon video shader and ascii art

I'll upload the demos later with a non-commercial video

[Stefan]

>>>Here is a package with 13 demos<<< - d/l below

These demos use http://hwcdn.net/j9t9v3v5/cds/Suzie_H264.mp4 from http://www.elementaltechnologies.com/resources/4k-test-sequences
It is licensed under a Creative Commons Attribution-NoDerivs 3.0 Unported License.

If this 4K video crashes GeeXLab on exit or reload, use the shrunk video in the package.

Some shaders use iChannelTime[0] - to calculate the length of the video i assume

In the demos it looks like this:

uniform float iChannelTime0;
...
float time = iChannelTime0;
 
gh_gpu_program.uniform1f(shadertoy_prog, "iChannelTime0", video_elapsed_time)

[Stefan]

>>>download updated package<<<

Note: i didn't get the 3 layers in  "Page curl effect" look right

"video heightfield" flipped via -pixel.y

"The Tender Cut [TV]" added - uses video and keyboard texture

[Stefan]

>>>Update 3 - download now<<<

18 demos now in total

Following ports were a PITA 

"Page curl effect" fixed

Code Select Expand

return texture2D(iChannel0, vec2(p.x, -p.y));               // seethrough 1
vec4 color = texture2D(iChannel0, vec2(point.x, -point.y)); // seethrough 2
vec4 color = texture2D(iChannel0, vec2(point.x, -point.y)); // backside
bgColor = texture2D(iChannel0, vec2(uv.x, -uv.y)).rgga;     // background
color = texture2D(iChannel0, vec2(uv.x, -uv.y));            // rotation

"Overkill" contains 2 videos (!) - a real time clock and a cubemap ("Yokohama" is already in demo pack FEB 2016).
After 22 seconds "News" appears as billboard and "Suzie" in the tiles. Latter is hard to see, so maximise window.