WillPower3309 / swayfx

SwayFX: Sway, but with eye candy!
MIT License
1.39k stars 55 forks source link

Various borders #97

Open head-gardener opened 1 year ago

head-gardener commented 1 year ago

I'm interested in opening a PR for the ability to make borders beveled, etched, etc. image What would be the optimal approach to creating such feature with OpenGL?

ErikReider commented 1 year ago

That does not look like a fun time 😂

My first thought would be to draw it over the whole window and use a stencil mask (just like how we did it for the shadows). But I'm a OpenGL noob so take this how you will

RicArch97 commented 1 year ago

One approach could be to use border images, just like sway-borders did. Looks like they use cairo to create an image surface object from a png, then create a wlr texture from that image surface object, and then render the borders using that texture.

head-gardener commented 1 year ago

Images look like the most sensible approach, though rounded corners might require way more ingenuity to implement

ErikReider commented 1 year ago

Images would be a lot easier! :)

though rounded corners might require way more ingenuity to implement

Rounded corners in Cairo is actually very simple to add :)

https://github.com/ErikReider/SwaySettings/blob/407c9e99dd3e50a0f09c64d94a9e6ff741488378/src/Pages/Themes/ThemePreviewItem.vala#L159-L177

head-gardener commented 1 year ago

Thanks a lot! I'll try implementing it.

WillPower3309 commented 1 year ago

For my input here, I would accept such a PR provided it isn't super complex and doesn't make things like rounded corners more complex. I know the sway-borders dev had some issues implementing "internal" rounded corners such that his borders would work with them.

That said, these borders would also be difficult to implement given our current gl shaders, as they focus on drawing full rectangles (as borders are essentially just 4 rectangles, plus 4 corners which we also have a shader for if they're rounded)

MayeulC commented 1 year ago

See also: https://maxbittker.github.io/broider for inspiration.

Using custom shaders for borders would be nice as well.

head-gardener commented 1 year ago

Using custom shaders for borders would be nice as well.

Can you give an example?

MayeulC commented 1 year ago

@head-gardener some of these would be possible with custom shaders:

I don't really know how I feel about always-active animations, but it would be fun to make them react to events (window resize, move, close, mouseover, touchpad gestures, switching workspaces, etc).

To allow this, I would specify a path to a SPIR-V or GLSL shader, with maybe some optional textures.

One would need a pixel (fragment) shader with some input data for things such as time, cursor position, window position, etc.

Ideally the exact same interface should be provided to window shaders #110, as well as maybe background and lockscreen ones (though a dedicated program may be better for the lockscreen). Put shaders everywhere!

An alternative may simply be to run a Wayland client that draws the borders, another for the "wallpaper" image, using whatever methods it wants.

head-gardener commented 1 year ago

@MayeulC sounds great, though code related to borders is really messy. There are already three separate frag shaders responsible for them, and the code clearly wasn't meant for extensibility. I hope we can get custom shaders working somewhat soon, which in turn will make border shaders more feasible.