Proof of concept for popping out the remote screen

[jotaen4tinypilot]

Proof-of-concept implementation for https://github.com/tiny-pilot/tinypilot/issues/728. (Not meant for merging.)

@mtlynch could you briefly check out this branch, whether the functionality/behaviour matches what you had in mind? If so, I’d chop this up into 2–3 smaller PRs, and wrap up the implementation.

https://github.com/tiny-pilot/tinypilot/assets/83721279/a3a99b42-833a-4cc1-be4d-4bf9500df4a1

• We would add a new item to the “View” menu to open the popup window. Not sure about the menu item label, “Popup Window” certainly doesn’t sound great, but I also haven’t thought about good wording yet.
• For the popup window itself, we can strip all browser bars (bookmark, back/forward buttons, etc.) except for the address bar by means of the window.open API.
• The initial dimensions of the popup can be configured, e.g. to match the dimensions of the current remote screen. (The user can adjust the size in any event anyways, though.) This POC demonstrates this initial auto-sizing, it comes at roughly 10 LOC. We could also leave this feature out, however, as it’s a mere convenience (e.g. for when the user had manually “optimized” their browser window size previously). Without initial sizing parameters, the browser just uses its regular dimensions for new windows.
• In order to strip off the menu bar and status bar inside the popup window, I’d find it most simple to use a query parameter (here: ?viewMode=standalone) and facilitate the control flow via a template parameter in views.py/index.html. That also would allow for the iframe use-case described in https://github.com/tiny-pilot/tinypilot/issues/523. A potential alternative might be to communicate internally via JavaScript with the popup window from the main window, but that would prohibit the iframe use-case. It would also probably be more complicated code-wise.

[mtlynch]

Cool, this looks great and matches what I had in mind.

One thing that feels a little weird is that it creates duplicate remote screens, which feels disorienting. What if when the user pops out the remote screen, we replace the default remote screen on the full web interface with a message that says, "Remote screen is displaying in another browser window. You can restore the remote screen by reloading this page."

Not sure about the menu item label, “Popup Window” certainly doesn’t sound great, but I also haven’t thought about good wording yet.

How about "Dedicated Window"?

In order to strip off the menu bar and status bar inside the popup window, I’d find it most simple to use a query parameter (here: ?viewMode=standalone) and facilitate the control flow via a template parameter in views.py/index.html.

Yeah, I like this.

[jotaen4tinypilot]

Terrific, thanks for checking it out. I have taken note in the issue, so we can close this PR for now.