Add a sketch archetype with a bunch of boilerplate for p5 sketches

archetypes/sketch/index.md

@@ -0,0 +1,7 @@
+---
+title: "{{ replace .Name "-" " " | title }}"
+date: {{ .Date }}
+draft: true
+---
+
+{{< figures/p5 id="sketch" >}}

archetypes/sketch/sketch.js

@@ -0,0 +1,20 @@
+const sketch = p => {
+    p.setup = () => {
+        const sketchContainer = document.querySelector('#sketch');
+        const canvasWidth = parseFloat(getComputedStyle(sketchContainer).width);
+        let canvas = p.createCanvas(canvasWidth, canvasWidth);
+        canvas.canvas.removeAttribute('style');
+        sketchContainer.appendChild(canvas.canvas);
+
+        p.pixelDensity(p.displayDensity());
+    };
+
+    p.draw = () => {
+        p.background(255);
+        p.strokeWeight(4);
+        p.stroke(0, 0, 255);
+        p.circle(100, 100, 100);
+    };
+};
+
+new p5(sketch, 'sketch');