From 6a0d2470a1d2815681c2a58b5253489fdd578e8d Mon Sep 17 00:00:00 2001
From: Mike Lynch <m.lynch@sydney.edu.au>
Date: Sat, 19 Apr 2025 18:27:58 +0800
Subject: [PATCH] Added hyperbolic vignettes in and out

---
 src/components/dots.js | 27 +++++++++++++++------------
 1 file changed, 15 insertions(+), 12 deletions(-)

diff --git a/src/components/dots.js b/src/components/dots.js
index b34cd15..d68efc8 100644
--- a/src/components/dots.js
+++ b/src/components/dots.js
@@ -11,8 +11,10 @@ const RADIUS_OPTS = [
 	"right-down",
 	"left-up",
 	"left-down",
-	"in",
-	"out",
+	"circle-in",
+	"circle-out",
+	"hyper-in",
+	"hyper-out",
 	"noise",
 ];
 
@@ -26,8 +28,10 @@ const RADIUS_DESC = {
 	"right-down": "getting larger towards the lower right",
 	"left-up": "getting larger towards the upper left",
 	"left-down": "getting larger towards the lower left",
-	"in": "getting larger in the centre",
-	"out": "getting larger at the edges",
+	"circle-in": "forming a circle at the centre",
+	"circle-out": "leaving a circular gap at the centre",
+	"hyper-in": "forming a starlike pattern at the centre",
+	"hyper-out": "leaving a starlike pattern gap in the centre",
 	"noise": "of random sizes",
 }
 
@@ -35,6 +39,7 @@ function distance(dx, dy) {
 	return Math.sqrt(dx ** 2 + dy ** 2);
 }
 
+
 function int_range(v1, v2) {
 	const vs = [v1, v2];
 	vs.sort((a, b) => a - b);
@@ -92,16 +97,14 @@ class DotMaker {
 	      		return 0.5 * maxr * (d.x + d.y) / this.wh;
 	      	case "left-down":
 	      		return 0.5 * maxr * (this.width - d.x + d.y) / this.wh;
-	      	case "out":
+	      	case "circle-out":
 	      		return 2 * maxr * distance((d.x - this.cx), (d.y - this.cy)) / this.wh;
-	      	case "in":
+	      	case "circle-in":
 	      		return 2 * maxr * (0.5 * this.wh - distance((d.x - this.cx), (d.y - this.cy))) / this.wh;
-
-	      	// case "hyper-out":
-	      	// 	return 2 * maxr * Math.abs(d.x - this.cx) (d.y - this.cy)) / this.width;
-	      	// case "hyper-in":
-	      	// 	return 2 * maxr * (0.5 * this.width - distance((d.x - this.cx), (d.y - this.cy))) / this.width;
-
+	      	case "hyper-in":
+	      		return maxr * Math.abs((d.x - this.cx) * (d.y - this.cy)) / this.wh;
+	      	case "hyper-out":
+	      		return maxr * (1 - Math.abs((d.x - this.cx) * (d.y - this.cy)) / this.wh);
 	      	case "noise":
 	      		return maxr * Math.random();
 	    	default: