flow: room render

This commit is contained in:
cha0s 2021-07-07 16:54:50 -05:00
parent f4b0c605d8
commit e6f7fd4e95
2 changed files with 24 additions and 9 deletions

View File

@ -30,7 +30,7 @@ const RoomComponent = ({
const {Room} = latus.get('%resources'); const {Room} = latus.get('%resources');
const [room, setRoom] = useState(); const [room, setRoom] = useState();
const [roomRenderable, setRoomRenderable] = useState(); const [roomRenderable, setRoomRenderable] = useState();
const [viewport] = useState([320, 180]); const [viewport, setViewport] = useState([0, 0]);
useEffect(() => { useEffect(() => {
setRoom(); setRoom();
const loadRoom = async () => { const loadRoom = async () => {
@ -56,13 +56,12 @@ const RoomComponent = ({
const load = async () => { const load = async () => {
await room.load(resource); await room.load(resource);
const roomRenderable = new (room.constructor.Renderable)(room, renderer); const roomRenderable = new (room.constructor.Renderable)(room, renderer);
roomRenderable.renderChunksForExtent(Rectangle.compose( const viewport = Vector.mul(
[0, 0], room.tiles[0].area,
Vector.mul( room.tiles[0].tileSize,
room.tiles[0].area, );
room.tiles[0].tileSize, setViewport(viewport);
), roomRenderable.renderChunksForExtent(Rectangle.compose([0, 0], viewport));
));
setRoomRenderable(roomRenderable); setRoomRenderable(roomRenderable);
}; };
load(); load();
@ -74,7 +73,6 @@ const RoomComponent = ({
<div className="room-renderer"> <div className="room-renderer">
<Stage <Stage
centered={false} centered={false}
scalable={false}
renderer={renderer} renderer={renderer}
renderable={roomRenderable} renderable={roomRenderable}
size={viewport} size={viewport}

View File

@ -0,0 +1,17 @@
.room-renderer {
&, .stage, .canvas-host {
height: 100%;
width: 100%;
}
.canvas-host {
display: block;
overflow: scroll;
justify-content: flex-start;
}
.rc-slider {
display: none;
}
}