rodolphe37 / my-simple-tasks-manager-

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

License: MIT Maintenance JavaScript GitHub issues Open in Visual Studio Code Open Source? Yes! GitHub last commit (branch) drawing

Website Netlify Status

User Guide


drawingMy Simple Task Manager_V2.2.0

πŸ”– This is the web (pwa) version, if you want to use the desktop version it's here

is a drag-and-drop task manager as well as a time tracker (not for a team, but for a single freelance developer for example)!

πŸ”– This is a great little application when you are working alone on projects where you need to organize your tasks, as well as track the time you spend on a project to know the actual time you spent on it.

alt text

Quick Links

Online sites

Functionality

For mobile devices

LocalStorage persistence

compatibility

Author

A few words from the author

Support the project

License

My other projects


πŸ’» Online sites

You can use My Simple Task Manager for FREE here,

alt text

βœ”οΈ This is Progressive Web App (PWA)

alt text

You can easily install this application on a Windows, Mac or Linux computer.

Install on Ubuntu βœ”οΈ

alt text

Install on Mac OSX βœ”οΈ

alt text

Installed app on Windows βœ”οΈ

alt text


Functionality

Task card

❗ When you put the card on "In Progress" column

You have the day and the hour of the beginning of the treatment of the task to do.

alt text


❗ When you put the card on "Done" column

In addition to the information of the beginning of the work on this card, the information of the end of the work is added.

alt text


❗ If you work several times on the same card

The start/end information for each session is displayed.

alt text


❗ If you put all the cards back in the "To Do" column

You will be asked if you want to reset the history of the time spent working on the cards!

alt text


Sticky Notes

You can create 4 sticky notes max.

❗ I also added a "Sticky Notes or Post It" section

You can create up to 4 sticky notes in order to store all the information needed for the project and to access them at any time.!

alt text


Time Tracker

❗ Time Tracker : Manual or automatic mode ?

A configuration button has been added to allow you to choose between two modes for the Time Tracker.

alt text


❗ When you are in manual mode (default configuration)

The manual mode leaves the "Time Tracker" toolbar at the top of your page (header), This mode allows you to manage the time tracking independently from the task card dashboard..

alt text


❗ When you click on the configuration button when you are in manual mode

A modal appears telling you which mode you are in and the possibility to change the default configuration to automatic mode.

alt text


❗ When you are in automatic mode

The automatic mode moves the "Time Tracker" toolbar to the bottom of your page (footer). The management of the timer start/stop is done automatically depending on whether you are working on a task or not.

alt text


❗ When you drag a task card into the "In Progress" column

The timer starts automatically...

alt text


❗ Then, when you drag the card to the "Done" column

The timer stops automatically.!

alt text


❗ When you click on the configuration button when you are in automatic mode

A modal appears showing you in which mode you are and the possibility to change the default configuration in manual mode.

alt text


Limit on simultaneous tasks

For better organisation, only one task can be in progress at a time.

❗ You can only do one task at a time

If you drag more than one card into the "In Progress" column an alert informs you that it is not allowed and your card goes back to the box it came from automatically.

alt text


Auto-detect end project

❗ Auto-detect end project : When all tasks are done !

when you have finished all your tasks, the timeTracker disappears, a message appears to inform you that the dashboard is now accessible (you will notice the icon that swings on the left of the window).

alt text


Dashboard

❗ When you open your dashboard for the first time

When you click on the icon, it stops oscillating and the dashboad opens. When you open the dashboad for the first time, a modal window appears asking you for your daily rate in order to calculate the statistics based on it.

alt text


Daily rate

❗ Just under the header you have the daily rate management!

This is where the amount you entered is managed

alt text


❗ You can change devise to euros!

(but the default value for the app is $)

alt text


❗ Erase current daily rate!

On the left is a cross to delete the current amount.

alt text


❗ New daily rate!

And on the right you have the button that allows you to enter a new amount.

alt text


Statistics

❗ let see the dashbord with some statistics on the work done!

The first three "modules" you see (from left to right) are:

  • The total duration in hours and the average wage per hour.
  • The number of days that the work represents. And the calculation of the total cost of the project based on the daily rate entered beforehand.
  • The number of tasks and the average hour per task.

alt text

For the graphics, let's see it in more detail...


❗ Time spent on each task!

The first graph represents each task and the time spent on it.

alt text


❗ Budgetary impact for each task!

The second graph represents the percentage of budget impact for each task (Calculated from the daily rate, the overall time and the time spent on each task individually).

alt text


❗ Number of work sessions per task!

This last graph is based on the number of times a task has been put in "In Progress".

alt text


❗ Further down in the Dashboard page...

  • You have, first of all, the view on all notes written during the project.
  • Then you have the number of connections to the application.
  • Then come the tasks with their titles, their id, the text description of the task, and the date of creation.

alt text


❗ Then there is the detailed "task/time session" section.

  • First of all, you have the tasks that required more than 2 hours.
  • Then, the ones that required between 1 hour and 2 hours.
  • Then come the ones that required less than 1 hour to do.

alt text


❗ All sessions on each task!

Finally, you have the list of tasks with "day and time of start and end of work" on each of them.

alt text


Export data

Warning - You must have entered a project name in the application to export the data.

  • The files are named "on the fly" with this value, so you won't have a file name if you haven't entered this value first!

You have two options for exporting dashboard data:

  • pdf export is not perfect for my taste (the layout of generated pdf more exactly), but they do work. I'm working on an improved version of the pdf export functionality right now... as soon as I get a great solution I'll update the application.

