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