@tsparticles/plugin-hsv-color 3.0.3 → 3.1.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.
@@ -1,25 +1,31 @@
1
- import { getRangeValue, getStyleFromHsl, parseAlpha, } from "@tsparticles/engine";
1
+ import { getRangeValue, getStyleFromHsl, parseAlpha, percentDenominator, } from "@tsparticles/engine";
2
+ const rgbFactor = 255, double = 2, half = 0.5;
2
3
  export function rgbToHsv(rgb) {
3
4
  const rgbPercent = {
4
- r: rgb.r / 255,
5
- g: rgb.g / 255,
6
- b: rgb.b / 255,
5
+ r: rgb.r / rgbFactor,
6
+ g: rgb.g / rgbFactor,
7
+ b: rgb.b / rgbFactor,
7
8
  }, xMax = Math.max(rgbPercent.r, rgbPercent.g, rgbPercent.b), xMin = Math.min(rgbPercent.r, rgbPercent.g, rgbPercent.b), v = xMax, c = xMax - xMin;
8
9
  let h = 0;
10
+ const phaseOffset = {
11
+ r: 0,
12
+ g: 2,
13
+ b: 4,
14
+ }, phaseValue = 60;
9
15
  if (v === rgbPercent.r) {
10
- h = 60 * ((rgbPercent.g - rgbPercent.b) / c);
16
+ h = phaseValue * (phaseOffset.r + (rgbPercent.g - rgbPercent.b) / c);
11
17
  }
12
18
  else if (v === rgbPercent.g) {
13
- h = 60 * (2 + (rgbPercent.b - rgbPercent.r) / c);
19
+ h = phaseValue * (phaseOffset.g + (rgbPercent.b - rgbPercent.r) / c);
14
20
  }
15
21
  else if (v === rgbPercent.b) {
16
- h = 60 * (4 + (rgbPercent.r - rgbPercent.g) / c);
22
+ h = phaseValue * (phaseOffset.b + (rgbPercent.r - rgbPercent.g) / c);
17
23
  }
18
- const s = !v ? 0 : c / v;
24
+ const defaultSaturation = 0, s = !v ? defaultSaturation : c / v;
19
25
  return {
20
26
  h,
21
- s: s * 100,
22
- v: v * 100,
27
+ s: s * percentDenominator,
28
+ v: v * percentDenominator,
23
29
  };
24
30
  }