Pdf export

❗ You can download the pdf report!

The first is exporting as a pdf (without the graphs and numbers that are part of it).

  • By clicking on the pdf icon, the application will generate a file with the raw data.

alt text


Png report screenshot

❗ You can download the png report screenshot!

  • The second one is the export in png (copy of the complete dashboard this time).

If you choose this export option there is one important thing to know...

because the png file is generated automatically with the scale of your window, if you use this option in full screen in very large screen, your image will be all crushed.

alt text


And this is a result:

drawing

---

You can resize your window like the animated gif below (with the graphs in large size if you want (by reducing the width of your window before clicking on the png button))

alt text


And this is a result:

drawing


Exchange Dollars-Euros

❗ Dynamic real time Dollars/Euros exchange rate added! πŸ’΅ / πŸ’Ά

The conversion of the Daily rate from Dollars to Euros is now done automatically according to the official exchange rate.


Currency converter

❗ A currency converter has just been added.

You can convert almost any currency, simply and quickly, with this widget.

alt text


Delete or reset

❗ When you want to delete the Project name!

You have two choices, delete only the project name or reset all (Project name, timer & all cards)

alt text


❗ When you want to delete an task card!

You have one alert for confirm your wish to delete this card (with name card)

alt text


Real time counter

❗ When you Start the counter!

The elapsed seconds are sent to the localstorage in real time, if you close the window inadvertently without stopping the counter, the elapsed time is automatically saved in the localStorage, adding to the time already present (seconds)!

alt text


For mobile devices

All mobile devices with a screen width of less than 500px are not compatible with this application

❌ this application is not responsive on mobile πŸ“΄ (as it is an application for people working in front of a computer - developer like me for example - I did not find useful to do media queries for that).

alt text


LocalStorage persistence

(The demo is fully functional, all infos are stocked in localStorage)

  • Infos:
    • An input field, at the top right, is made to enter the name of the project you are working on!
    • 1 day of work is equivalent to 8 hours (28800 seconds)! (the calculation of the days worked in proportion to the passed seconds is made with this logic - each 28800 elapsed seconds increment one day more)
    • When you start the counter, the seconds passed are sent to the localstorage in real time, when you stop the counter, the seconds passed add to the total and when you restart the counter, the count continues from this beginning.
    • When you click on reset button, it's reset the time in the state app & remove time to localStorage ( at each project beginning you can put to 0 the counter)
    • All the cards and their contents are synchronized with the localstorage.
    • The different states of the cards, according to the columns (To Do, In Progress, Done) are also synchronized with the localStorage.
    • You can delete only the project name or you can reset all things in the App (Project name, timer & all cards)

alt text


compatibility

Can I use Compatibility:

alt text

πŸ‘€ Author

  • Thought, designed and developed with πŸ’œ by Rodolphe Augusto

πŸ”· A few words from the author

Enjoy the World 😏

πŸ“ To Do for the next version:

πŸ“Š Add csv export.


πŸ’– Support the project

I put almost everything open-source I can, and try to accommodate anyone who needs help using these projects. Obviously, this takes time. You can use this service for free.

However, if you are using this project and are happy with it or just want to encourage me to keep creating: -

  • Put a star and share the project πŸš€

Thank you! ❀️


πŸ“œ License

MIT


My other projects:

My Simple Tutorial Creator

https://github.com/rodolphe37/my-simple-tutorial-creator

My Simple Cam

https://github.com/rodolphe37/my-simple-cam-dektop-app

My SimpleTasks Manager (software version for Linux, Mac & Windows)

https://github.com/rodolphe37/my-simple-tasks-manager-desktop-version

QRCode Tools

https://github.com/rodolphe37/qr-code-tools

App for decrypt greenPass europe QRcode

https://github.com/rodolphe37/qrcode-decoder

Css animation with Create React App base.

https://github.com/rodolphe37/halloween2021-bat-tuto-youtube-video

My GitHub "open Sources" project

https://github.com/rodolphe37/pwa-react-project

cra-template-github-my-profile

https://github.com/rodolphe37/cra-template-github-my-profile

My Awesome Custom Alert

https://github.com/rodolphe37/my-awesome-custom-alert

Geolocation starter app React-native

https://github.com/rodolphe37/react-native_geolocation-tracker

Classic React Ultimate Messenger version repository (for open sources contributors)

https://github.com/rodolphe37/rum-open-sources

React Ultimate Messenger template for React (create-react-app tools)

https://github.com/rodolphe37/cra-react-ultimate-messenger

PWA React Ultimate Messenger template for React (create-react-app tools)

https://github.com/rodolphe37/cra-pwa-react-ultimate-messenger

installation and initialization shell script for the PWA React Ultimate Messenger template

https://github.com/rodolphe37/pwa-rum-install-pack

Upload-image-profil-component

https://github.com/rodolphe37/Upload-image-profil-component

Jeux libres de droits "open Sources" - Memory Yoga Cards Game - Sort the Waste Game - Match 3 Yoga Game - Tetris Classic Game - Remake Earth Puzzle Game

https://github.com/rodolphe37/install-games-repository

Administration template - React JS & react-admin

https://github.com/rodolphe37/nfc-updates-front

Administration template Backend - Node & Express

https://github.com/rodolphe37/nfc-updates-back


About

License:MIT License


Languages

Language:JavaScript 78.2%Language:CSS 21.0%Language:HTML 0.9%