correct legal move logic for surrounding friendly stones

This commit is contained in:
Sorrel Bri 2019-08-03 16:59:56 -07:00
parent 76ef4038ec
commit c828fad0b4
3 changed files with 75 additions and 53 deletions

View file

@ -56,6 +56,14 @@ content {
#kifu {
order: 0;
height: 10vh;
width: 8vh;
background-color: #FFF;
transform: rotate(-20deg);
}
#kifu table {
}
.bowl {
@ -66,15 +74,18 @@ content {
/* border: solid black; */
border-radius: 50%;
background-color: rgb(116, 48, 17);
box-shadow: -1vmin 2vmin 3vmin rgba(83, 53, 35, 0.61);
}
.caps {
color: #FFF;
order: 1;
margin: 1vh;
height: 6vh;
width: 6vh;
border-radius: 50%;
background-color: rgb(116, 48, 17);
box-shadow: -0.5vmin 1vmin 3vmin rgba(83, 53, 35, 0.61);
}
#board-space {
@ -86,9 +97,14 @@ content {
width: 90vmin;
height: 90vmin;
padding: 1vmin;
z-index: 1;
box-shadow: -2vmin 4vmin 3vmin rgba(145, 92, 23, 0.5);
}
table {
#board-space::after {
}
#board-space table {
display: flex;
align-items: stretch;
justify-content: space-between;
@ -97,7 +113,7 @@ table {
margin: auto;
}
td {
#board-space td {
height: 9vmin;
width: 9vmin;
background: conic-gradient(#000 0%, rgba(0,0,0,0) 1%, rgba(0,0,0,0) 24%, #000 25%, rgba(0,0,0,0) 26%, rgba(0,0,0,0) 49%, #000 50%, rgba(0,0,0,0) 51%, rgba(0,0,0,0) 74%, #000 75%, rgba(0,0,0,0) 76%, rgba(0,0,0,0) 99%, #000 100%);
@ -108,33 +124,35 @@ td {
vertical-align: middle;
}
td[id^="1"] {
#board-space td[id^="1"] {
background: conic-gradient( rgba(0,0,0,0) 24%, #000 25%, rgba(0,0,0,0) 26%, rgba(0,0,0,0) 49%, #000 50%, rgba(0,0,0,0) 51%, rgba(0,0,0,0) 74%, #000 75%, rgba(0,0,0,0) 76%);
}
td[id^="9"] {
#board-space td[id^="9"] {
background: conic-gradient(#000 0%, rgba(0,0,0,0) 1%, rgba(0,0,0,0) 24%, #000 25%, rgba(0,0,0,0) 26%, rgba(0,0,0,0) 74%, #000 75%, rgba(0,0,0,0) 76%, rgba(0,0,0,0) 99%, #000 100%);
}
td[id$="1"] {
#board-space td[id$="1"] {
background: conic-gradient(#000 0%, rgba(0,0,0,0) 1%, rgba(0,0,0,0) 24%, #000 25%, rgba(0,0,0,0) 26%, rgba(0,0,0,0) 49%, #000 50%, rgba(0,0,0,0) 51%, rgba(0,0,0,0) 99%, #000 100%);
}
td[id$="9"] {
#board-space td[id$="9"] {
background: conic-gradient(#000 0%, rgba(0,0,0,0) 1%, rgba(0,0,0,0) 49%, #000 50%, rgba(0,0,0,0) 51%, rgba(0,0,0,0) 74%, #000 75%, rgba(0,0,0,0) 76%, rgba(0,0,0,0) 99%, #000 100%);
}
td[id="1,1"] {
#board-space td[id="1,1"] {
background: conic-gradient( rgba(0,0,0,0) 24%, #000 25%, rgba(0,0,0,0) 26%, rgba(0,0,0,0) 49%, #000 50%, rgba(0,0,0,0) 51%);
}
td[id="1,9"] {
#board-space td[id="1,9"] {
background: conic-gradient( rgba(0,0,0,0) 49%, #000 50%, rgba(0,0,0,0) 51%, rgba(0,0,0,0) 74%, #000 75%, rgba(0,0,0,0) 76% );
}
td[id="9,1"] {
#board-space td[id="9,1"] {
background: conic-gradient(#000 0%, rgba(0,0,0,0) 1%, rgba(0,0,0,0) 24%, #000 25%, rgba(0,0,0,0) 26%, rgba(0,0,0,0) 99%, #000 100%);
}
td[id="9,9"] {
#board-space td[id="9,9"] {
background: conic-gradient(#000 0%, rgba(0,0,0,0) 1%, rgba(0,0,0,0) 74%, #000 75%, rgba(0,0,0,0) 76%, rgba(0,0,0,0) 99%, #000 100%);
}

View file

@ -290,7 +290,15 @@
<div id="black-pos" class="player-pos">
<div id="black-bowl" class="bowl">Black Bowl</div>
<div id="black-caps" class="caps">Black Captures</div>
<div id="kifu">kifu</div>
<div id="kifu">
<table>
<tr>
<td>
</td>
</tr>
</table>
</div>
</div>
</content>
</body>

View file

@ -95,21 +95,20 @@ class Point {
// return true if neighboring point is empty;
}
checkCapture = () => {
let neighborsArr = this.checkNeighbors();
let oppStones = neighborsArr.filter(val => {
if (val.stone === gameState.turn * -1) return val;
return !this.liveGroup(gameState.turn * -1).some(val => val.emptyNeighbor());
}
checkGroup = () => {
return this.liveGroup(gameState.turn).some(val => val.emptyNeighbor());
// returns first neighbor of turn color that has an empty neighbor
}
liveGroup = (stone) => {
return this.checkNeighbors().filter(val => {
if ( val.stone === stone ) return val;
});
console.log(oppStones);
for ( let oppStone in oppStones ) {
console.log(oppStones[oppStone])
console.log(oppStones[oppStone].emptyNeighbor()) // will need to call something like .liveGroup() instead
return oppStones[oppStone].emptyNeighbor(); //return
//returns an array of neighbors for the value of stone
}
}
// return true if move would form/join a living friendly group ad
// checkGroup = () => {
//
// }
}
let boardCreator = new Array(gameState.boardSize).fill(gameState.boardSize);
@ -131,7 +130,7 @@ let boardCreator = new Array(gameState.boardSize).fill(gameState.boardSize);
// input listeners for player names, ranks, rank certainty (editable during game)
//input lister for handicap + komi (only editable pre-game)
// ::hover-over on board to preview move (with legal move logic)
document.getElementById('board').addEventListener('mousemove', checkLegal);
document.getElementById('board').addEventListener('mousemove', hoverPreview);
// click on board to play move
document.getElementById('board').addEventListener('click', placeStone);
// ::hover-over on either bowl for pass, one-level undo options (CSS implementation)
@ -143,55 +142,52 @@ init();
let findPointFromIdx = (arr) => boardState.find( point => point.pos[0] === arr[0] && point.pos[1] === arr[1] );
function checkLegal(evt) {
function hoverPreview(evt) {
// renders preview stone if move is legal
let hover = [ parseInt(evt.target.closest('td').id[0]), parseInt(evt.target.closest('td').id[2]) ];
let point = findPointFromIdx(hover);
if (checkLegal(point)) {
point.overlay = 'l';
render(point);
}
}
// working old way assigns legal
// point.overlay = point.stone !== 0 ? 0 : 'l';
function checkLegal(point) {
// first step in logic: is point occupied, or in ko
if (point.stone) return;
if (point.stone) return false;
console.log('reading empty');
console.log(point.emptyNeighbor())
// if point is not empty check if neighboring point is empty
if (!point.emptyNeighbor()) {
//if neighboring point is not empty check if friendly group is alive
point.checkCapture();
// if (point.checkCapture) return point.overlay = 'l';
//if neighboring point is not empty check if enemy group is captured
// if (point.checkGroup) return point.overlay = 'l'
return;
} else {
point.overlay = 'l';
if (!point.checkCapture()) return false;
//if neighboring point is not empty check if friendly group is alive
if (!point.checkGroup()) return false;
return true;
}
// if neighboring point is
render(point);
return true;
}
function placeStone(evt) {
console.log('click!');
let placement = [ parseInt(evt.target.closest('td').id[0]), parseInt(evt.target.closest('td').id[2]) ];
// checks for placement and pushes to cell
let placement = [ parseInt(evt.target.closest('td').id[0]), parseInt(evt.target.closest('td').id[2]) ];
let point = findPointFromIdx(placement);
// console.log(placement);
//checks that this placement was marked as legal
point.stone = point.overlay === 'l' ? gameState.turn : point.stone;
if ( !checkLegal(point) ) return;
point.stone = gameState.turn;
gameState.turn*= -1;
for (let point in boardState) {
point.overlay = '';
}
render();
}
function init() {
gameState.winner = null;
// gameState.turn = ? : ; // get turn from consequences of player input
gameState.pass = null;
// gameState.komi = ; // get komi from player input
// gameState.handicap = ; // get handicap from player input
// gameState.turn = gameState.handicap ? -1 : 1;
gameState.playerState.bCaptures = 0;
gameState.playerState.wCaptures = 0;
// gameState.gameMeta.date = // get from browser window