DHTML制作的俄罗斯方块(一)

abe整理

软件作者:[email protected]

软件特点:
  使用纯DHTML技术编写的俄罗斯方块游戏(不是Applet),你只要有IE就可以玩。可以通过它学习DHTML技术,JavaScript语言,CSS设计等。另外您可以看看作者是如何在没有指针和多维数组的情况下来完成它的,的确有些麻烦,如果用C语言也许200行就OK了。

软件使用:
  方向键控制游戏,Z,X分别是顺、逆时针旋转,空格键暂停。

<HTML>
<HEAD>
<META NAME="Title" CONTENT="JScript Simple Tetris">
<META NAME="主题" CONTENT="脚本语言版的俄罗斯方块">
<META NAME="CopyRightBy" CONTENT="Lucifer Xie">
<META NAME="Author Email" CONTENT="[email protected]">
<META NAME="Start" CONTENT="2001.2.1">
<META NAME="Complete" CONTENT="2001.2.3 20:55PM">
<META NAME="Latest Patch" CONTENT="2001.2.5 18:22PM">
<TITLE>Simple Tetris</TITLE>
<style>
body {margin:0;background:black;}
td {height:20;width:20;}
#block_div {position:absolute;z-index:1;width:80;}
#table_div {position:absolute;z-index:0;width:320;}
#nblock_div {position:absolute;z-index:2;font:48 system;color:red;}
#title_div {position:absolute;left:326;font:48 system;color:gold;filter:shadow(color=red);cursor:hand;}
#infobar_div {position:absolute;left:396;top:416;}
</style>

<SCRIPT ID=clientEventHandlersJS LANGUAGE=javascript>
<!--
/**************************************
* 全局变量
**************************************/
var n_width = 800;
var n_height = 600;
var n_left = Math.round( screen.width/2 ) - n_width/2;
var n_top = Math.round( screen.height/2 ) - n_height/2;
var n_IncStep = 20;
var curBlcok,nextBlock;
var arr_curBlock = new Array(0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0);
var curX,curY;
var speed=1;
var maxspeed=9;
var clr_per_line=18;
var pause=1;
var gameover=0;
var colors = new Array("#999999","#0000FF","#80FFFF","#80FF80","#FFFF00","#FF8000","#FF00FF","#FF0000"
);
var cid;
var ncid;
var blocks = new Array("tt_O1","tt_T2","tt_Z1","tt_S1","tt_L1","tt_J1","tt_I2");
var bid;
var killedlines=0;
/**************************************
* 数据结构
**************************************/
var tt_O1 = new Array(0,0,0,0,0,0,0,0,0,1,1,0,0,1,1,0);
var tt_O2 = new Array(0,0,0,0,0,0,0,0,0,1,1,0,0,1,1,0);
var tt_O3 = new Array(0,0,0,0,0,0,0,0,0,1,1,0,0,1,1,0);
var tt_O4 = new Array(0,0,0,0,0,0,0,0,0,1,1,0,0,1,1,0);

var tt_T1 = new Array(0,0,0,0,0,1,0,0,1,1,0,0,0,1,0,0);
var tt_T2 = new Array(0,0,0,0,0,0,0,0,1,1,1,0,0,1,0,0);
var tt_T3 = new Array(0,0,0,0,0,1,0,0,0,1,1,0,0,1,0,0);
var tt_T4 = new Array(0,0,0,0,0,1,0,0,1,1,1,0,0,0,0,0);

var tt_Z1 = new Array(0,0,0,0,1,1,0,0,0,1,1,0,0,0,0,0);
var tt_Z2 = new Array(0,0,0,0,0,0,1,0,0,1,1,0,0,1,0,0);
var tt_Z3 = new Array(0,0,0,0,0,1,1,0,0,0,1,1,0,0,0,0);
var tt_Z4 = new Array(0,0,1,0,0,1,1,0,0,1,0,0,0,0,0,0);

var tt_S1 = new Array(0,0,0,0,0,1,1,0,1,1,0,0,0,0,0,0);
var tt_S2 = new Array(0,0,0,0,0,1,0,0,0,1,1,0,0,0,1,0);
var tt_S3 = new Array(0,0,0,0,0,0,1,1,0,1,1,0,0,0,0,0);
var tt_S4 = new Array(0,1,0,0,0,1,1,0,0,0,1,0,0,0,0,0);