25
31
  export function rgbaToHsva(rgba) {
@@ -32,11 +38,11 @@ export function getStyleFromHsv(color, opacity) {
32
38
  return getStyleFromHsl(hsvToHsl(color), opacity);
33
39
  }
34
40
  export function hslToHsv(hsl) {
35
- const l = hsl.l / 100, sl = hsl.s / 100, v = l + sl * Math.min(l, 1 - l), sv = !v ? 0 : 2 * (1 - l / v);
41
+ const l = hsl.l / percentDenominator, sl = hsl.s / percentDenominator, offset = 1, noValue = 0, v = l + sl * Math.min(l, offset - l), sv = !v ? noValue : double * (offset - l / v);
36
42
  return {
37
43
  h: hsl.h,
38
- s: sv * 100,
39
- v: v * 100,
44
+ s: sv * percentDenominator,
45
+ v: v * percentDenominator,
40
46
  };
41
47
  }
42
48
  export function hslaToHsva(hsla) {
@@ -46,11 +52,11 @@ export function hslaToHsva(hsla) {
46
52
  };
47
53
  }
48
54
  export function hsvToHsl(hsv) {
49
- const v = hsv.v / 100, sv = hsv.s / 100, l = v * (1 - sv / 2), sl = l === 0 || l === 1 ? 0 : (v - l) / Math.min(l, 1 - l);
55
+ const v = hsv.v / percentDenominator, sv = hsv.s / percentDenominator, offset = 1, noValue = 0, l = v * (offset - sv * half), sl = !l || l === offset ? noValue : (v - l) / Math.min(l, offset - l);
50
56
  return {
51
57
  h: hsv.h,
52
- l: l * 100,
53
- s: sl * 100,
58
+ l: l * percentDenominator,
59
+ s: sl * percentDenominator,
54
60
  };
55
61
  }
56
62
  export function hsvaToHsla(hsva) {
@@ -60,48 +66,49 @@ export function hsvaToHsla(hsva) {
60
66
  };
61
67
  }
62
68
  export function hsvToRgb(hsv) {
63
- const result = { b: 0, g: 0, r: 0 }, hsvPercent = {
64
- h: hsv.h / 60,
65
- s: hsv.s / 100,
66
- v: hsv.v / 100,
67
- }, c = hsvPercent.v * hsvPercent.s, x = c * (1 - Math.abs((hsvPercent.h % 2) - 1));
69
+ const result = { b: 0, g: 0, r: 0 }, phase = 60, hsvPercent = {
70
+ h: hsv.h / phase,
71
+ s: hsv.s / percentDenominator,
72
+ v: hsv.v / percentDenominator,
73
+ }, offset = 1, hPercentFactor = 2, c = hsvPercent.v * hsvPercent.s, x = c * (offset - Math.abs((hsvPercent.h % hPercentFactor) - offset));
68
74
  let tempRgb;
69
- if (hsvPercent.h >= 0 && hsvPercent.h <= 1) {
75
+ const cxzRange = { min: 0, max: 1 }, xczRange = { min: 1, max: 2 }, zcxRange = { min: 2, max: 3 }, zxcRange = { min: 3, max: 4 }, xzcRange = { min: 4, max: 5 }, czxRange = { min: 5, max: 6 };
76
+ if (hsvPercent.h >= cxzRange.min && hsvPercent.h <= cxzRange.max) {
70
77
  tempRgb = {
71
78
  r: c,
72
79
  g: x,
73
80
  b: 0,
74
81
  };
75
82
  }
76
- else if (hsvPercent.h > 1 && hsvPercent.h <= 2) {
83
+ else if (hsvPercent.h > xczRange.min && hsvPercent.h <= xczRange.max) {
77
84
  tempRgb = {
78
85
  r: x,
79
86
  g: c,
80
87
  b: 0,
81
88
  };
82
89
  }
83
- else if (hsvPercent.h > 2 && hsvPercent.h <= 3) {
90
+ else if (hsvPercent.h > zcxRange.min && hsvPercent.h <= zcxRange.max) {
84
91
  tempRgb = {
85
92
  r: 0,
86
93
  g: c,
87
94
  b: x,
88
95
  };
89
96
  }
90
- else if (hsvPercent.h > 3 && hsvPercent.h <= 4) {
97
+ else if (hsvPercent.h > zxcRange.min && hsvPercent.h <= zxcRange.max) {
91
98
  tempRgb = {
92
99
  r: 0,
93
100
  g: x,
94
101
  b: c,
95
102
  };
96
103
  }
97
- else if (hsvPercent.h > 4 && hsvPercent.h <= 5) {
104
+ else if (hsvPercent.h > xzcRange.min && hsvPercent.h <= xzcRange.max) {
98
105
  tempRgb = {
99
106
  r: x,
100
107
  g: 0,
101
108
  b: c,
102
109
  };
103
110
  }
104
- else if (hsvPercent.h > 5 && hsvPercent.h <= 6) {
111
+ else if (hsvPercent.h > czxRange.min && hsvPercent.h <= czxRange.max) {
105
112
  tempRgb = {
106
113
  r: c,
107
114
  g: 0,
@@ -110,9 +117,9 @@ export function hsvToRgb(hsv) {
110
117
  }
111
118
  if (tempRgb) {
112
119
  const m = hsvPercent.v - c;
113
- result.r = Math.floor((tempRgb.r + m) * 255);
114
- result.g = Math.floor((tempRgb.g + m) * 255);
115
- result.b = Math.floor((tempRgb.b + m) * 255);
120
+ result.r = Math.floor((tempRgb.r + m) * rgbFactor);
121
+ result.g = Math.floor((tempRgb.g + m) * rgbFactor);
122
+ result.b = Math.floor((tempRgb.b + m) * rgbFactor);
116
123
  }
117
124
  return result;
118
125
  }
@@ -147,13 +154,18 @@ export class HsvColorManager {
147
154
  if (!input.startsWith("hsv")) {
148
155
  return;
149
156
  }
150
- const regex = /hsva?\(\s*(\d+)°\s*,\s*(\d+)%\s*,\s*(\d+)%\s*(,\s*([\d.%]+)\s*)?\)/i, result = regex.exec(input);
157
+ const regex = /hsva?\(\s*(\d+)°\s*,\s*(\d+)%\s*,\s*(\d+)%\s*(,\s*([\d.%]+)\s*)?\)/i, result = regex.exec(input), fullLength = 4, indexes = {
158
+ h: 1,
159
+ s: 2,
160
+ v: 3,
161
+ a: 5,
162
+ }, defaultAlpha = 1, radix = 10;
151
163
  return result
152
164
  ? hsvaToRgba({
153
- a: result.length > 4 ? parseAlpha(result[5]) : 1,
154
- h: parseInt(result[1], 10),
155
- s: parseInt(result[2], 10),
156
- v: parseInt(result[3], 10),
165
+ a: result.length > fullLength ? parseAlpha(result[indexes.a]) : defaultAlpha,
166
+ h: parseInt(result[indexes.h], radix),
167
+ s: parseInt(result[indexes.s], radix),
168
+ v: parseInt(result[indexes.v], radix),
157
169
  })
158
170
  : undefined;
159
171
  }
package/browser/index.js CHANGED
@@ -2,4 +2,5 @@ import { HsvColorManager } from "./HsvColorManager.js";
2
2
  import { addColorManager } from "@tsparticles/engine";
3
3
  export async function loadHsvColorPlugin() {
4
4
  addColorManager(new HsvColorManager());
5
+ await Promise.resolve();
5
6
  }
@@ -2,27 +2,33 @@
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.HsvColorManager = exports.hsvaToRgba = exports.hsvToRgb = exports.hsvaToHsla = exports.hsvToHsl = exports.hslaToHsva = exports.hslToHsv = exports.getStyleFromHsv = exports.rgbaToHsva = exports.rgbToHsv = void 0;
4
4
  const engine_1 = require("@tsparticles/engine");
5
+ const rgbFactor = 255, double = 2, half = 0.5;
5
6
  function rgbToHsv(rgb) {
6
7
  const rgbPercent = {
7
- r: rgb.r / 255,
8
- g: rgb.g / 255,
9
- b: rgb.b / 255,
8
+ r: rgb.r / rgbFactor,
9
+ g: rgb.g / rgbFactor,
10
+ b: rgb.b / rgbFactor,
10
11
  }, xMax = Math.max(rgbPercent.r, rgbPercent.g, rgbPercent.b), xMin = Math.min(rgbPercent.r, rgbPercent.g, rgbPercent.b), v = xMax, c = xMax - xMin;
11
12
  let h = 0;
13
+ const phaseOffset = {
14
+ r: 0,
15
+ g: 2,
16
+ b: 4,
17
+ }, phaseValue = 60;
12
18
  if (v === rgbPercent.r) {
13
- h = 60 * ((rgbPercent.g - rgbPercent.b) / c);
19
+ h = phaseValue * (phaseOffset.r + (rgbPercent.g - rgbPercent.b) / c);
14
20
  }
15
21
  else if (v === rgbPercent.g) {
16
- h = 60 * (2 + (rgbPercent.b - rgbPercent.r) / c);
22
+ h = phaseValue * (phaseOffset.g + (rgbPercent.b - rgbPercent.r) / c);
17
23
  }
18
24
  else if (v === rgbPercent.b) {
19
- h = 60 * (4 + (rgbPercent.r - rgbPercent.g) / c);
25
+ h = phaseValue * (phaseOffset.b + (rgbPercent.r - rgbPercent.g) / c);
20
26
  }
21
- const s = !v ? 0 : c / v;
27
+ const defaultSaturation = 0, s = !v ? defaultSaturation : c / v;
22
28
  return {
23
29
  h,
24
- s: s * 100,
25
- v: v * 100,
30
+ s: s * engine_1.percentDenominator,
31
+ v: v * engine_1.percentDenominator,
26
32
  };
27
33
  }
28
34
  exports.rgbToHsv = rgbToHsv;
@@ -38,11 +44,11 @@ function getStyleFromHsv(color, opacity) {
38
44
  }
39
45
  exports.getStyleFromHsv = getStyleFromHsv;
40
46
  function hslToHsv(hsl) {
41
- const l = hsl.l / 100, sl = hsl.s / 100, v = l + sl * Math.min(l, 1 - l), sv = !v ? 0 : 2 * (1 - l / v);
47
+ const l = hsl.l / engine_1.percentDenominator, sl = hsl.s / engine_1.percentDenominator, offset = 1, noValue = 0, v = l + sl * Math.min(l, offset - l), sv = !v ? noValue : double * (offset - l / v);
42
48
  return {
43
49
  h: hsl.h,
44
- s: sv * 100,
45
- v: v * 100,
50
+ s: sv * engine_1.percentDenominator,
51
+ v: v * engine_1.percentDenominator,
46
52
  };
47
53
  }
48
54
  exports.hslToHsv = hslToHsv;
@@ -54,11 +60,11 @@ function hslaToHsva(hsla) {
54
60
  }
55
61
  exports.hslaToHsva = hslaToHsva;
56
62
  function hsvToHsl(hsv) {
57
- const v = hsv.v / 100, sv = hsv.s / 100, l = v * (1 - sv / 2), sl = l === 0 || l === 1 ? 0 : (v - l) / Math.min(l, 1 - l);
63
+ const v = hsv.v / engine_1.percentDenominator, sv = hsv.s / engine_1.percentDenominator, offset = 1, noValue = 0, l = v * (offset - sv * half), sl = !l || l === offset ? noValue : (v - l) / Math.min(l, offset - l);
58
64
  return {
59
65
  h: hsv.h,
60
- l: l * 100,
61
- s: sl * 100,
66
+ l: l * engine_1.percentDenominator,
67
+ s: sl * engine_1.percentDenominator,
62
68
  };
63
69
  }
64
70
  exports.hsvToHsl = hsvToHsl;
@@ -70,48 +76,49 @@ function hsvaToHsla(hsva) {
70
76
  }
71
77
  exports.hsvaToHsla = hsvaToHsla;
72
78
  function hsvToRgb(hsv) {
73
- const result = { b: 0, g: 0, r: 0 }, hsvPercent = {
74
- h: hsv.h / 60,
75
- s: hsv.s / 100,
76
- v: hsv.v / 100,
77
- }, c = hsvPercent.v * hsvPercent.s, x = c * (1 - Math.abs((hsvPercent.h % 2) - 1));
79
+ const result = { b: 0, g: 0, r: 0 }, phase = 60, hsvPercent = {
80
+ h: hsv.h / phase,
81
+ s: hsv.s / engine_1.percentDenominator,
82
+ v: hsv.v / engine_1.percentDenominator,
83
+ }, offset = 1, hPercentFactor = 2, c = hsvPercent.v * hsvPercent.s, x = c * (offset - Math.abs((hsvPercent.h % hPercentFactor) - offset));
78
84
  let tempRgb;
79
- if (hsvPercent.h >= 0 && hsvPercent.h <= 1) {
85
+ const cxzRange = { min: 0, max: 1 }, xczRange = { min: 1, max: 2 }, zcxRange = { min: 2, max: 3 }, zxcRange = { min: 3, max: 4 }, xzcRange = { min: 4, max: 5 }, czxRange = { min: 5, max: 6 };
86
+ if (hsvPercent.h >= cxzRange.min && hsvPercent.h <= cxzRange.max) {
80
87
  tempRgb = {
81
88
  r: c,
82
89
  g: x,
83
90
  b: 0,
84
91
  };
85
92
  }
86
- else if (hsvPercent.h > 1 && hsvPercent.h <= 2) {
93
+ else if (hsvPercent.h > xczRange.min && hsvPercent.h <= xczRange.max) {
87
94
  tempRgb = {
88
95
  r: x,
89
96
  g: c,
90
97
  b: 0,
91
98
  };
92
99
  }
93
- else if (hsvPercent.h > 2 && hsvPercent.h <= 3) {
100
+ else if (hsvPercent.h > zcxRange.min && hsvPercent.h <= zcxRange.max) {
94
101
  tempRgb = {
95
102
  r: 0,
96
103
  g: c,
97
104
  b: x,
98
105
  };
99
106
  }
100
- else if (hsvPercent.h > 3 && hsvPercent.h <= 4) {
107
+ else if (hsvPercent.h > zxcRange.min && hsvPercent.h <= zxcRange.max) {
101
108
  tempRgb = {
102
109
  r: 0,
103
110
  g: x,
104
111
  b: c,
105
112
  };
106
113
  }
107
- else if (hsvPercent.h > 4 && hsvPercent.h <= 5) {
114
+ else if (hsvPercent.h > xzcRange.min && hsvPercent.h <= xzcRange.max) {
108
115
  tempRgb = {
109
116
  r: x,
110
117
  g: 0,
111
118
  b: c,
112
119
  };
113
120
  }
114
- else if (hsvPercent.h > 5 && hsvPercent.h <= 6) {
121
+ else if (hsvPercent.h > czxRange.min && hsvPercent.h <= czxRange.max) {
115
122
  tempRgb = {
116
123
  r: c,
117
124
  g: 0,
@@ -120,9 +127,9 @@ function hsvToRgb(hsv) {
120
127
  }
121
128
  if (tempRgb) {
122
129
  const m = hsvPercent.v - c;
123
- result.r = Math.floor((tempRgb.r + m) * 255);
124
- result.g = Math.floor((tempRgb.g + m) * 255);
125
- result.b = Math.floor((tempRgb.b + m) * 255);
130
+ result.r = Math.floor((tempRgb.r + m) * rgbFactor);
131
+ result.g = Math.floor((tempRgb.g + m) * rgbFactor);
132
+ result.b = Math.floor((tempRgb.b + m) * rgbFactor);
126
133
  }
127
134
  return result;
128
135
  }
@@ -159,13 +166,18 @@ class HsvColorManager {
159
166
  if (!input.startsWith("hsv")) {
160
167
  return;
161
168
  }
162
- const regex = /hsva?\(\s*(\d+)°\s*,\s*(\d+)%\s*,\s*(\d+)%\s*(,\s*([\d.%]+)\s*)?\)/i, result = regex.exec(input);
169
+ const regex = /hsva?\(\s*(\d+)°\s*,\s*(\d+)%\s*,\s*(\d+)%\s*(,\s*([\d.%]+)\s*)?\)/i, result = regex.exec(input), fullLength = 4, indexes = {
170
+ h: 1,
171
+ s: 2,
172
+ v: 3,
173
+ a: 5,
174
+ }, defaultAlpha = 1, radix = 10;
163
175
  return result
164
176
  ? hsvaToRgba({
165
- a: result.length > 4 ? (0, engine_1.parseAlpha)(result[5]) : 1,
166
- h: parseInt(result[1], 10),
167
- s: parseInt(result[2], 10),
168
- v: parseInt(result[3], 10),
177
+ a: result.length > fullLength ? (0, engine_1.parseAlpha)(result[indexes.a]) : defaultAlpha,
178
+ h: parseInt(result[indexes.h], radix),
179
+ s: parseInt(result[indexes.s], radix),
180
+ v: parseInt(result[indexes.v], radix),
169
181
  })
170
182
  : undefined;
171
183
  }
package/cjs/index.js CHANGED
@@ -5,5 +5,6 @@ const HsvColorManager_js_1 = require("./HsvColorManager.js");
5
5
  const engine_1 = require("@tsparticles/engine");
6
6
  async function loadHsvColorPlugin() {
7
7
  (0, engine_1.addColorManager)(new HsvColorManager_js_1.HsvColorManager());
8
+ await Promise.resolve();
8
9
  }
9
10
  exports.loadHsvColorPlugin = loadHsvColorPlugin;
@@ -1,25 +1,31 @@
1
- import { getRangeValue, getStyleFromHsl, parseAlpha, } from "@tsparticles/engine";
1
+ import { getRangeValue, getStyleFromHsl, parseAlpha, percentDenominator, } from "@tsparticles/engine";
2
+ const rgbFactor = 255, double = 2, half = 0.5;
2
3
  export function rgbToHsv(rgb) {
3
4
  const rgbPercent = {
4
- r: rgb.r / 255,
5
- g: rgb.g / 255,
6
- b: rgb.b / 255,
5
+ r: rgb.r / rgbFactor,
6
+ g: rgb.g / rgbFactor,
7
+ b: rgb.b / rgbFactor,
7
8
  }, xMax = Math.max(rgbPercent.r, rgbPercent.g, rgbPercent.b), xMin = Math.min(rgbPercent.r, rgbPercent.g, rgbPercent.b), v = xMax, c = xMax - xMin;
8
9
  let h = 0;
10
+ const phaseOffset = {
11
+ r: 0,
12
+ g: 2,
13
+ b: 4,
14
+ }, phaseValue = 60;
9
15
  if (v === rgbPercent.r) {
10
- h = 60 * ((rgbPercent.g - rgbPercent.b) / c);
16
+ h = phaseValue * (phaseOffset.r + (rgbPercent.g - rgbPercent.b) / c);
11
17
  }
12
18
  else if (v === rgbPercent.g) {
13
- h = 60 * (2 + (rgbPercent.b - rgbPercent.r) / c);
19
+ h = phaseValue * (phaseOffset.g + (rgbPercent.b - rgbPercent.r) / c);
14
20
  }
15
21
  else if (v === rgbPercent.b) {
16
- h = 60 * (4 + (rgbPercent.r - rgbPercent.g) / c);
22
+ h = phaseValue * (phaseOffset.b + (rgbPercent.r - rgbPercent.g) / c);
17
23
  }
18
- const s = !v ? 0 : c / v;
24
+ const defaultSaturation = 0, s = !v ? defaultSaturation : c / v;
19
25
  return {
20
26
  h,
21
- s: s * 100,
22
- v: v * 100,
27
+ s: s * percentDenominator,
28
+ v: v * percentDenominator,
23
29
  };
24
30
  }
25
31
  export function rgbaToHsva(rgba) {
@@ -32,11 +38,11 @@ export function getStyleFromHsv(color, opacity) {
32
38
  return getStyleFromHsl(hsvToHsl(color), opacity);
33
39
  }
34
40
  export function hslToHsv(hsl) {
35
- const l = hsl.l / 100, sl = hsl.s / 100, v = l + sl * Math.min(l, 1 - l), sv = !v ? 0 : 2 * (1 - l / v);
41
+ const l = hsl.l / percentDenominator, sl = hsl.s / percentDenominator, offset = 1, noValue = 0, v = l + sl * Math.min(l, offset - l), sv = !v ? noValue : double * (offset - l / v);
36
42
  return {
37
43
  h: hsl.h,
38
- s: sv * 100,
39
- v: v * 100,
44
+ s: sv * percentDenominator,
45
+ v: v * percentDenominator,
40
46
  };
41
47
  }
42
48
  export function hslaToHsva(hsla) {
@@ -46,11 +52,11 @@ export function hslaToHsva(hsla) {
46
52
  };
47
53
  }
48
54
  export function hsvToHsl(hsv) {
49
- const v = hsv.v / 100, sv = hsv.s / 100, l = v * (1 - sv / 2), sl = l === 0 || l === 1 ? 0 : (v - l) / Math.min(l, 1 - l);
55
+ const v = hsv.v / percentDenominator, sv = hsv.s / percentDenominator, offset = 1, noValue = 0, l = v * (offset - sv * half), sl = !l || l === offset ? noValue : (v - l) / Math.min(l, offset - l);
50
56
  return {
51
57
  h: hsv.h,
52
- l: l * 100,
53
- s: sl * 100,
58
+ l: l * percentDenominator,
59
+ s: sl * percentDenominator,
54
60
  };
55
61
  }
56
62
  export function hsvaToHsla(hsva) {
@@ -60,48 +66,49 @@ export function hsvaToHsla(hsva) {
60
66
  };
61
67
  }
62
68
  export function hsvToRgb(hsv) {
63
- const result = { b: 0, g: 0, r: 0 }, hsvPercent = {
64
- h: hsv.h / 60,
65
- s: hsv.s / 100,
66
- v: hsv.v / 100,
67
- }, c = hsvPercent.v * hsvPercent.s, x = c * (1 - Math.abs((hsvPercent.h % 2) - 1));
69
+ const result = { b: 0, g: 0, r: 0 }, phase = 60, hsvPercent = {
70
+ h: hsv.h / phase,
71
+ s: hsv.s / percentDenominator,
72
+ v: hsv.v / percentDenominator,
73
+ }, offset = 1, hPercentFactor = 2, c = hsvPercent.v * hsvPercent.s, x = c * (offset - Math.abs((hsvPercent.h % hPercentFactor) - offset));
68
74
  let tempRgb;
69
- if (hsvPercent.h >= 0 && hsvPercent.h <= 1) {
75
+ const cxzRange = { min: 0, max: 1 }, xczRange = { min: 1, max: 2 }, zcxRange = { min: 2, max: 3 }, zxcRange = { min: 3, max: 4 }, xzcRange = { min: 4, max: 5 }, czxRange = { min: 5, max: 6 };
76
+ if (hsvPercent.h >= cxzRange.min && hsvPercent.h <= cxzRange.max) {
70
77
  tempRgb = {
71
78
  r: c,
72
79
  g: x,
73
80
  b: 0,
74
81
  };
75
82
  }
76
- else if (hsvPercent.h > 1 && hsvPercent.h <= 2) {
83
+ else if (hsvPercent.h > xczRange.min && hsvPercent.h <= xczRange.max) {
77
84
  tempRgb = {
78
85
  r: x,
79
86
  g: c,
80
87
  b: 0,
81
88
  };
82
89
  }
83
- else if (hsvPercent.h > 2 && hsvPercent.h <= 3) {
90
+ else if (hsvPercent.h > zcxRange.min && hsvPercent.h <= zcxRange.max) {
84
91
  tempRgb = {
85
92
  r: 0,
86
93
  g: c,
87
94
  b: x,
88
95
  };
89
96
  }
90
- else if (hsvPercent.h > 3 && hsvPercent.h <= 4) {
97
+ else if (hsvPercent.h > zxcRange.min && hsvPercent.h <= zxcRange.max) {
91
98
  tempRgb = {
92
99
  r: 0,
93
100
  g: x,
94
101
  b: c,
95
102
  };
96
103
  }
97
- else if (hsvPercent.h > 4 && hsvPercent.h <= 5) {
104
+ else if (hsvPercent.h > xzcRange.min && hsvPercent.h <= xzcRange.max) {
98
105
  tempRgb = {
99
106
  r: x,
100
107
  g: 0,
101
108
  b: c,
102
109
  };
103
110
  }
104
- else if (hsvPercent.h > 5 && hsvPercent.h <= 6) {
111
+ else if (hsvPercent.h > czxRange.min && hsvPercent.h <= czxRange.max) {
105
112
  tempRgb = {
106
113
  r: c,
107
114
  g: 0,
@@ -110,9 +117,9 @@ export function hsvToRgb(hsv) {
110
117
  }
111
118
  if (tempRgb) {
112
119
  const m = hsvPercent.v - c;
113
- result.r = Math.floor((tempRgb.r + m) * 255);
114
- result.g = Math.floor((tempRgb.g + m) * 255);
115
- result.b = Math.floor((tempRgb.b + m) * 255);
120
+ result.r = Math.floor((tempRgb.r + m) * rgbFactor);
121
+ result.g = Math.floor((tempRgb.g + m) * rgbFactor);
122
+ result.b = Math.floor((tempRgb.b + m) * rgbFactor);
116
123
  }
117
124
  return result;
118
125
  }
@@ -147,13 +154,18 @@ export class HsvColorManager {
147
154
  if (!input.startsWith("hsv")) {
148
155
  return;
149
156
  }
150
- const regex = /hsva?\(\s*(\d+)°\s*,\s*(\d+)%\s*,\s*(\d+)%\s*(,\s*([\d.%]+)\s*)?\)/i, result = regex.exec(input);
157
+ const regex = /hsva?\(\s*(\d+)°\s*,\s*(\d+)%\s*,\s*(\d+)%\s*(,\s*([\d.%]+)\s*)?\)/i, result = regex.exec(input), fullLength = 4, indexes = {
158
+ h: 1,
159
+ s: 2,
160
+ v: 3,
161
+ a: 5,
162
+ }, defaultAlpha = 1, radix = 10;
151
163
  return result
152
164
  ? hsvaToRgba({
153
- a: result.length > 4 ? parseAlpha(result[5]) : 1,
154
- h: parseInt(result[1], 10),
155
- s: parseInt(result[2], 10),
156
- v: parseInt(result[3], 10),
165
+ a: result.length > fullLength ? parseAlpha(result[indexes.a]) : defaultAlpha,
166
+ h: parseInt(result[indexes.h], radix),
167
+ s: parseInt(result[indexes.s], radix),
168
+ v: parseInt(result[indexes.v], radix),
157
169
  })
158
170
  : undefined;
159
171
  }
package/esm/index.js CHANGED
@@ -2,4 +2,5 @@ import { HsvColorManager } from "./HsvColorManager.js";
2
2
  import { addColorManager } from "@tsparticles/engine";
3
3
  export async function loadHsvColorPlugin() {
4
4
  addColorManager(new HsvColorManager());
5
+ await Promise.resolve();
5
6
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@tsparticles/plugin-hsv-color",
3
- "version": "3.0.3",
3
+ "version": "3.1.0",
4
4
  "description": "tsParticles HSV color plugin",
5
5
  "homepage": "https://particles.js.org",
6
6
  "repository": {
@@ -100,7 +100,7 @@
100
100
  "./package.json": "./package.json"
101
101
  },
102
102
  "dependencies": {
103
- "@tsparticles/engine": "^3.0.3"
103
+ "@tsparticles/engine": "^3.1.0"
104
104
  },
105
105
  "publishConfig": {
106
106
  "access": "public"
package/report.html CHANGED
@@ -3,7 +3,7 @@
3
3
  <head>
4
4
  <meta charset="UTF-8"/>
5
5
  <meta name="viewport" content="width=device-width, initial-scale=1"/>
6
- <title>@tsparticles/plugin-hsv-color [26 Dec 2023 at 19:29]</title>
6
+ <title>@tsparticles/plugin-hsv-color [13 Jan 2024 at 23:04]</title>
7
7
  <link rel="shortcut icon" href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAMAAACdt4HsAAABrVBMVEUAAAD///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////+O1foceMD///+J0/qK1Pr7/v8Xdr/9///W8P4UdL7L7P0Scr2r4Pyj3vwad8D5/f/2/f+55f3E6f34+/2H0/ojfMKpzOd0rNgQcb3F3O/j9f7c8v6g3Pz0/P/w+v/q+P7n9v6T1/uQ1vuE0vqLut/y+v+Z2fvt+f+15Pzv9fuc2/vR7v2V2Pvd6/bg9P7I6/285/2y4/yp3/zp8vk8i8kqgMT7/P31+fyv4vxGkcz6/P6/6P3j7vfS5PNnpNUxhcbO7f7F6v3O4vHK3/DA2u631Ouy0eqXweKJud5wqthfoNMMbLvY8f73+v2dxeR8sNtTmdDx9/zX6PSjyeaCtd1YnNGX2PuQveCGt95Nls42h8dLlM3F4vBtAAAAM3RSTlMAAyOx0/sKBvik8opWGBMOAe3l1snDm2E9LSb06eHcu5JpHbarfHZCN9CBb08zzkdNS0kYaptYAAAFV0lEQVRYw92X51/aYBDHHS2O2qqttVbrqNq9m+TJIAYIShBkWwqIiCgoWvfeq7Z2/s29hyQNyUcR7LveGwVyXy6XH8/9rqxglLfUPLxVduUor3h0rfp2TYvpivk37929TkG037hffoX0+peVtZQc1589rigVUdXS/ABSAyEmGIO/1XfvldSK8vs3OqB6u3m0nxmIrvgB0dj7rr7Y9IbuF68hnfFaiHA/sxqm0wciIG43P60qKv9WXWc1RXGh/mFESFABTSBi0sNAKzqet17eCtOb3kZIDwxEEU0oAIJGYxNBDhBND29e0rtXXbcpuPmED9IhEAAQ/AXEaF8EPmnrrKsv0LvWR3fg5sWDNAFZOgAgaKvZDogHNU9MFwnnYROkc56RD5CjAbQX9Ow4g7upCsvYu55aSI/Nj0H1akgKQEUM94dwK65hYRmFU9MIcH/fqJYOZYcnuJSU/waKDgTOEVaVKhwrTRP5XzgSpAITYzom7UvkhFX5VutmxeNnWDjjswTKTyfgluNDGbUpWissXhF3s7mlSml+czWkg3D0l1nNjGNjz3myOQOa1KM/jOS6ebdbAVTCi4gljHSFrviza7tOgRWcS0MOUX9zdNgag5w7rRqA44Lzw0hr1WqES36dFliSJFlh2rXIae3FFcDDgKdxrUIDePr8jGcSClV1u7A9xeN0ModY/pHMxmR1EzRh8TJiwqsHmKW0l4FCEZI+jHio+JdPPE9qwQtTRxku2D8sIeRL2LnxWSllANCQGOIiqVHAz2ye2JR0DcH+HoxDkaADLjgxjKQ+AwCX/g0+DNgdG0ukYCONAe+dbc2IAc6fwt1ARoDSezNHxV2Cmzwv3O6lDMV55edBGwGK9n1+x2F8EDfAGCxug8MhpsMEcTEAWf3rx2vZhe/LAmtIn/6apE6PN0ULKgywD9mmdxbmFl3OvD5AS5fW5zLbv/YHmcsBTjf/afDz3MaZTVCfAP9z6/Bw6ycv8EUBWJIn9zYcoAWWlW9+OzO3vkTy8H+RANLmdrpOuYWdZYEXpo+TlCJrW5EARb7fF+bWdqf3hhyZI1nWJQHgznErZhbjoEsWqi8dQNoE294aldzFurwSABL2XXMf9+H1VQGke9exw5P/AnA5Pv5ngMul7LOvO922iwACu8WkCwLCafvM4CeWPxfA8lNHcWZSoi8EwMAIciKX2Z4SWCMAa3snCZ/G4EA8D6CMLNFsGQhkkz/gQNEBbPCbWsxGUpYVu3z8IyNAknwJkfPMEhLyrdi5RTyUVACkw4GSFRNWJNEW+fgPGwHD8/JxnRuLabN4CGNRkAE23na2+VmEAUmrYymSGjMAYqH84YUIyzgzs3XC7gNgH36Vcc4zKY9o9fgPBXUAiHHwVboBHGLiX6Zcjp1f2wu4tvzZKo0ecPnDtQYDQvJXaBeNzce45Fp28ZQLrEZVuFqgBwOalArKXnW1UzlnSusQKJqKYNuz4tOnI6sZG4zanpemv+7ySU2jbA9h6uhcgpfy6G2PahirDZ6zvq6zDduMVFTKvzw8wgyEdelwY9in3XkEPs3osJuwRQ4qTkfzifndg9Gfc4pdsu82+tTnHZTBa2EAMrqr2t43pguc8tNm7JQVQ2S0ukj2d22dhXYP0/veWtwKrCkNoNimAN5+Xr/oLrxswKbVJjteWrX7eR63o4j9q0GxnaBdWgGA5VStpanIjQmEhV0/nVt5VOFUvix6awJhPcAaTEShgrG+iGyvb5a0Ndb1YGHFPEwoqAinoaykaID1o1pdPNu7XsnCKQ3R+hwWIIhGvORcJUBYXe3Xa3vq/mF/N9V13ugufMkfXn+KHsRD0B8AAAAASUVORK5CYII=" type="image/x-icon" />
8
8
 
9
9
  <script>
@@ -31,7 +31,7 @@
31
31
  <body>
32
32
  <div id="app"></div>
33
33
  <script>
34
- window.chartData = [{"label":"tsparticles.plugin.hsvColor.js","isAsset":true,"statSize":4128,"parsedSize":7878,"gzipSize":2380,"groups":[{"label":"dist/browser","path":"./dist/browser","statSize":4086,"groups":[{"id":542,"label":"index.js + 1 modules (concatenated)","path":"./dist/browser/index.js + 1 modules (concatenated)","statSize":4086,"parsedSize":7877,"gzipSize":2380,"concatenated":true,"groups":[{"label":"dist/browser","path":"./dist/browser/index.js + 1 modules (concatenated)/dist/browser","statSize":4086,"groups":[{"id":null,"label":"index.js","path":"./dist/browser/index.js + 1 modules (concatenated)/dist/browser/index.js","statSize":199,"parsedSize":383,"gzipSize":115,"inaccurateSizes":true},{"id":null,"label":"HsvColorManager.js","path":"./dist/browser/index.js + 1 modules (concatenated)/dist/browser/HsvColorManager.js","statSize":3887,"parsedSize":7493,"gzipSize":2264,"inaccurateSizes":true}],"parsedSize":7877,"gzipSize":2380,"inaccurateSizes":true}]}],"parsedSize":7877,"gzipSize":2380},{"label":"engine\",\"commonjs2\":\"@tsparticles/engine\",\"amd\":\"@tsparticles","path":"./engine\",\"commonjs2\":\"@tsparticles/engine\",\"amd\":\"@tsparticles","statSize":42,"groups":[{"id":533,"label":"engine\",\"root\":\"window\"}","path":"./engine\",\"commonjs2\":\"@tsparticles/engine\",\"amd\":\"@tsparticles/engine\",\"root\":\"window\"}","statSize":42}],"parsedSize":0,"gzipSize":0}],"isInitialByEntrypoint":{"tsparticles.plugin.hsvColor":true}}];
34
+ window.chartData = [{"label":"tsparticles.plugin.hsvColor.js","isAsset":true,"statSize":5473,"parsedSize":9275,"gzipSize":2663,"groups":[{"label":"dist/browser","path":"./dist/browser","statSize":5431,"groups":[{"id":399,"label":"index.js + 1 modules (concatenated)","path":"./dist/browser/index.js + 1 modules (concatenated)","statSize":5431,"parsedSize":9274,"gzipSize":2663,"concatenated":true,"groups":[{"label":"dist/browser","path":"./dist/browser/index.js + 1 modules (concatenated)/dist/browser","statSize":5431,"groups":[{"id":null,"label":"index.js","path":"./dist/browser/index.js + 1 modules (concatenated)/dist/browser/index.js","statSize":226,"parsedSize":385,"gzipSize":110,"inaccurateSizes":true},{"id":null,"label":"HsvColorManager.js","path":"./dist/browser/index.js + 1 modules (concatenated)/dist/browser/HsvColorManager.js","statSize":5205,"parsedSize":8888,"gzipSize":2552,"inaccurateSizes":true}],"parsedSize":9274,"gzipSize":2663,"inaccurateSizes":true}]}],"parsedSize":9274,"gzipSize":2663},{"label":"engine\",\"commonjs2\":\"@tsparticles/engine\",\"amd\":\"@tsparticles","path":"./engine\",\"commonjs2\":\"@tsparticles/engine\",\"amd\":\"@tsparticles","statSize":42,"groups":[{"id":533,"label":"engine\",\"root\":\"window\"}","path":"./engine\",\"commonjs2\":\"@tsparticles/engine\",\"amd\":\"@tsparticles/engine\",\"root\":\"window\"}","statSize":42}],"parsedSize":0,"gzipSize":0}],"isInitialByEntrypoint":{"tsparticles.plugin.hsvColor":true}}];
35
35
  window.entrypoints = ["tsparticles.plugin.hsvColor","tsparticles.plugin.hsvColor.min"];
36
36
  window.defaultSizes = "parsed";
37
37
  </script>
@@ -4,7 +4,7 @@
4
4
  * Demo / Generator : https://particles.js.org/
5
5
  * GitHub : https://www.github.com/matteobruni/tsparticles
6
6
  * How to use? : Check the GitHub README
7
- * v3.0.3
7
+ * v3.1.0
8
8
  */
9
9
  (function webpackUniversalModuleDefinition(root, factory) {
10
10
  if(typeof exports === 'object' && typeof module === 'object')
@@ -98,29 +98,39 @@ __webpack_require__.d(__webpack_exports__, {
98
98
  var engine_root_window_ = __webpack_require__(533);
99
99
  ;// CONCATENATED MODULE: ./dist/browser/HsvColorManager.js
100
100
 
101
+ const rgbFactor = 255,
102
+ HsvColorManager_double = 2,
103
+ half = 0.5;
101
104
  function rgbToHsv(rgb) {
102
105
  const rgbPercent = {
103
- r: rgb.r / 255,
104
- g: rgb.g / 255,
105
- b: rgb.b / 255
106
+ r: rgb.r / rgbFactor,
107
+ g: rgb.g / rgbFactor,
108
+ b: rgb.b / rgbFactor
106
109
  },
107
110
  xMax = Math.max(rgbPercent.r, rgbPercent.g, rgbPercent.b),
108
111
  xMin = Math.min(rgbPercent.r, rgbPercent.g, rgbPercent.b),
109
112
  v = xMax,
110
113
  c = xMax - xMin;
111
114
  let h = 0;
115
+ const phaseOffset = {
116
+ r: 0,
117
+ g: 2,
118
+ b: 4
119
+ },
120
+ phaseValue = 60;
112
121
  if (v === rgbPercent.r) {
113
- h = 60 * ((rgbPercent.g - rgbPercent.b) / c);
122
+ h = phaseValue * (phaseOffset.r + (rgbPercent.g - rgbPercent.b) / c);
114
123
  } else if (v === rgbPercent.g) {
115
- h = 60 * (2 + (rgbPercent.b - rgbPercent.r) / c);
124
+ h = phaseValue * (phaseOffset.g + (rgbPercent.b - rgbPercent.r) / c);
116
125
  } else if (v === rgbPercent.b) {
117
- h = 60 * (4 + (rgbPercent.r - rgbPercent.g) / c);
126
+ h = phaseValue * (phaseOffset.b + (rgbPercent.r - rgbPercent.g) / c);
118
127
  }
119
- const s = !v ? 0 : c / v;
128
+ const defaultSaturation = 0,
129
+ s = !v ? defaultSaturation : c / v;
120
130
  return {
121
131
  h,
122
- s: s * 100,
123
- v: v * 100
132
+ s: s * percentDenominator,
133
+ v: v * percentDenominator
124
134
  };
125
135
  }
126
136
  function rgbaToHsva(rgba) {
@@ -133,14 +143,16 @@ function getStyleFromHsv(color, opacity) {
133
143
  return getStyleFromHsl(hsvToHsl(color), opacity);
134
144
  }
135
145
  function hslToHsv(hsl) {
136
- const l = hsl.l / 100,
137
- sl = hsl.s / 100,
138
- v = l + sl * Math.min(l, 1 - l),
139
- sv = !v ? 0 : 2 * (1 - l / v);
146
+ const l = hsl.l / percentDenominator,
147
+ sl = hsl.s / percentDenominator,
148
+ offset = 1,
149
+ noValue = 0,
150
+ v = l + sl * Math.min(l, offset - l),
151
+ sv = !v ? noValue : HsvColorManager_double * (offset - l / v);
140
152
  return {
141
153
  h: hsl.h,
142
- s: sv * 100,
143
- v: v * 100
154
+ s: sv * percentDenominator,
155
+ v: v * percentDenominator
144
156
  };
145
157
  }
146
158
  function hslaToHsva(hsla) {
@@ -150,14 +162,16 @@ function hslaToHsva(hsla) {
150
162
  };
151
163
  }
152
164
  function hsvToHsl(hsv) {
153
- const v = hsv.v / 100,
154
- sv = hsv.s / 100,
155
- l = v * (1 - sv / 2),
156
- sl = l === 0 || l === 1 ? 0 : (v - l) / Math.min(l, 1 - l);
165
+ const v = hsv.v / percentDenominator,
166
+ sv = hsv.s / percentDenominator,
167
+ offset = 1,
168
+ noValue = 0,
169
+ l = v * (offset - sv * half),
170
+ sl = !l || l === offset ? noValue : (v - l) / Math.min(l, offset - l);
157
171
  return {
158
172
  h: hsv.h,
159
- l: l * 100,
160
- s: sl * 100
173
+ l: l * percentDenominator,
174
+ s: sl * percentDenominator
161
175
  };
162
176
  }
163
177
  function hsvaToHsla(hsva) {
@@ -172,45 +186,72 @@ function hsvToRgb(hsv) {
172
186
  g: 0,
173
187
  r: 0
174
188
  },
189
+ phase = 60,
175
190
  hsvPercent = {
176
- h: hsv.h / 60,
177
- s: hsv.s / 100,
178
- v: hsv.v / 100
191
+ h: hsv.h / phase,
192
+ s: hsv.s / engine_root_window_.percentDenominator,
193
+ v: hsv.v / engine_root_window_.percentDenominator
179
194
  },
195
+ offset = 1,
196
+ hPercentFactor = 2,
180
197
  c = hsvPercent.v * hsvPercent.s,
181
- x = c * (1 - Math.abs(hsvPercent.h % 2 - 1));
198
+ x = c * (offset - Math.abs(hsvPercent.h % hPercentFactor - offset));
182
199
  let tempRgb;
183
- if (hsvPercent.h >= 0 && hsvPercent.h <= 1) {
200
+ const cxzRange = {
201
+ min: 0,
202
+ max: 1
203
+ },
204
+ xczRange = {
205
+ min: 1,
206
+ max: 2
207
+ },
208
+ zcxRange = {
209
+ min: 2,
210
+ max: 3
211
+ },
212
+ zxcRange = {
213
+ min: 3,
214
+ max: 4
215
+ },
216
+ xzcRange = {
217
+ min: 4,
218
+ max: 5
219
+ },
220
+ czxRange = {
221
+ min: 5,
222
+ max: 6
223
+ };
224
+ if (hsvPercent.h >= cxzRange.min && hsvPercent.h <= cxzRange.max) {
184
225
  tempRgb = {
185
226
  r: c,
186
227
  g: x,
187
228
  b: 0
188
229
  };
189
- } else if (hsvPercent.h > 1 && hsvPercent.h <= 2) {
230
+ } else if (hsvPercent.h > xczRange.min && hsvPercent.h <= xczRange.max) {
190
231
  tempRgb = {
191
232
  r: x,
192
233
  g: c,
193
234
  b: 0
194
235
  };
195
- } else if (hsvPercent.h > 2 && hsvPercent.h <= 3) {
236
+ } else if (hsvPercent.h > zcxRange.min && hsvPercent.h <= zcxRange.max) {
196
237
  tempRgb = {
197
238
  r: 0,
198
239
  g: c,
199
240
  b: x
200
241
  };
201
- } else if (hsvPercent.h > 3 && hsvPercent.h <= 4) {
242
+ } else if (hsvPercent.h > zxcRange.min && hsvPercent.h <= zxcRange.max) {
202
243
  tempRgb = {
203
244
  r: 0,
204
245
  g: x,
205
246
  b: c
206
247
  };
207
- } else if (hsvPercent.h > 4 && hsvPercent.h <= 5) {
248
+ } else if (hsvPercent.h > xzcRange.min && hsvPercent.h <= xzcRange.max) {
208
249
  tempRgb = {
209
250
  r: x,
210
251
  g: 0,
211
252
  b: c
212
253
  };
213
- } else if (hsvPercent.h > 5 && hsvPercent.h <= 6) {
254
+ } else if (hsvPercent.h > czxRange.min && hsvPercent.h <= czxRange.max) {
214
255
  tempRgb = {
215
256
  r: c,
216
257
  g: 0,
@@ -219,9 +260,9 @@ function hsvToRgb(hsv) {
219
260
  }
220
261
  if (tempRgb) {
221
262
  const m = hsvPercent.v - c;
222
- result.r = Math.floor((tempRgb.r + m) * 255);
223
- result.g = Math.floor((tempRgb.g + m) * 255);
224
- result.b = Math.floor((tempRgb.b + m) * 255);
263
+ result.r = Math.floor((tempRgb.r + m) * rgbFactor);
264
+ result.g = Math.floor((tempRgb.g + m) * rgbFactor);
265
+ result.b = Math.floor((tempRgb.b + m) * rgbFactor);
225
266
  }
226
267
  return result;
227
268
  }
@@ -259,12 +300,21 @@ class HsvColorManager {
259
300
  return;
260
301
  }
261
302
  const regex = /hsva?\(\s*(\d+)°\s*,\s*(\d+)%\s*,\s*(\d+)%\s*(,\s*([\d.%]+)\s*)?\)/i,
262
- result = regex.exec(input);
303
+ result = regex.exec(input),
304
+ fullLength = 4,
305
+ indexes = {
306
+ h: 1,
307
+ s: 2,
308
+ v: 3,
309
+ a: 5
310
+ },
311
+ defaultAlpha = 1,
312
+ radix = 10;
263
313
  return result ? hsvaToRgba({
264
- a: result.length > 4 ? (0,engine_root_window_.parseAlpha)(result[5]) : 1,
265
- h: parseInt(result[1], 10),
266
- s: parseInt(result[2], 10),
267
- v: parseInt(result[3], 10)
314
+ a: result.length > fullLength ? (0,engine_root_window_.parseAlpha)(result[indexes.a]) : defaultAlpha,
315
+ h: parseInt(result[indexes.h], radix),
316
+ s: parseInt(result[indexes.s], radix),
317
+ v: parseInt(result[indexes.v], radix)
268
318
  }) : undefined;
269
319
  }
270
320
  }
@@ -273,6 +323,7 @@ class HsvColorManager {
273
323
 
274
324
  async function loadHsvColorPlugin() {
275
325
  (0,engine_root_window_.addColorManager)(new HsvColorManager());
326
+ await Promise.resolve();
276
327
  }
277
328
  })();
278
329
 
@@ -1,2 +1,2 @@
1
1
  /*! For license information please see tsparticles.plugin.hsvColor.min.js.LICENSE.txt */
2
- !function(e,r){if("object"==typeof exports&&"object"==typeof module)module.exports=r(require("@tsparticles/engine"));else if("function"==typeof define&&define.amd)define(["@tsparticles/engine"],r);else{var t="object"==typeof exports?r(require("@tsparticles/engine")):r(e.window);for(var o in t)("object"==typeof exports?exports:e)[o]=t[o]}}(this,(e=>(()=>{"use strict";var r={533:r=>{r.exports=e}},t={};function o(e){var s=t[e];if(void 0!==s)return s.exports;var n=t[e]={exports:{}};return r[e](n,n.exports,o),n.exports}o.d=(e,r)=>{for(var t in r)o.o(r,t)&&!o.o(e,t)&&Object.defineProperty(e,t,{enumerable:!0,get:r[t]})},o.o=(e,r)=>Object.prototype.hasOwnProperty.call(e,r),o.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var s={};return(()=>{o.r(s),o.d(s,{loadHsvColorPlugin:()=>n});var e=o(533);function r(e){const r={b:0,g:0,r:0},t=e.h/60,o=e.s/100,s=e.v/100,n=s*o,a=n*(1-Math.abs(t%2-1));let i;if(t>=0&&t<=1?i={r:n,g:a,b:0}:t>1&&t<=2?i={r:a,g:n,b:0}:t>2&&t<=3?i={r:0,g:n,b:a}:t>3&&t<=4?i={r:0,g:a,b:n}:t>4&&t<=5?i={r:a,g:0,b:n}:t>5&&t<=6&&(i={r:n,g:0,b:a}),i){const e=s-n;r.r=Math.floor(255*(i.r+e)),r.g=Math.floor(255*(i.g+e)),r.b=Math.floor(255*(i.b+e))}return r}class t{constructor(){this.key="hsv",this.stringPrefix="hsv"}handleColor(e){const t=e.value.hsv??e.value;if(void 0!==t.h&&void 0!==t.v)return r(t)}handleRangeColor(t){const o=t.value.hsv??t.value;if(void 0!==o.h&&void 0!==o.v)return r({h:(0,e.getRangeValue)(o.h),s:(0,e.getRangeValue)(o.s),v:(0,e.getRangeValue)(o.v)})}parseString(t){if(!t.startsWith("hsv"))return;const o=/hsva?\(\s*(\d+)°\s*,\s*(\d+)%\s*,\s*(\d+)%\s*(,\s*([\d.%]+)\s*)?\)/i.exec(t);return o?{a:(s={a:o.length>4?(0,e.parseAlpha)(o[5]):1,h:parseInt(o[1],10),s:parseInt(o[2],10),v:parseInt(o[3],10)}).a,...r(s)}:void 0;var s}}async function n(){(0,e.addColorManager)(new t)}})(),s})()));
2
+ !function(e,r){if("object"==typeof exports&&"object"==typeof module)module.exports=r(require("@tsparticles/engine"));else if("function"==typeof define&&define.amd)define(["@tsparticles/engine"],r);else{var t="object"==typeof exports?r(require("@tsparticles/engine")):r(e.window);for(var o in t)("object"==typeof exports?exports:e)[o]=t[o]}}(this,(e=>(()=>{"use strict";var r={533:r=>{r.exports=e}},t={};function o(e){var n=t[e];if(void 0!==n)return n.exports;var s=t[e]={exports:{}};return r[e](s,s.exports,o),s.exports}o.d=(e,r)=>{for(var t in r)o.o(r,t)&&!o.o(e,t)&&Object.defineProperty(e,t,{enumerable:!0,get:r[t]})},o.o=(e,r)=>Object.prototype.hasOwnProperty.call(e,r),o.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var n={};return(()=>{o.r(n),o.d(n,{loadHsvColorPlugin:()=>a});var e=o(533);const r=255;function t(t){const o={b:0,g:0,r:0},n=t.h/60,s=t.s/e.percentDenominator,a=t.v/e.percentDenominator,i=a*s,l=i*(1-Math.abs(n%2-1));let v;if(n>=0&&n<=1?v={r:i,g:l,b:0}:n>1&&n<=2?v={r:l,g:i,b:0}:n>2&&n<=3?v={r:0,g:i,b:l}:n>3&&n<=4?v={r:0,g:l,b:i}:n>4&&n<=5?v={r:l,g:0,b:i}:n>5&&n<=6&&(v={r:i,g:0,b:l}),v){const e=a-i;o.r=Math.floor((v.r+e)*r),o.g=Math.floor((v.g+e)*r),o.b=Math.floor((v.b+e)*r)}return o}class s{constructor(){this.key="hsv",this.stringPrefix="hsv"}handleColor(e){const r=e.value.hsv??e.value;if(void 0!==r.h&&void 0!==r.v)return t(r)}handleRangeColor(r){const o=r.value.hsv??r.value;if(void 0!==o.h&&void 0!==o.v)return t({h:(0,e.getRangeValue)(o.h),s:(0,e.getRangeValue)(o.s),v:(0,e.getRangeValue)(o.v)})}parseString(r){if(!r.startsWith("hsv"))return;const o=/hsva?\(\s*(\d+)°\s*,\s*(\d+)%\s*,\s*(\d+)%\s*(,\s*([\d.%]+)\s*)?\)/i.exec(r),n=1,s=2,a=3,i=5;return o?{a:(l={a:o.length>4?(0,e.parseAlpha)(o[i]):1,h:parseInt(o[n],10),s:parseInt(o[s],10),v:parseInt(o[a],10)}).a,...t(l)}:void 0;var l}}async function a(){(0,e.addColorManager)(new s),await Promise.resolve()}})(),n})()));
@@ -1 +1 @@
1
- /*! tsParticles HSV Color Plugin v3.0.3 by Matteo Bruni */
1
+ /*! tsParticles HSV Color Plugin v3.1.0 by Matteo Bruni */
@@ -11,27 +11,33 @@
11
11
  Object.defineProperty(exports, "__esModule", { value: true });
12
12
  exports.HsvColorManager = exports.hsvaToRgba = exports.hsvToRgb = exports.hsvaToHsla = exports.hsvToHsl = exports.hslaToHsva = exports.hslToHsv = exports.getStyleFromHsv = exports.rgbaToHsva = exports.rgbToHsv = void 0;
13
13
  const engine_1 = require("@tsparticles/engine");
14
+ const rgbFactor = 255, double = 2, half = 0.5;
14
15
  function rgbToHsv(rgb) {
15
16
  const rgbPercent = {
16
- r: rgb.r / 255,
17
- g: rgb.g / 255,
18
- b: rgb.b / 255,
17
+ r: rgb.r / rgbFactor,
18
+ g: rgb.g / rgbFactor,
19
+ b: rgb.b / rgbFactor,
19
20
  }, xMax = Math.max(rgbPercent.r, rgbPercent.g, rgbPercent.b), xMin = Math.min(rgbPercent.r, rgbPercent.g, rgbPercent.b), v = xMax, c = xMax - xMin;
20
21
  let h = 0;
22
+ const phaseOffset = {
23
+ r: 0,
24
+ g: 2,
25
+ b: 4,
26
+ }, phaseValue = 60;
21
27
  if (v === rgbPercent.r) {
22
- h = 60 * ((rgbPercent.g - rgbPercent.b) / c);
28
+ h = phaseValue * (phaseOffset.r + (rgbPercent.g - rgbPercent.b) / c);
23
29
  }
24
30
  else if (v === rgbPercent.g) {
25
- h = 60 * (2 + (rgbPercent.b - rgbPercent.r) / c);
31
+ h = phaseValue * (phaseOffset.g + (rgbPercent.b - rgbPercent.r) / c);
26
32
  }
27
33
  else if (v === rgbPercent.b) {
28
- h = 60 * (4 + (rgbPercent.r - rgbPercent.g) / c);
34
+ h = phaseValue * (phaseOffset.b + (rgbPercent.r - rgbPercent.g) / c);
29
35
  }
30
- const s = !v ? 0 : c / v;
36
+ const defaultSaturation = 0, s = !v ? defaultSaturation : c / v;
31
37
  return {
32
38
  h,
33
- s: s * 100,
34
- v: v * 100,
39
+ s: s * engine_1.percentDenominator,
40
+ v: v * engine_1.percentDenominator,
35
41
  };
36
42
  }
37
43
  exports.rgbToHsv = rgbToHsv;
@@ -47,11 +53,11 @@
47
53
  }
48
54
  exports.getStyleFromHsv = getStyleFromHsv;
49
55
  function hslToHsv(hsl) {
50
- const l = hsl.l / 100, sl = hsl.s / 100, v = l + sl * Math.min(l, 1 - l), sv = !v ? 0 : 2 * (1 - l / v);
56
+ const l = hsl.l / engine_1.percentDenominator, sl = hsl.s / engine_1.percentDenominator, offset = 1, noValue = 0, v = l + sl * Math.min(l, offset - l), sv = !v ? noValue : double * (offset - l / v);
51
57
  return {
52
58
  h: hsl.h,
53
- s: sv * 100,
54
- v: v * 100,
59
+ s: sv * engine_1.percentDenominator,
60
+ v: v * engine_1.percentDenominator,
55
61
  };
56
62
  }
57
63
  exports.hslToHsv = hslToHsv;
@@ -63,11 +69,11 @@
63
69
  }
64
70
  exports.hslaToHsva = hslaToHsva;
65
71
  function hsvToHsl(hsv) {
66
- const v = hsv.v / 100, sv = hsv.s / 100, l = v * (1 - sv / 2), sl = l === 0 || l === 1 ? 0 : (v - l) / Math.min(l, 1 - l);
72
+ const v = hsv.v / engine_1.percentDenominator, sv = hsv.s / engine_1.percentDenominator, offset = 1, noValue = 0, l = v * (offset - sv * half), sl = !l || l === offset ? noValue : (v - l) / Math.min(l, offset - l);
67
73
  return {
68
74
  h: hsv.h,
69
- l: l * 100,
70
- s: sl * 100,
75
+ l: l * engine_1.percentDenominator,
76
+ s: sl * engine_1.percentDenominator,
71
77
  };
72
78
  }
73
79
  exports.hsvToHsl = hsvToHsl;
@@ -79,48 +85,49 @@
79
85
  }
80
86
  exports.hsvaToHsla = hsvaToHsla;
81
87
  function hsvToRgb(hsv) {
82
- const result = { b: 0, g: 0, r: 0 }, hsvPercent = {
83
- h: hsv.h / 60,
84
- s: hsv.s / 100,
85
- v: hsv.v / 100,
86
- }, c = hsvPercent.v * hsvPercent.s, x = c * (1 - Math.abs((hsvPercent.h % 2) - 1));
88
+ const result = { b: 0, g: 0, r: 0 }, phase = 60, hsvPercent = {
89
+ h: hsv.h / phase,
90
+ s: hsv.s / engine_1.percentDenominator,
91
+ v: hsv.v / engine_1.percentDenominator,
92
+ }, offset = 1, hPercentFactor = 2, c = hsvPercent.v * hsvPercent.s, x = c * (offset - Math.abs((hsvPercent.h % hPercentFactor) - offset));
87
93
  let tempRgb;
88
- if (hsvPercent.h >= 0 && hsvPercent.h <= 1) {
94
+ const cxzRange = { min: 0, max: 1 }, xczRange = { min: 1, max: 2 }, zcxRange = { min: 2, max: 3 }, zxcRange = { min: 3, max: 4 }, xzcRange = { min: 4, max: 5 }, czxRange = { min: 5, max: 6 };
95
+ if (hsvPercent.h >= cxzRange.min && hsvPercent.h <= cxzRange.max) {
89
96
  tempRgb = {
90
97
  r: c,
91
98
  g: x,
92
99
  b: 0,
93
100
  };
94
101
  }
95
- else if (hsvPercent.h > 1 && hsvPercent.h <= 2) {
102
+ else if (hsvPercent.h > xczRange.min && hsvPercent.h <= xczRange.max) {
96
103
  tempRgb = {
97
104
  r: x,
98
105
  g: c,
99
106
  b: 0,
100
107
  };
101
108
  }
102
- else if (hsvPercent.h > 2 && hsvPercent.h <= 3) {
109
+ else if (hsvPercent.h > zcxRange.min && hsvPercent.h <= zcxRange.max) {
103
110
  tempRgb = {
104
111
  r: 0,
105
112
  g: c,
106
113
  b: x,
107
114
  };
108
115
  }
109
- else if (hsvPercent.h > 3 && hsvPercent.h <= 4) {
116
+ else if (hsvPercent.h > zxcRange.min && hsvPercent.h <= zxcRange.max) {
110
117
  tempRgb = {
111
118
  r: 0,
112
119
  g: x,
113
120
  b: c,
114
121
  };
115
122
  }
116
- else if (hsvPercent.h > 4 && hsvPercent.h <= 5) {
123
+ else if (hsvPercent.h > xzcRange.min && hsvPercent.h <= xzcRange.max) {
117
124
  tempRgb = {
118
125
  r: x,
119
126
  g: 0,
120
127
  b: c,
121
128
  };
122
129
  }
123
- else if (hsvPercent.h > 5 && hsvPercent.h <= 6) {
130
+ else if (hsvPercent.h > czxRange.min && hsvPercent.h <= czxRange.max) {
124
131
  tempRgb = {
125
132
  r: c,
126
133
  g: 0,
@@ -129,9 +136,9 @@
129
136
  }
130
137
  if (tempRgb) {
131
138
  const m = hsvPercent.v - c;
132
- result.r = Math.floor((tempRgb.r + m) * 255);
133
- result.g = Math.floor((tempRgb.g + m) * 255);
134
- result.b = Math.floor((tempRgb.b + m) * 255);
139
+ result.r = Math.floor((tempRgb.r + m) * rgbFactor);
140
+ result.g = Math.floor((tempRgb.g + m) * rgbFactor);
141
+ result.b = Math.floor((tempRgb.b + m) * rgbFactor);
135
142
  }
136
143
  return result;
137
144
  }
@@ -168,13 +175,18 @@
168
175
  if (!input.startsWith("hsv")) {
169
176
  return;
170
177
  }
171
- const regex = /hsva?\(\s*(\d+)°\s*,\s*(\d+)%\s*,\s*(\d+)%\s*(,\s*([\d.%]+)\s*)?\)/i, result = regex.exec(input);
178
+ const regex = /hsva?\(\s*(\d+)°\s*,\s*(\d+)%\s*,\s*(\d+)%\s*(,\s*([\d.%]+)\s*)?\)/i, result = regex.exec(input), fullLength = 4, indexes = {
179
+ h: 1,
180
+ s: 2,
181
+ v: 3,
182
+ a: 5,
183
+ }, defaultAlpha = 1, radix = 10;
172
184
  return result
173
185
  ? hsvaToRgba({
174
- a: result.length > 4 ? (0, engine_1.parseAlpha)(result[5]) : 1,
175
- h: parseInt(result[1], 10),
176
- s: parseInt(result[2], 10),
177
- v: parseInt(result[3], 10),
186
+ a: result.length > fullLength ? (0, engine_1.parseAlpha)(result[indexes.a]) : defaultAlpha,
187
+ h: parseInt(result[indexes.h], radix),
188
+ s: parseInt(result[indexes.s], radix),
189
+ v: parseInt(result[indexes.v], radix),
178
190
  })
179
191
  : undefined;
180
192
  }
package/umd/index.js CHANGED
@@ -14,6 +14,7 @@
14
14
  const engine_1 = require("@tsparticles/engine");
15
15
  async function loadHsvColorPlugin() {
16
16
  (0, engine_1.addColorManager)(new HsvColorManager_js_1.HsvColorManager());
17
+ await Promise.resolve();
17
18
  }
18
19
  exports.loadHsvColorPlugin = loadHsvColorPlugin;
19
20
  });