soccer-jersey-fork 1.0.121 → 1.0.122
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/lib/patterns/patterns.js
CHANGED
|
@@ -345,7 +345,7 @@ secondaryColor, dashDirection) => {
|
|
|
345
345
|
};
|
|
346
346
|
export const addShortSideColor = (page, color) => {
|
|
347
347
|
page
|
|
348
|
-
.path(`m 25 100
|
|
348
|
+
.path(`m 25 100 l -1 40`)
|
|
349
349
|
.fill("none")
|
|
350
350
|
.stroke({ width: 2, color, linecap: "butt" });
|
|
351
351
|
page
|
|
@@ -356,22 +356,22 @@ export const addShortSideColor = (page, color) => {
|
|
|
356
356
|
export function addShoulderSideColor(page, color) {
|
|
357
357
|
// left
|
|
358
358
|
page
|
|
359
|
-
.path(`m 0 35
|
|
359
|
+
.path(`m 0 35 l 16.5 -26 20 -8.5`)
|
|
360
360
|
.fill("none")
|
|
361
361
|
.stroke({ width: 2, color, linecap: "butt" });
|
|
362
362
|
// right
|
|
363
363
|
page
|
|
364
|
-
.path(`m 101 35 l -16.5 -26
|
|
364
|
+
.path(`m 101 35 l -16.5 -26 -21 -8.5`)
|
|
365
365
|
.fill("none")
|
|
366
366
|
.stroke({ width: 2, color, linecap: "butt" });
|
|
367
367
|
}
|
|
368
368
|
export function addShirtSideColor(page, color) {
|
|
369
369
|
page
|
|
370
|
-
.path(`m 25.5 45
|
|
370
|
+
.path(`m 25.5 45 c 1 10 1 40 0 50`)
|
|
371
371
|
.fill("none")
|
|
372
372
|
.stroke({ width: 2, color, linecap: "round" });
|
|
373
373
|
page
|
|
374
|
-
.path(`m 76.5 45
|
|
374
|
+
.path(`m 76.5 45 c -1 10 -1 40 0 50`)
|
|
375
375
|
.fill("none")
|
|
376
376
|
.stroke({ width: 2, color, linecap: "round" });
|
|
377
377
|
}
|
|
@@ -9,11 +9,12 @@ import { SVG } from "@svgdotjs/svg.js";
|
|
|
9
9
|
import lightenDarkenColor from "./lighten-darken-color";
|
|
10
10
|
import { addShirtSideColor, addShortSideColor, addShoulderSideColor, drawCheckered, drawConcentricCircles, drawCrisscross, drawCrossLines, drawDashes, drawDiamonds, drawSingleBand, drawSingleBandThin, drawSleeveContrastingTwoColors, drawSleeveTwoColors, drawStriped, drawTwoColors, drawWaves, } from "../patterns/patterns";
|
|
11
11
|
export default function drawSoccerJersey({ shirtColor = "plain", shirtStyle, shirtStyleColor, shirtStyleDirection, shirtWidth = 200, shoulderSideColor, shirtSideColor, shirtBottomColor, sleeveColor = shirtColor, sleeveCuffColor, sleeveStyleColor, sleeveStyle, sleeveStyleDirection, sleeveType, collarColor, collarType, shortsColor, shortsCuffColor, shortsSideColor, images, texts, shortsStyle, shortsStyleDirection, shortsStyleColor, }) {
|
|
12
|
+
const isLongSleeve = sleeveType === "long";
|
|
12
13
|
// 3. DRAW SLEEVES FIRST (Background Layer)
|
|
13
|
-
const
|
|
14
|
+
const leftSleevePath = isLongSleeve
|
|
14
15
|
? "M 17.4 9 C 9.7 13.9 8.6 24.4 7.5 32.6 C 5.7 43 7.3 61 6 90.1 C 7.7 92 8.6 91.9 12.1 92 C 14.8 92 14.8 92.1 17.8 90.7 C 18.4 85.4 18.4 76.6 19.4 64.2 C 20 57.3 20.8 44.8 22.6 37.4 C 22.3 27.6 20 18.7 18 8.6 Z"
|
|
15
16
|
: "m18 8.5c-4 3-6.1 7.7-8.9 12-3.1 4.9-6 9.9-8.8 15 6 4 12 8.2 19 10 4.1.38 4.3-5.3 3.8-8.2-.29-9.7-3-19-5-29z";
|
|
16
|
-
const
|
|
17
|
+
const rightSleevePath = isLongSleeve
|
|
17
18
|
? "M 82.9 8.2 C 90.7 13.2 91.8 23.7 92.9 31.9 C 94.7 42.2 93.1 60.2 94.4 89.3 C 92.7 91.2 91.8 91.1 88.3 91.2 C 85.5 91.2 85.6 91.3 82.6 89.9 C 81.9 84.6 81.9 75.7 80.9 63.3 C 80.3 56.5 79.5 43.9 77.6 36.6 C 77.9 26.8 80.2 17.9 82.3 7.8 Z"
|
|
18
19
|
: "m83 8.1c4 3 6.1 7.7 8.9 12 3.1 4.9 6 9.9 8.8 15-6 4-12 8.2-19 10-4.1.38-4.3-5.3-3.8-8.2.3-9.7 3-19 5-29z";
|
|
19
20
|
const pathMainBody = "m83 8c-6.4-2.3-13-5.3-19-8 1.4 5.4-5.4 8.2-10 8.7-5.8.68-13-.075-17-5-1.2-2.1.62-5.1-2.8-2.6-5.6 2.6-11 5.5-17 7.9 5.6 21 3.3 17 6.2 40-.14 15 .16 30-.79 45 1.6 4.7 9.5 4 14 5.2 13 1.8 26 1.2 39-2.3 5.7-1.5 1.5-8.1 2.5-12-.32-15-.32-29-.32-44 5.5-37 1.6-12 4.9-33z";
|
|
@@ -26,8 +27,8 @@ export default function drawSoccerJersey({ shirtColor = "plain", shirtStyle, shi
|
|
|
26
27
|
sleeveStyleColor = sleeveStyleColor || "#eee";
|
|
27
28
|
sleeveStyleDirection = sleeveStyleDirection || "vertical";
|
|
28
29
|
const sleeveFill = getPatternFill(page, optimizedSleeveColor, sleeveStyle, sleeveStyleColor, "sleeve", sleeveStyleDirection);
|
|
29
|
-
page.path(
|
|
30
|
-
page.path(
|
|
30
|
+
page.path(leftSleevePath).fill(sleeveFill);
|
|
31
|
+
page.path(rightSleevePath).fill(sleeveFill);
|
|
31
32
|
// neck
|
|
32
33
|
page.path(pathNeck).fill(lightenDarkenColor(shirtColor, -50));
|
|
33
34
|
// shirt
|
|
@@ -44,12 +45,16 @@ export default function drawSoccerJersey({ shirtColor = "plain", shirtStyle, shi
|
|
|
44
45
|
addShoulderSideColor(page, shoulderSideColor);
|
|
45
46
|
}
|
|
46
47
|
if (sleeveCuffColor) {
|
|
47
|
-
const pathLeftSleeveCuff =
|
|
48
|
+
const pathLeftSleeveCuff = isLongSleeve
|
|
49
|
+
? "M 7.5 91.5 Q 11.9 92 16.5 91.5"
|
|
50
|
+
: "m1.5 36 c 5 5 12.5 8 18.5 9";
|
|
51
|
+
const pathRightSleeveCuff = isLongSleeve
|
|
52
|
+
? "M 84 91 Q 88.5 91 93 90.5"
|
|
53
|
+
: "m100 36 c -5 5 -12.5 8 -18.5 9";
|
|
48
54
|
page
|
|
49
55
|
.path(pathLeftSleeveCuff)
|
|
50
56
|
.fill(sleeveCuffColor)
|
|
51
57
|
.stroke({ color: sleeveCuffColor, width: 3, linecap: "round" });
|
|
52
|
-
const pathRightSleeveCuff = "m100 36 c -5 5 -12.5 8 -18.5 9";
|
|
53
58
|
page
|
|
54
59
|
.path(pathRightSleeveCuff)
|
|
55
60
|
.fill(sleeveCuffColor)
|
|
@@ -67,11 +72,11 @@ export default function drawSoccerJersey({ shirtColor = "plain", shirtStyle, shi
|
|
|
67
72
|
.stroke({ color: shirtBottomColor, width: 3, linecap: "round" });
|
|
68
73
|
}
|
|
69
74
|
const SHORT_HEIGHT = 40;
|
|
70
|
-
const pathShorts = `m 23 98 c 5 6
|
|
71
|
-
//
|
|
72
|
-
|
|
73
|
-
//
|
|
74
|
-
|
|
75
|
+
const pathShorts = `m 23 98 c 5 6 50 6 56 0 l 2 ${SHORT_HEIGHT} c 0 5 -27 5 -27.5 0 l -2 -10 -2 10 c 0 5 -27 5 -27.5 0 l 1 -${SHORT_HEIGHT}`;
|
|
76
|
+
// Left Leg Bottom: Sweeps smoothly from X=22 to X=49.5 matching the shorts curve profile
|
|
77
|
+
const pathShortsCuffLeft = "M 22 140 C 22 141, 48.5 141, 49 140";
|
|
78
|
+
// Right Leg Bottom: Sweeps smoothly from X=53.5 to X=81 matching the shorts curve profile
|
|
79
|
+
const pathShortsCuffRight = "M 54.5 140 C 55 141, 80 141, 80.5 140";
|
|
75
80
|
const shortsFill = getPatternFill(page, shortsColor, shortsStyle, shortsStyleColor || "#eee", "shorts", shortsStyleDirection);
|
|
76
81
|
page.path(pathShorts).fill(shortsFill).stroke({
|
|
77
82
|
width: 1,
|
|
@@ -91,8 +96,6 @@ export default function drawSoccerJersey({ shirtColor = "plain", shirtStyle, shi
|
|
|
91
96
|
addShortSideColor(page, shortsSideColor);
|
|
92
97
|
}
|
|
93
98
|
if (shortsCuffColor) {
|
|
94
|
-
const pathShortsCuffLeft = `m 23 138 c 5 5, 22 5, 26.5 0`;
|
|
95
|
-
const pathShortsCuffRight = `m 54 138 c 5 5, 22 5, 26.5 0`;
|
|
96
99
|
page
|
|
97
100
|
.path(pathShortsCuffLeft)
|
|
98
101
|
.fill("none")
|