Hacker News new | ask | show | jobs
by ba32107 1945 days ago
Hello 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!

5 comments

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.

Here's a cross-platform alternative to this: https://github.com/kamranahmedse/pennywise
Wow I didn't come across this during my research - seems similar to my solution, although TabFloater is a little bit different!
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!

This is a concept that was always in use in the now dead AOL browser. It was a concept I always liked and preferred it to tabs, but could never find anything to match it. I'll be sure to give this a go.

edit: for the curious https://i.pinimg.com/originals/44/3a/7b/443a7b1de502069e3fa9...

Your uninstall feedback form is broken, on Firefox at least.

What I was going to give feedback: An ability to locate the bin file from settings in the extension would be good, as I can't modify the registry.

The uninstall form uses Google Analytics to record answers. I suspect you've configured your browser to block tracking content, which is why it doesn't work for you. Thanks for letting me know this - I've updated the error message so that other people would understand why it doesn't work.

As for your actual feedback: there is no way to achieve this from the extension. The extension doesn't know where the companion executable is - it is the browser that connects the two applications.

However, you can enable debugging, then you can open the companion log file, which will contain the path to the executable.

Out of curiosity, why do you need to know the location? What were you trying to change in the registry? Is this the reason you uninstalled it? Maybe I can help.

Thanks for explaining. Sorry, I never said, I need to use the portable companion but don't have registry access (which is fine). I only uninstalled the addon as couldn't use companion. Thanks.
Hmm, I haven't thought of this use-case. I think this could also work if you put the registry entries into HKEY_CURRENT_USER (as opposed to HKEY_LOCAL_MACHINE).

If you'd like to experiment, you can change the register script to put entries into HKCU instead of HKLM. It might just work!

It's too bad the companion does not work for Mac. So, when I use this, it does not stay "on top".
I agree - this would be a great addition. I can't justify buying a Mac for this unfortunately.

I have https://github.com/tabfloater/tabfloater/issues/189 open in case there are any OS/X devs are here :)

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!

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.