Show HN: A browser extension to use picture-in-picture with any website
1–10 of 50 posts
Re: Show HN: A browser extension to use picture-in-picture with any website
#2Hello everybody! I created a browser extension called TabFloater, which can replicate the picture-in-picture functionality with any website. It moves a chosen tab into a smaller window, which is going to remain always on top, so you can interact with both websites at the same time.
This is my very first post on HN. I have been working on this pet project for a bit over a year now. The motivation for it was simple: because I use my browser in a single, fully maximized window, many times I found myself switching back and forth between two tabs, for example to copy something from one website and use it on another. I know there are many extensions that can rearrange tabs for you, but I wanted something a little bit different. I really liked how picture-in-picture works for videos - I wanted to do the same!
Easy enough, I thought. I just need to create a new browser window, move the given tab into it, then... I just need to make it always on top. Right? Well, turns out, the browser API doesn't allow you to do that. So after a lot of trial end error, I came up with a way to achieve it: I implemented a small app in C++ that can manipulate the browser window and set the always-on-top property. Then "all I needed" was to hook it up with the browser extension and voila.
I also implemented a feature I call "Smart positioning": if you enable it, the extension will analyze the DOM structure of a given site and tries to identify the largest empty area and puts the floating tab there. This way, it doesn't cover up any text, pictures or videos. It more or less works :)
Sounds pretty simple, but I spent a LOT of time trying out different things. I use Linux, so naturally I implemented it for that platform first, but I knew it would never be useful for other people if there wasn't a Windows version as well - so I did that too. I worked on this project on evenings and weekends, and I learned a lot. This was my first proper pet project and I'm really glad I was able to see it through!
The extension is available for Chrome and Firefox, and you can use it on Windows and most Linux distros. The native application doesn't have an OS/X version - sorry :) I don't own a Mac and I don't know anything about the Apple ecosystem. I'm looking for help in that department, if you're interested! :)
Reminder: in addition to the browser extension, you must also install the native application (called Companion).
Site: https://www.tabfloater.io/
GitHub: https://github.com/tabfloater/tabfloater
Chrome Web Store: https://chrome.google.com/webstore/detail/iojgbjjdoanmhcmmih...
Firefox Addon: https://addons.mozilla.org/en-US/firefox/addon/tabfloater/
Thanks!
Re: Show HN: A browser extension to use picture-in-picture with any website
#3Hello everybody! I created a browser extension called TabFloater, which can replicate the picture-in-picture functionality with any website. It moves a chosen tab into a smaller window, which is going to remain always on top, so you can interact with both websites at the same time. This is my very first post on HN. I have been working on this pet project for a bit over a year now. The motivation for it was simple: be…
Interestingly Chrome use to support always on top windows in extensions. They eventually got removed
There is a very interesting comment from one of the developers on the removal bug (https://bugs.chromium.org/p/chromium/issues/detail?id=467808):
> While closing this issue as "Fixed", I feel I need to offer a couple of words of personal explanation to the users of Trello who were directed here by the developer of the app, as well as others who can be interested.
> I'm the original developer of Panels in Chrome, and I'm the engineer who's lead a team to maintain them. I also finally removed them. Panels were a part of my life in form of time, thoughts, inspiration and passion. Our initial plans were to enable panels to all apps which wanted to use them, and we saw how those can be useful of course. It is with sadness but also with appreciation of the experience that I had to remove the feature from Chrome M54.
> The time passes and things change, we all learn. In case of Panels, we "proved" by practice that it takes a team of a few engineers full time to be able to catch up with teams of OS developers in Windows, OSX, Linux and even our own ChromeOS. The window management and graphics/input subsystems are constantly evolving and it is more or less prohibitively expensive for a small team to try to build and keep a high quality but non-standard window management mode. OSes have too many mechanisms that are linked to a specific windows behaviors (focus, window switching, active windows treatment, titlebars, where input goes, shortcuts, animations, multiple desktops, other OS gadgets etc), and usually OSes do not provide 'hooks' or APIs to integrate with those, which makes it necessary to 'reverse-engineer' and hack around. While it can be done, it quickly leads to 'card house' design that falls down even easier with the next major OS update... So the costs of development and testing rise.
> There was another factor that kept us from enabling panels for all apps. The specific UI Panels provide does not scale well if/when multiple apps are using it. It is very easy to get in trouble with multiple always-on-top windows popping up from multiple apps. Several independent apps using panels at the same time actually makes the interface annoying and hard to control. We had several apps using Panels at the same time and it was hard to manage windows because they were all intermixed. There were several design ideas on how to build some 'panel managers' and corresponding APIs but they increased the complexity significantly, especially considering those would be in addition to APIs OS provides for other windows. So we never were able to enable it for every app.
> Now, if the major OSes would adopt the concept and built into their window managers, it'd be much much easier to support it in Chrome. But it's not the case, except for ChromeOS where panels stay.
> So at the end, this was a great experiment. We are now way past the point where additional discussion can move the needle much. Google Hangouts app had millions of users and some of them loved Panels. Apparently Plus for Trello has passionate followers. The YouTube viewers is a neat idea. But we all need to move forward, the platforms change much faster and generally to the better :) Hope developers of your favorite apps will figure out even better ways to implement great UI their users demand!
Re: Show HN: A browser extension to use picture-in-picture with any website
#4Hello everybody! I created a browser extension called TabFloater, which can replicate the picture-in-picture functionality with any website. It moves a chosen tab into a smaller window, which is going to remain always on top, so you can interact with both websites at the same time. This is my very first post on HN. I have been working on this pet project for a bit over a year now. The motivation for it was simple: be…
Interestingly Chrome use to support always on top windows in extensions. They eventually got removed There is a very interesting comment from one of the developers on the removal bug ( https://bugs.chromium.org/p/chromium/issues/detail?id=467808 ): > While closing this issue as "Fixed", I feel I need to offer a couple of words of personal explanation to the users of Trello who were directed here by the developer of t…
Indeed, I did not found this particular thread, but I have come across the fact that it was supported in the past. I guess my solution will also be a bit fragile, but so far, it works :)
I was also contemplating removing the borders and title bar of the floating window, so that it would much more like a panel, but on Windows, Chrome actually draws its own title bar, so you cannot remove it using the Windows API.
Re: Show HN: A browser extension to use picture-in-picture with any website
#5Was also disappointed to find that browser picture in picture support was limited to a video element. Wish I could just use it on any element, like with fullscreen.
I can imagine some complexity as explained. But for example it seems reasonable to me to limit browser panel/PiP support to a single element at a time like it is now for video to avoid some of that.
This looks interesting!
Re: Show HN: A browser extension to use picture-in-picture with any website
#6How confident are you that this solution does not impose any security/privacy implications ?
Re: Show HN: A browser extension to use picture-in-picture with any website
#7Hello everybody! I created a browser extension called TabFloater, which can replicate the picture-in-picture functionality with any website. It moves a chosen tab into a smaller window, which is going to remain always on top, so you can interact with both websites at the same time. This is my very first post on HN. I have been working on this pet project for a bit over a year now. The motivation for it was simple: be…
As someone who has used http://www.vanmiddlesworth.org/vitrite/ to toggle always-on-top and transparency for a long time, it is strange to see this -- browser-specific -- reinvention of basic window management.
On the other hand, my desktop is 2560 pixels wide, and as a result, I've never had the need nor desire to maximise anything. I also rarely use multiple tabs, preferring separate windows instead, which I can then arrange as I please. I wonder if the popularisation of tabbed browsing has decreased the desire/visibility of comparing/contrasting in general, since as you mentioned, it is much more difficult when you can only see one site at a time.
Re: Show HN: A browser extension to use picture-in-picture with any website
#8How confident are you that this solution does not impose any security/privacy implications ?
Depends on what you mean. If we are talking about whether or not TabFloater itself can be trusted, then I'm 100% confident since I wrote it :) It's fully open source, the companion binaries are built through GitHub Actions, so I have no chance of introducing malicious code. The Chrome extension is also published through GitHub Actions. All this means that you can be sure you're running the same code that you read on GitHub. Publishing the Firefox addon is manual at the moment (they don't offer a great API for automated publishing), but Firefox requires me to submit source code alongside the extension, and they review it.
If you meant an unintentional security issue, then I think we are still good. The only thing the extension communicates to the native application is the title of the current browser tab, which is arguably personal information. However the native application is running on your machine, and you chose to install it. There's no way for remote machines to get your info this way. The only scenario I can see for leaking private info is if someone creates a malware that mimics TabFloater Companion and somehow manages to get it on your machine without you knowing. Then, they will get the titles of the sites you use TabFloater on. There are so many better ways for attackers to get the same information - I think this risk is negligible.
Of course, if you see any other issue that I might have missed, do let me know!
Also have a look at the privacy policy if you haven't already: https://www.tabfloater.io/privacy
Re: Show HN: A browser extension to use picture-in-picture with any website
#9Hello everybody! I created a browser extension called TabFloater, which can replicate the picture-in-picture functionality with any website. It moves a chosen tab into a smaller window, which is going to remain always on top, so you can interact with both websites at the same time. This is my very first post on HN. I have been working on this pet project for a bit over a year now. The motivation for it was simple: be…
As someone who has used http://www.vanmiddlesworth.org/vitrite/ to toggle always-on-top and transparency for a long time, it is strange to see this -- browser-specific -- reinvention of basic window management. On the other hand, my desktop is 2560 pixels wide, and as a result, I've never had the need nor desire to maximise anything. I also rarely use multiple tabs, preferring separate windows instead, which I can th…
I have the same resolution size :) I agree that the usefulness of this app depends on how you use your browser. I do the exact opposite of you, at any time I have at least 20-30 tabs open and I regularly switch back and forth.
I prefer to think of TabFloater as not an app that creates/moves/manipulates extra browser windows (even though that is what actually happens), but an app that adds an extra browser functionality (picture-in-picture). In this sense, I think it makes sense that it brings its own "always-on-topness".
I'm also aware that this app solves a pretty niche use-case - but it was fun developing it and I learned a lot!
Re: Show HN: A browser extension to use picture-in-picture with any website
#10I use a browser which allows me to override "fullscreen" mode to only go full-screen within the browser window, but not actually expand to the full screen. After that, it's just a matter of setting it "always on top", which the window manager makes easy. However, for videos I actually want to watch, I prefer to just download them and watch in mpv.