checkerboard effect questions

0 favourites
  • 5 posts
From the Asset Store
Wind effect
$2.49 USD
Animated wind effect for objects, grass, trees, etc.
  • https://drive.google.com/file/d/0B6fT24 ... sp=sharing

    //checkerboard effect
     
    precision lowp float;
    varying vec2 vTex;
    uniform sampler2D samplerFront;
    uniform float pixelWidth;
    uniform float pixelHeight;
     
    //params
    uniform float squareSize;   //size of checkerboard squares in pixels
    uniform float strength;     //amount of lightening and darkening to apply
     
    void main() {
        vec2 screenSize     = vec2(1.0/pixelWidth, 1.0/pixelHeight);
        vec2 grid           = floor((vTex * screenSize) / squareSize);  //checkerboard grid coordinate, 0,0 is top left square
     
        float checkerboard  = mod(grid.x + grid.y, 2.0)-0.5;            //-0.5 for dark +0.5 for light
     
        vec4 front          = texture2D(samplerFront, vTex);
        front.rgb           += checkerboard * strength;
        gl_FragColor        = front * front.a;
    }[/code:2frdzt6h]
    
    Hi all, I made this checkerboard effect for a selection highlight for an in-game level editor. It started as a modification of @chrisbrobs colorcheck effect so thanks to him [url=https://www.scirra.com/forum/effect-colorcheck_t163486]effect-colorcheck_t163486[/url]
    
    The differences are that it's no longer proportional to screen size (parameter is 'squaresize' rather than 'squarecount'), it now adds and subtracts the source pixels with a strength parameter rather than overriding them completely, and I cut out the colorization because I did not need it.
    
    This was my first effect and I have some questions:
    
    [b]Is there an easier way of getting absolute screen-space pixel coordinates? [/b]
    Having to calculate the screens size from 1/pixelWidth and 1/pixelHeight, and then multiplying that to the vTex coordinates seems wrong. 
    
    [b]If void main is called for every pixel, is it unnecessary to put certain calculations in there?[/b] 
    For example, the screen size calculation above should only need to be done once. Other shaders seem to do things like this as well, is this because the performance hit is negligible?
    
    [b]Why isn't alpha reserved when I only adjust the rgb? [/b]
    On the last line I multiply front by front.a to ensure the transparency of the sprite is reserved, but I am not sure why this is necessary:
    front is a vec4, sampling the RGBA of the pixel
    front.rgb is then adjusted to apply the checkerboarding 
    but front.rgb is only the first 3 values in the vec4, shouldn't the front.a be left intact?
    
    thanks
  • I've found that it only appears correctly when used on TiledBackground objects (this is what i've been testing on)

    vtex coordinates work completely differently for Sprites and Tiled backgrounds

    to test this, i made a shader that goes from dark to light as the vtex coordinate goes from 0 to 1

    gl_FragColor = vec4(vTex.x ,vTex.x, vTex.x, 1);

    The top layer are tiledbackgrounds, the bottom layer is sprites.

    http://i.imgur.com/QLqltO2.png

    As you can see, the TiledBackground coordinates are relative to screen space, but the Sprite vTex coordinates are relative to the object.

    Anyone know how I could get the Sprites to behave the same as the TiledBackgrounds? Maybe something to do with destStart destEnd?

  • Okay now I'm really confused

    to test out the dest end and start uniforms, I added this:

    vec2 testSize = destEnd - destStart;

    I previewed that just to see if it wasn't giving me a syntax error, and somehow it fixed the problem completely. Now, sprites vTex coordinates work the same as tiled backgrounds.

    It's strange though, because I did not make the line above affect any of the rest of the code. vec2 testSize isn't referenced anywhere else but it's made the vTex to be screen-relative just by being there.

    the code is literally just:

    void main() {
    	vec2 testSize		= destEnd - destStart;
    	gl_FragColor		= vec4(vTex.x ,vTex.x, vTex.x, 1);
    }[/code:opumu9fb]
    
    [url=http://i.imgur.com/PdERKrZ.png]http://i.imgur.com/PdERKrZ.png[/url]
    
    This image shows how with the line above, the vTex is relative to the screen but with the line above disabled, the vTex becomes local to each sprite.
  • I haven't used effects in a while but here's a writeup about all the variables C2 provides:

    Tiledbg uses the plugin setting pf_predraw flag which seems to affect the drawing of effects. I haven't figured out how but the relevant part of the runtime is the renderEffectChain function in layout.js. This is probably where the choice between screen space and object space is used.

    Is there an easier way of getting absolute screen-space pixel coordinates?

    That way should be right based on what I found for that guide.

    If void main is called for every pixel, is it unnecessary to put certain calculations in there?

    The only way for it to calculate it once would be to calculate it before hand and put it in as an effect parameter as far as i know.

    Why isn't alpha reserved when I only adjust the rgb?

    It has to do with pre-multiplied alpha.

    I'm not sure about the other issues. There's a lot going on in the renderEffectChain function in layout.js, and it probably explains when object space is used and when screen space is used, but in the interst of time it's probably a good question for ASHLEY.

  • Try Construct 3

    Develop games in your browser. Powerful, performant & highly capable.

    Try Now Construct 3 users don't see these ads
  • using effect params for pre-calculations is a good idea.. now i wonder if that's what the original shader creator intended..

    ill look into pre-multiplied alpha, thanks for the response R0J0hound

Jump to:
Active Users
There are 1 visitors browsing this topic (0 users and 1 guests)