My JavaScript code not working properly in my website hosted using 000webhost

Question

I made Connect Four game using HTML ,CSS and JavaScript(using jquery) which worked fine when I ran it locally from my device . But when I brought it to live server using 000webhost only a part of the code seems to work !! I strongly believe that the problem is with my JavaScript code !! However I have also shared my html code.

JavaScript Code :

//Input from players
alert("WELCOME PLAYERS!
If you don't know how to play this game kindly visit this website : https://en.wikipedia.org/wiki/Connect_Four");
var play1 = prompt("Player One : 'Blue'
Enter your name: ");
var play1Color = 'rgb(86, 151, 255)';

var play2 = prompt("Player Two : 'Red'
Enter your name: ");
var play2Color = 'rgb(237, 45, 73)';

if (play1 === play2) {
var play2 = prompt("Player name already exist ! ");
}

var game_on = true;
var table = $('table tr');

//RandomColorEffect for the header
function randomColor(){
  var color = "#" + Math.floor(Math.random()*16777251).toString(16);
  return color;
}

function colorChanger(){
colorInput = randomColor();
$("h1").css('color', colorInput);
}

setInterval(colorChanger(),500);

//Code for the MainGame

function win(rowNum,colNum){
console.log('You won starting at the row,col');
console.log(rowNum);
console.log(colNum);
}

function reportColor(rowIndex,colIndex){
  return table.eq(rowIndex).find('td').eq(colIndex).find('button').css('background-color');
}

function checkBottom(colIndex){

  for (var row = 5; row > -1; row--) {
   colorReport = reportColor(row,colIndex);
   if (colorReport === 'rgb(128, 128, 128)') {
     return row;
   }
 }
}


function matchChecker(one,two,three,four){
  return (one === two && one === three && one === four && one !== 'rgb(128, 128, 128)' && one !== undefined);
}

//CHECKING Functions

function horizCheck(){
  for (var row = 5; row > -1; row--) {
    for (var col = 0; col < 4; col++) {
    if (matchChecker(reportColor(row,col),reportColor(row,col+1),reportColor(row,col+2),reportColor(row,col+3))){
      console.log("Horizontal Win");
      win(row,col);
      return true;
    }else {
      continue;
      }
    }
  }
}

function vertiCheck(){
for (var col = 0; col < 7; col++) {
  for (var row = 5; row > 2; row--) {
   if (matchChecker(reportColor(row,col),reportColor(row-1,col),reportColor(row-2,col),reportColor(row-3,col))){
     console.log("Vertical Win");
     win(row,col);
     return true;
   }
   else{
     continue;
   }
  }
 }
}

function diagCheck(){
  for (var row = 0; row < 6; row++) {
    for (var col = 0; col < 7; col++) {
     if (matchChecker(reportColor(row,col),reportColor(row+1,col+1),reportColor(row+2,col+2),reportColor(row+3,col+3))) {
       console.log("Diagonal win!");
       win(row,col);
       return true;
      }
      else if (matchChecker(reportColor(row,col),reportColor(row-1,col+1),reportColor(row-2,col+2),reportColor(row-3,col+3))) {
        console.log("Diagonal win!");
        win(row,col);
        return true;
      }
      else{
        continue;
      }
    }
  }
}

function newColor(rowIndex,colIndex,color){
  return table.eq(rowIndex).find("td").eq(colIndex).find("button").css("background-color",color);
}

function winAlert(){
  alert(currentName + ' WON!
Refresh to Restart');
}


//GAME LOGIC

//START WITH PLAYERONE

var currentPlayer = 1;
var currentName = play1;
var currentColor = play1Color;

$("h3").text(currentName + ", It's your turn! Pick a column to drop in !");
$('button').on("click", function(){
  var col = $(this).closest("td").index();
  row = checkBottom(col);
  newColor(row,col,currentColor);
  if (horizCheck() || vertiCheck() || diagCheck()) {
    $("h3").text(currentName + ' WON!');
    $("h4").fadeOut();
    $("h1").fadeOut();
    console.log("Working");
    setInterval(winAlert(),1500);
  } else{
   currentPlayer = currentPlayer * -1;

  if (currentPlayer === 1) {
    currentName = play1;
    $("h3").text(currentName + ", It's your turn! Pick a column to drop in !");
    currentColor = play1Color;
  }else {
    currentName = play2;
    $("h3").text(currentName + ", It's your turn! Pick a column to drop in !");
    currentColor = play2Color;
  }
}
});

HTML CODE :


    
    CONNECT 4
    
    
    
    
  
  

 Welcome To Connect Four ! 
The object of this game is to connect four of your chips in a row!
Let's Go!

My JavaScript code not working properly in my website hosted using 000webhost

0 Answers