1

I am making a chrome extension that opens a popup window upon clicking button injected into the page. Everything works flawlessly apart from the fact that the window is displayed on the main display, and not the one the browser window invoking the popup is on. How can I handle this? Using Mac with custom display arrangement, if that's relevant. I'd like for the window to just refer to boundaries of the window it originated from.

From what I'm understanding this involves some elaborate displays pixel calculation, but how to get display sizes in that context? I hope you see what I'm saying and that I included all relevant details. I'm including my code for opening the window below:

    chrome.windows.getCurrent((tabWindow) => {
        const popupWidth = 400;
        const popupHeight = 400;
        const leftOffset = (tabWindow.width/2)-(popupWidth/2);
        const topOffset = (tabWindow.height/3)-(popupHeight/2); 

        var infoPopupUrl = "someurl";

        chrome.windows.create(
            {
                'url': chrome.runtime.getURL(infoPopupUrl),
                'type': "popup",
                'width': popupWidth,
                'height': popupHeight,
                'left': Math.round(leftOffset),
                'top': Math.round(topOffset),
                'focused': true
            }
        );
    });

Thanks everyone for the help.

Gonerator
  • 21
  • 6

1 Answers1

0

This link: https://stackoverflow.com/a/25830431/3218811

Led me to finding answer in the screen object. There are availLeft and availTop properties that represent the exact relations of screens arrangements. Works on Mac, I have to test other platforms, but I suppose it's standard in Chrome:

        const leftOffset = (tabWindow.width/2)-(popupWidth/2)+screen.availLeft;        
        const topOffset = (tabWindow.height/3)-(popupHeight/2)+screen.availTop;
Gonerator
  • 21
  • 6