UI to make relatives kind of works

Author: dumbmatter

public/editor/shuffleFace.ts

@@ -3,7 +3,8 @@ import { generate } from "../../src/generate";
 import { CombinedState, GallerySectionConfig } from "./types";
 import { deleteFromDict, pickRandom } from "./utils";
 import { jerseyColorOptions } from "./defaultColors";
-import { deepCopy } from "../../src/utils";
+import { deepCopy, randChoice } from "../../src/utils";
+import { makeRelative } from "../../src/makeRelative";
 
 type GenerateOptions = Parameters<typeof generate>[1];
 
@@ -12,8 +13,26 @@ export const shuffleEntireFace = (
   gallerySectionConfigList: GallerySectionConfig[],
   stateStore: CombinedState,
 ) => {
-  const { setFaceStore, shuffleGenderSettingObject, shuffleRaceSettingObject } =
-    stateStore;
+  const {
+    setFaceStore,
+    shuffleGenderSettingObject,
+    shuffleRaceSettingObject,
+    shuffleOtherSettingObject,
+  } = stateStore;
+
+  if (shuffleOtherSettingObject.includes("relative")) {
+    // Special case for relative - ignore randomizeEnabled and race
+    const gender =
+      shuffleGenderSettingObject.length === 1
+        ? shuffleGenderSettingObject[0]
+        : randChoice(["male", "female"] as const);
+
+    const newFace = makeRelative({ gender, relative: faceConfig });
+    setFaceStore(newFace);
+
+    return;
+  }
+
   const faceConfigCopy: Overrides = deepCopy(faceConfig);
 
   const options: GenerateOptions = {};

src/generate.ts

@@ -1,18 +1,7 @@
 import override from "./override.js";
 import { svgsGenders, svgsIndex } from "./svgs-index.js";
 import { Feature, Gender, Overrides, Race, TeamColors } from "./types.js";
-
-const randInt = (a: number, b: number): number => {
-  return Math.floor(Math.random() * (1 + b - a)) + a;
-};
-
-const randUniform = (a: number, b: number): number => {
-  return Math.random() * (b - a) + a;
-};
-
-const randChoice = <T>(array: T[]): T => {
-  return array[Math.floor(Math.random() * array.length)];
-};
+import { randChoice, randInt, randUniform } from "./utils.js";
 
 const getID = (type: Feature, gender: Gender): string => {
   const validIDs = svgsIndex[type].filter((_id, index) => {
@@ -75,6 +64,10 @@ export const numberRanges = {
     female: [-15, 20],
     male: [-15, 20],
   },
+  "head.shave": {
+    female: [0, 0],
+    male: [0, 0.2],
+  },
   "nose.size": {
     female: [0.5, 1],
     male: [0.5, 1.25],
@@ -150,7 +143,7 @@ export const generate = (
       id: getID("head", gender),
       shave: `rgba(0,0,0,${
         gender === "male" && Math.random() < 0.25
-          ? roundTwoDecimals(Math.random() / 5)
+          ? getRandUniform("head.shave", gender)
           : 0
       })`,
     },

src/utils.ts

@@ -1,3 +1,15 @@
 export const deepCopy = <T>(object: T): T => {
   return JSON.parse(JSON.stringify(object));
 };
+
+export const randInt = (a: number, b: number): number => {
+  return Math.floor(Math.random() * (1 + b - a)) + a;
+};
+
+export const randUniform = (a: number, b: number): number => {
+  return Math.random() * (b - a) + a;
+};
+
+export const randChoice = <T>(array: T[]): T => {
+  return array[Math.floor(Math.random() * array.length)];
+};