From 0ef71177c730666a2462dae499de521583e6b8e4 Mon Sep 17 00:00:00 2001
From: mehbark <terezi@pyrope.net>
Date: Sun, 3 Sep 2023 08:08:24 -0400
Subject: [PATCH] grass: what the heck, done enough

---
 html/blowing-in-the-wind.tsx | 154 ++++++++++++++++++++++++++++++++++-
 1 file changed, 150 insertions(+), 4 deletions(-)

diff --git a/html/blowing-in-the-wind.tsx b/html/blowing-in-the-wind.tsx
index ca2a983..66f52e0 100644
--- a/html/blowing-in-the-wind.tsx
+++ b/html/blowing-in-the-wind.tsx
@@ -57,6 +57,141 @@ const Blade = ({ x, y }: { x: number; y: number }) => (
     </b>
 );
 
+// ☺ is too inconsistently rendered i think
+const statics = "r•gbpM".split("");
+const static_colors: Record<string, string[]> = {
+    r: ["rgb(215, 155, 45)"],
+    // turns out df has a lot of rocks
+    // there are repeated colors but that should be good for recreating the general distribution
+    "•": [
+        "rgb(255, 255, 255)",
+        "rgb(215, 155, 45)",
+        "rgb(160, 160, 160)",
+        "rgb(215, 155, 45)",
+        "rgb(255, 255, 255)",
+        "rgb(255, 255, 255)",
+        "rgb(215, 155, 45)",
+        "rgb(255, 255, 255)",
+        "rgb(215, 155, 45)",
+        "rgb(160, 160, 160)",
+        "rgb(215, 155, 45)",
+        "rgb(160, 160, 160)",
+        "rgb(160, 160, 160)",
+        "rgb(192, 192, 192)",
+        "rgb(160, 160, 160)",
+        "rgb(160, 160, 160)",
+        "rgb(192, 192, 192)",
+        "rgb(160, 160, 160)",
+        "rgb(160, 160, 160)",
+        "rgb(192, 192, 192)",
+        "rgb(255, 255, 255)",
+        "rgb(192, 192, 192)",
+        "rgb(255, 255, 255)",
+        "rgb(215, 155, 45)",
+        "rgb(160, 160, 160)",
+    ],
+    g: ["white"],
+    b: [
+        "rgb(160, 160, 160)",
+        "rgb(192, 192, 192)",
+        "rgb(192, 192, 192)",
+        "rgb(215, 155, 45)",
+        "rgb(215, 155, 45)",
+        "rgb(255, 17, 58)",
+        "rgb(140, 102, 255)",
+        "rgb(215, 155, 45)",
+        "rgb(215, 155, 45)",
+        "rgb(160, 160, 160)",
+        "rgb(215, 155, 45)",
+        "rgb(160, 160, 160)",
+        "rgb(160, 160, 160)",
+        "rgb(160, 160, 160)",
+        "rgb(255, 255, 255)",
+        "rgb(255, 255, 255)",
+        "rgb(255, 113, 17)",
+        "rgb(167, 60, 213)",
+        "rgb(215, 155, 45)",
+        "rgb(215, 155, 45)",
+        "rgb(160, 160, 160)",
+        "rgb(160, 160, 160)",
+        "rgb(162, 220, 52)",
+    ],
+    p: [
+        "rgb(140, 102, 255)",
+        "rgb(232, 17, 255)",
+        "rgb(140, 102, 255)",
+        "rgb(192, 192, 192)",
+        "rgb(192, 192, 192)",
+        "rgb(215, 155, 45)",
+        "rgb(215, 155, 45)",
+        "rgb(19, 253, 101)",
+        "rgb(215, 155, 45)",
+        "rgb(215, 155, 45)",
+        "rgb(232, 17, 255)",
+        "rgb(215, 155, 45)",
+        "rgb(215, 155, 45)",
+        "rgb(255, 17, 58)",
+        "rgb(255, 17, 58)",
+        "rgb(140, 102, 255)",
+        "rgb(255, 255, 255)",
+        "rgb(140, 102, 255)",
+        "rgb(160, 160, 160)",
+        "rgb(255, 255, 255)",
+        "rgb(215, 155, 45)",
+        "rgb(215, 155, 45)",
+        "rgb(160, 160, 160)",
+        "rgb(160, 160, 160)",
+    ],
+    M: [
+        "rgb(192, 192, 192)",
+        "rgb(215, 155, 45)",
+        "rgb(18, 254, 207)",
+        "rgb(192, 192, 192)",
+        "rgb(160, 160, 160)",
+        "rgb(140, 102, 255)",
+        "rgb(19, 253, 101)",
+        "rgb(192, 192, 192)",
+        "rgb(215, 155, 45)",
+        "rgb(215, 155, 45)",
+        "rgb(160, 160, 160)",
+        "rgb(215, 155, 45)",
+        "rgb(215, 155, 45)",
+        "rgb(192, 192, 192)",
+        "rgb(160, 160, 160)",
+        "rgb(215, 155, 45)",
+        "rgb(215, 155, 45)",
+        "rgb(215, 155, 45)",
+        "rgb(215, 155, 45)",
+        "rgb(215, 155, 45)",
+        "rgb(215, 155, 45)",
+        "rgb(232, 17, 255)",
+        "rgb(255, 17, 58)",
+        "rgb(255, 113, 17)",
+        "rgb(160, 160, 160)",
+        "rgb(160, 160, 160)",
+        "rgb(255, 113, 17)",
+        "rgb(255, 113, 17)",
+        "rgb(215, 155, 45)",
+        "rgb(215, 155, 45)",
+        "rgb(160, 160, 160)",
+        "rgb(18, 254, 207)",
+        "rgb(160, 160, 160)",
+    ],
+};
+const StaticGuy = () => {
+    const stat = pick_random(statics);
+    return (
+        <b
+            style={{
+                overflow: "hidden",
+                color: pick_random(static_colors[stat]),
+            }}
+        >
+            {stat}
+        </b>
+    );
+};
+
 const Field = ({ width }: { width: number }) => (
     <div
         style={{
@@ -65,17 +200,27 @@ const Field = ({ width }: { width: number }) => (
             display: "grid",
             gridTemplateRows: `repeat(${width}, 1fr)`,
             gridTemplateColumns: `repeat(${width}, 1fr)`,
-            fontFamily: "monospace",
+            // what dfwiki uses
+            fontFamily:
+                '"Courier New", "Quicktype Mono", "Bitstream Vera Sans Mono", "Lucida Console", "Lucida Sans Typewriter", monospace',
             // brown doesn't really work because the grass isn't dense enough
             // maybe a complete dfivorce isn't in order
             backgroundColor: "black",
             fontWeight: "bolder",
             fontSize: "1.1rem",
+            // shweet
+            lineHeight: "100%",
         }}
     >
-        {new Array(width * width).fill(undefined).map((_, i) => (
-            <Blade x={i % width} y={Math.floor(i / width)} />
-        ))}
+        {new Array(width * width)
+            .fill(undefined)
+            .map((_, i) =>
+                Math.random() < 0.05 ? (
+                    <StaticGuy />
+                ) : (
+                    <Blade x={i % width} y={Math.floor(i / width)} />
+                )
+            )}
     </div>
 );
 
@@ -85,4 +230,5 @@ const Field = ({ width }: { width: number }) => (
 // inspired me. i'm going to work on this tomorrow and do the hawd thing (waves)
 
 // adding more grass doesn't really help and mainly just causes size problems
+// takes some shuffling to get a nice distribution of statics
 render_and_copy(<Field width={25} />);