Home + Webmaster + Script + Javascript + Giochi + Tetrablox

Tetrablox

Grazie a questo script potrai integrare il gioco del tetris sul tuo sito, ricorda di scaricare anche le immagini.

Download codice sorgente
Download immagini

<!-- THREE STEPS TO INSTALL TETRABLOX:

1.  Copy the coding into the head of your html document

2.  Add the onLoad event handler into the body tag

3.  Put the last coding into the body of your html document  -->

<head>

<SCRIPT>
function captureKey(){
if (window.event.keyCode==80 || window.event.keyCode==112) pause();
if (gameOver==true) return false;
if (window.event.keyCode==87 || window.event.keyCode==119) return true;
if (window.event.keyCode==65 || window.event.keyCode==97) movePiece("left");
if (window.event.keyCode==83 || window.event.keyCode==115) lowerPiece();
if (window.event.keyCode==68 || window.event.keyCode==100) movePiece("right");
if (window.event.keyCode==32) rotatePiece();
}

function movePiece(direction){
if (gameOver==true) return false;
if (direction=="left"){
document.getElementById(currentPiece[0]).style.pixelLeft-=20;
document.getElementById(currentPiece[1]).style.pixelLeft-=20;
document.getElementById(currentPiece[2]).style.pixelLeft-=20;
document.getElementById(currentPiece[3]).style.pixelLeft-=20;
for (var i=0; i<4; i++)
if (document.getElementById(currentPiece[i]).style.pixelLeft<0 || play[24-(document.getElementById(currentPiece[i]).style.pixelTop/20)][document.getElementById(currentPiece[i]).style.pixelLeft/20]=="1")
movePiece("right");
}
if (direction=="right"){
document.getElementById(currentPiece[0]).style.pixelLeft+=20;
document.getElementById(currentPiece[1]).style.pixelLeft+=20;
document.getElementById(currentPiece[2]).style.pixelLeft+=20;
document.getElementById(currentPiece[3]).style.pixelLeft+=20;
for (var i=0; i<4; i++)
if (document.getElementById(currentPiece[i]).style.pixelLeft>180 || play[24-(document.getElementById(currentPiece[i]).style.pixelTop/20)][document.getElementById(currentPiece[i]).style.pixelLeft/20]=="1")
movePiece("left");
}
if (direction==null){

for (var i=0; i<4; i++){
if (document.getElementById(currentPiece[i]).style.pixelLeft>180) movePiece("left");
if (document.getElementById(currentPiece[i]).style.pixelLeft<0) movePiece("right");
if (document.getElementById(currentPiece[i]).style.pixelTop>480 || play[24-(document.getElementById(currentPiece[i]).style.pixelTop/20)][document.getElementById(currentPiece[i]).style.pixelLeft/20]=="1" && raiseTimes<10) raisePiece();
// if (document.getElementById(currentPiece[i]).style.pixelTop>480 || play[24-(document.getElementById(currentPiece[i]).style.pixelTop/20)][document.getElementById(currentPiece[i]).style.pixelLeft/20])&& raiseTimes>=10) {rotatePiece(true);rotatePiece(true);rotatePiece(true);}
}

}
}

var letterArray=new Array("c", "b", "a")
var pieceBin=new Array()
var currentPiece=new Array();
var currentBlock=0;
var pieceNum=6;
var pieceRotateNum;
var levelNum=0;
linesNum=0;
var nextPieceNum=Math.round(Math.random()*6);

var pieceCoords=new Array();
pieceCoords[0]="240x040-260x040-280x040-300x040";
pieceCoords[1]="240x040-260x040-240x060-260x060";
pieceCoords[2]="260x040-240x060-260x060-280x060";
pieceCoords[3]="240x040-260x040-260x060-280x060";
pieceCoords[4]="260x040-280x040-240x060-260x060";
pieceCoords[5]="240x040-240x060-260x060-280x060";
pieceCoords[6]="280x040-240x060-260x060-280x060";

