I know this is maybe a request you don’t see very often, but does anyone have some pointers on where to start if you’d want to open a real pop-up (aka not a modal div)?
The reason why a modal div wouldn’t work is because the goal of this is make a web app that works across multiple monitors. The only way, as far as I know is to create a real child window.
While it’s easy enough to start a new pop-up and load an aurelia app in it, it would actually create an entire new instance of the app in the pop-up window and what I need is to load up a custom element in the pop-up and have it interact with the rest of the application as if it were inside the normal window.
What would be a good place to start looking into such a communication method?
Easiest way would be to stretch the browser window across 2 monitors (-:
Second Idea is to use local storage to share state… but that would prevent having several instances of the app working independently.
If your popup is ‘same-origin’ then you have access to window.document.body etc…
and you can enhance it with aurelia…
After this point we should get down to specifics…
How do you want to manage what’s happening in the second window?
1 Like
Yeah, stretching the browser window is a bit annoying as it messes with a lot of things and we really want to use it as a separate toolbar.
Indeed, it would be same-origin, so access is shared and you can in theory communicate between the two windows. We’re using aurelia store so we already have a shared state component. I guess we could devise a middleware there that takes care of pushing the state back and forth between the two components.
What I’m not entirely sure of is how I’d set up aurelia to run both instances at the same time. I guess one possibility is passing some kind of flag that would run it in pop-up mode and then run just that single component and do the communication back and forth
The popup instance, while bootstrapped, can already access the state to read its setup instructions and change the appRoot accordingly. Communication between the two apps can happen via adding a middleware to push messages via window.postMessage and a message eventlistener on the other side. Alternatively a websocket is also an option.