q5 2.9.21 → 2.9.22

package/src/q5-2d-text.js

@@ -36,6 +36,7 @@ Q5.renderers.q2d.text = ($, q) => {
 		fontMod = true;
 		styleHash = -1;
 	};
+
 	$.textSize = (x) => {
 		if (x == undefined || x == $._textSize) return $._textSize;
 		if ($._da) x *= $._da;
@@ -47,12 +48,14 @@ Q5.renderers.q2d.text = ($, q) => {
 			leadDiff = leading - x;
 		}
 	};
+
 	$.textStyle = (x) => {
 		if (!x || x == emphasis) return emphasis;
 		emphasis = x;
 		fontMod = true;
 		styleHash = -1;
 	};
+
 	$.textLeading = (x) => {
 		leadingSet = true;
 		if (x == undefined || x == leading) return leading;
@@ -61,6 +64,7 @@ Q5.renderers.q2d.text = ($, q) => {
 		leadDiff = x - $._textSize;
 		styleHash = -1;
 	};
+
 	$.textAlign = (horiz, vert) => {
 		$.ctx.textAlign = $._textAlign = horiz;
 		if (vert) {
@@ -90,6 +94,7 @@ Q5.renderers.q2d.text = ($, q) => {
 		if (enable !== undefined) useCache = enable;
 		return useCache;
 	};
+
 	$.createTextImage = (str, w, h) => {
 		genTextImage = true;
 		img = $.text(str, 0, 0, w, h);
@@ -98,6 +103,7 @@ Q5.renderers.q2d.text = ($, q) => {
 	};
 
 	let lines = [];
+
 	$.text = (str, x, y, w, h) => {
 		if (str === undefined || (!$._doFill && !$._doStroke)) return;
 		str = str.toString();
@@ -223,6 +229,7 @@ Q5.renderers.q2d.text = ($, q) => {
 			$.textImage(img, x, y);
 		}
 	};
+
 	$.textImage = (img, x, y) => {
 		if (typeof img == 'string') img = $.createTextImage(img);
 

package/src/q5-canvas.js

@@ -146,7 +146,7 @@ Q5.modules.canvas = ($, q) => {
 		return g;
 	};
 
-	$._save = async (data, name, ext) => {
+	async function saveFile(data, name, ext) {
 		name = name || 'untitled';
 		ext = ext || 'png';
 		if (ext == 'jpg' || ext == 'png' || ext == 'webp') {
@@ -174,18 +174,19 @@ Q5.modules.canvas = ($, q) => {
 		a.download = name + '.' + ext;
 		a.click();
 		URL.revokeObjectURL(a.href);
-	};
+	}
+
 	$.save = (a, b, c) => {
 		if (!a || (typeof a == 'string' && (!b || (!c && b.length < 5)))) {
 			c = b;
 			b = a;
 			a = $.canvas;
 		}
-		if (c) return $._save(a, b, c);
+		if (c) return saveFile(a, b, c);
 		if (b) {
 			b = b.split('.');
-			$._save(a, b[0], b.at(-1));
-		} else $._save(a);
+			saveFile(a, b[0], b.at(-1));
+		} else saveFile(a);
 	};
 
 	$._setCanvasSize = (w, h) => {

package/src/q5-color.js

@@ -146,6 +146,7 @@ Q5.Color = class {
 		this._q5Color = true;
 	}
 };
+
 Q5.ColorOKLCH = class extends Q5.Color {
 	constructor(l, c, h, a) {
 		super();
@@ -158,6 +159,7 @@ Q5.ColorOKLCH = class extends Q5.Color {
 		return `oklch(${this.l} ${this.c} ${this.h} / ${this.a})`;
 	}
 };
+
 Q5.ColorRGBA = class extends Q5.Color {
 	constructor(r, g, b, a) {
 		super();
@@ -173,11 +175,13 @@ Q5.ColorRGBA = class extends Q5.Color {
 		return `color(srgb ${this.r} ${this.g} ${this.b} / ${this.a})`;
 	}
 };
+
 Q5.ColorRGBA_P3 = class extends Q5.ColorRGBA {
 	toString() {
 		return `color(display-p3 ${this.r} ${this.g} ${this.b} / ${this.a})`;
 	}
 };
+
 // legacy 8-bit (0-255) integer color format
 Q5.ColorRGBA_8 = class extends Q5.ColorRGBA {
 	constructor(r, g, b, a) {
@@ -202,6 +206,7 @@ Q5.ColorRGBA_8 = class extends Q5.ColorRGBA {
 		return `rgb(${this.r} ${this.g} ${this.b} / ${this.a / 255})`;
 	}
 };
+
 // p3 10-bit color in integer color format, for backwards compatibility
 Q5.ColorRGBA_P3_8 = class extends Q5.ColorRGBA {
 	constructor(r, g, b, a) {

package/src/q5-input.js

@@ -59,6 +59,7 @@ Q5.modules.input = ($, q) => {
 		q.moveX = e.movementX;
 		q.moveY = e.movementY;
 	};
+
 	$._onmousedown = (e) => {
 		$._startAudio();
 		$._updateMouse(e);
@@ -66,22 +67,26 @@ Q5.modules.input = ($, q) => {
 		q.mouseButton = mouseBtns[e.button];
 		$.mousePressed(e);
 	};
+
 	$._onmousemove = (e) => {
 		$._updateMouse(e);
 		if ($.mouseIsPressed) $.mouseDragged(e);
 		else $.mouseMoved(e);
 	};
+
 	$._onmouseup = (e) => {
 		$._updateMouse(e);
 		q.mouseIsPressed = false;
 		$.mouseReleased(e);
 	};
+
 	$._onclick = (e) => {
 		$._updateMouse(e);
 		q.mouseIsPressed = true;
 		$.mouseClicked(e);
 		q.mouseIsPressed = false;
 	};
+
 	$._onwheel = (e) => {
 		$._updateMouse(e);
 		e.delta = e.deltaY;
@@ -99,9 +104,11 @@ Q5.modules.input = ($, q) => {
 		}
 		$.canvas.style.cursor = name + pfx;
 	};
+
 	$.noCursor = () => {
 		$.canvas.style.cursor = 'none';
 	};
+
 	if (window) {
 		$.requestPointerLock = document.body?.requestPointerLock;
 		$.exitPointerLock = document.exitPointerLock;
@@ -117,6 +124,7 @@ Q5.modules.input = ($, q) => {
 		$.keyPressed(e);
 		if (e.key.length == 1) $.keyTyped(e);
 	};
+
 	$._onkeyup = (e) => {
 		q.keyIsPressed = false;
 		q.key = e.key;
@@ -124,6 +132,7 @@ Q5.modules.input = ($, q) => {
 		keysHeld[$.keyCode] = keysHeld[$.key.toLowerCase()] = false;
 		$.keyReleased(e);
 	};
+
 	$.keyIsDown = (v) => !!keysHeld[typeof v == 'string' ? v.toLowerCase() : v];
 
 	function getTouchInfo(touch) {
@@ -136,6 +145,7 @@ Q5.modules.input = ($, q) => {
 			id: touch.identifier
 		};
 	}
+
 	$._ontouchstart = (e) => {
 		$._startAudio();
 		q.touches = [...e.touches].map(getTouchInfo);
@@ -148,6 +158,7 @@ Q5.modules.input = ($, q) => {
 		}
 		if (!$.touchStarted(e)) e.preventDefault();
 	};
+
 	$._ontouchmove = (e) => {
 		q.touches = [...e.touches].map(getTouchInfo);
 		if (!$._isTouchAware) {
@@ -157,6 +168,7 @@ Q5.modules.input = ($, q) => {
 		}
 		if (!$.touchMoved(e)) e.preventDefault();
 	};
+
 	$._ontouchend = (e) => {
 		q.touches = [...e.touches].map(getTouchInfo);
 		if (!$._isTouchAware && !$.touches.length) {

package/src/q5-math.js

@@ -42,13 +42,15 @@ Q5.modules.math = ($, q) => {
 			return Math.min(Math.max(val, ostop), ostart);
 		}
 	};
-	$.lerp = (a, b, t) => a * (1 - t) + b * t;
-	$.constrain = (x, lo, hi) => Math.min(Math.max(x, lo), hi);
+
 	$.dist = function () {
 		let a = arguments;
 		if (a.length == 4) return Math.hypot(a[0] - a[2], a[1] - a[3]);
 		else return Math.hypot(a[0] - a[3], a[1] - a[4], a[2] - a[5]);
 	};
+
+	$.lerp = (a, b, t) => a * (1 - t) + b * t;
+	$.constrain = (x, lo, hi) => Math.min(Math.max(x, lo), hi);
 	$.norm = (value, start, stop) => $.map(value, start, stop, 0, 1);
 	$.sq = (x) => x * x;
 	$.fract = (x) => x - Math.floor(x);
@@ -69,7 +71,6 @@ Q5.modules.math = ($, q) => {
 		let a = Math.atan(x);
 		return !angleMode ? a : a * RADTODEG;
 	};
-
 	$.atan2 = (y, x) => {
 		let a = Math.atan2(y, x);
 		return !angleMode ? a : a * RADTODEG;
@@ -93,6 +94,7 @@ Q5.modules.math = ($, q) => {
 			}
 		};
 	}
+
 	function shr3() {
 		let jsr, seed;
 		let m = 4294967295;
@@ -111,6 +113,7 @@ Q5.modules.math = ($, q) => {
 			}
 		};
 	}
+
 	let rng1 = shr3();
 	rng1.setSeed();
 
@@ -127,6 +130,7 @@ Q5.modules.math = ($, q) => {
 			return a[Math.trunc(a.length * rng1.rand())];
 		}
 	};
+
 	$.randomGenerator = (method) => {
 		if (method == $.LCG) rng1 = lcg();
 		else if (method == $.SHR3) rng1 = shr3();
@@ -282,13 +286,16 @@ Q5.modules.math = ($, q) => {
 		q.Noise = Q5[mode[0].toUpperCase() + mode.slice(1) + 'Noise'];
 		_noise = null;
 	};
+
 	$.noiseSeed = (seed) => {
 		_noise = new $.Noise(seed);
 	};
+
 	$.noise = (x = 0, y = 0, z = 0) => {
 		_noise ??= new $.Noise();
 		return _noise.noise(x, y, z);
 	};
+
 	$.noiseDetail = (lod, falloff) => {
 		_noise ??= new $.Noise();
 		if (lod > 0) _noise.octaves = lod;

package/src/q5-record.js

@@ -0,0 +1,2 @@
+/* help wanted! */
+Q5.modules.record = ($) => {};

package/src/q5-vector.js

@@ -11,15 +11,18 @@ Q5.Vector = class {
 		this._cn = null;
 		this._cnsq = null;
 	}
+
 	set(x, y, z) {
 		this.x = x?.x || x || 0;
 		this.y = x?.y || y || 0;
 		this.z = x?.z || z || 0;
 		return this;
 	}
+
 	copy() {
 		return new Q5.Vector(this.x, this.y, this.z);
 	}
+
 	_arg2v(x, y, z) {
 		if (x?.x !== undefined) return x;
 		if (y !== undefined) {
@@ -27,10 +30,12 @@ Q5.Vector = class {
 		}
 		return { x: x, y: x, z: x };
 	}
+
 	_calcNorm() {
 		this._cnsq = this.x * this.x + this.y * this.y + this.z * this.z;
 		this._cn = Math.sqrt(this._cnsq);
 	}
+
 	add() {
 		let u = this._arg2v(...arguments);
 		this.x += u.x;
@@ -38,6 +43,7 @@ Q5.Vector = class {
 		this.z += u.z;
 		return this;
 	}
+
 	rem() {
 		let u = this._arg2v(...arguments);
 		this.x %= u.x;
@@ -45,6 +51,7 @@ Q5.Vector = class {
 		this.z %= u.z;
 		return this;
 	}
+
 	sub() {
 		let u = this._arg2v(...arguments);
 		this.x -= u.x;
@@ -52,6 +59,7 @@ Q5.Vector = class {
 		this.z -= u.z;
 		return this;
 	}
+
 	mult() {
 		let u = this._arg2v(...arguments);
 		this.x *= u.x;
@@ -59,6 +67,7 @@ Q5.Vector = class {
 		this.z *= u.z;
 		return this;
 	}
+
 	div() {
 		let u = this._arg2v(...arguments);
 		if (u.x) this.x /= u.x;
@@ -69,18 +78,22 @@ Q5.Vector = class {
 		else this.z = 0;
 		return this;
 	}
+
 	mag() {
 		this._calcNorm();
 		return this._cn;
 	}
+
 	magSq() {
 		this._calcNorm();
 		return this._cnsq;
 	}
+
 	dot() {
 		let u = this._arg2v(...arguments);
 		return this.x * u.x + this.y * u.y + this.z * u.z;
 	}
+
 	dist() {
 		let u = this._arg2v(...arguments);
 		let x = this.x - u.x;
@@ -88,6 +101,7 @@ Q5.Vector = class {
 		let z = this.z - u.z;
 		return Math.sqrt(x * x + y * y + z * z);
 	}
+
 	cross() {
 		let u = this._arg2v(...arguments);
 		let x = this.y * u.z - this.z * u.y;
@@ -98,6 +112,7 @@ Q5.Vector = class {
 		this.z = z;
 		return this;
 	}
+
 	normalize() {
 		this._calcNorm();
 		let n = this._cn;
@@ -110,6 +125,7 @@ Q5.Vector = class {
 		this._cnsq = 1;
 		return this;
 	}
+
 	limit(m) {
 		this._calcNorm();
 		let n = this._cn;
@@ -123,6 +139,7 @@ Q5.Vector = class {
 		}
 		return this;
 	}
+
 	setMag(m) {
 		this._calcNorm();
 		let n = this._cn;
@@ -134,15 +151,18 @@ Q5.Vector = class {
 		this._cnsq = m * m;
 		return this;
 	}
+
 	heading() {
 		return this._$.atan2(this.y, this.x);
 	}
+
 	setHeading(ang) {
 		let mag = this.mag();
 		this.x = mag * this._$.cos(ang);
 		this.y = mag * this._$.sin(ang);
 		return this;
 	}
+
 	rotate(ang) {
 		let costh = this._$.cos(ang);
 		let sinth = this._$.sin(ang);
@@ -152,12 +172,14 @@ Q5.Vector = class {
 		this.y = vy;
 		return this;
 	}
+
 	angleBetween() {
 		let u = this._arg2v(...arguments);
 		let o = Q5.Vector.cross(this, u);
 		let ang = this._$.atan2(o.mag(), this.dot(u));
 		return ang * Math.sign(o.z || 1);
 	}
+
 	lerp() {
 		let args = [...arguments];
 		let amt = args.at(-1);
@@ -168,6 +190,7 @@ Q5.Vector = class {
 		this.z += (u.z - this.z) * amt;
 		return this;
 	}
+
 	slerp() {
 		let args = [...arguments];
 		let amt = args.at(-1);
@@ -206,17 +229,21 @@ Q5.Vector = class {
 		this.z = this.z * cosMultiplier + ey.z * sinMultiplier;
 		return this;
 	}
+
 	reflect(n) {
 		n.normalize();
 		return this.sub(n.mult(2 * this.dot(n)));
 	}
+
 	array() {
 		return [this.x, this.y, this.z];
 	}
+
 	equals(u, epsilon) {
 		epsilon ??= Number.EPSILON || 0;
 		return Math.abs(u.x - this.x) < epsilon && Math.abs(u.y - this.y) < epsilon && Math.abs(u.z - this.z) < epsilon;
 	}
+
 	fromAngle(th, l) {
 		if (l === undefined) l = 1;
 		this._cn = l;
@@ -226,6 +253,7 @@ Q5.Vector = class {
 		this.z = 0;
 		return this;
 	}
+
 	fromAngles(th, ph, l) {
 		if (l === undefined) l = 1;
 		this._cn = l;
@@ -239,18 +267,22 @@ Q5.Vector = class {
 		this.z = l * sinth * cosph;
 		return this;
 	}
+
 	random2D() {
 		this._cn = this._cnsq = 1;
 		return this.fromAngle(Math.random() * Math.PI * 2);
 	}
+
 	random3D() {
 		this._cn = this._cnsq = 1;
 		return this.fromAngles(Math.random() * Math.PI * 2, Math.random() * Math.PI * 2);
 	}
+
 	toString() {
 		return `[${this.x}, ${this.y}, ${this.z}]`;
 	}
 };
+
 Q5.Vector.add = (v, u) => v.copy().add(u);
 Q5.Vector.cross = (v, u) => v.copy().cross(u);
 Q5.Vector.dist = (v, u) => Math.hypot(v.x - u.x, v.y - u.y, v.z - u.z);
@@ -267,6 +299,7 @@ Q5.Vector.mult = (v, u) => v.copy().mult(u);
 Q5.Vector.normalize = (v) => v.copy().normalize();
 Q5.Vector.rem = (v, u) => v.copy().rem(u);
 Q5.Vector.sub = (v, u) => v.copy().sub(u);
+
 for (let k of ['fromAngle', 'fromAngles', 'random2D', 'random3D']) {
 	Q5.Vector[k] = (u, v, t) => new Q5.Vector()[k](u, v, t);
 }

package/src/q5-webgpu-canvas.js

@@ -314,6 +314,7 @@ Q5.renderers.webgpu.canvas = ($, q) => {
 		if ($._matrixDirty) $._saveMatrix();
 		$._transformIndexStack.push($._transformIndex);
 	};
+
 	$.popMatrix = () => {
 		if (!$._transformIndexStack.length) {
 			return console.warn('Matrix index stack is empty!');
@@ -329,6 +330,7 @@ Q5.renderers.webgpu.canvas = ($, q) => {
 		$.pushMatrix();
 		$.pushStyles();
 	};
+
 	$.pop = () => {
 		$.popMatrix();
 		$.popStyles();
@@ -410,6 +412,7 @@ Q5.renderers.webgpu.canvas = ($, q) => {
 	}
 
 	$._blendMode = 'normal';
+
 	$.blendMode = (mode) => {
 		if (mode == $._blendMode) return;
 		if (mode == 'source-over') mode = 'normal';

package/src/q5-webgpu-text.js

@@ -114,6 +114,7 @@ fn fragmentMain(input : VertexOutput) -> @location(0) vec4f {
 		mipmapFilter: 'linear',
 		maxAnisotropy: 16
 	});
+
 	let fontBindGroupLayout = Q5.device.createBindGroupLayout({
 		label: 'MSDF font group layout',
 		entries: [
@@ -151,6 +152,7 @@ fn fragmentMain(input : VertexOutput) -> @location(0) vec4f {
 		primitive: { topology: 'triangle-strip', stripIndexFormat: 'uint32' },
 		multisample: { count: 4 }
 	};
+
 	$._pipelines[2] = Q5.device.createRenderPipeline($._pipelineConfigs[2]);
 
 	class MsdfFont {
@@ -299,6 +301,7 @@ fn fragmentMain(input : VertexOutput) -> @location(0) vec4f {
 	$.textFont = (fontName) => {
 		$._font = fonts[fontName];
 	};
+
 	$.textSize = (size) => {
 		$._textSize = size;
 		if (!leadingSet) {
@@ -306,12 +309,14 @@ fn fragmentMain(input : VertexOutput) -> @location(0) vec4f {
 			leadDiff = leading - size;
 		}
 	};
+
 	$.textLeading = (lineHeight) => {
 		$._font.lineHeight = leading = lineHeight;
 		leadDiff = leading - $._textSize;
 		leadPercent = leading / $._textSize;
 		leadingSet = true;
 	};
+
 	$.textAlign = (horiz, vert) => {
 		$._textAlign = horiz;
 		if (vert) $._textBaseline = vert;