document.getElementById(waitPiece[0]).style.pixelLeft=pieceCoords[nextPieceNum].substring(0,3);
document.getElementById(waitPiece[0]).style.pixelTop=pieceCoords[nextPieceNum].substring(4,7);
document.getElementById(waitPiece[1]).style.pixelLeft=pieceCoords[nextPieceNum].substring(8,11);
document.getElementById(waitPiece[1]).style.pixelTop=pieceCoords[nextPieceNum].substring(12,15);
document.getElementById(waitPiece[2]).style.pixelLeft=pieceCoords[nextPieceNum].substring(16,19);
document.getElementById(waitPiece[2]).style.pixelTop=pieceCoords[nextPieceNum].substring(20,23);
document.getElementById(waitPiece[3]).style.pixelLeft=pieceCoords[nextPieceNum].substring(24,27);
document.getElementById(waitPiece[3]).style.pixelTop=pieceCoords[nextPieceNum].substring(28,31);

if (document.getElementById(currentPiece[0]).style.pixelTop!=0)
for (var i=0; i<4; i++) {document.getElementById(currentPiece[i]).style.pixelTop-=40;
document.getElementById(currentPiece[i]).style.pixelLeft-=160;
if (pieceNum==0) {document.getElementById(currentPiece[i]).style.pixelLeft-=20;}
if (play[24-(document.getElementById(currentPiece[i]).style.pixelTop/20)][document.getElementById(currentPiece[i]).style.pixelLeft/20]=="1") {endGame(); break;}
}

}

function storePiece(){
if (gameOver==true) return false;
for (var i=0; i<4; i++)
play[24-(document.getElementById(currentPiece[i]).style.pixelTop/20)][document.getElementById(currentPiece[i]).style.pixelLeft/20]="1";
for (var i=24; i>=0; i--)
if (play[i][0]=="1" && play[i][1]=="1" && play[i][2]=="1" && play[i][3]=="1" && play[i][4]=="1" && play[i][5]=="1" && play[i][6]=="1" && play[i][7]=="1" && play[i][8]=="1" && play[i][9]=="1")
clearLine(i);
}

gameReallyOver=false;
var gameOver=false;
function endGame(){
blocks.innerhtml+="<table style=position:absolute;top:0;left:0 width=200 height=500 
style=font-family:Arial;color:#FFFFFF;font-size:12pt;font-weight:bold bgcolor=#000000><tr><td align='center'><p align=center style=color:#9999FF>GAME OVER</p><p align=center><input type=button value='New Game' onclick='window.location.href=window.location.href' style='font-family: Arial; color: #FFFFFF; font-size: 10pt; font-weight: bold; background-color: #003366; border-style: dashed; border-color: #FFFFFF'><br> <hr width=80%><P style='margin-left: 15; margin-right: 15'><small>Thankyou for play TetraBlox©.<br>      Visit </small> <a href=http://www.joffe.tk/ target=_blank><font color='#9898FF'><small>www.joffe.tk</small></font></a> <small> for more games.</small></p></td></tr></table>";
gameOver=true;
gameReallyOver=true;
}

var bgArray=new Array("bg0.jpg", "bg1.jpg", "bg2.jpg");
function clearLine(lineNum){
if (document.getElementById('soundList').options.selectedIndex==0 || linesNum%20!=0) document.getElementById('noise').innerhtml='<embed src="clearline.mp3" hidden>';
linesNum++;
if (linesNum%20==0) {levelNum++; document.getElementById("playBG").background=bgArray[levelNum%3]; document.getElementById('noise').innerhtml='<embed src="leveladvance.mp3" hidden>';}
document.getElementById("levelDis").innerhtml=levelNum;
document.getElementById("lineDis").innerhtml=linesNum;
for (var i=lineNum; i<24; i++)
play[i]=play[i+1]
play[24]=new Array()
for (var i=0; i<10; i++)
play[24][i]="0";

for (var i=0; i<currentBlock; i++)
if (document.getElementById(i)!=null){ 
if (document.getElementById(i).style.pixelTop==(24-lineNum)*20) {
document.getElementById(i).style.display="none";
document.getElementById(i).style.pixelTop=500;
pieceBin[pieceBin.length]=i}
if (document.getElementById(i).style.pixelTop<(24-lineNum)*20) document.getElementById(i).style.pixelTop+=20;
}
}

