diff --git a/packages/web/src/utility/simpleTools.ts b/packages/web/src/utility/simpleTools.ts index f655445ab..77164e211 100644 --- a/packages/web/src/utility/simpleTools.ts +++ b/packages/web/src/utility/simpleTools.ts @@ -1,11 +1,40 @@ import getElectron from './getElectron'; -export function openWebLink(href) { +export function openWebLink(href, usePopup = false) { const electron = getElectron(); if (electron) { electron.send('open-link', href); } else { - window.open(href, '_blank'); + if (usePopup) { + const w = 500; + const h = 650; + + const dualScreenLeft = window.screenLeft ?? window.screenX; // X of parent + const dualScreenTop = window.screenTop ?? window.screenY; // Y of parent + + // 2. How big is the parent window? + const parentWidth = window.outerWidth; + const parentHeight = window.outerHeight; + + // 3. Centre the popup inside that rectangle + const left = dualScreenLeft + (parentWidth - w) / 2; + const top = dualScreenTop + (parentHeight - h) / 2; + + const features = [ + `width=${w}`, + `height=${h}`, + `left=${left}`, + `top=${top}`, + 'scrollbars=yes', + 'resizable=yes', + 'noopener', + 'noreferrer', + ]; + + window.open(href, 'dbgateCloudLoginPopup', features.join(',')); + } else { + window.open(href, '_blank'); + } } } diff --git a/packages/web/src/widgets/WidgetIconPanel.svelte b/packages/web/src/widgets/WidgetIconPanel.svelte index 778f5eb8f..16a7aaaf9 100644 --- a/packages/web/src/widgets/WidgetIconPanel.svelte +++ b/packages/web/src/widgets/WidgetIconPanel.svelte @@ -131,7 +131,7 @@ async function handleOpenCloudLogin() { const { url, sid } = await apiCall('auth/create-cloud-login-session', { client: getElectron() ? 'app' : 'web' }); - openWebLink(url); + openWebLink(url, true); }