makeittrue/site/js/func.js

function createLogique(x, y, id, type) {
  
  switch(type){
    case "et":
      var imageObj = new Image();
      imageObj.onload = function () {
        var et = new Konva.Image({
          x: x,
          y: y,
          image: imageObj,
          width: 100,
          height: 50,
          id: id,
        });


        layer.add(et);
        layer.batchDraw();
      };
      imageObj.src = '../img/logiqueet.png';
      imageObj.id = id;
      break;
    case "ou":
      var imageObj = new Image();
      imageObj.onload = function () {
        var et = new Konva.Image({
          x: x,
          y: y,
          image: imageObj,
          width: 100,
          height: 50,
          id: id,
        });


        layer.add(et);
        layer.batchDraw();
      };
      imageObj.src = '../img/logiqueou.png';
      imageObj.id = id;
      break;
  }
  
  

  var logique = {
    name: id,
    x: x,
    y: y,
    type: type,
    id1: null,
    id2: null,
    id3: null,
  }
  logiques.push(logique);
}





function whatIsElement(element) {

  if (findLogique(element.name) == null) {
    return "switch";
  } else {
    return "logique";
  }
}

function setLine(logiqueElement, lineId, lineName) {
  logiques.forEach(function (element, index) {
    if (element.name === logiqueElement.name) {
      Object.keys(element).map(function(objectKey, index) {
        if(objectKey == lineId){
          element[objectKey] = lineName;
        }
    });
    }
  });
}

function createLink(entre, sortie,lineId) {
  //entre est une porte logique
  switch (whatIsElement(entre)) {
    case "switch":
      switch (whatIsElement(sortie)) {
        case "logique":
          switch (giveLineId(sortie.name)) {
            case "id1":
              let switchMidX = entre.getX() + entre.getWidth();
              let switchMidY = entre.getY() + entre.getHeight() / 2;

              let logiqueMidX = sortie.x;
              let logiqueMidY = sortie.y + (50 / 3);
              createLine([switchMidX, switchMidY, logiqueMidX, logiqueMidY], "line"+lineId);
              setLine(sortie, "id1", "line"+lineId);
              entre.id3 = "line"+lineId;
              break;
            case "id2":
              createLine([entre.getX() + entre.getWidth(), entre.getY() + entre.getHeight() / 2, sortie.x, sortie.y + (50 / 3) * 2], "line"+lineId);
              setLine(sortie, "id2", "line"+lineId);
              entre.id3 = "line"+lineId;
              break;
          }
      }
      break;
    case "logique" :
      switch (whatIsElement(sortie)) {
        case "logique":
          switch (giveLineId(sortie.name)) {
            case "id1":
              let switchMidX = entre.x + 100;
              let switchMidY = entre.y + 50 / 2;

              let logiqueMidX = sortie.x;
              let logiqueMidY = sortie.y + (50 / 3);
              createLine([switchMidX, switchMidY, logiqueMidX, logiqueMidY], "line"+lineId);
              setLine(sortie, "id1", "line"+lineId);
              setLine(entre, "id3", "line"+lineId);
              break;
            case "id2":
              createLine([entre.x + 100, entre.y + 50 / 2, sortie.x, sortie.y + (50 / 3) * 2], "line"+lineId);
              setLine(sortie, "id2", "line"+lineId);
              setLine(entre, "id3", "line"+lineId);
              break;
          }
      }
      break;
  }
}

function changeLineColor(idLine){
  let line = stage.findOne("#"+idLine);
  var colorline = line.stroke() == '#f6cd61' ? 'black' : '#f6cd61';
  line.stroke(colorline);
}
function changeLineColorBlack(idLine){
  let line = stage.findOne("#"+idLine);
  line.stroke("black");
}
function changeLineColorYellow(idLine){
  let line = stage.findOne("#"+idLine);
  line.stroke("#f6cd61");
}

function checkAllSortieLogique(){
  logiques.forEach(function(element){
    if(element.id3 != null)
      checkSortieLogique(element.name);
  });
}

function checkSortieLogique(logiqueId){
  let logique = findLogique(logiqueId);
  logiques.forEach(function (element, index) {
    if (element.name === logique.name) {
      let line1State,line2State;
      let id1Color = stage.findOne("#"+element.id1).stroke(); 
      let id2Color = stage.findOne("#"+element.id2).stroke(); 
      if(id1Color == "black"){
        line1State = false;
      } else {
        line1State = true;
      }
      if(id2Color == "black"){
        line2State = false;
      } else {
        line2State = true;
      }
      switch(logique.type){
        case "et" :
          if(line1State == true && line2State == true){
            changeLineColorYellow(element.id3);
          }
          else{
            changeLineColorBlack(element.id3);
          }
          break;  
        case "ou" :
          if(line1State == true || line2State == true){
            changeLineColorYellow(element.id3);
          }
          else{
            changeLineColorBlack(element.id3);
          }
          break;
      }
    }
});
}


function createLine(points, id) {
  let line = new Konva.Line({
    points: points,
    stroke: 'black',
    strokeWidth: 3,
    lineCap: 'round',
    lineJoin: 'round',
    id: id,
  });
  layer.add(line);
}

function createSwitch(id, x, y) {
  switchs.push(id);
  var num = lineCount.length;
  lineCount.push(1);
  var rect1 = new Konva.Rect({
    x: x,
    y: y,
    width: 100,
    height: 50,
    stroke: 'black',
    fill: 'red',
    strokeWidth: 4,
    id: id,
    id3 : null,
  });


  layer.add(rect1);

}

function initAllSwitch(){
  switchs.forEach(function(element){
    let switche = stage.findOne("#"+element);
    switche.on('click', function () {
      let colorrect = switche.fill() == 'red' ? 'green' : 'red';
      switche.fill(colorrect);
      changeLineColor(switche.id3);
      checkAllSortieLogique();
      layer.draw();
    });

  });
}

function isElementExisting(elementId) {
  if (stage.findOne("#" + elementId) != null) {
    return true;
  }
  return false;
}

function checkLineSwitch(switchId) {
  if (stage.findOne("#" + switchId) != null) {
    return true;
  }
  return false;
}

function initLayer() {
  var imageObj2 = new Image();
  imageObj2.onload = function () {
    var yoda = new Konva.Image({
      x: 500,
      y: 50,
      image: imageObj2,
      width: 50,
      height: 50,
      id: "et",
    });


    layer.add(yoda);
    layer.batchDraw();
  };
  imageObj2.src = '../img/idea_white.png';
}