Shockwave effect

[UltraRPG]

Hello! Yesterday I watched this video and was inspired to make a shockwave shader. It turned out alright but I feel that I am doing something wrong. It just feels that way. Most of my projects that I have started don't have any graphics yet. Most of my time I've spent coding the gameplay stuff so I have no experience in drawing to the screen. I would be happy if someone could take a look at my code and tell me if I am doing something wrong. Thank you in advance.
------
How it works:
I have a canvas where I store the displacement data:
Pixel's red and blue values represent a direction vector of displacement, green value is the distance of displacement, and alpha is just the strength of the displacement. I draw to the canvas using a shader that generates the data I need. When the shockwave data is drawn to the canvas I send the canvas to the displacement shader and then draw the background. The background image is not mine. It's just a screenshot I found on google.

------
Controls:
Mouse 1 to spawn a shockwave.
Hold space to keep spawning shockwaves.
R to toggle displacement shader.

[evgiz]

Looks awesome! I used a similar effect in an old project of mine using a modified fisheye-effect shader. This method however seems much better, I'll remember this if I ever need something similar!

There was one thing I didnt quite understand though. When holding down space while the displacement shader is toggled, it looks quite different than the displacement "circle" texture with regular clicks. What are the cyan/pink lines, and how come the rest is completely white?

[UltraRPG]

Looks awesome!

Thanks!

There was one thing I didnt quite understand though. When holding down space while the displacement shader is toggled, it looks quite different than the displacement "circle" texture with regular clicks. What are the cyan/pink lines, and how come the rest is completely white?

Oh, I forgot to explain one thing. Direction vector's range is (-1;1) but colour value range is (0;1). So I have to convert between those in the shaders. The cyan, pink, and white colours are a result of the screen blend mode. The screen blend mode is not suitable for this thing. It just ruins everything but at least it looks better than the alpha blend mode. You can clearly see what's wrong if you slow down the speed of expanding (the v.t = v.t + dt*1000 part) and spawn some shockwaves near each other. If there's a way to make your own blend mode I would make one that takes into account that we are not really working with colours but with vector data.

[Nixola]

Aren't shaders basically custom blend modes?

[UltraRPG]

Aren't shaders basically custom blend modes?

I would guess that blend mode takes into account the pixel values of the image you are drawing and the pixel values of the image you are drawing onto. I'm new to shaders, but I think that if you wanted to make your own custom blend mode you had to pass additional image data to the shader each time you want to draw something which would be a hit on performance. Like I said I don't know much about drawing but maybe the built-in blend modes also give you a performance hit.

[nice]

This is super cool!
It felt like I was pulling a water-blob around the screen!

[UltraRPG]

This is super cool!
It felt like I was pulling a water-blob around the screen!

Thank you!

[Jasoco]

Oh my, I've been looking for something like this to use when an explosion goes off. I'll have to see if I can implement it in when I redo bombs.

[zorg]

Aren't shaders basically custom blend modes?

I would guess that blend mode takes into account the pixel values of the image you are drawing and the pixel values of the image you are drawing onto. I'm new to shaders, but I think that if you wanted to make your own custom blend mode you had to pass additional image data to the shader each time you want to draw something which would be a hit on performance. Like I said I don't know much about drawing but maybe the built-in blend modes also give you a performance hit.

When you activate a shader and call love.graphics.draw on a drawable, guess what gets passed into it.
Yes, the thing that needs to be drawn, be it an image, a text object, a canvas, etc.

No need to manually supply it, since it's already there. This means that making (simpler) custom blendmodes is easy, and not at all taxing on the GPU.

The "normal" blendmodes shouldn't have a huge performance hit either, but i didn't look into what they did exactly, but i'm guessing that instead of defining a custom shader, they use the old gl blendfunctions and such. (in a constrained manner, though; if you want XOR or any other not available, then you'll have to go with shaders)

[UltraRPG]

When you activate a shader and call love.graphics.draw on a drawable, guess what gets passed into it.
Yes, the thing that needs to be drawn, be it an image, a text object, a canvas, etc.

For example, I have a canvas with a tree drawn in it, let's call it TreeCanvas, and I want to draw an apple (ImageApple) onto it using a shader (SomeShader).

Code: Select all

love.graphics.setCanvas(TreeCanvas)
  love.graphics.setShader(SomeShader)
    love.graphics.draw(ImageApple)
  love.graphics.setShader()
love.graphics.setCanvas()

Will the shader get the TreeCanvas passed to it? Because you need two pictures for a blend mode to work. In this example, we need TreeCanvas and ImageApple to be passed into the shader.