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/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
- }