http://www.myjavaserver.com/~ligq/els.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE>俄罗斯方块</TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="jam_li">
<META NAME="Keywords" CONTENT="俄罗斯方块">
<META NAME="Description" CONTENT="俄罗斯方块">
<SCRIPT LANGUAGE="JavaScript">
<!--
function setCookie(sName, sValue){
document.cookie = sName + '=' + escape(sValue) + '; expires=Fri, 31 Dec 9999 23:59:59 GMT;';
}
function getCookie(sName){
var aCookie = document.cookie.split('; ');
for (var i=0; i<aCookie.length; i++){
var aCrumb = aCookie[i].split('=');
if (sName == aCrumb[0])
return unescape(aCrumb[1]);
}
}
function delCookie(sName){
document.cookie = sName + '=' +1 + '; expires=Fri, 31 Dec 1999 23:59:59 GMT;';
}
if(isNaN(getCookie('hScore'))){
setCookie('hScore',0);
}
if(isNaN(getCookie('hLevel'))){
setCookie('hLevel',0);
}
//-->
</SCRIPT>
<SCRIPT LANGUAGE="JavaScript">
<!--
var tRows=23;//背景行数
var tCells=15;//背景列数
var gRun=false;//运行许可
var gStop=true;//是否是停止状态
var gSpeed=1000;//游戏速度
var timer;//定时器
var sLevel=0;//消去总层数
var sScore=0;//得分总数
var arr=new Array();
arr[0]=new Array();//砖块1
arr[1]=new Array();//2
arr[2]=new Array();//3
arr[3]=new Array();//4
var initB=new Array();
initB[0]=new Array();//砖块1
initB[1]=new Array();//2
initB[2]=new Array();//3
initB[3]=new Array();//4
//-->
</SCRIPT>
</HEAD>
<BODY bgcolor="black" text="#ffffff">
<table width="100%" height="100%">
<tr><td width="100%" align="center">
<table border bordercolor="green" cellSpacing="0" cellPadding="0">
<tr align="center">
<td valign="top" align="right">
<table frame="below" cellSpacing="0" rules="cols" >
<tr>
<td>
<span id="Hscoreboard" style="background-color:#999900;font-size:14px;text-align:left;color:#006600;width:105;">HScore:0<br>HLevel:0</span>
</td>
<td>
<span id="scoreboard" style="background-color:#999900;font-size:14px;text-align:left;color:#006600;width:105;">Score:0<br>Level:0</span>
</td>
</tr>
</table>
<!---->
<table width="100%" >
<tr>
<td align="center">
<input type="button" value="开始(Pause)" οnclick="toPlayorPause()" id="ppgame" style="width:90;border-style:solid;background:#330066;color:green;border-color:green;border-width:1px">
<br>
<input type="button" value=" 停止(Esc) " οnclick="toStop()" id="sgame" style="width:90;border-style:solid;background:#330066;color:green;border-color:green;border-width:1px" disabled>
</td>
<td>
<table border="1" cellSpacing="0" cellPadding="0" id="tBlock" style="background:gray">
<script>
for(var i=0;i<4;i++){//画行
document.write("<tr>");
for(var j=0;j<4;j++){//画列
document.write("<td width='20' height='20' style='background:gray'></td>");
}
document.write("</tr>");
}
</script>
</table>
</td>
</tr>
</table>
<!---->
<span id="game_tip" style="background:#330066;color:#ffffff;text-align:left;font-size:13px;width=210px;border-width:1px;border-color:green;border-style:solid;">基本操作:<br><font color=#00CC00>Pause</font>:开始/暂停;<font color=#00CC00>Esc</font>:停止;<br><font color=#00CC00>←</font>:左移;<font color=#00CC00>→</font>:右移;<font color=#00CC00>↓</font>:加速下移;<br><font color=#00CC00>Space</font>:直接下落</span>
<br>
<i style="color:pink"><a href="mailto:jam_li@163.com">by ligq</a></i><br>
<fieldset id="topBoard" align="center" style="border-width:2px;width:208px;font-size:13px;text-align:left;border-color:#00CC00">
<legend>积分排行榜</legend>
<span style="background:#CC0000;width:100%">排列顺序:姓名,层数,分数,日期</span><br>
<span id="top" style="background:#8080C0;width:100%">1:----,----,----</span><br>
<span id="top" style="background:#1B8DBE;width:100%">2:----,----,----</span><br>
<span id="top" style="background:#8080C0;width:100%">3:----,----,----</span><br>
<span id="top" style="background:#1B8DBE;width:100%">4:----,----,----</span><br>
<span id="top" style="background:#8080C0;width:100%">5:----,----,----</span><br>
<span id="top" style="background:#1B8DBE;width:100%">6:----,----,----</span><br>
<span id="top" style="background:#8080C0;width:100%">7:----,----,----</span><br>
<span id="top" style="background:#1B8DBE;width:100%">8:----,----,----</span><br>
<span id="top" style="background:#8080C0;width:100%">9:----,----,----</span><br>
<span id="top" style="background:#1B8DBE;width:100%">10:----,----,----</span><br>
</fieldset>
</td>
<td align="left">
<table border=1 cellSpacing=0 cellPadding=0 id="tSpace" style="background:gray">
<script>
for(var i=0;i<tRows;i++){//画行
document.write("<tr>");
for(var j=0;j<tCells;j++){//画列
document.write("<td width='20' height='20' style='background:gray'></td>");
}
document.write("</tr>");
}
</script>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
<span id="mytip" style="background-color:green;position:absolute;top:200;left:450;font-size:30px;color:pink"></span>
</BODY>
</HTML>
<script language="javascript">
//预初始化一个砖块
function initBrick(){
var n=Math.ceil(Math.random()*7);
switch (n){
case 1:
initB[0][0]=0;initB[0][1]=0;initB[1][0]=1;initB[1][1]=0;
initB[2][0]=0;initB[2][1]=1;initB[3][0]=1;initB[3][1]=1;
break;
case 2:
initB[0][0]=0;initB[0][1]=0;
initB[1][0]=0;initB[1][1]=1;initB[2][0]=1;initB[2][1]=1;
initB[3][0]=1;initB[3][1]=2;
break;
case 3:
initB[0][0]=1;initB[0][1]=0;
initB[2][0]=0;initB[2][1]=1;initB[1][0]=1;initB[1][1]=1;
initB[3][0]=0;initB[3][1]=2;
break;
case 4:
initB[0][0]=0;initB[0][1]=0;
initB[1][0]=0;initB[1][1]=1;
initB[2][0]=0;initB[2][1]=2;
initB[3][0]=0;initB[3][1]=3;
break;
case 5:
initB[0][0]=0;initB[0][1]=0;initB[1][0]=1;initB[1][1]=0;
initB[2][0]=1;initB[2][1]=1;
initB[3][0]=1;initB[3][1]=2;
break;
case 6:
initB[1][0]=0;initB[1][1]=0;initB[0][0]=1;initB[0][1]=0;
initB[2][0]=0;initB[2][1]=1;
initB[3][0]=0;initB[3][1]=2;
break;
case 7:
initB[0][0]=1;initB[0][1]=0;
initB[1][0]=0;initB[1][1]=1;initB[2][0]=1;initB[2][1]=1;initB[3][0]=2;initB[3][1]=1;
break;
}
}
//绘制砖块1:田,2:ㄣ,3:反ㄣ,4:┃,5:7,6:反7,7:┻
function makeB(){
checkFull();
//初始块2正式块
for(var i=0;i<4;i++){
arr[i][0]=initB[i][0];
arr[i][1]=initB[i][1];
}
initBrick();
showTB();
if(!nSpace()){
gRun=false;
clearTimeout(timer);
showB();
document.getElementById("mytip").innerHTML="游戏停止 ...";
cSaveTop();
updateBoard();
//alert("GAME OVER");
}
}
//显示当前方块
function showB(){
tSpace.rows[arr[0][1]].cells[arr[0][0]].style.background='red';
tSpace.rows[arr[1][1]].cells[arr[1][0]].style.background='red';
tSpace.rows[arr[2][1]].cells[arr[2][0]].style.background='red';
tSpace.rows[arr[3][1]].cells[arr[3][0]].style.background='red';
}
//显示预初始化方块
function showTB(){
for(var i=0;i<tBlock.rows.length;i++)
for(var j=0;j<tBlock.rows[i].cells.length;j++){
tBlock.rows[i].cells[j].style.background=tBlock.style.background;}
for(var i=0;i<4;i++){
tBlock.rows[initB[i][1]].cells[initB[i][0]+1].style.background='red';
}
}
//抹去当前方块
function hideB(){
tSpace.rows[arr[0][1]].cells[arr[0][0]].style.background=tSpace.style.background;
tSpace.rows[arr[1][1]].cells[arr[1][0]].style.background=tSpace.style.background;
tSpace.rows[arr[2][1]].cells[arr[2][0]].style.background=tSpace.style.background;
tSpace.rows[arr[3][1]].cells[arr[3][0]].style.background=tSpace.style.background;
}
//整体下移n行,有用?没用?晕~~~
function moveAll(n){
}
//砖块上移
function moveBU(){
hideB();
if(arr[0][1]>0&&arr[1][1]>0&&arr[2][1]>0&&arr[3][1]>0){arr[0][1]--;arr[1][1]--;arr[2][1]--;arr[3][1]--;}
showB();
}
//砖块下移
function moveB(){
if(!nSpace()) return;
hideB();
//if(arr[0][1]<tRows-1&&arr[1][1]<tRows-1&&arr[2][1]<tRows-1&&arr[3][1]<tRows-1)
{arr[0][1]++;arr[1][1]++;arr[2][1]++;arr[3][1]++;}
showB();
}
//砖块水平移动
function moveBP(n){
if(!checkLR(n)) return ;
hideB();
if((!(arr[0][0]<=0||arr[1][0]<=0||arr[2][0]<=0||arr[3][0]<=0)&n<0)||(!(arr[0][0]>=tCells-1||arr[1][0]>=tCells-1||arr[2][0]>=tCells-1||arr[3][0]>=tCells-1)&n>0)){
arr[0][0]+=n;arr[1][0]+=n;arr[2][0]+=n;arr[3][0]+=n;
}
showB();
}
//砖块直接下落
function moveBD(){
while(nSpace()) {moveB();}
makeB();showB();
}
//顺时针旋转
function rotateD(){
//-------------------------------------------
//这部分检查有没有旋转的余地,有则继续运行,没有则返回
var temp=new Array();
temp[0]=new Array();//砖块1
temp[1]=new Array();//2
temp[2]=new Array();//3
temp[3]=new Array();//4
temp[2][0]=arr[2][0];temp[2][1]=arr[2][1];
for(var i=0;i<4;i++){
if(i==2) continue;
temp[i][0]=arr[2][1]+arr[2][0]-arr[i][1];
temp[i][1]=arr[2][1]-arr[2][0]+arr[i][0];
if(temp[i][0]<0||temp[i][0]>tCells-1) return false;
if(temp[i][1]<0||temp[i][1]>tRows-1) return false;
}
for(var i=0;i<4;i++){
if(i==2) continue;
var s=false;
for(var j=0;j<4;j++){
if(j==2||j==i) continue;
if(temp[i][0]==arr[j][0]&&temp[i][1]==arr[j][1]) s=true
}
if(!s){
//alert();
if(tSpace.rows[temp[i][1]].cells[temp[i][0]].style.background!=tSpace.style.background) return false;
}
}
//-------------------------------------------
hideB();
for(var i=0;i<4;i++){
arr[i][0]=temp[i][0];
arr[i][1]=temp[i][1];
}
showB();
}
//逆时针旋转
function rotateC(){
}
//检查砖块是否可以向左(-1)或右(1)移动
function checkLR(w){
for(var i=0;i<4;i++)
if(arr[i][0]+w>tCells-1||arr[i][0]+w<0) return false;
for(var i=0;i<4;i++){
var s=true;
for(var j=0;j<4;j++){
if(i==j) continue;
if(arr[i][0]+w==arr[j][0]&&arr[i][1]==arr[j][1]){
s=false;
break;
}
}
if(s){
if(tSpace.rows[arr[i][1]].cells[arr[i][0]+w].style.background!=tSpace.style.background){
return false;
}
}
}
return true;
}
//砖块是否在底部
function brickInB(){
if(arr[0][1]==tRows-1||arr[1][1]==tRows-1||arr[2][1]==tRows-1||arr[3][1]==tRows-1){
return true;
}else{
return false;
}
}
//查看砖块是否有下移空间true有false没有
function nSpace(){
for(var i=0;i<4;i++){
var s=true;
for(var j=0;j<4;j++){
if(i==j) continue;
if(arr[i][0]==arr[j][0]&&arr[i][1]+1==arr[j][1]){
s=false;
break;
}
}
if(s&&!brickInB()){
if(tSpace.rows[arr[i][1]+1].cells[arr[i][0]].style.background!=tSpace.style.background){
return false;
}
}
}
if(brickInB()) return false;
return true;
}
//检查是否有可消去的层,并消去,记录得分情况
function checkFull(){
var thisLevel=0;//本次消去的层数
for(var i=0;i<tRows;i++){
var canK=true;
for(var j=0;j<tCells;j++){
if(tSpace.rows[i].cells[j].style.background==tSpace.style.background){canK=false;break;}
}
if(canK) { killStyle(i);thisLevel++}
}
sLevel+=thisLevel;
sScore+=thisLevel*thisLevel*50+thisLevel*50;
document.getElementById("scoreboard").innerHTML="Score:"+sScore+"<br>Level:"+sLevel;
//showH();
}
//消去第n+1层
function killStyle(n){
for(var i=n;i>0;i--){
for(var j=0;j<tCells;j++){
tSpace.rows[i].cells[j].style.background=tSpace.rows[i-1].cells[j].style.background;
}
}
for(var j=0;j<tCells;j++){
tSpace.rows[0].cells[j].style.background=tSpace.style.background;
}
}
//最高分数显示
function showH(){
var hScore=getHScore().split(',')[1];
var hLevel=getHScore().split(',')[0];
document.getElementById("Hscoreboard").innerHTML="Score:"+hScore+"<br>Level:"+hLevel;
}
//取得历史最高分
function getHScore(){
var hScore=0;
var hLevel=0;
for(var i=1;i<10;i++){
var tScore=getCookie('Top'+i).split(',')[2];
var tLevel=getCookie('Top'+i).split(',')[1];
if(tScore>hScore)
hScore=tScore;
if(tLevel>hLevel)
hLevel=tLevel;
}
return hScore+","+hLevel;
}
//cookies里最高分数排名初始化
function initTop(){
for(var i=1;i<=10;i++){
setCookie("Top"+i,"nobody,0,0,----/--/--");
}
}
//查看当前分数在成绩榜中的排名
function checkRow(){
var ts=1;
for(var i=1;i<=10;i++){
var tScore=getCookie('Top'+i).split(',')[2];
if(tScore>=sScore)
ts++;
}
return ts;
}
//替换前十名中的第n名:name,level,score
function replaceTop(n,name,level,score){
for(var i=10;i>n;i--){
var bS=getCookie('Top'+(i-1));
setCookie('Top'+i,bS);
}
var date=new Date();
var theDate=date.getYear()+"/"+(date.getMonth()+1)+"/"+date.getDate();
setCookie('Top'+n,name+','+level+','+score+','+theDate);
}
//刷新页面上的积分排行表
function updateBoard(){
for(var i=1;i<=10;i++){
document.all["top"][i-1].innerHTML=i+":"+getCookie("Top"+i);
}
}
//比较当前分数与历史分数,决定是否存储记录
function cSaveTop(){
var n=checkRow();
if(n>10) return;
var name=prompt("高手~你已经跻身前十强了,请留下你的大名吧:","李国强");
if(name==null||name=="") name="无名英雄";
replaceTop(n,name,sLevel,sScore);
}
//清屏
function clear_tSpace(){
for(var i=0;i<tRows;i++)
for(var j=0;j<tCells;j++)
tSpace.rows[i].cells[j].style.background=tSpace.style.background;
document.getElementById("scoreboard").innerHTML="总分数:"+sScore+"<br>总层数:"+sLevel;
showH();
}
//暂停/开始
function toPlayorPause(){
ppgame.blur();
if(gRun) {
clearTimeout("timer");
document.getElementById("mytip").innerHTML="暂停中 ...";
document.getElementById("ppgame").value="开始(Pause)";
}else {
if(gStop){gStop=false;clear_tSpace();makeB();showB();}
timer=setTimeout("run()",gSpeed);
document.getElementById("mytip").innerHTML=""
document.getElementById("ppgame").value="暂停(Pause)";
document.getElementById("sgame").disabled=false;
}
gRun=!gRun;
}
//停止游戏
function toStop(){
if(confirm("您确定要停止么?")){
cSaveTop();
updateBoard();
gStop=true;
clearTimeout("timer");
gRun=false;
sLevel=0;
sScore=0;
document.getElementById("mytip").innerHTML="游戏停止 ...";
document.getElementById("ppgame").value="开始(Pause)";
document.getElementById("sgame").disabled=true;
}
sgame.blur();
}
document.οnkeyup=function(){
event.cancelBubble=true;
event.returnValue=false;
//alert(event.keyCode);
}
document.οnkeypress=function(){
event.cancelBubble=true;
event.returnValue=false;
//alert(event.keyCode);
}
//键盘keydown事件
document.οnkeydοwn=function(){
event.cancelBubble=true;
event.returnValue=false;
var kc=event.keyCode;
switch (kc){
case 19:
toPlayorPause();
break;
case 27:
if(!gStop) toStop();
break;
case 38:
if(event.ctrlKey) {moveBU(); break;}
rotateD();
break;
case 37:
moveBP(-1);
break;
case 39:
moveBP(1);
break;
case 40:
if(brickInB()||!nSpace()){makeB();showB();}
moveB();
break;
case 32 :
moveBD();
break;
}
}
//游戏运行主方法
function run(){
if(!gRun) return;
if(!nSpace()){makeB();showB();}
moveB();
timer=setTimeout("run()",gSpeed);
}
//********************************************************运行开始
for(var i=1;i<=10;i++)
if(typeof(getCookie("Top"))=="undefined") {
initTop();
break;
}
showH();
updateBoard();
initBrick();
//makeB();
//showB();
aa=setTimeout("run()",gSpeed);
</script>