add render hoshi on game start

This commit is contained in:
Sorrel Bri 2019-08-08 12:22:33 -07:00
parent eaa25b91ca
commit 1d9afdfd6d
2 changed files with 24 additions and 17 deletions

View file

@ -358,11 +358,11 @@ content {
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%);
}
#board-space td * * div.hoshi { /* to be added later */
background: radial-gradient(circle farthest-corner at center, #000 0%, #000 30%, rgba(0,0,0,0) 50%);
.dot.hoshi { /* to be added later */
background: radial-gradient(circle farthest-corner at center, #000 0%, #000 44%, rgba(0,0,0,0) 45%);
z-index: 3;
width: 100%;
height: 100%
height: 100%;
}
td .stone {

View file

@ -261,7 +261,10 @@ document.querySelector('input[name="game-start"]').addEventListener('click', cli
/*----- functions -----*/
init();
let findPointFromIdx = (arr) => boardState.find( point => point.pos[0] === arr[0] && point.pos[1] === arr[1] );
function findPointFromIdx(arr) {
console.log(arr);
return pointFromIdx = boardState.find( point => point.pos[0] === arr[0] && point.pos[1] === arr[1] );
}
function changeUpdateKomi(evt) {
evt.stopPropagation();
@ -511,12 +514,16 @@ function initBoard() {
boardState.push(point);
i++;
}
// initHandi();
initHandi();
}
function initHandi() {
if (gameState.handicap < 2) return;
HANDI_PLACE[gameState.boardSize][gameState.handicap].forEach(pt => {
if (!pt) return;
let handi = findPointFromIdx(pt);
handi.stone = 1;
handi.joinGroup();
})
}
@ -562,25 +569,25 @@ function renderGame() {
}
function renderBoardInit() {
clearCurrentBoard();
renderClearBoard();
renderBoardTableRows();
renderHoshi();
renderBoardTableStyle();
}
function renderHoshi() {
function renderHoshi() { // gets hoshi placement from handiplace const and adds a class to dot elem
let hoshi = HANDI_PLACE[gameState.boardSize].slice(-1);
console.log(hoshi);
hoshi = hoshi[0]
hoshi.forEach(star => {
console.log(star);
let starPt = findPointFromIdx(star);
console.log(starPt);
// .getElementsByClassName['dot'].style.className += ' hoshi' });
})
console.log(hoshi);
console.log(`star: ${star[0][0]}
${star[0][1]} end star`)
let boardPt = document.getElementById(`${star[0]}-${star[1]}`).getElementsByClassName('dot')[0];
console.log(boardPt);
boardPt.className += ' hoshi' });
}
// HANDI_PLACE[gameState.boardSize].slice(-1) [0] [0][0] === boardState[20].pos[0]
function clearCurrentBoard() {
function renderClearBoard() {
boardEl.innerHTML = '';
boardEl.classList = '';
}