add stuff
This commit is contained in:
parent
f3959aaca0
commit
a46bda2669
4 changed files with 77 additions and 4 deletions
35
index.js
35
index.js
|
@ -4,8 +4,6 @@ var http = require('http').createServer(app);
|
|||
var io = require('socket.io')(http);
|
||||
var path = require('path');
|
||||
|
||||
var buffer = {};
|
||||
var users = {};
|
||||
var publicpath = path.join(__dirname, '/views');
|
||||
app.use('/', express.static(publicpath));
|
||||
|
||||
|
@ -13,10 +11,15 @@ app.get('/', (req, res) => {
|
|||
res.sendFile(__dirname + '/views/index.html');
|
||||
});
|
||||
|
||||
var buffer = {};
|
||||
var users = {};
|
||||
var targetcount = 0;
|
||||
|
||||
io.on('connection', (socket) => {
|
||||
console.log('Nutzer verbunden!');
|
||||
userConnected(socket.id);
|
||||
|
||||
|
||||
socket.on('disconnect', () => {
|
||||
console.log(socket.id, 'Nutzer verbindung unterbrochen');
|
||||
socket.broadcast.emit('cursor_remove', { id: socket.id });
|
||||
|
@ -37,8 +40,36 @@ io.on('connection', (socket) => {
|
|||
socket.on('nickname', function (data) {
|
||||
socket.broadcast.emit('nickname_set', { name: data, id: socket.id });
|
||||
});
|
||||
|
||||
socket.on('remove_target', function (data) {
|
||||
socket.broadcast.emit('remove_target', data);
|
||||
});
|
||||
|
||||
socket.on('test', function () {
|
||||
createTarget();
|
||||
});
|
||||
|
||||
function createTarget() {
|
||||
var pos = {};
|
||||
pos.x = getRandomArbitrary(10, 720);
|
||||
pos.y = getRandomArbitrary(10, 720);
|
||||
function getRandomArbitrary(min, max) {
|
||||
return Math.random() * (max - min) + min;
|
||||
}
|
||||
spawnTarget(pos);
|
||||
}
|
||||
|
||||
function spawnTarget(pos) {
|
||||
targetcount++;
|
||||
socket.emit('create_target', { id: targetcount, pos: pos });
|
||||
socket.broadcast.emit('create_target', { id: targetcount, pos: pos });
|
||||
};
|
||||
|
||||
|
||||
});
|
||||
|
||||
|
||||
|
||||
function userConnected(id) {
|
||||
users[id] = {
|
||||
Name: "unnamed",
|
||||
|
|
|
@ -10,6 +10,18 @@ function getNickname() {
|
|||
console.log(nickname);
|
||||
socket.emit('nickname', nickname);
|
||||
}
|
||||
function test() {
|
||||
socket.emit('test');
|
||||
console.log('test');
|
||||
}
|
||||
|
||||
function hit() {
|
||||
console.log(event.target.id);
|
||||
socket.emit('remove_target', event.target.id);
|
||||
var el = document.getElementById(event.target.id);
|
||||
el.remove();
|
||||
console.log("removeing", event.target.id);
|
||||
}
|
||||
|
||||
|
||||
document.addEventListener("DOMContentLoaded", function () {
|
||||
|
@ -40,6 +52,23 @@ document.addEventListener("DOMContentLoaded", function () {
|
|||
|
||||
}
|
||||
|
||||
socket.on('create_target', function (data) {
|
||||
var elementID = 'target-' + data.id;
|
||||
console.log('Creating ' + elementID);
|
||||
var target = document.createElement('div');
|
||||
target.id = elementID;
|
||||
target.className = 'target';
|
||||
target.onclick = hit;
|
||||
target.style.left = data.pos.x;
|
||||
target.style.top = data.pos.y;
|
||||
document.body.appendChild(target);
|
||||
});
|
||||
|
||||
socket.on('remove_target', function (data) {
|
||||
var el = document.getElementById(data);
|
||||
el.remove();
|
||||
console.log("removeing", data)
|
||||
});
|
||||
|
||||
socket.on('cursor_draw', function (data) {
|
||||
var mouse_el = CursorElement(data.id);
|
||||
|
|
|
@ -1,8 +1,11 @@
|
|||
body{
|
||||
cursor:cell;
|
||||
}
|
||||
.cursor {
|
||||
position: absolute;
|
||||
background: black;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
width: 5px;
|
||||
height: 5px;
|
||||
border-radius: 10px;
|
||||
text-align: center;
|
||||
}
|
||||
|
@ -22,3 +25,12 @@
|
|||
top: 0px;
|
||||
right: 0px;
|
||||
}
|
||||
|
||||
.target{
|
||||
position: absolute;
|
||||
background: green;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
border-radius: 40px;
|
||||
text-align: center;
|
||||
}
|
|
@ -5,6 +5,7 @@
|
|||
<body>
|
||||
<input id="nickname">
|
||||
<button onclick="getNickname()">Nick me</button>
|
||||
<button onclick="test()">test</button>
|
||||
|
||||
<canvas id="tracking"></canvas>
|
||||
</body>
|
Loading…
Reference in a new issue