litecanvas 0.86.0 → 0.87.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/dist/dist.dev.js +188 -123
- package/dist/dist.js +1 -1
- package/dist/dist.min.js +1 -1
- package/package.json +8 -5
- package/src/index.js +187 -123
package/dist/dist.dev.js
CHANGED
|
@@ -31,6 +31,9 @@
|
|
|
31
31
|
if (!condition) throw new Error(message);
|
|
32
32
|
};
|
|
33
33
|
|
|
34
|
+
// version.js
|
|
35
|
+
var version = "0.87.0";
|
|
36
|
+
|
|
34
37
|
// src/index.js
|
|
35
38
|
function litecanvas(settings = {}) {
|
|
36
39
|
const root = window, math = Math, TWO_PI = math.PI * 2, raf = requestAnimationFrame, _browserEventListeners = [], on = (elem, evt, callback) => {
|
|
@@ -90,9 +93,9 @@
|
|
|
90
93
|
* @tutorial https://gamedev.net/tutorials/programming/general-and-gameplay-programming/a-brief-introduction-to-lerp-r4954/
|
|
91
94
|
*/
|
|
92
95
|
lerp: (start, end, t) => {
|
|
93
|
-
DEV: assert(isNumber(start), "lerp
|
|
94
|
-
DEV: assert(isNumber(end), "lerp
|
|
95
|
-
DEV: assert(isNumber(t), "lerp
|
|
96
|
+
DEV: assert(isNumber(start), "[litecanvas] lerp() 1st param must be a number");
|
|
97
|
+
DEV: assert(isNumber(end), "[litecanvas] lerp() 2nd param must be a number");
|
|
98
|
+
DEV: assert(isNumber(t), "[litecanvas] lerp() 3rd param must be a number");
|
|
96
99
|
return t * (end - start) + start;
|
|
97
100
|
},
|
|
98
101
|
/**
|
|
@@ -125,10 +128,10 @@
|
|
|
125
128
|
* @returns {number} rounded number.
|
|
126
129
|
*/
|
|
127
130
|
round: (n, precision = 0) => {
|
|
128
|
-
DEV: assert(isNumber(n), "round
|
|
131
|
+
DEV: assert(isNumber(n), "[litecanvas] round() 1st param must be a number");
|
|
129
132
|
DEV: assert(
|
|
130
133
|
null == precision || isNumber(precision) && precision >= 0,
|
|
131
|
-
"round
|
|
134
|
+
"[litecanvas] round() 2nd param must be a positive number or zero"
|
|
132
135
|
);
|
|
133
136
|
if (!precision) {
|
|
134
137
|
return math.round(n);
|
|
@@ -145,10 +148,13 @@
|
|
|
145
148
|
* @returns {number}
|
|
146
149
|
*/
|
|
147
150
|
clamp: (value, min, max) => {
|
|
148
|
-
DEV: assert(isNumber(value), "clamp
|
|
149
|
-
DEV: assert(isNumber(min), "clamp
|
|
150
|
-
DEV: assert(isNumber(max), "clamp
|
|
151
|
-
DEV: assert(
|
|
151
|
+
DEV: assert(isNumber(value), "[litecanvas] clamp() 1st param must be a number");
|
|
152
|
+
DEV: assert(isNumber(min), "[litecanvas] clamp() 2nd param must be a number");
|
|
153
|
+
DEV: assert(isNumber(max), "[litecanvas] clamp() 3rd param must be a number");
|
|
154
|
+
DEV: assert(
|
|
155
|
+
max > min,
|
|
156
|
+
"[litecanvas] clamp() the 2nd param must be less than the 3rd param"
|
|
157
|
+
);
|
|
152
158
|
if (value < min) return min;
|
|
153
159
|
if (value > max) return max;
|
|
154
160
|
return value;
|
|
@@ -162,10 +168,13 @@
|
|
|
162
168
|
* @returns {number}
|
|
163
169
|
*/
|
|
164
170
|
wrap: (value, min, max) => {
|
|
165
|
-
DEV: assert(isNumber(value), "wrap
|
|
166
|
-
DEV: assert(isNumber(min), "wrap
|
|
167
|
-
DEV: assert(isNumber(max), "wrap
|
|
168
|
-
DEV: assert(
|
|
171
|
+
DEV: assert(isNumber(value), "[litecanvas] wrap() 1st param must be a number");
|
|
172
|
+
DEV: assert(isNumber(min), "[litecanvas] wrap() 2nd param must be a number");
|
|
173
|
+
DEV: assert(isNumber(max), "[litecanvas] wrap() 3rd param must be a number");
|
|
174
|
+
DEV: assert(
|
|
175
|
+
max > min,
|
|
176
|
+
"[litecanvas] wrap() the 2nd param must be less than the 3rd param"
|
|
177
|
+
);
|
|
169
178
|
return value - (max - min) * math.floor((value - min) / (max - min));
|
|
170
179
|
},
|
|
171
180
|
/**
|
|
@@ -180,12 +189,15 @@
|
|
|
180
189
|
* @returns {number} the remapped number
|
|
181
190
|
*/
|
|
182
191
|
map(value, start1, stop1, start2, stop2, withinBounds) {
|
|
183
|
-
DEV: assert(isNumber(value), "map
|
|
184
|
-
DEV: assert(isNumber(start1), "map
|
|
185
|
-
DEV: assert(isNumber(stop1), "map
|
|
186
|
-
DEV: assert(isNumber(start2), "map
|
|
187
|
-
DEV: assert(isNumber(stop2), "map
|
|
188
|
-
DEV: assert(
|
|
192
|
+
DEV: assert(isNumber(value), "[litecanvas] map() 1st param must be a number");
|
|
193
|
+
DEV: assert(isNumber(start1), "[litecanvas] map() 2nd param must be a number");
|
|
194
|
+
DEV: assert(isNumber(stop1), "[litecanvas] map() 3rd param must be a number");
|
|
195
|
+
DEV: assert(isNumber(start2), "[litecanvas] map() 4th param must be a number");
|
|
196
|
+
DEV: assert(isNumber(stop2), "[litecanvas] map() 5th param must be a number");
|
|
197
|
+
DEV: assert(
|
|
198
|
+
stop1 !== start1,
|
|
199
|
+
"[litecanvas] map() the 2nd param must be different than the 3rd param"
|
|
200
|
+
);
|
|
189
201
|
const result = (value - start1) / (stop1 - start1) * (stop2 - start2) + start2;
|
|
190
202
|
return withinBounds ? instance.clamp(result, start2, stop2) : result;
|
|
191
203
|
},
|
|
@@ -200,10 +212,13 @@
|
|
|
200
212
|
* @returns {number} the normalized number.
|
|
201
213
|
*/
|
|
202
214
|
norm: (value, start, stop) => {
|
|
203
|
-
DEV: assert(isNumber(value), "norm
|
|
204
|
-
DEV: assert(isNumber(start), "norm
|
|
205
|
-
DEV: assert(isNumber(stop), "norm
|
|
206
|
-
DEV: assert(
|
|
215
|
+
DEV: assert(isNumber(value), "[litecanvas] norm() 1st param must be a number");
|
|
216
|
+
DEV: assert(isNumber(start), "[litecanvas] norm() 2nd param must be a number");
|
|
217
|
+
DEV: assert(isNumber(stop), "[litecanvas] norm() 3rd param must be a number");
|
|
218
|
+
DEV: assert(
|
|
219
|
+
start !== stop,
|
|
220
|
+
"[litecanvas] norm() the 2nd param must be different than the 3rd param"
|
|
221
|
+
);
|
|
207
222
|
return instance.map(value, start, stop, 0, 1);
|
|
208
223
|
},
|
|
209
224
|
/**
|
|
@@ -215,12 +230,12 @@
|
|
|
215
230
|
* @param {(n: number) => number} [fn] - the periodic function (which default to `Math.sin`)
|
|
216
231
|
*/
|
|
217
232
|
wave: (from, to, t, fn = Math.sin) => {
|
|
218
|
-
DEV: assert(isNumber(from), "wave
|
|
219
|
-
DEV: assert(isNumber(to), "wave
|
|
220
|
-
DEV: assert(isNumber(t), "wave
|
|
233
|
+
DEV: assert(isNumber(from), "[litecanvas] wave() 1st param must be a number");
|
|
234
|
+
DEV: assert(isNumber(to), "[litecanvas] wave() 2nd param must be a number");
|
|
235
|
+
DEV: assert(isNumber(t), "[litecanvas] wave() 3rd param must be a number");
|
|
221
236
|
DEV: assert(
|
|
222
237
|
"function" === typeof fn,
|
|
223
|
-
"wave
|
|
238
|
+
"[litecanvas] wave() 4rd param must be a function (n: number) => number"
|
|
224
239
|
);
|
|
225
240
|
return from + (fn(t) + 1) / 2 * (to - from);
|
|
226
241
|
},
|
|
@@ -234,9 +249,12 @@
|
|
|
234
249
|
* @returns {number} the random number
|
|
235
250
|
*/
|
|
236
251
|
rand: (min = 0, max = 1) => {
|
|
237
|
-
DEV: assert(isNumber(min), "rand
|
|
238
|
-
DEV: assert(isNumber(max), "rand
|
|
239
|
-
DEV: assert(
|
|
252
|
+
DEV: assert(isNumber(min), "[litecanvas] rand() 1st param must be a number");
|
|
253
|
+
DEV: assert(isNumber(max), "[litecanvas] rand() 2nd param must be a number");
|
|
254
|
+
DEV: assert(
|
|
255
|
+
max > min,
|
|
256
|
+
"[litecanvas] rand() the 1st param must be less than the 2nd param"
|
|
257
|
+
);
|
|
240
258
|
const a = 1664525;
|
|
241
259
|
const c = 1013904223;
|
|
242
260
|
const m = 4294967296;
|
|
@@ -251,9 +269,12 @@
|
|
|
251
269
|
* @returns {number} the random number
|
|
252
270
|
*/
|
|
253
271
|
randi: (min = 0, max = 1) => {
|
|
254
|
-
DEV: assert(isNumber(min), "randi
|
|
255
|
-
DEV: assert(isNumber(max), "randi
|
|
256
|
-
DEV: assert(
|
|
272
|
+
DEV: assert(isNumber(min), "[litecanvas] randi() 1st param must be a number");
|
|
273
|
+
DEV: assert(isNumber(max), "[litecanvas] randi() 2nd param must be a number");
|
|
274
|
+
DEV: assert(
|
|
275
|
+
max > min,
|
|
276
|
+
"[litecanvas] randi() the 1st param must be less than the 2nd param"
|
|
277
|
+
);
|
|
257
278
|
return math.floor(instance.rand(min, max + 1));
|
|
258
279
|
},
|
|
259
280
|
/**
|
|
@@ -266,7 +287,7 @@
|
|
|
266
287
|
rseed(value) {
|
|
267
288
|
DEV: assert(
|
|
268
289
|
null == value || isNumber(value) && value >= 0,
|
|
269
|
-
"rseed
|
|
290
|
+
"[litecanvas] rseed() 1st param must be a positive number or zero"
|
|
270
291
|
);
|
|
271
292
|
_rngSeed = ~~value;
|
|
272
293
|
},
|
|
@@ -279,7 +300,7 @@
|
|
|
279
300
|
cls(color) {
|
|
280
301
|
DEV: assert(
|
|
281
302
|
null == color || isNumber(color) && color >= 0,
|
|
282
|
-
"cls
|
|
303
|
+
"[litecanvas] cls() 1st param must be a positive number or zero or undefined"
|
|
283
304
|
);
|
|
284
305
|
if (null == color) {
|
|
285
306
|
_ctx.clearRect(0, 0, _ctx.canvas.width, _ctx.canvas.height);
|
|
@@ -300,20 +321,23 @@
|
|
|
300
321
|
* @see https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/roundRect
|
|
301
322
|
*/
|
|
302
323
|
rect(x, y, width, height, color, radii) {
|
|
303
|
-
DEV: assert(isNumber(x), "rect
|
|
304
|
-
DEV: assert(isNumber(y), "rect
|
|
305
|
-
DEV: assert(
|
|
324
|
+
DEV: assert(isNumber(x), "[litecanvas] rect() 1st param must be a number");
|
|
325
|
+
DEV: assert(isNumber(y), "[litecanvas] rect() 2nd param must be a number");
|
|
326
|
+
DEV: assert(
|
|
327
|
+
isNumber(width) && width > 0,
|
|
328
|
+
"[litecanvas] rect() 3rd param must be a positive number"
|
|
329
|
+
);
|
|
306
330
|
DEV: assert(
|
|
307
331
|
isNumber(height) && height >= 0,
|
|
308
|
-
"rect
|
|
332
|
+
"[litecanvas] rect() 4th param must be a positive number or zero"
|
|
309
333
|
);
|
|
310
334
|
DEV: assert(
|
|
311
335
|
null == color || isNumber(color) && color >= 0,
|
|
312
|
-
"rect
|
|
336
|
+
"[litecanvas] rect() 5th param must be a positive number or zero"
|
|
313
337
|
);
|
|
314
338
|
DEV: assert(
|
|
315
339
|
null == radii || isNumber(radii) || Array.isArray(radii) && radii.length >= 1,
|
|
316
|
-
"rect
|
|
340
|
+
"[litecanvas] rect() 6th param must be a number or array of numbers"
|
|
317
341
|
);
|
|
318
342
|
_ctx.beginPath();
|
|
319
343
|
_ctx[radii ? "roundRect" : "rect"](
|
|
@@ -336,23 +360,23 @@
|
|
|
336
360
|
* @param {number|number[]} [radii] A number or list specifying the radii used to draw a rounded-borders rectangle
|
|
337
361
|
*/
|
|
338
362
|
rectfill(x, y, width, height, color, radii) {
|
|
339
|
-
DEV: assert(isNumber(x), "rectfill
|
|
340
|
-
DEV: assert(isNumber(y), "rectfill
|
|
363
|
+
DEV: assert(isNumber(x), "[litecanvas] rectfill() 1st param must be a number");
|
|
364
|
+
DEV: assert(isNumber(y), "[litecanvas] rectfill() 2nd param must be a number");
|
|
341
365
|
DEV: assert(
|
|
342
366
|
isNumber(width) && width >= 0,
|
|
343
|
-
"rectfill
|
|
367
|
+
"[litecanvas] rectfill() 3rd param must be a positive number or zero"
|
|
344
368
|
);
|
|
345
369
|
DEV: assert(
|
|
346
370
|
isNumber(height) && height >= 0,
|
|
347
|
-
"rectfill
|
|
371
|
+
"[litecanvas] rectfill() 4th param must be a positive number or zero"
|
|
348
372
|
);
|
|
349
373
|
DEV: assert(
|
|
350
374
|
null == color || isNumber(color) && color >= 0,
|
|
351
|
-
"rectfill
|
|
375
|
+
"[litecanvas] rectfill() 5th param must be a positive number or zero"
|
|
352
376
|
);
|
|
353
377
|
DEV: assert(
|
|
354
378
|
null == radii || isNumber(radii) || Array.isArray(radii) && radii.length >= 1,
|
|
355
|
-
"rectfill
|
|
379
|
+
"[litecanvas] rectfill() 6th param must be a number or array of at least 2 numbers"
|
|
356
380
|
);
|
|
357
381
|
_ctx.beginPath();
|
|
358
382
|
_ctx[radii ? "roundRect" : "rect"](~~x, ~~y, ~~width, ~~height, radii);
|
|
@@ -367,15 +391,15 @@
|
|
|
367
391
|
* @param {number} [color=0] the color index
|
|
368
392
|
*/
|
|
369
393
|
circ(x, y, radius, color) {
|
|
370
|
-
DEV: assert(isNumber(x), "circ
|
|
371
|
-
DEV: assert(isNumber(y), "circ
|
|
394
|
+
DEV: assert(isNumber(x), "[litecanvas] circ() 1st param must be a number");
|
|
395
|
+
DEV: assert(isNumber(y), "[litecanvas] circ() 2nd param must be a number");
|
|
372
396
|
DEV: assert(
|
|
373
397
|
isNumber(radius) && radius >= 0,
|
|
374
|
-
"circ
|
|
398
|
+
"[litecanvas] circ() 3rd param must be a positive number or zero"
|
|
375
399
|
);
|
|
376
400
|
DEV: assert(
|
|
377
401
|
null == color || isNumber(color) && color >= 0,
|
|
378
|
-
"circ
|
|
402
|
+
"[litecanvas] circ() 4th param must be a positive number or zero"
|
|
379
403
|
);
|
|
380
404
|
_ctx.beginPath();
|
|
381
405
|
_ctx.arc(~~x, ~~y, ~~radius, 0, TWO_PI);
|
|
@@ -390,15 +414,15 @@
|
|
|
390
414
|
* @param {number} [color=0] the color index
|
|
391
415
|
*/
|
|
392
416
|
circfill(x, y, radius, color) {
|
|
393
|
-
DEV: assert(isNumber(x), "circfill
|
|
394
|
-
DEV: assert(isNumber(y), "circfill
|
|
417
|
+
DEV: assert(isNumber(x), "[litecanvas] circfill() 1st param must be a number");
|
|
418
|
+
DEV: assert(isNumber(y), "[litecanvas] circfill() 2nd param must be a number");
|
|
395
419
|
DEV: assert(
|
|
396
420
|
isNumber(radius) && radius >= 0,
|
|
397
|
-
"circfill
|
|
421
|
+
"[litecanvas] circfill() 3rd param must be a positive number or zero"
|
|
398
422
|
);
|
|
399
423
|
DEV: assert(
|
|
400
424
|
null == color || isNumber(color) && color >= 0,
|
|
401
|
-
"circfill
|
|
425
|
+
"[litecanvas] circfill() 4th param must be a positive number or zero"
|
|
402
426
|
);
|
|
403
427
|
_ctx.beginPath();
|
|
404
428
|
_ctx.arc(~~x, ~~y, ~~radius, 0, TWO_PI);
|
|
@@ -414,19 +438,19 @@
|
|
|
414
438
|
* @param {number} [color=0] the color index
|
|
415
439
|
*/
|
|
416
440
|
oval(x, y, radiusX, radiusY, color) {
|
|
417
|
-
DEV: assert(isNumber(x), "oval
|
|
418
|
-
DEV: assert(isNumber(y), "oval
|
|
441
|
+
DEV: assert(isNumber(x), "[litecanvas] oval() 1st param must be a number");
|
|
442
|
+
DEV: assert(isNumber(y), "[litecanvas] oval() 2nd param must be a number");
|
|
419
443
|
DEV: assert(
|
|
420
444
|
isNumber(radiusX) && radiusX >= 0,
|
|
421
|
-
"oval
|
|
445
|
+
"[litecanvas] oval() 3rd param must be a positive number or zero"
|
|
422
446
|
);
|
|
423
447
|
DEV: assert(
|
|
424
448
|
isNumber(radiusY) && radiusY >= 0,
|
|
425
|
-
"oval
|
|
449
|
+
"[litecanvas] oval() 4th param must be a positive number or zero"
|
|
426
450
|
);
|
|
427
451
|
DEV: assert(
|
|
428
452
|
null == color || isNumber(color) && color >= 0,
|
|
429
|
-
"oval
|
|
453
|
+
"[litecanvas] oval() 5th param must be a positive number or zero"
|
|
430
454
|
);
|
|
431
455
|
_ctx.beginPath();
|
|
432
456
|
_ctx.ellipse(~~x, ~~y, ~~radiusX, ~~radiusY, 0, 0, TWO_PI);
|
|
@@ -442,19 +466,19 @@
|
|
|
442
466
|
* @param {number} [color=0] the color index
|
|
443
467
|
*/
|
|
444
468
|
ovalfill(x, y, radiusX, radiusY, color) {
|
|
445
|
-
DEV: assert(isNumber(x), "ovalfill
|
|
446
|
-
DEV: assert(isNumber(y), "ovalfill
|
|
469
|
+
DEV: assert(isNumber(x), "[litecanvas] ovalfill() 1st param must be a number");
|
|
470
|
+
DEV: assert(isNumber(y), "[litecanvas] ovalfill() 2nd param must be a number");
|
|
447
471
|
DEV: assert(
|
|
448
472
|
isNumber(radiusX) && radiusX >= 0,
|
|
449
|
-
"ovalfill
|
|
473
|
+
"[litecanvas] ovalfill() 3rd param must be a positive number or zero"
|
|
450
474
|
);
|
|
451
475
|
DEV: assert(
|
|
452
476
|
isNumber(radiusY) && radiusY >= 0,
|
|
453
|
-
"ovalfill
|
|
477
|
+
"[litecanvas] ovalfill() 4th param must be a positive number or zero"
|
|
454
478
|
);
|
|
455
479
|
DEV: assert(
|
|
456
480
|
null == color || isNumber(color) && color >= 0,
|
|
457
|
-
"ovalfill
|
|
481
|
+
"[litecanvas] ovalfill() 5th param must be a positive number or zero"
|
|
458
482
|
);
|
|
459
483
|
_ctx.beginPath();
|
|
460
484
|
_ctx.ellipse(~~x, ~~y, ~~radiusX, ~~radiusY, 0, 0, TWO_PI);
|
|
@@ -470,13 +494,19 @@
|
|
|
470
494
|
* @param {number} [color=0] the color index
|
|
471
495
|
*/
|
|
472
496
|
line(x1, y1, x2, y2, color) {
|
|
473
|
-
DEV: assert(isNumber(x1), "line
|
|
474
|
-
DEV: assert(isNumber(y1), "line
|
|
475
|
-
DEV: assert(
|
|
476
|
-
|
|
497
|
+
DEV: assert(isNumber(x1), "[litecanvas] line() 1st param must be a number");
|
|
498
|
+
DEV: assert(isNumber(y1), "[litecanvas] line() 2nd param must be a number");
|
|
499
|
+
DEV: assert(
|
|
500
|
+
isNumber(x2),
|
|
501
|
+
"[litecanvas] line() 3rd param must be a positive number or zero"
|
|
502
|
+
);
|
|
503
|
+
DEV: assert(
|
|
504
|
+
isNumber(y2),
|
|
505
|
+
"[litecanvas] line() 4th param must be a positive number or zero"
|
|
506
|
+
);
|
|
477
507
|
DEV: assert(
|
|
478
508
|
null == color || isNumber(color) && color >= 0,
|
|
479
|
-
"line
|
|
509
|
+
"[litecanvas] line() 5th param must be a positive number or zero"
|
|
480
510
|
);
|
|
481
511
|
_ctx.beginPath();
|
|
482
512
|
let xfix = _outline_fix !== 0 && ~~x1 === ~~x2 ? 0.5 : 0;
|
|
@@ -494,7 +524,7 @@
|
|
|
494
524
|
linewidth(value) {
|
|
495
525
|
DEV: assert(
|
|
496
526
|
isNumber(value) && ~~value > 0,
|
|
497
|
-
"linewidth
|
|
527
|
+
"[litecanvas] linewidth() 1st param must be a positive number"
|
|
498
528
|
);
|
|
499
529
|
_ctx.lineWidth = ~~value;
|
|
500
530
|
_outline_fix = 0 === ~~value % 2 ? 0 : 0.5;
|
|
@@ -510,9 +540,9 @@
|
|
|
510
540
|
linedash(segments, offset = 0) {
|
|
511
541
|
DEV: assert(
|
|
512
542
|
Array.isArray(segments) && segments.length > 0,
|
|
513
|
-
"linedash
|
|
543
|
+
"[litecanvas] linedash() 1st param must be an array of numbers"
|
|
514
544
|
);
|
|
515
|
-
DEV: assert(isNumber(offset), "linedash
|
|
545
|
+
DEV: assert(isNumber(offset), "[litecanvas] linedash() 2nd param must be a number");
|
|
516
546
|
_ctx.setLineDash(segments);
|
|
517
547
|
_ctx.lineDashOffset = offset;
|
|
518
548
|
},
|
|
@@ -527,13 +557,16 @@
|
|
|
527
557
|
* @param {string} [fontStyle] can be "normal" (default), "italic" and/or "bold".
|
|
528
558
|
*/
|
|
529
559
|
text(x, y, message, color = 3, fontStyle = "normal") {
|
|
530
|
-
DEV: assert(isNumber(x), "text
|
|
531
|
-
DEV: assert(isNumber(y), "text
|
|
560
|
+
DEV: assert(isNumber(x), "[litecanvas] text() 1st param must be a number");
|
|
561
|
+
DEV: assert(isNumber(y), "[litecanvas] text() 2nd param must be a number");
|
|
532
562
|
DEV: assert(
|
|
533
563
|
null == color || isNumber(color) && color >= 0,
|
|
534
|
-
"text
|
|
564
|
+
"[litecanvas] text() 4th param must be a positive number or zero"
|
|
565
|
+
);
|
|
566
|
+
DEV: assert(
|
|
567
|
+
"string" === typeof fontStyle,
|
|
568
|
+
"[litecanvas] text() 5th param must be a string"
|
|
535
569
|
);
|
|
536
|
-
DEV: assert("string" === typeof fontStyle, "text: 5th param must be a string");
|
|
537
570
|
_ctx.font = `${fontStyle} ${_fontSize}px ${_fontFamily}`;
|
|
538
571
|
_ctx.fillStyle = _colors[~~color % _colors.length];
|
|
539
572
|
_ctx.fillText(message, ~~x, ~~y);
|
|
@@ -544,7 +577,10 @@
|
|
|
544
577
|
* @param {string} family
|
|
545
578
|
*/
|
|
546
579
|
textfont(family) {
|
|
547
|
-
DEV: assert(
|
|
580
|
+
DEV: assert(
|
|
581
|
+
"string" === typeof family,
|
|
582
|
+
"[litecanvas] textfont() 1st param must be a string"
|
|
583
|
+
);
|
|
548
584
|
_fontFamily = family;
|
|
549
585
|
},
|
|
550
586
|
/**
|
|
@@ -553,7 +589,7 @@
|
|
|
553
589
|
* @param {number} size
|
|
554
590
|
*/
|
|
555
591
|
textsize(size) {
|
|
556
|
-
DEV: assert(isNumber(size), "textsize
|
|
592
|
+
DEV: assert(isNumber(size), "[litecanvas] textsize() 1st param must be a number");
|
|
557
593
|
_fontSize = size;
|
|
558
594
|
},
|
|
559
595
|
/**
|
|
@@ -567,13 +603,13 @@
|
|
|
567
603
|
textalign(align, baseline) {
|
|
568
604
|
DEV: assert(
|
|
569
605
|
null == align || ["left", "right", "center", "start", "end"].includes(align),
|
|
570
|
-
"textalign
|
|
606
|
+
"[litecanvas] textalign() 1st param must be null or one of the following strings: center, left, right, start or end."
|
|
571
607
|
);
|
|
572
608
|
DEV: assert(
|
|
573
609
|
null == baseline || ["top", "bottom", "middle", "hanging", "alphabetic", "ideographic"].includes(
|
|
574
610
|
baseline
|
|
575
611
|
),
|
|
576
|
-
"textalign
|
|
612
|
+
"[litecanvas] textalign() 2nd param must be null or one of the following strings: middle, top, bottom, hanging, alphabetic or ideographic."
|
|
577
613
|
);
|
|
578
614
|
if (align) _ctx.textAlign = align;
|
|
579
615
|
if (baseline) _ctx.textBaseline = baseline;
|
|
@@ -587,8 +623,8 @@
|
|
|
587
623
|
* @param {OffscreenCanvas|HTMLImageElement|HTMLCanvasElement} source
|
|
588
624
|
*/
|
|
589
625
|
image(x, y, source) {
|
|
590
|
-
DEV: assert(isNumber(x), "image
|
|
591
|
-
DEV: assert(isNumber(y), "image
|
|
626
|
+
DEV: assert(isNumber(x), "[litecanvas] image() 1st param must be a number");
|
|
627
|
+
DEV: assert(isNumber(y), "[litecanvas] image() 2nd param must be a number");
|
|
592
628
|
_ctx.drawImage(source, ~~x, ~~y);
|
|
593
629
|
},
|
|
594
630
|
/**
|
|
@@ -604,22 +640,25 @@
|
|
|
604
640
|
* @see https://developer.mozilla.org/en-US/docs/Web/API/OffscreenCanvas
|
|
605
641
|
*/
|
|
606
642
|
paint(width, height, drawing, options = {}) {
|
|
607
|
-
DEV: assert(
|
|
643
|
+
DEV: assert(
|
|
644
|
+
isNumber(width) && width >= 1,
|
|
645
|
+
"[litecanvas] paint() 1st param must be a positive number"
|
|
646
|
+
);
|
|
608
647
|
DEV: assert(
|
|
609
648
|
isNumber(height) && height >= 1,
|
|
610
|
-
"paint
|
|
649
|
+
"[litecanvas] paint() 2nd param must be a positive number"
|
|
611
650
|
);
|
|
612
651
|
DEV: assert(
|
|
613
652
|
"function" === typeof drawing || Array.isArray(drawing),
|
|
614
|
-
"paint
|
|
653
|
+
"[litecanvas] paint() 3rd param must be a function or array"
|
|
615
654
|
);
|
|
616
655
|
DEV: assert(
|
|
617
656
|
options && null == options.scale || isNumber(options.scale),
|
|
618
|
-
"paint
|
|
657
|
+
"[litecanvas] paint() 4th param (options.scale) must be a number"
|
|
619
658
|
);
|
|
620
659
|
DEV: assert(
|
|
621
660
|
options && null == options.canvas || options.canvas instanceof OffscreenCanvas,
|
|
622
|
-
"paint
|
|
661
|
+
"[litecanvas] paint() 4th param (options.canvas) must be an OffscreenCanvas"
|
|
623
662
|
);
|
|
624
663
|
const canvas = options.canvas || new OffscreenCanvas(1, 1), scale = options.scale || 1, contextOriginal = _ctx;
|
|
625
664
|
canvas.width = width * scale;
|
|
@@ -678,8 +717,8 @@
|
|
|
678
717
|
* @param {number} y
|
|
679
718
|
*/
|
|
680
719
|
translate: (x, y) => {
|
|
681
|
-
DEV: assert(isNumber(x), "translate
|
|
682
|
-
DEV: assert(isNumber(y), "translate
|
|
720
|
+
DEV: assert(isNumber(x), "[litecanvas] translate() 1st param must be a number");
|
|
721
|
+
DEV: assert(isNumber(y), "[litecanvas] translate() 2nd param must be a number");
|
|
683
722
|
return _ctx.translate(~~x, ~~y);
|
|
684
723
|
},
|
|
685
724
|
/**
|
|
@@ -689,8 +728,8 @@
|
|
|
689
728
|
* @param {number} [y]
|
|
690
729
|
*/
|
|
691
730
|
scale: (x, y) => {
|
|
692
|
-
DEV: assert(isNumber(x), "scale
|
|
693
|
-
DEV: assert(null == y || isNumber(y), "scale
|
|
731
|
+
DEV: assert(isNumber(x), "[litecanvas] scale() 1st param must be a number");
|
|
732
|
+
DEV: assert(null == y || isNumber(y), "[litecanvas] scale() 2nd param must be a number");
|
|
694
733
|
return _ctx.scale(x, y || x);
|
|
695
734
|
},
|
|
696
735
|
/**
|
|
@@ -699,7 +738,7 @@
|
|
|
699
738
|
* @param {number} radians
|
|
700
739
|
*/
|
|
701
740
|
rotate: (radians) => {
|
|
702
|
-
DEV: assert(isNumber(radians), "rotate
|
|
741
|
+
DEV: assert(isNumber(radians), "[litecanvas] rotate() 1st param must be a number");
|
|
703
742
|
return _ctx.rotate(radians);
|
|
704
743
|
},
|
|
705
744
|
/**
|
|
@@ -709,7 +748,7 @@
|
|
|
709
748
|
* @see https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/globalAlpha
|
|
710
749
|
*/
|
|
711
750
|
alpha(value) {
|
|
712
|
-
DEV: assert(isNumber(value), "alpha
|
|
751
|
+
DEV: assert(isNumber(value), "[litecanvas] alpha() 1st param must be a number");
|
|
713
752
|
_ctx.globalAlpha = instance.clamp(value, 0, 1);
|
|
714
753
|
},
|
|
715
754
|
/**
|
|
@@ -724,7 +763,7 @@
|
|
|
724
763
|
path: (arg) => {
|
|
725
764
|
DEV: assert(
|
|
726
765
|
null == arg || "string" === typeof arg || arg instanceof Path2D,
|
|
727
|
-
"path
|
|
766
|
+
"[litecanvas] path() 1st param must be a string or a Path2D instance"
|
|
728
767
|
);
|
|
729
768
|
return new Path2D(arg);
|
|
730
769
|
},
|
|
@@ -737,11 +776,11 @@
|
|
|
737
776
|
fill(color, path) {
|
|
738
777
|
DEV: assert(
|
|
739
778
|
null == color || isNumber(color) && color >= 0,
|
|
740
|
-
"fill
|
|
779
|
+
"[litecanvas] fill() 1st param must be a positive number or zero"
|
|
741
780
|
);
|
|
742
781
|
DEV: assert(
|
|
743
782
|
null == path || path instanceof Path2D,
|
|
744
|
-
"fill
|
|
783
|
+
"[litecanvas] fill() 2nd param must be a Path2D instance"
|
|
745
784
|
);
|
|
746
785
|
_ctx.fillStyle = _colors[~~color % _colors.length];
|
|
747
786
|
if (path) {
|
|
@@ -759,11 +798,11 @@
|
|
|
759
798
|
stroke(color, path) {
|
|
760
799
|
DEV: assert(
|
|
761
800
|
null == color || isNumber(color) && color >= 0,
|
|
762
|
-
"stroke
|
|
801
|
+
"[litecanvas] stroke() 1st param must be a positive number or zero"
|
|
763
802
|
);
|
|
764
803
|
DEV: assert(
|
|
765
804
|
null == path || path instanceof Path2D,
|
|
766
|
-
"stroke
|
|
805
|
+
"[litecanvas] stroke() 2nd param must be a Path2D instance"
|
|
767
806
|
);
|
|
768
807
|
_ctx.strokeStyle = _colors[~~color % _colors.length];
|
|
769
808
|
if (path) {
|
|
@@ -781,7 +820,10 @@
|
|
|
781
820
|
* @see https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/clip
|
|
782
821
|
*/
|
|
783
822
|
clip(path) {
|
|
784
|
-
DEV: assert(
|
|
823
|
+
DEV: assert(
|
|
824
|
+
path instanceof Path2D,
|
|
825
|
+
"[litecanvas] clip() 1st param must be a Path2D instance"
|
|
826
|
+
);
|
|
785
827
|
_ctx.clip(path);
|
|
786
828
|
},
|
|
787
829
|
/** SOUND API */
|
|
@@ -799,10 +841,10 @@
|
|
|
799
841
|
sfx(zzfxParams, pitchSlide = 0, volumeFactor = 1) {
|
|
800
842
|
DEV: assert(
|
|
801
843
|
null == zzfxParams || Array.isArray(zzfxParams),
|
|
802
|
-
"sfx
|
|
844
|
+
"[litecanvas] sfx() 1st param must be an array"
|
|
803
845
|
);
|
|
804
|
-
DEV: assert(isNumber(pitchSlide), "sfx
|
|
805
|
-
DEV: assert(isNumber(volumeFactor), "sfx
|
|
846
|
+
DEV: assert(isNumber(pitchSlide), "[litecanvas] sfx() 2nd param must be a number");
|
|
847
|
+
DEV: assert(isNumber(volumeFactor), "[litecanvas] sfx() 3rd param must be a number");
|
|
806
848
|
if (
|
|
807
849
|
// @ts-ignore
|
|
808
850
|
root.zzfxV <= 0 || navigator.userActivation && !navigator.userActivation.hasBeenActive
|
|
@@ -825,7 +867,7 @@
|
|
|
825
867
|
* @param {number} value
|
|
826
868
|
*/
|
|
827
869
|
volume(value) {
|
|
828
|
-
DEV: assert(isNumber(value), "volume
|
|
870
|
+
DEV: assert(isNumber(value), "[litecanvas] volume() 1st param must be a number");
|
|
829
871
|
root.zzfxV = value;
|
|
830
872
|
},
|
|
831
873
|
/** PLUGINS API */
|
|
@@ -841,8 +883,14 @@
|
|
|
841
883
|
* @param {pluginCallback} callback
|
|
842
884
|
*/
|
|
843
885
|
use(callback, config = {}) {
|
|
844
|
-
DEV: assert(
|
|
845
|
-
|
|
886
|
+
DEV: assert(
|
|
887
|
+
"function" === typeof callback,
|
|
888
|
+
"[litecanvas] use() 1st param must be a function"
|
|
889
|
+
);
|
|
890
|
+
DEV: assert(
|
|
891
|
+
"object" === typeof config,
|
|
892
|
+
"[litecanvas] use() 2nd param must be an object"
|
|
893
|
+
);
|
|
846
894
|
if (_initialized) {
|
|
847
895
|
loadPlugin(callback, config);
|
|
848
896
|
} else {
|
|
@@ -857,8 +905,14 @@
|
|
|
857
905
|
* @returns {Function} a function to remove the listener
|
|
858
906
|
*/
|
|
859
907
|
listen(eventName, callback) {
|
|
860
|
-
DEV: assert(
|
|
861
|
-
|
|
908
|
+
DEV: assert(
|
|
909
|
+
"string" === typeof eventName,
|
|
910
|
+
"[litecanvas] listen() 1st param must be a string"
|
|
911
|
+
);
|
|
912
|
+
DEV: assert(
|
|
913
|
+
"function" === typeof callback,
|
|
914
|
+
"[litecanvas] listen() 2nd param must be a function"
|
|
915
|
+
);
|
|
862
916
|
eventName = eventName.toLowerCase();
|
|
863
917
|
_eventListeners[eventName] = _eventListeners[eventName] || /* @__PURE__ */ new Set();
|
|
864
918
|
_eventListeners[eventName].add(callback);
|
|
@@ -874,7 +928,10 @@
|
|
|
874
928
|
* @param {*} [arg4] any data to be passed over the listeners
|
|
875
929
|
*/
|
|
876
930
|
emit(eventName, arg1, arg2, arg3, arg4) {
|
|
877
|
-
DEV: assert(
|
|
931
|
+
DEV: assert(
|
|
932
|
+
"string" === typeof eventName,
|
|
933
|
+
"[litecanvas] emit() 1st param must be a string"
|
|
934
|
+
);
|
|
878
935
|
if (_initialized) {
|
|
879
936
|
eventName = eventName.toLowerCase();
|
|
880
937
|
triggerEvent("before:" + eventName, arg1, arg2, arg3, arg4);
|
|
@@ -890,7 +947,7 @@
|
|
|
890
947
|
pal(colors = defaultPalette) {
|
|
891
948
|
DEV: assert(
|
|
892
949
|
Array.isArray(colors) && colors.length > 0,
|
|
893
|
-
"pal
|
|
950
|
+
"[litecanvas] pal() 1st param must be a array of strings"
|
|
894
951
|
);
|
|
895
952
|
_colors = colors;
|
|
896
953
|
},
|
|
@@ -901,7 +958,7 @@
|
|
|
901
958
|
* @param {*} value
|
|
902
959
|
*/
|
|
903
960
|
def(key, value) {
|
|
904
|
-
DEV: assert("string" === typeof key, "def
|
|
961
|
+
DEV: assert("string" === typeof key, "[litecanvas] def() 1st param must be a string");
|
|
905
962
|
DEV: if (null == value) {
|
|
906
963
|
console.warn(`def: key "${key}" was defined as ${value} but now is null`);
|
|
907
964
|
}
|
|
@@ -920,7 +977,7 @@
|
|
|
920
977
|
timescale(value) {
|
|
921
978
|
DEV: assert(
|
|
922
979
|
isNumber(value) && value >= 0,
|
|
923
|
-
"timescale
|
|
980
|
+
"[litecanvas] timescale() 1st param must be a positive number or zero"
|
|
924
981
|
);
|
|
925
982
|
_timeScale = value;
|
|
926
983
|
},
|
|
@@ -932,7 +989,7 @@
|
|
|
932
989
|
framerate(value) {
|
|
933
990
|
DEV: assert(
|
|
934
991
|
isNumber(value) && value >= 1,
|
|
935
|
-
"framerate
|
|
992
|
+
"[litecanvas] framerate() 1st param must be a positive number"
|
|
936
993
|
);
|
|
937
994
|
_deltaTime = 1 / ~~value;
|
|
938
995
|
},
|
|
@@ -943,7 +1000,7 @@
|
|
|
943
1000
|
* @returns {any}
|
|
944
1001
|
*/
|
|
945
1002
|
stat(n) {
|
|
946
|
-
DEV: assert(isNumber(n) && n >= 0, "stat
|
|
1003
|
+
DEV: assert(isNumber(n) && n >= 0, "[litecanvas] stat() 1st param must be a number");
|
|
947
1004
|
const list = [
|
|
948
1005
|
// 0
|
|
949
1006
|
settings,
|
|
@@ -1001,6 +1058,9 @@
|
|
|
1001
1058
|
function init() {
|
|
1002
1059
|
const source = settings.loop ? settings.loop : root;
|
|
1003
1060
|
for (const event of _coreEvents.split(",")) {
|
|
1061
|
+
DEV: if (root === source && source[event]) {
|
|
1062
|
+
console.info(`[litecanvas] using window.${event}()`);
|
|
1063
|
+
}
|
|
1004
1064
|
if (source[event]) instance.listen(event, source[event]);
|
|
1005
1065
|
}
|
|
1006
1066
|
for (const [callback, config] of _plugins) {
|
|
@@ -1197,7 +1257,7 @@
|
|
|
1197
1257
|
(key) => {
|
|
1198
1258
|
DEV: assert(
|
|
1199
1259
|
null == key || "string" === typeof key,
|
|
1200
|
-
"iskeydown
|
|
1260
|
+
"[litecanvas] iskeydown() 1st param must be a string or undefined"
|
|
1201
1261
|
);
|
|
1202
1262
|
return keyCheck(_keysDown, key);
|
|
1203
1263
|
}
|
|
@@ -1214,7 +1274,7 @@
|
|
|
1214
1274
|
(key) => {
|
|
1215
1275
|
DEV: assert(
|
|
1216
1276
|
null == key || "string" === typeof key,
|
|
1217
|
-
"iskeypressed
|
|
1277
|
+
"[litecanvas] iskeypressed() 1st param must be a string or undefined"
|
|
1218
1278
|
);
|
|
1219
1279
|
return keyCheck(_keysPress, key);
|
|
1220
1280
|
}
|
|
@@ -1250,14 +1310,17 @@
|
|
|
1250
1310
|
function setupCanvas() {
|
|
1251
1311
|
if ("string" === typeof settings.canvas) {
|
|
1252
1312
|
_canvas = document.querySelector(settings.canvas);
|
|
1253
|
-
DEV: assert(
|
|
1313
|
+
DEV: assert(
|
|
1314
|
+
null != _canvas,
|
|
1315
|
+
'[litecanvas] litecanvas() option "canvas" is an invalid CSS selector'
|
|
1316
|
+
);
|
|
1254
1317
|
} else {
|
|
1255
1318
|
_canvas = settings.canvas;
|
|
1256
1319
|
}
|
|
1257
1320
|
_canvas = _canvas || document.createElement("canvas");
|
|
1258
1321
|
DEV: assert(
|
|
1259
1322
|
"CANVAS" === _canvas.tagName,
|
|
1260
|
-
|
|
1323
|
+
'[litecanvas] litecanvas() option "canvas" should be a canvas element or string (CSS selector)'
|
|
1261
1324
|
);
|
|
1262
1325
|
_ctx = _canvas.getContext("2d");
|
|
1263
1326
|
on(_canvas, "click", () => root.focus());
|
|
@@ -1270,15 +1333,15 @@
|
|
|
1270
1333
|
function resizeCanvas() {
|
|
1271
1334
|
DEV: assert(
|
|
1272
1335
|
null == settings.width || isNumber(settings.width) && settings.width > 0,
|
|
1273
|
-
|
|
1336
|
+
'[litecanvas] litecanvas() option "width" should be a positive number when defined'
|
|
1274
1337
|
);
|
|
1275
1338
|
DEV: assert(
|
|
1276
1339
|
null == settings.height || isNumber(settings.height) && settings.height > 0,
|
|
1277
|
-
|
|
1340
|
+
'[litecanvas] litecanvas() option "height" should be a positive number when defined'
|
|
1278
1341
|
);
|
|
1279
1342
|
DEV: assert(
|
|
1280
1343
|
null == settings.height || settings.width > 0 && settings.height > 0,
|
|
1281
|
-
|
|
1344
|
+
'[litecanvas] litecanvas() option "width" is required when the option "height" is defined'
|
|
1282
1345
|
);
|
|
1283
1346
|
const width = settings.width || root.innerWidth, height = settings.height || settings.width || root.innerHeight;
|
|
1284
1347
|
instance.def("W", width);
|
|
@@ -1315,7 +1378,7 @@
|
|
|
1315
1378
|
const pluginData = callback(instance, config);
|
|
1316
1379
|
DEV: assert(
|
|
1317
1380
|
null == pluginData || "object" === typeof pluginData,
|
|
1318
|
-
"
|
|
1381
|
+
"[litecanvas] litecanvas() plugins should return an object or nothing"
|
|
1319
1382
|
);
|
|
1320
1383
|
for (const key in pluginData) {
|
|
1321
1384
|
instance.def(key, pluginData[key]);
|
|
@@ -1323,11 +1386,13 @@
|
|
|
1323
1386
|
}
|
|
1324
1387
|
if (settings.global) {
|
|
1325
1388
|
if (root.ENGINE) {
|
|
1326
|
-
throw new Error("
|
|
1389
|
+
throw new Error("only one global litecanvas is allowed");
|
|
1327
1390
|
}
|
|
1328
1391
|
Object.assign(root, instance);
|
|
1329
1392
|
root.ENGINE = instance;
|
|
1330
1393
|
}
|
|
1394
|
+
DEV: console.info(`[litecanvas] version ${version} started`);
|
|
1395
|
+
DEV: console.debug(`[litecanvas] litecanvas() options =`, settings);
|
|
1331
1396
|
setupCanvas();
|
|
1332
1397
|
if ("loading" === document.readyState) {
|
|
1333
1398
|
on(root, "DOMContentLoaded", () => raf(init));
|