"Picture in Picture" with oneboxes?

Hi!

I’m not familiar at all with Discourse’s codebase, and I didn’t actually write any code for a long time, so I thought I might as well post my idea in here.

I wonder if some sort of PIP feature (I guess that is how it’s called) could be implemented in Discourse.

Basically, I would like to be able to keep browsing the forums after I started playing content in a onebox (youtube, soundcloud, etc.). Even if I clicked the top logo and went back to the homepage of my forums, the video would still be playing in a hovering little box.

While I’m not able to reproduce that behaviour at the moment, I’m pretty sure Facebook sometimes did that with videos on the homepage when you kept browsing to the bottom.
It also happens on the android youtube app, when you go back to search results while a video was playing.

Hope that’s clear enough.

Thanks :slight_smile:

This might be complex to do as we are unloading DOM elements from the posts that aren’t in the viewport.

I don’t think the unloading it too much of a problem, this would be a distinct element outside of topic-view, always docked to bottom right or something.

I think it is pretty straight forward to do in a plugin.

6 Likes

That would be neat. I’ll stay tuned!

Just to clarify, Discourse team has no plans to implement anything like this, you will need to find someone in the community to build this.

Obviously :wink:

And I’ll be happy to buy a couple of beers to anyone willing to get their hands dirty!

I decided to have a go at making a plugin for this - is this the kind of thing you had in mind?

It works with any <iframe> or <video> (with some special treatment for lazyYT). It adds a button to every compatible thing, which then opens a little popup in the bottom right.

You can then “minimise” it, which keeps the audio going in the background, or completely close it.

4 Likes

Wow, that’s great.

Are you ready to release it?

Almost, just wanted to check I had the right idea before polishing it off :slight_smile:

4 Likes

The button is a bit oddly placed, I would overlay it somewhere on the video if possible, I wonder if youtube allows you to add a custom button to the embed.

3 Likes

I agree it’s a bit odd, I struggled to find anywhere sensible to put it. I tried doing some :hover based stuff but then realised that would exclude any touch-based devices.

The button could be positioned on top of the video, but that would obscure the video if the user decides to play inline (there’s no way to check whether a video is paused/playing when it’s inside an iframe).

2 Likes

Discussion continues here:

https://meta.discourse.org/t/media-overlay-plugin/60549?u=erlend_sh

2 Likes