GLSL not explained well...

[metzyn]

I do not understand how to implement GLSL code into my LOVE scripts. The wiki doesn't show much info at all so I am not sure how it works. I researched this forum and Google, yet there are no good tutorials as how to get started. Please help!

[Kyle]

There's a lot of GLSL documentation on the internet if that's what you're after. As for using it in LOVE, here's some sample code:

Code: Select all

local effect = nil

function love.load()
effect = love.graphics.newPixelEffect(love.filesystem.read("shader.fs"))
end

function love.draw()
love.graphics.setPixelEffect(effect)
love.graphics.rectangle(0, 0, 100, 100)
love.graphics.setPixelEffect(nil)
end

The most important thing to remember when writing your shader is that the entry point is not the same as in pure GL. It's modified in LOVE.

Code: Select all

vec4 effect( vec4 color, Image texture, vec2 texture_coords, vec2 screen_coords )

So instead of setting gl_FragCoord, you'd return the vec4 for the pixel color. Your texture coordinates are supplied for you, as well as the current texture, the system-wide current color setting, and the screen coordinate position of the current pixel. In pure GL, you'd supply your own uniform values for that stuff.

You can also send data to the shader in the form of uniform variables, like I mentioned above:

Code: Select all

effect:send(name, value[s])

The value can be a number or a table of numbers for a vec2/3/4. Or more numbers for a matrix. Full list here.

If you're looking for a big repository of shaders already written for LOVE, you're out of luck as far as I know. There is, however, a "share a shader" thread. That's the closest you can get right now.

If you don't know how shaders work, you can think of them as a small program that the graphics processor runs for each pixel. When you draw a rectangle, OpenGL transforms those coordinates into pixels on the screen (rasterization) and then runs those pixels through your shader. It's a very fast and efficient way to make modifications to images on the fly, and modern photorealistic or otherwise graphics would be nearly impossible (extremely impractical) without them.

The effect function in your shader returns a vec4 that represents the color you want to choose for the current pixel. There are a many functions built-in for math and for reading from textures. Here's a sample effect that'd simply draw a black and white texture.

Code: Select all

vec4 effect( vec4 color, Image texture, vec2 texture_coords, vec2 screen_coords )
{
vec4 color = Texel(texture, texture_coords); //This reads a color from our texture at the coordinates LOVE gave us (0-1, 0-1)
return vec4(vec3(1.0, 1.0, 1.0) * (max(color.r, max(color.g, color.b))), 1.0); //This just returns a white color that's modulated by the brightest color channel at the given pixel in the texture. Nothing too complex, and not exactly the prettiest way to do B&W :P
}

That ended up longer than what I had originally intended to write. Hope it helps, and good luck with your foray into the wonderful territory of shaders!

[master both]

^ this should be added to the wiki, its a really good explanation.

[Kyle]

Ah, that's nice of you.

I might also add that pixel effects are called "fragment shaders" outside of LOVE, in case you go Googling for it. Most GLSL is compatible with LOVE's implementation, but keep in mind that LOVE limits its GLSL to version 1.2 (#version 120 or less would show at the top of any shader you might find). The wiki has a list of things that are renamed in LOVE's GLSL, as well, but when I looked through the source code, these renamings were made so that you didn't have to follow them.

[monsieur_h]

Neat explanation. You definetly should write on the blog about it. Would be of great use.

[metzyn]

That really helps! Thank you for taking the time to explain so much. I'm going to start messing with some of it now...

[agwblack]

I made an account just to say what a great explanation this is. I haven't much previous experience with shaders and trying to piece bits together from other (non-Love2D) orientated GLSL tutorials and apply it to a Love2D pixeleffect (shader, whatever - I'm still using 0.80) was taking a long time. This post brought everything into sudden focus. I agree with the other posters who suggest that a version of this is added to Wiki.

[slime]

^ this should be added to the wiki, its a really good explanation.

Anyone with a forum account can add to the wiki.

[master both]

^ this should be added to the wiki, its a really good explanation.

Anyone with a forum account can add to the wiki.

I tried to add the post as a tutorial (Introducction to Shaders), but I can't manage to do so, and in the discussion section there are people complaining that they nither can.

[slime]

Are you sure you're logged in to the wiki when you try? Sometimes I have issues where I have to log in multiple times for it to "stick".