made matter body parts of besoin and concernement
This commit is contained in:
parent
1e57fa0d22
commit
8806507ecb
@ -48,6 +48,7 @@ export default {
|
||||
opacity: 0,
|
||||
tween: null,
|
||||
body: null,
|
||||
body_parts: [],
|
||||
constraint: null
|
||||
}
|
||||
},
|
||||
@ -140,18 +141,19 @@ export default {
|
||||
// MatterAttractors.Attractors.gravityConstant = -5;
|
||||
|
||||
// Create parts of the body : main big circle & entities
|
||||
var parts = [
|
||||
this.body_parts = [
|
||||
Matter.Bodies.circle(0, 0, this.ray, {
|
||||
item_type: 'concernement',
|
||||
id: this.concernement.id,
|
||||
})
|
||||
];
|
||||
// Create parts of the body : entities
|
||||
for (let i = 0; i < this.entites.length; i++) {
|
||||
// parts.push(Matter.Bodies.circle(this.pos.x+this.entites[i].display.pos.x, this.pos.y+this.entites[i].display.pos.y, 15, {
|
||||
// item_type: 'entite',
|
||||
// id: this.entites[i].id
|
||||
// }))
|
||||
parts.push(Matter.Bodies.circle(this.entites[i].display.pos.x, this.entites[i].display.pos.y, 0.8, {
|
||||
this.body_parts.push(Matter.Bodies.circle(this.entites[i].display.pos.x, this.entites[i].display.pos.y, 0.8, {
|
||||
item_type: 'entite',
|
||||
id: this.entites[i].entite.id,
|
||||
cid: this.concernement.id,
|
||||
@ -159,10 +161,12 @@ export default {
|
||||
isSensor: true
|
||||
}))
|
||||
}
|
||||
// Create parts of the body : besoins and responses
|
||||
this.createBesoinsBodyParts();
|
||||
|
||||
// create the body
|
||||
this.body = Matter.Body.create({
|
||||
parts: parts,
|
||||
parts: this.body_parts,
|
||||
item_type: 'concernement',
|
||||
id: this.concernement.id,
|
||||
frictionAir: 0,
|
||||
@ -200,6 +204,45 @@ export default {
|
||||
Matter.Events.on(this.matterEngine, "afterUpdate", this.onAfterEngineUpdate);
|
||||
}
|
||||
},
|
||||
createBesoinsBodyParts(){
|
||||
let res_fields = ['qui','quoi','ou','avec'];
|
||||
let arc = (360 / 16); // unit arc
|
||||
let r = (this.ray * this.scale)/5; // unit ray
|
||||
let br = r - r/3; // besoin ray
|
||||
for (let i = 0; i < this.concernement.besoins.length; i++) {
|
||||
let start_a = arc * i; // angle depart (for reponses)
|
||||
let center_a = start_a + arc/2; // angle central
|
||||
let x = Math.cos(center_a*(Math.PI/180)) * br;
|
||||
let y = Math.sin(center_a*(Math.PI/180)) * br;
|
||||
|
||||
this.body_parts.push(Matter.Bodies.circle(x, y, 0.8, {
|
||||
item_type: 'besoin',
|
||||
id: this.concernement.besoins[i].id,
|
||||
cid: this.concernement.id,
|
||||
isSensor: true
|
||||
}));
|
||||
|
||||
let res_arc = arc / (1 + this.concernement.besoins[i].reponses.length); // unit arc for responses depending responses number
|
||||
for (let j = 0; j < this.concernement.besoins[i].reponses.length; j++) {
|
||||
let res_a = start_a + res_arc * (j+1); // angle for response line
|
||||
for (let f = 0; f < res_fields.length; f++) {
|
||||
if(this.concernement.besoins[i].reponses[j][res_fields[f]]){
|
||||
let rr = this.ray * this.scale - r*f - r/2; // reponse field ray
|
||||
let rx = Math.cos(res_a*(Math.PI/180)) * rr;
|
||||
let ry = Math.sin(res_a*(Math.PI/180)) * rr;
|
||||
|
||||
this.body_parts.push(Matter.Bodies.circle(rx, ry, 0.8, {
|
||||
item_type: 'reponse',
|
||||
id: this.concernement.besoins[i].reponses[j].id,
|
||||
bid: this.concernement.besoins[i].id,
|
||||
cid: this.concernement.id,
|
||||
isSensor: true
|
||||
}));
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
getRandomPos(){
|
||||
return {
|
||||
x: this.ray/2 + Math.random()*(this.canvas.width - this.ray),
|
||||
@ -592,49 +635,29 @@ export default {
|
||||
}
|
||||
},
|
||||
drawBesoins(){
|
||||
let res_fields = ['qui','quoi','ou','avec'];
|
||||
let arc = (360 / 16); // unit arc
|
||||
let r = (this.ray * this.scale)/5; // unit ray
|
||||
let br = r - r/3; // besoin ray
|
||||
for (let i = 0; i < this.concernement.besoins.length; i++) {
|
||||
// TODO make besoins and reponses interactives
|
||||
let start_a = arc * i; // angle depart (for reponses)
|
||||
let center_a = start_a + arc/2; // angle central
|
||||
let x = Math.cos(center_a*(Math.PI/180)) * br;
|
||||
let y = Math.sin(center_a*(Math.PI/180)) * br;
|
||||
|
||||
this.ctx.beginPath();
|
||||
this.ctx.fillStyle = "#000";
|
||||
// this.ctx.arc(this.pos.x + x, this.pos.y + y, 2, 0, 2 * Math.PI, false);
|
||||
this.drawDiamond(this.pos.x + x, this.pos.y + y, 4);
|
||||
this.ctx.fill();
|
||||
|
||||
let res_arc = arc / (1 + this.concernement.besoins[i].reponses.length); // unit arc for responses depending responses number
|
||||
// loop through reponses
|
||||
for (let j = 0; j < this.concernement.besoins[i].reponses.length; j++) {
|
||||
let res_a = start_a + res_arc * (j+1); // angle for response line
|
||||
// loop through fields qui, quoi, où, avec
|
||||
for (let f = 0; f < res_fields.length; f++) {
|
||||
if(this.concernement.besoins[i].reponses[j][res_fields[f]]){
|
||||
let rr = this.ray * this.scale - r*f - r/2; // reponse field ray
|
||||
let rx = Math.cos(res_a*(Math.PI/180)) * rr;
|
||||
let ry = Math.sin(res_a*(Math.PI/180)) * rr;
|
||||
for (let i = 0; i < this.body.parts.length; i++) {
|
||||
if (this.body.parts[i].item_type === 'besoin' || this.body.parts[i].item_type === 'reponse') {
|
||||
let part = this.body.parts[i];
|
||||
|
||||
switch (part.item_type) {
|
||||
case 'besoin':
|
||||
this.ctx.beginPath();
|
||||
this.ctx.fillStyle = "#000";
|
||||
this.drawDiamond(part.position.x, part.position.y, 4);
|
||||
this.ctx.fill();
|
||||
break;
|
||||
case 'reponse':
|
||||
this.ctx.beginPath();
|
||||
this.ctx.fillStyle = "#eee";
|
||||
this.ctx.strokeStyle = "#000";
|
||||
this.ctx.lineWidth = 1;
|
||||
// this.ctx.arc(this.pos.x + rx, this.pos.y + ry, 2*(f+1), 0, 2 * Math.PI, false);
|
||||
this.drawDiamond(this.pos.x + rx, this.pos.y + ry, 5);
|
||||
this.drawDiamond(part.position.x, part.position.y, 5);
|
||||
this.ctx.fill();
|
||||
this.ctx.stroke();
|
||||
|
||||
}
|
||||
|
||||
break;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
},
|
||||
drawDiamond(x,y,r){
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user