@amphore-dev/shades 0.5.0
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/LICENSE +21 -0
- package/README.md +317 -0
- package/dist/classes/ShadesEngine.d.ts +65 -0
- package/dist/classes/ShadesEngine.d.ts.map +1 -0
- package/dist/classes/ShadesEngine.js +386 -0
- package/dist/classes/ShadesEngine.js.map +1 -0
- package/dist/classes/index.d.ts +3 -0
- package/dist/classes/index.d.ts.map +1 -0
- package/dist/classes/index.js +3 -0
- package/dist/classes/index.js.map +1 -0
- package/dist/classes/shapes/BaseShape.d.ts +20 -0
- package/dist/classes/shapes/BaseShape.d.ts.map +1 -0
- package/dist/classes/shapes/BaseShape.js +45 -0
- package/dist/classes/shapes/BaseShape.js.map +1 -0
- package/dist/classes/shapes/CircleShape.d.ts +11 -0
- package/dist/classes/shapes/CircleShape.d.ts.map +1 -0
- package/dist/classes/shapes/CircleShape.js +25 -0
- package/dist/classes/shapes/CircleShape.js.map +1 -0
- package/dist/classes/shapes/ImageShape.d.ts +22 -0
- package/dist/classes/shapes/ImageShape.d.ts.map +1 -0
- package/dist/classes/shapes/ImageShape.js +107 -0
- package/dist/classes/shapes/ImageShape.js.map +1 -0
- package/dist/classes/shapes/SpiralShape.d.ts +11 -0
- package/dist/classes/shapes/SpiralShape.d.ts.map +1 -0
- package/dist/classes/shapes/SpiralShape.js +28 -0
- package/dist/classes/shapes/SpiralShape.js.map +1 -0
- package/dist/classes/shapes/SquaredShape.d.ts +11 -0
- package/dist/classes/shapes/SquaredShape.d.ts.map +1 -0
- package/dist/classes/shapes/SquaredShape.js +25 -0
- package/dist/classes/shapes/SquaredShape.js.map +1 -0
- package/dist/classes/shapes/TextShape.d.ts +16 -0
- package/dist/classes/shapes/TextShape.d.ts.map +1 -0
- package/dist/classes/shapes/TextShape.js +35 -0
- package/dist/classes/shapes/TextShape.js.map +1 -0
- package/dist/classes/shapes/TriangleShape.d.ts +11 -0
- package/dist/classes/shapes/TriangleShape.d.ts.map +1 -0
- package/dist/classes/shapes/TriangleShape.js +46 -0
- package/dist/classes/shapes/TriangleShape.js.map +1 -0
- package/dist/classes/shapes/index.d.ts +8 -0
- package/dist/classes/shapes/index.d.ts.map +1 -0
- package/dist/classes/shapes/index.js +10 -0
- package/dist/classes/shapes/index.js.map +1 -0
- package/dist/constants/CColors.d.ts +6 -0
- package/dist/constants/CColors.d.ts.map +1 -0
- package/dist/constants/CColors.js +35 -0
- package/dist/constants/CColors.js.map +1 -0
- package/dist/constants/CFilters.d.ts +8 -0
- package/dist/constants/CFilters.d.ts.map +1 -0
- package/dist/constants/CFilters.js +15 -0
- package/dist/constants/CFilters.js.map +1 -0
- package/dist/constants/CShades.d.ts +3 -0
- package/dist/constants/CShades.d.ts.map +1 -0
- package/dist/constants/CShades.js +10 -0
- package/dist/constants/CShades.js.map +1 -0
- package/dist/constants/index.d.ts +4 -0
- package/dist/constants/index.d.ts.map +1 -0
- package/dist/constants/index.js +4 -0
- package/dist/constants/index.js.map +1 -0
- package/dist/index.d.ts +5 -0
- package/dist/index.d.ts.map +1 -0
- package/dist/index.js +8 -0
- package/dist/index.js.map +1 -0
- package/dist/types/TPoints.d.ts +8 -0
- package/dist/types/TPoints.d.ts.map +1 -0
- package/dist/types/TPoints.js +2 -0
- package/dist/types/TPoints.js.map +1 -0
- package/dist/types/TShadeItem.d.ts +6 -0
- package/dist/types/TShadeItem.d.ts.map +1 -0
- package/dist/types/TShadeItem.js +2 -0
- package/dist/types/TShadeItem.js.map +1 -0
- package/dist/types/TShades.d.ts +11 -0
- package/dist/types/TShades.d.ts.map +1 -0
- package/dist/types/TShades.js +10 -0
- package/dist/types/TShades.js.map +1 -0
- package/dist/types/TShadesConfig.d.ts +26 -0
- package/dist/types/TShadesConfig.d.ts.map +1 -0
- package/dist/types/TShadesConfig.js +2 -0
- package/dist/types/TShadesConfig.js.map +1 -0
- package/dist/types/TShapeOptions.d.ts +6 -0
- package/dist/types/TShapeOptions.d.ts.map +1 -0
- package/dist/types/TShapeOptions.js +2 -0
- package/dist/types/TShapeOptions.js.map +1 -0
- package/dist/types/index.d.ts +6 -0
- package/dist/types/index.d.ts.map +1 -0
- package/dist/types/index.js +6 -0
- package/dist/types/index.js.map +1 -0
- package/dist/utils/UColors.d.ts +18 -0
- package/dist/utils/UColors.d.ts.map +1 -0
- package/dist/utils/UColors.js +44 -0
- package/dist/utils/UColors.js.map +1 -0
- package/dist/utils/UMaths.d.ts +9 -0
- package/dist/utils/UMaths.d.ts.map +1 -0
- package/dist/utils/UMaths.js +14 -0
- package/dist/utils/UMaths.js.map +1 -0
- package/dist/utils/UShadeUtils.d.ts +8 -0
- package/dist/utils/UShadeUtils.d.ts.map +1 -0
- package/dist/utils/UShadeUtils.js +75 -0
- package/dist/utils/UShadeUtils.js.map +1 -0
- package/dist/utils/index.d.ts +4 -0
- package/dist/utils/index.d.ts.map +1 -0
- package/dist/utils/index.js +4 -0
- package/dist/utils/index.js.map +1 -0
- package/package.json +71 -0
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import { TPoint } from "./TPoints.js";
|
|
2
|
+
import { TShadeColor } from "./TShadeItem.js";
|
|
3
|
+
import { TShadeType } from "./TShades.js";
|
|
4
|
+
export type TShadeFilter = (itemColor: TShadeColor, mainColor: TShadeColor) => boolean;
|
|
5
|
+
export type TShadeConfig = {
|
|
6
|
+
width: number;
|
|
7
|
+
height: number;
|
|
8
|
+
spacing: number;
|
|
9
|
+
thickness: number;
|
|
10
|
+
nbrShades: number;
|
|
11
|
+
nbrItemsX: number;
|
|
12
|
+
nbrItemsY: number;
|
|
13
|
+
offsetX: number;
|
|
14
|
+
offsetY: number;
|
|
15
|
+
center: TPoint;
|
|
16
|
+
totalWidth: number;
|
|
17
|
+
totalHeight: number;
|
|
18
|
+
gradRatio: number;
|
|
19
|
+
type: TShadeType;
|
|
20
|
+
colors?: TShadeColor[];
|
|
21
|
+
mainColor?: TShadeColor;
|
|
22
|
+
lineCap?: CanvasLineCap;
|
|
23
|
+
rotationFilter: TShadeFilter;
|
|
24
|
+
fillFilter: TShadeFilter;
|
|
25
|
+
};
|
|
26
|
+
//# sourceMappingURL=TShadesConfig.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TShadesConfig.d.ts","sourceRoot":"","sources":["../../src/types/TShadesConfig.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,cAAc,CAAC;AAEtC,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAC9C,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAE1C,MAAM,MAAM,YAAY,GAAG,CACzB,SAAS,EAAE,WAAW,EACtB,SAAS,EAAE,WAAW,KACnB,OAAO,CAAC;AAEb,MAAM,MAAM,YAAY,GAAG;IACzB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,MAAM,CAAC;IAChB,SAAS,EAAE,MAAM,CAAC;IAClB,SAAS,EAAE,MAAM,CAAC;IAClB,SAAS,EAAE,MAAM,CAAC;IAClB,SAAS,EAAE,MAAM,CAAC;IAClB,OAAO,EAAE,MAAM,CAAC;IAChB,OAAO,EAAE,MAAM,CAAC;IAChB,MAAM,EAAE,MAAM,CAAC;IACf,UAAU,EAAE,MAAM,CAAC;IACnB,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,EAAE,MAAM,CAAC;IAClB,IAAI,EAAE,UAAU,CAAC;IACjB,MAAM,CAAC,EAAE,WAAW,EAAE,CAAC;IACvB,SAAS,CAAC,EAAE,WAAW,CAAC;IACxB,OAAO,CAAC,EAAE,aAAa,CAAC;IACxB,cAAc,EAAE,YAAY,CAAC;IAC7B,UAAU,EAAE,YAAY,CAAC;CAC1B,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TShadesConfig.js","sourceRoot":"","sources":["../../src/types/TShadesConfig.ts"],"names":[],"mappings":""}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TShapeOptions.d.ts","sourceRoot":"","sources":["../../src/types/TShapeOptions.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,aAAa,GAAG;IAC1B,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,QAAQ,CAAC;CACvC,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TShapeOptions.js","sourceRoot":"","sources":["../../src/types/TShapeOptions.ts"],"names":[],"mappings":""}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/types/index.ts"],"names":[],"mappings":"AAAA,cAAc,oBAAoB,CAAC;AACnC,cAAc,iBAAiB,CAAC;AAChC,cAAc,cAAc,CAAC;AAC7B,cAAc,cAAc,CAAC;AAC7B,cAAc,oBAAoB,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/types/index.ts"],"names":[],"mappings":"AAAA,cAAc,oBAAoB,CAAC;AACnC,cAAc,iBAAiB,CAAC;AAChC,cAAc,cAAc,CAAC;AAC7B,cAAc,cAAc,CAAC;AAC7B,cAAc,oBAAoB,CAAC"}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import { TShadeColor } from "../types/index.js";
|
|
2
|
+
/**
|
|
3
|
+
* Convert RGB values to hex color string
|
|
4
|
+
*/
|
|
5
|
+
export declare function rgbToHex(color: TShadeColor): string;
|
|
6
|
+
/**
|
|
7
|
+
* Convert integer to hex string
|
|
8
|
+
*/
|
|
9
|
+
export declare function intToHex(n: number): string;
|
|
10
|
+
/**
|
|
11
|
+
* Convert hex string to RGB values
|
|
12
|
+
*/
|
|
13
|
+
export declare function hexToRgb(hex: string): TShadeColor | null;
|
|
14
|
+
/**
|
|
15
|
+
* Create random RGB color
|
|
16
|
+
*/
|
|
17
|
+
export declare function randomColor(): TShadeColor;
|
|
18
|
+
//# sourceMappingURL=UColors.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"UColors.d.ts","sourceRoot":"","sources":["../../src/utils/UColors.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAEhD;;GAEG;AACH,wBAAgB,QAAQ,CAAC,KAAK,EAAE,WAAW,GAAG,MAAM,CAUnD;AAED;;GAEG;AACH,wBAAgB,QAAQ,CAAC,CAAC,EAAE,MAAM,GAAG,MAAM,CAG1C;AAED;;GAEG;AACH,wBAAgB,QAAQ,CAAC,GAAG,EAAE,MAAM,GAAG,WAAW,GAAG,IAAI,CASxD;AAED;;GAEG;AACH,wBAAgB,WAAW,IAAI,WAAW,CAMzC"}
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Convert RGB values to hex color string
|
|
3
|
+
*/
|
|
4
|
+
export function rgbToHex(color) {
|
|
5
|
+
if (!color) {
|
|
6
|
+
return "#000000"; // Default to black if no color is provided
|
|
7
|
+
}
|
|
8
|
+
const toHex = (n) => {
|
|
9
|
+
const hex = Math.round(n).toString(16);
|
|
10
|
+
return hex.length === 1 ? "0" + hex : hex;
|
|
11
|
+
};
|
|
12
|
+
return `#${toHex(color.r)}${toHex(color.g)}${toHex(color.b)}`;
|
|
13
|
+
}
|
|
14
|
+
/**
|
|
15
|
+
* Convert integer to hex string
|
|
16
|
+
*/
|
|
17
|
+
export function intToHex(n) {
|
|
18
|
+
const hex = Math.round(n).toString(16);
|
|
19
|
+
return hex.length === 1 ? "0" + hex : hex;
|
|
20
|
+
}
|
|
21
|
+
/**
|
|
22
|
+
* Convert hex string to RGB values
|
|
23
|
+
*/
|
|
24
|
+
export function hexToRgb(hex) {
|
|
25
|
+
const result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
|
|
26
|
+
return result
|
|
27
|
+
? {
|
|
28
|
+
r: parseInt(result[1], 16),
|
|
29
|
+
g: parseInt(result[2], 16),
|
|
30
|
+
b: parseInt(result[3], 16),
|
|
31
|
+
}
|
|
32
|
+
: null;
|
|
33
|
+
}
|
|
34
|
+
/**
|
|
35
|
+
* Create random RGB color
|
|
36
|
+
*/
|
|
37
|
+
export function randomColor() {
|
|
38
|
+
return {
|
|
39
|
+
r: Math.floor(Math.random() * 256),
|
|
40
|
+
g: Math.floor(Math.random() * 256),
|
|
41
|
+
b: Math.floor(Math.random() * 256),
|
|
42
|
+
};
|
|
43
|
+
}
|
|
44
|
+
//# sourceMappingURL=UColors.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"UColors.js","sourceRoot":"","sources":["../../src/utils/UColors.ts"],"names":[],"mappings":"AAEA;;GAEG;AACH,MAAM,UAAU,QAAQ,CAAC,KAAkB;IACzC,IAAI,CAAC,KAAK,EAAE,CAAC;QACX,OAAO,SAAS,CAAC,CAAC,2CAA2C;IAC/D,CAAC;IACD,MAAM,KAAK,GAAG,CAAC,CAAS,EAAU,EAAE;QAClC,MAAM,GAAG,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC;QACvC,OAAO,GAAG,CAAC,MAAM,KAAK,CAAC,CAAC,CAAC,CAAC,GAAG,GAAG,GAAG,CAAC,CAAC,CAAC,GAAG,CAAC;IAC5C,CAAC,CAAC;IAEF,OAAO,IAAI,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC;AAChE,CAAC;AAED;;GAEG;AACH,MAAM,UAAU,QAAQ,CAAC,CAAS;IAChC,MAAM,GAAG,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC;IACvC,OAAO,GAAG,CAAC,MAAM,KAAK,CAAC,CAAC,CAAC,CAAC,GAAG,GAAG,GAAG,CAAC,CAAC,CAAC,GAAG,CAAC;AAC5C,CAAC;AAED;;GAEG;AACH,MAAM,UAAU,QAAQ,CAAC,GAAW;IAClC,MAAM,MAAM,GAAG,2CAA2C,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IACrE,OAAO,MAAM;QACX,CAAC,CAAC;YACE,CAAC,EAAE,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC;YAC1B,CAAC,EAAE,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC;YAC1B,CAAC,EAAE,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC;SAC3B;QACH,CAAC,CAAC,IAAI,CAAC;AACX,CAAC;AAED;;GAEG;AACH,MAAM,UAAU,WAAW;IACzB,OAAO;QACL,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,EAAE,GAAG,GAAG,CAAC;QAClC,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,EAAE,GAAG,GAAG,CAAC;QAClC,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,EAAE,GAAG,GAAG,CAAC;KACnC,CAAC;AACJ,CAAC"}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Generate random integer between min and max (inclusive)
|
|
3
|
+
*/
|
|
4
|
+
export declare function random(min: number, max: number, integer?: boolean): number;
|
|
5
|
+
/**
|
|
6
|
+
* Convert degrees to radians
|
|
7
|
+
*/
|
|
8
|
+
export declare function degToRad(degrees: number): number;
|
|
9
|
+
//# sourceMappingURL=UMaths.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"UMaths.d.ts","sourceRoot":"","sources":["../../src/utils/UMaths.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,wBAAgB,MAAM,CACpB,GAAG,EAAE,MAAM,EACX,GAAG,EAAE,MAAM,EACX,OAAO,GAAE,OAAe,GACvB,MAAM,CAGR;AAED;;GAEG;AACH,wBAAgB,QAAQ,CAAC,OAAO,EAAE,MAAM,GAAG,MAAM,CAEhD"}
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Generate random integer between min and max (inclusive)
|
|
3
|
+
*/
|
|
4
|
+
export function random(min, max, integer = false) {
|
|
5
|
+
const rand = Math.random() * (max - min) + min;
|
|
6
|
+
return integer ? Math.round(rand) : rand;
|
|
7
|
+
}
|
|
8
|
+
/**
|
|
9
|
+
* Convert degrees to radians
|
|
10
|
+
*/
|
|
11
|
+
export function degToRad(degrees) {
|
|
12
|
+
return (degrees * Math.PI) / 180;
|
|
13
|
+
}
|
|
14
|
+
//# sourceMappingURL=UMaths.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"UMaths.js","sourceRoot":"","sources":["../../src/utils/UMaths.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,MAAM,UAAU,MAAM,CACpB,GAAW,EACX,GAAW,EACX,UAAmB,KAAK;IAExB,MAAM,IAAI,GAAG,IAAI,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,GAAG,CAAC,GAAG,GAAG,CAAC;IAC/C,OAAO,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC;AAC3C,CAAC;AAED;;GAEG;AACH,MAAM,UAAU,QAAQ,CAAC,OAAe;IACtC,OAAO,CAAC,OAAO,GAAG,IAAI,CAAC,EAAE,CAAC,GAAG,GAAG,CAAC;AACnC,CAAC"}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { TShadeColor, TShadeConfig, TShadeType } from "../types/index.js";
|
|
2
|
+
import { TShadesEngineOptions } from "../classes/ShadesEngine.js";
|
|
3
|
+
export declare const genConfig: (options?: TShadesEngineOptions) => TShadeConfig;
|
|
4
|
+
export declare const getRandFilter: () => (mainColor: TShadeColor, itemColor: TShadeColor) => boolean;
|
|
5
|
+
export declare const getRandColors: (type_or_colors?: TShadeType | TShadeColor[]) => TShadeColor[];
|
|
6
|
+
export declare const getRandColor: () => TShadeColor;
|
|
7
|
+
export declare const getRandLineCap: () => CanvasLineCap;
|
|
8
|
+
//# sourceMappingURL=UShadeUtils.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"UShadeUtils.d.ts","sourceRoot":"","sources":["../../src/utils/UShadeUtils.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,YAAY,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AAa1E,OAAO,EAAE,oBAAoB,EAAE,MAAM,4BAA4B,CAAC;AAElE,eAAO,MAAM,SAAS,GAAI,UAAU,oBAAoB,iBAqDvD,CAAC;AAEF,eAAO,MAAM,aAAa,mEACkC,CAAC;AAE7D,eAAO,MAAM,aAAa,GAAI,iBAAiB,UAAU,GAAG,WAAW,EAAE,kBAqBxE,CAAC;AAEF,eAAO,MAAM,YAAY,mBAGxB,CAAC;AAEF,eAAO,MAAM,cAAc,qBACiC,CAAC"}
|
|
@@ -0,0 +1,75 @@
|
|
|
1
|
+
import { COLORS, LIGHT_COLORS, LINE_CAP_TYPES, MAX_SHADES_NBR, RANDOM_FILTERS, SHADES_TYPES, } from "../constants/index.js";
|
|
2
|
+
import { rgbToHex } from "./UColors.js";
|
|
3
|
+
import { random } from "./UMaths.js";
|
|
4
|
+
export const genConfig = (options) => {
|
|
5
|
+
let usedTypes = [
|
|
6
|
+
...(options?.shapes && options.shapes.length > 0
|
|
7
|
+
? options.shapes
|
|
8
|
+
: SHADES_TYPES),
|
|
9
|
+
];
|
|
10
|
+
// merge custom shapes if provided and remove duplicates using a Set
|
|
11
|
+
if (options?.customShapes) {
|
|
12
|
+
const customShapeTypes = Object.keys(options.customShapes);
|
|
13
|
+
usedTypes.push(...customShapeTypes);
|
|
14
|
+
// Remove duplicates using a Set
|
|
15
|
+
usedTypes = Array.from(new Set(usedTypes));
|
|
16
|
+
}
|
|
17
|
+
const type = usedTypes[random(0, usedTypes.length - 1, true)];
|
|
18
|
+
const nbrShades = type !== "logo" ? random(3, MAX_SHADES_NBR, true) : MAX_SHADES_NBR;
|
|
19
|
+
const size = random(10, 100, true);
|
|
20
|
+
const nbrItemsX = type !== "logo" ? random(3, 30, true) : 1;
|
|
21
|
+
const nbrItemsY = type !== "logo" ? random(3, 30, true) : 1;
|
|
22
|
+
const spacing = random(10, 100, true);
|
|
23
|
+
const gradRatio = 100 / nbrShades;
|
|
24
|
+
const center = {
|
|
25
|
+
x: document.body.clientWidth / 2,
|
|
26
|
+
y: document.body.clientHeight / 2,
|
|
27
|
+
};
|
|
28
|
+
const colors = getRandColors(type);
|
|
29
|
+
const lineCap = getRandLineCap();
|
|
30
|
+
const config = {
|
|
31
|
+
nbrShades,
|
|
32
|
+
nbrItemsX,
|
|
33
|
+
nbrItemsY,
|
|
34
|
+
width: size,
|
|
35
|
+
height: size,
|
|
36
|
+
spacing,
|
|
37
|
+
thickness: random(1, 20, true),
|
|
38
|
+
offsetX: 0,
|
|
39
|
+
offsetY: 0,
|
|
40
|
+
totalWidth: nbrItemsX * size + nbrItemsX * spacing,
|
|
41
|
+
totalHeight: nbrItemsY * size + nbrItemsY * spacing,
|
|
42
|
+
gradRatio,
|
|
43
|
+
center,
|
|
44
|
+
type,
|
|
45
|
+
colors,
|
|
46
|
+
rotationFilter: getRandFilter(),
|
|
47
|
+
fillFilter: getRandFilter(),
|
|
48
|
+
lineCap: lineCap,
|
|
49
|
+
};
|
|
50
|
+
return config;
|
|
51
|
+
};
|
|
52
|
+
export const getRandFilter = () => RANDOM_FILTERS[random(0, RANDOM_FILTERS.length - 1, true)];
|
|
53
|
+
export const getRandColors = (type_or_colors) => {
|
|
54
|
+
let tryCount = 0;
|
|
55
|
+
const usedColors = type_or_colors === "logo"
|
|
56
|
+
? LIGHT_COLORS
|
|
57
|
+
: typeof type_or_colors === "object"
|
|
58
|
+
? type_or_colors
|
|
59
|
+
: COLORS;
|
|
60
|
+
const colors = [
|
|
61
|
+
usedColors[random(0, usedColors.length - 1, true)],
|
|
62
|
+
usedColors[random(0, usedColors.length - 1, true)],
|
|
63
|
+
];
|
|
64
|
+
while (rgbToHex(colors[0]) === rgbToHex(colors[1]) && tryCount < 10) {
|
|
65
|
+
colors[1] = usedColors[random(0, usedColors.length - 1, true)];
|
|
66
|
+
tryCount++;
|
|
67
|
+
}
|
|
68
|
+
return colors;
|
|
69
|
+
};
|
|
70
|
+
export const getRandColor = () => {
|
|
71
|
+
const colors = getRandColors();
|
|
72
|
+
return colors[random(0, colors.length - 1, true)];
|
|
73
|
+
};
|
|
74
|
+
export const getRandLineCap = () => LINE_CAP_TYPES[random(0, LINE_CAP_TYPES.length - 1, true)];
|
|
75
|
+
//# sourceMappingURL=UShadeUtils.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"UShadeUtils.js","sourceRoot":"","sources":["../../src/utils/UShadeUtils.ts"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/utils/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,cAAc,aAAa,CAAC;AAC5B,cAAc,kBAAkB,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/utils/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,cAAc,aAAa,CAAC;AAC5B,cAAc,kBAAkB,CAAC"}
|
package/package.json
ADDED
|
@@ -0,0 +1,71 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@amphore-dev/shades",
|
|
3
|
+
"version": "0.5.0",
|
|
4
|
+
"description": "Library for creating animated shape visualizations on canvas.",
|
|
5
|
+
"type": "module",
|
|
6
|
+
"main": "dist/index.js",
|
|
7
|
+
"types": "dist/index.d.ts",
|
|
8
|
+
"exports": {
|
|
9
|
+
".": {
|
|
10
|
+
"import": "./dist/index.js",
|
|
11
|
+
"types": "./dist/index.d.ts"
|
|
12
|
+
}
|
|
13
|
+
},
|
|
14
|
+
"files": [
|
|
15
|
+
"dist",
|
|
16
|
+
"README.md",
|
|
17
|
+
"LICENSE"
|
|
18
|
+
],
|
|
19
|
+
"keywords": [
|
|
20
|
+
"canvas",
|
|
21
|
+
"animation",
|
|
22
|
+
"visualization",
|
|
23
|
+
"shapes",
|
|
24
|
+
"graphics",
|
|
25
|
+
"javascript",
|
|
26
|
+
"web",
|
|
27
|
+
"art",
|
|
28
|
+
"typescript",
|
|
29
|
+
"library"
|
|
30
|
+
],
|
|
31
|
+
"author": "Amphore Development Team",
|
|
32
|
+
"license": "MIT",
|
|
33
|
+
"repository": {
|
|
34
|
+
"type": "git",
|
|
35
|
+
"url": "git+https://github.com/Amphore-Dev/Shades.git"
|
|
36
|
+
},
|
|
37
|
+
"scripts": {
|
|
38
|
+
"build": "tsc",
|
|
39
|
+
"build:watch": "tsc --watch",
|
|
40
|
+
"test": "jest",
|
|
41
|
+
"test:watch": "jest --watch",
|
|
42
|
+
"test:coverage": "jest --coverage",
|
|
43
|
+
"lint": "eslint src",
|
|
44
|
+
"lint:fix": "eslint src --fix",
|
|
45
|
+
"format": "prettier --write .",
|
|
46
|
+
"format:check": "prettier --check .",
|
|
47
|
+
"clean": "rm -rf dist",
|
|
48
|
+
"prepublishOnly": "npm run clean && npm run build",
|
|
49
|
+
"example": "npm run build && python3 -m http.server 8000"
|
|
50
|
+
},
|
|
51
|
+
"devDependencies": {
|
|
52
|
+
"@eslint/js": "^10.0.1",
|
|
53
|
+
"@typescript-eslint/eslint-plugin": "^8.58.0",
|
|
54
|
+
"@typescript-eslint/parser": "^8.58.0",
|
|
55
|
+
"@types/jest": "^29.5.5",
|
|
56
|
+
"@types/node": "^25.5.0",
|
|
57
|
+
"eslint": "^10.1.0",
|
|
58
|
+
"eslint-config-prettier": "^10.1.8",
|
|
59
|
+
"jest": "^29.7.0",
|
|
60
|
+
"jest-canvas-mock": "^2.5.2",
|
|
61
|
+
"jest-environment-jsdom": "^29.7.0",
|
|
62
|
+
"prettier": "^3.8.1",
|
|
63
|
+
"ts-jest": "^29.1.1",
|
|
64
|
+
"ts-node": "^10.9.1",
|
|
65
|
+
"typescript": "^6.0.2",
|
|
66
|
+
"typescript-eslint": "^8.58.0"
|
|
67
|
+
},
|
|
68
|
+
"engines": {
|
|
69
|
+
"node": ">=16.0.0"
|
|
70
|
+
}
|
|
71
|
+
}
|