examples: add perlin noise

examples/build.zig

@@ -3,8 +3,9 @@ const std = @import("std");
 pub fn build(b: *std.Build) void {
     const target = b.standardTargetOptions(.{});
     const optimize = b.standardOptimizeOption(.{});
-    _ = buildModule(b, "face_alignment", target, optimize);
     _ = buildModule(b, "colorspace", target, optimize);
+    _ = buildModule(b, "face_alignment", target, optimize);
+    _ = buildModule(b, "perlin", target, optimize);
 
     const fmt_step = b.step("fmt", "Run zig fmt");
     const fmt = b.addFmt(.{

examples/lib/index.html

@@ -15,6 +15,7 @@ <h2>Examples</h2>
       <ul>
         <li><a href="colorspace.html">Colorspace</a></li>
         <li><a href="face-alignment.html">Face aligment</a></li>
+        <li><a href="perlin.html">Perlin noise</a></li>
       </ul>
     </main>
     <script src="main.js"></script>

examples/lib/styles.css

@@ -10,12 +10,6 @@
   position: relative;
 }
 
-.grid-container {
-  display: grid;
-  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
-  grid-gap: 20px;
-}
-
 #form {
   width: 300px;
   margin: 10px;
@@ -30,6 +24,10 @@
   top: 0px;
 }
 
+#canvas {
+  border: 1px solid black;
+}
+
 #video {
   position: absolute;
 }

examples/src/js.zig

@@ -1,7 +1,6 @@
 const std = @import("std");
 const builtin = @import("builtin");
 const assert = std.debug.assert;
-const gpa = std.heap.wasm_allocator;
 
 pub const js = struct {
     extern "js" fn log(ptr: [*]const u8, len: usize) void;
@@ -29,10 +28,10 @@ pub fn logFn(
 }
 
 export fn alloc(len: usize) [*]u8 {
-    const slice = gpa.alloc(u8, len) catch @panic("OOM");
+    const slice = std.heap.wasm_allocator.alloc(u8, len) catch @panic("OOM");
     return slice.ptr;
 }
 
 export fn free(ptr: [*]const u8, len: usize) void {
-    gpa.free(ptr[0..len]);
+    std.heap.wasm_allocator.free(ptr[0..len]);
 }