я хочу сделать движение пользователя за зелёный кружок, но у меня не получается. В консоли выдаёт
"Uncaught ReferenceError: io is not defined". Что я делаю не так?
app2.js:
let players = {};
io.on('connection', function(socket) {
socket.on('new player', function() {
players[socket.id] = {
x: 300,
y: 300
};
});
socket.on('movement', function(data) {
var player = players[socket.id] || {};
if (data.left) {
player.x -= 5;
}
if (data.up) {
player.y -= 5;
}
if (data.right) {
player.x += 5;
}
if (data.down) {
player.y += 5;
}
});
});
setInterval(function() {
io.sockets.emit('state', players);
}, 1000 / 60);
<html>
<head>
<title></title>
<style>
canvas {
width: 800px;
height: 600px;
border: 1px solid black;
}
</style>
</head>
<body>
<canvas id="canvas"></canvas>
</body>
<script src="app2.js"></script>
<script>
var movement = {
up: false,
down: false,
left: false,
right: false
}
document.addEventListener('keydown', function(event) {
switch (event.keyCode) {
case 65: // A
movement.left = true;
break;
case 87: // W
movement.up = true;
break;
case 68: // D
movement.right = true;
break;
case 83: // S
movement.down = true;
break;
}
});
document.addEventListener('keyup', function(event) {
switch (event.keyCode) {
case 65: // A
movement.left = false;
break;
case 87: // W
movement.up = false;
break;
case 68: // D
movement.right = false;
break;
case 83: // S
movement.down = false;
break;
}
});
socket.emit('new player');
setInterval(function() {
socket.emit('movement', movement);
}, 1000 / 60);
</script>
</html>
Простой
