Road corners are correct
Signed-off-by: James Ketrenos <james_eikona@ketrenos.com>
This commit is contained in:
parent
5cd124b24f
commit
ac961b7a55
@ -35,13 +35,30 @@ const Board = ({ game }) => {
|
|||||||
const Road = ({road}) => {
|
const Road = ({road}) => {
|
||||||
const onClick = (event) => {
|
const onClick = (event) => {
|
||||||
console.log(`Road clicked: ${road.index}`);
|
console.log(`Road clicked: ${road.index}`);
|
||||||
const nodes = document.querySelectorAll('.Road.Selected');
|
let nodes = document.querySelectorAll('.Road.Selected');
|
||||||
for (let i = 0; i < nodes.length; i++) {
|
for (let i = 0; i < nodes.length; i++) {
|
||||||
const el = nodes[i];
|
const el = nodes[i];
|
||||||
if (el !== event.target) {
|
if (el !== event.target) {
|
||||||
el.classList.remove('Selected');
|
el.classList.remove('Selected');
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
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');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
game.layout.roads[road.index].corners.forEach(index => {
|
||||||
|
const el = document.querySelector(`.Corner[data-index="${index}"]`);
|
||||||
|
if (!el) {
|
||||||
|
console.log(`Unable to find corner[${index}]`);
|
||||||
|
} else {
|
||||||
|
el.classList.add('Selected');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
event.target.setAttribute("data-color", game.color);
|
event.target.setAttribute("data-color", game.color);
|
||||||
event.target.classList.toggle('Selected');
|
event.target.classList.toggle('Selected');
|
||||||
};
|
};
|
||||||
@ -53,7 +70,7 @@ const Board = ({ game }) => {
|
|||||||
top: `${road.top}px`,
|
top: `${road.top}px`,
|
||||||
left: `${road.left}px`
|
left: `${road.left}px`
|
||||||
}}
|
}}
|
||||||
></div>;
|
>{road.index}</div>;
|
||||||
};
|
};
|
||||||
|
|
||||||
const Corner = ({corner}) => {
|
const Corner = ({corner}) => {
|
||||||
@ -93,7 +110,7 @@ const Board = ({ game }) => {
|
|||||||
top: `${corner.top}px`,
|
top: `${corner.top}px`,
|
||||||
left: `${corner.left}px`
|
left: `${corner.left}px`
|
||||||
}}
|
}}
|
||||||
>{corner.index}</div>;
|
></div>;
|
||||||
};
|
};
|
||||||
|
|
||||||
const generateRoads = () => {
|
const generateRoads = () => {
|
||||||
@ -374,10 +391,10 @@ const Board = ({ game }) => {
|
|||||||
{ tiles }
|
{ tiles }
|
||||||
{ pips }
|
{ pips }
|
||||||
{ game && <>
|
{ game && <>
|
||||||
<div className="Corners" disabled={game.state !== 'active'}>
|
<div className="Corners" disabled={true || game.state !== 'active'}>
|
||||||
{ corners }
|
{ corners }
|
||||||
</div>
|
</div>
|
||||||
<div className="Roads" disabled={true || game.state !== 'active'}>
|
<div className="Roads" disabled={game.state !== 'active'}>
|
||||||
{ roads }
|
{ roads }
|
||||||
</div>
|
</div>
|
||||||
</> }
|
</> }
|
||||||
|
Loading…
x
Reference in New Issue
Block a user