oxaliq/browser-go-proto
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

add render hoshi on game start

Browse source
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
Show stats Download patch file Download diff file Expand all files Collapse all files

6
css/main.css
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 {

35
js/main.js
View file

@ -85,7 +85,7 @@ const gameState = { // pre-init values (render prior to any player input)
const HANDI_PLACE = {
'9' : [
0, 0,
[ [ 7, 3 ], [ 3, 7 ] ],
[[ 7, 3 ], [ 3, 7 ] ],
[ [ 7, 7 ], [ 7, 3 ], [ 3, 7 ] ],
[ [ 3, 3 ], [ 7, 7 ], [ 3, 7 ], [ 7, 3 ] ]
],
@ -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 = '';
}