0
0
Fork 0
mirror of https://github.com/liabru/matter-js.git synced 2025-01-12 16:08:50 -05:00

added constraint.render.type and constraint.render.anchor

This commit is contained in:
liabru 2017-06-26 23:20:34 +01:00
parent 08aa3f20f6
commit 0952516e57
2 changed files with 80 additions and 17 deletions

View file

@ -51,15 +51,6 @@ var Common = require('../core/Common');
constraint.length = typeof constraint.length !== 'undefined' ? constraint.length : length;
// render
var render = {
visible: true,
lineWidth: 2,
strokeStyle: '#ffffff'
};
constraint.render = Common.extend(render, constraint.render);
// option defaults
constraint.id = constraint.id || Common.nextId();
constraint.label = constraint.label || 'Constraint';
@ -71,6 +62,24 @@ var Common = require('../core/Common');
constraint.angleB = constraint.bodyB ? constraint.bodyB.angle : constraint.angleB;
constraint.plugin = {};
// render
var render = {
visible: true,
lineWidth: 2,
strokeStyle: '#ffffff',
type: 'line',
anchors: true
};
if (constraint.length === 0) {
render.type = 'pin';
render.anchors = false;
} else if (constraint.stiffness < 0.9) {
render.type = 'spring';
}
constraint.render = Common.extend(render, constraint.render);
return constraint;
};
@ -353,6 +362,24 @@ var Common = require('../core/Common');
* @default a random colour
*/
/**
* A `String` that defines the constraint rendering type.
* The possible values are 'line', 'pin', 'spring'.
* An appropriate render type will be automatically chosen unless one is given in options.
*
* @property render.type
* @type string
* @default 'line'
*/
/**
* A `Boolean` that defines if the constraint's anchor points should be rendered.
*
* @property render.anchors
* @type boolean
* @default true
*/
/**
* The first possible `Body` that this constraint is attached to.
*

View file

@ -496,20 +496,47 @@ var Mouse = require('../core/Mouse');
continue;
var bodyA = constraint.bodyA,
bodyB = constraint.bodyB;
bodyB = constraint.bodyB,
start,
end;
if (bodyA) {
c.beginPath();
c.moveTo(bodyA.position.x + constraint.pointA.x, bodyA.position.y + constraint.pointA.y);
start = Vector.add(bodyA.position, constraint.pointA);
} else {
c.beginPath();
c.moveTo(constraint.pointA.x, constraint.pointA.y);
start = constraint.pointA;
}
if (bodyB) {
c.lineTo(bodyB.position.x + constraint.pointB.x, bodyB.position.y + constraint.pointB.y);
if (constraint.render.type === 'pin') {
c.beginPath();
c.arc(start.x, start.y, 4, 0, 2 * Math.PI);
c.closePath();
} else {
c.lineTo(constraint.pointB.x, constraint.pointB.y);
if (bodyB) {
end = Vector.add(bodyB.position, constraint.pointB);
} else {
end = constraint.pointB;
}
c.beginPath();
c.moveTo(start.x, start.y);
if (constraint.render.type === 'spring') {
var delta = Vector.sub(end, start),
normal = Vector.perp(Vector.normalise(delta)),
coils = Math.ceil(Common.clamp(constraint.length / 5, 12, 20)),
offset;
for (var j = 0; j < coils; j += 1) {
offset = j % 2 === 0 ? 1 : -1;
c.lineTo(
start.x + delta.x * (j / coils) + normal.x * offset * 4,
start.y + delta.y * (j / coils) + normal.y * offset * 4
);
}
}
c.lineTo(end.x, end.y);
}
if (constraint.render.lineWidth) {
@ -517,6 +544,15 @@ var Mouse = require('../core/Mouse');
c.strokeStyle = constraint.render.strokeStyle;
c.stroke();
}
if (constraint.render.anchors) {
c.fillStyle = constraint.render.strokeStyle;
c.beginPath();
c.arc(start.x, start.y, 3, 0, 2 * Math.PI);
c.arc(end.x, end.y, 3, 0, 2 * Math.PI);
c.closePath();
c.fill();
}
}
};