fix stroke shader with better blending and initial support to opacity

engine/app.cpp

@@ -48,7 +48,17 @@ void App::initShaders()
         "void main(){"
         "   frag = vec4(uv.xy, 0.0, 1.0);"
         "}";
-    
+    // TEXTURE ALPHA
+    static const char* shader_alpha_f =
+        SHADER_VERSION
+        "uniform sampler2D tex;\n"
+        "uniform mediump float alpha;\n"
+        "in mediump vec3 uv;\n"
+        "out mediump vec4 frag;\n"
+        "void main(){\n"
+        "   frag = texture(tex, uv.xy) * vec4(1,1,1,alpha);\n"
+        "}\n";
+
     // TEXTURE ATLAS
     static const char* shader_atlas_v =
         SHADER_VERSION
@@ -177,11 +187,13 @@ void App::initShaders()
         "out mediump vec4 frag;\n"
         "void main(){\n"
         "   mediump vec2 uv2 = gl_FragCoord.st / resolution;\n"
-        "   mediump float brush = ( 1.0 - texture(tex, uv).r ) * alpha;\n"
+        "   mediump float brush_alpha = ( 1.0 - texture(tex, uv).r ) * alpha;\n"
+        "   mediump vec4 fg = vec4(col.rgb, brush_alpha);\n"
         "   mediump vec4 bg = texture(tex_bg, uv2);\n"
-        "   mediump vec3 rgb = mix( bg.rgb, col.rgb, clamp( brush/(brush + bg.a), 0.0, 1.0 ) );\n"
+        "   if (fg.a < (1.0/255.0)) { frag = bg; return; }\n"
-        "   mediump float a = bg.a + (1.0 - bg.a) * brush;\n"
+        "   mediump float alpha_tot = fg.a + (1.0 - fg.a) * bg.a;"
-        "   frag = vec4(rgb, a);\n"
+        "   mediump vec3 rgb = mix(bg.rgb, fg.rgb, fg.a / alpha_tot);\n"
+        "   frag = vec4(rgb, alpha_tot);\n"
         "}\n";
 
     // STROKE LAYER BLEND
@@ -204,16 +216,19 @@ void App::initShaders()
         "in mediump vec2 uv;\n"
         "out mediump vec4 frag;\n"
         "void main(){\n"
-        "   mediump vec4 fg = texture(tex, uv);\n"
+        "   mediump vec4 fg = texture(tex, uv) * vec4(1,1,1,alpha);\n"
         "   mediump vec4 bg = texture(tex_bg, uv);\n"
-        "   mediump vec3 rgb = mix( bg.rgb, fg.rgb, clamp( fg.a/(fg.a + bg.a), 0.0, 1.0 ) );\n"
+        "   if (fg.a < (1.0/255.0)) { frag = bg; return; }\n"
-        "   mediump float a = bg.a + (1.0 - bg.a) * fg.a;\n" // this can be optimized as lerp/mix(1, fg.a, bg.a)
+        "   mediump float alpha_tot = fg.a + (1.0 - fg.a) * bg.a;"
-        "   frag = vec4(rgb, a);\n"
+        "   mediump vec3 rgb = mix(bg.rgb, fg.rgb, fg.a / alpha_tot);\n"
+        "   frag = vec4(rgb, alpha_tot);\n"
         "}\n";
 
     LOG("initializing shaders");
     if (!ShaderManager::create(kShader::Texture, shader_v, shader_f))
         LOG("Failed to create shader Texture");
+    if (!ShaderManager::create(kShader::TextureAlpha, shader_v, shader_alpha_f))
+        LOG("Failed to create shader TextureAlpha");
     if (!ShaderManager::create(kShader::Color, shader_color_v, shader_color_f))
         LOG("Failed to create shader Color");
     if (!ShaderManager::create(kShader::ColorQuad, shader_color_quad_v, shader_color_quad_f))

engine/canvas.cpp

@@ -49,7 +49,7 @@ void ui::Canvas::stroke_draw()
     tex.bind();
     m_sampler.bind(0);
     glActiveTexture(GL_TEXTURE1);
-    m_tex.bind();
+    m_tex.bind(); // bg, copy of framebuffer (copied before drawing)
     m_sampler_bg.bind(1);
 
     if (m_use_instanced)
@@ -65,8 +65,8 @@ void ui::Canvas::stroke_draw()
         glDisable(GL_BLEND);
         ShaderManager::use(ui::kShader::Stroke);
         ShaderManager::u_vec4(kShaderUniform::Col, m_brush.m_tip_color);
-        ShaderManager::u_int(kShaderUniform::Tex, 0);
+        ShaderManager::u_int(kShaderUniform::Tex, 0); // brush
-        ShaderManager::u_int(kShaderUniform::TexBG, 1);
+        ShaderManager::u_int(kShaderUniform::TexBG, 1); // bg
         ShaderManager::u_vec2(kShaderUniform::Resolution, { m_width, m_height });
         for (const auto& s : samples)
         {
@@ -158,7 +158,7 @@ void ui::Canvas::stroke_commit()
     ShaderManager::use(ui::kShader::StrokeLayer);
     ShaderManager::u_int(kShaderUniform::Tex, 0);
     ShaderManager::u_int(kShaderUniform::TexBG, 1);
-    //ShaderManager::u_float(kShaderUniform::Alpha, 1); // TODO: if using opacity in commit, update blending to match the preview when rendering m_tmp in NodeCanvas
+    ShaderManager::u_float(kShaderUniform::Alpha, .5); // TODO: if using opacity in commit, update blending to match the preview when rendering m_tmp in NodeCanvas
     ShaderManager::u_mat4(kShaderUniform::MVP, glm::ortho(-.5f, .5f, -.5f, .5f, -1.f, 1.f));
     m_plane.draw_fill();
     m_sampler.unbind();

engine/layout.h

@@ -1872,7 +1872,7 @@ public:
         glGetIntegerv(GL_VIEWPORT, vp);
         glGetFloatv(GL_COLOR_CLEAR_VALUE, cc);
 
-        glClearColor(0, 0, 0, 1);
+        glClearColor(1, 1, 1, 1);
         glClear(GL_COLOR_BUFFER_BIT);
         float zoom = root()->m_zoom;
         auto box = m_clip * zoom;
@@ -1901,6 +1901,10 @@ public:
         if (m_canvas->m_show_tmp)
         {
             glEnable(GL_BLEND);
+            ui::ShaderManager::use(kShader::TextureAlpha);
+            ui::ShaderManager::u_int(kShaderUniform::Tex, 0);
+            ui::ShaderManager::u_mat4(kShaderUniform::MVP, mvp);
+            ui::ShaderManager::u_float(kShaderUniform::Alpha, .5);
             m_canvas->m_tmp.bindTexture();
             NodeBorder::m_plane.draw_fill();
             m_canvas->m_tmp.unbindTexture();

engine/shader.h

@@ -22,6 +22,7 @@ enum class kShader : uint16_t
     ColorQuad   = const_hash("color-quad"),
     ColorHue    = const_hash("color-hue"),
     Texture     = const_hash("texture"),
+    TextureAlpha = const_hash("texture-alpha"),
     UVs         = const_hash("uvs"),
     Font        = const_hash("font"),
     Atlas       = const_hash("atlas"),