Initial project import

tools/v/examples/wasm/mandelbrot/README.md

@@ -0,0 +1,20 @@
+# Run V Mandelbrot Example
+
+## Using only V
+
+```
+v run .
+```
+
+## Using Python or Emscripten
+
+1. First, create `mandelbrot.wasm`. Compile with `-os browser`.
+
+```
+v -b wasm -os browser mandelbrot.wasm.v
+```
+
+2. Then, open the `mandelbrot.html` file in the browser.
+   - CORS errors do not allow `mandelbrot.wasm` to be loaded.
+   - Use `python -m http.server 8080`
+   - Use `emrun mandelbrot.html`

tools/v/examples/wasm/mandelbrot/mandelbrot.html

@@ -0,0 +1,58 @@
+<!DOCTYPE html>
+<html lang="en">
+	<head>
+		<meta charset="UTF-8" />
+		<meta http-equiv="X-UA-Compatible" content="IE=edge" />
+		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
+		<title>V Mandelbrot WebAssembly Example</title>
+	</head>
+	<body>
+		<p>Below you should see the picture of the Mandelbrot set,
+		<br>calculated in WASM, and shown in a Canvas element.</p>
+		<canvas
+			id="canvas"
+			width="400"
+			height="400"
+			style="image-rendering: crisp-edges"
+		></canvas>
+		<script>
+			var canvas = document.getElementById("canvas");
+			var ctx = canvas.getContext("2d");
+			ctx.font = "32px serif";
+			ctx.fillText("Please wait...", 100, 250);
+			var memory;
+
+			function get_string(ptr, len) {
+				const buf = new Uint8Array(memory.buffer, ptr, len);
+				const str = new TextDecoder("utf8").decode(buf);
+				return str;
+			}
+
+			const env = {
+				canvas_x: () => canvas.width,
+				canvas_y: () => canvas.height,
+				setpixel: (x, y, c) => {
+					ctx.fillStyle = "rgba(1,1,1," + c / 255 + ")";
+					ctx.fillRect(x, y, 1, 1);
+				},
+				__writeln: (ptr, len) => {
+					console.log(get_string(ptr, len));
+				},
+				__panic_abort: (ptr, len) => {
+					throw get_string(ptr, len);
+				},
+			};
+
+			WebAssembly.instantiateStreaming(fetch("mandelbrot.wasm"), {
+				env: env,
+			}).then((res) => {
+				console.log(env.canvas_x())
+				console.log(env.canvas_y())
+				memory = res.instance.exports["memory"];
+				console.time("main.main");
+				res.instance.exports["main.main"]();
+				console.timeEnd("main.main");
+			});
+		</script>
+	</body>
+</html>

tools/v/examples/wasm/mandelbrot/mandelbrot.wasm.v

@@ -0,0 +1,44 @@
+// vtest build: false // requires special compilation flags: `-b wasm -os browser`
+fn JS.canvas_x() int
+fn JS.canvas_y() int
+fn JS.setpixel(x int, y int, c f64)
+
+// `main` must be public!
+pub fn main() {
+	println('starting main.main...')
+
+	max_x := JS.canvas_x()
+	max_y := JS.canvas_y()
+	middle_x := max_x / 2
+	middle_y := max_y / 2
+
+	mut y := 0
+	for y < max_y {
+		y += 1
+		mut x := 0
+		for x < max_x {
+			x += 1
+
+			e := (f64(y) / middle_y) - 1.5
+			f := (f64(x) / middle_x) - 1.0
+
+			mut a := 0.0
+			mut b := 0.0
+			mut i := 0.0
+			mut j := 0.0
+			mut c := 0.0
+
+			for i * i + j * j < 4 && c < 255 {
+				i = a * a - b * b + e
+				j = 2 * a * b + f
+				a = i
+				b = j
+				c += 1
+			}
+
+			JS.setpixel(x, y, c)
+		}
+	}
+	// TODO: remove the need for panic here:
+	panic('reached the end of main.main')
+}

tools/v/examples/wasm/mandelbrot/serve_folder.v

@@ -0,0 +1,26 @@
+module main
+
+import veb
+import os
+
+pub struct Context {
+	veb.Context
+}
+
+struct App {
+	veb.StaticHandler
+}
+
+fn main() {
+	os.chdir(os.dir(@FILE))!
+	cmd := '${os.quoted_path(@VEXE)} -b wasm -os browser mandelbrot.wasm.v'
+	println('>> compiling mandelbrot.wasm.v, using: ${cmd}')
+	os.execute_or_panic(cmd)
+	mut app := &App{}
+	app.handle_static('.', true)!
+	veb.run[App, Context](mut app, 3001)
+}
+
+pub fn (mut app App) index(mut ctx Context) veb.Result {
+	return ctx.html(os.read_file('mandelbrot.html') or { '' })
+}