Author Topic: shader-module: First official release  (Read 625 times)

keilmillerjr

  • Global Moderator
  • Hero Member
  • *****
  • Posts: 844
    • View Profile
shader-module: First official release
« on: January 03, 2019, 12:57:12 PM »
This is Shader’s first official release. Shader will now used versioned releases. Please update your layouts to the latest release and make note of the version used to prevent the breaking of your layouts.

Updated and new shaders. Shaders folder path accessible from a global variable. Shaders create shader variable and use set_default function to set default parameters. Updated readme. This commit will break existing usage of the module, and layouts must be updated.

Bloom();
BloomMultipass();
crtCgwg();
CrtLottes();
crtLottesMultipass();
RoundCorners(radius, imageWidth, imageHeight, [subImgWidth], [subImgHeight]);

If you are using my existing shader module, the latest commit will break existing layouts. I am sorry. Please either update your layout, or link in your readme to a previous specific commit. I am now using versioning, and it should prevent issues like this in the future.

Currently, all of my themes have to use a previous commit until I have time to update them. mvscomplete is almost ready. Playchoicecomplete and Flavors will need time.

Big thank you to luke jones and oomek for converting or creating these shaders. Will be adding more by both of them as well as zpaolo11x, when time permits. Thank you guys! Wrapping these up into a module helps myself, and perhaps others too.
« Last Edit: January 03, 2019, 12:59:02 PM by keilmillerjr »

jedione

  • Hero Member
  • *****
  • Posts: 601
  • punktoe
    • View Profile
Re: shader-module: First official release
« Reply #1 on: January 04, 2019, 07:21:25 AM »
Great work going to start using this weekend
help a friend....

zpaolo11x

  • Sr. Member
  • ****
  • Posts: 333
    • View Profile
    • My deviantart page
Re: shader-module: First official release
« Reply #2 on: January 08, 2019, 07:22:12 AM »
You can also have a look at my colorizer and desaturation shaders, if you want to add them to the plugin:

http://forum.attractmode.org/index.php?topic=2501.0

keilmillerjr

  • Global Moderator
  • Hero Member
  • *****
  • Posts: 844
    • View Profile
Re: shader-module: First official release
« Reply #3 on: January 08, 2019, 12:44:47 PM »
You can also have a look at my colorizer and desaturation shaders, if you want to add them to the plugin:

http://forum.attractmode.org/index.php?topic=2501.0

Awesome! Will add them on next day off!

Bgoulette

  • Sr. Member
  • ****
  • Posts: 112
  • I wrote a book.
    • View Profile
    • BlakeGoulette.com
Re: shader-module: First official release
« Reply #4 on: January 10, 2019, 11:07:22 PM »
Not sure if there's any use/interest in the following -- or if it's cool to use, since I largely stole it from Shadertoy and modified it to work in AM. (Attribution included in shader file, fwiw.) In any case, it's a simple radial blur filter:

radialBlur.fsh
Code: [Select]
//
// Radial blur (simplified) for AM
//
// Modified for AM based on "Radial Blur (simplified)" by hunter
// (https://www.shadertoy.com/view/4ts3Ws), itself, per hunter's
// comment, "A simplified version of: https://www.shadertoy.com/view/4sfGRn"
//
uniform sampler2D sampleTex;
uniform float amount = float(80.0);      // 80
uniform vec2 start_pos = vec2(0.0, 0.0); // -1.0 to 1.0 for x, y
uniform vec2 rez;                        // typically fe.layout.width. fe.layout.height
uniform float g_punch = float(1.01);     // Subtle gamma boost (use < 1.0 for gamma reduction?) [Currently not user-defineable]

vec3 deform( in vec2 p )
{
    vec2 uv;
    uv.x = sin( 0.0 + 1.0 ) + p.x;
    uv.y = sin( 0.0 + 1.0 ) + p.y;
    return texture( sampleTex, uv * 0.5 ).xyz;
}

