$(document).ready(function() { alert("Still has bugs to fix"); alert("Better played with a keyboard for easier and faster controls. \n \n Use arrow keys for keyboard. \n\n Use up arrow key for rotate."); var canv = $("#canv")[0]; var width = 300; var height = 340; canv.width = width; canv.height = height; var c = canv.getContext("2d"); var w = 10; var h = 20; var s = 17; var offsetX = 3; var offsetY = 3; var x = 4; var y = 0; var score = 000000; var animate; var level = 1; var T = [ [1,1,1], [0,1,0], [0,0,0] ] var Z = [ [0,0,0], [2,2,0], [0,2,2] ] var S = [ [0,0,0], [0,3,3], [3,3,0] ] var O = [ [4,4], [4,4] ] var L = [ [0,5,0], [0,5,0], [0,5,5] ] var J = [ [0,6,0], [0,6,0], [6,6,0] ] var I = [ [0,7,0,0], [0,7,0,0], [0,7,0,0], [0,7,0,0] ] var colors = ["gray","violet","red","lime","yellow","orange","blue","cyan"]; var tetromino = [O,Z,S,T,L,J,I]; var newBlock; var next; var rand; function randomize() { rand = Math.round(Math.random()*6); } function randomPiece() { randomize(); newBlock = tetromino[rand]; } function nextBlock() { randomize(); next = tetromino[rand];; } nextBlock(); randomPiece(); function clear() { c.fillStyle = "black"; c.fillRect(0,0,width,height); } function drawBlock(matrix) { $.each(matrix, function(index,value) { var i = index; var v = value; $.each(v, function(index,value) { var i2 = index; var v2 = value; if(v2 !== 0) { c.beginPath(); c.rect((i2 + x)*s, (i + y)*s,s,s); c.fillStyle = colors[v2]; c.strokeStyle = "black"; c.fill(); c.stroke(); } }) }) } function drawField() { for(var i=0; i= h ) { return true; } if(field[i+y][j+x] !== 0 ) { return true; } } } } return false; } function merge(nb,f) { // console.log("x= "+ x); // console.log("y= "+ y); for(var i=0; i= w) { x--; } if(x + j < 0) { x++; } } } } } function restartGame() { clear(); x=4; y=0; field = playArea(); score = 0; level = 1; interval = 100; levelUp = 50; $("#alert").css("display","none"); MainAnimation(); } function gameOver() { clearInterval(animate); $("#alert").css("display","block"); } function rotate() { if(newBlock.length > 2) { if(newBlock.length === 3) { var temp = [[],[],[]]; } if(newBlock.length === 4) { var temp = [[],[],[],[]]; } for(var i=0; i= levelUp) { level++; levelUp += 50; interval -= 10; if(interval < 1) { interval = 1; } } if(timer == interval) { update(); timer = 0; } if(collision() == true) { merge(newBlock,field); backToTop(); clearRow(); } scoreUpdate(); drawLevel(); drawNextPiece(); drawField(); timer++; },1) } // end of MainAnimation function $("#left").on("click", function(e) { x--; boundary(); e.preventDefault(); }) $("#right").on("click", function(e) { x++; boundary(); e.preventDefault(); }) $("#down").on("click", function(e) { timer = 0; y += 2; if(collision()) { y--; } e.preventDefault(); }) $("#rotate").on("click", function(e) { rotate(); e.preventDefault(); }) $("#reset").on("click", function(e) { restartGame(); // e.preventDefault(); }) $(document).keydown(function(e) { switch(e.which) { case 37: x--; // left boundary(); break; case 38: rotate(); boundary(); break; case 39: x++; // right boundary(); break; case 40: // down timer = 0; y += 2; if(collision()) { y--; } break; } e.preventDefault(); }) MainAnimation(); })

My Tetris Game