diff --git a/public/locales/compatibility-v2/en/male_en.json b/public/locales/compatibility-v2/en/male_en.json index 05d5398..1757def 100644 --- a/public/locales/compatibility-v2/en/male_en.json +++ b/public/locales/compatibility-v2/en/male_en.json @@ -268,7 +268,10 @@ }, "/let-scan": { "title": "We Are Scanning Your Palm", - "text": "Follow the on-screen instructions so we can analyze the lines of your palm, revealing the future and the secrets of your destiny!" + "text": "Follow the on-screen instructions so we can analyze the lines of your palm, revealing the future and the secrets of your destiny!", + "hands": { + "title": "Сейчас сканируют ладонь человек:" + } }, "/scan-instruction": { "title": "Photograph Your Palm as Shown", diff --git a/public/locales/palmistry-v1/en/male_en.json b/public/locales/palmistry-v1/en/male_en.json index bab2771..2b44d2f 100644 --- a/public/locales/palmistry-v1/en/male_en.json +++ b/public/locales/palmistry-v1/en/male_en.json @@ -137,7 +137,10 @@ }, "/let-scan": { "title": "We are scanning your palm", - "text": "Follow the on-screen instructions so we can analyze the lines of your palm, revealing the future and the secrets of your destiny!" + "text": "Follow the on-screen instructions so we can analyze the lines of your palm, revealing the future and the secrets of your destiny!", + "hands": { + "title": "Сейчас сканируют ладонь человек:" + } }, "biometric_data": "We do not collect biometric data. The entire recognition process happens on your device.", "/scan-instruction": { diff --git a/public/users-hands/1.webp b/public/users-hands/1.webp new file mode 100644 index 0000000..0ed531b Binary files /dev/null and b/public/users-hands/1.webp differ diff --git a/public/users-hands/10.png b/public/users-hands/10.png new file mode 100644 index 0000000..fd93205 Binary files /dev/null and b/public/users-hands/10.png differ diff --git a/public/users-hands/11.webp b/public/users-hands/11.webp new file mode 100644 index 0000000..99a88db Binary files /dev/null and b/public/users-hands/11.webp differ diff --git a/public/users-hands/12.webp b/public/users-hands/12.webp new file mode 100644 index 0000000..610ab78 Binary files /dev/null and b/public/users-hands/12.webp differ diff --git a/public/users-hands/13.webp b/public/users-hands/13.webp new file mode 100644 index 0000000..ba3a58f Binary files /dev/null and b/public/users-hands/13.webp differ diff --git a/public/users-hands/2.webp b/public/users-hands/2.webp new file mode 100644 index 0000000..4740c6a Binary files /dev/null and b/public/users-hands/2.webp differ diff --git a/public/users-hands/3.webp b/public/users-hands/3.webp new file mode 100644 index 0000000..b3a2f50 Binary files /dev/null and b/public/users-hands/3.webp differ diff --git a/public/users-hands/4.webp b/public/users-hands/4.webp new file mode 100644 index 0000000..2ac3dab Binary files /dev/null and b/public/users-hands/4.webp differ diff --git a/public/users-hands/5.webp b/public/users-hands/5.webp new file mode 100644 index 0000000..fbc415b Binary files /dev/null and b/public/users-hands/5.webp differ diff --git a/public/users-hands/6.webp b/public/users-hands/6.webp new file mode 100644 index 0000000..5718aae Binary files /dev/null and b/public/users-hands/6.webp differ diff --git a/public/users-hands/7.webp b/public/users-hands/7.webp new file mode 100644 index 0000000..11f6285 Binary files /dev/null and b/public/users-hands/7.webp differ diff --git a/public/users-hands/8.webp b/public/users-hands/8.webp new file mode 100644 index 0000000..7085f24 Binary files /dev/null and b/public/users-hands/8.webp differ diff --git a/public/users-hands/9.png b/public/users-hands/9.png new file mode 100644 index 0000000..69d3491 Binary files /dev/null and b/public/users-hands/9.png differ diff --git a/src/components/CompatibilityV2/pages/LetScan/index.tsx b/src/components/CompatibilityV2/pages/LetScan/index.tsx index 0f53272..e5b6230 100644 --- a/src/components/CompatibilityV2/pages/LetScan/index.tsx +++ b/src/components/CompatibilityV2/pages/LetScan/index.tsx @@ -8,6 +8,10 @@ import { useTranslations } from "@/hooks/translations"; import { ELocalesPlacement } from "@/locales"; import { ELottieKeys, useLottie } from "@/hooks/lottie/useLottie"; import { DotLottieReact } from "@lottiefiles/dotlottie-react"; +import UsersHands from "@/components/UsersHands"; +import { useHandsGeneration } from "@/hooks/handsGeneration/useHandsGeneration"; +import { EUnleashFlags, useUnleash } from "@/hooks/ab/unleash/useUnleash"; +import Loader, { LoaderColor } from "@/components/Loader"; function LetScan() { const { translate } = useTranslations(ELocalesPlacement.CompatibilityV2); @@ -16,10 +20,20 @@ function LetScan() { loadKey: ELottieKeys.letScan, }); + const { + displayHands + } = useHandsGeneration(); + + const { isReady, variant: dynamicHandsCompV2 } = useUnleash({ + flag: EUnleashFlags.dynamicHandsCompV2 + }); + const handleNext = () => { navigate(routes.client.compatibilityV2ScanInstruction()); }; + if (!isReady) return ; + return (
@@ -28,7 +42,7 @@ function LetScan() { className={`${styles["lottie-animation"]} ym-hide-content`} data={animationData} autoplay - loop={false} + loop={true} width={323} />}
@@ -36,6 +50,14 @@ function LetScan() { {translate("/let-scan.title")}

{translate("/let-scan.text")}

+ {dynamicHandsCompV2 === "show" && ( + + )} diff --git a/src/components/CompatibilityV2/pages/PalmsInformation/index.tsx b/src/components/CompatibilityV2/pages/PalmsInformation/index.tsx index 872f829..3446745 100644 --- a/src/components/CompatibilityV2/pages/PalmsInformation/index.tsx +++ b/src/components/CompatibilityV2/pages/PalmsInformation/index.tsx @@ -63,16 +63,16 @@ function PalmsInformation() { Zodiac sign
)} - {translate(`/palms-information.${zodiacSign.toLowerCase()}.title`)} + {translate(`/palms-information.${zodiacSign?.toLowerCase()}.title`)}

- {translate(`/palms-information.${zodiacSign.toLowerCase()}.description`)} + {translate(`/palms-information.${zodiacSign?.toLowerCase()}.description`)}

diff --git a/src/components/UsersHands/index.tsx b/src/components/UsersHands/index.tsx new file mode 100644 index 0000000..33e2cf4 --- /dev/null +++ b/src/components/UsersHands/index.tsx @@ -0,0 +1,104 @@ +import { IPalmistryPoint } from "@/api/resources/Palmistry"; +import Title from "../Title"; +import styles from "./styles.module.scss"; +import { DisplayHand } from "@/hooks/handsGeneration/useHandsGeneration"; +import { useRef } from "react"; + +interface IUsersHandsProps { + title?: string; + hands: DisplayHand[]; +} + +function UsersHands({ + title, + hands +}: IUsersHandsProps) { + const linesRef = useRef([]); + + const getCoordinatesString = (points: IPalmistryPoint[]) => { + const coordinatesString = `M ${points[0]?.x * 56} ${points[0]?.y * 75 + }`; + return points.reduce( + (acc, point) => + `${acc} L ${point?.x * 56} ${point?.y * 75}`, + coordinatesString + ); + } + + const getLineLength = (line: SVGPathElement) => { + return line?.getTotalLength(); + }; + + return ( +
+ {!!title?.length && + {title} + } +
+ {hands.map(({ image, lines, willBeRemoved }, index) => ( +
+ {`hand-${index}`} + + {/* {!!fingers.length && + fingers?.map((finger, index) => { + return ( + + + + + ); + })} */} + + {lines.map((line, index) => ( + + + (linesRef.current[index] = el as SVGPathElement) + } + style={{ + strokeDasharray: + getLineLength(linesRef.current[index]) || 500, + strokeDashoffset: + getLineLength(linesRef.current[index]) || 500, + }} + /> + + ))} + +
+ ))} +
+
+ ) +} + +export default UsersHands \ No newline at end of file diff --git a/src/components/UsersHands/styles.module.scss b/src/components/UsersHands/styles.module.scss new file mode 100644 index 0000000..38cc17e --- /dev/null +++ b/src/components/UsersHands/styles.module.scss @@ -0,0 +1,86 @@ +.container { + width: 100%; + background: linear-gradient(0.63deg, #E1EBFF 0.53%, rgba(75, 136, 255, 0.31) 0.54%); + border-radius: 18px; + padding: 32px 14px 6px; + margin-top: 16px; +} + +.title { + font-family: SF Pro Text; + font-weight: 500; + font-size: 16px; + line-height: 125%; + text-align: center; + vertical-align: middle; + margin-bottom: 21px; +} + +.hands { + width: 100%; + display: flex; + justify-content: flex-start; + align-items: center; + overflow-x: auto; + flex-wrap: nowrap; + -webkit-overflow-scrolling: touch; + scrollbar-width: thin; + padding-bottom: 10px; + + &>.hand { + position: relative; + width: 56px; + height: 75px; + border-radius: 10px; + overflow: hidden; + flex-shrink: 0; + opacity: 1; + margin-right: 10px; + + img { + width: 100%; + height: 100%; + object-fit: cover; + } + + &.willBeRemoved { + animation: fadeOut 1s ease-in-out forwards; + animation-delay: 2s; + } + } +} + +.svgObjects { + animation: fadeIn 1.5s ease-in-out forwards; +} + +.line { + animation-delay: 1.5s; +} + +@keyframes fadeIn { + 0% { + opacity: 0; + } + + 99% { + opacity: 0; + } + + 100% { + opacity: 1; + } +} + +@keyframes fadeOut { + from { + opacity: 1; + } + + to { + opacity: 0; + width: 0; + margin-right: 0; + border-radius: 2px; + } +} \ No newline at end of file diff --git a/src/hooks/ab/unleash/useUnleash.ts b/src/hooks/ab/unleash/useUnleash.ts index 477c3a9..c18cd9e 100644 --- a/src/hooks/ab/unleash/useUnleash.ts +++ b/src/hooks/ab/unleash/useUnleash.ts @@ -5,23 +5,19 @@ import { useSearchParams } from "react-router-dom"; export enum EUnleashFlags { "genderPageType" = "genderPageType", "zodiacImages" = "zodiacImages", + "dynamicHandsCompV2" = "dynamicHandsCompV2", + "dynamicHandsPalmistryV1" = "dynamicHandsPalmistryV1", } -/** - * Интерфейс для входных параметров хука useUnleash - * Использует дженерик T для типизации флага - */ interface IUseUnleashProps { flag: T; } -/** - * Интерфейс для возможных вариантов значений флагов - * Каждый ключ соответствует флагу из EUnleashFlags - */ interface IVariants { [EUnleashFlags.genderPageType]: "v0" | "v1" | "v2"; [EUnleashFlags.zodiacImages]: "new" | "old"; + [EUnleashFlags.dynamicHandsCompV2]: "show" | "hide"; + [EUnleashFlags.dynamicHandsPalmistryV1]: "show" | "hide"; } /** diff --git a/src/hooks/handsGeneration/hands.ts b/src/hooks/handsGeneration/hands.ts new file mode 100644 index 0000000..dc576da --- /dev/null +++ b/src/hooks/handsGeneration/hands.ts @@ -0,0 +1,4910 @@ +export const hands = [ + { + image: "/users-hands/1.webp", + lines: [ + { + "line": 0, + "name": "head", + "length": 0.2934436546275714, + "points": [ + { + "x": 0.6040146350860596, + "y": 0.43557754158973694, + "index": 0 + }, + { + "x": 0.5798310041427612, + "y": 0.44584617018699646, + "index": 1 + }, + { + "x": 0.5537340641021729, + "y": 0.4570559561252594, + "index": 2 + }, + { + "x": 0.5264407396316528, + "y": 0.4711135923862457, + "index": 3 + }, + { + "x": 0.4983254075050354, + "y": 0.48722904920578003, + "index": 4 + }, + { + "x": 0.4699263572692871, + "y": 0.5054117441177368, + "index": 5 + }, + { + "x": 0.44137483835220337, + "y": 0.5249989628791809, + "index": 6 + }, + { + "x": 0.41216927766799927, + "y": 0.5458531379699707, + "index": 7 + }, + { + "x": 0.3831446170806885, + "y": 0.5676015615463257, + "index": 8 + }, + { + "x": 0.35489535331726074, + "y": 0.5885334610939026, + "index": 9 + } + ] + }, + { + "line": 1, + "name": "heart", + "length": 0.2774777508116145, + "points": [ + { + "x": 0.5313348770141602, + "y": 0.4088706076145172, + "index": 0 + }, + { + "x": 0.5092400312423706, + "y": 0.4322652816772461, + "index": 1 + }, + { + "x": 0.48539233207702637, + "y": 0.453556627035141, + "index": 2 + }, + { + "x": 0.4594472348690033, + "y": 0.4713698923587799, + "index": 3 + }, + { + "x": 0.4317385256290436, + "y": 0.4847910404205322, + "index": 4 + }, + { + "x": 0.403148889541626, + "y": 0.49509257078170776, + "index": 5 + }, + { + "x": 0.3738144338130951, + "y": 0.5028458833694458, + "index": 6 + }, + { + "x": 0.34386661648750305, + "y": 0.5085021257400513, + "index": 7 + }, + { + "x": 0.31379544734954834, + "y": 0.5126242637634277, + "index": 8 + }, + { + "x": 0.2844792306423187, + "y": 0.5159955620765686, + "index": 9 + } + ] + }, + { + "line": 2, + "name": "life", + "length": 0.2911455852977215, + "points": [ + { + "x": 0.6034734845161438, + "y": 0.4372476637363434, + "index": 0 + }, + { + "x": 0.5749127268791199, + "y": 0.45144572854042053, + "index": 1 + }, + { + "x": 0.5474398136138916, + "y": 0.47069627046585083, + "index": 2 + }, + { + "x": 0.5248068571090698, + "y": 0.49502038955688477, + "index": 3 + }, + { + "x": 0.5071744322776794, + "y": 0.5229440927505493, + "index": 4 + }, + { + "x": 0.4934989809989929, + "y": 0.5530135035514832, + "index": 5 + }, + { + "x": 0.4836975634098053, + "y": 0.583616316318512, + "index": 6 + }, + { + "x": 0.47738465666770935, + "y": 0.6148712635040283, + "index": 7 + }, + { + "x": 0.4754796028137207, + "y": 0.6461013555526733, + "index": 8 + }, + { + "x": 0.4772632122039795, + "y": 0.6771630048751831, + "index": 9 + } + ] + }, + { + "line": 3, + "name": "fate", + "length": 0.1550777397617992, + "points": [ + { + "x": 0.4677960276603699, + "y": 0.5149557590484619, + "index": 0 + }, + { + "x": 0.46389341354370117, + "y": 0.5311309695243835, + "index": 1 + }, + { + "x": 0.45983004570007324, + "y": 0.5477677583694458, + "index": 2 + }, + { + "x": 0.45536527037620544, + "y": 0.5645895600318909, + "index": 3 + }, + { + "x": 0.45088401436805725, + "y": 0.5813321471214294, + "index": 4 + }, + { + "x": 0.4463534951210022, + "y": 0.5985226035118103, + "index": 5 + }, + { + "x": 0.44201168417930603, + "y": 0.6151701807975769, + "index": 6 + }, + { + "x": 0.437730073928833, + "y": 0.6317477226257324, + "index": 7 + }, + { + "x": 0.43379801511764526, + "y": 0.6481298804283142, + "index": 8 + }, + { + "x": 0.42956647276878357, + "y": 0.6652399301528931, + "index": 9 + } + ] + } + ], + fingers: [ + { + "name": "thumb", + "points": [ + { + "x": 0.6412334442138672, + "y": 0.6289247274398804, + "index": 1 + }, + { + "x": 0.7502331733703613, + "y": 0.5178381204605103, + "index": 2 + }, + { + "x": 0.7524453401565552, + "y": 0.392831951379776, + "index": 3 + }, + { + "x": 0.7448804974555969, + "y": 0.2932630181312561, + "index": 4 + } + ], + "point": { + "x": 0.7448804974555969, + "y": 0.2932630181312561, + "index": 4 + } + }, + { + "name": "index_finger", + "points": [ + { + "x": 0.5878628492355347, + "y": 0.4071357548236847, + "index": 5 + }, + { + "x": 0.5784347653388977, + "y": 0.26062917709350586, + "index": 6 + }, + { + "x": 0.5661937594413757, + "y": 0.17123205959796906, + "index": 7 + }, + { + "x": 0.5571951866149902, + "y": 0.09563860297203064, + "index": 8 + } + ], + "point": { + "x": 0.5571951866149902, + "y": 0.09563860297203064, + "index": 8 + } + }, + { + "name": "middle_finger", + "points": [ + { + "x": 0.4833756387233734, + "y": 0.4095359444618225, + "index": 9 + }, + { + "x": 0.4629409909248352, + "y": 0.264321506023407, + "index": 10 + }, + { + "x": 0.4541243016719818, + "y": 0.1674421727657318, + "index": 11 + }, + { + "x": 0.4567725360393524, + "y": 0.0901089608669281, + "index": 12 + } + ], + "point": { + "x": 0.4567725360393524, + "y": 0.0901089608669281, + "index": 12 + } + }, + { + "name": "ring_finger", + "points": [ + { + "x": 0.3950343132019043, + "y": 0.427097350358963, + "index": 13 + }, + { + "x": 0.36973610520362854, + "y": 0.30223286151885986, + "index": 14 + }, + { + "x": 0.3659982681274414, + "y": 0.22199629247188568, + "index": 15 + }, + { + "x": 0.371324360370636, + "y": 0.1564151793718338, + "index": 16 + } + ], + "point": { + "x": 0.371324360370636, + "y": 0.1564151793718338, + "index": 16 + } + }, + { + "name": "pinky", + "points": [ + { + "x": 0.3082297444343567, + "y": 0.4611092805862427, + "index": 17 + }, + { + "x": 0.2933918833732605, + "y": 0.36457785964012146, + "index": 18 + }, + { + "x": 0.2854890823364258, + "y": 0.29918432235717773, + "index": 19 + }, + { + "x": 0.28323596715927124, + "y": 0.2400190681219101, + "index": 20 + } + ], + "point": { + "x": 0.28323596715927124, + "y": 0.2400190681219101, + "index": 20 + } + } + ] + }, + { + image: "/users-hands/2.webp", + lines: [ + { + "line": 0, + "name": "head", + "length": 0.3119932691199506, + "points": [ + { + "x": 0.6399263739585876, + "y": 0.4663569927215576, + "index": 0 + }, + { + "x": 0.6083963513374329, + "y": 0.47271856665611267, + "index": 1 + }, + { + "x": 0.575104296207428, + "y": 0.4802112579345703, + "index": 2 + }, + { + "x": 0.5419853925704956, + "y": 0.49061933159828186, + "index": 3 + }, + { + "x": 0.5094683766365051, + "y": 0.5029343366622925, + "index": 4 + }, + { + "x": 0.47744837403297424, + "y": 0.5167733430862427, + "index": 5 + }, + { + "x": 0.44569215178489685, + "y": 0.5319596529006958, + "index": 6 + }, + { + "x": 0.4137524962425232, + "y": 0.548564612865448, + "index": 7 + }, + { + "x": 0.3827046751976013, + "y": 0.566547691822052, + "index": 8 + }, + { + "x": 0.35386785864830017, + "y": 0.5850370526313782, + "index": 9 + } + ] + }, + { + "line": 1, + "name": "life", + "length": 0.3015202460235333, + "points": [ + { + "x": 0.6362658739089966, + "y": 0.4626098573207855, + "index": 0 + }, + { + "x": 0.600507378578186, + "y": 0.4709945321083069, + "index": 1 + }, + { + "x": 0.5653886795043945, + "y": 0.484398752450943, + "index": 2 + }, + { + "x": 0.5354904532432556, + "y": 0.5040714144706726, + "index": 3 + }, + { + "x": 0.5107624530792236, + "y": 0.52826327085495, + "index": 4 + }, + { + "x": 0.49003666639328003, + "y": 0.5549150109291077, + "index": 5 + }, + { + "x": 0.4729823172092438, + "y": 0.5820006132125854, + "index": 6 + }, + { + "x": 0.45887356996536255, + "y": 0.6098304986953735, + "index": 7 + }, + { + "x": 0.4488007426261902, + "y": 0.6382129788398743, + "index": 8 + }, + { + "x": 0.44261592626571655, + "y": 0.6672927141189575, + "index": 9 + } + ] + }, + { + "line": 2, + "name": "heart", + "length": 0.26204598886462993, + "points": [ + { + "x": 0.5139379501342773, + "y": 0.4292140007019043, + "index": 0 + }, + { + "x": 0.4948038160800934, + "y": 0.4502525329589844, + "index": 1 + }, + { + "x": 0.4729374945163727, + "y": 0.4702751636505127, + "index": 2 + }, + { + "x": 0.447746604681015, + "y": 0.48655495047569275, + "index": 3 + }, + { + "x": 0.42021170258522034, + "y": 0.49816569685935974, + "index": 4 + }, + { + "x": 0.3919529616832733, + "y": 0.5061522722244263, + "index": 5 + }, + { + "x": 0.36334091424942017, + "y": 0.5118374228477478, + "index": 6 + }, + { + "x": 0.33459338545799255, + "y": 0.5156919360160828, + "index": 7 + }, + { + "x": 0.30618593096733093, + "y": 0.5181879997253418, + "index": 8 + }, + { + "x": 0.27824416756629944, + "y": 0.5203337073326111, + "index": 9 + } + ] + }, + { + "line": 3, + "name": "fate", + "length": 0.14542979543008036, + "points": [ + { + "x": 0.4338281750679016, + "y": 0.5380306839942932, + "index": 0 + }, + { + "x": 0.4304775297641754, + "y": 0.553613007068634, + "index": 1 + }, + { + "x": 0.4266398847103119, + "y": 0.5693668723106384, + "index": 2 + }, + { + "x": 0.4226917624473572, + "y": 0.5849002003669739, + "index": 3 + }, + { + "x": 0.4187851846218109, + "y": 0.6002644896507263, + "index": 4 + }, + { + "x": 0.414933443069458, + "y": 0.6161743402481079, + "index": 5 + }, + { + "x": 0.41143012046813965, + "y": 0.631737232208252, + "index": 6 + }, + { + "x": 0.40802016854286194, + "y": 0.6474354863166809, + "index": 7 + }, + { + "x": 0.4048306345939636, + "y": 0.6629655957221985, + "index": 8 + }, + { + "x": 0.40116238594055176, + "y": 0.6797248125076294, + "index": 9 + } + ] + } + ], + fingers: [ + { + "name": "thumb", + "points": [ + { + "x": 0.6468294858932495, + "y": 0.6960813999176025, + "index": 1 + }, + { + "x": 0.717897891998291, + "y": 0.5596572160720825, + "index": 2 + }, + { + "x": 0.736761748790741, + "y": 0.4341757297515869, + "index": 3 + }, + { + "x": 0.7035943269729614, + "y": 0.3359532952308655, + "index": 4 + } + ], + "point": { + "x": 0.7035943269729614, + "y": 0.3359532952308655, + "index": 4 + } + }, + { + "name": "index_finger", + "points": [ + { + "x": 0.5843440294265747, + "y": 0.44671592116355896, + "index": 5 + }, + { + "x": 0.5931209921836853, + "y": 0.2970203757286072, + "index": 6 + }, + { + "x": 0.5873619914054871, + "y": 0.21395589411258698, + "index": 7 + }, + { + "x": 0.5737776756286621, + "y": 0.1382201910018921, + "index": 8 + } + ], + "point": { + "x": 0.5737776756286621, + "y": 0.1382201910018921, + "index": 8 + } + }, + { + "name": "middle_finger", + "points": [ + { + "x": 0.4896312355995178, + "y": 0.4408842623233795, + "index": 9 + }, + { + "x": 0.48961347341537476, + "y": 0.28103673458099365, + "index": 10 + }, + { + "x": 0.48257800936698914, + "y": 0.17783714830875397, + "index": 11 + }, + { + "x": 0.4781035780906677, + "y": 0.09656882286071777, + "index": 12 + } + ], + "point": { + "x": 0.4781035780906677, + "y": 0.09656882286071777, + "index": 12 + } + }, + { + "name": "ring_finger", + "points": [ + { + "x": 0.3949384093284607, + "y": 0.45442289113998413, + "index": 13 + }, + { + "x": 0.39262714982032776, + "y": 0.31003183126449585, + "index": 14 + }, + { + "x": 0.392602801322937, + "y": 0.21833644807338715, + "index": 15 + }, + { + "x": 0.39719319343566895, + "y": 0.14033636450767517, + "index": 16 + } + ], + "point": { + "x": 0.39719319343566895, + "y": 0.14033636450767517, + "index": 16 + } + }, + { + "name": "pinky", + "points": [ + { + "x": 0.29316285252571106, + "y": 0.4885757267475128, + "index": 17 + }, + { + "x": 0.29259926080703735, + "y": 0.37532368302345276, + "index": 18 + }, + { + "x": 0.2946354150772095, + "y": 0.3015213906764984, + "index": 19 + }, + { + "x": 0.3014577031135559, + "y": 0.23140843212604523, + "index": 20 + } + ], + "point": { + "x": 0.3014577031135559, + "y": 0.23140843212604523, + "index": 20 + } + } + ] + }, + { + image: "/users-hands/3.webp", + lines: [ + { + "line": 0, + "name": "life", + "length": 0.30759384938136963, + "points": [ + { + "x": 0.6254447102546692, + "y": 0.4934304356575012, + "index": 0 + }, + { + "x": 0.5927474498748779, + "y": 0.5069150924682617, + "index": 1 + }, + { + "x": 0.562076210975647, + "y": 0.5260596871376038, + "index": 2 + }, + { + "x": 0.5373502373695374, + "y": 0.5514917969703674, + "index": 3 + }, + { + "x": 0.5182269811630249, + "y": 0.5812655687332153, + "index": 4 + }, + { + "x": 0.5033548474311829, + "y": 0.613149881362915, + "index": 5 + }, + { + "x": 0.4926632046699524, + "y": 0.645284116268158, + "index": 6 + }, + { + "x": 0.4859336316585541, + "y": 0.6773602962493896, + "index": 7 + }, + { + "x": 0.4839089512825012, + "y": 0.7090991139411926, + "index": 8 + }, + { + "x": 0.48646092414855957, + "y": 0.7405821681022644, + "index": 9 + } + ] + }, + { + "line": 1, + "name": "head", + "length": 0.32733613365131453, + "points": [ + { + "x": 0.6386517286300659, + "y": 0.46680063009262085, + "index": 0 + }, + { + "x": 0.6079133152961731, + "y": 0.47718334197998047, + "index": 1 + }, + { + "x": 0.5750997066497803, + "y": 0.4887104630470276, + "index": 2 + }, + { + "x": 0.54234379529953, + "y": 0.5033009052276611, + "index": 3 + }, + { + "x": 0.5102742314338684, + "y": 0.52006995677948, + "index": 4 + }, + { + "x": 0.4788564145565033, + "y": 0.5384916067123413, + "index": 5 + }, + { + "x": 0.4475364685058594, + "y": 0.5581623315811157, + "index": 6 + }, + { + "x": 0.4155915379524231, + "y": 0.5791069269180298, + "index": 7 + }, + { + "x": 0.38397637009620667, + "y": 0.6011469960212708, + "index": 8 + }, + { + "x": 0.353360116481781, + "y": 0.6235223412513733, + "index": 9 + } + ] + }, + { + "line": 2, + "name": "heart", + "length": 0.2980099938400364, + "points": [ + { + "x": 0.5401648283004761, + "y": 0.43969884514808655, + "index": 0 + }, + { + "x": 0.5142859220504761, + "y": 0.4627718925476074, + "index": 1 + }, + { + "x": 0.4864282011985779, + "y": 0.484832227230072, + "index": 2 + }, + { + "x": 0.45704102516174316, + "y": 0.5034703016281128, + "index": 3 + }, + { + "x": 0.42632731795310974, + "y": 0.5174733996391296, + "index": 4 + }, + { + "x": 0.3951548933982849, + "y": 0.5274993181228638, + "index": 5 + }, + { + "x": 0.3638859689235687, + "y": 0.5349723100662231, + "index": 6 + }, + { + "x": 0.33213672041893005, + "y": 0.5406540036201477, + "index": 7 + }, + { + "x": 0.3010343313217163, + "y": 0.5453187823295593, + "index": 8 + }, + { + "x": 0.2708436846733093, + "y": 0.5506131052970886, + "index": 9 + } + ] + }, + { + "line": 3, + "name": "fate", + "length": 0.1919126625645604, + "points": [ + { + "x": 0.46377673745155334, + "y": 0.5482907295227051, + "index": 0 + }, + { + "x": 0.46117526292800903, + "y": 0.5690386891365051, + "index": 1 + }, + { + "x": 0.4585443139076233, + "y": 0.5906597971916199, + "index": 2 + }, + { + "x": 0.4557889401912689, + "y": 0.6126105785369873, + "index": 3 + }, + { + "x": 0.45300978422164917, + "y": 0.6340534090995789, + "index": 4 + }, + { + "x": 0.4505138397216797, + "y": 0.6550599932670593, + "index": 5 + }, + { + "x": 0.4484548568725586, + "y": 0.6758822798728943, + "index": 6 + }, + { + "x": 0.4468911290168762, + "y": 0.6968423128128052, + "index": 7 + }, + { + "x": 0.4462820887565613, + "y": 0.7178352475166321, + "index": 8 + }, + { + "x": 0.4467034339904785, + "y": 0.7392092943191528, + "index": 9 + } + ] + } + ], + fingers: [ + { + "name": "thumb", + "points": [ + { + "x": 0.6670917868614197, + "y": 0.7531933784484863, + "index": 1 + }, + { + "x": 0.751531720161438, + "y": 0.594143271446228, + "index": 2 + }, + { + "x": 0.7371379733085632, + "y": 0.44986575841903687, + "index": 3 + }, + { + "x": 0.7440223693847656, + "y": 0.3381683826446533, + "index": 4 + } + ], + "point": { + "x": 0.7440223693847656, + "y": 0.3381683826446533, + "index": 4 + } + }, + { + "name": "index_finger", + "points": [ + { + "x": 0.6192285418510437, + "y": 0.4491657614707947, + "index": 5 + }, + { + "x": 0.6064386963844299, + "y": 0.29861366748809814, + "index": 6 + }, + { + "x": 0.5856925249099731, + "y": 0.2020309716463089, + "index": 7 + }, + { + "x": 0.5692133903503418, + "y": 0.11083570122718811, + "index": 8 + } + ], + "point": { + "x": 0.5692133903503418, + "y": 0.11083570122718811, + "index": 8 + } + }, + { + "name": "middle_finger", + "points": [ + { + "x": 0.5075504779815674, + "y": 0.4398151636123657, + "index": 9 + }, + { + "x": 0.49566078186035156, + "y": 0.2762957811355591, + "index": 10 + }, + { + "x": 0.484910249710083, + "y": 0.163359135389328, + "index": 11 + }, + { + "x": 0.48195570707321167, + "y": 0.06564980745315552, + "index": 12 + } + ], + "point": { + "x": 0.48195570707321167, + "y": 0.06564980745315552, + "index": 12 + } + }, + { + "name": "ring_finger", + "points": [ + { + "x": 0.408331960439682, + "y": 0.4596060812473297, + "index": 13 + }, + { + "x": 0.3919074535369873, + "y": 0.3023208975791931, + "index": 14 + }, + { + "x": 0.39538317918777466, + "y": 0.20017410814762115, + "index": 15 + }, + { + "x": 0.40211349725723267, + "y": 0.11015516519546509, + "index": 16 + } + ], + "point": { + "x": 0.40211349725723267, + "y": 0.11015516519546509, + "index": 16 + } + }, + { + "name": "pinky", + "points": [ + { + "x": 0.304331511259079, + "y": 0.5038174390792847, + "index": 17 + }, + { + "x": 0.295951783657074, + "y": 0.3784675598144531, + "index": 18 + }, + { + "x": 0.300993949174881, + "y": 0.296915203332901, + "index": 19 + }, + { + "x": 0.3112795650959015, + "y": 0.21803927421569824, + "index": 20 + } + ], + "point": { + "x": 0.3112795650959015, + "y": 0.21803927421569824, + "index": 20 + } + } + ] + }, + { + image: "/users-hands/4.webp", + lines: [ + { + "line": 0, + "name": "head", + "length": 0.2843655708132673, + "points": [ + { + "x": 0.6737996339797974, + "y": 0.49595633149147034, + "index": 0 + }, + { + "x": 0.6419354677200317, + "y": 0.5017844438552856, + "index": 1 + }, + { + "x": 0.6088889241218567, + "y": 0.50770103931427, + "index": 2 + }, + { + "x": 0.5768722295761108, + "y": 0.5159443020820618, + "index": 3 + }, + { + "x": 0.5469866991043091, + "y": 0.5265210270881653, + "index": 4 + }, + { + "x": 0.5190613269805908, + "y": 0.5397441983222961, + "index": 5 + }, + { + "x": 0.49275583028793335, + "y": 0.5543955564498901, + "index": 6 + }, + { + "x": 0.4664904475212097, + "y": 0.5709459781646729, + "index": 7 + }, + { + "x": 0.4413461685180664, + "y": 0.5890774726867676, + "index": 8 + }, + { + "x": 0.41680487990379333, + "y": 0.6073302626609802, + "index": 9 + } + ] + }, + { + "line": 1, + "name": "heart", + "length": 0.3594088263264681, + "points": [ + { + "x": 0.5587908029556274, + "y": 0.44569650292396545, + "index": 0 + }, + { + "x": 0.5284916162490845, + "y": 0.47313809394836426, + "index": 1 + }, + { + "x": 0.49433690309524536, + "y": 0.49936866760253906, + "index": 2 + }, + { + "x": 0.4575115740299225, + "y": 0.5214865803718567, + "index": 3 + }, + { + "x": 0.4189550280570984, + "y": 0.5381449460983276, + "index": 4 + }, + { + "x": 0.38055989146232605, + "y": 0.5501411557197571, + "index": 5 + }, + { + "x": 0.3423265814781189, + "y": 0.5592321157455444, + "index": 6 + }, + { + "x": 0.3046000301837921, + "y": 0.5659168362617493, + "index": 7 + }, + { + "x": 0.2680789530277252, + "y": 0.5710855722427368, + "index": 8 + }, + { + "x": 0.23276229202747345, + "y": 0.5768417119979858, + "index": 9 + } + ] + }, + { + "line": 2, + "name": "life", + "length": 0.21928994316798633, + "points": [ + { + "x": 0.6678667068481445, + "y": 0.5049028992652893, + "index": 0 + }, + { + "x": 0.6412920355796814, + "y": 0.5065202116966248, + "index": 1 + }, + { + "x": 0.615341067314148, + "y": 0.5114166140556335, + "index": 2 + }, + { + "x": 0.5934780836105347, + "y": 0.5206025838851929, + "index": 3 + }, + { + "x": 0.5755529999732971, + "y": 0.5334351062774658, + "index": 4 + }, + { + "x": 0.5599502325057983, + "y": 0.5486934781074524, + "index": 5 + }, + { + "x": 0.5456737279891968, + "y": 0.5656417012214661, + "index": 6 + }, + { + "x": 0.5314476490020752, + "y": 0.5852771997451782, + "index": 7 + }, + { + "x": 0.5182552337646484, + "y": 0.607232928276062, + "index": 8 + }, + { + "x": 0.5069723129272461, + "y": 0.6313797235488892, + "index": 9 + } + ] + }, + { + "line": 3, + "name": "fate", + "length": 0.1978057305379421, + "points": [ + { + "x": 0.5185076594352722, + "y": 0.5568463802337646, + "index": 0 + }, + { + "x": 0.5081706643104553, + "y": 0.5742990374565125, + "index": 1 + }, + { + "x": 0.4978248178958893, + "y": 0.5927634239196777, + "index": 2 + }, + { + "x": 0.4886050820350647, + "y": 0.6121017336845398, + "index": 3 + }, + { + "x": 0.48048868775367737, + "y": 0.6318915486335754, + "index": 4 + }, + { + "x": 0.47327008843421936, + "y": 0.6523166298866272, + "index": 5 + }, + { + "x": 0.4667935371398926, + "y": 0.6732839345932007, + "index": 6 + }, + { + "x": 0.4607934057712555, + "y": 0.6953957080841064, + "index": 7 + }, + { + "x": 0.4558908939361572, + "y": 0.7182580828666687, + "index": 8 + }, + { + "x": 0.45201998949050903, + "y": 0.741580605506897, + "index": 9 + } + ] + } + ], + fingers: [ + { + "name": "thumb", + "points": [ + { + "x": 0.6565069556236267, + "y": 0.7675703763961792, + "index": 1 + }, + { + "x": 0.754307746887207, + "y": 0.6335680484771729, + "index": 2 + }, + { + "x": 0.7597033381462097, + "y": 0.49801933765411377, + "index": 3 + }, + { + "x": 0.7629990577697754, + "y": 0.38149499893188477, + "index": 4 + } + ], + "point": { + "x": 0.7629990577697754, + "y": 0.38149499893188477, + "index": 4 + } + }, + { + "name": "index_finger", + "points": [ + { + "x": 0.6155049800872803, + "y": 0.4718104898929596, + "index": 5 + }, + { + "x": 0.6231417655944824, + "y": 0.3220590353012085, + "index": 6 + }, + { + "x": 0.6158506870269775, + "y": 0.22951358556747437, + "index": 7 + }, + { + "x": 0.6098951697349548, + "y": 0.14050740003585815, + "index": 8 + } + ], + "point": { + "x": 0.6098951697349548, + "y": 0.14050740003585815, + "index": 8 + } + }, + { + "name": "middle_finger", + "points": [ + { + "x": 0.4956481158733368, + "y": 0.461098849773407, + "index": 9 + }, + { + "x": 0.48982715606689453, + "y": 0.2970629036426544, + "index": 10 + }, + { + "x": 0.4807398319244385, + "y": 0.18863075971603394, + "index": 11 + }, + { + "x": 0.4764423668384552, + "y": 0.09061989188194275, + "index": 12 + } + ], + "point": { + "x": 0.4764423668384552, + "y": 0.09061989188194275, + "index": 12 + } + }, + { + "name": "ring_finger", + "points": [ + { + "x": 0.3870609998703003, + "y": 0.48470890522003174, + "index": 13 + }, + { + "x": 0.3621979057788849, + "y": 0.33275526762008667, + "index": 14 + }, + { + "x": 0.35576191544532776, + "y": 0.23369361460208893, + "index": 15 + }, + { + "x": 0.3541761040687561, + "y": 0.1430373191833496, + "index": 16 + } + ], + "point": { + "x": 0.3541761040687561, + "y": 0.1430373191833496, + "index": 16 + } + }, + { + "name": "pinky", + "points": [ + { + "x": 0.2801126539707184, + "y": 0.5372799038887024, + "index": 17 + }, + { + "x": 0.26301896572113037, + "y": 0.4149545729160309, + "index": 18 + }, + { + "x": 0.2582060694694519, + "y": 0.33286452293395996, + "index": 19 + }, + { + "x": 0.2589181363582611, + "y": 0.2507776618003845, + "index": 20 + } + ], + "point": { + "x": 0.2589181363582611, + "y": 0.2507776618003845, + "index": 20 + } + } + ] + }, + { + image: "/users-hands/5.webp", + lines: [ + { + "line": 0, + "name": "life", + "length": 0.20877500031890012, + "points": [ + { + "x": 0.5987647175788879, + "y": 0.5056484341621399, + "index": 0 + }, + { + "x": 0.575094997882843, + "y": 0.5114419460296631, + "index": 1 + }, + { + "x": 0.5526251792907715, + "y": 0.5218323469161987, + "index": 2 + }, + { + "x": 0.5342116355895996, + "y": 0.5373008847236633, + "index": 3 + }, + { + "x": 0.5196983218193054, + "y": 0.556442379951477, + "index": 4 + }, + { + "x": 0.5084041357040405, + "y": 0.5773541927337646, + "index": 5 + }, + { + "x": 0.5005964040756226, + "y": 0.5985379815101624, + "index": 6 + }, + { + "x": 0.4961523115634918, + "y": 0.6199811697006226, + "index": 7 + }, + { + "x": 0.4956118166446686, + "y": 0.6412336826324463, + "index": 8 + }, + { + "x": 0.4981943666934967, + "y": 0.6631608009338379, + "index": 9 + } + ] + }, + { + "line": 1, + "name": "head", + "length": 0.20261338902555515, + "points": [ + { + "x": 0.607427716255188, + "y": 0.5029419660568237, + "index": 0 + }, + { + "x": 0.5872458219528198, + "y": 0.5093575716018677, + "index": 1 + }, + { + "x": 0.5665261745452881, + "y": 0.5161880850791931, + "index": 2 + }, + { + "x": 0.5458221435546875, + "y": 0.5238709449768066, + "index": 3 + }, + { + "x": 0.5250952839851379, + "y": 0.5315428376197815, + "index": 4 + }, + { + "x": 0.5042576789855957, + "y": 0.5388504266738892, + "index": 5 + }, + { + "x": 0.48275476694107056, + "y": 0.5457376837730408, + "index": 6 + }, + { + "x": 0.46024855971336365, + "y": 0.5523186922073364, + "index": 7 + }, + { + "x": 0.4372427463531494, + "y": 0.5585998892784119, + "index": 8 + }, + { + "x": 0.41455087065696716, + "y": 0.5646237134933472, + "index": 9 + } + ] + }, + { + "line": 2, + "name": "heart", + "length": 0.2543878667776248, + "points": [ + { + "x": 0.5201948285102844, + "y": 0.48135122656822205, + "index": 0 + }, + { + "x": 0.4976291060447693, + "y": 0.4999374747276306, + "index": 1 + }, + { + "x": 0.47368359565734863, + "y": 0.5172181725502014, + "index": 2 + }, + { + "x": 0.4483465552330017, + "y": 0.5314635038375854, + "index": 3 + }, + { + "x": 0.4222237467765808, + "y": 0.5423017740249634, + "index": 4 + }, + { + "x": 0.39594024419784546, + "y": 0.5505295991897583, + "index": 5 + }, + { + "x": 0.36929649114608765, + "y": 0.5571423768997192, + "index": 6 + }, + { + "x": 0.3420528769493103, + "y": 0.5626113414764404, + "index": 7 + }, + { + "x": 0.31472259759902954, + "y": 0.567426323890686, + "index": 8 + }, + { + "x": 0.2873426675796509, + "y": 0.5718986392021179, + "index": 9 + } + ] + } + ], + fingers: [ + { + "name": "thumb", + "points": [ + { + "x": 0.6422204971313477, + "y": 0.6890324354171753, + "index": 1 + }, + { + "x": 0.7087903618812561, + "y": 0.5770543813705444, + "index": 2 + }, + { + "x": 0.7183367013931274, + "y": 0.47210821509361267, + "index": 3 + }, + { + "x": 0.710052490234375, + "y": 0.3890897333621979, + "index": 4 + } + ], + "point": { + "x": 0.710052490234375, + "y": 0.3890897333621979, + "index": 4 + } + }, + { + "name": "index_finger", + "points": [ + { + "x": 0.5689725279808044, + "y": 0.4808322787284851, + "index": 5 + }, + { + "x": 0.5877074599266052, + "y": 0.3588040769100189, + "index": 6 + }, + { + "x": 0.5955812335014343, + "y": 0.2837916910648346, + "index": 7 + }, + { + "x": 0.6000836491584778, + "y": 0.21638205647468567, + "index": 8 + } + ], + "point": { + "x": 0.6000836491584778, + "y": 0.21638205647468567, + "index": 8 + } + }, + { + "name": "middle_finger", + "points": [ + { + "x": 0.4828239977359772, + "y": 0.4772258698940277, + "index": 9 + }, + { + "x": 0.4789921045303345, + "y": 0.3402068316936493, + "index": 10 + }, + { + "x": 0.47663819789886475, + "y": 0.24973756074905396, + "index": 11 + }, + { + "x": 0.4737245440483093, + "y": 0.17410394549369812, + "index": 12 + } + ], + "point": { + "x": 0.4737245440483093, + "y": 0.17410394549369812, + "index": 12 + } + }, + { + "name": "ring_finger", + "points": [ + { + "x": 0.40465646982192993, + "y": 0.4948500990867615, + "index": 13 + }, + { + "x": 0.3779798746109009, + "y": 0.3700096607208252, + "index": 14 + }, + { + "x": 0.370779812335968, + "y": 0.2864917516708374, + "index": 15 + }, + { + "x": 0.3671291768550873, + "y": 0.21547344326972961, + "index": 16 + } + ], + "point": { + "x": 0.3671291768550873, + "y": 0.21547344326972961, + "index": 16 + } + }, + { + "name": "pinky", + "points": [ + { + "x": 0.3272170424461365, + "y": 0.5310486555099487, + "index": 17 + }, + { + "x": 0.3061325252056122, + "y": 0.43223491311073303, + "index": 18 + }, + { + "x": 0.29843440651893616, + "y": 0.36430901288986206, + "index": 19 + }, + { + "x": 0.2944626808166504, + "y": 0.3005222678184509, + "index": 20 + } + ], + "point": { + "x": 0.2944626808166504, + "y": 0.3005222678184509, + "index": 20 + } + } + ] + }, + { + image: "/users-hands/6.webp", + lines: [ + { + "line": 0, + "name": "life", + "length": 0.31173712246626045, + "points": [ + { + "x": 0.6473819017410278, + "y": 0.49111437797546387, + "index": 0 + }, + { + "x": 0.6138107180595398, + "y": 0.5020179152488708, + "index": 1 + }, + { + "x": 0.5798879861831665, + "y": 0.5175219774246216, + "index": 2 + }, + { + "x": 0.5509206056594849, + "y": 0.5393868684768677, + "index": 3 + }, + { + "x": 0.5285269021987915, + "y": 0.5665430426597595, + "index": 4 + }, + { + "x": 0.5118178129196167, + "y": 0.5969426035881042, + "index": 5 + }, + { + "x": 0.50031578540802, + "y": 0.628429651260376, + "index": 6 + }, + { + "x": 0.49333563446998596, + "y": 0.6607616543769836, + "index": 7 + }, + { + "x": 0.4911293387413025, + "y": 0.6935945749282837, + "index": 8 + }, + { + "x": 0.4917716383934021, + "y": 0.7270437479019165, + "index": 9 + } + ] + }, + { + "line": 1, + "name": "heart", + "length": 0.2820828963208497, + "points": [ + { + "x": 0.5288384556770325, + "y": 0.4231691360473633, + "index": 0 + }, + { + "x": 0.515845537185669, + "y": 0.449579656124115, + "index": 1 + }, + { + "x": 0.5001626014709473, + "y": 0.4757150709629059, + "index": 2 + }, + { + "x": 0.47974133491516113, + "y": 0.4992798864841461, + "index": 3 + }, + { + "x": 0.4548601508140564, + "y": 0.5191081762313843, + "index": 4 + }, + { + "x": 0.42729368805885315, + "y": 0.5353138446807861, + "index": 5 + }, + { + "x": 0.39788395166397095, + "y": 0.5487003922462463, + "index": 6 + }, + { + "x": 0.3674699664115906, + "y": 0.5594955086708069, + "index": 7 + }, + { + "x": 0.33687639236450195, + "y": 0.5682440996170044, + "index": 8 + }, + { + "x": 0.30716365575790405, + "y": 0.5763130187988281, + "index": 9 + } + ] + }, + { + "line": 2, + "name": "head", + "length": 0.26962436269461937, + "points": [ + { + "x": 0.6225994229316711, + "y": 0.4831902086734772, + "index": 0 + }, + { + "x": 0.598802387714386, + "y": 0.49147549271583557, + "index": 1 + }, + { + "x": 0.5735123753547668, + "y": 0.5005695819854736, + "index": 2 + }, + { + "x": 0.5479991436004639, + "y": 0.5122455358505249, + "index": 3 + }, + { + "x": 0.522642970085144, + "y": 0.5260679721832275, + "index": 4 + }, + { + "x": 0.4974128305912018, + "y": 0.541951060295105, + "index": 5 + }, + { + "x": 0.4719955027103424, + "y": 0.5599913597106934, + "index": 6 + }, + { + "x": 0.4460383951663971, + "y": 0.5802005529403687, + "index": 7 + }, + { + "x": 0.4203844964504242, + "y": 0.6022017598152161, + "index": 8 + }, + { + "x": 0.3962288498878479, + "y": 0.6245957612991333, + "index": 9 + } + ] + }, + { + "line": 3, + "name": "fate", + "length": 0.21719516814098488, + "points": [ + { + "x": 0.475842148065567, + "y": 0.5074186325073242, + "index": 0 + }, + { + "x": 0.47041240334510803, + "y": 0.5300886034965515, + "index": 1 + }, + { + "x": 0.4649450182914734, + "y": 0.5533281564712524, + "index": 2 + }, + { + "x": 0.45982861518859863, + "y": 0.576601505279541, + "index": 3 + }, + { + "x": 0.4551144242286682, + "y": 0.5993976593017578, + "index": 4 + }, + { + "x": 0.45084095001220703, + "y": 0.6223124265670776, + "index": 5 + }, + { + "x": 0.4468887746334076, + "y": 0.6456464529037476, + "index": 6 + }, + { + "x": 0.4428950846195221, + "y": 0.6701074838638306, + "index": 7 + }, + { + "x": 0.43944185972213745, + "y": 0.6953144669532776, + "index": 8 + }, + { + "x": 0.4364599585533142, + "y": 0.7208397388458252, + "index": 9 + } + ] + } + ], + fingers: [ + { + "name": "thumb", + "points": [ + { + "x": 0.6536918878555298, + "y": 0.7285626530647278, + "index": 1 + }, + { + "x": 0.7233147025108337, + "y": 0.5968406796455383, + "index": 2 + }, + { + "x": 0.7405106425285339, + "y": 0.4736499786376953, + "index": 3 + }, + { + "x": 0.768729567527771, + "y": 0.3752713203430176, + "index": 4 + } + ], + "point": { + "x": 0.768729567527771, + "y": 0.3752713203430176, + "index": 4 + } + }, + { + "name": "index_finger", + "points": [ + { + "x": 0.602799654006958, + "y": 0.43614768981933594, + "index": 5 + }, + { + "x": 0.603419840335846, + "y": 0.2923416495323181, + "index": 6 + }, + { + "x": 0.5992345213890076, + "y": 0.20800796151161194, + "index": 7 + }, + { + "x": 0.5960742831230164, + "y": 0.13526976108551025, + "index": 8 + } + ], + "point": { + "x": 0.5960742831230164, + "y": 0.13526976108551025, + "index": 8 + } + }, + { + "name": "middle_finger", + "points": [ + { + "x": 0.496797651052475, + "y": 0.431718111038208, + "index": 9 + }, + { + "x": 0.48132437467575073, + "y": 0.27498483657836914, + "index": 10 + }, + { + "x": 0.4743718206882477, + "y": 0.17695322632789612, + "index": 11 + }, + { + "x": 0.4708973169326782, + "y": 0.09824982285499573, + "index": 12 + } + ], + "point": { + "x": 0.4708973169326782, + "y": 0.09824982285499573, + "index": 12 + } + }, + { + "name": "ring_finger", + "points": [ + { + "x": 0.40214860439300537, + "y": 0.4603245258331299, + "index": 13 + }, + { + "x": 0.36853712797164917, + "y": 0.3126383125782013, + "index": 14 + }, + { + "x": 0.35813018679618835, + "y": 0.22055776417255402, + "index": 15 + }, + { + "x": 0.35502147674560547, + "y": 0.13989511132240295, + "index": 16 + } + ], + "point": { + "x": 0.35502147674560547, + "y": 0.13989511132240295, + "index": 16 + } + }, + { + "name": "pinky", + "points": [ + { + "x": 0.31013965606689453, + "y": 0.5128268599510193, + "index": 17 + }, + { + "x": 0.289295494556427, + "y": 0.3972441852092743, + "index": 18 + }, + { + "x": 0.28399336338043213, + "y": 0.32308244705200195, + "index": 19 + }, + { + "x": 0.28740713000297546, + "y": 0.2508741617202759, + "index": 20 + } + ], + "point": { + "x": 0.28740713000297546, + "y": 0.2508741617202759, + "index": 20 + } + } + ] + }, + { + image: "/users-hands/7.webp", + lines: [ + { + "line": 0, + "name": "life", + "length": 0.2535707668027058, + "points": [ + { + "x": 0.6337891817092896, + "y": 0.499080091714859, + "index": 0 + }, + { + "x": 0.6073886156082153, + "y": 0.5074271559715271, + "index": 1 + }, + { + "x": 0.581137478351593, + "y": 0.5200591683387756, + "index": 2 + }, + { + "x": 0.5579625368118286, + "y": 0.538117527961731, + "index": 3 + }, + { + "x": 0.5384630560874939, + "y": 0.5602593421936035, + "index": 4 + }, + { + "x": 0.5223733186721802, + "y": 0.5846937894821167, + "index": 5 + }, + { + "x": 0.509609043598175, + "y": 0.609910249710083, + "index": 6 + }, + { + "x": 0.500147819519043, + "y": 0.6357190608978271, + "index": 7 + }, + { + "x": 0.49461841583251953, + "y": 0.6616103649139404, + "index": 8 + }, + { + "x": 0.4925461709499359, + "y": 0.6879119873046875, + "index": 9 + } + ] + }, + { + "line": 1, + "name": "heart", + "length": 0.2885919592108762, + "points": [ + { + "x": 0.5404829978942871, + "y": 0.46549075841903687, + "index": 0 + }, + { + "x": 0.5162776708602905, + "y": 0.48743343353271484, + "index": 1 + }, + { + "x": 0.4897392690181732, + "y": 0.5085097551345825, + "index": 2 + }, + { + "x": 0.4610929489135742, + "y": 0.5265096426010132, + "index": 3 + }, + { + "x": 0.43091171979904175, + "y": 0.5403991341590881, + "index": 4 + }, + { + "x": 0.4004371166229248, + "y": 0.5506227612495422, + "index": 5 + }, + { + "x": 0.3698738217353821, + "y": 0.558419406414032, + "index": 6 + }, + { + "x": 0.339224249124527, + "y": 0.564015805721283, + "index": 7 + }, + { + "x": 0.30914196372032166, + "y": 0.5681841373443604, + "index": 8 + }, + { + "x": 0.2796838879585266, + "y": 0.5724398493766785, + "index": 9 + } + ] + }, + { + "line": 2, + "name": "head", + "length": 0.20211318282416071, + "points": [ + { + "x": 0.6420040726661682, + "y": 0.5025864839553833, + "index": 0 + }, + { + "x": 0.6236063241958618, + "y": 0.5045371055603027, + "index": 1 + }, + { + "x": 0.6036862730979919, + "y": 0.5068947672843933, + "index": 2 + }, + { + "x": 0.5824638605117798, + "y": 0.5113441348075867, + "index": 3 + }, + { + "x": 0.5608083009719849, + "y": 0.5178319215774536, + "index": 4 + }, + { + "x": 0.5392000079154968, + "y": 0.526209831237793, + "index": 5 + }, + { + "x": 0.5179495811462402, + "y": 0.5364874601364136, + "index": 6 + }, + { + "x": 0.4969051480293274, + "y": 0.548348069190979, + "index": 7 + }, + { + "x": 0.47650259733200073, + "y": 0.56150221824646, + "index": 8 + }, + { + "x": 0.45656394958496094, + "y": 0.5749503374099731, + "index": 9 + } + ] + }, + { + "line": 3, + "name": "fate", + "length": 0.14396985710171104, + "points": [ + { + "x": 0.4718335270881653, + "y": 0.5621920228004456, + "index": 0 + }, + { + "x": 0.4696207046508789, + "y": 0.5779541730880737, + "index": 1 + }, + { + "x": 0.4672244191169739, + "y": 0.5941125750541687, + "index": 2 + }, + { + "x": 0.4646732211112976, + "y": 0.6099897623062134, + "index": 3 + }, + { + "x": 0.46205848455429077, + "y": 0.6258039474487305, + "index": 4 + }, + { + "x": 0.4595099985599518, + "y": 0.641960084438324, + "index": 5 + }, + { + "x": 0.45715221762657166, + "y": 0.6575558185577393, + "index": 6 + }, + { + "x": 0.4548462927341461, + "y": 0.6731071472167969, + "index": 7 + }, + { + "x": 0.45275264978408813, + "y": 0.6882893443107605, + "index": 8 + }, + { + "x": 0.45016175508499146, + "y": 0.7045159935951233, + "index": 9 + } + ] + } + ], + fingers: [ + { + "name": "thumb", + "points": [ + { + "x": 0.6466223001480103, + "y": 0.7178396582603455, + "index": 1 + }, + { + "x": 0.7264266610145569, + "y": 0.5931559205055237, + "index": 2 + }, + { + "x": 0.7476149797439575, + "y": 0.47935259342193604, + "index": 3 + }, + { + "x": 0.7348441481590271, + "y": 0.3751438856124878, + "index": 4 + } + ], + "point": { + "x": 0.7348441481590271, + "y": 0.3751438856124878, + "index": 4 + } + }, + { + "name": "index_finger", + "points": [ + { + "x": 0.5892692804336548, + "y": 0.48283374309539795, + "index": 5 + }, + { + "x": 0.6110345721244812, + "y": 0.3406626582145691, + "index": 6 + }, + { + "x": 0.61887526512146, + "y": 0.2503926455974579, + "index": 7 + }, + { + "x": 0.6228545904159546, + "y": 0.16681897640228271, + "index": 8 + } + ], + "point": { + "x": 0.6228545904159546, + "y": 0.16681897640228271, + "index": 8 + } + }, + { + "name": "middle_finger", + "points": [ + { + "x": 0.4945968985557556, + "y": 0.47755029797554016, + "index": 9 + }, + { + "x": 0.49893918633461, + "y": 0.3245312571525574, + "index": 10 + }, + { + "x": 0.5024621486663818, + "y": 0.21837878227233887, + "index": 11 + }, + { + "x": 0.5118562579154968, + "y": 0.1257469356060028, + "index": 12 + } + ], + "point": { + "x": 0.5118562579154968, + "y": 0.1257469356060028, + "index": 12 + } + }, + { + "name": "ring_finger", + "points": [ + { + "x": 0.40275853872299194, + "y": 0.49419549107551575, + "index": 13 + }, + { + "x": 0.39296141266822815, + "y": 0.352348655462265, + "index": 14 + }, + { + "x": 0.3929859399795532, + "y": 0.25226861238479614, + "index": 15 + }, + { + "x": 0.39795026183128357, + "y": 0.16630899906158447, + "index": 16 + } + ], + "point": { + "x": 0.39795026183128357, + "y": 0.16630899906158447, + "index": 16 + } + }, + { + "name": "pinky", + "points": [ + { + "x": 0.3101509213447571, + "y": 0.5286197662353516, + "index": 17 + }, + { + "x": 0.2952292561531067, + "y": 0.4202702045440674, + "index": 18 + }, + { + "x": 0.2799474596977234, + "y": 0.34603244066238403, + "index": 19 + }, + { + "x": 0.2698686122894287, + "y": 0.27562952041625977, + "index": 20 + } + ], + "point": { + "x": 0.2698686122894287, + "y": 0.27562952041625977, + "index": 20 + } + } + ] + }, + { + image: "/users-hands/8.webp", + lines: [ + { + "line": 0, + "name": "life", + "length": 0.2430288136220383, + "points": [ + { + "x": 0.3494133949279785, + "y": 0.4893694519996643, + "index": 0 + }, + { + "x": 0.3760249614715576, + "y": 0.4962083697319031, + "index": 1 + }, + { + "x": 0.4034438133239746, + "y": 0.5075801014900208, + "index": 2 + }, + { + "x": 0.42780280113220215, + "y": 0.5245936512947083, + "index": 3 + }, + { + "x": 0.4478563666343689, + "y": 0.5456147789955139, + "index": 4 + }, + { + "x": 0.46394380927085876, + "y": 0.5682399868965149, + "index": 5 + }, + { + "x": 0.4763461649417877, + "y": 0.5912982225418091, + "index": 6 + }, + { + "x": 0.48540037870407104, + "y": 0.6150640249252319, + "index": 7 + }, + { + "x": 0.49113088846206665, + "y": 0.6386532783508301, + "index": 8 + }, + { + "x": 0.49426692724227905, + "y": 0.6618960499763489, + "index": 9 + } + ] + }, + { + "line": 1, + "name": "heart", + "length": 0.23317959607429428, + "points": [ + { + "x": 0.4444206655025482, + "y": 0.45876049995422363, + "index": 0 + }, + { + "x": 0.46367016434669495, + "y": 0.47501564025878906, + "index": 1 + }, + { + "x": 0.48509374260902405, + "y": 0.4911767542362213, + "index": 2 + }, + { + "x": 0.5090590715408325, + "y": 0.5050114393234253, + "index": 3 + }, + { + "x": 0.5344053506851196, + "y": 0.5159071087837219, + "index": 4 + }, + { + "x": 0.559990406036377, + "y": 0.5240651369094849, + "index": 5 + }, + { + "x": 0.5851842164993286, + "y": 0.5304394364356995, + "index": 6 + }, + { + "x": 0.6099905967712402, + "y": 0.5354318618774414, + "index": 7 + }, + { + "x": 0.6339370012283325, + "y": 0.5394269227981567, + "index": 8 + }, + { + "x": 0.6570347547531128, + "y": 0.5435642004013062, + "index": 9 + } + ] + }, + { + "line": 2, + "name": "head", + "length": 0.22108561367211696, + "points": [ + { + "x": 0.3501823842525482, + "y": 0.4939673840999603, + "index": 0 + }, + { + "x": 0.37188321352005005, + "y": 0.4955674707889557, + "index": 1 + }, + { + "x": 0.3948254883289337, + "y": 0.4974847435951233, + "index": 2 + }, + { + "x": 0.41814112663269043, + "y": 0.501687228679657, + "index": 3 + }, + { + "x": 0.4411701560020447, + "y": 0.5084275603294373, + "index": 4 + }, + { + "x": 0.4640601575374603, + "y": 0.5175597071647644, + "index": 5 + }, + { + "x": 0.48675814270973206, + "y": 0.5285784602165222, + "index": 6 + }, + { + "x": 0.5096162557601929, + "y": 0.5409932136535645, + "index": 7 + }, + { + "x": 0.5323604345321655, + "y": 0.5544383525848389, + "index": 8 + }, + { + "x": 0.554784893989563, + "y": 0.5681964755058289, + "index": 9 + } + ] + }, + { + "line": 3, + "name": "fate", + "length": 0.15040227621993374, + "points": [ + { + "x": 0.49597278237342834, + "y": 0.5393189191818237, + "index": 0 + }, + { + "x": 0.4986612796783447, + "y": 0.5536201000213623, + "index": 1 + }, + { + "x": 0.5018149018287659, + "y": 0.5684837102890015, + "index": 2 + }, + { + "x": 0.5053432583808899, + "y": 0.5839670896530151, + "index": 3 + }, + { + "x": 0.5090048909187317, + "y": 0.5999678373336792, + "index": 4 + }, + { + "x": 0.513145387172699, + "y": 0.6168600916862488, + "index": 5 + }, + { + "x": 0.5172848105430603, + "y": 0.6336437463760376, + "index": 6 + }, + { + "x": 0.5215353965759277, + "y": 0.6507234573364258, + "index": 7 + }, + { + "x": 0.5260356068611145, + "y": 0.6677709817886353, + "index": 8 + }, + { + "x": 0.5308098196983337, + "y": 0.6855929493904114, + "index": 9 + } + ] + } + ], + fingers: [ + { + "name": "thumb", + "points": [ + { + "x": 0.34713342785835266, + "y": 0.6752945780754089, + "index": 1 + }, + { + "x": 0.2861554026603699, + "y": 0.5826787948608398, + "index": 2 + }, + { + "x": 0.29603180289268494, + "y": 0.4964836537837982, + "index": 3 + }, + { + "x": 0.28685277700424194, + "y": 0.396767795085907, + "index": 4 + } + ], + "point": { + "x": 0.28685277700424194, + "y": 0.396767795085907, + "index": 4 + } + }, + { + "name": "index_finger", + "points": [ + { + "x": 0.3887079656124115, + "y": 0.45639023184776306, + "index": 5 + }, + { + "x": 0.384656697511673, + "y": 0.3324371576309204, + "index": 6 + }, + { + "x": 0.39162567257881165, + "y": 0.2493361383676529, + "index": 7 + }, + { + "x": 0.40253371000289917, + "y": 0.18301495909690857, + "index": 8 + } + ], + "point": { + "x": 0.40253371000289917, + "y": 0.18301495909690857, + "index": 8 + } + }, + { + "name": "middle_finger", + "points": [ + { + "x": 0.4800077974796295, + "y": 0.45885902643203735, + "index": 9 + }, + { + "x": 0.48136791586875916, + "y": 0.31959694623947144, + "index": 10 + }, + { + "x": 0.4840618968009949, + "y": 0.22530382871627808, + "index": 11 + }, + { + "x": 0.4880457818508148, + "y": 0.15041044354438782, + "index": 12 + } + ], + "point": { + "x": 0.4880457818508148, + "y": 0.15041044354438782, + "index": 12 + } + }, + { + "name": "ring_finger", + "points": [ + { + "x": 0.5553525686264038, + "y": 0.4710850715637207, + "index": 13 + }, + { + "x": 0.5724172592163086, + "y": 0.34605130553245544, + "index": 14 + }, + { + "x": 0.5815128087997437, + "y": 0.2680280804634094, + "index": 15 + }, + { + "x": 0.5854002833366394, + "y": 0.2001229077577591, + "index": 16 + } + ], + "point": { + "x": 0.5854002833366394, + "y": 0.2001229077577591, + "index": 16 + } + }, + { + "name": "pinky", + "points": [ + { + "x": 0.6299648880958557, + "y": 0.4921365976333618, + "index": 17 + }, + { + "x": 0.6458380818367004, + "y": 0.40019288659095764, + "index": 18 + }, + { + "x": 0.6482305526733398, + "y": 0.34247252345085144, + "index": 19 + }, + { + "x": 0.6486865282058716, + "y": 0.2866979241371155, + "index": 20 + } + ], + "point": { + "x": 0.6486865282058716, + "y": 0.2866979241371155, + "index": 20 + } + } + ] + }, + { + image: "/users-hands/9.png", + lines: [ + { + "line": 0, + "name": "life", + "length": 0.22447795532819184, + "points": [ + { + "x": 0.3935539126396179, + "y": 0.4744597375392914, + "index": 0 + }, + { + "x": 0.4201907515525818, + "y": 0.48159995675086975, + "index": 1 + }, + { + "x": 0.44511309266090393, + "y": 0.49270161986351013, + "index": 2 + }, + { + "x": 0.46561750769615173, + "y": 0.5083352327346802, + "index": 3 + }, + { + "x": 0.48112374544143677, + "y": 0.5274957418441772, + "index": 4 + }, + { + "x": 0.49212390184402466, + "y": 0.5483540296554565, + "index": 5 + }, + { + "x": 0.49915391206741333, + "y": 0.5704822540283203, + "index": 6 + }, + { + "x": 0.5022395253181458, + "y": 0.5939778089523315, + "index": 7 + }, + { + "x": 0.5009758472442627, + "y": 0.6180340647697449, + "index": 8 + }, + { + "x": 0.49619489908218384, + "y": 0.6421631574630737, + "index": 9 + } + ] + }, + { + "line": 1, + "name": "heart", + "length": 0.2573011943070835, + "points": [ + { + "x": 0.47776880860328674, + "y": 0.4082433581352234, + "index": 0 + }, + { + "x": 0.49450165033340454, + "y": 0.43045392632484436, + "index": 1 + }, + { + "x": 0.5138720273971558, + "y": 0.4524049758911133, + "index": 2 + }, + { + "x": 0.5368695855140686, + "y": 0.4708333909511566, + "index": 3 + }, + { + "x": 0.5624343156814575, + "y": 0.484893262386322, + "index": 4 + }, + { + "x": 0.5891823172569275, + "y": 0.49504733085632324, + "index": 5 + }, + { + "x": 0.6167298555374146, + "y": 0.5027099251747131, + "index": 6 + }, + { + "x": 0.6446163058280945, + "y": 0.5083446502685547, + "index": 7 + }, + { + "x": 0.6725301146507263, + "y": 0.5125102400779724, + "index": 8 + }, + { + "x": 0.6998247504234314, + "y": 0.5171986818313599, + "index": 9 + } + ] + }, + { + "line": 2, + "name": "head", + "length": 0.22685466702725443, + "points": [ + { + "x": 0.4128947854042053, + "y": 0.4531284272670746, + "index": 0 + }, + { + "x": 0.43558382987976074, + "y": 0.4638124108314514, + "index": 1 + }, + { + "x": 0.4592665135860443, + "y": 0.47513729333877563, + "index": 2 + }, + { + "x": 0.48268061876296997, + "y": 0.48739877343177795, + "index": 3 + }, + { + "x": 0.5052324533462524, + "y": 0.500252902507782, + "index": 4 + }, + { + "x": 0.5271874666213989, + "y": 0.513176441192627, + "index": 5 + }, + { + "x": 0.5484506487846375, + "y": 0.5261478424072266, + "index": 6 + }, + { + "x": 0.5694963335990906, + "y": 0.53885817527771, + "index": 7 + }, + { + "x": 0.5902541875839233, + "y": 0.5512833595275879, + "index": 8 + }, + { + "x": 0.6106339693069458, + "y": 0.5639101266860962, + "index": 9 + } + ] + } + ], + fingers: [ + { + "name": "thumb", + "points": [ + { + "x": 0.35040223598480225, + "y": 0.6524926424026489, + "index": 1 + }, + { + "x": 0.2669897973537445, + "y": 0.5505456924438477, + "index": 2 + }, + { + "x": 0.23149064183235168, + "y": 0.46202144026756287, + "index": 3 + }, + { + "x": 0.21135228872299194, + "y": 0.3879072368144989, + "index": 4 + } + ], + "point": { + "x": 0.21135228872299194, + "y": 0.3879072368144989, + "index": 4 + } + }, + { + "name": "index_finger", + "points": [ + { + "x": 0.4346659183502197, + "y": 0.4262739419937134, + "index": 5 + }, + { + "x": 0.43568891286849976, + "y": 0.3011322319507599, + "index": 6 + }, + { + "x": 0.43921664357185364, + "y": 0.22797314822673798, + "index": 7 + }, + { + "x": 0.44805294275283813, + "y": 0.16716675460338593, + "index": 8 + } + ], + "point": { + "x": 0.44805294275283813, + "y": 0.16716675460338593, + "index": 8 + } + }, + { + "name": "middle_finger", + "points": [ + { + "x": 0.5188077092170715, + "y": 0.4258600175380707, + "index": 9 + }, + { + "x": 0.5245929956436157, + "y": 0.291496217250824, + "index": 10 + }, + { + "x": 0.5260815024375916, + "y": 0.20771321654319763, + "index": 11 + }, + { + "x": 0.5292161703109741, + "y": 0.14184537529945374, + "index": 12 + } + ], + "point": { + "x": 0.5292161703109741, + "y": 0.14184537529945374, + "index": 12 + } + }, + { + "name": "ring_finger", + "points": [ + { + "x": 0.5976250767707825, + "y": 0.44554176926612854, + "index": 13 + }, + { + "x": 0.6153945922851562, + "y": 0.32129594683647156, + "index": 14 + }, + { + "x": 0.618600070476532, + "y": 0.24727651476860046, + "index": 15 + }, + { + "x": 0.6191883683204651, + "y": 0.18820497393608093, + "index": 16 + } + ], + "point": { + "x": 0.6191883683204651, + "y": 0.18820497393608093, + "index": 16 + } + }, + { + "name": "pinky", + "points": [ + { + "x": 0.6756412982940674, + "y": 0.48547059297561646, + "index": 17 + }, + { + "x": 0.7090789079666138, + "y": 0.3857352137565613, + "index": 18 + }, + { + "x": 0.7207803726196289, + "y": 0.32275912165641785, + "index": 19 + }, + { + "x": 0.7271701097488403, + "y": 0.2681605815887451, + "index": 20 + } + ], + "point": { + "x": 0.7271701097488403, + "y": 0.2681605815887451, + "index": 20 + } + } + ] + }, + { + image: "/users-hands/10.png", + lines: [ + { + "line": 0, + "name": "head", + "length": 0.2769965403526892, + "points": [ + { + "x": 0.6857243180274963, + "y": 0.49139705300331116, + "index": 0 + }, + { + "x": 0.6561806201934814, + "y": 0.4933384358882904, + "index": 1 + }, + { + "x": 0.6255172491073608, + "y": 0.49601420760154724, + "index": 2 + }, + { + "x": 0.594890832901001, + "y": 0.501828134059906, + "index": 3 + }, + { + "x": 0.56479412317276, + "y": 0.50985187292099, + "index": 4 + }, + { + "x": 0.5352839231491089, + "y": 0.5198860168457031, + "index": 5 + }, + { + "x": 0.506298303604126, + "y": 0.5315049886703491, + "index": 6 + }, + { + "x": 0.47732409834861755, + "y": 0.5441770553588867, + "index": 7 + }, + { + "x": 0.44944262504577637, + "y": 0.557908833026886, + "index": 8 + }, + { + "x": 0.42362532019615173, + "y": 0.5715233683586121, + "index": 9 + } + ] + }, + { + "line": 1, + "name": "heart", + "length": 0.23944558042810724, + "points": [ + { + "x": 0.5454532504081726, + "y": 0.4669409692287445, + "index": 0 + }, + { + "x": 0.52408766746521, + "y": 0.4827864170074463, + "index": 1 + }, + { + "x": 0.5013807415962219, + "y": 0.49750861525535583, + "index": 2 + }, + { + "x": 0.47692546248435974, + "y": 0.5094908475875854, + "index": 3 + }, + { + "x": 0.4513668119907379, + "y": 0.5182443857192993, + "index": 4 + }, + { + "x": 0.425459086894989, + "y": 0.5244477391242981, + "index": 5 + }, + { + "x": 0.39933067560195923, + "y": 0.5290610790252686, + "index": 6 + }, + { + "x": 0.37299594283103943, + "y": 0.5323299169540405, + "index": 7 + }, + { + "x": 0.3469693660736084, + "y": 0.5348974466323853, + "index": 8 + }, + { + "x": 0.3214002251625061, + "y": 0.5371947288513184, + "index": 9 + } + ] + }, + { + "line": 2, + "name": "life", + "length": 0.27602039439886533, + "points": [ + { + "x": 0.6747666001319885, + "y": 0.48946619033813477, + "index": 0 + }, + { + "x": 0.6424949169158936, + "y": 0.4948236048221588, + "index": 1 + }, + { + "x": 0.6103049516677856, + "y": 0.504563570022583, + "index": 2 + }, + { + "x": 0.582067608833313, + "y": 0.5203229784965515, + "index": 3 + }, + { + "x": 0.5579315423965454, + "y": 0.5406464338302612, + "index": 4 + }, + { + "x": 0.5371613502502441, + "y": 0.5636201500892639, + "index": 5 + }, + { + "x": 0.5198310017585754, + "y": 0.5876147150993347, + "index": 6 + }, + { + "x": 0.5054505467414856, + "y": 0.6126935482025146, + "index": 7 + }, + { + "x": 0.49504533410072327, + "y": 0.6387995481491089, + "index": 8 + }, + { + "x": 0.48840969800949097, + "y": 0.6662112474441528, + "index": 9 + } + ] + }, + { + "line": 3, + "name": "fate", + "length": 0.1753512430060647, + "points": [ + { + "x": 0.4977533221244812, + "y": 0.5203806757926941, + "index": 0 + }, + { + "x": 0.4947609007358551, + "y": 0.53874272108078, + "index": 1 + }, + { + "x": 0.4920171797275543, + "y": 0.5575401782989502, + "index": 2 + }, + { + "x": 0.48922133445739746, + "y": 0.5765413045883179, + "index": 3 + }, + { + "x": 0.48629242181777954, + "y": 0.5951840281486511, + "index": 4 + }, + { + "x": 0.48335185647010803, + "y": 0.6137608289718628, + "index": 5 + }, + { + "x": 0.4804533123970032, + "y": 0.6325837969779968, + "index": 6 + }, + { + "x": 0.4774535596370697, + "y": 0.652294933795929, + "index": 7 + }, + { + "x": 0.4748443067073822, + "y": 0.6727506518363953, + "index": 8 + }, + { + "x": 0.4731821119785309, + "y": 0.6939463019371033, + "index": 9 + } + ] + } + ], + fingers: [ + { + "name": "thumb", + "points": [ + { + "x": 0.6919277906417847, + "y": 0.6905663013458252, + "index": 1 + }, + { + "x": 0.7654542326927185, + "y": 0.5639110803604126, + "index": 2 + }, + { + "x": 0.7648746967315674, + "y": 0.45094460248947144, + "index": 3 + }, + { + "x": 0.7532707452774048, + "y": 0.3587830662727356, + "index": 4 + } + ], + "point": { + "x": 0.7532707452774048, + "y": 0.3587830662727356, + "index": 4 + } + }, + { + "name": "index_finger", + "points": [ + { + "x": 0.629044771194458, + "y": 0.46890249848365784, + "index": 5 + }, + { + "x": 0.6322332620620728, + "y": 0.3381287455558777, + "index": 6 + }, + { + "x": 0.6260355710983276, + "y": 0.26169881224632263, + "index": 7 + }, + { + "x": 0.6170427203178406, + "y": 0.1965172439813614, + "index": 8 + } + ], + "point": { + "x": 0.6170427203178406, + "y": 0.1965172439813614, + "index": 8 + } + }, + { + "name": "middle_finger", + "points": [ + { + "x": 0.5297880172729492, + "y": 0.4623960256576538, + "index": 9 + }, + { + "x": 0.5172679424285889, + "y": 0.3178204298019409, + "index": 10 + }, + { + "x": 0.5097583532333374, + "y": 0.2248000204563141, + "index": 11 + }, + { + "x": 0.50565105676651, + "y": 0.15598425269126892, + "index": 12 + } + ], + "point": { + "x": 0.50565105676651, + "y": 0.15598425269126892, + "index": 12 + } + }, + { + "name": "ring_finger", + "points": [ + { + "x": 0.43708211183547974, + "y": 0.4757952094078064, + "index": 13 + }, + { + "x": 0.41181623935699463, + "y": 0.3387151062488556, + "index": 14 + }, + { + "x": 0.40298160910606384, + "y": 0.2555214762687683, + "index": 15 + }, + { + "x": 0.4007391929626465, + "y": 0.18070074915885925, + "index": 16 + } + ], + "point": { + "x": 0.4007391929626465, + "y": 0.18070074915885925, + "index": 16 + } + }, + { + "name": "pinky", + "points": [ + { + "x": 0.34114739298820496, + "y": 0.5060560703277588, + "index": 17 + }, + { + "x": 0.32442063093185425, + "y": 0.40174177289009094, + "index": 18 + }, + { + "x": 0.3214150369167328, + "y": 0.3409586548805237, + "index": 19 + }, + { + "x": 0.32890862226486206, + "y": 0.2774677872657776, + "index": 20 + } + ], + "point": { + "x": 0.32890862226486206, + "y": 0.2774677872657776, + "index": 20 + } + } + ] + }, + { + image: "/users-hands/11.webp", + lines: [ + { + "line": 0, + "name": "life", + "length": 0.27986446853878694, + "points": [ + { + "x": 0.618566632270813, + "y": 0.46824008226394653, + "index": 0 + }, + { + "x": 0.5905712246894836, + "y": 0.4773085117340088, + "index": 1 + }, + { + "x": 0.5620425939559937, + "y": 0.4912749230861664, + "index": 2 + }, + { + "x": 0.5374438762664795, + "y": 0.510698139667511, + "index": 3 + }, + { + "x": 0.5174171328544617, + "y": 0.5343323349952698, + "index": 4 + }, + { + "x": 0.5008531808853149, + "y": 0.5606857538223267, + "index": 5 + }, + { + "x": 0.48718947172164917, + "y": 0.588307797908783, + "index": 6 + }, + { + "x": 0.47557705640792847, + "y": 0.6177451014518738, + "index": 7 + }, + { + "x": 0.4667263627052307, + "y": 0.6479958295822144, + "index": 8 + }, + { + "x": 0.4600556790828705, + "y": 0.6785205006599426, + "index": 9 + } + ] + }, + { + "line": 1, + "name": "head", + "length": 0.30658418170039453, + "points": [ + { + "x": 0.6293735504150391, + "y": 0.465299129486084, + "index": 0 + }, + { + "x": 0.5997413992881775, + "y": 0.47465386986732483, + "index": 1 + }, + { + "x": 0.5687931776046753, + "y": 0.484841912984848, + "index": 2 + }, + { + "x": 0.5378025770187378, + "y": 0.4973963797092438, + "index": 3 + }, + { + "x": 0.5068280100822449, + "y": 0.511231541633606, + "index": 4 + }, + { + "x": 0.4758278727531433, + "y": 0.5258786678314209, + "index": 5 + }, + { + "x": 0.44432276487350464, + "y": 0.541204571723938, + "index": 6 + }, + { + "x": 0.41207432746887207, + "y": 0.5570765733718872, + "index": 7 + }, + { + "x": 0.3800467550754547, + "y": 0.573519766330719, + "index": 8 + }, + { + "x": 0.34998616576194763, + "y": 0.590040922164917, + "index": 9 + } + ] + }, + { + "line": 2, + "name": "fate", + "length": 0.1771322572940441, + "points": [ + { + "x": 0.4483851492404938, + "y": 0.5521003007888794, + "index": 0 + }, + { + "x": 0.4431374669075012, + "y": 0.5703962445259094, + "index": 1 + }, + { + "x": 0.43792396783828735, + "y": 0.5895401835441589, + "index": 2 + }, + { + "x": 0.43301182985305786, + "y": 0.6089053153991699, + "index": 3 + }, + { + "x": 0.42814406752586365, + "y": 0.6278263330459595, + "index": 4 + }, + { + "x": 0.4231228232383728, + "y": 0.6462751626968384, + "index": 5 + }, + { + "x": 0.4176594614982605, + "y": 0.6644233465194702, + "index": 6 + }, + { + "x": 0.4111921191215515, + "y": 0.683151125907898, + "index": 7 + }, + { + "x": 0.4039568305015564, + "y": 0.7021531462669373, + "index": 8 + }, + { + "x": 0.396386981010437, + "y": 0.7212294340133667, + "index": 9 + } + ] + }, + { + "line": 3, + "name": "heart", + "length": 0.24088250588224747, + "points": [ + { + "x": 0.5064648389816284, + "y": 0.44137516617774963, + "index": 0 + }, + { + "x": 0.4850262701511383, + "y": 0.46124497056007385, + "index": 1 + }, + { + "x": 0.46237802505493164, + "y": 0.47930073738098145, + "index": 2 + }, + { + "x": 0.4387466311454773, + "y": 0.4940475523471832, + "index": 3 + }, + { + "x": 0.41462698578834534, + "y": 0.5048362612724304, + "index": 4 + }, + { + "x": 0.39051738381385803, + "y": 0.512855052947998, + "index": 5 + }, + { + "x": 0.3660307824611664, + "y": 0.5189394354820251, + "index": 6 + }, + { + "x": 0.34070226550102234, + "y": 0.5238248705863953, + "index": 7 + }, + { + "x": 0.3150724470615387, + "y": 0.5279721617698669, + "index": 8 + }, + { + "x": 0.28936657309532166, + "y": 0.5319486856460571, + "index": 9 + } + ] + } + ], + fingers: [ + { + "name": "thumb", + "points": [ + { + "x": 0.6326685547828674, + "y": 0.7459728717803955, + "index": 1 + }, + { + "x": 0.7442991137504578, + "y": 0.6085548400878906, + "index": 2 + }, + { + "x": 0.7648710012435913, + "y": 0.4693891704082489, + "index": 3 + }, + { + "x": 0.7752456665039062, + "y": 0.3551822900772095, + "index": 4 + } + ], + "point": { + "x": 0.7752456665039062, + "y": 0.3551822900772095, + "index": 4 + } + }, + { + "name": "index_finger", + "points": [ + { + "x": 0.5995916724205017, + "y": 0.40755370259284973, + "index": 5 + }, + { + "x": 0.5980050563812256, + "y": 0.22270795702934265, + "index": 6 + }, + { + "x": 0.5862535238265991, + "y": 0.09327912330627441, + "index": 7 + }, + { + "x": 0.574128270149231, + "y": -0.01394963264465332, + "index": 8 + } + ], + "point": { + "x": 0.574128270149231, + "y": -0.01394963264465332, + "index": 8 + } + }, + { + "name": "middle_finger", + "points": [ + { + "x": 0.48859161138534546, + "y": 0.4047553837299347, + "index": 9 + }, + { + "x": 0.4759027063846588, + "y": 0.21581342816352844, + "index": 10 + }, + { + "x": 0.47109222412109375, + "y": 0.07918453216552734, + "index": 11 + }, + { + "x": 0.47225236892700195, + "y": -0.030061990022659302, + "index": 12 + } + ], + "point": { + "x": 0.47225236892700195, + "y": -0.030061990022659302, + "index": 12 + } + }, + { + "name": "ring_finger", + "points": [ + { + "x": 0.39263853430747986, + "y": 0.4372289776802063, + "index": 13 + }, + { + "x": 0.38360512256622314, + "y": 0.2732914686203003, + "index": 14 + }, + { + "x": 0.38564741611480713, + "y": 0.16886118054389954, + "index": 15 + }, + { + "x": 0.38856804370880127, + "y": 0.080718994140625, + "index": 16 + } + ], + "point": { + "x": 0.38856804370880127, + "y": 0.080718994140625, + "index": 16 + } + }, + { + "name": "pinky", + "points": [ + { + "x": 0.2940848469734192, + "y": 0.49146944284439087, + "index": 17 + }, + { + "x": 0.28098535537719727, + "y": 0.3768775463104248, + "index": 18 + }, + { + "x": 0.27634263038635254, + "y": 0.3007510304450989, + "index": 19 + }, + { + "x": 0.2777516841888428, + "y": 0.22908960282802582, + "index": 20 + } + ], + "point": { + "x": 0.2777516841888428, + "y": 0.22908960282802582, + "index": 20 + } + } + ] + }, + { + image: "/users-hands/12.webp", + lines: [ + { + "line": 0, + "name": "life", + "length": 0.272006500096371, + "points": [ + { + "x": 0.5618983507156372, + "y": 0.4733566641807556, + "index": 0 + }, + { + "x": 0.5339315533638, + "y": 0.48462924361228943, + "index": 1 + }, + { + "x": 0.5080064535140991, + "y": 0.5017699003219604, + "index": 2 + }, + { + "x": 0.48715320229530334, + "y": 0.5251237154006958, + "index": 3 + }, + { + "x": 0.47155919671058655, + "y": 0.5529292821884155, + "index": 4 + }, + { + "x": 0.4603146016597748, + "y": 0.5826890468597412, + "index": 5 + }, + { + "x": 0.4536914825439453, + "y": 0.6123596429824829, + "index": 6 + }, + { + "x": 0.45181694626808167, + "y": 0.641417920589447, + "index": 7 + }, + { + "x": 0.4550209939479828, + "y": 0.6691323518753052, + "index": 8 + }, + { + "x": 0.4626438021659851, + "y": 0.6964419484138489, + "index": 9 + } + ] + }, + { + "line": 1, + "name": "heart", + "length": 0.24289331833634797, + "points": [ + { + "x": 0.467003732919693, + "y": 0.45381125807762146, + "index": 0 + }, + { + "x": 0.44701695442199707, + "y": 0.4716426432132721, + "index": 1 + }, + { + "x": 0.4246854782104492, + "y": 0.4888051450252533, + "index": 2 + }, + { + "x": 0.40009060502052307, + "y": 0.5036470890045166, + "index": 3 + }, + { + "x": 0.3745919466018677, + "y": 0.5157381892204285, + "index": 4 + }, + { + "x": 0.3492727279663086, + "y": 0.5257104635238647, + "index": 5 + }, + { + "x": 0.32399553060531616, + "y": 0.5337995290756226, + "index": 6 + }, + { + "x": 0.2989029288291931, + "y": 0.5403784513473511, + "index": 7 + }, + { + "x": 0.27412623167037964, + "y": 0.5462101101875305, + "index": 8 + }, + { + "x": 0.24879208207130432, + "y": 0.5513526201248169, + "index": 9 + } + ] + }, + { + "line": 2, + "name": "head", + "length": 0.23111728155093014, + "points": [ + { + "x": 0.571992814540863, + "y": 0.48026689887046814, + "index": 0 + }, + { + "x": 0.5498422980308533, + "y": 0.4862779676914215, + "index": 1 + }, + { + "x": 0.5268558859825134, + "y": 0.4925159513950348, + "index": 2 + }, + { + "x": 0.5033723711967468, + "y": 0.500717043876648, + "index": 3 + }, + { + "x": 0.47984248399734497, + "y": 0.5104244947433472, + "index": 4 + }, + { + "x": 0.4564540386199951, + "y": 0.5218679904937744, + "index": 5 + }, + { + "x": 0.4332870841026306, + "y": 0.5348158478736877, + "index": 6 + }, + { + "x": 0.4099048674106598, + "y": 0.5490593314170837, + "index": 7 + }, + { + "x": 0.38703614473342896, + "y": 0.5643046498298645, + "index": 8 + }, + { + "x": 0.3650277256965637, + "y": 0.5792063474655151, + "index": 9 + } + ] + }, + { + "line": 3, + "name": "fate", + "length": 0.11689158292214606, + "points": [ + { + "x": 0.41769784688949585, + "y": 0.5444806814193726, + "index": 0 + }, + { + "x": 0.41563135385513306, + "y": 0.556576669216156, + "index": 1 + }, + { + "x": 0.4137071669101715, + "y": 0.568740725517273, + "index": 2 + }, + { + "x": 0.4119836688041687, + "y": 0.5808608531951904, + "index": 3 + }, + { + "x": 0.4104098379611969, + "y": 0.5930981636047363, + "index": 4 + }, + { + "x": 0.40911903977394104, + "y": 0.6059028506278992, + "index": 5 + }, + { + "x": 0.40812912583351135, + "y": 0.6188070774078369, + "index": 6 + }, + { + "x": 0.40732336044311523, + "y": 0.6322540640830994, + "index": 7 + }, + { + "x": 0.4068371653556824, + "y": 0.6458262205123901, + "index": 8 + }, + { + "x": 0.4061465263366699, + "y": 0.6606713533401489, + "index": 9 + } + ] + } + ], + fingers: [ + { + "name": "thumb", + "points": [ + { + "x": 0.5913177132606506, + "y": 0.7017008662223816, + "index": 1 + }, + { + "x": 0.6930131912231445, + "y": 0.5976396799087524, + "index": 2 + }, + { + "x": 0.7536396980285645, + "y": 0.5068346261978149, + "index": 3 + }, + { + "x": 0.8094207048416138, + "y": 0.4404853880405426, + "index": 4 + } + ], + "point": { + "x": 0.8094207048416138, + "y": 0.4404853880405426, + "index": 4 + } + }, + { + "name": "index_finger", + "points": [ + { + "x": 0.5161972045898438, + "y": 0.43984076380729675, + "index": 5 + }, + { + "x": 0.5168126225471497, + "y": 0.3088724613189697, + "index": 6 + }, + { + "x": 0.5122025609016418, + "y": 0.22948504984378815, + "index": 7 + }, + { + "x": 0.5070571899414062, + "y": 0.16142946481704712, + "index": 8 + } + ], + "point": { + "x": 0.5070571899414062, + "y": 0.16142946481704712, + "index": 8 + } + }, + { + "name": "middle_finger", + "points": [ + { + "x": 0.42602935433387756, + "y": 0.4377683401107788, + "index": 9 + }, + { + "x": 0.42296862602233887, + "y": 0.2913185954093933, + "index": 10 + }, + { + "x": 0.4189561903476715, + "y": 0.19413363933563232, + "index": 11 + }, + { + "x": 0.4151003062725067, + "y": 0.11569207906723022, + "index": 12 + } + ], + "point": { + "x": 0.4151003062725067, + "y": 0.11569207906723022, + "index": 12 + } + }, + { + "name": "ring_finger", + "points": [ + { + "x": 0.34433895349502563, + "y": 0.46202847361564636, + "index": 13 + }, + { + "x": 0.3338821530342102, + "y": 0.3291301727294922, + "index": 14 + }, + { + "x": 0.33765190839767456, + "y": 0.24779967963695526, + "index": 15 + }, + { + "x": 0.3427547216415405, + "y": 0.1791362166404724, + "index": 16 + } + ], + "point": { + "x": 0.3427547216415405, + "y": 0.1791362166404724, + "index": 16 + } + }, + { + "name": "pinky", + "points": [ + { + "x": 0.26170438528060913, + "y": 0.5080552697181702, + "index": 17 + }, + { + "x": 0.24781005084514618, + "y": 0.4129035472869873, + "index": 18 + }, + { + "x": 0.24952994287014008, + "y": 0.3559885323047638, + "index": 19 + }, + { + "x": 0.2531369626522064, + "y": 0.3000197410583496, + "index": 20 + } + ], + "point": { + "x": 0.2531369626522064, + "y": 0.3000197410583496, + "index": 20 + } + } + ] + }, + { + image: "/users-hands/13.webp", + lines: [ + { + "line": 0, + "name": "life", + "length": 0.34834070728694866, + "points": [ + { + "x": 0.6305800080299377, + "y": 0.4901955723762512, + "index": 0 + }, + { + "x": 0.5932731628417969, + "y": 0.5002427101135254, + "index": 1 + }, + { + "x": 0.5562163591384888, + "y": 0.5156407952308655, + "index": 2 + }, + { + "x": 0.52440345287323, + "y": 0.5383899807929993, + "index": 3 + }, + { + "x": 0.4987627863883972, + "y": 0.567177414894104, + "index": 4 + }, + { + "x": 0.47818392515182495, + "y": 0.6000396609306335, + "index": 5 + }, + { + "x": 0.4623447060585022, + "y": 0.6347584128379822, + "index": 6 + }, + { + "x": 0.4505179524421692, + "y": 0.6712850332260132, + "index": 7 + }, + { + "x": 0.4434386193752289, + "y": 0.7089108824729919, + "index": 8 + }, + { + "x": 0.4400510787963867, + "y": 0.7470614314079285, + "index": 9 + } + ] + }, + { + "line": 1, + "name": "head", + "length": 0.32141207532761473, + "points": [ + { + "x": 0.6362072825431824, + "y": 0.48955073952674866, + "index": 0 + }, + { + "x": 0.6049917936325073, + "y": 0.4974815845489502, + "index": 1 + }, + { + "x": 0.5724968910217285, + "y": 0.506289005279541, + "index": 2 + }, + { + "x": 0.5402248501777649, + "y": 0.5176414251327515, + "index": 3 + }, + { + "x": 0.5080782771110535, + "y": 0.5304904580116272, + "index": 4 + }, + { + "x": 0.4756802022457123, + "y": 0.5445358753204346, + "index": 5 + }, + { + "x": 0.442368745803833, + "y": 0.5596536993980408, + "index": 6 + }, + { + "x": 0.4077781140804291, + "y": 0.5761142373085022, + "index": 7 + }, + { + "x": 0.3730558753013611, + "y": 0.593891441822052, + "index": 8 + }, + { + "x": 0.3404213786125183, + "y": 0.6123613119125366, + "index": 9 + } + ] + }, + { + "line": 2, + "name": "heart", + "length": 0.3460668537744951, + "points": [ + { + "x": 0.5413947105407715, + "y": 0.4544817805290222, + "index": 0 + }, + { + "x": 0.5093321800231934, + "y": 0.4805573523044586, + "index": 1 + }, + { + "x": 0.47434526681900024, + "y": 0.5050442218780518, + "index": 2 + }, + { + "x": 0.4374377131462097, + "y": 0.5249415636062622, + "index": 3 + }, + { + "x": 0.3993625044822693, + "y": 0.5385671257972717, + "index": 4 + }, + { + "x": 0.36164990067481995, + "y": 0.5468075275421143, + "index": 5 + }, + { + "x": 0.324700266122818, + "y": 0.5514727830886841, + "index": 6 + }, + { + "x": 0.2885156571865082, + "y": 0.5531754493713379, + "index": 7 + }, + { + "x": 0.2540014684200287, + "y": 0.5531682372093201, + "index": 8 + }, + { + "x": 0.22093264758586884, + "y": 0.5540851950645447, + "index": 9 + } + ] + }, + { + "line": 3, + "name": "fate", + "length": 0.12335005291165771, + "points": [ + { + "x": 0.4316824972629547, + "y": 0.5932021737098694, + "index": 0 + }, + { + "x": 0.42749160528182983, + "y": 0.6060136556625366, + "index": 1 + }, + { + "x": 0.42319750785827637, + "y": 0.6189793348312378, + "index": 2 + }, + { + "x": 0.41870570182800293, + "y": 0.631545901298523, + "index": 3 + }, + { + "x": 0.4140225946903229, + "y": 0.6437729001045227, + "index": 4 + }, + { + "x": 0.40891146659851074, + "y": 0.6562290787696838, + "index": 5 + }, + { + "x": 0.4034406542778015, + "y": 0.6683810353279114, + "index": 6 + }, + { + "x": 0.3975617289543152, + "y": 0.680609941482544, + "index": 7 + }, + { + "x": 0.3912830054759979, + "y": 0.6930442452430725, + "index": 8 + }, + { + "x": 0.38410621881484985, + "y": 0.7067656517028809, + "index": 9 + } + ] + } + ], + fingers: [ + { + "name": "thumb", + "points": [ + { + "x": 0.6691831350326538, + "y": 0.729007363319397, + "index": 1 + }, + { + "x": 0.7478970885276794, + "y": 0.5749192833900452, + "index": 2 + }, + { + "x": 0.7187079191207886, + "y": 0.42799100279808044, + "index": 3 + }, + { + "x": 0.7127817869186401, + "y": 0.3226947784423828, + "index": 4 + } + ], + "point": { + "x": 0.7127817869186401, + "y": 0.3226947784423828, + "index": 4 + } + }, + { + "name": "index_finger", + "points": [ + { + "x": 0.5997512936592102, + "y": 0.47441399097442627, + "index": 5 + }, + { + "x": 0.6046947240829468, + "y": 0.3128979802131653, + "index": 6 + }, + { + "x": 0.5963109135627747, + "y": 0.21133700013160706, + "index": 7 + }, + { + "x": 0.5893417596817017, + "y": 0.11838430166244507, + "index": 8 + } + ], + "point": { + "x": 0.5893417596817017, + "y": 0.11838430166244507, + "index": 8 + } + }, + { + "name": "middle_finger", + "points": [ + { + "x": 0.491919606924057, + "y": 0.4647316038608551, + "index": 9 + }, + { + "x": 0.49733343720436096, + "y": 0.2817534804344177, + "index": 10 + }, + { + "x": 0.5003002285957336, + "y": 0.15866440534591675, + "index": 11 + }, + { + "x": 0.5136818289756775, + "y": 0.055710017681121826, + "index": 12 + } + ], + "point": { + "x": 0.5136818289756775, + "y": 0.055710017681121826, + "index": 12 + } + }, + { + "name": "ring_finger", + "points": [ + { + "x": 0.3934590816497803, + "y": 0.4814552068710327, + "index": 13 + }, + { + "x": 0.38676917552948, + "y": 0.31298908591270447, + "index": 14 + }, + { + "x": 0.39809173345565796, + "y": 0.20615239441394806, + "index": 15 + }, + { + "x": 0.41729873418807983, + "y": 0.11798685789108276, + "index": 16 + } + ], + "point": { + "x": 0.41729873418807983, + "y": 0.11798685789108276, + "index": 16 + } + }, + { + "name": "pinky", + "points": [ + { + "x": 0.2831759452819824, + "y": 0.5197810530662537, + "index": 17 + }, + { + "x": 0.28053805232048035, + "y": 0.38561388850212097, + "index": 18 + }, + { + "x": 0.29141172766685486, + "y": 0.29558899998664856, + "index": 19 + }, + { + "x": 0.3077738583087921, + "y": 0.21374720335006714, + "index": 20 + } + ], + "point": { + "x": 0.3077738583087921, + "y": 0.21374720335006714, + "index": 20 + } + } + ] + }, +] + +/** + * Функция для случайного перемешивания массива рук + * Использует алгоритм Фишера-Йейтса (тасование Кнута) + * @returns Новый перемешанный массив рук + */ +export const getShuffledHands = () => { + const shuffledHands = [...hands]; + + for (let i = shuffledHands.length - 1; i > 0; i--) { + const j = Math.floor(Math.random() * (i + 1)); + + [shuffledHands[i], shuffledHands[j]] = [shuffledHands[j], shuffledHands[i]]; + } + + return shuffledHands; +}; diff --git a/src/hooks/handsGeneration/useHandsGeneration.ts b/src/hooks/handsGeneration/useHandsGeneration.ts new file mode 100644 index 0000000..ca8801f --- /dev/null +++ b/src/hooks/handsGeneration/useHandsGeneration.ts @@ -0,0 +1,138 @@ +import { IPalmistryFinger, IPalmistryLine } from '@/api/resources/Palmistry'; +import { useState, useEffect, useCallback, useRef } from 'react'; +import { getShuffledHands } from './hands'; + +const hands = getShuffledHands(); + +export interface DisplayHand { + image: string; + willBeRemoved: boolean; + id: number; + lines: IPalmistryLine[]; + fingers: IPalmistryFinger[]; +} + +interface HandsToDelete { + hands: DisplayHand[]; + deleteAt: number; + markAt: number; + marked: boolean; +} + +export const useHandsGeneration = () => { + const [displayHands, setDisplayHands] = useState([]); + const [handsToDeleteQueue, setHandsToDeleteQueue] = useState([]); + const currentHandIndexRef = useRef(1); + + const minHands = 1; + const maxHands = 5; + + const getHand = useCallback(() => { + const currentIndex = currentHandIndexRef.current; + + currentHandIndexRef.current = currentIndex >= hands.length ? 1 : currentIndex + 1; + + const currentHand = hands[currentIndex - 1]; + + return { + id: Date.now() + Math.random(), + image: currentHand.image, + willBeRemoved: false, + lines: currentHand.lines, + fingers: currentHand.fingers + } + }, []); + + const createHand = useCallback(() => { + return getHand(); + }, [getHand]); + + useEffect(() => { + addHands(3); + return () => setDisplayHands([]); + }, []); + + const addHands = useCallback((countHands?: number) => { + const addHandsTimeout = 6000 + Math.random() * 4000; + + const count = !!countHands ? countHands : Math.random() < 0.6 ? 1 : 2; + const _newHands = Array(count).fill(null).map(createHand); + + setDisplayHands(prev => { + const updatedHands = [...prev, ..._newHands].slice(-maxHands); + + if (updatedHands.length < minHands) { + const additionalCount = minHands - updatedHands.length; + const additionalHands = Array(additionalCount).fill(null).map(createHand); + return [...updatedHands, ...additionalHands]; + } + + return updatedHands; + }); + + const now = Date.now(); + setHandsToDeleteQueue(prev => [...prev, ..._newHands.map((value) => { + const deleteTime = 6000 + Math.random() * 20000; + return { + hands: [value], + deleteAt: now + deleteTime, + markAt: now + deleteTime - 3000, + marked: false + } + })]); + + const timeoutAddHands = setTimeout(() => { + addHands(); + clearTimeout(timeoutAddHands); + }, addHandsTimeout); + }, [createHand]); + + useEffect(() => { + if (handsToDeleteQueue.length === 0) return; + + const checkQueue = () => { + const now = Date.now(); + + setHandsToDeleteQueue(prev => { + const updatedQueue = [...prev]; + let hasChanges = false; + + updatedQueue.forEach(item => { + if (displayHands.length <= minHands) return; + if (!item.marked && now >= item.markAt) { + markHands(item.hands); + item.marked = true; + hasChanges = true; + } + if (now >= item.deleteAt) { + deleteHands(item.hands); + hasChanges = true; + } + }); + + return hasChanges ? updatedQueue.filter(item => now < item.deleteAt) : updatedQueue; + }); + }; + + const interval = setInterval(checkQueue, 100); + return () => clearInterval(interval); + }, [handsToDeleteQueue]); + + const deleteHands = (handsToDelete: DisplayHand[]) => { + setDisplayHands(prev => + prev.filter(hand => !handsToDelete.some(h => h.id === hand.id)) + ); + } + + const markHands = (handsToMark: DisplayHand[]) => { + setDisplayHands(prev => + prev.map(hand => + handsToMark.some(h => h.id === hand.id) + ? { ...hand, willBeRemoved: true } + : hand + ) + ); + } + + return { displayHands }; +}; \ No newline at end of file