fix proportions bug

frontend/js/control.js

@@ -6,15 +6,15 @@ const socket = io("http://localhost:3000");
 const gui = new GUI();
 const params = {
   fps: 60,
-  zoom: 0.01,
+  zoom: 1,
   backgroundTicks: 60,
   textSpread: 0,
   maxSpawns: 1,
   textAlpha: 0.0,
-  textTicks: 1
+  textTicks: 1,
 };
 gui.add(params, "fps", 0.1, 60);
-gui.add(params, "zoom", 0.001, 0.5);
+gui.add(params, "zoom", 1, 20);
 gui.add(params, "backgroundTicks", 1, 600).step(1);
 const textFolder = gui.addFolder("Text");
 textFolder.add(params, "textSpread", 0, 200);
@@ -24,4 +24,4 @@ textFolder.add(params, "textTicks", 1, 600).step(1);
 
 gui.onChange((e) => {
   socket.emit("paramUpdate", { key: e.property, value: e.value });
-});
+});

frontend/js/sketch.js

@@ -5,7 +5,7 @@ const socket = io("http://localhost:3000");
 
 const params = {
   fps: 60,
-  zoom: 0.1,
+  zoom: 1, //in pixels per pixel
   backgroundTicks: 60,
   textSpread: 0,
   maxSpawns: 1,
@@ -135,8 +135,8 @@ const sketch = (p) => {
     // current width/height
 
     if (bgTick++ == 0) {
-      cw = Math.floor(imageW * params.zoom);
-      ch = Math.floor(imageH * params.zoom);
+      cw = Math.floor(p.width * params.zoom);
+      ch = Math.floor(p.height * params.zoom);
       // random starting position
       // subtract cw/ch to avoid going out of bounds
       sx = Math.random(0) * (imageW - cw);