pointable sectors

gamedevpl · May 12, 2024 · 81edc9f · 81edc9f
1 parent 7cf0003
commit 81edc9f
Show file tree

Hide file tree

Showing 5 changed files with 14 additions and 2 deletions.
diff --git 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
@@ -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
@@ -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 (
     <SectorContainer
+      onMouseEnter={() => 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
@@ -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
@@ -37,6 +37,7 @@ export enum SectorType {
 
 export type Sector = {
   id: SectorId;
+  position: Position;
   rect: Rect;
   type: SectorType;
 };