From 96b9aa4e9f75b9b2dbb88a775f9a305f9955645f Mon Sep 17 00:00:00 2001
From: tga <tga@space55.xyz>
Date: Thu, 28 Dec 2023 14:41:07 +0800
Subject: [PATCH] fix makeCanvas() flush problem

---
 src/kaboom.ts | 16 +++++++++++++++-
 src/types.ts  | 12 +++++++++++-
 2 files changed, 26 insertions(+), 2 deletions(-)

diff --git a/src/kaboom.ts b/src/kaboom.ts
index ad4e62578..518c31d3f 100644
--- a/src/kaboom.ts
+++ b/src/kaboom.ts
@@ -1482,7 +1482,21 @@ export default (gopt: KaboomOpt = {}): KaboomCtx => {
 	}
 
 	function makeCanvas(w: number, h: number) {
-		return new FrameBuffer(ggl, w, h)
+		const fb = new FrameBuffer(ggl, w, h)
+		return {
+			clear: () => fb.clear(),
+			free: () => fb.free(),
+			toDataURL: () => fb.toDataURL(),
+			toImageData: () => fb.toImageData(),
+			width: fb.width,
+			height: fb.height,
+			draw: (action) => {
+				fb.bind()
+				action()
+				flush()
+				fb.unbind()
+			},
+		}
 	}
 
 	function makeShader(
diff --git a/src/types.ts b/src/types.ts
index 5bbf93c52..a9ec8f5a5 100644
--- a/src/types.ts
+++ b/src/types.ts
@@ -2286,7 +2286,7 @@ export interface KaboomCtx {
 	 *
 	 * @since v3000.2
 	 */
-	makeCanvas(w: number, h: number): FrameBuffer
+	makeCanvas(w: number, h: number): Canvas
 	/**
 	 * @section Debug
 	 *
@@ -3226,6 +3226,16 @@ export declare class FrameBuffer {
 	free(): void
 }
 
+export type Canvas = {
+	width: number
+	height: number
+	toImageData(): ImageData
+	toDataURL(): string
+	clear(): void
+	draw(action: () => void): void
+	free(): void
+}
+
 export interface GfxFont {
 	tex: Texture,
 	map: Record<string, Quad>,