diff --git a/games/nukes/src/controls/pointer.tsx b/games/nukes/src/controls/pointer.tsx index 43642691..88580714 100644 --- a/games/nukes/src/controls/pointer.tsx +++ b/games/nukes/src/controls/pointer.tsx @@ -1,7 +1,7 @@ import React, { createContext, useContext, useReducer } from 'react'; -import { City, LaunchSite } from '../world/world-state-types'; +import { City, LaunchSite, Sector } from '../world/world-state-types'; -type PointableObject = LaunchSite | City; +type PointableObject = LaunchSite | City | Sector; type PointerDispatchAction = | { diff --git a/games/nukes/src/world-render/explosion-render.tsx b/games/nukes/src/world-render/explosion-render.tsx index f41b57da..7c790633 100644 --- a/games/nukes/src/world-render/explosion-render.tsx +++ b/games/nukes/src/world-render/explosion-render.tsx @@ -32,4 +32,6 @@ const ExplosionContainer = styled.div` height: calc(var(--radius) * 1px); border-radius: 50%; background: rgb(255, 255, 255); + + pointer-events: none; `; diff --git a/games/nukes/src/world-render/sector-render.tsx b/games/nukes/src/world-render/sector-render.tsx index 1e60766a..66bcccbd 100644 --- a/games/nukes/src/world-render/sector-render.tsx +++ b/games/nukes/src/world-render/sector-render.tsx @@ -1,10 +1,15 @@ import styled from 'styled-components'; import { Sector } from '../world/world-state-types'; +import { useObjectPointer } from '../controls/pointer'; export function SectorRender({ sector }: { sector: Sector }) { + const [point, unpoint] = useObjectPointer(); + return ( point(sector)} + onMouseLeave={() => unpoint(sector)} data-sector-type={sector.type} style={ { diff --git a/games/nukes/src/world/world-state-create.ts b/games/nukes/src/world/world-state-create.ts index f4a13c96..a4cd146c 100644 --- a/games/nukes/src/world/world-state-create.ts +++ b/games/nukes/src/world/world-state-create.ts @@ -79,6 +79,10 @@ function generateSectors(cols: number, rows: number, sectorSize: number) { return { id: 'test-sector-' + i, type: distance(x, y, centerColX, centerRowY) <= centerColX / 2 ? SectorType.GROUND : SectorType.WATER, + position: { + x: x * sectorSize + sectorSize / 2, + y: y * sectorSize + sectorSize / 2, + }, rect: { left: x * sectorSize, top: y * sectorSize, diff --git a/games/nukes/src/world/world-state-types.ts b/games/nukes/src/world/world-state-types.ts index c70195de..0dd4c693 100644 --- a/games/nukes/src/world/world-state-types.ts +++ b/games/nukes/src/world/world-state-types.ts @@ -37,6 +37,7 @@ export enum SectorType { export type Sector = { id: SectorId; + position: Position; rect: Rect; type: SectorType; };