From f4c3ce4fc7c220a5ac9876ac3d04aa01275b44d3 Mon Sep 17 00:00:00 2001 From: pisouvigne Date: Fri, 29 May 2020 17:04:31 +0200 Subject: [PATCH] continuation du commit precedent --- index.html | 192 +++++++++++++++++------------------------------------ js/func.js | 102 ++++++++++++++++++++++------ 2 files changed, 145 insertions(+), 149 deletions(-) diff --git a/index.html b/index.html index 5f4d260..e2dd5ed 100644 --- a/index.html +++ b/index.html @@ -1,145 +1,77 @@ - - - - - - - - - Custom Shape - - - - -
-
-
Jouer
-
-
-
Aide
-
-
-
Createur
-
-
-
Records
-
-
-
- + + + + + Custom Shape + + - var etlogique = { - entre1 : createEtLogique(300,50, "pd"), - entre2 : "200", - sortie : "500", - } + +
+
+
Jouer
+
+
+
Aide
+
+
+
Createur
+
+
+
Records
+
+
+
+ + - // add the layer to the stage - stage.add(layer); - console.log(layer); - - \ No newline at end of file diff --git a/js/func.js b/js/func.js index 8e7b5eb..56b4e06 100644 --- a/js/func.js +++ b/js/func.js @@ -1,20 +1,84 @@ -function createEtLogique(x, y, id){ - var imageObj = new Image(); - imageObj.onload = function () { - var yoda = new Konva.Image({ - x: x, - y: y, - image: imageObj, - width: 100, - height: 50, - id : "pd", - }); - - // add the shape to the layer - layer.add(yoda); - layer.batchDraw(); - }; - imageObj.src = 'img/logiqueet.png'; - - return imageObj; +function createEtLogique(x, y, id) { + var imageObj = new Image(); + imageObj.onload = function () { + var yoda = new Konva.Image({ + x: x, + y: y, + image: imageObj, + width: 100, + height: 50, + id: "pd", + }); + + + layer.add(yoda); + layer.batchDraw(); + }; + imageObj.src = 'img/logiqueet.png'; + + return imageObj; +} + +function createLine(points, id) { + let line = new Konva.Line({ + points: points, + stroke: 'black', + strokeWidth: 3, + lineCap: 'round', + lineJoin: 'round', + id: id, + }); + return line +} + +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'; + + + var rect1 = new Konva.Rect({ + x: 20, + y: 20, + width: 100, + height: 50, + stroke: 'black', + strokeWidth: 4, + id: "rect", + }); + + layer.add(rect1); + var simpleText = new Konva.Text({ + x: 20, + y: 20, + text: '0', + fontSize: 30, + fontFamily: 'Calibri', + fill: 'black', + id: "text", + }); + layer.add(simpleText); + + rect1.on('click', function () { + var et = stage.findOne("#text"); + var line = stage.findOne("#line"); + var text = et.text() == '1' ? '0' : '1'; + var colorline = et.text() == '1' ? 'black' : 'blue'; + line.stroke(colorline); + et.text(text); + layer.draw(); + }); } \ No newline at end of file