Forums > Jitter

Porting Shaders from Shadertoy

January 20, 2014 | 5:53 am

I have been inspired by the site Shadertoy, and am trying to port some of the more simple shaders from shadertoy into .jxs files for use withing max4live.

Shadertoy makes use of some standard uniforms.

uniform vec3 iResolution; // viewport resolution (in pixels)
uniform float iGlobalTime; // shader playback time (in seconds)
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)

Are there similar uniforms within jitter?

I guess sampler2d and sampler2drect are analagous to the iChannel uniform? What about resolution and time uniforms?

Also is it possible to pass-in/reference an audio signal – I would really like to try to create shaders that reacted to an audio signal playing within live.


January 20, 2014 | 1:25 pm

simple example of a shader -> gen port with audio input.

<code>

– Pasted Max Patch, click to expand. –

</code>


January 22, 2014 | 10:42 am

Thanks so much for this…

I have found a number of examples of shaders that have been recreated as max patches but none that have an audio input.

Do you know if it is possible to reference audio from within the fp part of a .jxs file that is loaded into a jit.gl.slab object?


January 24, 2014 | 7:37 am

Not sure what you mean.. Can you explain that a bit better?


January 29, 2014 | 10:21 am

I am such a n00b – apologies if I struggle to explain myself well.

I have become inspired the rather excellent site http://www.shadertoy.com, and have been thinking about the best way to port some of the shaders into m4l, particularly the ones that are responsive to audio. I guess that shadertoy acts as an environment that can host shaders, and passes in certain variables (the uniforms listed in my first post).

I have been using the excellent V-Module suite created by Fabrizio Poce. He has created a few devices that you can use to load up .jxs files. What I would really like to do is to modify one of these devices to perform a similar job to the shadertoy website, i.e I can load in a .jxs file containing vp/fp programmes ported from shadertoy, and the device will feed in certain uniforms, textures, audio signals, that the shaders can process.

I guess I would be creating an audio effect device in m4l?

Looking at this example

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

the audio seems to be passed in as a texture into the fp code – I am not really sure how that would work in the world of jitter/m4l.

I hope that clarifies what I am trying to achieve – I really hope you can help point me in the right direction.


January 30, 2014 | 3:56 am

If you want to go the "old school way" and work with jit.gl.slab
you will have to adapt your glsl shader.
Thats means that you need to write the corresponding xml header and add a second texture for your audio input (replacing the ichannel0 from the shadertoy example).
Use the "@inputs 2" attribute to get another input for your jit.gl.slab object.

Hope that helps.


February 3, 2014 | 12:49 pm

you can turn audio into a texture by first sampling into a jit.matrix, and then sending that matrix to the input of either jit.gl.pix, or jit.gl.slab.
lots of info on turning audio into a jitter matrix by searching the forum and tutorial articles, and checking out the following examples folder:
Max 6.1/examples/jitter-examples/audio/


May 6, 2014 | 2:19 pm

SO I have managed to create a version of the following shader that adds a nice pixellation effect to an incoming texture.

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

The shader certainly displays the nice grid of pixels, and these change colour as the incoming texture (tex0) changes.

Unfortunately each of these ‘pixels’ is identical. It is as if the shader is somehow producing an average colour value and applying that to every coordinate rather than producing differing values depending on each tex0 coordinate.

Any ideas on how to get this shader working with the texture as it does on the shadertoy site.

  • This reply was modified 5 months by  artoo.
Attachments:
  1. ArtooJumbotron.zip


LLT
May 6, 2014 | 3:15 pm

hi

– Pasted Max Patch, click to expand. –

the shader :

<jittershader name="ArtooJumbotron">

<param name="iResolution" type="vec2" default="1.0 1.0" />
<param name="tex0" type="int" default="0" />

<param name="PIXEL_FACTOR" type="float" default="0.8" />

<language name="glsl" version="1.2">

<bind param="iResolution" program="fp" />
<bind param="tex0" program="fp" />

<bind param="PIXEL_FACTOR" program="fp" />

<program name="vp" type="vertex" source="sh.passthrudim.vp.glsl" />
<program name="fp" type="fragment">

<![CDATA[

#version 120
#extension GL_ARB_texture_rectangle : enable

// samplers
uniform sampler2D tex0;
// texcoords
varying vec2 texcoord0;
uniform vec2 iResolution;

uniform float PIXEL_FACTOR;

float smooth(float f) {
return 32.0*(0.25*f*f*f*f-0.5*f*f*f+0.25*f*f)+0.5;
}

void main(void)
{
//PIXEL_FACTOR = 8.0 + 8.0 * (0.5 + 0.5 * sin(iGlobalTime * 0.25));
vec2 chunkCoord = floor(gl_FragCoord.xy / PIXEL_FACTOR) * PIXEL_FACTOR;
vec2 locCoord = (gl_FragCoord.xy - chunkCoord) / PIXEL_FACTOR;
vec4 color = texture2D(tex0, chunkCoord / iResolution.xy);
float grey = (color.x + color.y + color.z) / 3.0;
gl_FragColor = color * smooth(locCoord.x) * smooth(locCoord.y);
}

]]>
</program>
</language>
</jittershader>

  • This reply was modified 5 months by  LLT.
  • This reply was modified 5 months by  LLT.

May 6, 2014 | 9:07 pm

Thanks for this LLT

This version just gives me a black screen

I can see you replaced the texdim0 variable with an iResolution uniform. What is the logic behind that?



LLT
May 10, 2014 | 5:38 am

Hi ARTOO,

"I can see you replaced the texdim0 variable with an iResolution uniform. What is the logic behind that?"
There is no logic, it was just to keep the functions shadertoy ;)

I have problem with the shader version that does not work as I would like.
I made a version jit.gl.pix codebox. And that’s good.

– Pasted Max Patch, click to expand. –

Viewing 11 posts - 1 through 11 (of 11 total)