q5play 4.0.6 → 4.0.8

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "q5play",
-	"version": "4.0.6",
+	"version": "4.0.8",
 	"author": "quinton-ashley",
 	"license": "SEE LICENSE IN LICENSE.md",
 	"description": "A web-based game engine that uses q5.js WebGPU for graphics and Box2D v3 WASM for physics.",

package/q5play.d.ts

@@ -70,6 +70,14 @@ declare global {
 		 * @default false
 		 */
 		renderStats: boolean;
+		/**
+		 * Runs automatically before each draw function call.
+		 */
+		update(): void;
+		/**
+		 * Runs automatically after each draw function call.
+		 */
+		postDraw(): void;
 	}
 	const q5play: Q5Play;
 

package/q5play.js

@@ -248,6 +248,9 @@ async function q5playPreSetup(q) {
 			this.os = {};
 			this.context = 'web';
 
+			this.update = () => q5playUpdate.call($, q);
+			this.postdraw = () => q5playPostDraw.call($, q);
+
 			if (window.matchMedia) {
 				this.hasMouse = window.matchMedia('(any-hover: none)').matches ? false : true;
 			} else this.hasMouse = true;
@@ -331,7 +334,8 @@ async function q5playPreSetup(q) {
 
 	// in q5play the default angle mode is degrees
 	const DEGREES = $.DEGREES,
-		DEGTORAD = Math.PI / 180;
+		DEGTORAD = Math.PI / 180,
+		RADTODEG = 180 / Math.PI;
 	$.angleMode(DEGREES);
 
 	// in q5play the default color mode is float RGB
@@ -1001,6 +1005,7 @@ async function q5playPreSetup(q) {
 			if (!group.visualOnly) {
 				const def = new b2DefaultBodyDef();
 				def.type = bodyTypes[this._phys];
+				def.allowFastRotation = true;
 				this.bdID = b2CreateBody(wID, def);
 				this._physicsEnabled = true;
 
@@ -5345,6 +5350,7 @@ async function q5playPreSetup(q) {
 			this.type = type ??= 'glue';
 			this.visible = true;
 			this.deleted = false;
+			this._springiness = 0;
 
 			if (!a._shapes.length) a.addDefaultSensors();
 			if (!b._shapes.length) b.addDefaultSensors();
@@ -5533,6 +5539,7 @@ async function q5playPreSetup(q) {
 
 		_springMap(val) {
 			if (val > 0) {
+				this._springiness = val;
 				if (val < 0.1) {
 					val = $.map(val, 0, 0.1, 30, 4);
 				} else if (val < 0.5) {
@@ -5569,7 +5576,7 @@ async function q5playPreSetup(q) {
 		}
 
 		get springiness() {
-			return Box2D.b2WeldJoint_GetLinearHertz(this.jID);
+			return this._springiness;
 		}
 		set springiness(val) {
 			val = this._springMap(val);
@@ -5645,7 +5652,7 @@ async function q5playPreSetup(q) {
 		}
 
 		get springiness() {
-			return Box2D.b2DistanceJoint_GetSpringHertz(this.jID);
+			return this._springiness;
 		}
 		set springiness(val) {
 			val = this._springMap(val);
@@ -5689,15 +5696,20 @@ async function q5playPreSetup(q) {
 		constructor(spriteA, spriteB) {
 			super(spriteA, spriteB, 'wheel');
 
+			this._angle = $._angleMode == DEGREES ? 90 : Math.PI / 2;
+			this._motorEnabled = false;
+
 			let j = this._init(b2DefaultWheelJointDef(wID));
 			j.enableSpring = true;
 			j.hertz = 4;
 			j.dampingRatio = 0.7;
-			j.enableMotor = true;
+			j.enableMotor = false; // neutral by default
 			j.maxMotorTorque = 1000;
 
 			this.jID = b2CreateWheelJoint(wID, j);
 			jointDict[this.jID.index1] = this;
+
+			this._springiness = 0.1;
 		}
 
 		_init(j) {
@@ -5707,11 +5719,12 @@ async function q5playPreSetup(q) {
 			j.base.bodyIdA = a.bdID;
 			j.base.bodyIdB = b.bdID;
 
-			j.base.localFrameB.p = b2Body_GetLocalPoint(b.bdID, scaleTo(a.x, a.y));
+			let rad = this._angle;
+			if ($._angleMode == DEGREES) rad *= DEGTORAD;
+			j.base.localFrameA.q.SetAngle(rad);
 
-			// let qA = b2Body_GetRotation(a.bdID);
-			// let qB = b2Body_GetRotation(b.bdID);
-			// j.base.localFrameA.q = b2InvMulRot(qA, qB);
+			let pivot = scaleTo(b.x, b.y);
+			j.base.localFrameA.p = b2Body_GetLocalPoint(a.bdID, pivot);
 
 			return j;
 		}
@@ -5724,9 +5737,12 @@ async function q5playPreSetup(q) {
 		set angle(val) {
 			if (val == this._angle) return;
 			this._angle = val;
-			this._j.m_localXAxisA = new b2Vec2($.cos(val), $.sin(val));
-			this._j.m_localXAxisA.normalize();
-			this._j.m_localYAxisA = b2Vec2.crossNumVec2(1.0, this._j.m_localXAxisA);
+			let rad = $._angleMode == DEGREES ? val * DEGTORAD : val;
+
+			let t = b2Joint_GetLocalFrameA(this.jID);
+			t.q.SetAngle(rad);
+			b2Joint_SetLocalFrameA(this.jID, t);
+			b2Joint_WakeBodies(this.jID);
 		}
 
 		get springEnabled() {
@@ -5737,7 +5753,7 @@ async function q5playPreSetup(q) {
 		}
 
 		get springiness() {
-			return Box2D.b2WheelJoint_GetSpringHertz(this.jID);
+			return this._springiness;
 		}
 		set springiness(val) {
 			val = this._springMap(val);
@@ -5775,13 +5791,16 @@ async function q5playPreSetup(q) {
 		}
 		set motorEnabled(val) {
 			Box2D.b2WheelJoint_EnableMotor(this.jID, val);
+			this._motorEnabled = val;
 		}
 
 		get maxPower() {
 			return Box2D.b2WheelJoint_GetMaxMotorTorque(this.jID);
 		}
 		set maxPower(val) {
+			if (val > 0 && !this._motorEnabled) this.motorEnabled = true;
 			Box2D.b2WheelJoint_SetMaxMotorTorque(this.jID, val);
+			b2Joint_WakeBodies(this.jID);
 		}
 
 		get power() {
@@ -5789,10 +5808,14 @@ async function q5playPreSetup(q) {
 		}
 
 		get speed() {
+			// if in neutral, return the wheel's angular velocity
+			if (!this._motorEnabled) return this.spriteB.rotationSpeed;
 			return Box2D.b2WheelJoint_GetMotorSpeed(this.jID);
 		}
 		set speed(val) {
+			if (!this._motorEnabled) this.motorEnabled = true;
 			Box2D.b2WheelJoint_SetMotorSpeed(this.jID, val);
+			b2Joint_WakeBodies(this.jID);
 		}
 	};
 
@@ -5820,7 +5843,7 @@ async function q5playPreSetup(q) {
 		}
 
 		get springiness() {
-			return Box2D.b2RevoluteJoint_GetSpringHertz(this.jID);
+			return this._springiness;
 		}
 		set springiness(val) {
 			val = this._springMap(val);
@@ -5860,8 +5883,8 @@ async function q5playPreSetup(q) {
 				max = val[1];
 			}
 			if ($._angleMode == DEGREES) {
-				min *= $._RADTODEG;
-				max *= $._RADTODEG;
+				min *= DEGTORAD;
+				max *= DEGTORAD;
 			}
 			Box2D.b2RevoluteJoint_SetLimits(this.jID, min, max);
 		}
@@ -5890,8 +5913,6 @@ async function q5playPreSetup(q) {
 		set maxPower(val) {
 			Box2D.b2RevoluteJoint_SetMaxMotorTorque(this.jID, val);
 		}
-
-		_display() {}
 	};
 
 	$.SliderJoint = class extends $.Joint {
@@ -5899,17 +5920,39 @@ async function q5playPreSetup(q) {
 			super(spriteA, spriteB, 'slider');
 
 			let j = this._init(b2DefaultPrismaticJointDef());
-			j.enableLimit = true;
-			j.lowerTranslation = -1;
-			j.upperTranslation = 1;
+			j.enableLimit = false;
 			j.enableMotor = true;
-			j.maxMotorForce = 50;
+			j.maxMotorForce = 10;
 			j.motorSpeed = 0;
 
 			this.jID = b2CreatePrismaticJoint(wID, j);
 			jointDict[this.jID.index1] = this;
 		}
 
+		_init(j) {
+			let a = this.spriteA,
+				b = this.spriteB;
+
+			j.base.bodyIdA = a.bdID;
+			j.base.bodyIdB = b.bdID;
+
+			// set the anchor at sprite A's position in B's local frame
+			j.base.localFrameB.p = b2Body_GetLocalPoint(b.bdID, scaleTo(a.x, a.y));
+
+			// align the slide axis with the vector from A to B
+			let dx = b.x - a.x;
+			let dy = b.y - a.y;
+			let len = Math.sqrt(dx * dx + dy * dy);
+			let angle = len > 0 ? Math.atan2(dy, dx) : 0;
+
+			let qA = b2Body_GetRotation(a.bdID);
+			let qB = b2Body_GetRotation(b.bdID);
+			j.base.localFrameA.q.SetAngle(angle - qA.GetAngle());
+			j.base.localFrameB.q.SetAngle(angle - qB.GetAngle());
+
+			return j;
+		}
+
 		get translation() {
 			return Box2D.b2PrismaticJoint_GetTranslation(this.jID) * meterSize;
 		}
@@ -5940,6 +5983,21 @@ async function q5playPreSetup(q) {
 				max = val[1];
 			}
 			Box2D.b2PrismaticJoint_SetLimits(this.jID, min / meterSize, max / meterSize);
+			Box2D.b2PrismaticJoint_EnableLimit(this.jID, true);
+		}
+
+		set limits(val) {
+			let min, max;
+			if (typeof val == 'number') {
+				val /= 2;
+				min = -val;
+				max = val;
+			} else {
+				min = val[0];
+				max = val[1];
+			}
+			Box2D.b2PrismaticJoint_SetLimits(this.jID, min / meterSize, max / meterSize);
+			Box2D.b2PrismaticJoint_EnableLimit(this.jID, true);
 		}
 
 		get springEnabled() {
@@ -5950,10 +6008,10 @@ async function q5playPreSetup(q) {
 		}
 
 		get springiness() {
-			return Box2D.b2PrismaticJoint_GetSpringHertz(this.jID);
+			return this._springiness;
 		}
 		set springiness(val) {
-			val = this._springMap ? this._springMap(val) : val;
+			val = this._springMap(val);
 			Box2D.b2PrismaticJoint_SetSpringHertz(this.jID, val);
 		}
 
@@ -5976,6 +6034,7 @@ async function q5playPreSetup(q) {
 		}
 		set speed(val) {
 			Box2D.b2PrismaticJoint_SetMotorSpeed(this.jID, val);
+			b2Joint_WakeBodies(this.jID);
 		}
 
 		get maxPower() {
@@ -5989,14 +6048,14 @@ async function q5playPreSetup(q) {
 			return Box2D.b2PrismaticJoint_GetMotorForce(this.jID);
 		}
 
-		// get energy() {
-		// 	return Box2D.b2PrismaticJoint_GetSpeed(this.jID);
-		// }
+		get energy() {
+			return Box2D.b2PrismaticJoint_GetSpeed(this.jID);
+		}
 	};
 
 	$.GrabberJoint = class extends $.Joint {
-		constructor(pointer, sprite) {
-			sprite ??= pointer;
+		constructor(grabPoint, sprite) {
+			sprite ??= grabPoint;
 			super(sprite, sprite, 'grabber');
 
 			let bd = b2DefaultBodyDef();
@@ -6022,11 +6081,11 @@ async function q5playPreSetup(q) {
 
 			this.jID = b2CreateMotorJoint(wID, j);
 
-			let offX = sprite.x - (pointer[0] || pointer.x),
-				offY = sprite.y - (pointer[1] || pointer.y);
+			let offX = sprite.x - (grabPoint[0] || grabPoint.x),
+				offY = sprite.y - (grabPoint[1] || grabPoint.y);
 			if (!isSlop(offX) || !isSlop(offY)) {
 				this._setOffsetB(-offX, -offY);
-				this.target = pointer;
+				this.target = grabPoint;
 			}
 
 			this.sprite = sprite;
@@ -7797,7 +7856,7 @@ async function q5playPreSetup(q) {
 			s._vel._magCached = false;
 
 			if (s._hasImagery || s._userDefinedDraw) {
-				s._rotation = Math.atan2(data[2], data[3]) * $._RADTODEG;
+				s._rotation = Math.atan2(data[2], data[3]) * RADTODEG;
 			}
 
 			if (s.debug || (!s._hasImagery && !s._userDefinedDraw)) {
@@ -7812,7 +7871,7 @@ async function q5playPreSetup(q) {
 		debugYellow = $.color(colorMax, colorMax, 0, colorMax * 0.9),
 		debugYellowFill = $.color(colorMax, colorMax, 0, colorMax * 0.1);
 
-	if ($._c2d) {
+	if ($.canvas.c2d) {
 		// polyfill for q5 WebGPU high efficiency functions
 		$._getFillIdx = () => $._fill;
 		$._setFillIdx = (v) => ($._fill = v);
@@ -8026,7 +8085,7 @@ function q5playPostSetup() {
 }
 
 // called before each draw function call
-function q5playPreDraw() {
+function q5playUpdate() {
 	const $ = this;
 
 	if (!$._q5) {
@@ -8382,6 +8441,6 @@ q5playClassLangs.Group += q5playClassLangs.Sprite;
 
 Q5.addHook('presetup', q5playPreSetup);
 Q5.addHook('postsetup', q5playPostSetup);
-Q5.addHook('predraw', q5playPreDraw);
+Q5.addHook('predraw', q5playUpdate);
 Q5.addHook('postdraw', q5playPostDraw);
 Q5.addHook('remove', q5playRemove);