Tab Time Tracker is a Chrome extension designed to monitor and record the time spent on individual browser tabs. This tool provides users with insights into their browsing habits and time allocation across different websites.
- Real-time tracking of active tab duration
- Persistent storage of time data across browser sessions
- User-friendly popup interface displaying time spent on the current tab
- Comparison table showing time spent across all tabs
- Background processing to ensure accurate timing even when the popup is closed
The extension is built using standard web technologies and the Chrome Extension API:
- JavaScript for core functionality and time calculations
- HTML and CSS for the popup interface
- Chrome Extension APIs for tab management and data persistence
Key components:
background.js: Handles core timing logic and tab event listenerspopup.js: Manages the user interface and time display updatespopup.html: Defines the structure of the popup interfacemanifest.json: Specifies extension metadata and permissions
To install the extension for development:
- Clone the repository:
git clone https://github.com/dhananjay6561/tab-time-tracker.git- Navigate to
chrome://extensions/in the Chrome browser - Enable "Developer mode" in the top right corner
- Click "Load unpacked" and select the directory containing the extension files
After installation, the extension will automatically begin tracking tab usage. To view the time spent on tabs:
- Click the extension icon in the Chrome toolbar
- The popup will display:
- Time spent on the active tab
- A table comparing time spent across all tabs
To modify or extend the extension:
- Edit the relevant files (
background.js,popup.js,popup.html,manifest.json) - Save changes
- Return to the
chrome://extensions/page - Click the refresh icon on the extension's card to reload it
The extension requires the following permissions:
tabs: To access and monitor tab activitystorage: To persist timing data
These permissions are declared in the manifest.json file.
Time data is stored using Chrome's storage.local API. This ensures data persistence across browser sessions while keeping the information local to the user's device.
- The extension only tracks time when Chrome is open and the user is actively using the browser
- Time tracking may be less accurate during periods of system sleep or when Chrome is in the background
The Tab Time Tracker project has plans for significant enhancements to provide users with more detailed insights and improved data visualization. Key planned features include:
-
Time Distribution Graphs:
- Implement interactive pie charts to visualize the proportion of time spent on different websites.
- Develop bar graphs to show daily, weekly, and monthly usage patterns.
-
Trend Analysis:
- Create line graphs to display usage trends over time, allowing users to track changes in their browsing habits.
-
Category-based Tracking:
- Introduce a system to categorize websites (e.g., productivity, entertainment, social media).
- Generate stacked bar charts to show time allocation across different categories.
-
Data Export Functionality:
- Implement features to export tracking data in common formats (CSV, JSON) for external analysis.
-
Statistical Analysis:
- Provide basic statistical measures such as average time per site, most visited sites, and peak usage times.
-
Dashboard:
- Develop a comprehensive dashboard integrating various graphs and statistics for at-a-glance insights.
-
Customizable Views:
- Allow users to customize which graphs and metrics are displayed based on their preferences.
-
Responsive Design:
- Ensure all new graphical elements are responsive and function well across different screen sizes.
These planned updates aim to transform the Tab Time Tracker from a simple time-tracking tool into a comprehensive platform for analyzing and understanding browsing habits. The integration of graphical elements will provide users with intuitive visual representations of their data, facilitating better insights and potentially aiding in productivity management.
Contributions to the Tab Time Tracker project are welcome. Here's how you can contribute:
- Fork the repository on GitHub.
- Clone your forked repository to your local machine.
- Create a new branch for your feature or bug fix:
or
git checkout -b feature/your-feature-namegit checkout -b fix/your-bug-fix - Make your changes and commit them with a clear, descriptive commit message.
- Push your changes to your fork on GitHub:
git push origin feature/your-feature-name - Open a pull request from your fork to the main repository.
- Provide a clear description of the changes and any relevant issue numbers in the pull request description.
- Ensure your code adheres to the existing style of the project to maintain consistency.
- Update the README.md with details of changes to the interface, if applicable.
- Increase the version numbers in any examples files and the README.md to the new version that this Pull Request would represent.
- You may merge the Pull Request once you have the sign-off of two other developers, or if you do not have permission to do that, you may request the second reviewer to merge it for you.
If you find a bug or have a suggestion for improving the extension:
- Check the GitHub Issues to see if the bug or suggestion has already been reported.
- If not, open a new issue, providing as much relevant information as possible.
- For bugs, describe the issue in detail, including steps to reproduce, expected behavior, and actual behavior.
- For feature suggestions, explain the proposed feature and its potential benefits.
Thank you for your interest in improving Tab Time Tracker!