俄罗斯方块

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>

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值