this.board=function(name,width,height,rowBak,colBak){ /* 画棋盘 */
nameBak=name;
if("turnover"==name){row=8;col=8;}else if("gogame"==name){row=18;col=18;}
var aW=Math.floor(width/(col+2)),aH=Math.floor(height/(row+2));
minL=(aW>aH?aH:aW)-4;// 这个减法很重要,否则填空时会把表格撑大
var array=new Array("<div style=\"margin:"+minL+"px;\"> "+
"<table border=1 cellspacing=0 width=\""+(aW*col)+"\"
height=\""+(aH*row)+"\">");
for(var i=0;i<row;i++){
array.push("<tr>");
for(var j=0;j<col;j++){array.push("<td align=center>"+
evt(i,j,minL,minL,aW*j+minL/2+8,aH*i+minL/2)+"</td>");}
if(nameBak!="four"&&nameBak!="turnover")/* 将事件添加到表格中 */
array.push(evt(i,col,minL,minL,aW*col+minL/2+8,aH*i+minL/2));
array.push("</tr>");
}
if(nameBak!="four"&&nameBak!="turnover"){
for(var j=0;j<=col;j++){
array.push(evt(row,j,minL,minL,aW*j+minL/2+8,aH*row+minL/2));
}
}
document.write(array.join("")+"</table></div>");
setClick(row,col,minL,minL);/* 初始化事件 */
start();/* 初始化棋子 */
}
function man(width,height,id,colorBak){ /* 画棋子 */
var color=colorBak==null?(order++%2==0?"000":"CCC"):colorBak;
var r="border-radius:"+width/2+"px;";
var obj=id==null?event.srcElement:_$(id);
obj.innerHTML="<div id=\"man_"+color+"_"+order+"\" style=\"display:block;-webkit-"
+r+"-moz-"+r+""+r+"-moz-box-shadow:inset 0 -10px 40px rgba(0,0,0,1);"+
"box-shadow:inset 0 -10px 40px rgba(0,0,0,1);"+
"background:-webkit-gradient(radial, 50 40, 30, center center, 80, from(#"+color+"),
to(rgba(255,255,255,1)));"+
"width:"+width+"px;height:"+height+"px;\"></div>";
}
function moreMan(array){for(var i=0;i<array.length;i++)
man(minL,minL,nameBak+"_"+array[i]);}
/* 绘制多个棋子 */
function evt(i,j,width,height,left,top){ /* 单一单元格事件 */
return "<div id=\""+nameBak+"_"+i+"_"+j+"\" style=\"position:"+
(nameBak=="four"||nameBak=="turnover"?"block":"absolute")+
";border:0px solid #000;width:"+
width+"px;height:"+height+"px;top:"+top+"px;left:"+left+"px;\"></div>";
}
function setClick(row,col,width,height){
for(var i=0;i<=row;i++){
for(var j=0;j<=col;j++){
var els=_$(nameBak+"_"+i+"_"+j);
if(els!=null)els.οnclick=function(){if(rule())man(width,height);};
}
}
}
function isMan(row,col){var obj=_$(nameBak+"_"+row+"_"+col,1);
if(obj==null||obj.indexOf("man_")==-1)return null;
else if(obj.indexOf("000")!=-1)
return 0;
else if(obj.indexOf("CCC")!=-1)return 1;}
function rule(){/* 走棋规则 */
var id=event.srcElement.id;
if(id.indexOf("man_")==0){alert("不能在有子的地方落子");return false;}else{
var p=id.indexOf("_"),p1=id.lastIndexOf("_");
var row=id.substr(p+1,p1-p-1)*1,col=id.substr(p1+1)*1;
if("gobang"==nameBak)return gobang(row,col);
else if("four"==nameBak){
if(isMan(row,col+1)==null&&isMan(row,col-1)==null&&
isMan(row+1,col)==null&&
isMan(row-1,col)==null){
alert("四子棋不能在四周空白的地方落子!");
return false;
}
return gobang(row,col,3);
}else if("turnover"==nameBak){
if(isMan(row,col+1)==null&&isMan(row,col-1)==null&&
isMan(row+1,col)==null&&isMan(row-1,col)==null&&
isMan(row-1,col-1)==null&&
isMan(row+1,col+1)==null){
alert("翻转棋不能在四周空白的地方落子!");
return false;
}
turnover();
}else if("gogame"==nameBak){
}
}
return true;
}
function gobang(row,col,num){
num=num==null?4:num;
var rs=[[],[],[],[]],b=[],w=[];/* 这里采用四维数组来存储棋子位置 */
for(var i=0,j=0;i<num*2+1;i++,j++){
rs[0].push(isMan(row-num+i,col));
rs[1].push(isMan(row,col-num+j));
rs[2].push(isMan(row-num+i,col-num+j));
rs[3].push(isMan(row-num+i,col-num+j));
if(i<num){b.push(0);w.push(1);}
}
if(rs.join("#").indexOf(b.join(","))!=-1){alert("黑棋胜");return false;
}else if(rs.join("#").indexOf(w.join(","))!=-1){alert("白棋胜");return false;}
return true;
}
function turnover(){
if(order<64)return;
var num=0;var total=row*col;for(var i=0;i<row;i++){
for(var j=0;j<col;j++){num+=isMan(i+"_"+j);}
}
if(num<total/2)alert("黑棋胜"+(total-num*2)+"子");
else if(num>row*col/2)alert("白棋胜"+(num*2-total)+"子");
else alert("平局");
}
function start(){
if("turnover"==nameBak){moreMan([3+"_"+3,4+"_"+3,4+"_"+4,3+"_"+4]);
}else if("four"==nameBak){man(minL,minL,nameBak+"_"+row/2+"_"+0);
}else if("gogame"==nameBak){moreMan([3+"_"+3,15+"_"+3,15+"_"+15,3+"_"+15]);
}
}
转载于:https://my.oschina.net/u/1035715/blog/276756