void main()
{
    vec2 position = -1.0 + 2.0 * gl_FragCoord.xy / rez.xy;
    vec2 current_step = position;
   
    vec2 direction = ( start_pos - position ) / amount;
   
    vec3 total = vec3( 0.0 );
    for( int i = 0; i < int( amount ); i++ )
    {
        vec3 result = deform( current_step );
        result = smoothstep( 0.0, 1.0, result );
        total += result;
        current_step += direction;
    }
   
    total /= amount;

gl_FragColor.rgb = vec4(total * g_punch, smoothstep(0.0, 1.0, b));
}

I even added a class for keilmillerjr's Shader module:

Code: [Select]
class RadialBlur {
//
// Accepts the following arguments (order matters!) (defaults are listed in parens):
// amount (100)
// origin (0.5, 0.5) [coords are 0, 0, to 1, 1]
// resolution (layout dimensions)
//

shader = null;

constructor(...) {
shader = fe.add_shader(Shader.Fragment, shadersDir + "radialBlur.fsh");
if (vargv.len() == 0) set_default();
if (vargv.len() == 1) set_default(vargv[0]);
if (vargv.len() == 3) set_default(vargv[0], vargv[1], vargv[2]);
if (vargv.len() == 5) set_default(vargv[0], vargv[1], vargv[2], vargv[3], vargv[4]);
}

function set_default(a=100, sx=0.5, sy=0.5, rx=::fe.layout.width, ry=::fe.layout.height) {
// Get normalized coords for blur origin (0.0~1.0 vs. -1.0~1.0):
// (Adjusting center introduces some weird edge stuff sometimes?)
sx=-((2 - (sx * 2)) - 1);
sy=((2 - (sy * 2)) - 1);

shader.set_texture_param("sampleTex");
shader.set_param("amount", a);
shader.set_param("start_pos", sx, sy);
shader.set_param("rez", rx, ry);
}
}

And here's how I'm using it (after loading the Shader module and adding radialBlur.vsh to the shaders folder):

Code: [Select]
local radialBlur = RadialBlur(150, 0.31, 0.37);
paBackground.shader = radialBlur.shader;

I'm attaching the shader and an example image to this post. I'd like to try to introduce some more dynamism: on images (or videos) with large swaths of static content, it's not terribly impressive. Maybe introducing noise or something would spice it up some? The thing is, I only know enough about GLSL to usually muck things up! Part of learning, I guess! ;-) [Full disclosure: I was trying to get a 2-pass Gaussian blur filter to work, but I couldn't trick it into working!]

zpaolo11x

  • Sr. Member
  • ****
  • Posts: 333
    • View Profile
    • My deviantart page
Re: shader-module: First official release
« Reply #5 on: January 10, 2019, 11:59:27 PM »
Not sure if there's any use/interest in the following -- or if it's cool to use, since I largely stole it from Shadertoy and modified it to work in AM. (Attribution included in shader file, fwiw.) In any case, it's a simple radial blur filter:

Impressive! I can see it used as layout background instead of the usual gaussian blur I'm using right now... it would be really over the top :D

Quote
[Full disclosure: I was trying to get a 2-pass Gaussian blur filter to work, but I couldn't trick it into working!]

You can have a look at the shaders in my Arcadeflow theme, it works, if you need some guidance let me know

keilmillerjr

  • Global Moderator
  • Hero Member
  • *****
  • Posts: 844
    • View Profile
Re: shader-module: First official release
« Reply #6 on: January 11, 2019, 12:58:08 AM »
Added/Pushed saturate and desaturate classes. Thank you zpaolo. I will take a look at some of your blur shaders as well as Bgoulette’s radial blur next. Hopefully include a few small but good ones for a v1.1.0 release.

Bgoulette

  • Sr. Member
  • ****
  • Posts: 112
  • I wrote a book.
    • View Profile
    • BlakeGoulette.com
Re: shader-module: First official release
« Reply #7 on: January 17, 2019, 05:27:05 PM »
You can have a look at the shaders in my Arcadeflow theme, it works, if you need some guidance let me know

Hey, thanks! I think I managed to trick your set up into working for me! I even tried wrapping up as a module, but it only works once. And that's enough for me. For now. Maybe someday I'll poke around a little more? :) [Something to do with how surfaces are assigned/referenced, I think...]

I'm attaching the blurred-art.nut file just in case anyone's curious. Thanks, zpaolo11x!

zpaolo11x

  • Sr. Member
  • ****
  • Posts: 333
    • View Profile
    • My deviantart page
Re: shader-module: First official release
« Reply #8 on: January 18, 2019, 01:57:13 AM »
Hey, thanks! I think I managed to trick your set up into working for me! I even tried wrapping up as a module, but it only works once. And that's enough for me. For now. Maybe someday I'll poke around a little more? :) [Something to do with how surfaces are assigned/referenced, I think...]

The way surfaces are referenced is a trick to prevent attract mode from delaying the update of nested surfaces. I think it might be useful if I try to describe how my blur works...

There's only one shader, that can be tweaked with parameters for matrix size, gaussian blulr sigma and an offset vector. The offsect vector should be (0 , 1/height) for the vertical blur and (1/width, 0) for horizontal blur. If this value is not correct you'll end up with artifacts.

The "nominal" surface stack should be like this (this will be changed for a reason, more on that later):

surface1 as base surface,
surface2 inside surface1,
picture inside surface 2

Surface1 and surface2 are the base surfaces to which you'll apply the horizontal and vertical blur shader. They should be of a known width and height and are used not only to stack the shaders, but also to force a downsample of the picture, so regardless of the picture size, you'll always apply the shader to a known size surface. If you are using the blur to generate a drop shadow this base surface should be larger than the picture to avoid clipping.

Then to avoid the delay in AM "actual" picture and surface creation is shuffled a bit so everything is created at the fe.add_ level and later "cloned" inside the surface. That's the way you build your stack is reversed, you have to create first the items that are on top, and create them on the layout level:

- create the topmost surface (surface2) as fe.add_surface etc
- add image to the surface
- create the bottom surface (surface1) as fe.add_surface etc
- add shaders to your surfaces (not to the image)
- use the Oomek trick like this:

surface2.visible = false
surface2= surface1.add_clone(surface2)
surface2.visible = true

surface1.set_pos(actual surface position and size)

the trick allows you to reposition the surfaces, but they will be updated all together since they were created as fe.add_surface and not as surface1.add_surface

The point of all this nesting is to avoid applying the shaders to the image resolution, but to the surface resolution, so you can control that and even use it to downsample.

zpaolo11x

  • Sr. Member
  • ****
  • Posts: 333
    • View Profile
    • My deviantart page
Re: shader-module: First official release
« Reply #9 on: January 18, 2019, 02:37:52 AM »
Turns out most of this stuff is not always needed for a good gaussian blur, I'll have to check better but you don't need the two surfaces to get the effect. One simple code that does a good gaussian blur is this:

Code: [Select]
local flw = fe.layout.width
local flh = fe.layout.height

local showsize = flw*0.5
local buildsize = 30

local surf1 = fe.add_surface (buildsize,buildsize)
local pic1 = surf1.add_artwork("snap",0,0,buildsize,buildsize)
pic1.video_flags = Vid.ImagesOnly

local pic3 = fe.add_artwork("snap",showsize,0,showsize,showsize)
pic3.video_flags = Vid.ImagesOnly

local blursize = 1.0/(buildsize*1.0)

local shaderH1 = fe.add_shader( Shader.Fragment, "gauss_kernsigma_o.glsl" )
shaderH1.set_texture_param( "texture")
shaderH1.set_param("kernelData", 9.0, 2.2)
shaderH1.set_param("offsetFactor", blursize, 0.0)
surf1.shader = shaderH1


local shaderV1 = fe.add_shader( Shader.Fragment, "gauss_kernsigma_o.glsl" )
shaderV1.set_texture_param( "texture")
shaderV1.set_param("kernelData", 9.0, 2.2)
shaderV1.set_param("offsetFactor", 0.0, blursize)
pic1.shader = shaderV1

surf1.set_pos (0,0,showsize,showsize)

When you draw the image on the surface, the image is drawn at the surface resolution so you can just apply shaders to the image and the surface, instead of using two surfaces. Bear in mind though that if you want to add some safeguard areas around the image to blur (e.g. drop shadow) this is not gonna work well and you'll need to step back to the other method.