From 6fcfb5767a646dfdeca5f06092b101526e682dc0 Mon Sep 17 00:00:00 2001 From: Thomas Kennedy Date: Sun, 19 May 2024 22:57:32 -0500 Subject: [PATCH] Eye color V1 --- public/editor/CompareFaceModal.tsx | 2 +- public/editor/defaultColors.ts | 6 +++ public/editor/stateStore.ts | 10 ++++ src/display.ts | 22 ++++++++ src/generate.ts | 2 +- src/globals.ts | 8 +-- svgs/eye/eye1.svg | 25 +++++---- svgs/eye/eye10.svg | 78 +++------------------------- svgs/eye/eye11.svg | 81 +++--------------------------- svgs/eye/eye12.svg | 21 +++----- svgs/eye/eye13.svg | 21 +++----- svgs/eye/eye14.svg | 20 +++----- svgs/eye/eye15.svg | 21 +++----- svgs/eye/eye16.svg | 21 +++----- svgs/eye/eye17.svg | 21 +++----- svgs/eye/eye18.svg | 21 +++----- svgs/eye/eye19.svg | 21 +++----- svgs/eye/eye2.svg | 18 +++---- svgs/eye/eye3.svg | 28 ++++------- svgs/eye/eye4.svg | 18 +++---- svgs/eye/eye5.svg | 21 +++----- svgs/eye/eye6.svg | 21 +++----- svgs/eye/eye7.svg | 19 +++---- svgs/eye/eye8.svg | 18 +++---- svgs/eye/eye9.svg | 19 +++---- 25 files changed, 197 insertions(+), 366 deletions(-) diff --git a/public/editor/CompareFaceModal.tsx b/public/editor/CompareFaceModal.tsx index 2a2665d..ddbf4da 100644 --- a/public/editor/CompareFaceModal.tsx +++ b/public/editor/CompareFaceModal.tsx @@ -61,7 +61,7 @@ const CompareFaceGrid = ({ {featureAOverrideList.flatMap((featureAOverride, indexA) => featureBOverrideList.map((featureBOverride, indexB) => { const faceConfigCopy = deepCopy(faceConfig); - let faceOverride = {}; + const faceOverride = {}; setToDict(faceOverride, featureA, featureAOverride.value); setToDict(faceOverride, featureB, featureBOverride.value); override(faceConfigCopy, faceOverride); diff --git a/public/editor/defaultColors.ts b/public/editor/defaultColors.ts index a7ea3ce..17d5c15 100644 --- a/public/editor/defaultColors.ts +++ b/public/editor/defaultColors.ts @@ -37,3 +37,9 @@ export const distinctHairColors = distinct( .map((c) => c.hair) .flat(), ); + +export const distinctEyeColors = distinct( + Object.values(colors) + .map((c) => c.eyes) + .flat(), +); diff --git a/public/editor/stateStore.ts b/public/editor/stateStore.ts index 2e14eb3..6e66d19 100644 --- a/public/editor/stateStore.ts +++ b/public/editor/stateStore.ts @@ -5,6 +5,7 @@ import { generateRangeFromStep, getFromDict, roundTwoDecimals } from "./utils"; import { distinctHairColors, distinctSkinColors, + distinctEyeColors, jerseyColorOptions, } from "./defaultColors"; import { FaceConfig, Gender, Race, Sport } from "../../src/types"; @@ -123,6 +124,15 @@ const gallerySectionInfos: (Pick< text: "Eye Shape", selectionType: "svgs", }, + { + key: "eye.color", + text: "Eye Color", + selectionType: "color", + colorFormat: "hex", + renderOptions: { + valuesToRender: distinctEyeColors, + }, + }, { key: "eye.size", text: "Eye Size", diff --git a/src/display.ts b/src/display.ts index 80b8429..e2edf24 100644 --- a/src/display.ts +++ b/src/display.ts @@ -650,6 +650,28 @@ const drawFeature = ( translate(childElement, distance, 0, "left", "top"); } + if (info.name === "eye") { + for (const granchildElement of childElement.children) { + if (granchildElement.getAttribute("fill") === `$[eyeReflection${i}]`) { + granchildElement.setAttribute("fill", "white"); + if (i === 1) { + const parentTransform = + childElement.getAttribute("transform") || ""; + const rotateRegex = /rotate\(([^)]+)\)/; + const match = parentTransform.match(rotateRegex); + const parentRotate = match ? match[0] : null; + // @ts-ignore + addTransform(granchildElement as SVGGraphicsElement, parentRotate); + } + } else if ( + granchildElement.getAttribute("fill") === + `$[eyeReflection${(i + 1) % 2}]` + ) { + granchildElement.setAttribute("fill", "none"); + } + } + } + if (info.name === "earring") { translate( childElement as SVGGraphicsElement, diff --git a/src/generate.ts b/src/generate.ts index 3b4fa43..8c261b7 100644 --- a/src/generate.ts +++ b/src/generate.ts @@ -172,7 +172,7 @@ export const generate = ( id: Math.random() < 0.5 ? getID("facialHair", false, { gender }) : "none", }, eye: { - id: getID("eye", false, { gender }), + id: getID("eye", true, { gender }), angle: eyeAngle, color: eyeColor, size: roundTwoDecimals(0.9 + Math.random() * 0.2), diff --git a/src/globals.ts b/src/globals.ts index a35e333..e96160e 100644 --- a/src/globals.ts +++ b/src/globals.ts @@ -37,22 +37,22 @@ export const colors = { "#e9c67b", "#D7BF91", ], - eyes: ["#b3d1ff", "#a5b8d2", "#8a7d5e"], + eyes: ["#a5b8d2", "#5c3937", "#634E34", "#2e536f", "#497665"], }, asian: { // https://imgur.com/a/GrBuWYw skin: ["#fedac7", "#f0c5a3", "#eab687"], hair: ["#272421", "#0f0902"], - eyes: ["#b3d1ff", "#a5b8d2", "#8a7d5e"], + eyes: ["#5c3937", "#634E34"], }, brown: { skin: ["#bb876f", "#aa816f", "#a67358"], hair: ["#272421", "#1c1008"], - eyes: ["#b3d1ff", "#a5b8d2", "#8a7d5e"], + eyes: ["#5c3937", "#634E34"], }, black: { skin: ["#ad6453", "#74453d", "#5c3937"], hair: ["#272421"], - eyes: ["#b3d1ff", "#a5b8d2", "#8a7d5e"], + eyes: ["#5c3937", "#634E34"], }, }; diff --git a/svgs/eye/eye1.svg b/svgs/eye/eye1.svg index 4fa4931..d2e457b 100644 --- a/svgs/eye/eye1.svg +++ b/svgs/eye/eye1.svg @@ -1,11 +1,14 @@ - - - - - - - \ No newline at end of file + + + + + + + + + + + + + + diff --git a/svgs/eye/eye10.svg b/svgs/eye/eye10.svg index cbf0c52..203641a 100644 --- a/svgs/eye/eye10.svg +++ b/svgs/eye/eye10.svg @@ -1,73 +1,7 @@ - - - - - - image/svg+xml - - - - - - - - - - - - + + + + + + diff --git a/svgs/eye/eye11.svg b/svgs/eye/eye11.svg index 320b56d..94474b2 100644 --- a/svgs/eye/eye11.svg +++ b/svgs/eye/eye11.svg @@ -1,75 +1,8 @@ - - - - - - image/svg+xml - - - - - - - - - - - - - + + + + + + + diff --git a/svgs/eye/eye12.svg b/svgs/eye/eye12.svg index 2c3accf..e05ccbe 100644 --- a/svgs/eye/eye12.svg +++ b/svgs/eye/eye12.svg @@ -1,13 +1,8 @@ - - - - - - - - - \ No newline at end of file + + + + + + + + diff --git a/svgs/eye/eye13.svg b/svgs/eye/eye13.svg index 85f78e9..1a0af38 100644 --- a/svgs/eye/eye13.svg +++ b/svgs/eye/eye13.svg @@ -1,13 +1,8 @@ - - - - - - - - - \ No newline at end of file + + + + + + + + diff --git a/svgs/eye/eye14.svg b/svgs/eye/eye14.svg index 947ba95..ac9be89 100644 --- a/svgs/eye/eye14.svg +++ b/svgs/eye/eye14.svg @@ -1,12 +1,8 @@ - - - - - - - - \ No newline at end of file + + + + + + + + diff --git a/svgs/eye/eye15.svg b/svgs/eye/eye15.svg index f018f6d..dd72cb1 100644 --- a/svgs/eye/eye15.svg +++ b/svgs/eye/eye15.svg @@ -1,13 +1,8 @@ - - - - - - - - - \ No newline at end of file + + + + + + + + diff --git a/svgs/eye/eye16.svg b/svgs/eye/eye16.svg index 8c06301..dbe94b2 100644 --- a/svgs/eye/eye16.svg +++ b/svgs/eye/eye16.svg @@ -1,13 +1,8 @@ - - - - - - - - \ No newline at end of file + + + + + + + + diff --git a/svgs/eye/eye17.svg b/svgs/eye/eye17.svg index 919bf6c..c125950 100644 --- a/svgs/eye/eye17.svg +++ b/svgs/eye/eye17.svg @@ -1,13 +1,8 @@ - - - - - - - - \ No newline at end of file + + + + + + + + diff --git a/svgs/eye/eye18.svg b/svgs/eye/eye18.svg index 0724811..89452e2 100644 --- a/svgs/eye/eye18.svg +++ b/svgs/eye/eye18.svg @@ -1,13 +1,8 @@ - - - - - - - - \ No newline at end of file + + + + + + + + diff --git a/svgs/eye/eye19.svg b/svgs/eye/eye19.svg index 4f1b5a0..2bc7e3f 100644 --- a/svgs/eye/eye19.svg +++ b/svgs/eye/eye19.svg @@ -1,13 +1,8 @@ - - - - - - - - \ No newline at end of file + + + + + + + + diff --git a/svgs/eye/eye2.svg b/svgs/eye/eye2.svg index 1465a21..3ce8c8d 100644 --- a/svgs/eye/eye2.svg +++ b/svgs/eye/eye2.svg @@ -1,11 +1,7 @@ - - - - - - - \ No newline at end of file + + + + + + + diff --git a/svgs/eye/eye3.svg b/svgs/eye/eye3.svg index d13bc86..e3f2000 100644 --- a/svgs/eye/eye3.svg +++ b/svgs/eye/eye3.svg @@ -1,19 +1,9 @@ - - - - - - - - - - - + + + + + + + + + diff --git a/svgs/eye/eye4.svg b/svgs/eye/eye4.svg index c3cae32..3ff0640 100644 --- a/svgs/eye/eye4.svg +++ b/svgs/eye/eye4.svg @@ -1,11 +1,7 @@ - - - - - - - \ No newline at end of file + + + + + + + diff --git a/svgs/eye/eye5.svg b/svgs/eye/eye5.svg index 8bdb9a0..f1cdbb0 100644 --- a/svgs/eye/eye5.svg +++ b/svgs/eye/eye5.svg @@ -1,13 +1,8 @@ - - - - - - - - \ No newline at end of file + + + + + + + + diff --git a/svgs/eye/eye6.svg b/svgs/eye/eye6.svg index 0cde49d..85a1535 100644 --- a/svgs/eye/eye6.svg +++ b/svgs/eye/eye6.svg @@ -1,13 +1,8 @@ - - - - - - - - \ No newline at end of file + + + + + + + + diff --git a/svgs/eye/eye7.svg b/svgs/eye/eye7.svg index 0b4fabb..87511ed 100644 --- a/svgs/eye/eye7.svg +++ b/svgs/eye/eye7.svg @@ -1,11 +1,8 @@ - - - - - - - \ No newline at end of file + + + + + + + + diff --git a/svgs/eye/eye8.svg b/svgs/eye/eye8.svg index a2c5d77..36f4133 100644 --- a/svgs/eye/eye8.svg +++ b/svgs/eye/eye8.svg @@ -1,11 +1,7 @@ - - - - - - - \ No newline at end of file + + + + + + + diff --git a/svgs/eye/eye9.svg b/svgs/eye/eye9.svg index 534cffe..a267c40 100644 --- a/svgs/eye/eye9.svg +++ b/svgs/eye/eye9.svg @@ -1,11 +1,8 @@ - - - - - - - \ No newline at end of file + + + + + + + +