after intensive tests, fixed rotation

This commit is contained in:
bluesaxman 2022-02-10 10:34:16 -07:00
parent da9240e3ff
commit 2cc3f4d0cf

View File

@ -45,9 +45,9 @@ class shape {
var origRot = this.rotation.getRadAngle() + (rotation instanceof vector ? rotation : new vector([0,1])).getRadAngle(); var origRot = this.rotation.getRadAngle() + (rotation instanceof vector ? rotation : new vector([0,1])).getRadAngle();
var center = origin.add(this.dimentions.mag(0.5)); var center = origin.add(this.dimentions.mag(0.5));
// Rotate // Rotate
ctx.translate(center.d[0],center.d[1]); ctx.translate(origin.d[0],origin.d[1]);
ctx.rotate(origRot); ctx.rotate(origRot);
ctx.translate(-center.d[0],-center.d[1]); ctx.translate(-origin.d[0],-origin.d[1]);
// Draw // Draw
ctx.fillStyle = this.fcolor; ctx.fillStyle = this.fcolor;
ctx.strokeStyle = this.bColor; ctx.strokeStyle = this.bColor;
@ -67,9 +67,9 @@ class shape {
}); });
} }
// restore context defaults // restore context defaults
ctx.translate(center.d[0],center.d[1]); ctx.translate(origin.d[0],origin.d[1]);
ctx.rotate(-origRot); ctx.rotate(-origRot);
ctx.translate(-center.d[0],-center.d[1]); ctx.translate(-origin.d[0],-origin.d[1]);
ctx.fillStyle = local.fillStyle; ctx.fillStyle = local.fillStyle;
ctx.strokeStyle = local.strokeStyle; ctx.strokeStyle = local.strokeStyle;
@ -86,7 +86,7 @@ class container {
constructor(coordinates,dimentions,rotation) { constructor(coordinates,dimentions,rotation) {
this.coordinates = coordinates instanceof vector ? coordinates : new vector([0,0]); this.coordinates = coordinates instanceof vector ? coordinates : new vector([0,0]);
this.size = dimentions instanceof vector ? dimentions : new vector([1,1]); this.size = dimentions instanceof vector ? dimentions : new vector([1,1]);
this.rotation = rotation instanceof vector ? rotation : new vector([0,1]); this.rotation = rotation instanceof vector ? rotation : new vector([1,0]);
this.movementVector = new vector([0,0]); this.movementVector = new vector([0,0]);
this.shapes = []; this.shapes = [];
this.containers = []; this.containers = [];
@ -115,22 +115,23 @@ class container {
renderContainer(ctx,position,rotation) { renderContainer(ctx,position,rotation) {
position = position instanceof vector ? position : new vector([0,0]); position = position instanceof vector ? position : new vector([0,0]);
rotation = rotation instanceof vector ? rotation : new vector([0,1]); rotation = rotation instanceof vector ? rotation : new vector([1,0]);
var refPos = this.coordinates.add(position); var refPos = this.coordinates.add(position);
var refRot = rad2vec(this.rotation.getRadAngle() + (rotation instanceof vector ? rotation : new vector([0,1])).getRadAngle()); var refRot = rad2vec(this.rotation.getRadAngle() + (rotation instanceof vector ? rotation : new vector([1,0])).getRadAngle());
var center = refPos.add(this.size.mag(0.5)); var center = refPos.add(this.size.mag(0.5));
ctx.translate(center.d[0],center.d[1]); ctx.translate(refPos.d[0],refPos.d[1]);
ctx.rotate(refRot.getRadAngle()); ctx.rotate(refRot.getRadAngle());
ctx.translate(-center.d[0],-center.d[1]); ctx.translate(-refPos.d[0],-refPos.d[1]);
if (this.shapes.length) { if (this.shapes.length) {
this.shapes.forEach(shape => shape.render(ctx,refPos,refRot)); this.shapes.forEach(shape => shape.render(ctx,refPos,rotation));
} }
if (this.containers.length) { if (this.containers.length) {
this.containers.forEach(cont => cont.renderContainer(ctx,refPos,refRot)); this.containers.forEach(cont => cont.renderContainer(ctx,refPos,rotation));
} }
ctx.translate(center.d[0],center.d[1]); ctx.translate(refPos.d[0],refPos.d[1]);
ctx.rotate(-refRot.getRadAngle()); ctx.rotate(-refRot.getRadAngle());
ctx.translate(-center.d[0],-center.d[1]); ctx.translate(-refPos.d[0],-refPos.d[1]);
} }
grow(amp) { grow(amp) {