Added basic draw function for list of rooms
This commit is contained in:
parent
8b7f83a14a
commit
77661df39b
@ -1,27 +1,21 @@
|
||||
import { RoomT } from "../types/room";
|
||||
import { useRoomContext } from "../context";
|
||||
import { Canvas } from "./Canvas";
|
||||
|
||||
export type BuildingPlanProps = { width: number; height: number };
|
||||
|
||||
export const BuildingPlan = ({ width, height }: BuildingPlanProps) => {
|
||||
const room: RoomT = {
|
||||
coordinates: { x: 100, y: 200 },
|
||||
free: true,
|
||||
size: { h: 100, w: 200 },
|
||||
};
|
||||
const { state } = useRoomContext();
|
||||
|
||||
return (
|
||||
<Canvas
|
||||
height={height}
|
||||
width={width}
|
||||
draw={(ctx) => {
|
||||
ctx.fillStyle = room.free ? "green" : "gray";
|
||||
ctx.fillRect(
|
||||
room.coordinates.x,
|
||||
room.coordinates.y,
|
||||
room.size.w,
|
||||
room.size.h
|
||||
);
|
||||
state.map.map(({ coordinates, size }, index) => {
|
||||
const { free } = state.char[index];
|
||||
ctx.fillStyle = free ? "green" : "gray";
|
||||
ctx.fillRect(coordinates.x, coordinates.y, size.w, size.h);
|
||||
});
|
||||
}}
|
||||
/>
|
||||
);
|
||||
|
Loading…
x
Reference in New Issue
Block a user