function rotatePiece(undomove){
if (pieceNum==1) return false;
var block0=new Array("-20x+20_000x000_+20x-20_+40x-40", "+20x-20_000x000_-20x+20_-40x+40");
var block2=new Array("+20x+20_-20x+20_000x000_+20x-20", "+20x-20_+20x+20_000x000_-20x-20", "-20x-20_+20x-20_000x000_-20x+20", "-20x+20_-20x-20_000x000_+20x+20");
var block3=new Array("+20x000_000x000_000x000_+20x-40", "-20x000_000x000_000x000_-20x+40");
var block4=new Array("000x000_-20x-40_-20x000_000x000", "000x000_+20x+40_+20x000_000x000");
var block5=new Array("000x+20_-20x000_000x-20_+20x-40", "+20x000_000x+20_-20x000_-40x-20", "000x-20_+20x000_000x+20_-20x+40", "-20x000_000x-20_+20x000_+40x+20");
var block6=new Array("+20x000_-40x+20_-20x000_000x-20", "000x-20_+20x+40_000x+20_-20x000", "-20x000_+40x-20_+20x000_000x+20", "000x+20_-20x-40_000x-20_+20x000");
var block=new Array(block0, null, block2, block3, block4, block5, block6)
document.getElementById(currentPiece[0]).style.pixelTop+=eval(block[pieceNum][pieceRotateNum].substring(0,3));
document.getElementById(currentPiece[0]).style.pixelLeft+=eval(block[pieceNum][pieceRotateNum].substring(4,7));
document.getElementById(currentPiece[1]).style.pixelTop+=eval(block[pieceNum][pieceRotateNum].substring(8,11));
document.getElementById(currentPiece[1]).style.pixelLeft+=eval(block[pieceNum][pieceRotateNum].substring(12,15));
document.getElementById(currentPiece[2]).style.pixelTop+=eval(block[pieceNum][pieceRotateNum].substring(16,19));
document.getElementById(currentPiece[2]).style.pixelLeft+=eval(block[pieceNum][pieceRotateNum].substring(20,23));
document.getElementById(currentPiece[3]).style.pixelTop+=eval(block[pieceNum][pieceRotateNum].substring(24,27));
document.getElementById(currentPiece[3]).style.pixelLeft+=eval(block[pieceNum][pieceRotateNum].substring(28,31));
pieceRotateNum++;
if ((pieceNum==0 || pieceNum==3|| pieceNum==4) && pieceRotateNum==2) pieceRotateNum=0;
if (pieceRotateNum==4) pieceRotateNum=0;
for (var i=0; i<4; i++) while (document.getElementById(currentPiece[i]).style.pixelTop<=0) for (var a=0; a<4; a++) document.getElementById(currentPiece[a]).style.pixelTop+=20;
if (undomove==null) movePiece();
}

function regulator(){
if (gameOver==true) {needRegulator=true; return false;}
lowerPiece();
var delaytime=1000-(5*linesNum)
if (delaytime<40) delaytime=40;
setTimeout("regulator()", delaytime);
}

var raiseTimes;
function raisePiece(){
document.getElementById(currentPiece[0]).style.pixelTop-=20;
document.getElementById(currentPiece[1]).style.pixelTop-=20;
document.getElementById(currentPiece[2]).style.pixelTop-=20;
document.getElementById(currentPiece[3]).style.pixelTop-=20;
raiseTimes++;
}

function lowerPiece(){
if (gameOver==true) return false;
for (var i=0; i<4; i++) document.getElementById(currentPiece[i]).style.pixelTop+=20;
for (var i=0; i<4; i++)
if (document.getElementById(currentPiece[i]).style.pixelTop>480 || play[24-(document.getElementById(currentPiece[i]).style.pixelTop/20)][document.getElementById(currentPiece[i]).style.pixelLeft/20]=="1") {
for (var ii=0; ii<4; ii++) document.getElementById(currentPiece[ii]).style.pixelTop-=20;
storePiece();
loadPiece();
break;
}
}

var play=new Array();
for (var a=0; a<25; a++) {play[a]=new Array(); for (var b=0; b<10; b++) play[a][b]="0";}

function setupGame(){
window.focus(); 
loadPiece();
loadPiece();
playClock();
setTimeout('regulator()',1000);
}

</SCRIPT>
</head>

<Tbody>

<Tbody>

<TR>

<TD>

