Короче, новичок, пыхаюсь уже 2 дня, тут далее выложу то что есть.
До меня изображение перемещалось с помощью клавиш wasd.
Использую node.js socket.io express вроде всё.
Может,что нибудь не так написал, и т.д. Не понимаю...
Буду благодарен любому комментарию по теме.
Заранее спасибо за потраченное время!
То что наковеркал я:
Это server.js:
// Зависимости
let express = require('express');
let http = require('http');
let path = require('path');
let socketIO = require('socket.io');
let app = express();
let server = http.Server(app);
let io = socketIO(server);
app.set('port', 5000);
app.use('/static', express.static(__dirname + '/static'));
// Маршруты
app.get('/', function(request, response) {
response.sendFile(path.join(__dirname, 'index.html'));
});
// Запуск сервера
server.listen(5000, function() {
console.log('Запущен сервер, порт: 5000');
});
// Обработчик веб-сокетов
let players = {};
io.on('connection', function(socket) {
console.log('Новенький присоединился');
socket.on('new player', function() {
players[socket.id] = {
x: 870,
y: 315
};
});
socket.on('movement', function() {
console.log('Двигаюсь');
let player = players[socket.id] || {};
if (data.a) {
player.x = data.xpos;
player.y = data.ypos;
}
})
});
io.on('connection', function(socket) {
socket.on('disconnect', function() {
console.log('Пользователь вышел');
// удаляем отключившегося игрока
players[socket.id] = {
x: -1000,
y: -1000
};
});
});
setInterval(function() {
io.sockets.emit('state', players);
}, 1000 / 60);
Это game.js:
let socketio = io();
// Отслеживание координаты мыши
function init() {
if (document.layers) document.captureEvents(Event.MOUSEMOVE);
document.onmousemove = mousemove;
}
function mousemove(event) {
let mouse_x = mouse_y = 0;
if (document.attachEvent != null) {
mouse_x = window.event.clientX;
mouse_y = window.event.clientY;
} else if (!document.attachEvent && document.addEventListener) {
mouse_x = event.clientX;
mouse_y = event.clientY;
}
status = "x = " + mouse_x + ", y = " + mouse_y;
document.getElementById('xy').innerHTML = status;
}
init()
// движение
let movement = {
a: false,
xpos: mousemove(mouse_x),
ypos: mousemove(mouse_y)
}
document.addEventListener('mousedown', function() {
movement.a = true;
console.log('Мышкой нажал');
});
document.addEventListener('mouseup', function() {
movement.a = false;
console.log('Отпустил');
});
// Canvas
let canvas = document.getElementById('canvas');
canvas.width = 1754;
canvas.height = 1240;
let context = canvas.getContext('2d');
socketio.on('state', function(players) {
context.clearRect(0, 0, 1754, 1240);
context.fillStyle = 'black';
for (var id in players) {
var player = players[id];
context.beginPath();
context.arc(player.x, player.y, 15, 0, 2 * Math.PI);
context.fill();
}
context.fillStyle = 'red';
for (var id in players) {
var player = players[id];
context.beginPath();
context.arc(player.x + 0.15, player.y, 13, 0, 2 * Math.PI);
context.fill();
}
});
socketio.emit('new player');
setInterval(function() {
socketio.emit('movement', movement);
}, 1000 / 60);
