GithubHelp home page GithubHelp logo

kl13nt / loggy Goto Github PK

View Code? Open in Web Editor NEW
9.0 2.0 0.0 1.03 MB

Gain insights on the time you spend online!

License: GNU General Public License v3.0

JavaScript 62.05% Vue 34.31% CSS 0.48% HTML 3.16%
time-management lifestyle tracking

loggy's Issues

Refactor the data schema

The current schema is difficult to maintain and use, and forces me to build mumbo jumbo code that is confusing and poor in performance. It's also difficult to get started with since it's difficult to document for onboarding.

The current schema is:

class Entry {
  origin: string;
  lastVisit: Date;
  firstVisit: Date;
  [year]: {
    [month]: {
      [day]: number
    }
  }
}

This schema is not properly built, doesn't adhere to any SOLID principles, difficult to maintain, and is difficult to maintain. The new schema is:

class Session {
  date: Date;
  duration: number;
}

class Entry {
  origin: string;
  lastVisit: Date;
  firstVisit: Date;
  sessions: Array<Session>;
}

This will require an overhaul of the codebase to use the new schema.

Date Range Filtering

Having to view the full history log instead of a specific time range is not very useful. Add date selectors to select a specific range, and set the default to a month.

Addon tracking postinstall

When the addon is first installed, a tab change needs to occur for it to detect changes and start tracking. Add a way for it to start tracking the focused tab immediately postinstall.

Settings Page

A settings page should be navigate-able by going to Addons > Loggy > Options. It should include the following for starters:

  • An ignore list where users can ignore websites
  • An option to ignore browser pages such as about:-prefixed pages

Explicit Chromium* Support

Chromim-based browser don't support the browser namespace. To be able to safely distribute this extension for Chrome, Edge, and others, I'd need to properly configure a setup for them.

References:
mozilla/web-ext#809
https://hacks.mozilla.org/2019/10/developing-cross-browser-extensions-with-web-ext-3-2-0/
https://github.com/mozilla/webextension-polyfill/#usage-with-webpack-without-bundling
https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/Build_a_cross_browser_extension

Some websites don't record properly

Describe the bug
I don't really know. Needs further testing.

To Reproduce
Remain on the same website for a prolonged period of time.

Expected behavior
Should log all of it. Instead, it sometimes logs 3 hours out of a total 5.

Smart Idle Detection

I rely on the browser's window.focused to determine whether the user is idle or not. But this has one major flaw; if a user has the browser focused and goes idle it'll keep counting. This is an inaccuracy that could be mitigated using a content script that registers a global event listener for any user action, and based on a specific timeout, communicate the user's idle state to the background process.

Stop using StorageArea.set directly with complex types

As documented on the MDN page:

It's generally not possible to store other types, such as Function, Date, RegExp, Set, Map, ArrayBuffer, and so on. Some of these unsupported types will restore as an empty object, and some cause set() to throw an error. The exact behavior here is browser-specific.

The behavior on Firefox, luckily enough, stores Date as strings, but we need to serialize before updating data.

Browser Action

Currently the way users can view the log is by going to Menu > Addons > Loggy > Options. This is cumbersome. Adding a browser action to make it easier should be a priority. A simple button that opens up the log would be fine.

To do:

  • Add a browser action
  • Add a browser action page with simple statistics
  • Show only today's statistics of top 5 websites
  • Add a link to open the full log from the browser action
  • Add a link to the settings page, this will initially be disabled

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.