var lastClicked;
var sum_K = 0;
var sum_IK = 0;
var number_K = 0;
var number_IK = 0;


function sendtracker() {
    liveSend({'value_K': sum_K, 'value_IK': sum_IK, 'correct_K': number_K, 'correct_IK': number_IK})
}

window.addEventListener("keydown",function (e) {
    if (e.keyCode === 114 || (e.ctrlKey && e.keyCode === 70)) {
        e.preventDefault();
    }
})

    var grid = clickableGrid(10, 10, function(el, cell_right, correct_IK, correct_K, sum_K, sum_IK, number_K, number_IK) {
      //console.log("You clicked on element:", el.innerHTML);
      //console.log("Cell to the right:", cell_right);
      //console.log("Correct IK", correct_IK);
      //console.log("Correct K", correct_K);
      console.log("Sum of K entries", sum_K);
      console.log("Sum of IK entries", sum_IK);
      console.log("correct K number", number_K);
      console.log("correct IK number", number_IK);
      if (el.className == 'clicked'){el.className =''}
      else el.className = 'clicked';

    });

    gridlocation.append(grid); // appends javascript grid to html <div> with the id "gridlocation"

    function clickableGrid(rows, cols, callback) {
      var grid = document.createElement('table');
      grid.className = 'grid';

      for (var r = 0; r < rows; ++r) {
        var tr = grid.appendChild(document.createElement('tr'));

        for (var c = 0; c < cols; ++c) {
          var cell = tr.appendChild(document.createElement('td'));
          cell.innerHTML = gridTemplate[c][r];
          function lettercount () {
              var cell_letter = gridTemplate[c][r];
              if (c < cols-1) {
                    var cell_letter_right = gridTemplate[c + 1][r];
                } else {
                    var cell_letter_right = "na";
                }
              if (cell_letter == "K") {
                  number_K++;
              } else if(cell_letter == "I" && cell_letter_right == "K"){
                  number_IK ++;
              }
          }
          lettercount();
          cell.addEventListener('click', (function(el, r, c) {
              return function() {
                var cell_selected = gridTemplate[c][r];
                if (c < cols-1) {
                    var cell_right = gridTemplate[c + 1][r];
                } else {
                    var cell_right = "na";
                }

                if (el.className == 'clicked'){
                    var is_clicked = 1;
                } else  var is_clicked = 0;

                if (cell_selected == "I" && cell_right == "K") {
                    var correct_IK = true;
                    function incrementIK(){ //does the cumulative counting of correct letters
                        if (is_clicked == 0)
                            {sum_IK ++}
                        else sum_IK = sum_IK - 1;
                        sendtracker();
                        }
                    incrementIK();
                } else if (cell_selected == "I" && cell_right != "K")  {
                    var correct_IK = false;
                } else {
                    var correct_IK = "na";
                }

                if (cell_selected == "K") {
                    var correct_K = true;
                    function incrementK(){
                        if (correct_K == true && is_clicked == 0)
                            {sum_K ++}
                        else sum_K = sum_K - 1;
                        sendtracker();

                        }
                    incrementK();
                } else {
                    var correct_K = false;
                }


                callback(el, cell_right, correct_IK, correct_K, sum_K, sum_IK, number_K, number_IK);
            }
          })
          (cell, r, c), false);
        }
      }
      sendtracker();
      return grid;
    }