Tabby the Tab Manager

TabbyTabManager

Inspiration:

With everything being online, the use of tabs for most students have increased exponentially. Having hundreds of tabs open has made managing our workflow more difficult, so we thought it would be really cool to make a tab manager to help with this problem! Our main goal was to create an easy way to navigate to see and navigate every tab quickly, without having to go through each tab or navigate between windows to look for the one we want.

What it does:

Tabby the Tab Manager has a popup window that can show/hide all the tabs that are currently open, grouped by the window that they are in. Users can click on the display to jump to specific windows/tabs, delete windows/tabs, and perform other useful functionalities. They can also rearrange the tabs in the popup window to fit their preferences.

How we built it:

Our program was built using Java Script, HTML, and CSS. Since this is a chrome extension, we utilize the chrome API to implement most functions.

Challenges we ran into:

Since our entire team was new to making chrome extensions, we faced problems in understanding how to utilize many of the functions that the chrome API allows. There were also a few issues in the beginning with debugging and having JavaScript files run properly.

What we learned:

We learned a lot about how chrome extensions work, including methods and properties for tabs and windows. Even though we knew javascript, html, and css beforehand, this project helped refresh our memory and helped us to continue to learn more about the languages.

What’s next for Tabby the Tab Manager:

Implementing the voice commands, adding more functions and voice commands, improving the UI.

How to try it out:

1. Download the github folder.
2. Click on the puzzle piece icon at the top right corner of Chrome (on the right side of the search bar, next to all your other chrome extensions such as AdBlock).
3. Click on “manage extensions” at the bottom of the dropdown menu.
4. Turn on developer mode (top right corner).
5. Click the “load unpacked” button and select TabbyTabManager.
6. Click on the puzzle piece icon again.
7. (Optional) Click on the thumb tack icon to pin Tabby to your extension bar.
8. Click on Tabby to manage your tabs!