var tt_L1 = new Array(0,1,0,0,0,1,0,0,0,1,1,0,0,0,0,0);
var tt_L2 = new Array(0,0,0,0,0,0,1,0,1,1,1,0,0,0,0,0);
var tt_L3 = new Array(0,0,0,0,0,1,1,0,0,0,1,0,0,0,1,0);
var tt_L4 = new Array(0,0,0,0,0,1,1,1,0,1,0,0,0,0,0,0);

var tt_J1 = new Array(0,0,1,0,0,0,1,0,0,1,1,0,0,0,0,0);
var tt_J2 = new Array(0,0,0,0,1,1,1,0,0,0,1,0,0,0,0,0);
var tt_J3 = new Array(0,0,0,0,0,1,1,0,0,1,0,0,0,1,0,0);
var tt_J4 = new Array(0,0,0,0,0,1,0,0,0,1,1,1,0,0,0,0);

var tt_I1 = new Array(0,1,0,0,0,1,0,0,0,1,0,0,0,1,0,0);
var tt_I2 = new Array(0,0,0,0,0,0,0,0,0,0,0,0,1,1,1,1);
var tt_I3 = new Array(0,0,1,0,0,0,1,0,0,0,1,0,0,0,1,0);
var tt_I4 = new Array(0,0,0,0,0,0,0,0,0,0,0,0,1,1,1,1);

var table = new Array(
1,1,0,0,0,0,0,0,0,0,0,0,0,0,1,1,
1,1,0,0,0,0,0,0,0,0,0,0,0,0,1,1,
1,1,0,0,0,0,0,0,0,0,0,0,0,0,1,1,
1,1,0,0,0,0,0,0,0,0,0,0,0,0,1,1,
1,1,0,0,0,0,0,0,0,0,0,0,0,0,1,1,
1,1,0,0,0,0,0,0,0,0,0,0,0,0,1,1,
1,1,0,0,0,0,0,0,0,0,0,0,0,0,1,1,
1,1,0,0,0,0,0,0,0,0,0,0,0,0,1,1,
1,1,0,0,0,0,0,0,0,0,0,0,0,0,1,1,
1,1,0,0,0,0,0,0,0,0,0,0,0,0,1,1,
1,1,0,0,0,0,0,0,0,0,0,0,0,0,1,1,
1,1,0,0,0,0,0,0,0,0,0,0,0,0,1,1,
1,1,0,0,0,0,0,0,0,0,0,0,0,0,1,1,
1,1,0,0,0,0,0,0,0,0,0,0,0,0,1,1,
1,1,0,0,0,0,0,0,0,0,0,0,0,0,1,1,
1,1,0,0,0,0,0,0,0,0,0,0,0,0,1,1,
1,1,0,0,0,0,0,0,0,0,0,0,0,0,1,1,
1,1,0,0,0,0,0,0,0,0,0,0,0,0,1,1,
1,1,0,0,0,0,0,0,0,0,0,0,0,0,1,1,
1,1,0,0,0,0,0,0,0,0,0,0,0,0,1,1,
1,1,0,0,0,0,0,0,0,0,0,0,0,0,1,1,
        1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1)

/**************************************
* 功能函数
**************************************/
function dimension2(row,col,num){
var i = row * num + col;
return (this[i]);
}
Array.prototype.getd = dimension2;

function ShowBlock(x,y,block_type,color){
for (var i=0;i<block_tbl.rows.length;i++){
for (var j=0;j<block_tbl.rows(i).cells.length;j++){
var d2 = i * 4 + j;
if (block_type[d2]==1){
block_tbl.rows(i).cells(j).style.background = color;
}
else{
block_tbl.rows(i).cells(j).style.background = "";
}
}
}
block_div.style.pixelLeft=x;
block_div.style.pixelTop=y;
}

function ShowBlock1(x,y,block_type,color,obj_tabID,obj_divID){
for (var i=0;i<obj_tabID.rows.length;i++){
for (var j=0;j<obj_tabID.rows(i).cells.length;j++){
var d2 = i * 4 + j;
if (block_type[d2]==1){
obj_tabID.rows(i).cells(j).style.background = color;
}
else{
obj_tabID.rows(i).cells(j).style.background = "";
}
}
}
obj_divID.style.pixelLeft=x;
obj_divID.style.pixelTop=y;
}
  (未完待续)