Change header to players color

This commit is contained in:
H4CK3R-01 2021-07-11 18:28:23 +02:00 committed by H4CK3R-01
parent 6c2f8371c1
commit 62c783642f
3 changed files with 33 additions and 2 deletions

View File

@ -53,7 +53,7 @@ io.on('connection', socket => {
game[socket.room].addPlayerName(data.username); game[socket.room].addPlayerName(data.username);
addedUser = true; addedUser = true;
socket.emit('login'); socket.emit('login', game[socket.room].get_player_index(socket.username));
socket.join(socket.room); socket.join(socket.room);
io.in(socket.room).emit('updatePlayerNames', game[socket.room].getPlayerNames()); io.in(socket.room).emit('updatePlayerNames', game[socket.room].getPlayerNames());

View File

@ -12,6 +12,22 @@
background-size: cover; /* Generic*/ background-size: cover; /* Generic*/
} }
.red {
background-color: #F47A93;
}
.green {
background-color: #6C9A8B;
}
.blue {
background-color: #4169E1;
}
.yellow {
background-color: #FFDDA1;
}
@media only screen and (max-width: 980px) { @media only screen and (max-width: 980px) {
#game { #game {
height: auto; height: auto;

View File

@ -19,7 +19,7 @@ document.getElementById('ok').addEventListener('click', function () {
socket.emit('add user', {'username': username, 'room_name': room_name}); socket.emit('add user', {'username': username, 'room_name': room_name});
socket.on('login', function () { socket.on('login', function (data) {
connected = true; connected = true;
document.getElementById('login').style.display = 'none'; document.getElementById('login').style.display = 'none';
@ -29,6 +29,21 @@ document.getElementById('ok').addEventListener('click', function () {
resize(); resize();
addLogMessage("Welcome " + username + "!"); addLogMessage("Welcome " + username + "!");
switch (parseInt(data)) {
case 0:
document.getElementsByTagName('header')[0].classList.add('yellow');
break;
case 1:
document.getElementsByTagName('header')[0].classList.add('blue');
break;
case 2:
document.getElementsByTagName('header')[0].classList.add('green');
break;
case 3:
document.getElementsByTagName('header')[0].classList.add('red');
break;
}
}); });
socket.on('error', function (data) { socket.on('error', function (data) {