From a74799d393541de7f96fd6c296e3427231bd2830 Mon Sep 17 00:00:00 2001
From: mehbark <terezi@pyrope.net>
Date: Sat, 2 Sep 2023 21:08:44 -0400
Subject: [PATCH] add pick_random

---
 html/blowing-in-the-wind.tsx                  | 19 +++++++++++++++++++
 html/common.tsx                               |  5 +++++
 .../ftct/0041369101dgarbuxqebicopauyrzp.html  |  3 ++-
 3 files changed, 26 insertions(+), 1 deletion(-)

diff --git a/html/blowing-in-the-wind.tsx b/html/blowing-in-the-wind.tsx
index e69de29..d1b2c83 100644
--- a/html/blowing-in-the-wind.tsx
+++ b/html/blowing-in-the-wind.tsx
@@ -0,0 +1,19 @@
+import { Main, pick_random, render_and_copy } from "./common.tsx";
+
+// thanks, https://dwarffortresswiki.org/index.php/Grass
+const grass_chars = ".,'`".split("");
+const Blade = () => <div>{pick_random(grass_chars)}</div>;
+
+const Field = ({ width }: { width: number }) => (
+    <div
+        style={{
+            width: "100%",
+            aspectRatio: "1",
+            display: "grid",
+            gridRow: `repeat(1fr, ${width})`,
+            gridColumn: `repeat(1fr, ${width})`,
+        }}
+    ></div>
+);
+
+render_and_copy(<Field width={50} />);
diff --git a/html/common.tsx b/html/common.tsx
index 53e4b7d..14f2a30 100644
--- a/html/common.tsx
+++ b/html/common.tsx
@@ -187,3 +187,8 @@ export const static_url = (res: string) => `https://static.pyrope.net/${res}`;
 
 export const randirect = (...urls: string[]) =>
     `https://pyrope.net/randirect#${urls.join("::")}`;
+
+// could do some [T, ...T[]] shenanigans for totality but meh
+// kinda bad name
+export const pick_random = <T,>(xs: T[]): T =>
+    xs[Math.floor(Math.random() * xs.length)];
diff --git a/static/ftct/0041369101dgarbuxqebicopauyrzp.html b/static/ftct/0041369101dgarbuxqebicopauyrzp.html
index b728fc2..98e62b8 100644
--- a/static/ftct/0041369101dgarbuxqebicopauyrzp.html
+++ b/static/ftct/0041369101dgarbuxqebicopauyrzp.html
@@ -8,7 +8,7 @@
     <style>
         body {
             margin: 0 auto;
-            width: min(500px, 100vw);
+            width: min(500px, 96vw);
         }
     </style>
 </head>
@@ -36,3 +36,4 @@ winners:
 
 </body>
 </html>
+