add experimental LWJGL support

Author: bates64

.gitmodules

@@ -0,0 +1,3 @@
+[submodule "static/cheerpj-natives"]
+	path = static/cheerpj-natives
+	url = https://github.com/leaningtech/cheerpj-natives.git

src/app.d.ts

@@ -18,6 +18,10 @@ declare global {
 		}
 		// interface Platform {}
 	}
+
+	interface Window {
+		lwjglCanvasElement: HTMLCanvasElement;
+	}
 }
 
 export {};

src/lib/CheerpJ.svelte

@@ -28,7 +28,8 @@
 		}
 
 		await cheerpjInit({
-			status: 'none'
+			status: 'none',
+			javaProperties: ['java.library.path=/app/cheerpj-natives/natives']
 		});
 		cheerpjCreateDisplay(-1, -1, display);
 		dispatch('ready');

src/lib/repl/Output.svelte

@@ -3,6 +3,7 @@
 
 	export let console: HTMLPreElement;
 	export let display: HTMLElement;
+	export let lwjglCanvas: HTMLCanvasElement;
 	export let showLink: boolean;
 </script>
 
@@ -26,7 +27,10 @@
 	</section>
 	<section class="flex flex-col">
 		<div class="p-3 text-stone-500 text-sm select-none">Result</div>
-		<div class="grow" bind:this={display} />
+		<div class="grow relative" bind:this={display}>
+			<canvas bind:this={lwjglCanvas} class="absolute inset-0 w-full h-full" />
+			<!-- #cheerpjDisplay will be inserted here -->
+		</div>
 	</section>
 </div>
 

src/lib/repl/sidebar/Examples.svelte

@@ -22,14 +22,23 @@
 				]
 			},
 			{
-				title: 'Hello world with Swing',
+				title: 'GUI with Swing',
 				files: [
 					{
 						path: 'Main.java',
 						content: await fetchExampleFile('hello-world-swing/Main.java')
 					}
 				]
-			}
+			},
+			/*{
+				title: '3D with LWJGL',
+				files: [
+					{
+						path: 'Main.java',
+						content: await fetchExampleFile('lwjgl/Main.java')
+					}
+				]
+			},*/
 		];
 	});
 </script>

src/routes/[[id]]/output/+page.svelte

@@ -45,6 +45,9 @@
 
 	let consoleEl: HTMLPreElement;
 	let display: HTMLElement;
+	let lwjglCanvas: HTMLCanvasElement;
+
+	$: if (lwjglCanvas) window.lwjglCanvasElement = lwjglCanvas;
 
 	async function compileAndRun() {
 		if (!browser) return;
@@ -53,10 +56,12 @@
 
 		consoleEl.innerHTML = '';
 
+		const classPath = '/app/tools.jar:/app/lwjgl-2.9.0.jar:/app/lwjgl_util-2.9.0.jar:/files/';
+
 		const sourceFiles = $files.map((file) => '/str/' + file.path);
 		const code = await cheerpjRunMain(
 			'com.sun.tools.javac.Main',
-			'/app/tools.jar:/files/',
+			classPath,
 			...sourceFiles,
 			'-d',
 			'/files/',
@@ -70,7 +75,7 @@
 		}
 
 		consoleEl.innerHTML = '';
-		cheerpjRunMain(deriveMainClass($files[0]), '/app/tools.jar:/files/');
+		cheerpjRunMain(deriveMainClass($files[0]), classPath);
 		loading = false;
 		window.top?.postMessage({ action: 'running', compileLog }, window.location.origin);
 	}
@@ -94,7 +99,7 @@
 </div>
 
 <div class="flex flex-col w-screen h-screen overflow-hidden" class:hidden={loading}>
-	<Output bind:console={consoleEl} bind:display showLink={!isTop && isShared} />
+	<Output bind:console={consoleEl} bind:display bind:lwjglCanvas showLink={!isTop && isShared} />
 </div>
 
 <CheerpJ on:ready={ready} {display} />

static/cheerpj-natives

@@ -0,0 +1,46 @@
+// Example using LWJGL 2.9.0
+// Warning: experimental!
+
+import org.lwjgl.LWJGLException;
+import org.lwjgl.opengl.Display;
+import org.lwjgl.opengl.DisplayMode;
+import org.lwjgl.opengl.GL11;
+
+public class Main {
+    public static void main(String[] args) {
+        try {
+            Display.setDisplayMode(new DisplayMode(800, 600));
+            Display.setTitle("Triangle Example");
+            Display.create();
+        } catch (LWJGLException e) {
+            e.printStackTrace();
+            System.exit(1);
+        }
+
+        // Initialize OpenGL
+        GL11.glMatrixMode(GL11.GL_PROJECTION);
+        GL11.glLoadIdentity();
+        GL11.glOrtho(0, 800, 0, 600, 1, -1);
+        GL11.glMatrixMode(GL11.GL_MODELVIEW);
+
+        while (!Display.isCloseRequested()) {
+            // Clear the screen
+            GL11.glClear(GL11.GL_COLOR_BUFFER_BIT | GL11.GL_DEPTH_BUFFER_BIT);
+
+            // Draw a triangle
+            GL11.glBegin(GL11.GL_TRIANGLES);
+            GL11.glColor3f(1.0f, 0.0f, 0.0f); // Red
+            GL11.glVertex2f(400, 100);
+            GL11.glColor3f(0.0f, 1.0f, 0.0f); // Green
+            GL11.glVertex2f(100, 500);
+            GL11.glColor3f(0.0f, 0.0f, 1.0f); // Blue
+            GL11.glVertex2f(700, 500);
+            GL11.glEnd();
+
+            Display.update();
+        }
+
+        Display.destroy();
+    }
+    
+}