initial

public/js/index.js

@@ -7,10 +7,10 @@ let startGame = id => socket.emit('startGame', {id})
 connect.onchange = () => ({
     true(){
         socket = io() //connect
-        socket.on('hi',({id}) => ourId = id)
-        socket.emit('conn', {nick: nick.value})
+        socket.on('hi',({id}) => ourId = id) //our id from serverside 
+        socket.emit('conn', {nick: nick.value}) //our nick to  serverside
 
-        socket.on('gamers', gamers => nicksDiv.innerHTML = 
+        socket.on('gamers', gamers => nicksDiv.innerHTML =  //show gamers
             gamers.reduce((str, {nick, newGame, id, inGameWith}) => str + 
                `<div style="${inGameWith ? "color:#BBB" : ''}">${nick}
                     ${newGame && ourId !== id && !inGameWith ? 
@@ -21,14 +21,14 @@ connect.onchange = () => ({
                 </div>`,"")
         )
 
-        socket.on('startGame', ({inGameWith, turn}) => {
+        socket.on('startGame', ({inGameWith, turn}) => { //when someone else accept our game
             enemyId = inGameWith
             gameDiv.style.display = 'block';
             //time to init board
             send.disabled = true;
         })
 
-        socket.on('turn', data => {
+        socket.on('turn', data => { //our turn
             send.disabled = false;
             enemyData.innerHTML = data ? data.data : 'your turn';
         })