From 6ac97d4ad9a8020d67f21a89b49b235c576f61e6 Mon Sep 17 00:00:00 2001
From: ubkp <118854183+ubkp@users.noreply.github.com>
Date: Sun, 6 Aug 2023 01:33:36 -0300
Subject: [PATCH] Fix compositing mixing with framebuffer for web and ANGLE

---
 src/minshell.html | 2 +-
 src/rlgl.h        | 8 ++++++++
 src/shell.html    | 1 -
 3 files changed, 9 insertions(+), 2 deletions(-)

diff --git a/src/minshell.html b/src/minshell.html
index 2aa75578f..fed5ee222 100644
--- a/src/minshell.html
+++ b/src/minshell.html
@@ -32,7 +32,7 @@
 
     <style>
         body { margin: 0px; }
-        canvas.emscripten { border: 0px none; background-color: black; }
+        canvas.emscripten { border: 0px none; }
     </style>
     <script type='text/javascript' src="https://cdn.jsdelivr.net/gh/eligrey/FileSaver.js/dist/FileSaver.min.js"> </script>
     <script type='text/javascript'>
diff --git a/src/rlgl.h b/src/rlgl.h
index 717fa59fb..7ea146446 100644
--- a/src/rlgl.h
+++ b/src/rlgl.h
@@ -2890,6 +2890,14 @@ void rlDrawRenderBatch(rlRenderBatch *batch)
     // Change to next buffer in the list (in case of multi-buffering)
     batch->currentBuffer++;
     if (batch->currentBuffer >= batch->bufferCount) batch->currentBuffer = 0;
+
+#if defined(GRAPHICS_API_OPENGL_ES2)
+    // Fix compositing mixing with the framebuffer (that causes transparency issues) by clearing the alpha channel on the end of the frame
+    glClearColor(0, 0, 0, 1);
+    glColorMask(false, false, false, true);
+    glClear(GL_COLOR_BUFFER_BIT);
+    glColorMask(true, true, true, true);
+#endif
 #endif
 }
 
diff --git a/src/shell.html b/src/shell.html
index b373394bb..61540494a 100644
--- a/src/shell.html
+++ b/src/shell.html
@@ -75,7 +75,6 @@ jwE50AGjLCVuS8Yt4H7OgZLKK5EKOsLviEWJSL/+0uMi7gLUSBseYwqEbXvSHCec1CJvZPyHCmYQffaB
       /* NOTE: Canvas *must not* have any border or padding, or mouse coords will be wrong */
       canvas.emscripten {
         border: 0px none;
-        background: black;
         width: 100%;
       }