var myCanvas = document.getElementById("myCanvas");
var ctx = myCanvas.getContext("2d");
//创建数组
var wins=[];
var chessBoard=[];
var me = true;
//判读胜负的数组
var myWin=[];
var computerWin=[];
var over = false;
for(var i=0;i<6;i++){
chessBoard[i]=[];
for(var j=0;j<6;j++){
chessBoard[i][j]=0;
};
};
for(var i=0;i<6;i++){
wins[i]=[];
for(var j=0;j<6;j++){
wins[i][j]=[];
};
};
//判断赢法
var count=0;
for(var i=0;i<6;i++){
for(var j=0;j<2;j++){
for(var k=0;k<5;k++){
wins[i][j+k][count]=0;
}
count++;
}
}
for(var i=0;i<6;i++){
for(var j=0;j<2;j++){
for(var k=0;k<5;k++){
wins[j+k][i][count]=0;
}
count++;
}
}
for(var i=0;i<2;i++){
for(var j=0;j<2;j++){
for(var k=0;k<5;k++){
wins[i+k][j+k][count]=0;
}
count++;
}
}
for(var i=0;i<6;i++){
for(var j=5;j>5;j--){
for(var k=0;k<5;k++){
wins[i+k][j-k][count]=0;
}
count++;
}
}
console.log(count);
for(var i=0;i<count;i++){
myWin[i]=0;
computerWin[i]=0;
}
//这个是背景图片
var bg=new Image();
bg.src="images/bg.jpg";
bg.onload=function(){
ctx.drawImage(bg,0,0,600,600);
initChess();
// onStep(0,0,true);
// onStep(1,1,false);
};
//5*5表格
var initChess=function(){
for(var i=0;i<6;i++){
ctx.lineWidth=3;
ctx.moveTo(30+i*100,30);
ctx.lineTo(30+i*100,530);
ctx.strokeStyle="#BE8653";
ctx.stroke();
ctx.moveTo(30,30+i*100);
ctx.lineTo(530,30+i*100);
ctx.stroke();
};
};
// 现在为落子颜色部分
var onStep=function(i,j,me){
ctx.beginPath();
ctx.arc(30+i*100,30+j*100,30,0,2*Math.PI);
ctx.closePath();
var gradient=ctx.createRadialGradient(30+i*100,30+j*100,50,30+i*100,30+j*100,0)
if(me){
gradient.addColorStop(0,"#0A0A0A");
gradient.addColorStop(1,"#636766");
}else{
gradient.addColorStop(0,"#D1D1D1");
gradient.addColorStop(1,"#F9F9F9");
};
ctx.fillStyle=gradient;
ctx.fill();
};
// 现在为落子部分
myCanvas.onclick=function(e){
if(over){
return;
};
var x=e.offsetX;
var y=e.offsetY;
var i=Math.floor(x/100);
var j=Math.floor(y/100);
if(chessBoard[i][j]==0){
onStep(i,j,me);
if(me){
chessBoard[i][j]=1;
}else{
chessBoard[i][j]=2;
};
me =!me;
for(var k=0;k<count;k++){
if(wins[i][j][k]){
myWin[k]++;
computerWin[k] = 6 ;
if(myWin[k] == 5){
over = true;
alert("你赢了");
}
}
}
};
};
相关分类