client.js

let socket = io();

let alfabet = ['a', 'ą', 'b', 'c', 'ć', 'd', 'e', 'ę', 'f', 'g', 'h', 'i', 'j', 'k', 'l', 'ł', 'm', 'n', 'ń', 'o', 'ó', 'p', 'q', 'r', 's', 'ś', 't', 'u', 'v', 'w', 'x', 'y', 'z', 'ź', 'ż'];

let form = document.getElementById('form');
let input = document.getElementById('input');
let chat = document.getElementById('chat');
let players = document.getElementById('players');
let chooseNick = document.getElementById('Nickname');
let nickInput = document.getElementById('Nickinput');
let bool = true;
let GameStartFlag = true;
let canWrite = true;
let Nick = '';

let points = 0;

// Pozyskiwanie wszystkich klientów w pokoju (raz po wczytaniu)
socket.on('clients', function(clients){
    console.log(clients);
    if(bool)
    {
        for(i in clients.name)
        {
            let item = document.createElement('p');
            item.textContent = clients.name[i] + ' punkty: ' + clients.score[i];
            players.appendChild(item);
        }
        bool = false;
    }
});
// Ustawianie nicku i usunięcie pola do podania nazwy
chooseNick.addEventListener('submit', function(e){
    e.preventDefault();
    if(nickInput.value)
    {
        Nick = nickInput.value;
        socket.emit('nickname', nickInput.value)
        nickInput.remove();
        chooseNick.remove();
    }
});
// dodawanie nicków do tablicy z graczami
socket.on('nickname', function(nick){
    let item = document.createElement('p');
    item.textContent = nick + ' punkty: 0';
    item.setAttribute("id", nick);
    players.appendChild(item);
});

// usuwanie rozłączonych graczy
socket.on('clientOut',function(nick){
    document.getElementById(nick).remove();
});

// wysyłanie wiadomości
form.addEventListener('submit', function(e) {
    e.preventDefault();
    if (input.value && canWrite) {
        let message = {
            text: input.value,
            name: 'nick'
        };
        socket.emit('chat message', message);
        input.value = '';
    }
});

// odbieranie wiadomości i wyświetlanie na czacie
socket.on('chat message', function(msg) {
    let item = document.createElement('p');
    item.textContent = msg.name + ': ' + msg.text;
    chat.appendChild(item);
});
// rozpoczęcie gry, otrzymanie informacji kto rysuje i co
socket.on('gameStart', function(gameStatus){
    if(GameStartFlag)
    {
        GameStartFlag = false;
        let whoDraw = document.querySelector('.painter');
        let choosenWord = document.querySelector('.word');
        let gameCount = document.getElementById('games');
        gameCount.textContent = 'Pozostało ' + gameStatus.games + ' gier';
        whoDraw.textContent += gameStatus.painter;
        if(Nick == gameStatus.painter)
        {
            choosenWord.textContent += gameStatus.word;
            canWrite = false;
        }
        else
        {
            canWrite = true;
            let codedWord = '';
            for(i in gameStatus.word)
            {
                for(j in alfabet)
                {
                    if(gameStatus.word[i] == alfabet[j])
                    {
                        codedWord += '_ '
                    }
                    else if(gameStatus.word[i] == ' ')
                    {
                        codedWord += ' ';
                    }
                }
            }
            choosenWord.textContent += codedWord;
        }
    }
});
socket.on('gameStop', function(winnerStatus){
    let whoDraw = document.querySelector('.painter');
    let choosenWord = document.querySelector('.word');
    whoDraw.textContent = 'Rysuje: ';
    choosenWord.textContent = 'Słowo: ';

    let winner = document.getElementById(winnerStatus.name);
    winner.textContent = winnerStatus.name + ' punkty: '+ winnerStatus.score;
    GameStartFlag = true;
});

// po odgadnięciu hasła przez gracza
socket.on('RightGuess', function(msg){
    let item = document.createElement('p');
    item.style.color = 'green';
    item.textContent = msg.name + ' odgadł hasło!';
    chat.appendChild(item);

    canWrite = false;
});