How can I draw something behind my shader?

Questions about the LÖVE API, installing LÖVE and other support related questions go here.
Forum rules
Before you make a thread asking for help, read this.
Post Reply
dogwater
Prole
Posts: 1
Joined: Sat Nov 30, 2024 10:09 pm

How can I draw something behind my shader?

Post by dogwater »

Hello everyone, I'm starting to learn how to code with Love2D and now I'm facing an issue that I can't solve.

I'm using the following shader on top of my screen:

Code: Select all

uniform float millis;

vec2 curve(vec2 uv)
{
	uv = (uv - 0.5) * 2.0;
	uv *= 1.1;	
	uv.x *= 1.0 + pow((abs(uv.y) / 5.0), 2.0);
	uv.y *= 1.0 + pow((abs(uv.x) / 4.0), 2.0);
	uv  = (uv / 2.0) + 0.5;
	uv =  uv *0.92 + 0.04;
	return uv;
}

vec4 effect(vec4 color, Image tex, vec2 texture_coords, vec2 screen_coords)
{
    vec2 uv = texture_coords;
    uv = curve(uv);
    vec4 oricolv4 = Texel(tex, vec2(uv.x,uv.y));
    vec3 oricol = vec3(oricolv4.x, oricolv4.y, oricolv4.z);
    vec3 col;
	float x =  sin(0.3*millis+uv.y*21.0)*sin(0.7*millis+uv.y*29.0)*sin(0.3+0.33*millis+uv.y*31.0)*0.0017;

    col.r = Texel(tex,vec2(x+uv.x+0.001,uv.y+0.001)).x+0.05;
    col.g = Texel(tex,vec2(x+uv.x+0.000,uv.y-0.002)).y+0.05;
    col.b = Texel(tex,vec2(x+uv.x-0.002,uv.y+0.000)).z+0.05;
    col.r += 0.08*Texel(tex,0.75*vec2(x+0.025, -0.027)+vec2(uv.x+0.001,uv.y+0.001)).x;
    col.g += 0.05*Texel(tex,0.75*vec2(x+-0.022, -0.02)+vec2(uv.x+0.000,uv.y-0.002)).y;
    col.b += 0.08*Texel(tex,0.75*vec2(x+-0.02, -0.018)+vec2(uv.x-0.002,uv.y+0.000)).z;

    col = clamp(col*0.6+0.4*col*col*1.0,0.0,1.0);

    float vig = (0.0 + 1.0*16.0*uv.x*uv.y*(1.0-uv.x)*(1.0-uv.y));
	col *= vec3(pow(vig,0.3));

    col *= vec3(0.95,1.05,0.95);
	col *= 2.8;

	float scans = clamp(0.35+0.35*sin(3.5*millis+uv.y*screen_coords.y*1.5), 0.0, 1.0);
	
	float s = pow(scans,5.7);
	col = col*vec3(0.4+0.7*s) ;

    col *= 1.0+0.01*sin(10.0*millis);
	if (uv.x < 0.0 || uv.x > 1.0)
		col *= 0.0;
	if (uv.y < 0.0 || uv.y > 1.0)
		col *= 0.0;
	
	col *= 1.0 - 0.65 * vec3(clamp((mod(texture_coords.x, 2.0)-1.0)*2.0,0.0,1.0));
	
    float comp = smoothstep(0.1, 0.9, sin(millis));

    return vec4(col, 1.0);
}
Like so:

Code: Select all

local startTime = love.timer.getTime()

local crtShader

-- Helpers
function getScreenCanvas()
    canvas = love.graphics.newCanvas(love.graphics.getWidth(), love.graphics.getHeight(), { type = "2d", readable = true })
    return canvas
end

-- Main
function love.load()
    crtShader = love.graphics.newShader("shaders/crt.glsl")
end

function love.draw()
    love.graphics.setColor(255, 255, 255, 1)
    love.graphics.circle(
        "fill",
        love.graphics.getWidth() / 2,
        love.graphics.getHeight() / 2,
        100
    )

    love.graphics.setCanvas()
    crtShader:send('millis', love.timer.getTime() - startTime)
    love.graphics.setShader(crtShader)
    love.graphics.draw(getScreenCanvas(), 0, 0)
    love.graphics.setShader()
end
As you can see, I'm trying to draw a white circle in the middle of the screen (or at least that's why I want to do).

If I comment my shader code (the very last 5 lines right before the end keyword of the draw function) I can see the circle right where I wanted. But adding those shader lines displays the shader, but no circle at all.

Is my shader somehow hiding everything behind it or am I rendering stuff the wrong way?

Thanks in advance and sorry for my bad english, this is not my native language!
User avatar
zorg
Party member
Posts: 3468
Joined: Thu Dec 13, 2012 2:55 pm
Location: Absurdistan, Hungary
Contact:

Re: How can I draw something behind my shader?

Post by zorg »

Colors are in the range of 0-1, not 0-255;
Other than that, the position of the setCanvas call, and that getScreenCanvas helper function is suspicious to me.
Me and my stuff :3True Neutral Aspirant. Why, yes, i do indeed enjoy sarcastically correcting others when they make the most blatant of spelling mistakes. No bullying or trolling the innocent tho.
Post Reply

Who is online

Users browsing this forum: Amazon [Bot] and 9 guests