<P align=center>Game Paused<BR><BR><INPUT style="FONT-WEIGHT: bold; FONT-SIZE: 10pt; BORDER-LEFT-COLOR: #ffffff; BORDER-BOTTOM-COLOR: #ffffff; COLOR: #ffffff; BORDER-TOP-STYLE: dashed; BORDER-TOP-COLOR: #ffffff; FONT-FAMILY: Arial; BORDER-RIGHT-STYLE: dashed; BORDER-LEFT-STYLE: dashed; BACKGROUND-COLOR: #003366; BORDER-RIGHT-COLOR: #ffffff; BORDER-BOTTOM-STYLE: dashed" onclick=window.focus();if(gameOver)pause() type=button value=Continue></P></TD></TR></Tbody></TABLE></TD>

<TD

style="FONT-WEIGHT: bold; FONT-SIZE: 12pt; COLOR: #9999ff; FONT-FAMILY: Arial"

align=middle
width=10>|<BR>|<BR>|<BR>|<BR>|<BR>|<BR>|<BR>|<BR>|<BR>|<BR>|<BR>|<BR>|<BR>|<BR>|<BR>|<BR>|<BR>|<BR>|<BR>|<BR>|<BR>|<BR>|<BR>|<BR>|<BR>|

</TD>

<TD

style="FONT-WEIGHT: bold; FONT-SIZE: 12pt; COLOR: #ffffff; FONT-FAMILY: Arial"

vAlign=top width=140 background="Tetrablox _files/bg.jpg">

<P style="MARGIN-TOP: 10px; MARGIN-LEFT: 20px; COLOR: #ccccff">Next 
Piece:</P><BR><BR>

<P style="MARGIN-TOP: 10px; MARGIN-LEFT: 20px; LINE-HEIGHT: 120%"><SPAN

style="COLOR: #ccccff">Lines:</SPAN> <SPAN id=lineDis>0</SPAN><BR><SPAN

style="COLOR: #ccccff">Level:</SPAN> <SPAN id=levelDis>0</SPAN><BR><SPAN

style="COLOR: #ccccff"> Time:</SPAN> <SPAN

id=timeDis>0:00:00</SPAN></P>

<P style="MARGIN-TOP: 10px; FONT-SIZE: 10pt; MARGIN-LEFT: 20px"><BIG

style="COLOR: #ccccff">Keys: </BIG><BR>Move Left - <SPAN

style="COLOR: #c0c0c0">[A]</SPAN><BR>Move Right - <SPAN

style="COLOR: #c0c0c0">[D]</SPAN><BR>Lower Piece - <SPAN

style="COLOR: #c0c0c0">[S]</SPAN><BR>Drop Piece - <SPAN
	  	  style="COLOR: #c0c0c0">[W]</SPAN><BR>Rotate - <SPAN

style="COLOR: #c0c0c0">[Space]</SPAN><BR>Pause - <SPAN

style="COLOR: #c0c0c0">[P]</SPAN></P>

style="MARGIN-TOP: 20px; FONT-SIZE: 12pt; MARGIN-LEFT: 20px; COLOR: #ccccff">Sound:

<SELECT id=soundList

style="FONT-WEIGHT: bold; FONT-SIZE: 10pt; BORDER-LEFT-COLOR: #ffffff; BORDER-BOTTOM-COLOR: #ffffff; COLOR: #ffffff; BORDER-TOP-STYLE: dashed; BORDER-TOP-COLOR: #ffffff; FONT-FAMILY: Arial; BORDER-RIGHT-STYLE: dashed; BORDER-LEFT-STYLE: dashed; BACKGROUND-COLOR: #003366; BORDER-RIGHT-COLOR: #ffffff; BORDER-BOTTOM-STYLE: dashed"

size=1> <OPTION selected>On</OPTION> <OPTION>Off</OPTION></SELECT></P>

2004<BR>Benjamin Joffe<BR><A style="COLOR: #9999ff"

href="http://www.joffe.tk/"

target=_blank>http://www.joffe.tk/</A></P></TD></TR></Tbody></TABLE><SPAN

id=blocks></SPAN><SPAN id=noise></SPAN>

<SCRIPT language=javascript>geovisit();</SCRIPT>

Compatibilità: MsIE | Netscape

Javascript

Altre risorse:
Libri Javascript | Manuale Javascript

E-Learning Scopri il catalogo dei corsi, da quello per webmaster a quelli di programmazione avanzata!

Hosting economico Aruba Approfitta delle offerte e scegli il tuo hosting Linux o Windows a partire da 20,66 € all'anno.

Javascript e DHTML Corso per imparare lo scripting lato client con Javascript adatto a qualsiasi livello di esperienza.