Extracted WebglRenderTarget class from RenderTarget and WeblGraphicsDevice (playcanvas#4086)

mvaligursky · Martin Valigursky · web-flow · commit e9b68cff90c0 · 2022-03-28T09:29:52.000-07:00
* Extracted WebglRenderTarget class from RenderTarget and WeblGraphicsDevice

* small update

Co-authored-by: Martin Valigursky &lt;mvaligursky@snapchat.com&gt;
diff --git a/scripts/utils/download-texture.js b/scripts/utils/download-texture.js
@@ -103,7 +103,7 @@ function readPixels(texture, face) {
     var rt = new pc.RenderTarget({ colorBuffer: texture, depth: false, face: face });
     var data = new Uint8ClampedArray(texture.width * texture.height * 4);
     var device = texture.device;
-    device.setFramebuffer(rt._glFrameBuffer);
+    device.setFramebuffer(rt.impl._glFrameBuffer);
     device.initRenderTarget(rt);
     device.gl.readPixels(0, 0, texture.width, texture.height, device.gl.RGBA, device.gl.UNSIGNED_BYTE, data);
     return data;
diff --git a/src/deprecated/deprecated.js b/src/deprecated/deprecated.js
@@ -434,6 +434,19 @@ Object.keys(deprecatedChunks).forEach((chunkName) => {
     });
 });
 
+// Note: This was never public interface, but has been used in external scripts
+Object.defineProperties(RenderTarget.prototype, {
+    _glFrameBuffer: {
+        get: function () {
+            Debug.deprecated("pc.RenderTarget#_glFrameBuffer is deprecated. Use pc.RenderTarget.impl#_glFrameBuffer instead.");
+            return this.impl._glFrameBuffer;
+        },
+        set: function (rgbm) {
+            Debug.deprecated("pc.RenderTarget#_glFrameBuffer is deprecated. Use pc.RenderTarget.impl#_glFrameBuffer instead.");
+        }
+    }
+});
+
 VertexFormat.prototype.update = function () {
     Debug.deprecated('pc.VertexFormat.update is deprecated, and VertexFormat cannot be changed after it has been created.');
 };
diff --git a/src/framework/scene-depth.js b/src/framework/scene-depth.js
@@ -137,7 +137,7 @@ class SceneDepth {
 
                     const gl = app.graphicsDevice.gl;
                     gl.bindFramebuffer(gl.READ_FRAMEBUFFER, this.srcFbo);
-                    gl.bindFramebuffer(gl.DRAW_FRAMEBUFFER, this.renderTarget._glFrameBuffer);
+                    gl.bindFramebuffer(gl.DRAW_FRAMEBUFFER, this.renderTarget.impl._glFrameBuffer);
                     gl.blitFramebuffer(0, 0, this.renderTarget.width, this.renderTarget.height,
                                        0, 0, this.renderTarget.width, this.renderTarget.height,
                                        gl.DEPTH_BUFFER_BIT, gl.NEAREST);
diff --git a/src/graphics/grab-pass.js b/src/graphics/grab-pass.js
@@ -92,7 +92,7 @@ class GrabPass {
 
         // render target currently being rendered to (these are null if default framebuffer is active)
         const renderTarget = device.renderTarget;
-        const resolveRenderTarget = renderTarget && renderTarget._glResolveFrameBuffer;
+        const resolveRenderTarget = renderTarget && renderTarget.impl._glResolveFrameBuffer;
 
         const texture = this.texture;
         const width = device.width;
@@ -106,12 +106,12 @@ class GrabPass {
             }
 
             // these are null if rendering to default framebuffer
-            const currentFrameBuffer = renderTarget ? renderTarget._glFrameBuffer : null;
-            const resolvedFrameBuffer = renderTarget ? renderTarget._glResolveFrameBuffer || renderTarget._glFrameBuffer : null;
+            const currentFrameBuffer = renderTarget ? renderTarget.impl._glFrameBuffer : null;
+            const resolvedFrameBuffer = renderTarget ? renderTarget.impl._glResolveFrameBuffer || renderTarget.impl._glFrameBuffer : null;
 
             // init grab pass framebuffer (only does it once)
             device.initRenderTarget(this.renderTarget);
-            const grabPassFrameBuffer = this.renderTarget._glFrameBuffer;
+            const grabPassFrameBuffer = this.renderTarget.impl._glFrameBuffer;
 
             // blit from currently used render target (or default framebuffer if null)
             gl.bindFramebuffer(gl.READ_FRAMEBUFFER, resolvedFrameBuffer);
@@ -127,7 +127,7 @@ class GrabPass {
         } else {
             if (resolveRenderTarget) {
                 renderTarget.resolve(true);
-                gl.bindFramebuffer(gl.FRAMEBUFFER, renderTarget._glResolveFrameBuffer);
+                gl.bindFramebuffer(gl.FRAMEBUFFER, renderTarget.impl._glResolveFrameBuffer);
             }
 
             // this allocates texture (texture was already bound to gl)
@@ -137,7 +137,7 @@ class GrabPass {
             texture._height = height;
 
             if (resolveRenderTarget) {
-                gl.bindFramebuffer(gl.FRAMEBUFFER, renderTarget._glFrameBuffer);
+                gl.bindFramebuffer(gl.FRAMEBUFFER, renderTarget.impl._glFrameBuffer);
             }
         }
 
diff --git a/src/graphics/prefilter-cubemap.js b/src/graphics/prefilter-cubemap.js
@@ -98,7 +98,7 @@ function shFromCubemap(device, source, dontFlipX) {
                 drawQuadWithShader(device, targ, shader);
 
                 const gl = device.gl;
-                gl.bindFramebuffer(gl.FRAMEBUFFER, targ._glFrameBuffer);
+                gl.bindFramebuffer(gl.FRAMEBUFFER, targ.impl._glFrameBuffer);
 
                 const pixels = new Uint8Array(cubeSize * cubeSize * 4);
                 gl.readPixels(0, 0, tex.width, tex.height, gl.RGBA, gl.UNSIGNED_BYTE, pixels);
diff --git a/src/graphics/render-target.js b/src/graphics/render-target.js
@@ -88,9 +88,6 @@ class RenderTarget {
             this._colorBuffer._isRenderTarget = true;
         }
 
-        this._glFrameBuffer = null;
-        this._glDepthBuffer = null;
-
         // Process optional arguments
         options = (options !== undefined) ? options : defaultOptions;
         this._depthBuffer = options.depthBuffer;
@@ -120,9 +117,6 @@ class RenderTarget {
 
         this._samples = (options.samples !== undefined) ? Math.min(options.samples, this._device.maxSamples) : 1;
         this.autoResolve = (options.autoResolve !== undefined) ? options.autoResolve : true;
-        this._glResolveFrameBuffer = null;
-        this._glMsaaColorBuffer = null;
-        this._glMsaaDepthBuffer = null;
 
         // use specified name, otherwise get one from color or depth buffer
         this.name = options.name;
@@ -138,6 +132,9 @@ class RenderTarget {
 
         // render image flipped in Y
         this.flipY = !!options.flipY;
+
+        // device specific implementation
+        this.impl = this._device.createRenderTargetImpl(this);
     }
 
     /**
@@ -157,39 +154,15 @@ class RenderTarget {
     }
 
     /**
-     * Free WebGL resources associated with this render target.
+     * Free device resources associated with this render target.
      *
      * @ignore
      */
     destroyFrameBuffers() {
 
         const device = this._device;
         if (device) {
-            const gl = device.gl;
-            if (this._glFrameBuffer) {
-                gl.deleteFramebuffer(this._glFrameBuffer);
-                this._glFrameBuffer = null;
-            }
-
-            if (this._glDepthBuffer) {
-                gl.deleteRenderbuffer(this._glDepthBuffer);
-                this._glDepthBuffer = null;
-            }
-
-            if (this._glResolveFrameBuffer) {
-                gl.deleteFramebuffer(this._glResolveFrameBuffer);
-                this._glResolveFrameBuffer = null;
-            }
-
-            if (this._glMsaaColorBuffer) {
-                gl.deleteRenderbuffer(this._glMsaaColorBuffer);
-                this._glMsaaColorBuffer = null;
-            }
-
-            if (this._glMsaaDepthBuffer) {
-                gl.deleteRenderbuffer(this._glMsaaDepthBuffer);
-                this._glMsaaDepthBuffer = null;
-            }
+            this.impl.destroy(device);
         }
     }
 
@@ -212,16 +185,21 @@ class RenderTarget {
     }
 
     /**
-     * Called when the WebGL context was lost. It releases all context related resources.
+     * Initialises the resources associated with this render target.
+     *
+     * @ignore
+     */
+    init() {
+        this.impl.init(this._device, this);
+    }
+
+    /**
+     * Called when the device context was lost. It releases all context related resources.
      *
      * @ignore
      */
     loseContext() {
-        this._glFrameBuffer = undefined;
-        this._glDepthBuffer = undefined;
-        this._glResolveFrameBuffer = undefined;
-        this._glMsaaColorBuffer = undefined;
-        this._glMsaaDepthBuffer = undefined;
+        this.impl.loseContext();
     }
 
     /**
@@ -239,17 +217,9 @@ class RenderTarget {
      * depth buffer.
      */
     resolve(color = true, depth = !!this._depthBuffer) {
-        if (!this._device) return;
-        if (!this._device.webgl2) return;
-
-        const gl = this._device.gl;
-        gl.bindFramebuffer(gl.READ_FRAMEBUFFER, this._glFrameBuffer);
-        gl.bindFramebuffer(gl.DRAW_FRAMEBUFFER, this._glResolveFrameBuffer);
-        gl.blitFramebuffer(0, 0, this.width, this.height,
-                           0, 0, this.width, this.height,
-                           (color ? gl.COLOR_BUFFER_BIT : 0) | (depth ? gl.DEPTH_BUFFER_BIT : 0),
-                           gl.NEAREST);
-        gl.bindFramebuffer(gl.FRAMEBUFFER, this._glFrameBuffer);
+        if (this._device) {
+            this.impl.resolve(this._device, this, color, depth);
+        }
     }
 
     /**
diff --git a/src/graphics/webgl/webgl-graphics-device.js b/src/graphics/webgl/webgl-graphics-device.js
diff --git a/src/graphics/webgl/webgl-render-target.js b/src/graphics/webgl/webgl-render-target.js
