diff --git a/interface/types/Cell.ts b/interface/types/Cell.ts index 6412cc5..c71bb2b 100644 --- a/interface/types/Cell.ts +++ b/interface/types/Cell.ts @@ -63,7 +63,7 @@ export class Cell { trackType: track.type, }; }) - .some(({ trackExternalNodes, trackType }) => { + .reduce((isConnected, { trackExternalNodes, trackType }) => { let isTrackConnected: boolean = false; trackExternalNodes .filter((node) => node.traverseBorder() instanceof Exit) @@ -98,8 +98,8 @@ export class Cell { } }); - return isTrackConnected; - }); + return isConnected || isTrackConnected; + }, false); if (!hasAnyConnection) { throw Error("No adjacent exit or piece available to connect to"); diff --git a/web/public/factory-icon.png b/web/public/factory-icon.png new file mode 100644 index 0000000..e7c3ad8 Binary files /dev/null and b/web/public/factory-icon.png differ diff --git a/web/public/house-icon.png b/web/public/house-icon.png new file mode 100644 index 0000000..6d5b496 Binary files /dev/null and b/web/public/house-icon.png differ diff --git a/web/public/university-icon.png b/web/public/university-icon.png new file mode 100644 index 0000000..e55f06a Binary files /dev/null and b/web/public/university-icon.png differ diff --git a/web/src/pages/game/components/BoardCell.scss b/web/src/pages/game/components/BoardCell.scss index 1250a30..d1e612c 100644 --- a/web/src/pages/game/components/BoardCell.scss +++ b/web/src/pages/game/components/BoardCell.scss @@ -3,18 +3,12 @@ height: 100px; border: 2px solid black; border-radius: 10%; + position: relative; .piece { border-radius: 10%; - position: relative; - - &:nth-child(2) { - top: -20px; - } - - &:nth-child(3) { - top: -40px; - } + position: absolute; + top: 0; &.rotate-90 { transform: rotate(-90deg); @@ -29,33 +23,23 @@ } } - &.house { - background-color: blue; + .cell-type-icon { + width: 25px; + height: 25px; + padding: 2px; + margin: 2px; + position: absolute; + top: 0; + left: 0; } +} - &.university { - background-color: orange; - } +.cell .exit { + position: absolute; + width: 20px; + height: 20px; - &.factory { - background-color: grey; - } - - .exit:has(.exit-road) { - border: solid black; - border-width: 0 1px; - - .exit-road { - margin: auto; - width: 0; - height: 100%; - border: dashed black; - border-width: 0 1px; - transform: translate(calc(50% - 1px)); - } - } - - .exit:has(.exit-road) { + &:has(.exit-road) { border: solid black; border-width: 0 1px; @@ -69,7 +53,7 @@ } } - .exit:has(.exit-rail) { + &:has(.exit-rail) { border-width: 0 1px; .exit-rail { @@ -82,7 +66,7 @@ } } - .exit:has(.exit-ambivalent) { + &:has(.exit-ambivalent) { border-width: 0 1px; border-style: dotted; @@ -95,47 +79,30 @@ transform: translate(calc(50%)); } } -} - -.exit { - position: relative; - width: 20px; - height: 20px; + &:has(.exit-north), &:has(.exit-south) { + left: 50%; + } &:has(.exit-north) { - left: 50%; transform: translate(calc(-50% - 1px), -100%); } &:has(.exit-south) { - left: 50%; top: 100%; transform: translate(calc(-50% - 1px), 0%); } + &:has(.exit-east), &:has(.exit-west) { + top: 50%; + } + &:has(.exit-east) { left: 100%; - top: 50%; transform: rotate(90deg) translate(-50%, 0); } &:has(.exit-west) { left: 0%; - top: 50%; transform: rotate(90deg) translate(-50%, 100%); } - - &:has(.exit-north), &:has(.exit-south) { - + .exit:has(.exit-east) { - left: 100%; - transform: rotate(90deg) translate(-150%, 0); - } - } - - &:has(.exit-north), &:has(.exit-south) { - + .exit:has(.exit-west) { - top: 50%; - transform: rotate(90deg) translate(-150%, 100%); - } - } } \ No newline at end of file diff --git a/web/src/pages/game/components/BoardCell.tsx b/web/src/pages/game/components/BoardCell.tsx index 3170438..ecfa25f 100644 --- a/web/src/pages/game/components/BoardCell.tsx +++ b/web/src/pages/game/components/BoardCell.tsx @@ -1,4 +1,4 @@ -import { Cell, directions, Exit, PieceId } from "interface"; +import { Cell, CellType, directions, Exit, PieceId } from "interface"; import "./BoardCell.scss"; import { useState } from "react"; @@ -54,10 +54,7 @@ const BoardCell = (props: BoardCellProps) => { }; return ( -