Merge pull request #6699 from Garima3110/blend-state

Solves issue #4562
processing · Jan 14, 2024 · f4cc7e1 · f4cc7e1
2 parents f41360f + db4e344
commit f4cc7e1
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 9 deletions.
diff --git a/src/webgl/material.js b/src/webgl/material.js
@@ -1280,7 +1280,7 @@ p5.prototype.metalness = function (metallic) {
  * If alpha value is less than 1, or non-standard blendMode
  * we need to enable blending on our gl context.
  * @param  {Number[]} color [description]
- * @return {Number[]]}  Normalized numbers array
+ * @return {Number[]}  Normalized numbers array
  */
 p5.RendererGL.prototype._applyColorBlend = function (colors) {
   const gl = this.GL;
@@ -1315,7 +1315,7 @@ p5.RendererGL.prototype._applyColorBlend = function (colors) {
 /**
  * @private sets blending in gl context to curBlendMode
  * @param  {Number[]} color [description]
- * @return {Number[]]}  Normalized numbers array
+ * @return {Number[]}  Normalized numbers array
  */
 p5.RendererGL.prototype._applyBlendMode = function () {
   if (this._cachedBlendMode === this.curBlendMode) {

diff --git a/src/webgl/p5.RendererGL.js b/src/webgl/p5.RendererGL.js
@@ -497,6 +497,7 @@ p5.RendererGL = class RendererGL extends p5.Renderer {
     this.curStrokeColor = this._cachedStrokeStyle = [0, 0, 0, 1];
 
     this.curBlendMode = constants.BLEND;
+    this.preEraseBlend=undefined;
     this._cachedBlendMode = undefined;
     if (this.webglVersion === constants.WEBGL2) {
       this.blendExt = this.GL;
@@ -1168,7 +1169,7 @@ p5.RendererGL = class RendererGL extends p5.Renderer {
 
   erase(opacityFill, opacityStroke) {
     if (!this._isErasing) {
-      this._cachedBlendMode = this.curBlendMode;
+      this.preEraseBlend = this.curBlendMode;
       this._isErasing = true;
       this.blendMode(constants.REMOVE);
       this._cachedFillStyle = this.curFillColor.slice();
@@ -1180,14 +1181,15 @@ p5.RendererGL = class RendererGL extends p5.Renderer {
 
   noErase() {
     if (this._isErasing) {
+      // Restore colors
       this.curFillColor = this._cachedFillStyle.slice();
       this.curStrokeColor = this._cachedStrokeStyle.slice();
-      // It's necessary to restore post-erase state. Needs rework
-      let temp = this.curBlendMode;
-      this.blendMode(this._cachedBlendMode);
-      this._cachedBlendMode = temp; // If we don't do this, applyBlendMode() returns null
+      // Restore blend mode
+      this.curBlendMode=this.preEraseBlend;
+      this.blendMode(this.preEraseBlend);
+      // Ensure that _applyBlendMode() sets preEraseBlend back to the original blend mode
       this._isErasing = false;
-      this._applyBlendMode(); // This sets _cachedBlendMode back to the original blendmode
+      this._applyBlendMode();
     }
   }
 

diff --git a/test/unit/color/setting.js b/test/unit/color/setting.js
@@ -91,7 +91,7 @@ suite('color/Setting', function() {
     test('should cache renderer blend', function() {
       my3D.blendMode(my3D.SCREEN);
       my3D.erase();
-      assert.deepEqual(my3D._renderer._cachedBlendMode, my3D.SCREEN);
+      assert.deepEqual(my3D._renderer.preEraseBlend, my3D.SCREEN);
     });
 
     test('should set fill strength', function() {