docs/system.dj

@@ -12,8 +12,7 @@ These descriptions read like this:
 stroke
   thickness : number
   color : rgba
-  from : vec
-  to : vec
+  position : vec
   -> scribble
 ```
 
@@ -29,13 +28,13 @@ The argument name usually does not matter when calling the function - it is only
 
 The argument _type_ however is important.
 If you try to use a function with the wrong type of value as its argument, it will fail with an error.
-For example, consider a brush where we pass a bunch of numbers into `stroke`'s arguments.
+For example, consider a brush where we pass a number as `stroke`'s `color` and `position` arguments.
 
 ```haku
-stroke 1 1 1 1
+stroke 1 1 1
 ```
 
-This brush will fail to render, since `stroke` expects an `rgba` as its 2nd argument, and `vec`s as its 3rd and 4th arguments.
+This brush will fail to render, since `stroke` expects an `rgba` as its 2nd argument.
 
 With that said, there are several types of values in haku that can be passed into, and returned by functions.
 
@@ -455,13 +454,18 @@ Note that `and` and `or` are currently missing from this list, but are reserved
 You can implement them using regular functions as a replacement.
 
 ```haku
-and' = \a, b ->
-  if (a) b
-  else a
+boolAnd = \a, b ->
+  if (a)
+    if (b) True
+    else False
+  else False
 
-or' = \a, b ->
-  if (a) a
-  else b
+boolOr = \a, b ->
+  if (a)
+    True
+  else
+    if (b) True
+    else False
 ```
 
 
@@ -590,8 +594,7 @@ Before scribbles are drawn to the wall, colors are converted to 8-bit integers f
 This means some loss of precision will happen, which may cause issues with brushes like this one:
 
 ```haku
-withDotter \d ->
-  stroke 128 #00000004 d.From d.To
+stroke 128 #00000004 (vec 0 0)
 ```
 
 If you try to to use this brush to fill up a single spot with black, you will notice that despite all the math suggesting so, the color will end up gray instead.
@@ -713,19 +716,88 @@ join: \a, b -> flatten [a, b]
 ```
 
 
+## Shapes
+
+```haku
+toShape
+  value : _
+  -> () | shape
+```
+
+Converts the given value to a shape.
+
+- For `shape`, clones the shape that was passed in.
+- For `vec`, returns a point `shape`.
+- For anything else, returns `()`.
+
+```haku
+line
+  start : vec
+  end : vec
+  -> shape
+```
+
+Creates a line segment shape with the provided `start` and `end` points.
+
+```haku
+rect
+  position : vec
+  size : vec
+  -> shape
+
+rect
+  x : number
+  y : number
+  width : number
+  height : number
+  -> shape
+```
+
+Creates a rectangle shape with its top-left corner at `position`, with a given `size` stretching from the top-left corner.
+
+The alternative 4-argument version takes in the rectangle's X/Y coordinates, width, and height as separate arguments instead of aggregating them into a `vec`.
+
+```haku
+circle
+  center : vec
+  radius : number
+  -> shape
+
+circle
+  x : number
+  y : number
+  radius : number
+  -> shape
+```
+
+Creates a circle shape, with its center at `center`, with the provided radius.
+
+The alternative 3-argument version takes in the circle's center X/Y coordinates as separate arguments instead of aggregating them into a `vec`.
+
 ## Scribbles
 
 ```haku
 stroke
   thickness : number
   color : rgba
-  from : vec
-  to : vec
+  shape : shapeLike
   -> scribble
 ```
 
-Creates a stroke scribble, which draws a line between the two points `from` and `to`, with the provided `thickness` and `color`.
-The line's caps are round, to make strokes connect neatly with each other.
+Creates a stroke scribble, which outlines the provided shape with a stroke of the given thickness and color.
+
+Point shapes are drawn as circles, and `line` shapes have round caps at the line's endpoints.
+
+```haku
+fill
+  color : rgba
+  shape : shapeLike
+  -> scribble
+```
+
+Creates a fill scribble, which fills in the entire area of the provided shape with a solid color.
+
+Since this requires the shape to have a surface area, this does not do anything when point and `line` shapes are passed in.
 
 
 ## Reticles

static/live-reload.js

@@ -1,13 +1,8 @@
-let shouldReload = true;
-addEventListener("beforeunload", () => {
-    shouldReload = false;
-});
-
 // NOTE: The server never fulfills this request, it stalls forever.
 // Once the connection is closed, we try to connect with the server until we establish a successful
 // connection. Then we reload the page.
 await fetch("/auto-reload/stall").catch(async () => {
-    while (shouldReload) {
+    while (true) {
         try {
             let response = await fetch("/auto-reload/back-up");
             if (response.status == 200) {