Вот мой файл app.js (express, socket.io):
var express = require('express');
var app = express();
var serv = require('http').Server(app);
app.get('/', function(req, res) {
res.sendFile(__dirname + '/client/index.html');
});
app.use('/client', express.static(__dirname + '/client'));
serv.listen(2000);
console.log('Server has started.');
var socket_list = {};
var io = require('socket.io')(serv, {});
io.on('connection', function(socket) {
socket.id = Math.random();
socket.x = 0;
socket.y = 0;
socket.number = "" + Math.floor(10 * Math.random());
socket_list[socket.id] = socket;
socket.on('disconnect', function() {
delete socket_list[socket.id];
});
});
setInterval(function() {
var pack = [];
for(var i in socket_list) {
var socket = socket_list[i];
socket.x++;
socket.y++;
pack.push({
x: socket.x,
y: socket.y,
number: socket.number
})
};
for(var i in socket_list) {
var socket = socket_list[i];
socket.emit('newPositions', pack);
};
}, 25);socket.on('connect', function() { connectCounter++; });
, а это мой файл index.html:
<!DOCTYPE html>
<html>
<head>
<title>Multiplayer | HTML5</title>
<script src="https://cdn.socket.io/socket.io-1.4.5.js"/>
</head>
<body>
<canvas id="ctx" width="512" height="512" style="border: 1px solid #000;"/>
<script type="text/javascript">
var ctx = document.getElementById('ctx').getContext('2d');
ctx.font = '24px Calibri';
var socket = io();
socket.on('newPositions', function(data) {
ctx.clearRect(0,0,512,512);
for(var i = 0; i < data.length; i++)
ctx.fillText(data[i].number, data[i].x, data[i].y);
});
</script>
</body>
</html>
Предполагается конечный результатчтобы получить случайное число, затем оно отображается на холсте и медленно перемещается к правому нижнему углу экрана.
Если другой игрок присоединился с другого устройства (или просто с новой вкладки)тогда он будет иметь случайно сгенерированный номер первого игрока, а также номер второго игрока.Оба, вероятнее всего, будут разными числами.
Пример этого происходит в конце этого видео: 8:23 - https://youtu.be/_GioD4LpjMw?t=503
По неизвестной причине номер, который должен отображатьсяна холсте "неопределено".