lufylegend引擎俄罗斯方块js代码!

Box.js:

----------------------------------------------------

function Box(){
var self = this;
self.box1=[[0,0,0,0],//设置其中不同的方块图案
 [0,0,0,0],
 [1,1,1,1],
 [0,0,0,0]];
self.box2=[[0,0,0,0],
 [0,1,1,0],
 [0,1,1,0],
 [0,0,0,0]];
self.box3=[[0,0,0,0],
 [1,1,1,0],
 [0,1,0,0],
 [0,0,0,0]];
self.box4=[[0,1,1,0],
 [0,1,0,0],
 [0,1,0,0],
 [0,0,0,0]];
self.box5=[[0,1,1,0],
 [0,0,1,0],
 [0,0,1,0],
 [0,0,0,0]];
self.box6=[[0,0,0,0],
 [0,1,0,0],
 [0,1,1,0],
 [0,0,1,0]];
self.box7=[[0,0,0,0],
 [0,0,1,0],
 [0,1,1,0],
 [0,1,0,0]];
self.box=[self.box1,self.box2,self.box3,self.box3,self.box4,self.box5,self.box6,self.box7];
}//将这些图案加入数组
Box.prototype = {
getBox:function (){
var self = this;
var num=7*Math.random();
var index=parseInt(num);
var result = [];
var colorIndex = 1 + Math.floor(Math.random()*4);//范围是1-4 配合Main.js后面的数组下标取值
var i,j;
for(i=0;i<4;i++){
var child = [];
for(j=0;j<4;j++){
child[j] = self.box[index][i][j]*colorIndex;//范围是0或者1-4
}
result[i] = child;
}
return result;//返回一个box 二位数组 元素的取值范围在0(不绘制)和1-4(绘制四种不同的图案)
}
}

----------------------------------------------------

Main.js:

---------------------------------------------------

//声明变量
//进度条显示层,背景层,方块绘制层,方块预览层
var loadingLayer,backLayer,graphicsMap,nextLayer;
var imglist = {};
var imgData = new Array(
{name:"backImage",path:"./images/backImage.png"},
{name:"r1",path:"./images/r1.png"},
{name:"r2",path:"./images/r2.png"},
{name:"r3",path:"./images/r3.png"},
{name:"r4",path:"./images/r4.png"}
);
//方块类变量,用于生成新的方块
var BOX;
//当前方块的位置
var pointBox={x:0,y:0};
//当前方块,预览方块
var nowBox,nextBox;
//方块坐标数组
var map;
//方块数据数组
var nodeList;
//方块图片数组
var bitmapdataList;
//得分相关
var point=0,pointText;
//消除层数相关
var del=0,delText;
//方块下落速度相关
var speed=15,speedMax=15,speedText,speedIndex = 0;
//方块区域起始位置
var START_X1=15,START_Y1=20,START_X2=228,START_Y2=65;
//控制相关
var myKey = {
keyControl:null,
step:1,
stepindex:0,
isTouchDown:false,
touchX:0,
touchY:0,
touchMove:false
};


