Added overlay blend mode

kaplayjs · Feb 1, 2025 · 3c6f0f8 · 3c6f0f8
1 parent a18a138
commit 3c6f0f8
Show file tree

Hide file tree

Showing 3 changed files with 26 additions and 2 deletions.
diff --git a/examples/blend.js b/examples/blend.js
@@ -30,6 +30,11 @@ onDraw(() => {
         pos: vec2(250, 200),
         blend: BlendMode.Screen,
     });
+    drawSprite({
+        sprite: "bean",
+        pos: vec2(300, 200),
+        blend: BlendMode.Overlay,
+    });
 
     drawCircle({
         radius: 25,
@@ -55,6 +60,12 @@ onDraw(() => {
         color: rgb(128, 128, 128),
         blend: BlendMode.Screen,
     });
+    drawCircle({
+        radius: 25,
+        pos: vec2(325, 300),
+        color: rgb(128, 128, 128),
+        blend: BlendMode.Overlay,
+    });
 });
 
 add([
@@ -77,3 +88,8 @@ add([
     pos(250, 400),
     blend(BlendMode.Screen),
 ]);
+add([
+    sprite("bean"),
+    pos(300, 400),
+    blend(BlendMode.Overlay),
+]);
diff --git a/src/gfx/gfx.ts b/src/gfx/gfx.ts
@@ -182,7 +182,7 @@ export class BatchRenderer {
                 && !deepEq(this.curUniform, uniform))
             || blend !== this.curBlend
             || this.vqueue.length + verts.length * this.stride
-                > this.maxVertices
+            > this.maxVertices
             || this.iqueue.length + indices.length > this.maxIndices
         ) {
             this.flush(width, height);
@@ -217,12 +217,19 @@ export class BatchRenderer {
                         break;
                     case BlendMode.Screen:
                         gl.blendFuncSeparate(
+                            gl.ONE_MINUS_DST_COLOR,
                             gl.ONE,
-                            gl.ONE_MINUS_SRC_COLOR,
                             gl.ONE,
                             gl.ONE_MINUS_SRC_ALPHA,
                         );
                         break;
+                    case BlendMode.Overlay:
+                        gl.blendFuncSeparate(
+                            gl.DST_COLOR,
+                            gl.ONE_MINUS_SRC_ALPHA,
+                            gl.ONE,
+                            gl.ONE_MINUS_SRC_ALPHA
+                        );
                 }
             }
         }

diff --git a/src/types.ts b/src/types.ts
@@ -6575,6 +6575,7 @@ export enum BlendMode {
     Add = 1,
     Multiply = 2,
     Screen = 3,
+    Overlay = 4,
 }
 
 export interface Attributes {