sketchpunk

/*
Equation Found On : https://math.stackexchange.com/questions/73237/parametric-equation-of-a-circle-in-3d-space

A Plane is defined with a point and direction, so vecCenter is the plane's point. Now you need to calculate two unit
vectors based on the plane's normal direction. With the normal direction being considered as forward, use cross product
to get the UP and Right/Left vector based on that forward vector. Using UP as Y and Right/Left as X, you can then use that 
in the following functions to plot out points for a circle or ellipse in 3D space. Its basicly the values you need to create
rotation matrix but you only need up and right/left.

Example:

sketchpunk

// How to increment using the slope and offset comes from tasaboia's example but did not have a solution for A
// But found a way to calc for A from a ruby Wire Tool plugin, but it's incrementing did not work as well as tasaboia
// So mixing the two results in a good implementation of the Catenary Curve. All Credit belongs to those two developers.
// All I did is mash the code together and fixed / optimized it - SketchpunkLabs
// https://github.com/tasaboia/Procedural-Rope-Generator/blob/master/Assets/CatenaryTeste/Scripts/Catenary.cs
// http://rhin.crai.archi.fr/rld/plugin_details.php?id=990

function catenary(a, x){ return a * Math.cosh( x / a ); }
catenary.MAX_TRIES = 100;
catenary.getA = function(vecLen, maxLen){

sketchpunk

vec3 vecQuatRotation(vec4 q, vec3 v){ 
  return v + cross(2.0 * q.xyz, cross(q.xyz, v) + q.w * v);
}

sketchpunk

vec3 dqVecTransform(mat2x4 dq, vec3 v){
    vec4 Qr 	= dq[0].xyzw; //real (rot)
    vec4 Qd 	= dq[1].xyzw; //dual (trans)
    vec3 pos	= v + cross(2.0 * Qr.xyz, cross(Qr.xyz, v) + Qr.w * v);	          //Rotate Vector
    vec3 tran	= 2.0 * (Qr.w * Qd.xyz - Qd.w * Qr.xyz + cross(Qr.xyz, Qd.xyz));	//Pull out Translation from DQ
    return pos + tran;
}

//For Joint / Bone Transformation, you need to blend weighted dual quaternions that you can then apply to a vertex.
//This sample is for just two joints, but I commented out use of 4 joints total which is enough for any skinning needs.

sketchpunk

/*
  Quick hacked together function to use a 4 point bezier curve as an easing function.
  Some limitations :
    - Curve CAN NOT intersect, each X value must be unqiue.
    - First point must have an X = 0, y can be anything you want.
    - Last point must have an X = 1, y can be anything you  want.
    
  t value for a bezier curve isn't really time, its more like the normalized length of the curve.
  But we can use the x value as long as it exists between 0 and 1 as time. To do that, I'm performing
  a simple binary searching looking for the target time (x). When x is found within ome margin of error, the t 

sketchpunk

import Vec3 from "/fungi/maths/Vec3.js";

class Bezier{
	static get(p0, p1, p2, p3, t, out){
		let i		= 1 - t,
			ii		= i * i,
			iii		= ii * i,
			tt 		= t * t,
			ttt 	= tt * t,
			iit3 	= 3 * ii * t,

sketchpunk

//X and Y axis need to be normalized vectors, 90 degrees of eachother.
function planeCircle(vecCenter, xAxis, yAxis, angle, radius, out){
	let sin = Math.sin(angle),
		cos = Math.cos(angle);
	out[0] = vecCenter[0] + radius * cos * xAxis[0] + radius * sin * yAxis[0];
	out[1] = vecCenter[1] + radius * cos * xAxis[1] + radius * sin * yAxis[1];
	out[2] = vecCenter[2] + radius * cos * xAxis[2] + radius * sin * yAxis[2];
	return out;
}

sketchpunk

// Resources
// https://burakkanber.com/blog/physics-in-javascript-car-suspension-part-1-spring-mass-damper/
// https://gafferongames.com/post/spring_physics/
// https://gafferongames.com/post/physics_in_3d/
// http://digitalopus.ca/site/pd-controllers/
//		.. Has things about Torque

class QuaterionSpring{
  constructor( damping=5, stiffness=30 ){
    this.velocity	= new Float32Array(4);

sketchpunk

/*
  The main idea is to prototype a way to apply a bit of spring physics to an object. Many examples online tend to follow the
  JiggyBone concept of having an "invisible" point follow along which is then used as a LookAt Vector that can be used to apply
  rotation. Follows similar ideas to FABIK style algorithm.
  
  In this example, I wanted for a more Under damping style instead of critical damping. Give it a bit of springyness when movement stops.
  
  So far the class is bare bones and does not include LookAt being applyed to some object. So far It just creates the invisible point
  that tries to keep up when the transform changes position and rotates.
*/

sketchpunk

// Return the a rotation needed to add to FROM to get to TO.
function quatDelta(qFrom, qTo, out=null){
  return qFrom.invert( out || new Quat() ).mul( qTo );
}

const QUAT_FWD2UP = new Quat().setAxisAngle(Vec3.LEFT, Maths.toRad(90));
class ChainSpring{
  constructor( chain ){
    this.links = new Array( chain.count );
    this.stiffness = 60;