var table_Width = 30; var table_Height = 30; var table_Max = table_Width * table_Height; var speed = 70; // Higher = Slower var maxSpeed = 50; // Lower = Faster var headSnake = 4; var max_Cells = table_Width * table_Height; var cell_Id = 0; // Counter ID For initCreate() var arr = []; var loopMovement; var playerBoard = (table_Width * table_Height) - (table_Width / 2) - 3; var boardSize = 6; var ball = 255; var fire; var _fire;//fire's interval var downRight = table_Width + 1; var downLeft = table_Width - 1; var upRight = -table_Width + 1; var upLeft = -table_Width - 1; var directionBall = upRight; var blocks = [94, 98, 102, 106, 110, 114, 184, 188, 192, 196, 200, 204, 274, 278, 282, 286, 290, 294, 364, 368, 372, 376, 380, 384]; function initCreate() { document.getElementById("tabl").innerHTML = ""; var tab = document.getElementById("tabl"); for (i = 0; i < table_Height; i++) { var trtr = document.createElement("tr"); for (j = 0; j < table_Width; j++) { var a = document.createElement("td"); a.setAttribute("id", "ta" + cell_Id); arr.push(a); cell_Id++; trtr.appendChild(a); } tab.appendChild(trtr); } // Player Create arr[ball].style.backgroundColor = "red"; for (i = 0; i < blocks.length; i++) { blocks[i] = Math.ceil(Math.random() * 400); arr[blocks[i]].style.backgroundColor = "green"; arr[blocks[i] + 1].style.backgroundColor = "green"; } for (i = 0; i < boardSize; i++) { arr[playerBoard + i].style.backgroundColor = "black"; } } function changeDiraction(directUpDown) { if (directionBall == upRight && directUpDown == 1) { directionBall = downRight; return; } if (directionBall == upLeft && directUpDown == 1) { directionBall = downLeft; return; } if (directionBall == downRight && directUpDown == 1) { directionBall = upRight; return; } if (directionBall == downLeft && directUpDown == 1) { directionBall = upLeft; return; } if (directionBall == downRight) { directionBall = downLeft; return; } if (directionBall == downLeft) { directionBall = downRight; return; } if (directionBall == upRight) { directionBall = upLeft; return; } if (directionBall == upLeft) { directionBall = upRight; return; } } function cheackHitBorad() { var hit; for (i = 0; i < boardSize; i++) { hit = ((playerBoard + i) == ball + directionBall); if (hit == true) { return true; } } return hit; } function ballMovement() { arr[ball].style.backgroundColor = "white"; ball += directionBall; document.getElementById('ta' + ball).style.borderRadius = '1em'; // Right Side Check if ((ball + directionBall) % table_Width == 0) { changeDiraction(); } // Left Side Check if (ball % table_Width == 0) { changeDiraction(); } // Up Side Check if ((ball + directionBall) < 0) { changeDiraction(1); } // Down Side (Loose) Check if ((ball + directionBall) > (table_Width * table_Height)) { console.log("LOOSERRRRRRRR"); clearInterval(_ballMovement); } // Board Hit By Ball Check if (ball > (table_Max - (table_Width * 2)) && cheackHitBorad()) { changeDiraction(1); } // Blocks Hit Check for (i = 0; i < blocks.length; i++) { if ((ball + directionBall) == blocks[i] || (ball + directionBall) == (blocks[i] + 1)) { if (ball - blocks[i] == table_Width || ball - blocks[i] > 0) { console.log(i); changeDiraction(1); } else if (ball - blocks[i] == -table_Width || ball - blocks[i] < 0) { changeDiraction(1); } arr[blocks[i]].style.backgroundColor = "white"; arr[blocks[i] + 1].style.backgroundColor = "white"; blocks.splice(i, 1); } } arr[ball].style.backgroundColor = "red"; } function movement(side) { for (i = 0; i < boardSize; i++) { arr[playerBoard + i].style.backgroundColor = "white"; } playerBoard += side; console.log(playerBoard); if (playerBoard < table_Max - table_Width) { playerBoard++; } if (playerBoard + boardSize > (table_Width * table_Height)) { playerBoard--; } for (i = 0; i < boardSize; i++) { arr[playerBoard + i].style.backgroundColor = "black"; } } function _fire_(){ if (fire < 0) { arr[fire +table_Width].style.backgroundColor = 'white'; arr[(fire+boardSize) +table_Width].style.backgroundColor = 'white'; clearInterval(_fire); } else{ console.log('here'); fire -=table_Width; arr[fire].style.backgroundColor = 'orange'; arr[(fire+boardSize)].style.backgroundColor = 'orange'; arr[(fire+boardSize)+table_Width].style.backgroundColor = 'white'; arr[fire +table_Width].style.backgroundColor = 'white'; } } function keyListen(event) { switch (event.keyCode) { case 37: //left movement(-1); break; case 39: //right movement(1); break; case 32: //fire fire = playerBoard; _fire = setInterval(_fire_,10); break; // case 40: //down // movement(table_Width); // break; case 80: //down clearInterval(_ballMovement); break; } } initCreate(); var _ballMovement = setInterval(ballMovement, speed);