Yusuf Mohsinally
89 lines
2.8 KiB
TypeScript
89 lines
2.8 KiB
TypeScript
import { lazy, Suspense, useEffect, useState } from "react";
|
|
import { CountdownOverlay } from "./components/launch/CountdownOverlay.tsx";
|
|
import { LaunchWindow } from "./components/launch/LaunchWindow";
|
|
import { SourceSelector } from "./components/launch/SourceSelector";
|
|
import { Toaster } from "./components/ui/sonner";
|
|
import { TooltipProvider } from "./components/ui/tooltip";
|
|
import { ShortcutsProvider } from "./contexts/ShortcutsContext";
|
|
import { loadAllCustomFonts } from "./lib/customFonts";
|
|
|
|
const VideoEditor = lazy(() => import("./components/video-editor/VideoEditor"));
|
|
const ShortcutsConfigDialog = lazy(() =>
|
|
import("./components/video-editor/ShortcutsConfigDialog").then((module) => ({
|
|
default: module.ShortcutsConfigDialog,
|
|
})),
|
|
);
|
|
|
|
export default function App() {
|
|
const [windowType, setWindowType] = useState(
|
|
() => new URLSearchParams(window.location.search).get("windowType") || "",
|
|
);
|
|
|
|
useEffect(() => {
|
|
const type = new URLSearchParams(window.location.search).get("windowType") || "";
|
|
if (type !== windowType) {
|
|
setWindowType(type);
|
|
}
|
|
|
|
if (type === "hud-overlay" || type === "source-selector" || type === "countdown-overlay") {
|
|
document.body.style.background = "transparent";
|
|
document.documentElement.style.background = "transparent";
|
|
document.getElementById("root")?.style.setProperty("background", "transparent");
|
|
}
|
|
|
|
// HUD is a fixed-size BrowserWindow; pin the document shell and hide overflow
|
|
// so the renderer can't introduce scrollbars (see issue #305).
|
|
if (type === "hud-overlay") {
|
|
document.documentElement.style.height = "100%";
|
|
document.documentElement.style.overflow = "hidden";
|
|
document.body.style.height = "100%";
|
|
document.body.style.margin = "0";
|
|
document.body.style.overflow = "hidden";
|
|
const root = document.getElementById("root");
|
|
root?.style.setProperty("height", "100%");
|
|
root?.style.setProperty("min-height", "0");
|
|
root?.style.setProperty("overflow", "hidden");
|
|
}
|
|
}, [windowType]);
|
|
|
|
useEffect(() => {
|
|
// Load custom fonts on app initialization
|
|
loadAllCustomFonts().catch((error) => {
|
|
console.error("Failed to load custom fonts:", error);
|
|
});
|
|
}, []);
|
|
|
|
const content = (() => {
|
|
switch (windowType) {
|
|
case "hud-overlay":
|
|
return <LaunchWindow />;
|
|
case "source-selector":
|
|
return <SourceSelector />;
|
|
case "countdown-overlay":
|
|
return <CountdownOverlay />;
|
|
case "editor":
|
|
return (
|
|
<ShortcutsProvider>
|
|
<Suspense fallback={<div className="h-screen bg-background" />}>
|
|
<VideoEditor />
|
|
<ShortcutsConfigDialog />
|
|
</Suspense>
|
|
</ShortcutsProvider>
|
|
);
|
|
default:
|
|
return (
|
|
<div className="w-full h-full bg-background text-foreground">
|
|
<h1>Openscreen</h1>
|
|
</div>
|
|
);
|
|
}
|
|
})();
|
|
|
|
return (
|
|
<TooltipProvider>
|
|
{content}
|
|
<Toaster theme="dark" className="pointer-events-auto" />
|
|
</TooltipProvider>
|
|
);
|
|
}
|