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%);
|
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 */
|
.dot.hoshi { /* to be added later */
|
||||||
background: radial-gradient(circle farthest-corner at center, #000 0%, #000 30%, rgba(0,0,0,0) 50%);
|
background: radial-gradient(circle farthest-corner at center, #000 0%, #000 44%, rgba(0,0,0,0) 45%);
|
||||||
z-index: 3;
|
z-index: 3;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 100%
|
height: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
td .stone {
|
td .stone {
|
||||||
|
|
33
js/main.js
33
js/main.js
|
@ -261,7 +261,10 @@ document.querySelector('input[name="game-start"]').addEventListener('click', cli
|
||||||
/*----- functions -----*/
|
/*----- functions -----*/
|
||||||
init();
|
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) {
|
function changeUpdateKomi(evt) {
|
||||||
evt.stopPropagation();
|
evt.stopPropagation();
|
||||||
|
@ -511,12 +514,16 @@ function initBoard() {
|
||||||
boardState.push(point);
|
boardState.push(point);
|
||||||
i++;
|
i++;
|
||||||
}
|
}
|
||||||
// initHandi();
|
initHandi();
|
||||||
}
|
}
|
||||||
|
|
||||||
function initHandi() {
|
function initHandi() {
|
||||||
|
if (gameState.handicap < 2) return;
|
||||||
HANDI_PLACE[gameState.boardSize][gameState.handicap].forEach(pt => {
|
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() {
|
function renderBoardInit() {
|
||||||
clearCurrentBoard();
|
renderClearBoard();
|
||||||
renderBoardTableRows();
|
renderBoardTableRows();
|
||||||
renderHoshi();
|
renderHoshi();
|
||||||
renderBoardTableStyle();
|
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);
|
let hoshi = HANDI_PLACE[gameState.boardSize].slice(-1);
|
||||||
console.log(hoshi);
|
hoshi = hoshi[0]
|
||||||
hoshi.forEach(star => {
|
hoshi.forEach(star => {
|
||||||
console.log(star);
|
console.log(hoshi);
|
||||||
let starPt = findPointFromIdx(star);
|
console.log(`star: ${star[0][0]}
|
||||||
console.log(starPt);
|
${star[0][1]} end star`)
|
||||||
// .getElementsByClassName['dot'].style.className += ' hoshi' });
|
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.innerHTML = '';
|
||||||
boardEl.classList = '';
|
boardEl.classList = '';
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue