1
0

Corner roads are correct. Have not tested corner banks

Signed-off-by: James Ketrenos <james_eikona@ketrenos.com>
This commit is contained in:
James Ketrenos 2022-02-05 14:54:19 -08:00
parent 4275682b7d
commit 5cd124b24f
2 changed files with 26 additions and 6 deletions

View File

@ -47,6 +47,7 @@ const Board = ({ game }) => {
};
return <div className="Road"
onClick={onClick}
data-index={road.index}
style={{
transform: `translate(-50%, -50%) rotate(${road.angle}deg)`,
top: `${road.top}px`,
@ -57,19 +58,37 @@ const Board = ({ game }) => {
const Corner = ({corner}) => {
const onClick = (event) => {
console.log(`Corner clicked: ${corner.index}`);
const nodes = document.querySelectorAll('.Corner.Selected');
console.log(`Corner ${corner.index}:`, game.layout.corners[corner.index]);
let nodes = document.querySelectorAll('.Corner.Selected');
for (let i = 0; i < nodes.length; i++) {
const el = nodes[i];
if (el !== event.target) {
el.classList.remove('Selected');
}
}
nodes = document.querySelectorAll('.Road.Selected');
for (let i = 0; i < nodes.length; i++) {
const el = nodes[i];
if (el !== event.target) {
el.classList.remove('Selected');
}
}
game.layout.corners[corner.index].roads.forEach(index => {
const el = document.querySelector(`.Road[data-index="${index}"]`);
if (!el) {
console.log(`Unable to find road[${index}]`);
} else {
el.classList.add('Selected');
}
});
event.target.classList.toggle('Selected');
event.target.setAttribute("data-color", game.color);
};
return <div className="Corner"
onClick={onClick}
data-index={corner.index}
style={{
top: `${corner.top}px`,
left: `${corner.left}px`

View File

@ -121,7 +121,7 @@ const Road = (corners) => {
corners: corners, /* 2 */
data: undefined
}
}
};
const layout = {
tiles: [
@ -269,7 +269,7 @@ const layout = {
/* 30 */ Corner([41,43,45],[]),
/* 31 */ Corner([31,43,44],[]),
/* 32 */ Corner([44,46,48],[]),
/* 33 */ Corner([43,46,47],[]),
/* 33 */ Corner([34,46,47],[]),
/* 34 */ Corner([47,49,51],[]),
/* 35 */ Corner([37,49,50],[]),
/* 36 */ Corner([50,53,52],[7]),
@ -280,7 +280,7 @@ const layout = {
/* 40 */ Corner([45,55,56],[]),
/* 41 */ Corner([56,58,60],[]),
/* 42 */ Corner([48,58,59],[]),
/* 43 */ Corner([59,61,43],[]),
/* 43 */ Corner([59,61,63],[]),
/* 44 */ Corner([51,61,62],[]),
/* 45 */ Corner([62,65,64],[8]),
/* 46 */ Corner([52,65],[7,8]),
@ -1009,7 +1009,8 @@ const sendGame = async (req, res, game, error) => {
name: session.name,
color: session.color,
order: (session.color in game.players) ? game.players[session.color].order : 0,
sessions: reducedSessions
sessions: reducedSessions,
layout: layout
});
return res.status(200).send(playerGame);