Additional filters and options

Aedif commented 1 year ago

Updated pixi-filters.js to v5.1.1
Exposing Ascii, CRT, Dot, and RGB Split community fitlers through TMFX
Added alpha, alphaDiscard, and repeat options to the FilterSprite
Added alpha option to FilterGlow

Aedif commented 1 year ago

There seems to be issue with repeating the texture using fract(...). A 1 pixel wide seam appears at certain zoom in levels.

Found a solution using deriratives but can't figure out how to make dFdx/dFdy available in scope of the shader... 🤔

Feu-Secret commented 1 year ago

Thanks for the PR! The added filters and options are useful 👍 I will take a look soon. If you want to use derivatives, you need to activate an extension with the current GLSL version. There is some PIXI hack to do that I believe. Nevertheless, there is also other options to have a correct texture repeat (by changing the base texture wrap mode to repeat before sending it to the GPU).

Aedif commented 1 year ago

I gave a go setting the wrapMode to PIXI.WRAP_MODES.REPEAT at various points to no avail.

Also tried explicitly setting GLSL version to 100 (I think that's the trick you mentioned otherwise PIXI appends something to the first line of the shader making it impossible to actually import the extension) and including the extension for deriratives but it kept coming up as not found. What did seem to work however was setting shaders to #version 300 es and as it comes with dFdx packaged up I was finally able to fix the seams...

vec4 getToColorFract(in vec2 uv) {
    return textureGrad(uSamplerTarget, fract(uv), dFdx(uv), dFdy(uv));
}

https://user-images.githubusercontent.com/7693704/212726646-8acd80b6-7d6d-4730-8892-a46829279807.mp4

Haven't pushed a commit for it yet as I'm not antirely sure of the full impact of using a newer GLSL version. I don't have experience in this area and have been sort of stumbling through this.

Aedif commented 1 year ago

Sprite Filter

Instead of discarding overlayed/underlayed texture's pixels only if they're over/underneath a 0 alpha one, the alphaDiscard option will now fade/scale their transparency off of them
Fixed an issue with the top option causing semi-transparent pixels in the overlayed texture to become slightly discoulored if they're above completely transparent pixels
Added a macro to show off the new filter options

baileywick commented 1 year ago

Wow, this would be a huge new feature. Basically letting us apply overlay textures and images to any tile. Snow, dirt, leaves, damage, coins, .... sheesh, I could even design clutter for tables!

Is this difficult to do, SecretFire??

Feu-Secret commented 1 year ago

Wow, this would be a huge new feature. Basically letting us apply overlay textures and images to any tile. Snow, dirt, leaves, damage, coins, .... sheesh, I could even design clutter for tables!

Is this difficult to do, SecretFire??

Hey @baileywick! I just need to find time to review the pending PRs, merge them, and release a new version with some of my work. Just time 😅

baileywick commented 1 year ago

Well, it's definitely worthy of a tutorial whenever it happens. Thanks SF!

baileywick commented 1 year ago

Yes! I'm not sure where to keep an eye on the release, but I'll start making some assets to show it off. Any parameters I need to consider? Like Max file size, dimension, file type, etc? Or will any WEBP/PNG of any dimensions work?

Aedif commented 1 year ago

I'm not at my PC to package it up for you but if you want to try out the changes you should be able to download a zip using: https://github.com/Feu-Secret/Tokenmagic/zipball/tokenmagic-dev/ Should contain 'tokenmagic' folder in it which is the version of the module with these changes.

The Macro compendium will contain a basic use of the Sprite filter with overlay options

baileywick commented 1 year ago

Early testing with the new sprite filter is going quite well. Very effective for adding overlay textures.

When applying the filter to an existing filter, it seems to apply the new parameters EXCEPT for the new sprite image. Instead, the existing sprite imag remains. Not sure if that's a big, but it's how it's working.

SecretFire, do you have an anticipated timeframe to publish? Regardless of the small issues above, it feels like it's ready now.

On Sun, Feb 5, 2023, 1:37 PM M. Vaitkus @.***> wrote:

I'm not at my PC to package it up for you but if you want to try out the changes you should be able to download a zip using: https://github.com/Feu-Secret/Tokenmagic/zipball/tokenmagic-dev/ Should contain 'tokenmagic' folder in it which is the version of the module with these changes.

The Macro compendium will contain a basic use of the Sprite filter with overlay options

— Reply to this email directly, view it on GitHub https://github.com/Feu-Secret/Tokenmagic/pull/234#issuecomment-1418258824, or unsubscribe https://github.com/notifications/unsubscribe-auth/ADMLTXWJ6KGRFS3YEHS43A3WWAFRFANCNFSM6AAAAAAT3PBSUU . You are receiving this because you were mentioned.Message ID: @.***>

Aedif commented 1 year ago

The texture doesn't get re-assinged when updating the filter. Would probably need to add something like this to FilterSprite.js:

  setTMParams(params) {
    super.setTMParams(params);
    if(!this.dummy && 'imagePath' in params){
      this.assignTexture();
    }
  }

baileywick commented 1 year ago

It would be interesting if you could stack filters, also, but if you can only have one, then replacing the original filter is probably optimal.

On Wed, Feb 8, 2023, 3:42 PM M. Vaitkus @.***> wrote:

The texture doesn't get re-assinged when updating the filter. Would probably need to add something like this to FilterSprite.js:

setTMParams(params) { super.setTMParams(params); if(!this.dummy && 'imagePath' in params){ this.assignTexture(); } }

— Reply to this email directly, view it on GitHub https://github.com/Feu-Secret/Tokenmagic/pull/234#issuecomment-1423334620, or unsubscribe https://github.com/notifications/unsubscribe-auth/ADMLTXWX6ZMAJUHXYRAMDHLWWQONTANCNFSM6AAAAAAT3PBSUU . You are receiving this because you were mentioned.Message ID: @.***>

baileywick commented 1 year ago

Ok, Aedif explained to me the way to stack filters using unique IDs. It works quite well. Really powerful. Thx Aedif.

On Wed, Feb 8, 2023, 6:12 PM Jerrod Bailey @.***> wrote:

It would be interesting if you could stack filters, also, but if you can only have one, then replacing the original filter is probably optimal.

On Wed, Feb 8, 2023, 3:42 PM M. Vaitkus @.***> wrote:

The texture doesn't get re-assinged when updating the filter. Would probably need to add something like this to FilterSprite.js:

setTMParams(params) { super.setTMParams(params); if(!this.dummy && 'imagePath' in params){ this.assignTexture(); } }

— Reply to this email directly, view it on GitHub https://github.com/Feu-Secret/Tokenmagic/pull/234#issuecomment-1423334620, or unsubscribe https://github.com/notifications/unsubscribe-auth/ADMLTXWX6ZMAJUHXYRAMDHLWWQONTANCNFSM6AAAAAAT3PBSUU . You are receiving this because you were mentioned.Message ID: @.***>

Feu-Secret / Tokenmagic

Additional filters and options #234