目前已經實現的功能:
V1.0 : 實現棋子的布局,畫布及游戲場景的初始化
V2.0 : 實現棋子的顏色改變
V3.0 :實現所有象棋的走棋規則
V4.0 : 實現所有棋子的吃子功能
GItHub源碼下載地址:https://github.com/xiugangzhang/ChineseChess
如果需要直接體驗的朋友也可以直接通過這個連接體驗哈:
http://htmlpreview.github.io/?https://github.com/xiugangzhang/ChineseChess/blob/master/ChineseChess.html
其他項目推薦:
視頻網站項目:https://github.com/xiugangzhang/vip.github.io(在線體驗地址:http://vip.52tech.tech)
超級馬里奧游戲項目:https://github.com/xiugangzhang/SuperMarioGame
如果覺得不錯,也歡迎大家給個star支持一下,你的支持就是我前進的動力!
中國象棋項目源碼:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> * { margin: 0; padding: 0; } </style> </head> <body> <canvas id="myCanvas" width="600px" height="660px"> </canvas> <script> //V1.0 : 實現棋子的布局,畫布及游戲場景的初始化 //V2.0 : 實現棋子的顏色改變 //V3.0 :實現所有象棋的走棋規則 //V4.0 : 實現所有棋子的吃子功能 var canvas = document.getElementById("myCanvas"); var context = canvas.getContext("2d"); /** * 棋子對象 * @param x * @param y * @param color * @constructor */ function Chess(x, y, color, type) { this.x = x; this.y = y; this.color = color; this.type = type; // 記錄顏色 this.chessColor = color; // 是否死掉 this.isDead = false; } // 成員函數 Chess.prototype = { _getChessText: function () { switch (this.type) { case "CHE": return "車"; case "MA": return "馬"; case "PAO": return "炮"; case "BING": return "兵"; case "JIANG": return "將"; case "SHI": return "士"; case "XIANG": return "相"; } return "錯誤"; } } /** * 游戲場景 * @constructor */ function Game() { // 存放當前棋盤上所有的棋子 this._chesses = []; //初始位置 this._initX = 60; this._initY = 60; // 判斷鼠標是否點擊有棋子 this._selectedChess = null; this._initCount = 0; } Game.prototype = { // 場景的初始化 execute: function () { this._initChesses(); this._start(); }, _initChesses: function () { // 繪制棋子(初始位置) // 總共需要繪制32顆棋子 // 紅色棋子 var redChess; for (var i = 0; i < 4; i++) { for (var j = 0; j < 9; j++) { if ((i == 0 && j == 0) || (j == 8 && i == 0)) { // 把棋子的顏色傳進去 redChess = new Chess(j, i, "red", "CHE"); this._chesses.push(redChess); } else if ((j == 1 && i == 0) || (j == 7 && i == 0 )) { redChess = new Chess(j, i, "red", "MA"); this._chesses.push(redChess); } else if ((j == 2 && i == 0) || (j == 6 && i == 0)) { redChess = new Chess(j, i, "red", "XIANG"); this._chesses.push(redChess); } else if ((j == 3 && i == 0) || (j == 5 && i == 0)) { redChess = new Chess(j, i, "red", "SHI"); this._chesses.push(redChess); } else if ((j == 4 && i == 0)) { redChess = new Chess(j, i, "red", "JIANG"); this._chesses.push(redChess); } else if ((j == 1 && i == 2) || (j == 7 && i == 2)) { redChess = new Chess(j, i, "red", "PAO"); this._chesses.push(redChess); } else if ((j == 0 && i == 3) || (j == 2 && i == 3) || (j == 4 && i == 3) || (j == 6 && i == 3) || (j == 8 && i == 3)) { redChess = new Chess(j, i, "red", "BING"); this._chesses.push(redChess); } } } // 繪制黑色棋子 var blackChess; for (var i = 6; i < 10; i++) { for (var j = 0; j < 10; j++) { if ((j == 0 && i == 9) || (j == 8 && i == 9)) { blackChess = new Chess(j, i, "black", "CHE"); this._chesses.push(blackChess); } else if ((j == 1 && i == 9) || (j == 7 && i == 9)) { blackChess = new Chess(j, i, "black", "MA"); this._chesses.push(blackChess); } else if ((j == 2 && i == 9) || (j == 6 && i == 9)) { blackChess = new Chess(j, i, "black", "XIANG"); this._chesses.push(blackChess); } else if ((j == 3 && i == 9) || (j == 5 && i == 9)) { blackChess = new Chess(j, i, "black", "SHI"); this._chesses.push(blackChess); } else if (j == 4 && i == 9) { blackChess = new Chess(j, i, "black", "JIANG"); this._chesses.push(blackChess); } else if ((j == 1 && i == 7) || (j == 7 && i == 7)) { blackChess = new Chess(j, i, "black", "PAO"); this._chesses.push(blackChess); } else if ((j == 0 && i == 6) || (j == 2 && i == 6) || (j == 4 && i == 6) || (j == 6 && i == 6) || (j == 8 && (i == 6))) { blackChess = new Chess(j, i, "black", "BING"); this._chesses.push(blackChess); } } } //console.log(redChess); //console.log(blackChess); console.log(this._chesses); }, /** * 繪制棋子 車馬相士將 * @private */ _drawChesses: function () { var isDeadChess = null; // 根據游戲中棋子的數目來繪制棋子 // 游戲中的棋子始終是32顆, 因此只能根據棋子是否存活來決定是否繪制這個棋子(原來的位置還是有棋子, 這是讓他隱藏起來) for (var i = 0; i < this._chesses.length; i++) { var chess = this._chesses[i]; // 原來的位置還是有棋子, 這是讓他隱藏起來 if (!chess.isDead) { // 只有當這個棋子的屬性isDead = false; 才繪制這個棋子 // 根據棋子的屬性來繪制 context.fillStyle = "#C78843"; context.beginPath(); // 繪制棋子(注意要把棋子的初始位置復位) context.arc(chess.x * 60 + this._initX, chess.y * 60 + this._initY, 25, 0, Math.PI * 2, true); context.closePath(); context.fill(); // 繪制文本 if (chess.color == "red") { context.fillStyle = 'red'; } if (chess.color == "black") { context.fillStyle = 'black'; } if (chess.color == "blue") { context.fillStyle = 'blue'; } context.font = '43px 華文新魏'; context.fillText(chess._getChessText(), chess.x * 60 + this._initX - 22, chess.y * 60 + this._initY + 10); } else { isDeadChess = chess; } } // 有棋子被吃了,就重新開始 //this._selectedChess = null; if (this._initCount == 0) { //console.log(chess.x+","+chess.y+","+chess.type+"已經隱藏"); } }, _drawChessboard: function () { context.strokeStyle = "black"; // 繪制棋盤外邊界 context.lineWidth = 3; context.beginPath(); context.moveTo(0, 0); context.lineTo(600, 0); context.closePath(); context.stroke(); context.beginPath(); context.moveTo(0, 0); context.lineTo(0, 660); context.closePath(); context.stroke(); context.beginPath(); context.moveTo(600, 0); context.lineTo(600, 660); context.closePath(); context.stroke(); context.beginPath(); context.moveTo(0, 660); context.lineTo(660, 660); context.closePath(); context.stroke(); // 內部的外邊界 context.beginPath(); context.moveTo(40, 40); context.lineTo(40, 620); context.closePath(); context.stroke(); context.beginPath(); context.moveTo(40, 40); context.lineTo(560, 40); context.closePath(); context.stroke(); context.beginPath(); context.moveTo(560, 40); context.lineTo(560, 620); context.closePath(); context.stroke(); context.beginPath(); context.moveTo(560, 620); context.lineTo(40, 620); context.closePath(); context.stroke(); //棋盤橫線 context.lineWidth = 1; for (var i = 1; i < 11; i++) { context.beginPath(); context.moveTo(60, 60 * i); context.lineTo(540, 60 * i); context.closePath(); context.stroke(); } // 棋盤縱線 for (var i = 1; i < 10; i++) { context.beginPath(); context.moveTo(i * 60, 60); context.lineTo(i * 60, 300); context.closePath(); context.stroke(); } for (var i = 1; i < 10; i++) { context.beginPath(); context.moveTo(i * 60, 360); context.lineTo(i * 60, 600); context.closePath(); context.stroke(); } context.beginPath(); context.moveTo(60, 300); context.lineTo(60, 360); context.closePath(); context.stroke(); context.beginPath(); context.moveTo(540, 300); context.lineTo(540, 360); context.closePath(); context.stroke(); // 棋盤斜線 context.beginPath(); context.moveTo(240, 60); context.lineTo(360, 180); context.closePath(); context.stroke(); context.beginPath(); context.moveTo(360, 60); context.lineTo(240, 180); context.closePath(); context.stroke(); context.beginPath(); context.moveTo(240, 480); context.lineTo(360, 600); context.closePath(); context.stroke(); context.beginPath(); context.moveTo(360, 480); context.lineTo(240, 600); context.closePath(); context.stroke(); // 繪制炮的位置(左上) context.beginPath(); context.moveTo(115, 160); context.lineTo(115, 175); context.closePath(); context.stroke(); context.beginPath(); context.moveTo(115, 175); context.lineTo(100, 175); context.closePath(); context.stroke(); context.beginPath(); context.moveTo(125, 160); context.lineTo(125, 175); context.closePath(); context.stroke(); context.beginPath(); context.moveTo(125, 175); context.lineTo(140, 175); context.closePath(); context.stroke(); context.beginPath(); context.moveTo(115, 185); context.lineTo(115, 200); context.closePath(); context.stroke(); context.beginPath(); context.moveTo(115, 185); context.lineTo(100, 185); context.closePath(); context.stroke(); context.beginPath(); context.moveTo(125, 185); context.lineTo(125, 200); context.closePath(); context.stroke(); context.beginPath(); context.moveTo(125, 185); context.lineTo(140, 185); context.closePath(); context.stroke(); // 右上 context.beginPath(); context.moveTo(475, 175); context.lineTo(460, 175); context.closePath(); context.stroke(); context.beginPath(); context.moveTo(475, 175); context.lineTo(475, 160); context.closePath(); context.stroke(); context.beginPath(); context.moveTo(485, 160); context.lineTo(485, 175); context.closePath(); context.stroke(); context.beginPath(); context.moveTo(485, 175); context.lineTo(500, 175); context.closePath(); context.stroke(); context.beginPath(); context.moveTo(485, 185); context.lineTo(485, 200); context.closePath(); context.stroke(); context.beginPath(); context.moveTo(485, 185); context.lineTo(500, 185); context.closePath(); context.stroke(); context.beginPath(); context.moveTo(475, 185); context.lineTo(475, 200); context.closePath(); context.stroke(); context.beginPath(); context.moveTo(475, 185); context.lineTo(460, 185); context.closePath(); context.stroke(); // 左下 context.beginPath(); context.moveTo(115, 485); context.lineTo(115, 500); context.closePath(); context.stroke(); context.beginPath(); context.moveTo(115, 485); context.lineTo(100, 485); context.closePath(); context.stroke(); context.beginPath(); context.moveTo(115, 475); context.lineTo(100, 475); context.closePath(); context.stroke(); context.beginPath(); context.moveTo(115, 475); context.lineTo(115, 460); context.closePath(); context.stroke(); context.beginPath(); context.moveTo(125, 475); context.lineTo(140, 475); context.closePath(); context.stroke(); context.beginPath(); context.moveTo(125, 475); context.lineTo(125, 460); context.closePath(); context.stroke(); context.beginPath(); context.moveTo(125, 485); context.lineTo(140, 485); context.closePath(); context.stroke(); context.beginPath(); context.moveTo(125, 485); context.lineTo(125, 500); context.closePath(); context.stroke(); // 右下 context.beginPath(); context.moveTo(475, 485); context.lineTo(475, 500); context.closePath(); context.stroke(); context.beginPath(); context.moveTo(475, 485); context.lineTo(460, 485); context.closePath(); context.stroke(); context.beginPath(); context.moveTo(475, 475); context.lineTo(475, 460); context.closePath(); context.stroke(); context.beginPath(); context.moveTo(475, 475); context.lineTo(460, 475); context.closePath(); context.stroke(); context.beginPath(); context.moveTo(485, 475); context.lineTo(500, 475); context.closePath(); context.stroke(); context.beginPath(); context.moveTo(485, 475); context.lineTo(485, 460); context.closePath(); context.stroke(); context.beginPath(); context.moveTo(485, 485); context.lineTo(500, 485); context.closePath(); context.stroke(); context.beginPath(); context.moveTo(485, 485); context.lineTo(485, 500); context.closePath(); context.stroke(); }, _drawnTitle: function () { //context.clearRect(0, 0, canvas.width, canvas.height); context.fillStyle = 'black'; context.font = '40px 華文新魏'; context.fillText("楚河", 130, 340); context.fillText("漢界", 380, 340); }, _start: function () { // 監聽事件, 把觸發這個事件的對象也傳遞過去 document.addEventListener("click", this._mouseClick.bind(this)); var that = this; // 利用定時器不斷重繪canvas var timer = setInterval(function () { that._draw(); }, 30); }, _draw: function () { context.clearRect(0, 0, canvas.width, canvas.height); this._drawChessboard(); // 繪制棋子 this._drawChesses(); this._drawnTitle(); }, _mouseClick: function (e) { // 把棋盤歸一化 var px = e.clientX - this._initX + 25; var py = e.clientY - this._initY + 25; //console.log(px + " "+py); // 當前鼠標點擊棋盤的位置 var x = parseInt(px / 60); var y = parseInt(py / 60); if (x > 8 || x < 0 || y > 9 || y < 0 || px < 0) { return; } console.log(this._selectedChess); // 之前沒有選中棋子(一直點擊的是空白位置) if (this._selectedChess == null) { //如果當前鼠標點擊的位置有棋子,就是選中了棋子 for (var i = 0; i < this._chesses.length; i++) { var chess = this._chesses[i]; // 每次拿出來棋子都要看一下這個棋子是不是還活着, 已經死了的棋子不處理 if (!chess.isDead) { if (x == chess.x && y == chess.y) { // 如果有棋子 this._selectedChess = chess; this._selectedChess.color = "blue"; break; } else { // 沒有棋子 //alert("沒有棋子"); //break; } } } } else { var color = this._selectedChess.chessColor; var srcX = this._selectedChess.x; var srcY = this._selectedChess.y; var destX = x; var destY = y; this._canKill(srcX, srcY, destX, destY); // 如果已經有了選擇的棋子,就看這一次點擊的位置有沒有棋子 /*var chess = this._getChess(x, y); if (chess){ // 如果這個位置有棋子 console.log("有棋子"); if (chess.chessColor == this._selectedChess.chessColor){ // 如果這兩個棋子的顏色相同 alert("請不要自相殘殺!"); //同一個棋子點擊了兩下就恢復初始狀態 //this._selectedChess = null; this._selectedChess.color = this._selectedChess.chessColor; this._selectedChess = null; return; } else { // 如果顏色不相同 // 首先看一下這個棋子能不能移動 var type = this._selectedChess.type; var srcX = this._selectedChess.x; var srcY = this._selectedChess.y; var destX = x; var destY = y; var color = this._selectedChess.chessColor; // 我們先來判斷能不能移動棋子, 然后再來判斷能不能吃子 switch (type) { case "CHE": if (this._canMoveChe(color, srcX, srcY, destX, destY)) { // 移動棋子 this._moveChess(srcX, srcY, destX, destY); return; } else { // 點擊了顏色相同但是屬性不同的其他棋子 alert("不能移動棋子!"); // 顏色相同的同類棋子就恢復初始狀態 this._selectedChess.color = this._selectedChess.chessColor; this._selectedChess = null; return; } break; case "MA": if (this._canMoveMa(color, srcX, srcY, destX, destY)) { // 移動棋子 this._moveChess(srcX, srcY, destX, destY); return; } else { // 點擊了顏色相同但是屬性不同的其他棋子 alert("不能移動棋子!"); // 顏色相同的同類棋子就恢復初始狀態 this._selectedChess.color = this._selectedChess.chessColor; this._selectedChess = null; return; } break; case "XIANG": if (this._canMoveXiang(color, srcX, srcY, destX, destY)) { // 移動棋子 this._moveChess(srcX, srcY, destX, destY); return; } else { // 點擊了顏色相同但是屬性不同的其他棋子 alert("不能移動棋子!"); // 顏色相同的同類棋子就恢復初始狀態 this._selectedChess.color = this._selectedChess.chessColor; this._selectedChess = null; return; } break; case "SHI": if (this._canMoveShi(color, srcX, srcY, destX, destY)) { // 移動棋子 this._moveChess(srcX, srcY, destX, destY); return; } else { // 點擊了顏色相同但是屬性不同的其他棋子 alert("不能移動棋子!"); // 顏色相同的同類棋子就恢復初始狀態 this._selectedChess.color = this._selectedChess.chessColor; this._selectedChess = null; return; } break; case "JIANG": if (this._canMoveJiang(color, srcX, srcY, destX, destY)) { // 移動棋子 this._moveChess(srcX, srcY, destX, destY); return; } else { // 點擊了顏色相同但是屬性不同的其他棋子 alert("不能移動棋子!"); // 顏色相同的同類棋子就恢復初始狀態 this._selectedChess.color = this._selectedChess.chessColor; this._selectedChess = null; return; } break; case "PAO": if (this._canMovePao(color, srcX, srcY, destX, destY)) { // 移動棋子 this._moveChess(srcX, srcY, destX, destY); return; } else { // 點擊了顏色相同但是屬性不同的其他棋子 alert("不能移動棋子!"); // 顏色相同的同類棋子就恢復初始狀態 this._selectedChess.color = this._selectedChess.chessColor; this._selectedChess = null; return; } case "BING": if (this._canMoveBing(color, srcX, srcY, destX, destY)) { // 移動棋子 this._moveChess(srcX, srcY, destX, destY); return; } else { // 點擊了顏色相同但是屬性不同的其他棋子 alert("不能移動棋子!"); // 顏色相同的同類棋子就恢復初始狀態 this._selectedChess.color = this._selectedChess.chessColor; this._selectedChess = null; return; } break; } } } // 已經有選擇的棋子 for (var i = 0; i < this._chesses.length; i++) { var chess = this._chesses[i]; // 只處理沒有死掉的棋子 if (x == chess.x && y == chess.y) { // 這次點擊的位置如果有棋子,就看有沒有死 if (!chess.isDead) { // 第一次有棋子, 第二次也有棋子 // 判斷兩次點擊的棋子顏色是不是相同 if (chess.chessColor == this._selectedChess.chessColor) { // 兩次點擊的顏色都相同 if ((chess.type == this._selectedChess.type) && (chess.x == this._selectedChess.x) && (chess.y == this._selectedChess.y)) { // 顏色坐標和屬性都相同(同一個棋子) alert("你選擇的是同一個棋子"); //同一個棋子點擊了兩下就恢復初始狀態 //this._selectedChess = null; this._selectedChess.color = this._selectedChess.chessColor; this._selectedChess = null; break; } else { // 點擊了顏色相同但是屬性不同的其他棋子 alert("不能自相殘殺!"); // 顏色相同的同類棋子就恢復初始狀態 this._selectedChess.color = this._selectedChess.chessColor; this._selectedChess = null; break; } } else { // 兩次點擊的顏色不相同 alert(this._selectedChess.chessColor + "可以吃" + chess.chessColor); var type = this._selectedChess.type; // 在我吃棋子的時候我先去判斷選擇的棋子能不能移動到目標的位置 switch (type) { case "CHE": break; case "MA": break; case "XIANG": break; case "SHI": break; case "JIANG": if (this._canMoveJiang(x, y)) { // 目標棋子消失,我方棋子補上去 chess.isDead = true; // 補上去(這里修改的其實是之前那顆棋子的引用) this._selectedChess.x = chess.x; this._selectedChess.y = chess.y; // 顏色恢復 this._selectedChess.color = this._selectedChess.chessColor; // 吃完棋子之后, 就恢復到初始狀態 this._selectedChess = null; } else { // 點擊了顏色相同但是屬性不同的其他棋子 alert("吃法違規!"); // 顏色相同的同類棋子就恢復初始狀態 this._selectedChess.color = this._selectedChess.chessColor; this._selectedChess = null; } break; case "PAO": case "BING": break; } // 目標棋子消失,我方棋子補上去 chess.isDead = true; // 補上去(這里修改的其實是之前那顆棋子的引用) this._selectedChess.x = chess.x; this._selectedChess.y = chess.y; // 顏色恢復 this._selectedChess.color = this._selectedChess.chessColor; // 吃完棋子之后, 就恢復到初始狀態 this._selectedChess = null; break; } } else { // 第一次有棋子, 第二次沒有棋子 //alert("移動棋子"); //break; // 棋子已經死了的話,就不考慮 console.log("移動棋子"); } } else { // 第二次點擊的位置上面沒有棋子 console.log("移動棋子222"); var type = this._selectedChess.type; var srcX = this._selectedChess.x; var srcY = this._selectedChess.y; var destX = x; var destY = y; var color = this._selectedChess.chessColor; // 我們先來判斷能不能移動棋子, 然后再來判斷能不能吃子 switch (type) { case "CHE": if (this._canMoveChe(color, srcX, srcY, destX, destY)) { // 移動棋子 this._moveChess(srcX, srcY, destX, destY); return; } else { // 點擊了顏色相同但是屬性不同的其他棋子 alert("不能移動棋子!"); // 顏色相同的同類棋子就恢復初始狀態 this._selectedChess.color = this._selectedChess.chessColor; this._selectedChess = null; return; } break; case "MA": if (this._canMoveMa(color, srcX, srcY, destX, destY)) { // 移動棋子 this._moveChess(srcX, srcY, destX, destY); return; } else { // 點擊了顏色相同但是屬性不同的其他棋子 alert("不能移動棋子!"); // 顏色相同的同類棋子就恢復初始狀態 this._selectedChess.color = this._selectedChess.chessColor; this._selectedChess = null; return; } break; case "XIANG": if (this._canMoveXiang(color, srcX, srcY, destX, destY)) { // 移動棋子 this._moveChess(srcX, srcY, destX, destY); return; } else { // 點擊了顏色相同但是屬性不同的其他棋子 alert("不能移動棋子!"); // 顏色相同的同類棋子就恢復初始狀態 this._selectedChess.color = this._selectedChess.chessColor; this._selectedChess = null; return; } break; case "SHI": if (this._canMoveShi(color, srcX, srcY, destX, destY)) { // 移動棋子 this._moveChess(srcX, srcY, destX, destY); return; } else { // 點擊了顏色相同但是屬性不同的其他棋子 alert("不能移動棋子!"); // 顏色相同的同類棋子就恢復初始狀態 this._selectedChess.color = this._selectedChess.chessColor; this._selectedChess = null; return; } break; case "JIANG": if (this._canMoveJiang(color, srcX, srcY, destX, destY)) { // 移動棋子 this._moveChess(srcX, srcY, destX, destY); return; } else { // 點擊了顏色相同但是屬性不同的其他棋子 alert("不能移動棋子!"); // 顏色相同的同類棋子就恢復初始狀態 this._selectedChess.color = this._selectedChess.chessColor; this._selectedChess = null; return; } break; case "PAO": if (this._canMovePao(color, srcX, srcY, destX, destY)) { // 移動棋子 this._moveChess(srcX, srcY, destX, destY); return; } else { // 點擊了顏色相同但是屬性不同的其他棋子 alert("不能移動棋子!"); // 顏色相同的同類棋子就恢復初始狀態 this._selectedChess.color = this._selectedChess.chessColor; this._selectedChess = null; return; } case "BING": if (this._canMoveBing(color, srcX, srcY, destX, destY)) { // 移動棋子 this._moveChess(srcX, srcY, destX, destY); return; } else { // 點擊了顏色相同但是屬性不同的其他棋子 alert("不能移動棋子!"); // 顏色相同的同類棋子就恢復初始狀態 this._selectedChess.color = this._selectedChess.chessColor; this._selectedChess = null; return; } break; } } }*/ //alert("1212"); } }, _isChessSelected: function () { }, _canMoveChe: function (color, srcX, srcY, destX, destY) { // 獲得點擊坐標處的所有xy上面的棋子狀態 var allCanMovePoint = this._getXAndYChesss(srcX, srcY); // 想辦法獲得橫縱坐標上面一旦有棋子之間的坐標 // 這幾個數組主要用於存儲我點擊的位置上下左右四個方向第一次出現棋子到我現在這個棋子之間的棋子狀態 var rightChess = this._getRightChesses(srcX, srcY); var leftChess = this._getLeftChesses(srcX, srcY); var upChess = this._getUpChesses(srcX, srcY); var downChess = this._getDownChesses(srcX, srcY); // 開始實現移動車的規則. for (var i = 0; i < allCanMovePoint.length; i++) { var point = allCanMovePoint[i]; if (destX == point.x && destY == point.y) { // 如果我當前要移動的點在我的這個點集合中 if (!point.tag) { //而且這個位置沒有棋子 // 開始進一步限定移動的范圍 // 上 if (destY < srcY) { for (var j = 0; j < upChess.length; j++) { // 取出可以向上移動的所有棋子的位置 var chess = upChess[j]; // 如果我點擊的位置在這個集合里面 if (destX == chess.x && destY == chess.y) { if (!chess.tag) { // 沒有棋子 return true; } } } return false; } // 下 if (destY > srcY) { for (var j = 0; j < downChess.length; j++) { var chess = downChess[j]; // 如果我點擊的位置在這個集合里面 if (destX == chess.x && destY == chess.y) { if (!chess.tag) { // 沒有棋子 return true; } } } return false; } // 左 if (destX < srcX) { for (var j = 0; j < leftChess.length; j++) { var chess = leftChess[j]; // 如果我點擊的位置在這個集合里面 if (destX == chess.x && destY == chess.y) { if (!chess.tag) { // 沒有棋子 return true; } } } return false; } // 右 if (destX > srcX) { for (var j = 0; j < rightChess.length; j++) { var chess = rightChess[j]; // 如果我點擊的位置在這個集合里面 if (destX == chess.x && destY == chess.y) { if (!chess.tag) { // 沒有棋子 return true; } } } } return false; } else{ //如果有棋子 // 看下這個棋子的顏色 var chessColor = point.chessColor; if (chessColor != ""){ // 這個位置有棋子 var srcChess = this._getChess(srcX, srcY); var killChess = this._getChess(destX, destY); if (chessColor != srcChess.chessColor){ // 殺死的棋子消失 killChess.isDead = true; srcChess.x = destX; srcChess.y = destY; // 可以移動 return true; } } } } } return false; }, _canMoveMa: function (color, srcX, srcY, destX, destY) { // 獲得可以移動的位置點 var maCanMovePoint = []; // 是否可以真正移動的標記 var isMaCanMove = false; // 找到馬周圍的可以移動的8個點 var tag = false; // 默認沒有棋子 for (var i = srcX - 2; i <= srcX + 2; i++) { for (var j = srcY - 2; j <= srcY + 2; j++) { // 只存儲在棋盤里面的棋子 if (i >= 0 && i <= 8 && j >= 0 && j <= 9) { // 保存之前還有看一下以下幾個問題(向左) if ((destX == srcX - 2 && destY == srcY - 1) || (destX == srcX - 2 && destY == srcY + 1)){ var chess = this._getChess(srcX-1, srcY); if (!chess){ isMaCanMove = true; } } // 向上 if ((destX == srcX - 1 && destY == srcY-2) || (destX == srcX+1 && destY == srcY-2)){ var chess = this._getChess(srcX, srcY-1); if (!chess){ isMaCanMove = true; } } // 向右 if ((destX == srcX +2 && destY == srcY-1) || (destX == srcX+2 && destY == srcY+1)){ var chess = this._getChess(srcX+1, srcY); if (!chess){ isMaCanMove = true; } } // 向下 if ((destX == srcX -1 && destY == srcY+2) || (destX == srcX+1 && destY == srcY+2)){ var chess = this._getChess(srcX, srcY+1); if (!chess){ isMaCanMove = true; } } if ((srcX - 2 == i && srcY - 1 == j) || (srcX - 2 == i && srcY + 1 == j) || (srcX - 1 == i && srcY - 2 == j) || (srcX - 1 == i && srcY + 2 == j) || (srcX + 1 == i && srcY - 2 == j) || (srcX + 1 == i && srcY + 2 == j) || (srcX + 2 == i && srcY - 1 == j) || (srcX + 2 == i && srcY + 1 == j)) { var chess = this._getChess(i, j); if (chess) { tag = true; } else { tag = false; } // 保存點 maCanMovePoint.push({ x: i, y: j, tag: tag, isCanMove : isMaCanMove }); } } } } // 拿到這個集合, 然后遍歷 for (var i = 0; i<maCanMovePoint.length; i++){ var point = maCanMovePoint[i]; //看我當前點擊的位置有沒有在這些點集合中 if (destX == point.x && destY == point.y){ //如果在的話 if (!point.tag){ // 而且這個位置沒有棋子 if (point.isCanMove){ return true; } } } } return false; }, _canMoveXiang: function (color, srcX, srcY, destX, destY) { var xiangCanMovePoint = []; if (color == "black") { xiangCanMovePoint = [{x: 0, y: 7}, {x: 2, y: 5}, {x: 2, y: 9}, {x: 4, y: 7}, {x: 6, y: 5}, { x: 6, y: 9 }, {x: 8, y: 7}]; } else { xiangCanMovePoint = [{x: 0, y: 2}, {x: 2, y: 0}, {x: 2, y: 4}, {x: 4, y: 2}, {x: 6, y: 0}, { x: 6, y: 4 }, {x: 8, y: 2}]; } // 象的移動不能超過2格子 if (Math.abs(srcX - destX) == 2 || Math.abs(srcY - destY) == 2) { // 再看這個田字狀的中心有沒有棋子 var centerX = (destX + srcX) / 2; var centerY = (destY + srcY) / 2; console.log("cebter:" + centerX + "," + centerY); if (this._getChess(centerX, centerY)) { // 有棋子 return false; } else { for (var i = 0; i < xiangCanMovePoint.length; i++) { var point = xiangCanMovePoint[i]; if (destX == point.x && destY == point.y) { // 再去看這個位置有沒有棋子 var chess = this._getChess(destX, destY); if (chess && chess.chessColor == color) { // 有棋子 return false; } else { return true; } } } } } return false; }, _canMoveShi: function (color, srcX, srcY, destX, destY) { var shiCanMovePoint = []; if (color == "black") { shiCanMovePoint = [{x: 3, y: 7}, {x: 3, y: 9}, {x: 5, y: 7}, {x: 5, y: 9}, {x: 4, y: 8}]; } else { shiCanMovePoint = [{x: 3, y: 0}, {x: 3, y: 2}, {x: 5, y: 0}, {x: 5, y: 2}, {x: 4, y: 1}]; } // 一進來看下是不是跨格子移動 if (Math.abs(srcX - destX) == 1 || Math.abs(srcY - destY) == 1) { for (var i = 0; i < shiCanMovePoint.length; i++) { var point = shiCanMovePoint[i]; if (destX == point.x && destY == point.y) { //再去看這個位置有沒有棋子 var chess = this._getChess(destX, destY); // 如果這里有棋子,而且是自己的棋子,就不能移動 if (chess && chess.chessColor == color) { // 有棋子 return false; } else { // 沒有棋子 return true; } } } } }, _canMoveJiang: function (color, srcX, srcY, destX, destY) { var jingCanMovePoint = []; // 先看下是什么顏色 if (color == "black") { // 黑色棋子 jingCanMovePoint = [{x: 3, y: 7}, {x: 3, y: 8}, {x: 3, y: 9}, {x: 4, y: 7}, { x: 4, y: 8 }, {x: 4, y: 9}, {x: 5, y: 7}, {x: 5, y: 8}, {x: 5, y: 9}]; } else { // 紅色棋子 jingCanMovePoint = [{x: 3, y: 0}, {x: 3, y: 1}, {x: 3, y: 2}, {x: 4, y: 0}, { x: 4, y: 1 }, {x: 4, y: 2}, {x: 5, y: 0}, {x: 5, y: 1}, {x: 5, y: 2}]; } //一進來就先判斷是不是跨格子移動 if (srcX == destX || srcY == destY) { if (Math.abs(srcX - destX) == 1 || Math.abs(srcY - destY) == 1) { for (var i = 0; i < jingCanMovePoint.length; i++) { var point = jingCanMovePoint[i]; if (destX == point.x && destY == point.y) { // 然后再去看這些點上有沒有棋子 var chess = this._getChess(destX, destY); if (chess) { // 有棋子 return false; } return true; } } return false; } return false; } }, _canMovePao: function (color, srcX, srcY, destX, destY) { // 獲得點擊坐標處的所有xy上面的棋子狀態 var allCanMovePoint = this._getXAndYChesss(srcX, srcY); // 想辦法獲得橫縱坐標上面一旦有棋子之間的坐標 // 這幾個數組主要用於存儲我點擊的位置上下左右四個方向第一次出現棋子到我現在這個棋子之間的棋子狀態 var rightChess = this._getRightChesses(srcX, srcY); var leftChess = this._getLeftChesses(srcX, srcY); var upChess = this._getUpChesses(srcX, srcY); var downChess = this._getDownChesses(srcX, srcY); // 開始實現移動車的規則. for (var i = 0; i < allCanMovePoint.length; i++) { var point = allCanMovePoint[i]; if (destX == point.x && destY == point.y) { // 如果我當前要移動的點在我的這個點集合中 if (!point.tag) { //而且這個位置沒有棋子 // 開始進一步限定移動的范圍 // 上 if (destY < srcY) { for (var j = 0; j < upChess.length; j++) { // 取出可以向上移動的所有棋子的位置 var chess = upChess[j]; // 如果我點擊的位置在這個集合里面 if (destX == chess.x && destY == chess.y) { if (!chess.tag) { // 沒有棋子 return true; } } } return false; } // 下 if (destY > srcY) { for (var j = 0; j < downChess.length; j++) { var chess = downChess[j]; // 如果我點擊的位置在這個集合里面 if (destX == chess.x && destY == chess.y) { if (!chess.tag) { // 沒有棋子 return true; } } } return false; } // 左 if (destX < srcX) { for (var j = 0; j < leftChess.length; j++) { var chess = leftChess[j]; // 如果我點擊的位置在這個集合里面 if (destX == chess.x && destY == chess.y) { if (!chess.tag) { // 沒有棋子 return true; } } } return false; } // 右 if (destX > srcX) { for (var j = 0; j < rightChess.length; j++) { var chess = rightChess[j]; // 如果我點擊的位置在這個集合里面 if (destX == chess.x && destY == chess.y) { if (!chess.tag) { // 沒有棋子 return true; } } } } return false; } } } return false; }, _canMoveBing: function (color, srcX, srcY, destX, destY) { // 兵的走棋規則: 只能走直線, 只能向前走, 過了河之后可以左右走 var isGoRiver = false; // 默認情況下沒有過河 // 要想左右走, 必須先過河 if (color == "black") { if (srcY != 5 && srcY != 6) { isGoRiver = true; } } else { if (srcY != 3 && srcY != 4) { isGoRiver = true; } } // 黑色棋子的可以移動方向:上,左,右 if (color == "black") { // 可以向上下左右四個方向來移動棋子 if (destY < srcY) { //向上 //獲得可以向上行走的位置 var upChess = this._getUpChesses(srcX, srcY); for (var i = 0; i < upChess.length; i++) { var chess = upChess[i]; if (destX == chess.x && destY == chess.y) { // 如果我點擊的位置在我向上走的這個集合里面 if (!chess.tag) { // 而且這個位置沒有棋子 // 每次移動的間隔為1 if (Math.abs(destX - srcX) == 1 || Math.abs(destY - srcY) == 1) { return true; } } } } } } // 紅色棋子的移動方向:下,左, 右 if (color == "red") { if (destY > srcY) { // 向下 //獲得可以向上行走的位置 var downChess = this._getDownChesses(srcX, srcY); for (var i = 0; i < downChess.length; i++) { var chess = downChess[i]; if (destX == chess.x && destY == chess.y) { // 如果我點擊的位置在我向上走的這個集合里面 if (!chess.tag) { // 而且這個位置沒有棋子 // 每次移動的間隔為1 if (Math.abs(destX - srcX) == 1 || Math.abs(destY - srcY) == 1) { return true; } } } } } } // 向左行走 if (destX < srcX && isGoRiver) { // 向左 //獲得可以向左行走的位置 var leftChess = this._getLeftChesses(srcX, srcY); for (var i = 0; i < leftChess.length; i++) { var chess = leftChess[i]; if (destX == chess.x && destY == chess.y) { // 如果我點擊的位置在我向上走的這個集合里面 if (!chess.tag) { // 而且這個位置沒有棋子 // 每次移動的間隔為1 if (Math.abs(destX - srcX) == 1 || Math.abs(destY - srcY) == 1) { return true; } } } } } // 向右走 if (destX > srcX && isGoRiver) { // 向右 //獲得可以向右行走的位置 var rightChess = this._getRightChesses(srcX, srcY); for (var i = 0; i < rightChess.length; i++) { var chess = rightChess[i]; if (destX == chess.x && destY == chess.y) { // 如果我點擊的位置在我向上走的這個集合里面 if (!chess.tag) { // 而且這個位置沒有棋子 // 每次移動的間隔為1 if (Math.abs(destX - srcX) == 1 || Math.abs(destY - srcY) == 1) { return true; } } } } } }, _moveChess: function (srcX, srcY, destX, destY) { // 移動棋子 this._selectedChess.x = destX; this._selectedChess.y = destY; // 顏色恢復 this._selectedChess.color = this._selectedChess.chessColor; // 吃完棋子之后, 就恢復到初始狀態 this._selectedChess = null; }, _getMovePoint: function (srcX, srcY) { // 主要用於獲得一個點的8個方向上面的棋子狀態 var x = srcX; var y = srcY; var movePoint = []; for (var i = x - 1; i <= x + 1; i++) { for (var j = y - 1; j <= y + 1; j++) { //首先判斷該點是否在棋盤內 if ((i >= 0 && i <= 8) && (j >= 0 && j <= 9)) { //接着判斷該點有無棋子 var tag = false;//假設該點沒有棋子 for (var m = 0; m < this._chesses.length; m++) { var chess = this._chesses[m]; if (!chess.isDead) { if (i == chess.x && j == chess.y) { tag = true;//說明有棋子 break; } } } movePoint.push({ x: i, y: j, tag: tag }); } } } return movePoint; }, _getXAndYChesss: function (srcX, srcY) { // 求出來車可以移動的所有的位置 var MovePoint = []; var allCanMovePoint = []; var tagColor; // 找出x坐標上的所有點 for (var i = 0; i < 10; i++) { MovePoint.push({ x: srcX, y: i }); } // 找出y坐標上的所有點 for (var j = 0; j < 9; j++) { MovePoint.push({ x: j, y: srcY }); } // 車的行走規則:走直線,只要直線上沒有棋子都可以走: 只能走srcX或者srcY方向上面的直線 var tag = false; // 默認沒有棋子 for (var i = 0; i < MovePoint.length; i++) { var point = MovePoint[i]; // 再看這些個坐標點上面有沒有棋子 var chess = this._getChess(point.x, point.y); if (chess) { tag = true; tagColor = chess.chessColor; } else { tag = false; } // 把這些點的狀態記錄下來 allCanMovePoint.push({ x: point.x, y: point.y, tag: tag, chessColor : tagColor }); } return allCanMovePoint; }, _getRightChesses: function (srcX, srcY) { var rightChess = []; // 獲得這個棋子之后的所有棋子 var firstChess = 0; var tagColor = ""; for (var i = srcX; i <= 8; i++) { var tag = false; // 此時這個位置之后的棋子x坐標為srcX, srcX+1, ...... // y坐標一直未scrY // 判斷這個位置有沒有棋子 var chess = this._getChess(i, srcY); if (chess) { tag = true; tagColor = chess.chessColor; firstChess++; } rightChess.push({ x: i, y: srcY, tag: tag, // 這里添加一個屬性 chessColor : tagColor }); // 存儲完畢之后,恢復初始狀態 tagColor = ""; // 一旦有棋子就退出 if (firstChess == 2) { firstChess = 0; // 恢復初始狀態 break; } } return rightChess; }, _getLeftChesses: function (srcX, srcY) { var leftChess = []; var firstChess = 0; var tagColor = ""; // 點擊位置左邊的所有棋子 for (var i = srcX; i >= 0; i--) { var tag = false; // 此時這個位置之后的棋子x坐標為srcX-1, srcX-2, ...... // y坐標一直未scrY // 判斷這個位置有沒有棋子 var chess = this._getChess(i, srcY); if (chess) { tag = true; firstChess++; tagColor = chess.chessColor; } leftChess.push({ x: i, y: srcY, tag: tag, // 這里添加一個屬性 chessColor : tagColor }); // 存儲完畢之后,恢復初始狀態 tagColor = ""; // 一旦有棋子就退出 if (firstChess == 2) { firstChess = 0; // 恢復初始狀態 break; } } return leftChess; }, _getUpChesses: function (srcX, srcY) { var upChess = []; var firstChess = 0; var tagColor = ""; // 點擊位置上面的所有棋子 for (var i = srcY; i >= 0; i--) { var tag = false; // 此時這個位置之后的棋子y坐標為srcY+1, srcY+2, ...... // x坐標一直未scrX // 判斷這個位置有沒有棋子 var chess = this._getChess(srcX, i); if (chess) { tag = true; firstChess++; tagColor = chess.chessColor; } upChess.push({ x: srcX, y: i, tag: tag, // 這里添加一個屬性 chessColor : tagColor }); // 存儲完畢之后,恢復初始狀態 tagColor = ""; // 一旦有棋子就退出 if (firstChess == 2) { firstChess = 0; // 恢復初始狀態 break; } } return upChess; }, _getDownChesses: function (srcX, srcY) { var downChess = []; var firstChess = 0; var tagColor = ""; // 點擊位置下面的所有棋子 for (var i = srcY; i <= 9; i++) { var tag = false; // 此時這個位置之后的棋子y坐標為srcY+1, srcY+2, ...... // x坐標一直未scrX // 判斷這個位置有沒有棋子 var chess = this._getChess(srcX, i); if (chess) { tag = true; firstChess++; tagColor = chess.chessColor; } downChess.push({ x: srcX, y: i, tag: tag, // 這里添加一個屬性 chessColor : tagColor }); // 存儲完畢之后,恢復初始狀態 tagColor = ""; // 一旦有棋子就退出 if (firstChess == 2) { firstChess = 0; // 恢復初始狀態 break; } } return downChess; }, _canKill: function (srcX, srcY, destX, destY) { // 象棋的吃子功能介紹 //1. 如果兩次點擊的棋子顏色不同 //2. 看是否滿足象棋的走棋規則 //3. 如果滿足象棋的走棋規則, 而且兩次點擊的顏色不同我就可以吃子 // 點擊棋子的顏色和吃子的顏色 var srcChess = this._getChess(srcX, srcY); var killChess = this._getChess(destX, destY); var color = srcChess.chessColor; // 如果這兩個位置都有棋子(吃子的前提是兩次點擊的位置都有棋子) if (srcChess != null && killChess != null){ // 看兩次的顏色是不是相同 if (srcChess.chessColor != killChess.chessColor){ // 可以吃 // 然后在我吃棋子之前再判斷這個棋子能不能移動 var type = srcChess.type; // 根據這個棋子的規則來判斷 switch (type) { case "CHE": if (this._canMoveChe(color, srcX, srcY, destX, destY)) { // 開始吃棋子 this._moveChess(srcX, srcY, destX, destY); // 吃完棋子之后的操作(我方棋子補上) /*srcChess.x = destX; srcChess.y = destY; // 對方棋子消失 killChess.isDead = true;*/ return; } else { // 點擊了顏色相同但是屬性不同的其他棋子 alert("不能移動棋子!"); // 顏色相同的同類棋子就恢復初始狀態 this._selectedChess.color = this._selectedChess.chessColor; this._selectedChess = null; return; } break; case "MA": if (this._canMoveMa(color, srcX, srcY, destX, destY)) { // 移動棋子 this._moveChess(srcX, srcY, destX, destY); // 開始吃棋子 this._moveChess(srcX, srcY, destX, destY); // 吃完棋子之后的操作(我方棋子補上) srcChess.x = destX; srcChess.y = destY; // 對方棋子消失 killChess.isDead = true; return; } else { // 點擊了顏色相同但是屬性不同的其他棋子 alert("不能移動棋子!"); // 顏色相同的同類棋子就恢復初始狀態 this._selectedChess.color = this._selectedChess.chessColor; this._selectedChess = null; return; } break; case "XIANG": if (this._canMoveXiang(color, srcX, srcY, destX, destY)) { // 移動棋子 this._moveChess(srcX, srcY, destX, destY); // 開始吃棋子 this._moveChess(srcX, srcY, destX, destY); // 吃完棋子之后的操作(我方棋子補上) srcChess.x = destX; srcChess.y = destY; // 對方棋子消失 killChess.isDead = true; return; } else { // 點擊了顏色相同但是屬性不同的其他棋子 alert("不能移動棋子!"); // 顏色相同的同類棋子就恢復初始狀態 this._selectedChess.color = this._selectedChess.chessColor; this._selectedChess = null; return; } break; case "SHI": if (this._canMoveShi(color, srcX, srcY, destX, destY)) { // 移動棋子 this._moveChess(srcX, srcY, destX, destY); // 開始吃棋子 this._moveChess(srcX, srcY, destX, destY); // 吃完棋子之后的操作(我方棋子補上) srcChess.x = destX; srcChess.y = destY; // 對方棋子消失 killChess.isDead = true; return; } else { // 點擊了顏色相同但是屬性不同的其他棋子 alert("不能移動棋子!"); // 顏色相同的同類棋子就恢復初始狀態 this._selectedChess.color = this._selectedChess.chessColor; this._selectedChess = null; return; } break; case "JIANG": if (this._canMoveJiang(color, srcX, srcY, destX, destY)) { // 移動棋子 this._moveChess(srcX, srcY, destX, destY); // 開始吃棋子 this._moveChess(srcX, srcY, destX, destY); // 吃完棋子之后的操作(我方棋子補上) srcChess.x = destX; srcChess.y = destY; // 對方棋子消失 killChess.isDead = true; return; } else { // 點擊了顏色相同但是屬性不同的其他棋子 alert("不能移動棋子!"); // 顏色相同的同類棋子就恢復初始狀態 this._selectedChess.color = this._selectedChess.chessColor; this._selectedChess = null; return; } break; case "PAO": if (this._canMovePao(color, srcX, srcY, destX, destY)) { // 移動棋子 this._moveChess(srcX, srcY, destX, destY); // 開始吃棋子 this._moveChess(srcX, srcY, destX, destY); // 吃完棋子之后的操作(我方棋子補上) srcChess.x = destX; srcChess.y = destY; // 對方棋子消失 killChess.isDead = true; return; } else { // 點擊了顏色相同但是屬性不同的其他棋子 alert("不能移動棋子!"); // 顏色相同的同類棋子就恢復初始狀態 this._selectedChess.color = this._selectedChess.chessColor; this._selectedChess = null; return; } case "BING": if (this._canMoveBing(color, srcX, srcY, destX, destY)) { // 移動棋子 this._moveChess(srcX, srcY, destX, destY); // 開始吃棋子 this._moveChess(srcX, srcY, destX, destY); // 吃完棋子之后的操作(我方棋子補上) srcChess.x = destX; srcChess.y = destY; // 對方棋子消失 killChess.isDead = true; return; } else { // 點擊了顏色相同但是屬性不同的其他棋子 alert("不能移動棋子!"); // 顏色相同的同類棋子就恢復初始狀態 this._selectedChess.color = this._selectedChess.chessColor; this._selectedChess = null; return; } break; } } else { // 如果點擊的棋子顏色相同 alert("請不要互相殘殺!"); // 顏色相同的同類棋子就恢復初始狀態 this._selectedChess.color = this._selectedChess.chessColor; this._selectedChess = null; return; } } else if(srcChess != null && killChess == null){ // 用戶走棋的操作肯定是OK的 var type = srcChess.type; // 表示要移動棋子 // 首先看能不能移動 // 我們先來判斷能不能移動棋子, 然后再來判斷能不能吃子 switch (type) { case "CHE": if (this._canMoveChe(color, srcX, srcY, destX, destY)) { // 移動棋子 this._moveChess(srcX, srcY, destX, destY); return; } else { // 點擊了顏色相同但是屬性不同的其他棋子 alert(srcChess._getChessText()+"走法違規!"); // 顏色相同的同類棋子就恢復初始狀態 this._selectedChess.color = this._selectedChess.chessColor; this._selectedChess = null; return; } break; case "MA": if (this._canMoveMa(color, srcX, srcY, destX, destY)) { // 移動棋子 this._moveChess(srcX, srcY, destX, destY); return; } else { // 點擊了顏色相同但是屬性不同的其他棋子 alert(srcChess._getChessText()+"走法違規!"); // 顏色相同的同類棋子就恢復初始狀態 this._selectedChess.color = this._selectedChess.chessColor; this._selectedChess = null; return; } break; case "XIANG": if (this._canMoveXiang(color, srcX, srcY, destX, destY)) { // 移動棋子 this._moveChess(srcX, srcY, destX, destY); return; } else { // 點擊了顏色相同但是屬性不同的其他棋子 alert(srcChess._getChessText()+"走法違規!"); // 顏色相同的同類棋子就恢復初始狀態 this._selectedChess.color = this._selectedChess.chessColor; this._selectedChess = null; return; } break; case "SHI": if (this._canMoveShi(color, srcX, srcY, destX, destY)) { // 移動棋子 this._moveChess(srcX, srcY, destX, destY); return; } else { // 點擊了顏色相同但是屬性不同的其他棋子 alert(srcChess._getChessText()+"走法違規!"); // 顏色相同的同類棋子就恢復初始狀態 this._selectedChess.color = this._selectedChess.chessColor; this._selectedChess = null; return; } break; case "JIANG": if (this._canMoveJiang(color, srcX, srcY, destX, destY)) { // 移動棋子 this._moveChess(srcX, srcY, destX, destY); return; } else { // 點擊了顏色相同但是屬性不同的其他棋子 alert(srcChess._getChessText()+"走法違規!"); // 顏色相同的同類棋子就恢復初始狀態 this._selectedChess.color = this._selectedChess.chessColor; this._selectedChess = null; return; } break; case "PAO": if (this._canMovePao(color, srcX, srcY, destX, destY)) { // 移動棋子 this._moveChess(srcX, srcY, destX, destY); return; } else { // 點擊了顏色相同但是屬性不同的其他棋子 alert(srcChess._getChessText()+"走法違規!"); // 顏色相同的同類棋子就恢復初始狀態 this._selectedChess.color = this._selectedChess.chessColor; this._selectedChess = null; return; } case "BING": if (this._canMoveBing(color, srcX, srcY, destX, destY)) { // 移動棋子 this._moveChess(srcX, srcY, destX, destY); return; } else { // 點擊了顏色相同但是屬性不同的其他棋子 alert(srcChess._getChessText()+"走法違規!"); // 顏色相同的同類棋子就恢復初始狀態 this._selectedChess.color = this._selectedChess.chessColor; this._selectedChess = null; return; } break; } } }, _getChess: function (x, y) { for (var i = 0; i < this._chesses.length; i++) { var chess = this._chesses[i]; if (!chess.isDead) { if (chess.x == x && chess.y == y) { return chess; } } } return null; } } var myGame = new Game(); myGame.execute(); </script> </body> </html>