对上一次的连连看程序进行了一点修改:

 var llk = function () {
this.ReStart();
}
llk.prototype = {
Init: function () {
//初始化游戏界面
for (var i = 0; i < 5; i++) {
this.Data.sort(function () { return 0.5 - Math.random() });
}
for (var i = 0; i < 140; i++) {
var shucai = this.Images[i];
shucai.className = this.className;
if(this.Data[i]!==null && this.Data[i]!=undefined){
shucai.innerText = this.Data[i];
}else{
this.removeItem(shucai);
}
}
this.showLevel();
this.showLife();
this.Start(); if (!this.HasNext()) {
if (!this.decreaseLife()) {
return;
}
this.Init();
}
},
InitData: function () {//随机生成游戏数据
if(this.leaveCount ==0 ){
var Data = [];
var level = Math.min(this.currentLevel - 1, 5);
for (var i = 0; i < 70; i++) {
var _d = Math.round(Math.random() * (10+level));
Data.push(_d);
Data.push(_d);
}
this.Data = Data;
this.leaveCount =140;
}
},
Select: function (item) {
//点击元素,选择元素
if (this.isRemoved(item))
return;
var from = this.getFrom();
if (from == null) { this.UnselectAll(); this.setFrom(item);
//shucai.className = this.selectClassName; } else if (from.target == item) {
return;
}
else {
this.setTo(item);
this.Check();
}
},
clearFrom: function () {//清楚起始点
var from = this.getFrom();
if (from!=null) {
this.removeClassName(from.target, this.selectClassName);
}
this.From = null;
if (this.To != null) {
this.From = this.To;
this.To = null;
}
},
clearTo: function () {//清楚终止点
if (this.To != null) {
this.removeClassName(this.To.target, this.selectClassName);
}
this.To = null;
},
getFrom: function () { return this.From;},
setFrom: function (item) {
this.From = this.Parse(item);
this.addClassName(item, this.selectClassName);
},
getTo: function () { return this.To;},
setTo: function (item) {
this.To = this.Parse(item);
this.addClassName(item, this.selectClassName);
},
getItem: function (x, y) {
if(y == null||y == undefined){
return this.Images[x];
}else{
return this.Images[y*14+x];
}
},
addClassName: function (item, className) {
if (!this.hasClassName(item, className)) {
item.className = item.className + " " + className;
}
},
hasClassName: function (item, className) {
if (item.className.indexOf(className) > -1) {
return true;
}
return false;
},
removeClassName: function (item, className) {
if (this.hasClassName(item, className)) {
var _class = item.className.split(' ');
item.className = "";
for (var i = 0; i < _class.length; i++) {
if (_class[i] != className) {
item.className += _class[i] + " ";
}
}
}
},
isRemovedByXY: function (x, y) {
return this.isRemoved(this.getItem(x,y));
},
isRemoved: function (item) {
return this.hasClassName(item, this.removedClassName);
},
removeItem: function (item) {
item.innerHTML = "&nbsp;";
this.addClassName(item, this.removedClassName);
},
UnselectAll: function () {
var select = document.getElementsByClassName(this.selectClassName);
for (var i = select.length - 1; i >= 0; i--) {
this.removeClassName(select[i], this.selectClassName);
}
},
Unselect: function (index) {
this.removeClassName(this.Images[index], this.selectClassName); this.From = null;
if(this.To!=null){
this.Select(this.To);
}
this.To = null;
},
Check: function () {
if (this.CheckType() && this.CheckPath()) {
var from = this.getFrom();
var to = this.getTo();
this.clearTo();
this.clearFrom();
this.Remove(from, to);
} else {
this.clearFrom();
}
},
CheckType: function (fIndex, tIndex) {
//检查选择的两个 点数据类型是否一致
if (fIndex != null && tIndex != null) {
if (this.Data[fIndex] != this.Data[tIndex]) {
return false;
}
} else {
var from = this.getFrom(),
to = this.getTo(); if (this.Data[from.index] != this.Data[to.index]) {
return false;
}
}
return true;
},
isBeside: function (p1, p2) {//相邻
if ((p1.x == p2.x && Math.abs(p1.y - p2.y) == 1) ||
(p1.y == p2.y && Math.abs(p1.x - p2.x) == 1)) {
this.addPath(p2);
return true;
}
return false;
},
isLine: function (from, to) {
//检查两个点是否直线相连
var flag = true;
if (from.x == to.x) {
for (var i = Math.min(from.y, to.y) + 1 ; i < Math.max(from.y, to.y) ; i++) {
if (!this.isRemovedByXY(from.x, i)) {
flag = false;
break;
}
}
} else {
for (var i = Math.min(from.x, to.x) + 1 ; i < Math.max(from.x, to.x) ; i++) {
if (!this.isRemovedByXY(i, from.y)) {
flag = false;
break;
}
}
}
return flag;
},
isBorder: function (p1, p2) {//邻边
if (0 == p1.x && 0 == p2.x) {
this.addPath([{ x: -1, y: p1.y }, { x: -1, y: p2.y },p2]);
return true;
} else if (0 == p1.y && 0 == p2.y) {
this.addPath([{ x: p1.x, y: -1 }, { x: p2.x, y: -1 },p2]);
return true;
} else if (13 == p1.x && 13 == p2.x) {
this.addPath([{ x: 14, y: p1.y }, { x: 14, y: p2.y },p2]);
return true;
} else if (9 == p1.y && 9 == p2.y) {
this.addPath([{ x: p1.x, y: 10 }, { x: p2.x, y: 10 },p2]);
return true;
}
return false;
},
isCross: function (p1, p2) {//对角相邻
if (this.isRemovedByXY(p1.x,p2.y)) {
this.addPath([{ x: p1.x, y: p2.y },p2]);
return true;
}
else if (this.isRemovedByXY(p2.x,p1.y)) {
this.addPath([{ x: p2.x, y: p1.y },p2]);
return true;
}
return false;
},
isHasPath: function (from, to) {
//从两点之间连接
var flag = true; //矩形边相通
if (this.isRemovedByXY(from.x, to.y)) {
if (this.isLine(from, { x: from.x, y: to.y })
&& this.isLine({ x: from.x, y: to.y }, to)) {
this.addPath([{ x: from.x, y: to.y },to]);
return true;
}
} else if (this.isRemovedByXY(to.x, from.y)) {
if (this.isLine(from, { x: to.x, y: from.y })
&& this.isLine({ x: to.x, y: from.y }, to)) {
this.addPath([{ x: to.x, y: from.y }, to]);
return true;
}
} else {
flag = false;
} var maxX = Math.max(from.x, to.x), minX = Math.min(from.x, to.x),
maxY = Math.max(from.y, to.y), minY = Math.min(from.y, to.y); var y = from.x == minX ? from.y : to.y;
for (var x = minX + 1; x <= maxX; x++) {
flag = true;
if (!this.isRemovedByXY(x, y)) {
flag = false;
break;
} var p1 = { x: x, y: y }, p2 = { x: x, y: y == minY ? maxY : minY };
if (!this.isRemovedByXY(p2.x, p2.y)) {
flag = false;
continue;
}
if (this.isLine(p1, p2)
&& this.isLine(p2, { x: maxX, y: p2.y })) {
this.addPath([p1,p2]);
flag = true;
break;
} else {
flag = false;
}
} if (!flag) {
var x = from.y == minY ? from.x : to.x; for (var y = minY + 1; y <= maxY; y++) {
flag = true;
if (!this.isRemovedByXY(x, y)) {
flag = false;
break;
} var p1 = { x: x, y: y }, p2 = { x: x == minX ? maxX : minX, y: y };
if (!this.isRemovedByXY(p2.x, p2.y)) {
flag = false;
continue;
}
if (this.isLine(p1, p2) && this.isLine(p2, { x: p2.x, y: maxY })) {
this.addPath([p1,p2]);
flag = true;
break;
} else {
flag = false;
}
}
} if (flag) {
this.addPath(to);
return true;
} //从左边往回连接
flag = true;
var y = from.x == minX ? from.y : to.y;
for (var x = minX - 1; x >= -1; x--) {
if (x == -1) {
var p2 = { x: 0, y: y == minY ? maxY : minY }; if (!this.isRemovedByXY(p2.x, p2.y)) {
flag = false;
break;
} flag = this.isLine(p2, { x: maxX, y: p2.y }); if (flag) {
this.addPath([{ x: -1, y: from.y }, { x: -1, y: to.y }]);
} break;
}
flag = true; if (this.isRemovedByXY(x, minY) && this.isRemovedByXY(x, maxY)) {
} else {
flag = false;
break;
} var p1 = { x: x, y: y }, p2 = { x: x, y: y == minY ? maxY : minY };
if (!this.isRemovedByXY(p2.x, p2.y)) {
flag = false;
continue;
}
if (this.isLine(p1, p2) && this.isLine(p2, { x: maxX, y: p2.y })) {
this.addPath([p1,p2]);
flag = true;
break;
} else {
flag = false;
}
}
if (flag) {
this.addPath(to);
return true;
} //从右边连接
flag = true;
var y = from.x == maxX ? from.y : to.y;
for (var x = maxX + 1; x <= 14; x++) {
if (x == 14) {
var p2 = { x: 13, y: y == minY ? maxY : minY };
if (!this.isRemovedByXY(p2.x, p2.y)) {
flag = false;
break;
}
flag = this.isLine(p2, { x: minX, y: p2.y });
if (flag) {
this.addPath([{ x: x, y: from.y }, { x: x, y: to.y }]);
}
break;
}
flag = true; if (this.isRemovedByXY(x, minY) && this.isRemovedByXY(x, maxY)) {
} else {
flag = false;
break;
}
var p1 = { x: x, y: y }, p2 = { x: x, y: y == minY ? maxY : minY };
if (!this.isRemovedByXY(p2.x, p2.y)) {
flag = false;
continue;
}
if (this.isLine(p1, p2) && this.isLine(p2, { x: minX, y: p2.y })) {
this.addPath([p1,p2]);
flag = true;
break;
} else {
flag = false;
} }
if (flag) {
this.addPath(to);
return true;
} //从上边连接
flag = true;
var x = from.y == minY ? from.x : to.x;
for (var y = minY - 1; y >= -1; y--) {
if (y == -1) {
var p2 = { x: x == minX ? maxX : minX, y: 0 };
if (!this.isRemovedByXY(p2.x, p2.y)) {
flag = false;
break;
}
flag = this.isLine(p2, { x: p2.x, y: maxY });
if (flag) {
this.addPath([{ x: from.x, y: y }, { x: to.x, y: y }]);
}
break;
}
flag = true; if (this.isRemovedByXY(minX, y) && this.isRemovedByXY(maxX, y)) {
} else {
flag = false;
break;
} var p1 = { x: x, y: y }, p2 = { x: x == minX ? maxX : minX, y: y };
if (!this.isRemovedByXY(p2.x, p2.y)) {
flag = false;
continue;
}
if (this.isLine(p1, p2) && this.isLine(p2, { x: p2.x, y: maxY })) {
this.addPath([p1,p2]);
flag = true;
break;
} else {
flag = false;
} }
if (flag) {
this.addPath(to);
return true;
} //从下边连接
flag = true;
var x = from.y == maxY ? from.x : to.x;
for (var y = maxY + 1; y <= 10; y++) {
if (y == 10) {
var p2 = { x: x == minX ? maxX : minX, y: 9 };
if (!this.isRemovedByXY(p2.x, p2.y)) {
flag = false;
break;
}
flag = this.isLine(p2, { x: p2.x, y: minY });
if (flag) {
this.addPath([{ x: from.x, y: y }, { x: to.x, y: y }]);
}
break;
}
flag = true; if (this.isRemovedByXY(minX, y) && this.isRemovedByXY(maxX, y)) {
} else {
flag = false;
break;
} var p1 = { x: x, y: y }, p2 = { x: x == minX ? maxX : minX, y: y };
if (!this.isRemovedByXY(p2.x, p2.y)) {
flag = false;
continue;
}
if (this.isLine(p1, p2) && this.isLine(p2, { x: p2.x, y: minY })) {
this.addPath([p1,p2]);
flag = true;
break;
} else {
flag = false;
}
}
if (flag) {
this.addPath(to);
return true;
}
return false;
},
CheckPath: function (fIndex,tIndex) {
var from , to ;
if (fIndex != null && tIndex != null) {
from = this.parseIndexToXY(fIndex);
to = this.parseIndexToXY(tIndex);
} else {
from = this.getFrom().pos;
to = this.getTo().pos;
} if (from == null || to == null)
return false; this.pointArray = [];
this.addPath(from);
//相邻
if (this.isBeside(from,to)) {
return true;
} //邻边
if(this.isBorder(from,to)){
return true;
} // 相同行
if (from.y == to.y)
{
return this.CheckSameRow(from,to);
} //相同列
if (from.x == to.x)
{
return this.CheckSameColumns(from, to);
} //对角相邻
if (Math.abs(from.x - to.x) == 1 && Math.abs(from.y - to.y) == 1)
{
if (this.isCross(from, to)) {
return true;
}
return false;
} //任意位置
return this.isHasPath(from, to);
},
CheckSameColumns: function (from, to) {
var flag = true;
//直线路径
flag = this.isLine(from, to);
if (!flag) {
flag = true;
//往左
var x = from.x - 1;
var _pf, _pt;
while (x >= -1) {
flag = true;
_pf = { x: x, y: from.y };
_pt = { x: x, y: to.y }; if (x == -1) {
break;
} if (this.isRemovedByXY(_pf.x, _pf.y) && this.isRemovedByXY(_pt.x, _pt.y)) {
flag = this.isLine(_pf, _pt);
}
else {
flag = false;
break;
} if (flag)
break;
x--;
}
if (flag) {
this.addPath(_pf);
this.addPath(_pt);
}
} if (!flag) {
flag = true;
//往下
var x = from.x + 1;
var _pf, _pt;
while (x <= 14) {
flag = true;
_pf = { x: x, y: from.y };
_pt = { x: x, y: to.y }; if (x == 14) {
break;
} if (this.isRemovedByXY(_pf.x, _pf.y) && this.isRemovedByXY(_pt.x, _pt.y)) {
flag = this.isLine(_pf, _pt);
}
else {
flag = false;
break;
}
if (flag)
break;
x++;
}
if (flag) {
this.addPath(_pf);
this.addPath(_pt);
}
}
if (flag) {
this.addPath(to);
}
return flag;
},
CheckSameRow: function (from, to) {
var flag = true;
//直线路径
flag = this.isLine(from, to); if (!flag) {
flag = true;
//往上
var y = from.y - 1;
var _pf, _pt;
while (y >= -1) {
flag = true;
_pf = { x: from.x, y: y };
_pt = { x: to.x, y: y }; if (y == -1) {
break;
} if (this.isRemovedByXY(_pf.x, _pf.y) && this.isRemovedByXY(_pt.x, _pt.y)) {
flag = this.isLine(_pf, _pt);
}
else {
flag = false;
break;
}
if (flag) {
break;
}
y--;
}
if (flag) {
this.addPath(_pf);
this.addPath(_pt);
}
} if (!flag) {
flag = true;
//往下
var y = from.y + 1;
var _pf, _pt;
while (y <= 10) {
flag = true;
_pf = { x: from.x, y: y };
_pt = { x: to.x, y: y }; if (y == 10) {
break;
} if (this.isRemovedByXY(_pf.x, _pf.y) && this.isRemovedByXY(_pt.x, _pt.y)) {
flag = this.isLine(_pf, _pt);
} else {
flag = false;
break;
}
if (flag)
break;
y++;
}
if (flag) {
this.addPath(_pf);
this.addPath(_pt);
}
} if (flag) {
this.addPath(to);
}
return flag;
},
Parse: function (item) {
return { index: item.id, target: item, pos: this.parseIndexToXY(item.id) };
},
parseIndexToXY: function (index) {
var y = Math.floor(index / 14);
var x = index % 14;
return { x: x, y: y };
},
getHasPath: function () {
var flag = false;
var i = 0, j = 0;
if (this.leaveCount > 0) {
for (; i < 140 - 1; i++) {
if (this.Data[i] != null) {
for (j = i + 1; j < 140; j++) {
if (this.Data[j] != null) {
if (this.CheckType(i, j)) {
if (this.CheckPath(i, j)) {
flag = true;
break;
}
}
}
} if (flag)
break;
}
}
} if (flag)
return {from:i,to:j};
return null;
},
Clue: function () {
//提示可消除的两个点
this.clearTo();
this.clearFrom(); var next = this.getHasPath(); if (next!=null) {
if (!this.decreaseLife())
return;
var pos = this.parseIndexToXY(next.from);
var item = this.getItem(pos.x, pos.y);
this.addClassName(item, this.selectClassName); var pos = this.parseIndexToXY(next.to);
var item = this.getItem(pos.x, pos.y);
this.addClassName(item, this.selectClassName);
}
},
HasNext: function () {
//检查是否存在可消除的两个 点
return this.getHasPath() != null;
},
Remove: function (from, to) {
//消除元素
var lines = this.drawLine(); var _this = this;
this.addTime(); this.addScores(); this.Data[from.index] = null;
this.Data[to.index] = null;
this.leaveCount -=2;
setTimeout(function () {
_this.removeItem(from.target);
_this.removeItem(to.target); for (var i = 0; i < lines.length; i++) {
document.body.removeChild(lines[i]);
} lines = null;
_this.Change();
}, 100);
},
Change: function () {
//关卡布局方法,比如左右分离,上下分离等
if (this.leaveCount == 0) {
this.NextLevel();
return;
} var leavel = this.currentLevel; if (leavel == 3) {//左右分离
for (var y = 0; y < 10; y++) {
for (var x = 0; x < 7; x++) {
var index = y * 14 + x;
if (this.Data[index] != null) {
continue;
}
var flag = false;
for (var i = x + 1; i < 7; i++) {
var _index = y * 14 + i;
if (this.Data[_index] != null) {
this.Data[index] = this.Data[_index];
this.Data[_index] = null;
flag = true;
break;
}
} if (!flag)
break;
} for (var x = 13; x >= 7; x--) {
var index = y * 14 + x;
if (this.Data[index] != null) {
continue;
}
var flag = false;
for (var i = x - 1; i >= 7; i--) {
var _index = y * 14 + i;
if (this.Data[_index] != null) {
this.Data[index] = this.Data[_index];
this.Data[_index] = null;
flag = true;
break;
}
} if (!flag)
break;
}
}
}
else if (leavel == 4) {//上下分离
for (var x = 0; x < 14; x++) {
for (var y = 0; y < 5; y++) {
var index = y * 14 + x;
if (this.Data[index] != null) {
continue;
}
var flag = false;
for (var i = y + 1; i < 5; i++) {
var _index = i * 14 + x;
if (this.Data[_index] != null) {
this.Data[index] = this.Data[_index];
this.Data[_index] = null;
flag = true;
break;
}
} if (!flag)
break;
} for (var y = 9; y >= 5; y--) {
var index = y * 14 + x;
if (this.Data[index] != null) {
continue;
}
var flag = false;
for (var i = y - 1; i >= 5; i--) {
var _index = i * 14 + x;
if (this.Data[_index] != null) {
this.Data[index] = this.Data[_index];
this.Data[_index] = null;
flag = true;
break;
}
} if (!flag)
break;
}
}
}
else if (leavel == 5) {//往左移
for (var y = 0; y < 10; y++) {
for (var x = 0; x < 14; x++) {
var index = y * 14 + x;
if (this.Data[index] != null) {
continue;
}
var flag = false;
for (var i = x + 1; i < 14; i++) {
var _index = y * 14 + i;
if (this.Data[_index] != null) {
this.Data[index] = this.Data[_index];
this.Data[_index] = null;
flag = true;
break;
}
} if (!flag)
break;
}
}
}
else if (leavel == 6) {//向右移
for (var y = 0; y < 10; y++) {
for (var x = 13; x >= 0; x--) {
var index = y * 14 + x;
if (this.Data[index] != null) {
continue;
}
var flag = false;
for (var i = x - 1; i >= 0; i--) {
var _index = y * 14 + i;
if (this.Data[_index] != null) {
this.Data[index] = this.Data[_index];
this.Data[_index] = null;
flag = true;
break;
}
} if (!flag)
break;
}
}
}
else if (leavel == 7) {//向下移
for (var x = 0; x < 14; x++) {
for (var y = 9; y >= 0; y--) {
var index = y * 14 + x;
if (this.Data[index] != null) {
continue;
}
var flag = false;
for (var i = y - 1; i >= 0; i--) {
var _index = i * 14 + x;
if (this.Data[_index] != null) {
this.Data[index] = this.Data[_index];
this.Data[_index] = null;
flag = true;
break;
}
} if (!flag)
break;
}
}
}
else if (leavel == 8) {//向上移
for (var x = 0; x < 14; x++) {
for (var y = 0; y < 10; y++) {
var index = y * 14 + x;
if (this.Data[index] != null) {
continue;
}
var flag = false;
for (var i = y + 1; i < 10; i++) {
var _index = i * 14 + x;
if (this.Data[_index] != null) {
this.Data[index] = this.Data[_index];
this.Data[_index] = null;
flag = true;
break;
}
} if (!flag)
break;
}
}
}
else if (leavel == 9) {//向内紧缩
for (var y = 5; y < 10; y++) {
for (var x = 7; x < 14; x++) {
var index = y * 14 + x;
if (this.Data[index] != null) {
continue;
}
var flag = false;
for (var i = x + 1; i < 14; i++) {
var _index = y * 14 + i;
if (this.Data[_index] != null) {
this.Data[index] = this.Data[_index];
this.Data[_index] = null;
flag = true;
break;
}
} if (!flag)
break;
} for (var x = 6; x >= 0; x--) {
var index = y * 14 + x;
if (this.Data[index] != null) {
continue;
}
var flag = false;
for (var i = x - 1; i >= 0; i--) {
var _index = y * 14 + i;
if (this.Data[_index] != null) {
this.Data[index] = this.Data[_index];
this.Data[_index] = null;
flag = true;
break;
}
} if (!flag)
break;
}
} for (var y = 4; y > 0; y--) {
for (var x = 7; x < 14; x++) {
var index = y * 14 + x;
if (this.Data[index] != null) {
continue;
}
var flag = false;
for (var i = x + 1; i < 14; i++) {
var _index = y * 14 + i;
if (this.Data[_index] != null) {
this.Data[index] = this.Data[_index];
this.Data[_index] = null;
flag = true;
break;
}
} if (!flag)
break;
} for (var x = 6; x >= 0; x--) {
var index = y * 14 + x;
if (this.Data[index] != null) {
continue;
}
var flag = false;
for (var i = x - 1; i >= 0; i--) {
var _index = y * 14 + i;
if (this.Data[_index] != null) {
this.Data[index] = this.Data[_index];
this.Data[_index] = null;
flag = true;
break;
}
} if (!flag)
break;
}
} for (var x = 0; x < 7; x++) {
for (var y = 5; y < 10; y++) {
var index = y * 14 + x;
if (this.Data[index] != null) {
continue;
}
var flag = false;
for (var i = y + 1; i < 10; i++) {
var _index = i * 14 + x;
if (this.Data[_index] != null) {
this.Data[index] = this.Data[_index];
this.Data[_index] = null;
flag = true;
break;
}
} if (!flag)
break;
} for (var y = 4; y >= 0; y--) {
var index = y * 14 + x;
if (this.Data[index] != null) {
continue;
}
var flag = false;
for (var i = y - 1; i >= 0; i--) {
var _index = i * 14 + x;
if (this.Data[_index] != null) {
this.Data[index] = this.Data[_index];
this.Data[_index] = null;
flag = true;
break;
}
} if (!flag)
break;
}
} for (var x = 7; x < 14; x++) {
for (var y = 5; y < 10; y++) {
var index = y * 14 + x;
if (this.Data[index] != null) {
continue;
}
var flag = false;
for (var i = y + 1; i < 10; i++) {
var _index = i * 14 + x;
if (this.Data[_index] != null) {
this.Data[index] = this.Data[_index];
this.Data[_index] = null;
flag = true;
break;
}
} if (!flag)
break;
} for (var y = 4; y >= 0; y--) {
var index = y * 14 + x;
if (this.Data[index] != null) {
continue;
}
var flag = false;
for (var i = y - 1; i >= 0; i--) {
var _index = i * 14 + x;
if (this.Data[_index] != null) {
this.Data[index] = this.Data[_index];
this.Data[_index] = null;
flag = true;
break;
}
} if (!flag)
break;
}
}
}
for (var i = 0; i < 140; i++) {
var shucai = this.getItem(i);
shucai.className = this.className;
if (this.Data[i] !== null && this.Data[i] != undefined) {
shucai.innerText = this.Data[i];
} else {
this.removeItem(shucai);
}
} if (!this.HasNext()) {
if (!this.decreaseLife()) {
return;
}
this.Init();
}
},
NextLevel: function () {
//下一关
this.addLife();
this.currentLevel++;
if (this.currentLevel > this.maxLevel) {
this.Stop();
} else {
this.InitData();
this.Init();
}
},
Start: function () {
//开始游戏
if (this.time == null || this.time == undefined) {
this.timeout = this.getTime();
this.showTime(); this.TimeStart();
}
},
ReStart: function () {//游戏重新开始
for (var i in this.setting) {
this[i] = this.setting[i];
} var container = document.getElementById("Container");
container.innerHTML = "";
var _this = this;
var Images = [];
//生成游戏主要点,共14列*10行
for (var i = 0; i < 140; i++) {
var shucai = document.createElement("div");
shucai.className = this.className;
shucai.innerText = i;
shucai.id = i;
shucai.onclick = function () {
_this.Select(this);
}
container.appendChild(shucai); Images.push(shucai);
}
//保存游戏中元素数据的数组
this.Data = [];
//保存两点间折线的顶点坐标数组
this.pointArray = [];
//消除的起始点
this.From = null;
//结束点
this.To = null;
//保存显示的元素数据
this.Images = Images;
//剩余可消除数量
this.leaveCount = 0;
this.showScores();
//随机生成游戏数据this.Data
this.InitData();
//初始化游戏,把数据随机显示在游戏界面
this.Init();
},
TimeStart: function () {//游戏时间开始
var _this = this;
this.time = setTimeout(function () {
_this.timeout--;
_this.showTime();
if (_this.timeout <= 0) {
_this.Over();
}
else {
_this.TimeStart();
}
}, 1000);
},
TimeStop: function () {//游戏时间暂停,开始
if (this.time != null) {
clearTimeout(this.time);
this.time = null; var div = document.createElement("div");
div.className = "Pause";
div.innerText = "暂停游戏";
document.body.appendChild(div);
} else {
this.TimeStart(); var div = document.getElementsByClassName("Pause");
if (div) {
document.body.removeChild(div[0]);
}
}
},
Stop: function () {//通关游戏
alert("恭喜你通关了游戏!");
var container = document.getElementById("Container");
container.innerHTML = "";
container.innerText = "恭喜你通关了游戏!";
},
Over: function () {//游戏结束
if (this.time != null) {
clearTimeout(this.time);
this.time = null;
}
alert("游戏结束了!");
var container = document.getElementById("Container");
container.innerHTML = "";
container.innerText = "游戏结束了!";
},
addPath: function (pt) {//增加消除两点之间的拆线的顶点坐标
if (Object.prototype.toString.call(pt) === '[object Array]') {
for (var i = 0; i < pt.length; i++) {
this.pointArray.push(pt[i]);
}
} else {
this.pointArray.push(pt);
}
},
drawLine: function () {//画轨迹
var points = this.pointArray;
if(points.length ==4){
if(points[1].x!==points[0].x && points[1].y!=points[0].y){
var temp = points[1];
points[1]=points[2];
points[2] = temp;
}
}
var lines = [];
for (var i = 0; i < points.length - 1; i++) {
lines.push(this.draw(points[i], points[i + 1]));
}
return lines;
},
draw: function (from, to) {//画消除时,两个元素之间的连线轨迹
//同列
var div = document.createElement("div");
div.className = "line";
if (from.x == to.x)
{
var minY = Math.min(from.y, to.y),
maxY = Math.max(from.y, to.y); div.style.width = "2px"; div.style.height = ((maxY - minY) * (30+2) +2) + "px";
div.style.top = (100 + (30 +2) * minY + 15) + "px";
div.style.left = (115 + (30 +2) * from.x) + "px"; //this.lines.push(div); }
//同行
else if (from.y == to.y)
{
var minX = Math.min(from.x, to.x),
maxX = Math.max(from.x, to.x); div.style.height = "2px"; div.style.width = ((maxX - minX ) * (30+2) +2) + "px";
div.style.left = (100 + (30+2) * minX +15) + "px";
div.style.top = (100 + 15 + (30+2) * from.y) + "px";
//this.lines.push(div);
} document.body.appendChild(div);
return div; },
showScores: function () {//显示游戏所得分数
document.getElementById("scores").innerText = this.Scores;
},
addScores: function () {//第消除一对,游戏分数会增加
this.Scores += 20;
this.showScores();
},
addTime: function () {//每消除一对,游戏时间会增加
this.timeout += 5;
this.timeout = Math.min(this.timeout, this.getTime());
this.showTime();
},
showTime: function () {//显示游戏剩余时间
this.timeout = Math.max(this.timeout, 0);
document.getElementById("time").innerText = this.timeout;
},
showLife: function () {//显示生命值
document.getElementById("life").innerText = this.Life;
},
addLife: function () {//过关后,生命值增加
this.Life++;
this.showLife();
},
decreaseLife: function () {//生命值减少
this.Life--;
//当生命值小于0时,游戏结束
if (this.Life < 0) {
this.Over();
return false;
} this.showLife();
return true;
},
showLevel: function () {//显示级别
document.getElementById("level").innerText = this.currentLevel;
}
};
llk.prototype.setting = {
currentLevel: 1,//当前关数
maxLevel: 9, //总关数
Scores: 0, //分数
Life:6, //生命值
minTime: 180, //最少时间
className: "shucai",//默认CSS样式
removedClassName: "removed",//被消除的CSS样式
selectClassName:"select",//选择好的CSS样式
getTime:function(){//当前关闯关时间
return (this.currentLevel -1) * 10 + this.minTime;
}
}

连连看的原生JS实现V2的更多相关文章

  1. 连连看的原生JS实现

    那天闲来无事,便想找个小游戏来打发时间,后来便找到了连连看, 玩了一会儿感觉无聊,想到各位高手用JS做的各种小游戏,便想自己也来做一个,于是便有了这几天的成果. 代码是用 原生JS 实现的,只是用来学 ...

  2. 原生js实现 常见的jquery的功能

    原生选择器   充分利用 bind(this)绑定 <div id="box"> <ul> <li >111 </li> <l ...

  3. ToDoList(原生JS)了解一下

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  4. 原生js的常用方法总结

    =============== 通知: 博主已迁至<掘金>码字,博客园可能以后不再更新,掘金地址:https://juejin.im/post/5a1a6a6551882534af25a8 ...

  5. 原生JS封装Ajax插件(同域&&jsonp跨域)

    抛出一个问题,其实所谓的熟悉原生JS,怎样的程度才是熟悉呢? 最近都在做原生JS熟悉的练习... 用原生Js封装了一个Ajax插件,引入一般的项目,传传数据,感觉还是可行的...简单说说思路,如有不正 ...

  6. 常用原生JS方法总结(兼容性写法)

    经常会用到原生JS来写前端...但是原生JS的一些方法在适应各个浏览器的时候写法有的也不怎么一样的... 今天下班有点累... 就来总结一下简单的东西吧…… 备注:一下的方法都是包裹在一个EventU ...

  7. 原生JS实现"旋转木马"效果的图片轮播插件

    一.写在最前面 最近都忙一些杂七杂八的事情,复习软考.研读经典...好像都好久没写过博客了... 我自己写过三个图片轮播,一个是简单的原生JS实现的,没有什么动画效果的,一个是结合JQuery实现的, ...

  8. 再谈React.js实现原生js拖拽效果

    前几天写的那个拖拽,自己留下的疑问...这次在热心博友的提示下又修正了一些小小的bug,也加了拖拽的边缘检测部分...就再聊聊拖拽吧 一.不要直接操作dom元素 react中使用了虚拟dom的概念,目 ...

  9. React.js实现原生js拖拽效果及思考

    一.起因&思路 不知不觉,已经好几天没写博客了...近来除了研究React,还做了公司官网... 一直想写一个原生js拖拽效果,又加上近来学react学得比较嗨.所以就用react来实现这个拖 ...

随机推荐

  1. 前端面试题整理(html篇)

    1.Doctype作用?标准模式与兼容模式各有什么区别? <!DOCTYPE>声明位于位于HTML文档中的第一行,处于 <html> 标签之前.告知浏览器的解析器用什么文档标准 ...

  2. php包管理工具最基本的一些问题

    windows下的 1.先安装windows下的set-up程序 点击一步步的, cmd进入,输入composer能成功显示一幅图说明安装成功 2.在下载,https://getcomposer.or ...

  3. limesurvey设置短调查问卷url

    If you want to use fancy URLs and so not have /index.php in every URL please edit /application/confi ...

  4. C# .NET修改注册表

    c#修改注册表,需要引用Microsoft.Win32命名空间 using Microsoft.Win32; //声明 ///引用 RegistryKey reg; reg = Registry.Cl ...

  5. 为什么32位操作系统最大支持4GB内存

    因为32位操作系统的地址空间为32位,地址总数为2^32,每个地址对应1Byte内存空间,这样,32位操作系统管理的最大内存空间限制为2^32Byte=4*1024*1024*1024Byte,即4G ...

  6. 真机调试iwatch

    http://blog.csdn.net/chenyufeng1991/article/details/48976639 错误:no symbols for paired Apple Watch 错误 ...

  7. spark在集群上运行

    1.spark在集群上运行应用的详细过程 (1)用户通过spark-submit脚本提交应用 (2)spark-submit脚本启动驱动器程序,调用用户定义的main()方法 (3)驱动器程序与集群管 ...

  8. Voilin 之 握弓

    握弓要像拿杯子,手要圆:整个手型是左倾.

  9. cvc-complex-type.2.4.c: The matching wildcard...

    在家里的电脑好好的,在单位的就不行,需要把web app libraties提到 最前面,然后clean一下项目

  10. WinForm TextBox 实现自动索引功能

    源代码如下: http://pan.baidu.com/s/1bnOz4hp