Merge pull request #6 from davepagurek/fix/p51.4.1

davepagurek · web-flow · commit c45c5b51e13d · 2022-03-20T08:43:55.000-04:00
Make Framebuffer match alpha settings of the parent context
diff --git a/examples/simple/index.html b/examples/simple/index.html
@@ -1,5 +1,5 @@
 <!DOCTYPE html><html lang="en"><head>
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.4.0/p5.min.js"></script>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.4.1/p5.min.js"></script>
     <script src="../../p5.Framebuffer.js" type="text/javascript"></script>
     <link rel="stylesheet" type="text/css" href="style.css">
     <meta charset="utf-8">
diff --git a/examples/simple/sketch.js b/examples/simple/sketch.js
@@ -9,6 +9,7 @@ function draw() {
   // Draw a sphere to the Framebuffer
   fbo.draw(() => {
     clear()
+    background(255)
     push()
     noStroke()
     fill(255, 0, 0)
@@ -20,6 +21,7 @@ function draw() {
 
   // Do something with fbo.color or dbo.depth
   clear()
+  background(255)
   push()
   noStroke()
   
@@ -36,4 +38,4 @@ function draw() {
   pop()
   
   pop()
-}
+}
diff --git a/p5.Framebuffer.js b/p5.Framebuffer.js
@@ -97,6 +97,7 @@ class Framebuffer {
     const width = this._renderer.width
     const height = this._renderer.height
     const density = this._renderer._pInst._pixelDensity
+    const hasAlpha = this._renderer._pInst._glAttributes.alpha
 
     const colorTexture = gl.createTexture()
     if (!colorTexture) {
@@ -111,11 +112,11 @@ class Framebuffer {
     gl.texImage2D(
       gl.TEXTURE_2D,
       0,
-      gl.RGBA,
+      hasAlpha ? gl.RGBA : gl.RGB,
       width * density,
       height * density,
       0,
-      gl.RGBA,
+      hasAlpha ? gl.RGBA : gl.RGB,
       gl.UNSIGNED_BYTE,
       null,
     )
