More dice stuff

lib/ttcQuery/DiceChart.tsx

@@ -0,0 +1,48 @@
+import { FC } from "react";
+
+export const DiceChart: FC<{ dice: Record<string, number> }> = ({ dice }) => {
+  const data = Object.entries(dice).sort((a, b) => Number(a[0]) - Number(b[0]));
+
+  const max = Math.max(...data.map((d) => d[1]));
+  const _min = Math.min(...data.map((d) => d[1]));
+
+  const uniqueValues = Array.from(new Set(data.map((d) => d[1])));
+
+  return (
+    <div className="p-8 bg-black/30 rounded-md max-w-[35rem]">
+      <div className="relative flex px-2 gap-1 justify-around items-end h-48 border-b border-l">
+        <div className="absolute inset-0 flex flex-col-reverse">
+          {uniqueValues.map((_, i) => (
+            <div
+              key={"dicechartline" + i}
+              className="relative w-full border-t border-mixed-300/50 flex-grow"
+            >
+              {/* <div className="absolute right-full text-xs flex items-center -translate-y-1/2">
+                <span>
+                  {Math.round(max / uniqueValues.length) * (i + 1)} {}
+                </span>
+                <div className="border-b w-1 ml-1"></div>
+              </div> */}
+            </div>
+          ))}
+        </div>
+        {data.map((d) => (
+          <div
+            key={"dice" + d[0]}
+            title={d[0] + ": " + d[1]}
+            className="flex-grow px-[1px] border hover:border-mixed-300/50 border-transparent h-full flex transition-colors rounded-md @container"
+          >
+            <div
+              className="bg-purple-800 relative rounded-t-sm w-full mt-auto"
+              style={{ height: (d[1] / max) * 100 + "%" }}
+            >
+              <span className="absolute top-full left-1/2 -translate-x-1/2 text-xs @[.75rem]:inline hidden">
+                {d[0]}
+              </span>
+            </div>
+          </div>
+        ))}
+      </div>
+    </div>
+  );
+};

lib/ttcQuery/TTCResolvers.ts

@@ -1,4 +1,7 @@
+/* eslint-disable react/display-name */
 import { Dice } from "../dice";
+import { sum } from "../utils/sum";
+import { DiceChart } from "./DiceChart";
 import { TTCQueryParser } from "./TTCQueryParser";
 
 export class TTCQueryResolver {
@@ -68,13 +71,25 @@ export class TTCQueryResolver {
     if (n && n.startsWith("$")) num = this.getFromStack(n);
     switch (method) {
       case "roll":
-        return () => d.roll();
+        return () => d.roll().total;
       case "rollAvg":
         return () => d.rollAvg();
       case "rollTimes":
         return () => d.rollTimes(num);
       case "rollTimesAvg":
         return () => d.rollTimesAvg(num);
+      case "rollLowest":
+        return () => d.rollMin();
+      case "rollHighest":
+        return () => d.rollMax();
+      case "rollDropHighest":
+        return () => sum(...d.roll().results.toSorted().toSpliced(-1, 1));
+      case "rollDropLowest":
+        return () => sum(...d.roll().results.toSorted().toSpliced(0, 1));
+      case "distribution":
+        return () => DiceChart({ dice: d.getRollDistribution() });
+      case "distribution.normalized":
+        return () => DiceChart({ dice: d.getNormalizedRollDistribution() });
       default:
         return "No valid method provided for dice";
     }