Collaborative Stars - My Solution

[Yarden Ezra]

//ES6 can not be used

var table = document.getElementById('star_table');

var stars = table.getElementsByTagName('img');

var updateStarsUponResponse = function(){

     if (this.readyState == 4 && this.status == 200) {

        var starsStateByServer= this.responseText;

        for(var i=0; i< starsStateByServer.length;i++){

          stars[i].src = starsStateByServer[i] == 0 ? "star_off.gif" : "star_on.gif";

        }

     }

} 

var updateStarState =function(e){

  if(e.target.src){

    var req = new XMLHttpRequest();

    var starNewState=e.target.src.includes("off") ? "1" : "0";

    var params = "n="+ e.target.id.substring(5) + "&s="+starNewState;

    req.open("POST", "/collab.py", true);

    req.setRequestHeader("Content-type", "application/x-www-form-urlencoded");

    req.onreadystatechange = updateStarsUponResponse;

    req.send(params);

  }                               

}

var updateStarsByInterval = function(){

  var req = new XMLHttpRequest();

  req.open('GET', '/collab.py');

  req.onreadystatechange = updateStarsUponResponse;

  req.send();

}

table.addEventListener('click',updateStarState, false);

window.setInterval(updateStarsByInterval,5000);