refactor: remove FACTOR

This commit is contained in:
cha0s 2022-03-23 04:05:55 -05:00
parent 9b6224a0f8
commit e389e49c18

View File

@ -11,6 +11,7 @@ import {
import { import {
React, React,
useEffect, useEffect,
useFlecks,
useRef, useRef,
useState, useState,
} from '@flecks/react'; } from '@flecks/react';
@ -20,10 +21,9 @@ import {useSocket} from '@flecks/socket';
import Hotbar from './hotbar'; import Hotbar from './hotbar';
const FACTOR = 5;
const PlayUi = () => { const PlayUi = () => {
const dispatch = useDispatch(); const dispatch = useDispatch();
const flecks = useFlecks();
const {uuid} = useParams(); const {uuid} = useParams();
const ref = useRef(); const ref = useRef();
const room = useRoom(); const room = useRoom();
@ -31,6 +31,7 @@ const PlayUi = () => {
const socket = useSocket(); const socket = useSocket();
const [left, setLeft] = useState(0); const [left, setLeft] = useState(0);
const [top, setTop] = useState(0); const [top, setTop] = useState(0);
const [domScale, setDomScale] = useState([1, 1]);
useEffect(() => { useEffect(() => {
if (!room || !selfEntity) { if (!room || !selfEntity) {
return undefined; return undefined;
@ -38,8 +39,10 @@ const PlayUi = () => {
selfEntity.camera.realPosition = selfEntity.camera.position; selfEntity.camera.realPosition = selfEntity.camera.position;
const onCameraRealOffsetChanged = () => { const onCameraRealOffsetChanged = () => {
const [left, top] = Vector.scale(selfEntity.camera.realOffset, -1); const [left, top] = Vector.scale(selfEntity.camera.realOffset, -1);
setLeft(FACTOR * left); const {resolution} = flecks.get('@humus/app');
setTop(FACTOR * top); setDomScale(Vector.div(resolution, selfEntity.camera.viewSize));
setLeft(left);
setTop(top);
}; };
onCameraRealOffsetChanged(); onCameraRealOffsetChanged();
selfEntity.camera.on('realOffsetChanged', onCameraRealOffsetChanged); selfEntity.camera.on('realOffsetChanged', onCameraRealOffsetChanged);
@ -49,7 +52,7 @@ const PlayUi = () => {
camera.off('realOffsetChanged', onCameraRealOffsetChanged); camera.off('realOffsetChanged', onCameraRealOffsetChanged);
} }
}; };
}, [room, selfEntity]); }, [flecks, room, selfEntity]);
useEffect(() => { useEffect(() => {
const join = async () => { const join = async () => {
dispatch(setSelfEntity(await socket.send(['Join', uuid]))); dispatch(setSelfEntity(await socket.send(['Join', uuid])));
@ -96,7 +99,7 @@ const PlayUi = () => {
// eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex
tabIndex="0" tabIndex="0"
> >
<Room left={left} room={room} top={top} /> <Room domScale={domScale} left={left} room={room} top={top} />
{selfEntity && <Hotbar selfEntity={selfEntity} />} {selfEntity && <Hotbar selfEntity={selfEntity} />}
</div> </div>
); );