q5 2.14.3 → 2.14.5
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/README.md +1 -1
- package/package.json +1 -1
- package/q5.js +190 -75
- package/q5.min.js +1 -1
- package/q5js_brand.webp +0 -0
- package/q5js_icon.png +0 -0
- package/src/q5-2d-canvas.js +0 -202
- package/src/q5-2d-drawing.js +0 -398
- package/src/q5-2d-image.js +0 -330
- package/src/q5-2d-soft-filters.js +0 -145
- package/src/q5-2d-text.js +0 -279
- package/src/q5-ai.js +0 -65
- package/src/q5-canvas.js +0 -367
- package/src/q5-color.js +0 -322
- package/src/q5-core.js +0 -321
- package/src/q5-display.js +0 -101
- package/src/q5-dom.js +0 -2
- package/src/q5-input.js +0 -215
- package/src/q5-math.js +0 -423
- package/src/q5-noisier.js +0 -264
- package/src/q5-record.js +0 -366
- package/src/q5-sensors.js +0 -98
- package/src/q5-sound.js +0 -64
- package/src/q5-util.js +0 -50
- package/src/q5-vector.js +0 -305
- package/src/q5-webgpu-canvas.js +0 -556
- package/src/q5-webgpu-drawing.js +0 -525
- package/src/q5-webgpu-image.js +0 -268
- package/src/q5-webgpu-text.js +0 -594
- package/src/readme.md +0 -248
package/src/q5-color.js
DELETED
|
@@ -1,322 +0,0 @@
|
|
|
1
|
-
Q5.modules.color = ($, q) => {
|
|
2
|
-
$.RGB = $.RGBA = $._colorMode = 'rgb';
|
|
3
|
-
$.SRGB = 'srgb';
|
|
4
|
-
$.OKLCH = 'oklch';
|
|
5
|
-
|
|
6
|
-
$.colorMode = (mode, format) => {
|
|
7
|
-
$._colorMode = mode;
|
|
8
|
-
let srgb = $.canvas.colorSpace == 'srgb' || mode == 'srgb';
|
|
9
|
-
format ??= srgb ? 'integer' : 'float';
|
|
10
|
-
$._colorFormat = format == 'float' || format == 1 ? 1 : 255;
|
|
11
|
-
if (mode == 'oklch') {
|
|
12
|
-
q.Color = Q5.ColorOKLCH;
|
|
13
|
-
} else {
|
|
14
|
-
if ($._colorFormat == 255) {
|
|
15
|
-
q.Color = srgb ? Q5.ColorRGBA_8 : Q5.ColorRGBA_P3_8;
|
|
16
|
-
} else {
|
|
17
|
-
q.Color = srgb ? Q5.ColorRGBA : Q5.ColorRGBA_P3;
|
|
18
|
-
}
|
|
19
|
-
$._colorMode = 'rgb';
|
|
20
|
-
}
|
|
21
|
-
};
|
|
22
|
-
|
|
23
|
-
$._namedColors = {
|
|
24
|
-
aqua: [0, 255, 255],
|
|
25
|
-
black: [0, 0, 0],
|
|
26
|
-
blue: [0, 0, 255],
|
|
27
|
-
brown: [165, 42, 42],
|
|
28
|
-
crimson: [220, 20, 60],
|
|
29
|
-
cyan: [0, 255, 255],
|
|
30
|
-
darkviolet: [148, 0, 211],
|
|
31
|
-
gold: [255, 215, 0],
|
|
32
|
-
green: [0, 128, 0],
|
|
33
|
-
gray: [128, 128, 128],
|
|
34
|
-
grey: [128, 128, 128],
|
|
35
|
-
hotpink: [255, 105, 180],
|
|
36
|
-
indigo: [75, 0, 130],
|
|
37
|
-
khaki: [240, 230, 140],
|
|
38
|
-
lightgreen: [144, 238, 144],
|
|
39
|
-
lime: [0, 255, 0],
|
|
40
|
-
magenta: [255, 0, 255],
|
|
41
|
-
navy: [0, 0, 128],
|
|
42
|
-
orange: [255, 165, 0],
|
|
43
|
-
olive: [128, 128, 0],
|
|
44
|
-
peachpuff: [255, 218, 185],
|
|
45
|
-
pink: [255, 192, 203],
|
|
46
|
-
purple: [128, 0, 128],
|
|
47
|
-
red: [255, 0, 0],
|
|
48
|
-
skyblue: [135, 206, 235],
|
|
49
|
-
tan: [210, 180, 140],
|
|
50
|
-
turquoise: [64, 224, 208],
|
|
51
|
-
transparent: [0, 0, 0, 0],
|
|
52
|
-
white: [255, 255, 255],
|
|
53
|
-
violet: [238, 130, 238],
|
|
54
|
-
yellow: [255, 255, 0]
|
|
55
|
-
};
|
|
56
|
-
|
|
57
|
-
$.color = (c0, c1, c2, c3) => {
|
|
58
|
-
let C = $.Color;
|
|
59
|
-
if (c0._q5Color) return new C(...c0.levels);
|
|
60
|
-
if (c1 == undefined) {
|
|
61
|
-
if (typeof c0 == 'string') {
|
|
62
|
-
if (c0[0] == '#') {
|
|
63
|
-
if (c0.length <= 5) {
|
|
64
|
-
if (c0.length > 4) c3 = parseInt(c0[4] + c0[4], 16);
|
|
65
|
-
c2 = parseInt(c0[3] + c0[3], 16);
|
|
66
|
-
c1 = parseInt(c0[2] + c0[2], 16);
|
|
67
|
-
c0 = parseInt(c0[1] + c0[1], 16);
|
|
68
|
-
} else {
|
|
69
|
-
if (c0.length > 7) c3 = parseInt(c0.slice(7, 9), 16);
|
|
70
|
-
c2 = parseInt(c0.slice(5, 7), 16);
|
|
71
|
-
c1 = parseInt(c0.slice(3, 5), 16);
|
|
72
|
-
c0 = parseInt(c0.slice(1, 3), 16);
|
|
73
|
-
}
|
|
74
|
-
} else if ($._namedColors[c0]) {
|
|
75
|
-
[c0, c1, c2, c3] = $._namedColors[c0];
|
|
76
|
-
} else {
|
|
77
|
-
console.error(
|
|
78
|
-
"q5 can't parse color: " + c0 + '\nOnly numeric input, hex, and common named colors are supported.'
|
|
79
|
-
);
|
|
80
|
-
return new C(0, 0, 0);
|
|
81
|
-
}
|
|
82
|
-
|
|
83
|
-
if ($._colorFormat == 1) {
|
|
84
|
-
c0 /= 255;
|
|
85
|
-
if (c1) c1 /= 255;
|
|
86
|
-
if (c2) c2 /= 255;
|
|
87
|
-
if (c3) c3 /= 255;
|
|
88
|
-
}
|
|
89
|
-
}
|
|
90
|
-
if (Array.isArray(c0)) [c0, c1, c2, c3] = c0;
|
|
91
|
-
}
|
|
92
|
-
|
|
93
|
-
if (c2 == undefined) {
|
|
94
|
-
if ($._colorMode == Q5.OKLCH) return new C(c0, 0, 0, c1);
|
|
95
|
-
return new C(c0, c0, c0, c1);
|
|
96
|
-
}
|
|
97
|
-
return new C(c0, c1, c2, c3);
|
|
98
|
-
};
|
|
99
|
-
|
|
100
|
-
// deprecated
|
|
101
|
-
$.red = (c) => c.r;
|
|
102
|
-
$.green = (c) => c.g;
|
|
103
|
-
$.blue = (c) => c.b;
|
|
104
|
-
$.alpha = (c) => c.a;
|
|
105
|
-
|
|
106
|
-
$.lightness = (c) => {
|
|
107
|
-
if (c.l) return c.l;
|
|
108
|
-
return ((0.2126 * c.r + 0.7152 * c.g + 0.0722 * c.b) * 100) / 255;
|
|
109
|
-
};
|
|
110
|
-
$.hue = (c) => {
|
|
111
|
-
if (c.h) return c.h;
|
|
112
|
-
let r = c.r;
|
|
113
|
-
let g = c.g;
|
|
114
|
-
let b = c.b;
|
|
115
|
-
if ($._colorFormat == 255) {
|
|
116
|
-
r /= 255;
|
|
117
|
-
g /= 255;
|
|
118
|
-
b /= 255;
|
|
119
|
-
}
|
|
120
|
-
let max = Math.max(r, g, b);
|
|
121
|
-
let min = Math.min(r, g, b);
|
|
122
|
-
let h;
|
|
123
|
-
if (max == min) h = 0;
|
|
124
|
-
else if (max == r) h = (60 * (g - b)) / (max - min);
|
|
125
|
-
else if (max == g) h = (60 * (b - r)) / (max - min) + 120;
|
|
126
|
-
else h = (60 * (r - g)) / (max - min) + 240;
|
|
127
|
-
if (h < 0) h += 360;
|
|
128
|
-
return h;
|
|
129
|
-
};
|
|
130
|
-
|
|
131
|
-
$.lerpColor = (a, b, t) => {
|
|
132
|
-
t = Math.max(0, Math.min(1, t));
|
|
133
|
-
if ($._colorMode == 'rgb') {
|
|
134
|
-
return new $.Color($.lerp(a.r, b.r, t), $.lerp(a.g, b.g, t), $.lerp(a.b, b.b, t), $.lerp(a.a, b.a, t));
|
|
135
|
-
} else {
|
|
136
|
-
let deltaH = b.h - a.h;
|
|
137
|
-
if (deltaH > 180) deltaH -= 360;
|
|
138
|
-
if (deltaH < -180) deltaH += 360;
|
|
139
|
-
let h = a.h + t * deltaH;
|
|
140
|
-
if (h < 0) h += 360;
|
|
141
|
-
if (h > 360) h -= 360;
|
|
142
|
-
return new $.Color($.lerp(a.l, b.l, t), $.lerp(a.c, b.c, t), h, $.lerp(a.a, b.a, t));
|
|
143
|
-
}
|
|
144
|
-
};
|
|
145
|
-
};
|
|
146
|
-
|
|
147
|
-
// COLOR CLASSES
|
|
148
|
-
|
|
149
|
-
Q5.Color = class {
|
|
150
|
-
constructor() {
|
|
151
|
-
this._q5Color = true;
|
|
152
|
-
}
|
|
153
|
-
};
|
|
154
|
-
|
|
155
|
-
Q5.ColorOKLCH = class extends Q5.Color {
|
|
156
|
-
constructor(l, c, h, a) {
|
|
157
|
-
super();
|
|
158
|
-
this.l = l;
|
|
159
|
-
this.c = c;
|
|
160
|
-
this.h = h;
|
|
161
|
-
this.a = a ?? 1;
|
|
162
|
-
}
|
|
163
|
-
get levels() {
|
|
164
|
-
return [this.l, this.c, this.h, this.a];
|
|
165
|
-
}
|
|
166
|
-
equals(c) {
|
|
167
|
-
return c && this.l == c.l && this.c == c.c && this.h == c.h && this.a == c.a;
|
|
168
|
-
}
|
|
169
|
-
isSameColor(c) {
|
|
170
|
-
return c && this.l == c.l && this.c == c.c && this.h == c.h;
|
|
171
|
-
}
|
|
172
|
-
toString() {
|
|
173
|
-
return `oklch(${this.l} ${this.c} ${this.h} / ${this.a})`;
|
|
174
|
-
}
|
|
175
|
-
|
|
176
|
-
get lightness() {
|
|
177
|
-
return this.l;
|
|
178
|
-
}
|
|
179
|
-
set lightness(v) {
|
|
180
|
-
this.l = v;
|
|
181
|
-
}
|
|
182
|
-
get chroma() {
|
|
183
|
-
return this.c;
|
|
184
|
-
}
|
|
185
|
-
set chroma(v) {
|
|
186
|
-
this.c = v;
|
|
187
|
-
}
|
|
188
|
-
get hue() {
|
|
189
|
-
return this.h;
|
|
190
|
-
}
|
|
191
|
-
set hue(v) {
|
|
192
|
-
this.h = v;
|
|
193
|
-
}
|
|
194
|
-
get alpha() {
|
|
195
|
-
return this.a;
|
|
196
|
-
}
|
|
197
|
-
set alpha(v) {
|
|
198
|
-
this.a = v;
|
|
199
|
-
}
|
|
200
|
-
};
|
|
201
|
-
|
|
202
|
-
Q5.ColorRGBA = class extends Q5.Color {
|
|
203
|
-
constructor(r, g, b, a) {
|
|
204
|
-
super();
|
|
205
|
-
this.r = r;
|
|
206
|
-
this.g = g;
|
|
207
|
-
this.b = b;
|
|
208
|
-
this.a = a ?? 1;
|
|
209
|
-
}
|
|
210
|
-
get levels() {
|
|
211
|
-
return [this.r, this.g, this.b, this.a];
|
|
212
|
-
}
|
|
213
|
-
equals(c) {
|
|
214
|
-
return c && this.r == c.r && this.g == c.g && this.b == c.b && this.a == c.a;
|
|
215
|
-
}
|
|
216
|
-
isSameColor(c) {
|
|
217
|
-
return c && this.r == c.r && this.g == c.g && this.b == c.b;
|
|
218
|
-
}
|
|
219
|
-
toString() {
|
|
220
|
-
return `color(srgb ${this.r} ${this.g} ${this.b} / ${this.a})`;
|
|
221
|
-
}
|
|
222
|
-
get red() {
|
|
223
|
-
return this.r;
|
|
224
|
-
}
|
|
225
|
-
set red(v) {
|
|
226
|
-
this.r = v;
|
|
227
|
-
}
|
|
228
|
-
get green() {
|
|
229
|
-
return this.g;
|
|
230
|
-
}
|
|
231
|
-
set green(v) {
|
|
232
|
-
this.g = v;
|
|
233
|
-
}
|
|
234
|
-
get blue() {
|
|
235
|
-
return this.b;
|
|
236
|
-
}
|
|
237
|
-
set blue(v) {
|
|
238
|
-
this.b = v;
|
|
239
|
-
}
|
|
240
|
-
get alpha() {
|
|
241
|
-
return this.a;
|
|
242
|
-
}
|
|
243
|
-
set alpha(v) {
|
|
244
|
-
this.a = v;
|
|
245
|
-
}
|
|
246
|
-
};
|
|
247
|
-
|
|
248
|
-
Q5.ColorRGBA_P3 = class extends Q5.ColorRGBA {
|
|
249
|
-
toString() {
|
|
250
|
-
return `color(display-p3 ${this.r} ${this.g} ${this.b} / ${this.a})`;
|
|
251
|
-
}
|
|
252
|
-
};
|
|
253
|
-
|
|
254
|
-
// legacy 8-bit (0-255) integer color format
|
|
255
|
-
Q5.ColorRGBA_8 = class extends Q5.ColorRGBA {
|
|
256
|
-
constructor(r, g, b, a) {
|
|
257
|
-
super(r, g, b, a ?? 255);
|
|
258
|
-
}
|
|
259
|
-
// deprecated set functions for backwards compatibility
|
|
260
|
-
setRed(v) {
|
|
261
|
-
this.r = v;
|
|
262
|
-
}
|
|
263
|
-
setGreen(v) {
|
|
264
|
-
this.g = v;
|
|
265
|
-
}
|
|
266
|
-
setBlue(v) {
|
|
267
|
-
this.b = v;
|
|
268
|
-
}
|
|
269
|
-
setAlpha(v) {
|
|
270
|
-
this.a = v;
|
|
271
|
-
}
|
|
272
|
-
toString() {
|
|
273
|
-
return `rgb(${this.r} ${this.g} ${this.b} / ${this.a / 255})`;
|
|
274
|
-
}
|
|
275
|
-
};
|
|
276
|
-
|
|
277
|
-
// p3 10-bit color in integer color format, for backwards compatibility
|
|
278
|
-
Q5.ColorRGBA_P3_8 = class extends Q5.ColorRGBA {
|
|
279
|
-
constructor(r, g, b, a) {
|
|
280
|
-
super(r, g, b, a ?? 255);
|
|
281
|
-
this._edited = true;
|
|
282
|
-
}
|
|
283
|
-
get r() {
|
|
284
|
-
return this._r;
|
|
285
|
-
}
|
|
286
|
-
set r(v) {
|
|
287
|
-
this._r = v;
|
|
288
|
-
this._edited = true;
|
|
289
|
-
}
|
|
290
|
-
get g() {
|
|
291
|
-
return this._g;
|
|
292
|
-
}
|
|
293
|
-
set g(v) {
|
|
294
|
-
this._g = v;
|
|
295
|
-
this._edited = true;
|
|
296
|
-
}
|
|
297
|
-
get b() {
|
|
298
|
-
return this._b;
|
|
299
|
-
}
|
|
300
|
-
set b(v) {
|
|
301
|
-
this._b = v;
|
|
302
|
-
this._edited = true;
|
|
303
|
-
}
|
|
304
|
-
get a() {
|
|
305
|
-
return this._a;
|
|
306
|
-
}
|
|
307
|
-
set a(v) {
|
|
308
|
-
this._a = v;
|
|
309
|
-
this._edited = true;
|
|
310
|
-
}
|
|
311
|
-
toString() {
|
|
312
|
-
if (this._edited) {
|
|
313
|
-
let r = (this._r / 255).toFixed(3);
|
|
314
|
-
let g = (this._g / 255).toFixed(3);
|
|
315
|
-
let b = (this._b / 255).toFixed(3);
|
|
316
|
-
let a = (this._a / 255).toFixed(3);
|
|
317
|
-
this._css = `color(display-p3 ${r} ${g} ${b} / ${a})`;
|
|
318
|
-
this._edited = false;
|
|
319
|
-
}
|
|
320
|
-
return this._css;
|
|
321
|
-
}
|
|
322
|
-
};
|
package/src/q5-core.js
DELETED
|
@@ -1,321 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* q5.js
|
|
3
|
-
* @version 2.14
|
|
4
|
-
* @author quinton-ashley, Tezumie, and LingDong-
|
|
5
|
-
* @license LGPL-3.0
|
|
6
|
-
* @class Q5
|
|
7
|
-
*/
|
|
8
|
-
function Q5(scope, parent, renderer) {
|
|
9
|
-
let $ = this;
|
|
10
|
-
$._q5 = true;
|
|
11
|
-
$._parent = parent;
|
|
12
|
-
if (renderer == 'webgpu-fallback') {
|
|
13
|
-
$._webgpuFallback = true;
|
|
14
|
-
$._renderer = 'q2d';
|
|
15
|
-
} else {
|
|
16
|
-
$._renderer = renderer || Q5.render;
|
|
17
|
-
}
|
|
18
|
-
$._preloadCount = 0;
|
|
19
|
-
|
|
20
|
-
let autoLoaded = scope == 'auto';
|
|
21
|
-
scope ??= 'global';
|
|
22
|
-
if (scope == 'auto') {
|
|
23
|
-
if (!(window.setup || window.update || window.draw)) return;
|
|
24
|
-
scope = 'global';
|
|
25
|
-
}
|
|
26
|
-
$._scope = scope;
|
|
27
|
-
let globalScope;
|
|
28
|
-
if (scope == 'global') {
|
|
29
|
-
Q5._hasGlobal = $._isGlobal = true;
|
|
30
|
-
globalScope = Q5._esm ? globalThis : !Q5._server ? window : global;
|
|
31
|
-
}
|
|
32
|
-
|
|
33
|
-
let q = new Proxy($, {
|
|
34
|
-
set: (t, p, v) => {
|
|
35
|
-
$[p] = v;
|
|
36
|
-
if ($._isGlobal) globalScope[p] = v;
|
|
37
|
-
return true;
|
|
38
|
-
}
|
|
39
|
-
});
|
|
40
|
-
|
|
41
|
-
$.canvas = $.ctx = $.drawingContext = null;
|
|
42
|
-
$.pixels = [];
|
|
43
|
-
let looper = null;
|
|
44
|
-
|
|
45
|
-
$.frameCount = 0;
|
|
46
|
-
$.deltaTime = 16;
|
|
47
|
-
$._targetFrameRate = 0;
|
|
48
|
-
$._targetFrameDuration = 16.666666666666668;
|
|
49
|
-
$._frameRate = $._fps = 60;
|
|
50
|
-
$._loop = true;
|
|
51
|
-
$._hooks = {
|
|
52
|
-
postCanvas: [],
|
|
53
|
-
preRender: [],
|
|
54
|
-
postRender: []
|
|
55
|
-
};
|
|
56
|
-
|
|
57
|
-
let millisStart = 0;
|
|
58
|
-
$.millis = () => performance.now() - millisStart;
|
|
59
|
-
|
|
60
|
-
$.noCanvas = () => {
|
|
61
|
-
if ($.canvas?.remove) $.canvas.remove();
|
|
62
|
-
$.canvas = 0;
|
|
63
|
-
q.ctx = q.drawingContext = 0;
|
|
64
|
-
};
|
|
65
|
-
|
|
66
|
-
if (window) {
|
|
67
|
-
$.windowWidth = window.innerWidth;
|
|
68
|
-
$.windowHeight = window.innerHeight;
|
|
69
|
-
$.deviceOrientation = window.screen?.orientation?.type;
|
|
70
|
-
}
|
|
71
|
-
|
|
72
|
-
$._incrementPreload = () => q._preloadCount++;
|
|
73
|
-
$._decrementPreload = () => q._preloadCount--;
|
|
74
|
-
|
|
75
|
-
$._draw = (timestamp) => {
|
|
76
|
-
let ts = timestamp || performance.now();
|
|
77
|
-
$._lastFrameTime ??= ts - $._targetFrameDuration;
|
|
78
|
-
|
|
79
|
-
if ($._didResize) {
|
|
80
|
-
$.windowResized();
|
|
81
|
-
$._didResize = false;
|
|
82
|
-
}
|
|
83
|
-
|
|
84
|
-
if ($._loop) looper = raf($._draw);
|
|
85
|
-
else if ($.frameCount && !$._redraw) return;
|
|
86
|
-
|
|
87
|
-
if (looper && $.frameCount) {
|
|
88
|
-
let time_since_last = ts - $._lastFrameTime;
|
|
89
|
-
if (time_since_last < $._targetFrameDuration - 4) return;
|
|
90
|
-
}
|
|
91
|
-
q.deltaTime = ts - $._lastFrameTime;
|
|
92
|
-
$._frameRate = 1000 / $.deltaTime;
|
|
93
|
-
q.frameCount++;
|
|
94
|
-
let pre = performance.now();
|
|
95
|
-
$.resetMatrix();
|
|
96
|
-
if ($._beginRender) $._beginRender();
|
|
97
|
-
for (let m of Q5.methods.pre) m.call($);
|
|
98
|
-
try {
|
|
99
|
-
$.draw();
|
|
100
|
-
} catch (e) {
|
|
101
|
-
if (!Q5.disableFriendlyErrors && $._askAI) $._askAI(e);
|
|
102
|
-
if (!Q5.errorTolerant) $.noLoop();
|
|
103
|
-
throw e;
|
|
104
|
-
}
|
|
105
|
-
for (let m of Q5.methods.post) m.call($);
|
|
106
|
-
if ($._render) $._render();
|
|
107
|
-
if ($._finishRender) $._finishRender();
|
|
108
|
-
$.postProcess();
|
|
109
|
-
q.pmouseX = $.mouseX;
|
|
110
|
-
q.pmouseY = $.mouseY;
|
|
111
|
-
q.moveX = q.moveY = 0;
|
|
112
|
-
$._lastFrameTime = ts;
|
|
113
|
-
let post = performance.now();
|
|
114
|
-
$._fps = Math.round(1000 / (post - pre));
|
|
115
|
-
};
|
|
116
|
-
$.noLoop = () => {
|
|
117
|
-
$._loop = false;
|
|
118
|
-
looper = null;
|
|
119
|
-
};
|
|
120
|
-
$.loop = () => {
|
|
121
|
-
$._loop = true;
|
|
122
|
-
if ($._setupDone && looper == null) $._draw();
|
|
123
|
-
};
|
|
124
|
-
$.isLooping = () => $._loop;
|
|
125
|
-
$.redraw = (n = 1) => {
|
|
126
|
-
$._redraw = true;
|
|
127
|
-
for (let i = 0; i < n; i++) {
|
|
128
|
-
$._draw();
|
|
129
|
-
}
|
|
130
|
-
$._redraw = false;
|
|
131
|
-
};
|
|
132
|
-
$.remove = () => {
|
|
133
|
-
$.noLoop();
|
|
134
|
-
$.canvas.remove();
|
|
135
|
-
};
|
|
136
|
-
|
|
137
|
-
$.frameRate = (hz) => {
|
|
138
|
-
if (hz) {
|
|
139
|
-
$._targetFrameRate = hz;
|
|
140
|
-
$._targetFrameDuration = 1000 / hz;
|
|
141
|
-
}
|
|
142
|
-
return $._frameRate;
|
|
143
|
-
};
|
|
144
|
-
$.getTargetFrameRate = () => $._targetFrameRate || 60;
|
|
145
|
-
$.getFPS = () => $._fps;
|
|
146
|
-
|
|
147
|
-
// shims for compatibility with p5.js libraries
|
|
148
|
-
$.Element = function (a) {
|
|
149
|
-
this.elt = a;
|
|
150
|
-
};
|
|
151
|
-
$._elements = [];
|
|
152
|
-
$.describe = () => {};
|
|
153
|
-
|
|
154
|
-
$.TWO_PI = $.TAU = Math.PI * 2;
|
|
155
|
-
|
|
156
|
-
$.log = $.print = console.log;
|
|
157
|
-
|
|
158
|
-
for (let m in Q5.modules) {
|
|
159
|
-
Q5.modules[m]($, q);
|
|
160
|
-
}
|
|
161
|
-
|
|
162
|
-
let r = Q5.renderers[$._renderer];
|
|
163
|
-
for (let m in r) {
|
|
164
|
-
r[m]($, q);
|
|
165
|
-
}
|
|
166
|
-
|
|
167
|
-
// INIT
|
|
168
|
-
|
|
169
|
-
for (let k in Q5) {
|
|
170
|
-
if (k[1] != '_' && k[1] == k[1].toUpperCase()) {
|
|
171
|
-
$[k] = Q5[k];
|
|
172
|
-
}
|
|
173
|
-
}
|
|
174
|
-
|
|
175
|
-
if (scope == 'graphics') return;
|
|
176
|
-
|
|
177
|
-
if (scope == 'global') {
|
|
178
|
-
Object.assign(Q5, $);
|
|
179
|
-
delete Q5.Q5;
|
|
180
|
-
}
|
|
181
|
-
|
|
182
|
-
if ($._webgpuFallback) $.colorMode('rgb', 1);
|
|
183
|
-
|
|
184
|
-
for (let m of Q5.methods.init) {
|
|
185
|
-
m.call($);
|
|
186
|
-
}
|
|
187
|
-
|
|
188
|
-
for (let [n, fn] of Object.entries(Q5.prototype)) {
|
|
189
|
-
if (n[0] != '_' && typeof $[n] == 'function') $[n] = fn.bind($);
|
|
190
|
-
}
|
|
191
|
-
|
|
192
|
-
if (scope == 'global') {
|
|
193
|
-
let props = Object.getOwnPropertyNames($);
|
|
194
|
-
for (let p of props) {
|
|
195
|
-
if (p[0] != '_') globalScope[p] = $[p];
|
|
196
|
-
}
|
|
197
|
-
}
|
|
198
|
-
|
|
199
|
-
if (typeof scope == 'function') scope($);
|
|
200
|
-
|
|
201
|
-
Q5._instanceCount++;
|
|
202
|
-
|
|
203
|
-
let raf =
|
|
204
|
-
window.requestAnimationFrame ||
|
|
205
|
-
function (cb) {
|
|
206
|
-
const idealFrameTime = $._lastFrameTime + $._targetFrameDuration;
|
|
207
|
-
return setTimeout(() => {
|
|
208
|
-
cb(idealFrameTime);
|
|
209
|
-
}, idealFrameTime - performance.now());
|
|
210
|
-
};
|
|
211
|
-
|
|
212
|
-
let t = globalScope || $;
|
|
213
|
-
$._isTouchAware = t.touchStarted || t.touchMoved || t.mouseReleased;
|
|
214
|
-
|
|
215
|
-
if ($._isGlobal) {
|
|
216
|
-
$.preload = t.preload;
|
|
217
|
-
$.setup = t.setup;
|
|
218
|
-
$.draw = t.draw;
|
|
219
|
-
$.postProcess = t.postProcess;
|
|
220
|
-
}
|
|
221
|
-
$.preload ??= () => {};
|
|
222
|
-
$.setup ??= () => {};
|
|
223
|
-
$.draw ??= () => {};
|
|
224
|
-
$.postProcess ??= () => {};
|
|
225
|
-
|
|
226
|
-
let userFns = [
|
|
227
|
-
'mouseMoved',
|
|
228
|
-
'mousePressed',
|
|
229
|
-
'mouseReleased',
|
|
230
|
-
'mouseDragged',
|
|
231
|
-
'mouseClicked',
|
|
232
|
-
'mouseWheel',
|
|
233
|
-
'keyPressed',
|
|
234
|
-
'keyReleased',
|
|
235
|
-
'keyTyped',
|
|
236
|
-
'touchStarted',
|
|
237
|
-
'touchMoved',
|
|
238
|
-
'touchEnded',
|
|
239
|
-
'windowResized'
|
|
240
|
-
];
|
|
241
|
-
for (let k of userFns) {
|
|
242
|
-
if (!t[k]) $[k] = () => {};
|
|
243
|
-
else if ($._isGlobal) {
|
|
244
|
-
$[k] = (event) => {
|
|
245
|
-
try {
|
|
246
|
-
return t[k](event);
|
|
247
|
-
} catch (e) {
|
|
248
|
-
if ($._askAI) $._askAI(e);
|
|
249
|
-
throw e;
|
|
250
|
-
}
|
|
251
|
-
};
|
|
252
|
-
}
|
|
253
|
-
}
|
|
254
|
-
|
|
255
|
-
async function _setup() {
|
|
256
|
-
$._startDone = true;
|
|
257
|
-
if ($._preloadCount > 0) return raf(_setup);
|
|
258
|
-
millisStart = performance.now();
|
|
259
|
-
await $.setup();
|
|
260
|
-
$._setupDone = true;
|
|
261
|
-
if ($.frameCount) return;
|
|
262
|
-
if ($.ctx === null) $.createCanvas(200, 200);
|
|
263
|
-
raf($._draw);
|
|
264
|
-
}
|
|
265
|
-
|
|
266
|
-
function _start() {
|
|
267
|
-
try {
|
|
268
|
-
$.preload();
|
|
269
|
-
if (!$._startDone) _setup();
|
|
270
|
-
} catch (e) {
|
|
271
|
-
if ($._askAI) $._askAI(e);
|
|
272
|
-
throw e;
|
|
273
|
-
}
|
|
274
|
-
}
|
|
275
|
-
|
|
276
|
-
if (autoLoaded) _start();
|
|
277
|
-
else setTimeout(_start, 32);
|
|
278
|
-
}
|
|
279
|
-
|
|
280
|
-
Q5.render = 'q2d';
|
|
281
|
-
|
|
282
|
-
Q5.renderers = {};
|
|
283
|
-
Q5.modules = {};
|
|
284
|
-
|
|
285
|
-
Q5._server = typeof process == 'object';
|
|
286
|
-
Q5._esm = this === undefined;
|
|
287
|
-
|
|
288
|
-
Q5._instanceCount = 0;
|
|
289
|
-
Q5._friendlyError = (msg, func) => {
|
|
290
|
-
if (!Q5.disableFriendlyErrors) console.error(func + ': ' + msg);
|
|
291
|
-
};
|
|
292
|
-
Q5._validateParameters = () => true;
|
|
293
|
-
|
|
294
|
-
Q5.methods = {
|
|
295
|
-
init: [],
|
|
296
|
-
pre: [],
|
|
297
|
-
post: [],
|
|
298
|
-
remove: []
|
|
299
|
-
};
|
|
300
|
-
Q5.prototype.registerMethod = (m, fn) => Q5.methods[m].push(fn);
|
|
301
|
-
Q5.prototype.registerPreloadMethod = (n, fn) => (Q5.prototype[n] = fn[n]);
|
|
302
|
-
|
|
303
|
-
if (Q5._server) global.p5 ??= global.Q5 = Q5;
|
|
304
|
-
|
|
305
|
-
if (typeof window == 'object') window.p5 ??= window.Q5 = Q5;
|
|
306
|
-
else global.window = 0;
|
|
307
|
-
|
|
308
|
-
function createCanvas(w, h, opt) {
|
|
309
|
-
if (!Q5._hasGlobal) {
|
|
310
|
-
let q = new Q5();
|
|
311
|
-
q.createCanvas(w, h, opt);
|
|
312
|
-
}
|
|
313
|
-
}
|
|
314
|
-
|
|
315
|
-
Q5.version = Q5.VERSION = '2.14';
|
|
316
|
-
|
|
317
|
-
if (typeof document == 'object') {
|
|
318
|
-
document.addEventListener('DOMContentLoaded', () => {
|
|
319
|
-
if (!Q5._hasGlobal) new Q5('auto');
|
|
320
|
-
});
|
|
321
|
-
}
|