46 lines
1.5 KiB
TypeScript
46 lines
1.5 KiB
TypeScript
import { FC, useEffect, useRef } from 'react';
|
|
import { DispatchMouseEvent, DispatchTouchEvent, GetNitroInstance } from '../../api';
|
|
import { Base } from '../../common';
|
|
import { useRoom } from '../../hooks';
|
|
import { RoomSpectatorView } from './spectator/RoomSpectatorView';
|
|
import { RoomWidgetsView } from './widgets/RoomWidgetsView';
|
|
|
|
export const RoomView: FC<{}> = props =>
|
|
{
|
|
const { roomSession = null } = useRoom();
|
|
const elementRef = useRef<HTMLDivElement>();
|
|
|
|
useEffect(() =>
|
|
{
|
|
const canvas = GetNitroInstance().application.renderer.view;
|
|
|
|
if(!canvas) return;
|
|
|
|
canvas.onclick = event => DispatchMouseEvent(event);
|
|
canvas.onmousemove = event => DispatchMouseEvent(event);
|
|
canvas.onmousedown = event => DispatchMouseEvent(event);
|
|
canvas.onmouseup = event => DispatchMouseEvent(event);
|
|
|
|
canvas.ontouchstart = event => DispatchTouchEvent(event);
|
|
canvas.ontouchmove = event => DispatchTouchEvent(event);
|
|
canvas.ontouchend = event => DispatchTouchEvent(event);
|
|
canvas.ontouchcancel = event => DispatchTouchEvent(event);
|
|
|
|
const element = elementRef.current;
|
|
|
|
if(!element) return;
|
|
|
|
element.appendChild(canvas);
|
|
}, []);
|
|
|
|
return (
|
|
<Base fit innerRef={ elementRef } className={ (!roomSession && 'd-none') }>
|
|
{ roomSession &&
|
|
<>
|
|
<RoomWidgetsView />
|
|
{ roomSession.isSpectator && <RoomSpectatorView /> }
|
|
</> }
|
|
</Base>
|
|
);
|
|
}
|