diff --git a/src/components/canvas/Canvas.tsx b/src/components/canvas/Canvas.tsx index 52e4564..550b135 100644 --- a/src/components/canvas/Canvas.tsx +++ b/src/components/canvas/Canvas.tsx @@ -3,7 +3,7 @@ import { useGesture } from "@use-gesture/react"; import { isMobile } from "react-device-detect"; import * as PIXI from "pixi.js"; -import { Application } from "@pixi/react"; +import { Application, ApplicationRef } from "@pixi/react"; import { LoadingContext } from "@/context/Loading"; import { CanvasContext } from "@/context/Canvas"; @@ -38,6 +38,7 @@ import CanvasBorder from "./CanvasBorder"; import CursorInformation from "./information/Cursor"; import CanvasInformation from "./information/Canvas"; import SelectionBar from "./SelectionBar"; +import FPS from "./information/FPS"; // Set scale mode to NEAREST PIXI.TextureSource.defaultOptions.scaleMode = "nearest"; @@ -57,6 +58,8 @@ function Canvas() { const blockData = useBlockData(version); const stageContainerRef = useRef(null); + const appRef = useRef(null); + const mousePosition = useRef({ x: 0, y: 0 }); const [mouseCoords, setMouseCoords] = useState({ x: 0, y: 0 }); const mouseMovementRef = useRef({ x: 0, y: 0 }); @@ -506,7 +509,7 @@ function Canvas() { style={{ cursor: cssCursor }} className="relative" > - + {/* Selection layer */} + {settings.fpsCounter && } + ); diff --git a/src/components/canvas/information/FPS.tsx b/src/components/canvas/information/FPS.tsx new file mode 100644 index 0000000..31b8540 --- /dev/null +++ b/src/components/canvas/information/FPS.tsx @@ -0,0 +1,13 @@ +interface Props { + fps: number | undefined; +} + +function FPS({ fps }: Props) { + return ( +
+ FPS: {fps ? Math.round(fps) : "???"} +
+ ); +} + +export default FPS; diff --git a/src/components/menubar/ViewMenu.tsx b/src/components/menubar/ViewMenu.tsx index 3b253b7..2e73324 100644 --- a/src/components/menubar/ViewMenu.tsx +++ b/src/components/menubar/ViewMenu.tsx @@ -39,6 +39,9 @@ function ViewMenu() { Canvas Border + + FPS Counter + diff --git a/src/context/Settings.tsx b/src/context/Settings.tsx index 9a7f1df..e37670f 100644 --- a/src/context/Settings.tsx +++ b/src/context/Settings.tsx @@ -17,6 +17,7 @@ const defaultSettings: Settings = { blockReplacer: true, toolSettings: true, blockSelector: true, + fpsCounter: false, }; // eslint-disable-next-line react-refresh/only-export-components diff --git a/src/data/versions.json b/src/data/versions.json index ec51658..523d2c9 100644 --- a/src/data/versions.json +++ b/src/data/versions.json @@ -1,5 +1,5 @@ { - "1219": 4554, + "1219": 4440, "1214": 4189, "1210": 3953, "1200": 3463, diff --git a/src/types.d.ts b/src/types.d.ts index dbae87a..025c740 100644 --- a/src/types.d.ts +++ b/src/types.d.ts @@ -34,6 +34,7 @@ interface Settings { blockReplacer: boolean; toolSettings: boolean; blockSelector: boolean; + fpsCounter: boolean; } interface DialogProps {