toosoon-utils 4.0.0 → 4.0.2
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/classes/_pool.d.ts +2 -2
- package/lib/classes/_pool.js +22 -47
- package/lib/classes/color-scale.js +54 -72
- package/lib/classes/frame-rate.js +17 -23
- package/lib/colors.js +70 -86
- package/lib/constants.js +6 -6
- package/lib/dom.js +7 -8
- package/lib/files.js +7 -9
- package/lib/functions.d.ts +1 -1
- package/lib/functions.js +17 -26
- package/lib/geometry.d.ts +10 -10
- package/lib/geometry.js +18 -19
- package/lib/maths.js +8 -15
- package/lib/prng.js +31 -39
- package/lib/query.js +6 -6
- package/lib/random.js +23 -39
- package/lib/strings.js +7 -7
- package/lib/tsconfig.tsbuildinfo +1 -1
- package/lib/types.d.ts +6 -6
- package/package.json +1 -1
- package/tsconfig.json +17 -13
package/lib/colors.js
CHANGED
|
@@ -8,9 +8,8 @@ import { clamp } from './maths';
|
|
|
8
8
|
* @returns {[number,number,number]} Normalized RGB color
|
|
9
9
|
*/
|
|
10
10
|
export function normalizeColor(color) {
|
|
11
|
-
var _a;
|
|
12
11
|
if (typeof color === 'string') {
|
|
13
|
-
return hexToRgb(
|
|
12
|
+
return hexToRgb(W3CX11[color] ?? color);
|
|
14
13
|
}
|
|
15
14
|
else if (typeof color === 'number') {
|
|
16
15
|
return hexToRgb(color);
|
|
@@ -29,8 +28,8 @@ export function normalizeColor(color) {
|
|
|
29
28
|
* @returns {string} Normalized hexadecimal string
|
|
30
29
|
*/
|
|
31
30
|
export function normalizeHexString(hex) {
|
|
32
|
-
|
|
33
|
-
|
|
31
|
+
let match;
|
|
32
|
+
let result = '000000';
|
|
34
33
|
hex = hex.toLocaleLowerCase();
|
|
35
34
|
if ((match = hex.match(/(#|0x)?([a-f0-9]{6})/i))) {
|
|
36
35
|
result = match[2];
|
|
@@ -44,7 +43,7 @@ export function normalizeHexString(hex) {
|
|
|
44
43
|
parseInt(match[2]).toString(16).padStart(2, '0') +
|
|
45
44
|
parseInt(match[3]).toString(16).padStart(2, '0');
|
|
46
45
|
}
|
|
47
|
-
return
|
|
46
|
+
return `#${result}`;
|
|
48
47
|
}
|
|
49
48
|
/**
|
|
50
49
|
* Convert RGB to hexadecimal
|
|
@@ -53,8 +52,7 @@ export function normalizeHexString(hex) {
|
|
|
53
52
|
* @param {[number, number, number]} rgb RGB color
|
|
54
53
|
* @returns {number} Hexadecimal color
|
|
55
54
|
*/
|
|
56
|
-
export function rgbToHex(
|
|
57
|
-
var r = _a[0], g = _a[1], b = _a[2];
|
|
55
|
+
export function rgbToHex([r, g, b]) {
|
|
58
56
|
return ((r * 255) << 16) ^ ((g * 255) << 8) ^ ((b * 255) << 0);
|
|
59
57
|
}
|
|
60
58
|
/**
|
|
@@ -64,13 +62,12 @@ export function rgbToHex(_a) {
|
|
|
64
62
|
* @param {[number, number, number]} rgb RGB color
|
|
65
63
|
* @returns {string} Hexadecimal string
|
|
66
64
|
*/
|
|
67
|
-
export function rgbToHexString(
|
|
68
|
-
var r = _a[0], g = _a[1], b = _a[2];
|
|
65
|
+
export function rgbToHexString([r, g, b]) {
|
|
69
66
|
r = clamp(Math.round(r * 255), 0, 255);
|
|
70
67
|
g = clamp(Math.round(g * 255), 0, 255);
|
|
71
68
|
b = clamp(Math.round(b * 255), 0, 255);
|
|
72
|
-
|
|
73
|
-
return
|
|
69
|
+
const result = (b | (g << 8) | (r << 16) | (1 << 24)).toString(16).slice(1);
|
|
70
|
+
return `#${result}`;
|
|
74
71
|
}
|
|
75
72
|
/**
|
|
76
73
|
* Convert hexadecimal to RGB
|
|
@@ -87,9 +84,9 @@ export function hexToRgb(hex) {
|
|
|
87
84
|
hex = normalizeHexString(hex).replace(/^#/, '');
|
|
88
85
|
hex = parseInt(hex, 16);
|
|
89
86
|
}
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
87
|
+
const r = ((hex >> 16) & 255) / 255;
|
|
88
|
+
const g = ((hex >> 8) & 255) / 255;
|
|
89
|
+
const b = (hex & 255) / 255;
|
|
93
90
|
return [r, g, b];
|
|
94
91
|
}
|
|
95
92
|
/**
|
|
@@ -99,18 +96,17 @@ export function hexToRgb(hex) {
|
|
|
99
96
|
* @param {number} [amount=0] Amount of the color offset
|
|
100
97
|
* @returns {string} Computed hexadecimal
|
|
101
98
|
*/
|
|
102
|
-
export function lighten(hex, amount) {
|
|
103
|
-
|
|
104
|
-
var prefix = '';
|
|
99
|
+
export function lighten(hex, amount = 0) {
|
|
100
|
+
let prefix = '';
|
|
105
101
|
if (hex[0] === '#') {
|
|
106
102
|
hex = hex.slice(1);
|
|
107
103
|
prefix = '#';
|
|
108
104
|
}
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
105
|
+
const value = parseInt(hex, 16);
|
|
106
|
+
const r = clamp((value >> 16) + amount, 0, 255);
|
|
107
|
+
const b = clamp(((value >> 8) & 0x00ff) + amount, 0, 255);
|
|
108
|
+
const g = clamp((value & 0x0000ff) + amount, 0, 255);
|
|
109
|
+
let result = g | (b << 8) | (r << 16);
|
|
114
110
|
if (r === 0 && g === 0 && b === 0 && amount !== 0) {
|
|
115
111
|
result = '000000';
|
|
116
112
|
}
|
|
@@ -123,8 +119,7 @@ export function lighten(hex, amount) {
|
|
|
123
119
|
* @param {number} [amount=0] Amount of the color offset
|
|
124
120
|
* @returns {string} Computed hexadecimal
|
|
125
121
|
*/
|
|
126
|
-
export function darken(hex, amount) {
|
|
127
|
-
if (amount === void 0) { amount = 0; }
|
|
122
|
+
export function darken(hex, amount = 0) {
|
|
128
123
|
return lighten(hex, -amount);
|
|
129
124
|
}
|
|
130
125
|
// ***************************************************
|
|
@@ -138,8 +133,7 @@ export function darken(hex, amount) {
|
|
|
138
133
|
* @returns {[number, number, number]} Normalized HSL color
|
|
139
134
|
*/
|
|
140
135
|
export function normalizeHslString(hsl) {
|
|
141
|
-
|
|
142
|
-
var _c = (_b = (_a = hsl.match(/\d+/g)) === null || _a === void 0 ? void 0 : _a.map(Number)) !== null && _b !== void 0 ? _b : [0, 0, 0], h = _c[0], s = _c[1], l = _c[2];
|
|
136
|
+
const [h, s, l] = hsl.match(/\d+/g)?.map(Number) ?? [0, 0, 0];
|
|
143
137
|
return [h, s / 100, l / 100];
|
|
144
138
|
}
|
|
145
139
|
/**
|
|
@@ -151,11 +145,10 @@ export function normalizeHslString(hsl) {
|
|
|
151
145
|
* @param {[number, number, number]} rgb RGB color
|
|
152
146
|
* @returns {[number, number, number]} HSL color
|
|
153
147
|
*/
|
|
154
|
-
export function rgbToHsl(
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
var h = s ? (l === r ? (g - b) / s : l === g ? 2 + (b - r) / s : 4 + (r - g) / s) : 0;
|
|
148
|
+
export function rgbToHsl([r, g, b]) {
|
|
149
|
+
const l = Math.max(r, g, b);
|
|
150
|
+
const s = l - Math.min(r, g, b);
|
|
151
|
+
const h = s ? (l === r ? (g - b) / s : l === g ? 2 + (b - r) / s : 4 + (r - g) / s) : 0;
|
|
159
152
|
return [
|
|
160
153
|
60 * h < 0 ? 60 * h + 360 : 60 * h,
|
|
161
154
|
s ? (l <= 0.5 ? s / (2 * l - s) : s / (2 - (2 * l - s))) : 0,
|
|
@@ -171,11 +164,10 @@ export function rgbToHsl(_a) {
|
|
|
171
164
|
* @param {[number, number, number]} hsl HSL color
|
|
172
165
|
* @returns {[number, number, number]} RGB color
|
|
173
166
|
*/
|
|
174
|
-
export function hslToRgb(
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
var f = function (v) { return l - a * Math.max(-1, Math.min(k(v) - 3, Math.min(9 - k(v), 1))); };
|
|
167
|
+
export function hslToRgb([h, s, l]) {
|
|
168
|
+
const a = s * Math.min(l, 1 - l);
|
|
169
|
+
const k = (v) => (v + h / 30) % 12;
|
|
170
|
+
const f = (v) => l - a * Math.max(-1, Math.min(k(v) - 3, Math.min(9 - k(v), 1)));
|
|
179
171
|
return [f(0), f(8), f(4)];
|
|
180
172
|
}
|
|
181
173
|
// ***************************************************
|
|
@@ -190,12 +182,11 @@ export function hslToRgb(_a) {
|
|
|
190
182
|
* @param {[number, number, number]} rgb RGB color
|
|
191
183
|
* @returns {[number, number, number]} HSB color
|
|
192
184
|
*/
|
|
193
|
-
export function rgbToHsb(
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
var h = delta === 0 ? 0 : delta && max === r ? (g - b) / delta : max === g ? 2 + (b - r) / delta : 4 + (r - g) / delta;
|
|
185
|
+
export function rgbToHsb([r, g, b]) {
|
|
186
|
+
const max = Math.max(r, g, b);
|
|
187
|
+
const min = Math.min(r, g, b);
|
|
188
|
+
const delta = max - min;
|
|
189
|
+
const h = delta === 0 ? 0 : delta && max === r ? (g - b) / delta : max === g ? 2 + (b - r) / delta : 4 + (r - g) / delta;
|
|
199
190
|
return [60 * (h < 0 ? h + 6 : h), max && delta / max, max];
|
|
200
191
|
}
|
|
201
192
|
/**
|
|
@@ -207,10 +198,9 @@ export function rgbToHsb(_a) {
|
|
|
207
198
|
* @param {[number, number, number]} hsb HSB color
|
|
208
199
|
* @returns {[number, number, number]} RGB color
|
|
209
200
|
*/
|
|
210
|
-
export function hsbToRgb(
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
var f = function (v) { return b * (1 - s * Math.max(0, Math.min(k(v), 4 - k(v), 1))); };
|
|
201
|
+
export function hsbToRgb([h, s, b]) {
|
|
202
|
+
const k = (v) => (v + h / 60) % 6;
|
|
203
|
+
const f = (v) => b * (1 - s * Math.max(0, Math.min(k(v), 4 - k(v), 1)));
|
|
214
204
|
return [f(5), f(3), f(1)];
|
|
215
205
|
}
|
|
216
206
|
// *********************************************
|
|
@@ -223,10 +213,9 @@ export function hsbToRgb(_a) {
|
|
|
223
213
|
* @param {[number, number, number]} lab LAB color
|
|
224
214
|
* @returns {[number, number, number]} HCL color
|
|
225
215
|
*/
|
|
226
|
-
export function labToHcl(
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
var h = abToHue(a, b);
|
|
216
|
+
export function labToHcl([l, a, b]) {
|
|
217
|
+
const c = Math.sqrt(a * a + b * b);
|
|
218
|
+
const h = abToHue(a, b);
|
|
230
219
|
return [h, c, l];
|
|
231
220
|
}
|
|
232
221
|
/**
|
|
@@ -236,10 +225,9 @@ export function labToHcl(_a) {
|
|
|
236
225
|
* @param {[number, number, number]} hcl HCL color
|
|
237
226
|
* @returns {[number, number, number]} LAB color space
|
|
238
227
|
*/
|
|
239
|
-
export function hclToLab(
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
var b = c * Math.sin(toRadians(h));
|
|
228
|
+
export function hclToLab([h, c, l]) {
|
|
229
|
+
const a = c * Math.cos(toRadians(h));
|
|
230
|
+
const b = c * Math.sin(toRadians(h));
|
|
243
231
|
return [l, a, b];
|
|
244
232
|
}
|
|
245
233
|
/**
|
|
@@ -263,7 +251,7 @@ function abToHue(a, b) {
|
|
|
263
251
|
if (a === 0 && b < 0) {
|
|
264
252
|
return 270;
|
|
265
253
|
}
|
|
266
|
-
|
|
254
|
+
let xBias = 0;
|
|
267
255
|
if (a > 0 && b > 0) {
|
|
268
256
|
xBias = 0;
|
|
269
257
|
}
|
|
@@ -278,21 +266,20 @@ function abToHue(a, b) {
|
|
|
278
266
|
// ******************************************
|
|
279
267
|
// LAB & RGB color spaces
|
|
280
268
|
// ******************************************
|
|
281
|
-
|
|
282
|
-
|
|
283
|
-
|
|
284
|
-
|
|
269
|
+
const f1 = (v) => (v * v * v > 0.008856 ? v * v * v : (v - 16 / 116) / 7.787);
|
|
270
|
+
const f2 = (v) => (v > 0.0031308 ? 1.055 * Math.pow(v, 1 / 2.4) - 0.055 : 12.92 * v);
|
|
271
|
+
const f3 = (v) => (v > 0.04045 ? Math.pow((v + 0.055) / 1.055, 2.4) : v / 12.92);
|
|
272
|
+
const f4 = (v) => (v > 0.008856 ? Math.pow(v, 1 / 3) : 7.787 * v + 16 / 116);
|
|
285
273
|
/**
|
|
286
274
|
* Converts LAB to RGB
|
|
287
275
|
*
|
|
288
276
|
* @param {[number, number, number]} lab LAB color
|
|
289
277
|
* @returns {[number, number, number]} RGB color
|
|
290
278
|
*/
|
|
291
|
-
export function labToRgb(
|
|
292
|
-
|
|
293
|
-
|
|
294
|
-
|
|
295
|
-
var z = y - b / 200;
|
|
279
|
+
export function labToRgb([l, a, b]) {
|
|
280
|
+
let y = (l + 16) / 116;
|
|
281
|
+
let x = a / 500 + y;
|
|
282
|
+
let z = y - b / 200;
|
|
296
283
|
x = 0.95047 * f1(x);
|
|
297
284
|
y = 1.0 * f1(y);
|
|
298
285
|
z = 1.08883 * f1(z);
|
|
@@ -308,14 +295,13 @@ export function labToRgb(_a) {
|
|
|
308
295
|
* @param {[number, number, number]} rgb RGB color
|
|
309
296
|
* @returns {[number, number, number]} LAB color
|
|
310
297
|
*/
|
|
311
|
-
export function rgbToLab(
|
|
312
|
-
var r = _a[0], g = _a[1], b = _a[2];
|
|
298
|
+
export function rgbToLab([r, g, b]) {
|
|
313
299
|
r = f3(r);
|
|
314
300
|
g = f3(g);
|
|
315
301
|
b = f3(b);
|
|
316
|
-
|
|
317
|
-
|
|
318
|
-
|
|
302
|
+
let x = f4((r * 0.4124 + g * 0.3576 + b * 0.1805) / 0.95047);
|
|
303
|
+
let y = f4((r * 0.2126 + g * 0.7152 + b * 0.0722) / 1);
|
|
304
|
+
let z = f4((r * 0.0193 + g * 0.1192 + b * 0.9505) / 1.08883);
|
|
319
305
|
return [116 * y - 16, 500 * (x - y), 200 * (y - z)];
|
|
320
306
|
}
|
|
321
307
|
/**
|
|
@@ -326,20 +312,20 @@ export function rgbToLab(_a) {
|
|
|
326
312
|
* @returns {number} Delta
|
|
327
313
|
*/
|
|
328
314
|
export function deltaE(labA, labB) {
|
|
329
|
-
|
|
330
|
-
|
|
331
|
-
|
|
332
|
-
|
|
333
|
-
|
|
334
|
-
|
|
335
|
-
|
|
315
|
+
const deltaL = labA[0] - labB[0];
|
|
316
|
+
const deltaA = labA[1] - labB[1];
|
|
317
|
+
const deltaB = labA[2] - labB[2];
|
|
318
|
+
const c1 = Math.sqrt(labA[1] * labA[1] + labA[2] * labA[2]);
|
|
319
|
+
const c2 = Math.sqrt(labB[1] * labB[1] + labB[2] * labB[2]);
|
|
320
|
+
const deltaC = c1 - c2;
|
|
321
|
+
let deltaH = deltaA * deltaA + deltaB * deltaB - deltaC * deltaC;
|
|
336
322
|
deltaH = deltaH < 0 ? 0 : Math.sqrt(deltaH);
|
|
337
|
-
|
|
338
|
-
|
|
339
|
-
|
|
340
|
-
|
|
341
|
-
|
|
342
|
-
|
|
323
|
+
const sc = 1.0 + 0.045 * c1;
|
|
324
|
+
const sh = 1.0 + 0.015 * c1;
|
|
325
|
+
const deltaLKlsl = deltaL / 1;
|
|
326
|
+
const deltaCkcsc = deltaC / sc;
|
|
327
|
+
const deltaHkhsh = deltaH / sh;
|
|
328
|
+
const i = deltaLKlsl * deltaLKlsl + deltaCkcsc * deltaCkcsc + deltaHkhsh * deltaHkhsh;
|
|
343
329
|
return i < 0 ? 0 : Math.sqrt(i);
|
|
344
330
|
}
|
|
345
331
|
// *********************************************
|
|
@@ -351,8 +337,7 @@ export function deltaE(labA, labB) {
|
|
|
351
337
|
* @param {[number, number, number]} rgb RGB color
|
|
352
338
|
* @returns {[number, number, number]} HCL color
|
|
353
339
|
*/
|
|
354
|
-
export function rgbToHcl(
|
|
355
|
-
var r = _a[0], g = _a[1], b = _a[2];
|
|
340
|
+
export function rgbToHcl([r, g, b]) {
|
|
356
341
|
return labToHcl(rgbToLab([r, g, b]));
|
|
357
342
|
}
|
|
358
343
|
/**
|
|
@@ -361,7 +346,6 @@ export function rgbToHcl(_a) {
|
|
|
361
346
|
* @param {[number, number, number]} hcl RGB color
|
|
362
347
|
* @returns {[number, number, number]} RGB color
|
|
363
348
|
*/
|
|
364
|
-
export function hclToRgb(
|
|
365
|
-
var h = _a[0], c = _a[1], l = _a[2];
|
|
349
|
+
export function hclToRgb([h, c, l]) {
|
|
366
350
|
return labToRgb(hclToLab([h, c, l]));
|
|
367
351
|
}
|
package/lib/constants.js
CHANGED
|
@@ -1,17 +1,17 @@
|
|
|
1
1
|
// *********************
|
|
2
2
|
// Maths
|
|
3
3
|
// *********************
|
|
4
|
-
export
|
|
5
|
-
export
|
|
6
|
-
export
|
|
7
|
-
export
|
|
8
|
-
export
|
|
4
|
+
export const EPSILON = 1e-10;
|
|
5
|
+
export const PI = Math.PI;
|
|
6
|
+
export const TWO_PI = Math.PI * 2;
|
|
7
|
+
export const HALF_PI = Math.PI / 2;
|
|
8
|
+
export const QUARTER_PI = Math.PI / 4;
|
|
9
9
|
// *********************
|
|
10
10
|
// Colors
|
|
11
11
|
// *********************
|
|
12
12
|
// X11 colors
|
|
13
13
|
// -> https://www.w3.org/TR/css-color-3/#svg-color
|
|
14
|
-
export
|
|
14
|
+
export const W3CX11 = {
|
|
15
15
|
aliceblue: 0xf0f8ff,
|
|
16
16
|
antiquewhite: 0xfaebd7,
|
|
17
17
|
aqua: 0x00ffff,
|
package/lib/dom.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
|
|
1
|
+
const DOCUMENT_NODE_TYPE = 9;
|
|
2
2
|
/**
|
|
3
3
|
* Find the closest parent that matches a selector
|
|
4
4
|
*
|
|
@@ -7,7 +7,7 @@ var DOCUMENT_NODE_TYPE = 9;
|
|
|
7
7
|
* @returns {Element|null}
|
|
8
8
|
*/
|
|
9
9
|
export function closest(element, selector) {
|
|
10
|
-
|
|
10
|
+
let current = element;
|
|
11
11
|
while (current && current.nodeType !== DOCUMENT_NODE_TYPE) {
|
|
12
12
|
if ((typeof selector === 'string' && current.matches(selector)) || current === selector) {
|
|
13
13
|
return current;
|
|
@@ -24,12 +24,11 @@ export function closest(element, selector) {
|
|
|
24
24
|
* @returns {{ canvas: HTMLCanvasElement, ctx: CanvasRenderingContext2D }}
|
|
25
25
|
*/
|
|
26
26
|
export function createCanvas(width, height) {
|
|
27
|
-
|
|
28
|
-
var canvas = document.createElement('canvas');
|
|
27
|
+
const canvas = document.createElement('canvas');
|
|
29
28
|
canvas.width = width;
|
|
30
29
|
canvas.height = height;
|
|
31
|
-
|
|
32
|
-
return { canvas
|
|
30
|
+
const ctx = canvas.getContext('2d') ?? new CanvasRenderingContext2D();
|
|
31
|
+
return { canvas, ctx };
|
|
33
32
|
}
|
|
34
33
|
/**
|
|
35
34
|
* Inject CSS styles in `document.head`
|
|
@@ -37,9 +36,9 @@ export function createCanvas(width, height) {
|
|
|
37
36
|
* @param {string} styles CSS styles to inject
|
|
38
37
|
*/
|
|
39
38
|
export function injectStyles(styles) {
|
|
40
|
-
|
|
39
|
+
const $style = document.createElement('style');
|
|
41
40
|
$style.innerHTML = styles;
|
|
42
|
-
|
|
41
|
+
const $before = document.querySelector('head link[rel=stylesheet], head style');
|
|
43
42
|
if ($before)
|
|
44
43
|
document.head.insertBefore($style, $before);
|
|
45
44
|
else
|
package/lib/files.js
CHANGED
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
* @param {string} filename Downloaded file name
|
|
6
6
|
*/
|
|
7
7
|
export function download(blob, filename) {
|
|
8
|
-
|
|
8
|
+
const link = document.createElement('a');
|
|
9
9
|
link.setAttribute('href', URL.createObjectURL(blob));
|
|
10
10
|
link.setAttribute('download', filename);
|
|
11
11
|
document.body.appendChild(link);
|
|
@@ -18,17 +18,15 @@ export function download(blob, filename) {
|
|
|
18
18
|
* @param {Function} onLoad Callback called once the file is loaded
|
|
19
19
|
* @param {string} [accept=''] MIME type the file input should accept
|
|
20
20
|
*/
|
|
21
|
-
export function upload(onLoad, accept) {
|
|
22
|
-
|
|
23
|
-
var input = document.createElement('input');
|
|
21
|
+
export function upload(onLoad, accept = '') {
|
|
22
|
+
const input = document.createElement('input');
|
|
24
23
|
input.setAttribute('type', 'file');
|
|
25
24
|
input.setAttribute('accept', accept);
|
|
26
|
-
input.addEventListener('change',
|
|
27
|
-
|
|
28
|
-
var file = (_b = (_a = event.target) === null || _a === void 0 ? void 0 : _a.files) === null || _b === void 0 ? void 0 : _b[0];
|
|
25
|
+
input.addEventListener('change', (event) => {
|
|
26
|
+
const file = event.target?.files?.[0];
|
|
29
27
|
if (file) {
|
|
30
|
-
|
|
31
|
-
fileReader.addEventListener('load',
|
|
28
|
+
const fileReader = new FileReader();
|
|
29
|
+
fileReader.addEventListener('load', () => onLoad(URL.createObjectURL(file)));
|
|
32
30
|
fileReader.readAsDataURL(file);
|
|
33
31
|
}
|
|
34
32
|
});
|
package/lib/functions.d.ts
CHANGED
package/lib/functions.js
CHANGED
|
@@ -1,16 +1,15 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* No-op function
|
|
3
3
|
*/
|
|
4
|
-
export
|
|
4
|
+
export const noop = () => { };
|
|
5
5
|
/**
|
|
6
6
|
* Promise wrapped setTimeout
|
|
7
7
|
*
|
|
8
8
|
* @param {number} [delay=0] Time to wait (in milliseconds)
|
|
9
9
|
* @returns {Promise}
|
|
10
10
|
*/
|
|
11
|
-
export function wait(delay) {
|
|
12
|
-
|
|
13
|
-
return new Promise(function (resolve) { return setTimeout(resolve, delay); });
|
|
11
|
+
export function wait(delay = 0) {
|
|
12
|
+
return new Promise((resolve) => setTimeout(resolve, delay));
|
|
14
13
|
}
|
|
15
14
|
/**
|
|
16
15
|
* Create a debounced function that delays the execution of `callback` until a specified `delay` time has passed since the last call
|
|
@@ -20,15 +19,11 @@ export function wait(delay) {
|
|
|
20
19
|
* @returns {Function} Debounced function
|
|
21
20
|
*/
|
|
22
21
|
export function debounce(callback, delay) {
|
|
23
|
-
|
|
24
|
-
return
|
|
25
|
-
var args = [];
|
|
26
|
-
for (var _i = 0; _i < arguments.length; _i++) {
|
|
27
|
-
args[_i] = arguments[_i];
|
|
28
|
-
}
|
|
22
|
+
let timeout = null;
|
|
23
|
+
return (...args) => {
|
|
29
24
|
if (timeout)
|
|
30
25
|
clearTimeout(timeout);
|
|
31
|
-
timeout = setTimeout(
|
|
26
|
+
timeout = setTimeout(() => callback(...args), delay);
|
|
32
27
|
};
|
|
33
28
|
}
|
|
34
29
|
/**
|
|
@@ -39,42 +34,38 @@ export function debounce(callback, delay) {
|
|
|
39
34
|
* @returns {Function} Throttled function
|
|
40
35
|
*/
|
|
41
36
|
export function throttle(callback, limit) {
|
|
42
|
-
|
|
43
|
-
return
|
|
44
|
-
|
|
45
|
-
for (var _i = 0; _i < arguments.length; _i++) {
|
|
46
|
-
args[_i] = arguments[_i];
|
|
47
|
-
}
|
|
48
|
-
var time = now();
|
|
37
|
+
let lastTime = 0;
|
|
38
|
+
return (...args) => {
|
|
39
|
+
const time = now();
|
|
49
40
|
if (time - lastTime >= limit) {
|
|
50
41
|
lastTime = time;
|
|
51
|
-
callback
|
|
42
|
+
callback(...args);
|
|
52
43
|
}
|
|
53
44
|
};
|
|
54
45
|
}
|
|
55
46
|
/**
|
|
56
47
|
* Deferred promise implementation
|
|
57
48
|
*
|
|
58
|
-
* @returns {
|
|
49
|
+
* @returns {object}
|
|
59
50
|
*/
|
|
60
51
|
export function defer() {
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
52
|
+
let resolve;
|
|
53
|
+
let reject;
|
|
54
|
+
const promise = new Promise((_resolve, _reject) => {
|
|
64
55
|
resolve = _resolve;
|
|
65
56
|
reject = _reject;
|
|
66
57
|
});
|
|
67
|
-
return { promise
|
|
58
|
+
return { promise, resolve, reject };
|
|
68
59
|
}
|
|
69
60
|
/**
|
|
70
61
|
* Polyfill for `now()` functions
|
|
71
62
|
*/
|
|
72
|
-
export
|
|
63
|
+
export let now;
|
|
73
64
|
// In node.js, use `process.hrtime`
|
|
74
65
|
if (typeof process !== 'undefined' && process.hrtime) {
|
|
75
66
|
now = function () {
|
|
76
67
|
// Convert [seconds, nanoseconds] to milliseconds
|
|
77
|
-
|
|
68
|
+
const time = process.hrtime();
|
|
78
69
|
return time[0] * 1000 + time[1] / 1000000;
|
|
79
70
|
};
|
|
80
71
|
}
|
package/lib/geometry.d.ts
CHANGED
|
@@ -59,30 +59,30 @@ export declare function diagonal(width: number, height: number): number;
|
|
|
59
59
|
* @returns {Vector3}
|
|
60
60
|
*/
|
|
61
61
|
export declare function radToSphere(radius: number, phi: number, theta: number, target?: Vector3): Vector3;
|
|
62
|
-
export
|
|
62
|
+
export type FitInput = {
|
|
63
63
|
width: number;
|
|
64
64
|
height: number;
|
|
65
|
-
}
|
|
66
|
-
export
|
|
65
|
+
};
|
|
66
|
+
export type FitOutput = {
|
|
67
67
|
left: number;
|
|
68
68
|
top: number;
|
|
69
69
|
width: number;
|
|
70
70
|
height: number;
|
|
71
71
|
scale: number;
|
|
72
|
-
}
|
|
72
|
+
};
|
|
73
73
|
/**
|
|
74
74
|
* Make a target fit a container (cover mode)
|
|
75
75
|
*
|
|
76
|
-
* @param {
|
|
77
|
-
* @param {
|
|
78
|
-
* @returns {
|
|
76
|
+
* @param {object} target Dimensions of the target
|
|
77
|
+
* @param {object} container Dimensions of the container
|
|
78
|
+
* @returns {object}
|
|
79
79
|
*/
|
|
80
80
|
export declare function cover(target: FitInput, container: FitInput): FitOutput;
|
|
81
81
|
/**
|
|
82
82
|
* Make a target fit a container (contain mode)
|
|
83
83
|
*
|
|
84
|
-
* @param {
|
|
85
|
-
* @param {
|
|
86
|
-
* @returns {
|
|
84
|
+
* @param {object} target Dimensions of the target
|
|
85
|
+
* @param {object} container Dimensions of the container
|
|
86
|
+
* @returns {object}
|
|
87
87
|
*/
|
|
88
88
|
export declare function contain(target: FitInput, container: FitInput): FitOutput;
|
package/lib/geometry.js
CHANGED
|
@@ -37,7 +37,7 @@ export function angle(x1, y1, x2, y2) {
|
|
|
37
37
|
* @returns {number} Closest angle
|
|
38
38
|
*/
|
|
39
39
|
export function closestAngle(source, target) {
|
|
40
|
-
|
|
40
|
+
const delta = target - source;
|
|
41
41
|
return delta > PI ? target - 2 * PI : target < -PI ? delta + 2 * PI : target;
|
|
42
42
|
}
|
|
43
43
|
/**
|
|
@@ -50,8 +50,8 @@ export function closestAngle(source, target) {
|
|
|
50
50
|
* @returns {number} Computed distance
|
|
51
51
|
*/
|
|
52
52
|
export function distance(x1, y1, x2, y2) {
|
|
53
|
-
|
|
54
|
-
|
|
53
|
+
const dx = x1 - x2;
|
|
54
|
+
const dy = y1 - y2;
|
|
55
55
|
return Math.sqrt(dx * dx + dy * dy);
|
|
56
56
|
}
|
|
57
57
|
/**
|
|
@@ -73,8 +73,7 @@ export function diagonal(width, height) {
|
|
|
73
73
|
* @param {Vector3} target Target vector
|
|
74
74
|
* @returns {Vector3}
|
|
75
75
|
*/
|
|
76
|
-
export function radToSphere(radius, phi, theta, target) {
|
|
77
|
-
if (target === void 0) { target = { x: 0, y: 0, z: 0 }; }
|
|
76
|
+
export function radToSphere(radius, phi, theta, target = { x: 0, y: 0, z: 0 }) {
|
|
78
77
|
target.x = radius * Math.sin(phi) * Math.sin(theta);
|
|
79
78
|
target.y = radius * Math.cos(phi);
|
|
80
79
|
target.z = radius * Math.sin(phi) * Math.cos(theta);
|
|
@@ -83,15 +82,15 @@ export function radToSphere(radius, phi, theta, target) {
|
|
|
83
82
|
/**
|
|
84
83
|
* Make a target fit a container
|
|
85
84
|
*
|
|
86
|
-
* @param {
|
|
87
|
-
* @param {
|
|
88
|
-
* @param {string} mode
|
|
89
|
-
* @returns {
|
|
85
|
+
* @param {object} target Dimensions of the target
|
|
86
|
+
* @param {object} container Dimensions of the container
|
|
87
|
+
* @param {string} mode Can be 'contain' | 'cover'
|
|
88
|
+
* @returns {object}
|
|
90
89
|
*/
|
|
91
90
|
function fit(target, container, mode) {
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
91
|
+
const ratioWidth = container.width / target.width;
|
|
92
|
+
const ratioHeight = container.height / target.height;
|
|
93
|
+
let scale;
|
|
95
94
|
if (mode === 'contain') {
|
|
96
95
|
scale = ratioWidth < ratioHeight ? ratioWidth : ratioHeight;
|
|
97
96
|
}
|
|
@@ -103,15 +102,15 @@ function fit(target, container, mode) {
|
|
|
103
102
|
top: (container.height - target.height * scale) >> 1,
|
|
104
103
|
width: target.width * scale,
|
|
105
104
|
height: target.height * scale,
|
|
106
|
-
scale
|
|
105
|
+
scale
|
|
107
106
|
};
|
|
108
107
|
}
|
|
109
108
|
/**
|
|
110
109
|
* Make a target fit a container (cover mode)
|
|
111
110
|
*
|
|
112
|
-
* @param {
|
|
113
|
-
* @param {
|
|
114
|
-
* @returns {
|
|
111
|
+
* @param {object} target Dimensions of the target
|
|
112
|
+
* @param {object} container Dimensions of the container
|
|
113
|
+
* @returns {object}
|
|
115
114
|
*/
|
|
116
115
|
export function cover(target, container) {
|
|
117
116
|
return fit(target, container, 'cover');
|
|
@@ -119,9 +118,9 @@ export function cover(target, container) {
|
|
|
119
118
|
/**
|
|
120
119
|
* Make a target fit a container (contain mode)
|
|
121
120
|
*
|
|
122
|
-
* @param {
|
|
123
|
-
* @param {
|
|
124
|
-
* @returns {
|
|
121
|
+
* @param {object} target Dimensions of the target
|
|
122
|
+
* @param {object} container Dimensions of the container
|
|
123
|
+
* @returns {object}
|
|
125
124
|
*/
|
|
126
125
|
export function contain(target, container) {
|
|
127
126
|
return fit(target, container, 'contain');
|