function main(){
//方块类变量初始化
BOX = new Box();
//方块坐标数组初始化
map=[//将这个屏幕所有都设定为一个数组
[0,0,0,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0,0,0],
[0,0,0,0,0,0,0,0,0,0]
];
//背景层初始化
backLayer = new LSprite();
//在背景层上绘制黑色背景
backLayer.graphics.drawRect(1,"#000000",[0,0,320,480],true,"#000000");
//背景显示
addChild(backLayer);
//进度条读取层初始化
loadingLayer = new LoadingSample1();
//进度条读取层显示
backLayer.addChild(loadingLayer);
//利用LLoadManage类,读取所有图片,并显示进度条进程
LLoadManage.load(
imgData,
function(progress){
loadingLayer.setProgress(progress);
},
gameInit
);
}
//读取完所有图片,进行游戏标题画面的初始化工作
function gameInit(result){
//取得图片读取结果
imglist = result;
//移除进度条层
backLayer.removeChild(loadingLayer);
loadingLayer = null;
//显示游戏标题
var title = new LTextField();
title.x = 50;
title.y = 100;
title.size = 30;
title.color = "#ffffff";
title.text = "俄罗斯方块";
backLayer.addChild(title);
//显示说明文
backLayer.graphics.drawRect(1,"#ffffff",[50,240,220,40]);
var txtClick = new LTextField();
txtClick.size = 18;
txtClick.color = "#ffffff";
txtClick.text = "点击页面开始游戏";
txtClick.x = (LGlobal.width - txtClick.getWidth())/2;
txtClick.y = 245;
backLayer.addChild(txtClick);
//添加点击事件,点击画面则游戏开始
backLayer.addEventListener(LMouseEvent.MOUSE_UP,gameToStart);
}
//游戏画面初始化
function gameToStart(){
//背景层清空
backLayer.die();
backLayer.removeAllChild();
//背景图片显示
var bitmap = new LBitmap(new LBitmapData(imglist["backImage"]));
backLayer.addChild(bitmap);
//得分表示
pointText = new LTextField();
pointText.x = 240;
pointText.y = 200;
pointText.size = 20;
backLayer.addChild(pointText);
//消除层数表示
delText = new LTextField();
delText.x = 240;
delText.y = 290;
delText.size = 20;
backLayer.addChild(delText);
//速度表示
speedText = new LTextField();
speedText.x = 240;
speedText.y = 385;
speedText.size = 20;
backLayer.addChild(speedText);
//将游戏得分,消除层数以及游戏速度显示到画面上
showText();
//方块绘制层初始化
graphicsMap = new LSprite();
backLayer.addChild(graphicsMap);
//方块预览层初始化
nextLayer = new LSprite();
backLayer.addChild(nextLayer);
//将方块的图片数据保存到数组内
bitmapdataList = [
new LBitmapData(imglist["r1"]),//将图片是数据源放入数组
new LBitmapData(imglist["r2"]),
new LBitmapData(imglist["r3"]),
new LBitmapData(imglist["r4"])
];
//方块数据数组初始化
nodeList = [];
var i,j,nArr,bitmap;
for(i=0;i<map.length;i++){
nArr = [];
for(j=0;j<map[0].length;j++){
bitmap = new LBitmap(bitmapdataList[0]);
bitmap.x = bitmap.getWidth()*j+START_X1;
bitmap.y = bitmap.getHeight()*i+START_Y1;
graphicsMap.addChild(bitmap);//向绘制区域绘制图像 以后改变图像来源显示下落方块
nArr[j] = {"index":-1,"value":0,"bitmap":bitmap};//bitmap改变bitmapData来控制方块下落显示
}//index 是控制后面利用 xxx.bitmaddata=bitmapdataList[index]来改变数据源 和方块box的返回值对应
nodeList[i] = nArr;
}
//预览层显示
getNewBox();
//将当前下落方块显示到画面上
plusBox();
//添加循环播放事件侦听
backLayer.addEventListener(LEvent.ENTER_FRAME, onframe);
//添加鼠标按下,鼠标弹起和鼠标移动事件
backLayer.addEventListener(LMouseEvent.MOUSE_DOWN,touchDown);
backLayer.addEventListener(LMouseEvent.MOUSE_UP,touchUp);
backLayer.addEventListener(LMouseEvent.MOUSE_MOVE,touchMove);
if(!LGlobal.canTouch){
//PC的时候,添加键盘事件 【上 下 左 右】
LEvent.addEventListener(LGlobal.window,LKeyboardEvent.KEY_DOWN,onkeydown);
LEvent.addEventListener(LGlobal.window,LKeyboardEvent.KEY_UP,onkeyup);
}
}
//游戏得分,消除层数以及游戏速度显示
function showText(){
pointText.text = point;
delText.text = del;
speedText.text = speedMax - speed + 1;
}
//键盘按下事件
function onkeydown(event){
if(myKey.keyControl != null)return;
if(event.keyCode == 37){//left
myKey.keyControl = "left";
}else if(event.keyCode == 38){//up
myKey.keyControl = "up";
}else if(event.keyCode == 39){//right
myKey.keyControl = "right";
}else if(event.keyCode == 40){//down
myKey.keyControl = "down";
}
}
//键盘弹起事件
function onkeyup(event){
myKey.keyControl = null;
myKey.stepindex = 0;
}
//鼠标按下
function touchDown(event){
myKey.isTouchDown = true;
myKey.touchX = Math.floor(event.selfX / 20);
myKey.touchY = Math.floor(event.selfY / 20);
myKey.touchMove = false;
myKey.keyControl = null;
}
//鼠标弹起
function touchUp(event){
myKey.isTouchDown = false;
if(!myKey.touchMove)myKey.keyControl = "up";
}
//鼠标移动
function touchMove(event){
if(!myKey.isTouchDown)return;
var mx = Math.floor(event.selfX / 20);
if(myKey.touchX == 0){//持续性的判断上一次移动的坐标和现在的坐标
myKey.touchX = mx;
myKey.touchY = Math.floor(event.selfY / 20);
}
if(mx > myKey.touchX){
myKey.keyControl = "right";
}else if(mx < myKey.touchX){
myKey.keyControl = "left";
}
if(Math.floor(event.selfY / 20) > myKey.touchY){//由于没有设置滑动范围判断keyControl 所以一般倾斜向下滑动都是down状态
myKey.keyControl = "down";
}
}
//循环播放
function onframe(){
//首先,将当前下落方块移除画面
minusBox();
if(myKey.keyControl != null && myKey.stepindex-- < 0){
myKey.stepindex = myKey.step;
switch(myKey.keyControl){
case "left":
if(checkPlus(-1,0)){
pointBox.x -= 1;
if(LGlobal.canTouch || true){
myKey.keyControl = null;
myKey.touchMove = true;
myKey.touchX = 0;
}
}
break;
case "right":
if(checkPlus(1,0)){
pointBox.x += 1;
if(LGlobal.canTouch || true){
myKey.keyControl = null;
myKey.touchMove = true;
myKey.touch = 0;
}
}
break;
case "down":
if(checkPlus(0,1)){
pointBox.y += 1;
if(LGlobal.canTouch || true){
myKey.keyControl = null;
myKey.touchMove = true;
myKey.touchY = 0;
}
}
break;
case "up":
changeBox();
if(LGlobal.canTouch || true){
myKey.keyControl = null;
myKey.stepindex = 0;
}
break;
}
}
if(speedIndex++ > speed){//每次循环onframe就调用speedIndex++一次 直到spedIndex大于speed为止才让方块有下移动作 speed变小
                              // 那么speedIndex++次数就少了 用的时间就少了 下落速度就快了 onframe方法是在不停的调用
speedIndex = 0;
if (checkPlus(0,1)){//可以下移 则方块坐标下移1位
pointBox.y++;
}else{
plusBox();
if(pointBox.y < 0){//小于0 游戏结束
gameOver();
return;
}
removeBox();
getNewBox();
}
}
plusBox();
drawMap();
}
//游戏结束
function gameOver(){
backLayer.die();//将backLayer的所有事件销毁 但是不能移除他的子孙 否则就什么都不显示了
//    backLayer.removeAllChild();
var txt = new LTextField();
txt.color = "#ff0000";
txt.size = 40;
txt.text = "游戏结束";
txt.x = (LGlobal.width - txt.getWidth())*0.5;
txt.y = 200;
backLayer.addChild(txt);
}
//绘制所有方块(重新分配bitmapData图片的数据源)
function drawMap(){
var i,j,boxl = 15;
for(i=0;i<map.length;i++){
for(j=0;j<map[0].length;j++){
if(nodeList[i][j]["index"] >= 0){
nodeList[i][j]["bitmap"].bitmapData = bitmapdataList[nodeList[i][j]["index"]];
}else{
nodeList[i][j]["bitmap"].bitmapData = null;//如果注释了 就会出现方块划过区域不重新绘制的现象
// 但是checkPlus是根据map里的0,1来判断还能不能下落。所以没关系不影响checkPlus功能
}
}
}
}
//方块变形
function changeBox(){
var saveBox = nowBox;
nowBox = [
[0,0,0,0],
[0,0,0,0],
[0,0,0,0],
[0,0,0,0]
];
var i,j;
for(i=0;i<saveBox.length;i++){
for(j=0;j<saveBox[1].length;j++){
nowBox[i][j]=saveBox[(3-j)][i];//其实是矩阵旋转90度角
}
}
if (!checkPlus(0,0)){//检查周围是否有绘制区域 有就不能变形
nowBox = saveBox;
}
}
//消除指定层的方块
function moveLine(line){
var i;
for(i=line;i>1 ;i--){
for(j=0;j<map[0].length;j++){//map下标对应屏幕从上往下
map[i][j]=map[i-1][j];
nodeList[i][j].index=nodeList[i-1][j].index;
}
}
for(j=0;j<map[0].length;j++){//最上面一行无法复制它的前一行 统一赋值为-1
map[0][j]=0;
nodeList[0][j].index=-1;
}
}
//消除可消除的方块
function removeBox(){
var i,j,count = 0;
for(i=pointBox.y;i<(pointBox.y+4);i++){
if(i < 0 || i >= map.length)continue;
for(j=0;j<map[0].length;j++){
if(map[i][j]==0){//一行中有一个没有绘制的 就跳出这行
break;
}
if(j==map[0].length - 1){//如果遍历到了这一行的末尾还都是有绘制区域的 就删除这行
moveLine(i);
count++;
}
}
}
if(count == 0)return;
del += count;//删除行数
if(count == 1){//一次消除一行
point += 1;
}else if(count == 2){//一次消除2行
point += 3;
}else if(count == 3){//一次消除3行
point += 6;
}else if(count == 4){
point += 10;
}
if(speed > 1 && del / 100 >= (speedMax - speed + 1)){//之所以用speedMax-speed来控制速度是给速度加一个上限
speed--;
}
showText();
}
//判断是否可移动
function checkPlus(nx,ny){
var i,j;
if(pointBox.y < 0){
//防止方块下落之前,就已向左或向右移到屏幕之外
if(pointBox.x + nx < 0 || pointBox.x + nx > map[0].length - 4){
return false;
}
}
for(i=0;i<nowBox.length;i++){
for(j=0;j<nowBox[i].length;j++){
if(i+pointBox.y + ny < 0){//如果方块还没出现在屏幕上
continue;
}else if(i+pointBox.y + ny >= map.length || j+pointBox.x + nx < 0 || j+pointBox.x + nx >= map[0].length){//如果方块下落到屏幕底或者到屏幕左方或右方
if(nowBox[i][j] == 0){//方块中没有图案绘制区域
continue;
}else{//超出屏幕范围的只要是方块内没有绘制图像的区域就循环  如果有屏幕绘制区域就return false
return false;
}
}//如果方块内有绘制区域并且它的左下右方的map大于0也就是有图像就返回false
if(nowBox[i][j] > 0 && map[i+pointBox.y + ny][j+pointBox.x + nx] > 0){
return false;
}
}
}
return true;
}
//移除方块
function minusBox(){
var i,j;
for(i=0;i<nowBox.length;i++){
for(j=0;j<nowBox[i].length;j++){
if(i+pointBox.y < 0 || i+pointBox.y >= map.length || j+pointBox.x < 0 || j+pointBox.x >= map[0].length){
continue;
}
map[i+pointBox.y][j+pointBox.x]=map[i+pointBox.y][j+pointBox.x]-nowBox[i][j];//map对应0
nodeList[i+pointBox.y][j+pointBox.x]["index"] = map[i+pointBox.y][j+pointBox.x] - 1;//nodelist的index是-1
}
}
}
//添加方块
function plusBox(){
var i,j;
for(i=0;i<nowBox.length;i++){//Box返回的是一个二维数组4*4
for(j=0;j<nowBox[i].length;j++){
if(i+pointBox.y < 0 || i+pointBox.y >= map.length || j+pointBox.x < 0 || j+pointBox.x >= map[0].length){
continue;
}                                                                                         //nowBox[i][j]有图像绘制对应1-4  没图像就是0 所以对应0-4
map[i+pointBox.y][j+pointBox.x]=nowBox[i][j]+map[i+pointBox.y][j+pointBox.x];//nowBox[i][j]对应0-4  所以map【i】【j】对应了0-4
nodeList[i+pointBox.y][j+pointBox.x]["index"] = map[i+pointBox.y][j+pointBox.x] - 1;
} //nodeList里的每个元素 {"index":-1,"value":0,"bitmap":bitmap};  所以index对应-1到3
}               //在有图片绘制区域map[i][j]-1其实就对应nodeList[i][j]的index
}
//获取下一方块
function getNewBox(){
if (nextBox==null){
nextBox=BOX.getBox();
}
nowBox=nextBox;
pointBox.x=3;
pointBox.y=-4;
nextBox=BOX.getBox();

nextLayer.removeAllChild();
var i,j,bitmap;
for(i=0;i<nextBox.length;i++){
for(j=0;j<nextBox[0].length;j++){
if(nextBox[i][j] == 0){
continue;
}                     //bitmapdataList对应数组下标0-3
bitmap = new LBitmap(bitmapdataList[nextBox[i][j] - 1]);//获取对应图片
bitmap.x = bitmap.getWidth()*j+START_X2;
bitmap.y = bitmap.getHeight()*i+START_Y2;
nextLayer.addChild(bitmap);
}
}
}
//感觉map是可以省略的  不过如果没有map的话 会比较麻烦 这种分层对应的编程思路值得学习

---------------------------------------------------

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值