summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--index.js23
-rw-r--r--robot.js1
2 files changed, 15 insertions, 9 deletions
diff --git a/index.js b/index.js
index 5f4050d..e0d065f 100644
--- a/index.js
+++ b/index.js
@@ -10,7 +10,7 @@ const canvasOffsetY = canvas.offsetTop;
robot.style.top = canvas.height/2 - robot.height/2 - canvasOffsetY;
robot.style.left = canvas.width/2 - robot.width/2 - canvasOffsetX;
-let scale = 2.5
+let scale = 1
canvas.width = window.innerWidth - canvasOffsetX * 2;
canvas.height = window.innerHeight - canvasOffsetY * 2;
@@ -32,7 +32,8 @@ ctx.strokeStyle = strokeColor;
ctx.fillStyle = "red";
const wall = (x, y) => {
- ctx.fillRect(x * canvas.width - canvasOffsetX, y * canvas.height - canvasOffsetY, 30, 30);
+ console.log(x * canvas.width - canvasOffsetX - robot.width/2, y * canvas.height - canvasOffsetY, robot.width, 5);
+ ctx.fillRect(x * canvas.width - canvasOffsetX - robot.width/2, y * canvas.height - canvasOffsetY, robot.width, 5);
ctx.stroke();
ctx.beginPath();
}
@@ -50,18 +51,21 @@ canvas.addEventListener('mousedown', (e) => {
crosses.push({x: e.layerX - canvasOffsetX, y: e.layerY - canvasOffsetY});
moveTo(-(e.layerX - canvasOffsetX - canvas.width/2) * scale, -(e.layerY - canvasOffsetY - canvas.height/2) * scale)
- tr.a = Math.atan((-e.layerX + canvasOffsetX + canvas.width/2)/(e.layerY - canvasOffsetY - canvas.height/2))
+ //tr.a = Math.atan((e.layerX - canvasOffsetX - canvas.width/2)/(e.layerY - canvasOffsetY - canvas.height/2))
if ( e.layerY - canvasOffsetY > canvas.height/2 )
{
tr.a += Math.PI
}
- // if wall detected then
- // drawings.push({x: (canvasOffsetX - robot.width/2)/canvas.width, y: -(20 * scale + canvasOffsetY + robot.height)/canvas.height, tr: {x: tr.x, y: tr.y, a: tr.a}}) // add a wall
-
update()
});
+client.on('message', function (topic, message) {
+ let val = message.toString();
+ if (message[0] >= 48 && message[0] < 58)
+ drawings.push({x: 0, y: -((parseInt(val) - 30) * scale + canvasOffsetY + robot.height)/canvas.height, tr: {x: tr.x, y: tr.y, a: tr.a}}) // add a wall
+ update();
+});
/* canvas.addEventListener('touchstart', (e) => {
drawCross(e.targetTouches[0].layerX, e.targetTouches[0].layerY);
crosses.push({x: e.targetTouches[0].layerX - canvasOffsetX, y: e.targetTouches[0].layerY - canvasOffsetY});
@@ -103,8 +107,11 @@ function resizeCanvas() {
function redrawCanvas(){
drawings.forEach(element => {
ctx.setTransform(1, 0, 0, 1, 0, 0)
- ctx.translate(element.tr.x, element.tr.y)
- ctx.rotate(element.tr.a)
+
+ ctx.translate(tr.x, tr.y)
+ // ctx.translate(element.tr.x, element.tr.y)
+ ctx.rotate(tr.a)
+ // ctx.rotate(element.tr.a)
wall(element.x, element.y);
});
}
diff --git a/robot.js b/robot.js
index 11409c0..bd8149d 100644
--- a/robot.js
+++ b/robot.js
@@ -47,7 +47,6 @@ async function moveTo(x,y)
}
client.on('connect', () => {
- console.log(client)
console.log('Connecté au courtier MQTT');
client.subscribe('move')
});