Lignes des switchs jusqu'aux portes logiques, les switchs mettent le courant

master
pisouvigne 5 years ago
parent 7bb107860b
commit 45f48b5de9

@ -1,4 +1,4 @@
function createEtLogique(x, y,id) { function createEtLogique(x, y, id) {
var imageObj = new Image(); var imageObj = new Image();
imageObj.onload = function () { imageObj.onload = function () {
var et = new Konva.Image({ var et = new Konva.Image({
@ -14,99 +14,72 @@ function createEtLogique(x, y,id) {
layer.add(et); layer.add(et);
layer.batchDraw(); layer.batchDraw();
}; };
imageObj.src = 'img/logiqueet.png'; imageObj.src = '../img/logiqueet.png';
imageObj.id = id; imageObj.id = id;
var logique = { var logique = {
name : id, name: id,
x : x, x: x,
y : y, y: y,
type : "et", type: "et",
id1 : null, id1: null,
id2 : null, id2: null,
id3 : null, id3: null,
} }
logiques.push(logique); logiques.push(logique);
} }
function findLogique(logiqueId){
let elem = null;
logiques.forEach(function(element) {
if(element.name === logiqueId) {
elem = element;
}
});
return elem;
}
function checkLogiqueLines(logiqueId,lineId){
let logique = findLogique(logiqueId);
switch(lineId){
case "id1" :
if (lineId.id1 == null) return false;
return true;
break;
case "id2" :
if (lineId.id2 == null) return false;
return true;
break;
case "id3" :
if (lineId.id3 == null) return false;
return true;
}
}
function whatIsElement(element){
if(findLogique(element.name) == null){ function whatIsElement(element) {
if (findLogique(element.name) == null) {
return "switch"; return "switch";
} else { } else {
return "logique"; return "logique";
} }
} }
function setLine(logiqueElement,lineId,lineName){ function setLine(logiqueElement, lineId, lineName) {
logiques.forEach(function(element) { logiques.forEach(function (element, index) {
if(element.name === logiqueElement.name) { if (element.name === logiqueElement.name) {
element.forEach(function(elem){ Object.keys(element).map(function(objectKey, index) {
if(elem == lineId){ if(objectKey == lineId){
elem = lineName; element[objectKey] = lineName;
} }
}); });
} }
}); });
} }
function createLink(entre,sortie){ function createLink(entre, sortie) {
//entre est une porte logique //entre est une porte logique
switch(whatIsElement(entre)){ switch (whatIsElement(entre)) {
case "switch" : case "switch":
switch(whatIsElement(sortie)){ switch (whatIsElement(sortie)) {
case "logique" : case "logique":
if(!checkLogiqueLines(sortie.name,"id2")){ switch (giveLineId(sortie.name)) {
let switchMidX = entre.getX() + entre.getWidth(); case "id1":
let switchMidY = entre.getY() + entre.getHeight()/2; let switchMidX = entre.getX() + entre.getWidth();
let switchMidY = entre.getY() + entre.getHeight() / 2;
let logiqueMidX = sortie.x;
let logiqueMidY = sortie.y + (50/3)*2; let logiqueMidX = sortie.x;
createLine([switchMidX,switchMidY,logiqueMidX,logiqueMidY],"line2"); let logiqueMidY = sortie.y + (50 / 3);
setLine(sortie,"id2","line2"); createLine([switchMidX, switchMidY, logiqueMidX, logiqueMidY], "line1");
return; setLine(sortie, "id1", "line1");
} break;
if(!checkLogiqueLines(sortie.name,"id1")){ case "id2":
let switchMidX = entre.getX() + entre.getWidth(); createLine([entre.getX() + entre.getWidth(), entre.getY() + entre.getHeight() / 2, sortie.x, sortie.y + (50 / 3) * 2], "line2");
let switchMidY = entre.getY() + entre.getHeight()/2; setLine(sortie, "id2", "line2");
break;
let logiqueMidX = sortie.x;
let logiqueMidY = sortie.y + (50/3)*3;
createLine([switchMidX,switchMidY,logiqueMidX,logiqueMidY],"line1");
setLine(sortie,"id1","line1");
return;
} }
} }
} }
} }
function createLine(points, id) { function createLine(points, id) {
let line = new Konva.Line({ let line = new Konva.Line({
points: points, points: points,
@ -119,7 +92,7 @@ function createLine(points, id) {
layer.add(line); layer.add(line);
} }
function createSwitch(num,id,x,y){ function createSwitch(num, id, x, y) {
var rect1 = new Konva.Rect({ var rect1 = new Konva.Rect({
x: x, x: x,
y: y, y: y,
@ -138,31 +111,32 @@ function createSwitch(num,id,x,y){
fontSize: 30, fontSize: 30,
fontFamily: 'Calibri', fontFamily: 'Calibri',
fill: 'black', fill: 'black',
id: "text"+num, id: "text" + num,
}); });
layer.add(simpleText); layer.add(simpleText);
rect1.on('click', function () { rect1.on('click', function () {
var et = stage.findOne("#text"+num); var et = stage.findOne("#text" + num);
var line = stage.findOne("#line"+num); var line = stage.findOne("#line" + num);
console.log("#line" + num);
var text = et.text() == '1' ? '0' : '1'; var text = et.text() == '1' ? '0' : '1';
var colorline = et.text() == '1' ? 'black' : 'blue'; var colorline = et.text() == '1' ? 'black' : '#f6cd61';
line.stroke(colorline); line.stroke(colorline);
et.text(text); et.text(text);
layer.draw(); layer.draw();
}); });
} }
function isElementExisting(elementId){ function isElementExisting(elementId) {
if(stage.findOne("#"+elementId) != null){ if (stage.findOne("#" + elementId) != null) {
return true; return true;
} }
return false; return false;
} }
function checkLineSwitch(switchId){ function checkLineSwitch(switchId) {
if(stage.findOne("#"+switchId) != null){ if (stage.findOne("#" + switchId) != null) {
return true; return true;
} }
return false; return false;
@ -184,6 +158,5 @@ function initLayer() {
layer.add(yoda); layer.add(yoda);
layer.batchDraw(); layer.batchDraw();
}; };
imageObj2.src = 'img/idea_white.png'; imageObj2.src = '../img/idea_white.png';
} }

@ -0,0 +1,45 @@
function findLogique(logiqueId) {
let elem = null;
logiques.forEach(function (element) {
if (element.name === logiqueId) {
elem = element;
}
});
return elem;
}
function giveLineId(logiqueId){
let lineId = null;
let logique = findLogique(logiqueId);
logiques.forEach(function(element, index) {
if (element.name === logique.name) {
Object.keys(element).map(function(objectKey, index) {
if(objectKey == "id1"){
if(element[objectKey] == null){
lineId = "id1";
}
}
if(objectKey == "id2"){
if(element[objectKey] == null){
lineId = "id2";
}
}
});
}
});
return lineId
}
function checkLogiqueLines(logiqueId, lineId) {
let logique = findLogique(logiqueId);
logiques.forEach(function (element, index) {
if (element.name === logique.name) {
Object.keys(element).map(function(objectKey, index) {
if(objectKey == lineId && objectKey != null){
return true;
}
});
}
});
return false;
}

@ -1,9 +1,11 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<link rel="stylesheet" type="text/css" href="../css/style.css"> <link rel="stylesheet" type="text/css" href="../css/style.css">
<script src="https://unpkg.com/konva@6.0.0/konva.min.js"></script> <script src="https://unpkg.com/konva@6.0.0/konva.min.js"></script>
<script src="../js/func.js"></script> <script src="../js/func.js"></script>
<script src="../js/logique.js"></script>
<link href="https://use.fontawesome.com/releases/v5.0.4/css/all.css" rel="stylesheet"> <link href="https://use.fontawesome.com/releases/v5.0.4/css/all.css" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Bitter:wght@700&display=swap" rel="stylesheet"> <link href="https://fonts.googleapis.com/css2?family=Bitter:wght@700&display=swap" rel="stylesheet">
<meta charset="utf-8" /> <meta charset="utf-8" />
@ -21,11 +23,13 @@
</ul> </ul>
</nav> </nav>
</header> </header>
<div id="container"></div> <div id="container" style="width: 50%;"></div>
<script> <script>
var switchs = [], lines = [], logiques = []; var switchs = [], lines = [], logiques = [];
for (var i = logiques.length; i > 0; i--) {
logiques.pop();
}
console.log(logiques);
var layer = new Konva.Layer(); var layer = new Konva.Layer();
var stage = new Konva.Stage({ var stage = new Konva.Stage({
@ -37,14 +41,12 @@
initLayer(); initLayer();
createEtLogique(300, 50, "logique1"); createEtLogique(300, 100, "logique1");
createSwitch(1,"et",20,20);
createSwitch(2,"et2",20,150);
createLink(stage.findOne("#et2"),findLogique("logique1"));
createLink(stage.findOne("#et"),findLogique("logique1"));
</script>
</body>
createSwitch(1, "et", 20, 20);
createSwitch(2, "et2", 20, 150);
createLink(stage.findOne("#et2"), findLogique("logique1"));
createLink(stage.findOne("#et"), findLogique("logique1"));
</script>
</body>
</html> </html>
Loading…
Cancel
Save