Giter Club home page Giter Club logo

psychosanchez / web-activity-plugin Goto Github PK

View Code? Open in Web Editor NEW
9.0 2.0 1.0 1.78 MB

Chromium extension that helps you to keep track of your time

Home Page: https://chrome.google.com/webstore/detail/brotime/lkelagenhppgfcmkpiapckemdfjeilhi

License: GNU General Public License v3.0

TypeScript 96.27% HTML 0.76% JavaScript 2.35% CSS 0.56% Shell 0.05%
chrome-extension time-tracker browser browser-extension chrome dashboard plugin productivity time-tracking javascript typesctipt react tailwindcss typescript

web-activity-plugin's Introduction

web-activity-tracker

This is a simple web activity tracker Chrome extension that can be used to track user activity on websites. It is built using Tailwind, React, Typescript and using Chrome extension manifest V3.

Screenshot 2022-12-04 at 16 18 20 Screenshot 2022-12-04 at 16 19 15 Screenshot 2022-12-04 at 16 17 52

Privacy

Extension does not share collected data from the user. It stores data locally on the user's machine.

  • Data is stored in the browser's storage. (chrome.storage, IndexedDB)])
  • Data is not sent to any server.
  • Data is only used to display the activity on the website.
  • Data is not shared with any third party.

Features

  • Tracks activity on websites as well as local files (PDFs).
  • Supports activity tracking on audible websites with idle behavior (like Youtube, Netflix, Spotify, Discord) without extra permissions
  • Displays total activity on every website on a specific date or week with a second precision.
  • Minute by minute activity timeline for a specific website or all websites on a specific date or week.
  • Overall activity heat calendar
  • Graph of top 5 active websites.
  • Compares daily activity with current week average.

Installing from source

  • Clone the repository
  • Run npm install
  • Run npm run build
  • Go to chrome://extensions/
  • Enable developer mode
  • Click on Load unpacked and select the dist folder

Development

Install nvm

Clone the repository and run the following commands:

nvm use
npm install
npm start

Build production version

npm run build

Testing

npm run test

Contributing

Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.

Please make sure to update tests as appropriate.

License

GPL3

web-activity-plugin's People

Contributors

dependabot[bot] avatar psychosanchez avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar

Forkers

a-satyateja

web-activity-plugin's Issues

Time tracking visualization

  • Create popup window that will display how much time user spent on webpages
  • Use github commit panels to display how much time user spent comparably to previous dates
  • Use android/iphone like vertical chart to display daily/weekly usage
  • Split view by hostname for daily/weekly usage
  • Create comparable average daily usage and forecast
  • Display browser overall usage

Unhandled exceptions after tabs.query in onActivated event

In June Chrome chrome.tabs.query method was updated to prevent query while user is dragging tabs, that lead to unexpected exceptions because onActivated event does not provide tabInfo and trying to query tab by id immediately after event will almost certainly crash.

Google suggests to use setTimeout polling and it seems the only solution for now:
https://developer.chrome.com/docs/extensions/reference/tabs/#move-the-current-tab-to-the-first-position-when-clicked

Icons

Design generic clock like icon using application colors

Time tracking logic implementation

  • Active tab detection
  • Focus change detection
  • Video/Audio/Fullscreen content detection
  • Tab open history
  • Temp storage

Locally stored data:

    [{
        hostname: %host%,
        date: Date.now()
     }]

Sync data:

key: Date
value: {
    ['hostname']: accumulated time (in ms)
}

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.