diff --git a/src/ui/LiveSplit.tsx b/src/ui/LiveSplit.tsx index 8c9d72a3e..2ff9fcc7b 100644 --- a/src/ui/LiveSplit.tsx +++ b/src/ui/LiveSplit.tsx @@ -1092,18 +1092,41 @@ export class LiveSplit extends React.Component { } } -async function popOut( - commandSink: LSOCommandSink, - getLayout: () => LayoutRefMut, - generalSettings: GeneralSettings, +async function openPopupWindow( width: number, height: number, -) { +): Promise { + try { + const pipPromise = ( + window as any + ).documentPictureInPicture?.requestWindow({ + width, + height, + }); + + if (pipPromise) { + return (await pipPromise) as Window; + } + } catch { + // It's fine if it fails, as not all browsers support this. + } + const childWindow = window.open( "", "_blank", `popup,width=${width},height=${height}`, ); + return childWindow; +} + +async function popOut( + commandSink: LSOCommandSink, + getLayout: () => LayoutRefMut, + generalSettings: GeneralSettings, + width: number, + height: number, +) { + const childWindow = await openPopupWindow(width, height); if (!childWindow) { return; } @@ -1165,8 +1188,8 @@ async function popOut( }} layoutUrlCache={urlCache} allowResize={false} - width="100%" - height="100%" + width="100vw" + height="100vh" generalSettings={generalSettings} renderer={renderer} onResize={(width, height) =>