|
@@ -41,6 +41,8 @@ export default {
|
|
|
ray: 60,
|
|
|
time: 0,
|
|
|
salientPoints: [],
|
|
|
+ scale: 1,
|
|
|
+ oldScale: 1,
|
|
|
// matter
|
|
|
body: null
|
|
|
}
|
|
@@ -187,8 +189,6 @@ export default {
|
|
|
},
|
|
|
animate (event) {
|
|
|
if (this.ctx) {
|
|
|
- // this var is only here to trigger the render()
|
|
|
- // this.time = Date.now();
|
|
|
this.pos = this.body.position;
|
|
|
}
|
|
|
}
|
|
@@ -198,14 +198,19 @@ export default {
|
|
|
|
|
|
if (!this.ctx) return;
|
|
|
|
|
|
- // this var is only here to trigger the render() from animate()
|
|
|
- // let time = this.time;
|
|
|
+ this.scale = this.concernement.opened ? 5 : 1;
|
|
|
+
|
|
|
+ if (this.scale !== this.oldScale) {
|
|
|
+ Matter.Body.scale(this.body, this.scale, this.scale)
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
|
|
|
// exterieur circle
|
|
|
this.ctx.beginPath();
|
|
|
this.ctx.lineWidth = 0.5;
|
|
|
this.ctx.strokeStyle = this.concernement.opened ? "#ff0000" : "#888";
|
|
|
- this.ctx.arc(this.pos.x, this.pos.y, this.ray, 0, 2 * Math.PI, false);
|
|
|
+ this.ctx.arc(this.pos.x, this.pos.y, this.ray*this.scale, 0, 2 * Math.PI, false);
|
|
|
this.ctx.stroke();
|
|
|
|
|
|
// // interieur circle
|
|
@@ -221,11 +226,11 @@ export default {
|
|
|
this.ctx.lineWidth = 1;
|
|
|
this.ctx.strokeStyle = "#000";
|
|
|
this.ctx.fillStyle = "rgba(255,255,255,0.4)";
|
|
|
- this.ctx.moveTo(this.pos.x+this.salientPoints[0].pos.x, this.pos.y+this.salientPoints[0].pos.y)
|
|
|
+ this.ctx.moveTo(this.pos.x+this.salientPoints[0].pos.x*this.scale, this.pos.y+this.salientPoints[0].pos.y*this.scale)
|
|
|
for (let j = 1; j < this.salientPoints.length; j++) {
|
|
|
- this.ctx.lineTo(this.pos.x+this.salientPoints[j].pos.x, this.pos.y+this.salientPoints[j].pos.y)
|
|
|
+ this.ctx.lineTo(this.pos.x+this.salientPoints[j].pos.x*this.scale, this.pos.y+this.salientPoints[j].pos.y*this.scale)
|
|
|
}
|
|
|
- this.ctx.lineTo(this.pos.x+this.salientPoints[0].pos.x, this.pos.y+this.salientPoints[0].pos.y)
|
|
|
+ this.ctx.lineTo(this.pos.x+this.salientPoints[0].pos.x*this.scale, this.pos.y+this.salientPoints[0].pos.y*this.scale)
|
|
|
this.ctx.fill();
|
|
|
this.ctx.stroke();
|
|
|
}
|
|
@@ -235,7 +240,7 @@ export default {
|
|
|
let entite = this.entites[i];
|
|
|
// console.log('entite', entite);
|
|
|
this.ctx.beginPath();
|
|
|
- this.ctx.arc(this.pos.x+entite.display.pos.x, this.pos.y+entite.display.pos.y, 2, 0, 2 * Math.PI, false);
|
|
|
+ this.ctx.arc(this.pos.x+entite.display.pos.x*this.scale, this.pos.y+entite.display.pos.y*this.scale, 2, 0, 2 * Math.PI, false);
|
|
|
this.ctx.fillStyle = "#F00";
|
|
|
this.ctx.fill();
|
|
|
}
|
|
@@ -248,7 +253,7 @@ export default {
|
|
|
this.ctx.fillText(this.concernement.id, this.pos.x, this.pos.y)
|
|
|
this.ctx.fill();
|
|
|
|
|
|
-
|
|
|
+ this.oldScale = this.scale;
|
|
|
},
|
|
|
}
|
|
|
|