ShaderToolkit fourbit question

  • #1, z AndresMonday, 14. February 2022, 04:57 hodinky 2 years ago
    Hi!

    I´m using Shader Toolkit Version 0.96... is this one the last version?

    Is there a way to see fourbit less pixelated?

    Thanks! 
    Andrés

    Bažant

    31 Posts


  • #2, z SimonSMonday, 14. February 2022, 22:09 hodinky 2 years ago
    Here's the code:

    #ifdef GL_ES
    precision highp float; 
    precision lowp  int; 
    #endif
    uniform float time;
    uniform sampler2D composite;
    uniform int renderpass;
    uniform vec2 mouse;
    uniform vec2 resolution;
    varying vec2 texcoord;
    
    // 4BIT COLOR
    // Maps into DawnBringer's 4-bit (16 color) palette http://www.pixeljoint.com/forum/forum_posts.asp?TID=12795
    // Also see the amazing ASCII shadertoy: https://www.shadertoy.com/view/lssGDj
    float hash(vec2 p) { return fract(1e4 * sin(17.0 * p.x + p.y * 0.1) * (0.1 + abs(sin(p.y * 13.0 + p.x)))); }
    float compare(vec3 a, vec3 b) {
        // Increase saturation
        a = max(vec3(0.0), a - min(a.r, min(a.g, a.b)) * 0.25);
        b = max(vec3(0.0), b - min(b.r, min(b.g, b.b)) * 0.25);
        a*=a*a;
        b*=b*b;
        vec3 diff = (a - b);
        return dot(diff, diff);
    }
    void main(void) {
        const float pixelSize = 1.0;
        vec2 c = floor(texcoord * resolution / pixelSize);
        vec2 coord = c * pixelSize;
        vec3 src = texture2D(composite, coord / resolution.xy).rgb;
        // Track the two best colors
        vec3 dst0 = vec3(0), dst1 = vec3(0);
        float best0 = 1e3, best1 = 1e3;
    #   define TRY(R, G, B) { const vec3 tst = vec3(R, G, B); float err = compare(src, tst); if (err < best0) { best1 = best0; dst1 = dst0; best0 = err; dst0 = tst; } }
        TRY(0.078431, 0.047059, 0.109804);
        TRY(0.266667, 0.141176, 0.203922);
        TRY(0.188235, 0.203922, 0.427451);
        TRY(0.305882, 0.290196, 0.305882);
        TRY(0.521569, 0.298039, 0.188235);
        TRY(0.203922, 0.396078, 0.141176);
        TRY(0.815686, 0.274510, 0.282353);
        TRY(0.458824, 0.443137, 0.380392);
        TRY(0.349020, 0.490196, 0.807843);
        TRY(0.823529, 0.490196, 0.172549);
        TRY(0.521569, 0.584314, 0.631373);
        TRY(0.427451, 0.666667, 0.172549);
        TRY(0.823529, 0.666667, 0.600000);
        TRY(0.427451, 0.760784, 0.792157);
        TRY(0.854902, 0.831373, 0.368627);
        TRY(0.870588, 0.933333, 0.839216);
    #   undef TRY   
        best0 = sqrt(best0); best1 = sqrt(best1);
        gl_FragColor = vec4(mod(c.x + c.y, 2.0) >  (hash(c * 2.0 + fract(sin(vec2(floor(time), floor(time* 1.7))))) * 0.75) + (best1 / (best0 + best1)) ? dst1 : dst0, 1.0);
    }

    <font face="monospace"></font></div>

    There's pixelSize, I set to it to 1.0. Add this as a shader named fourbit in the shadertab, then you can use with this:

    shader_effects["fourbit"] = { shader = Shaders["fourbit"].Compiled }
    shaderAddEffect("fourbit")
    bind("fourbit", "time", field("shader_iTime"))


    Kapitán

    1582 Posts

  • #3, z AndresTuesday, 15. February 2022, 03:02 hodinky 2 years ago
    sorry, I´m not expert with this code grin

    Should I add #ifdef GL_ES code in ShaderToolkit script at the end and add
    "shader_effects["fourbit"] = { shader = Shaders["fourbit"].Compiled }
    shaderAddEffect("fourbit")
    bind("fourbit", "time", field("shader_iTime"))" everytime I wanted to use the fourbit, right?

    and then play with pixelSize ?

    (I tried that and it didn´t work) 

    Bažant

    31 Posts

  • #4, z SimonSTuesday, 15. February 2022, 09:39 hodinky 2 years ago
    No, put the shader part (the long part) into a shader in the shader section in the engine (third icon from the right upper left), just add a shader and name it fourbit and put the shader in fs, it then compiles automatically, and you can change the pixelsize there if needed. You must use the internal shader compiler.

    Just add the lua script as a definition script afterwards, there are no changes needed.

    Kapitán

    1582 Posts

  • #5, z red363Tuesday, 15. February 2022, 21:14 hodinky 2 years ago
    Hello!

    I get this error after I put long code in shader compiler: "error X4000: variable 'outColor' used without having been completely initialized"

    What could be the problem?

    Fanoušek fóra

    101 Posts

  • #6, z SimonSTuesday, 15. February 2022, 21:15 hodinky 2 years ago
    Which platform/os?

    Kapitán

    1582 Posts

  • #7, z red363Tuesday, 15. February 2022, 21:15 hodinky 2 years ago
    windows 10

    Fanoušek fóra

    101 Posts

  • #8, z SimonSTuesday, 15. February 2022, 21:19 hodinky 2 years ago
    Alright seems the html editor completely messed up the code, I edited it, try again.

    Kapitán

    1582 Posts

  • #9, z red363Tuesday, 15. February 2022, 21:22 hodinky 2 years ago
    Thank you very much, everything works.

    Fanoušek fóra

    101 Posts

  • #10, z red363Friday, 18. February 2022, 00:49 hodinky 2 years ago
    Hello!

    Another question:
    is it possible to change the pixel size for "fourbit" depending on a particular scene? For example, if I need the pixel size to be different in some scenes, while in others it remains the default.

    Or is it too labor intensive?

    Fanoušek fóra

    101 Posts

  • #11, z SimonSSaturday, 19. February 2022, 09:40 hodinky 2 years ago
    You can make the pixel size an uniform:
    #ifdef GL_ES
    precision highp float; 
    precision lowp  int; 
    #endif
    uniform float time;
    uniform sampler2D composite;
    uniform int renderpass;
    uniform vec2 mouse;
    uniform vec2 resolution;
    varying vec2 texcoord;
    uniform float pixelSize;
    
    // 4BIT COLOR
    // Maps into DawnBringer's 4-bit (16 color) palette http://www.pixeljoint.com/forum/forum_posts.asp?TID=12795
    // Also see the amazing ASCII shadertoy: https://www.shadertoy.com/view/lssGDj
    float hash(vec2 p) { return fract(1e4 * sin(17.0 * p.x + p.y * 0.1) * (0.1 + abs(sin(p.y * 13.0 + p.x)))); }
    float compare(vec3 a, vec3 b) {
        // Increase saturation
        a = max(vec3(0.0), a - min(a.r, min(a.g, a.b)) * 0.25);
        b = max(vec3(0.0), b - min(b.r, min(b.g, b.b)) * 0.25);
        a*=a*a;
        b*=b*b;
        vec3 diff = (a - b);
        return dot(diff, diff);
    }
    void main(void) {
        vec2 c = floor(texcoord * resolution / pixelSize);
        vec2 coord = c * pixelSize;
        vec3 src = texture2D(composite, coord / resolution.xy).rgb;
        // Track the two best colors
        vec3 dst0 = vec3(0), dst1 = vec3(0);
        float best0 = 1e3, best1 = 1e3;
    #   define TRY(R, G, B) { const vec3 tst = vec3(R, G, B); float err = compare(src, tst); if (err < best0) { best1 = best0; dst1 = dst0; best0 = err; dst0 = tst; } }
        TRY(0.078431, 0.047059, 0.109804);
        TRY(0.266667, 0.141176, 0.203922);
        TRY(0.188235, 0.203922, 0.427451);
        TRY(0.305882, 0.290196, 0.305882);
        TRY(0.521569, 0.298039, 0.188235);
        TRY(0.203922, 0.396078, 0.141176);
        TRY(0.815686, 0.274510, 0.282353);
        TRY(0.458824, 0.443137, 0.380392);
        TRY(0.349020, 0.490196, 0.807843);
        TRY(0.823529, 0.490196, 0.172549);
        TRY(0.521569, 0.584314, 0.631373);
        TRY(0.427451, 0.666667, 0.172549);
        TRY(0.823529, 0.666667, 0.600000);
        TRY(0.427451, 0.760784, 0.792157);
        TRY(0.854902, 0.831373, 0.368627);
        TRY(0.870588, 0.933333, 0.839216);
    #   undef TRY   
        best0 = sqrt(best0); best1 = sqrt(best1);
        gl_FragColor = vec4(mod(c.x + c.y, 2.0) >  (hash(c * 2.0 + fract(sin(vec2(floor(time), floor(time* 1.7))))) * 0.75) + (best1 / (best0 + best1)) ? dst1 : dst0, 1.0);
    }
    And then set it via lua:
    shader_effects["fourbit"] = { shader = Shaders["fourbit"].Compiled }
    shaderAddEffect("fourbit")
    bind("fourbit", "time", field("shader_iTime"))
    shader_effects["fourbit"].num.pixelSize = 1

    Kapitán

    1582 Posts