add render hoshi on game start
This commit is contained in:
parent
eaa25b91ca
commit
1d9afdfd6d
2 changed files with 24 additions and 17 deletions
|
@ -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 {
|
||||
|
|
33
js/main.js
33
js/main.js
|
@ -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 = '';
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue