raghwendra-dey / productivity_meter Goto Github PK

@Raghwendra-Dey Sir, As of now there is no hovering state, active state stylings for the +1 -1 and Reset buttons.
I would like to add more styling to these buttons. Please assign me this issue :)

Thanks & Regards
Urvashi Anand

The difference timer is flickering sometimes, when both the timers are running at the same time, maybe because of very very small changes in consecutive difference measurements between the two clocks. It mainly visible on the Centiseconds part.
Let me know, if you have want some more explaination or any problems in coming up with a logic to get it done.

Add a boilerplate code for the TODO list segment of the site.

A boilerplate code is basically a overview code, without any logic or implementations. At most the boilerplate code would be containing function initializations, with the body of the function contains a comment explaining the work that function is supposed to do.

Also currently you can also add a simple tabular form of html for the TODO list, with a button and a heading. The function triggers of the buttons should be left empty, with only the required statement of the function.

Write a function which would print a message to the console.log when the time elapsed during the long break crosses the value set in the breakDur variable. Also you need to repeat the message after every 5 mins.
It would be like:

• print the message first time when the elapsed time crosses breakDur value.
• again print it next time after 5mins, again after 5mins.. and so on. untill the user starts both the timers once again, indicating, he is at work again. Its very similar to working of alarm clock and its snooze feature.

This is a part of the notification system of the notification system we are trying to develop.
Comment below if you need some more clarifications.
Make all the PRs related to this in the notification branch of this repo.

If anyone have worked with vector graphs softwares like Adobe Illustrator, Inkscape, etc, or maybe even photoshop or some drawing softwares, Or would like to learn them, and make something with it, then please design a cool logo for this project. The end user of this product are programmers like us, so keep this in mind while designing the logo. You can have a look here. But this article deals with posters, and not logos. For logos special consideration is that, it should be compact, since its generally small and have little scope for detailing.

Make a function which would play a notification sound, when both the timers are stopped, i.e. the user is on a long break and the elapsed time of long break crosses the time set in a global variable named breakDur given by #24 . You may need to start a new setInterval instance to keep track of this elapsed time between long breaks. Theres more of working with javascript in this issue. This is a part of the notification system of the notification system we are trying to develop.
Comment below if you need some more clarifications.
Make all the PRs related to this in the notification branch of this repo.

Make the quote to be something which cycles through a set of maybe 3-4 quotes(make the number of quotes, variable and easy to add any quote anytime). With each quote appearing and getting removed using typerwriter effect, after staying for sometime in the screen. You can take help from this repo for implementing it. The effect I am proposing is exactly similar showing in this repo. Don't forget to shuffle the list of quotes, after every iteration throughout the list.

Add a text field where user can enter a number and after that if the Set button is pressed, which is associated on it, this action would set the value of a global variable breakDur, to the entered value. This issue is the part of the notification system we are trying to implement.
You can have a look at the diagram below for better understanding:

• You need to work with html, for adding this block, and a bit of javascript to make the trigger function of the Set button.
• This is very similar to making a form which only contains a text field, with a submit button(here called Set button).
• Also add a data validation for the text field values, since we are only expecting number values, to be entered.
• If the entered value is not a number then you just don't do anything, and print an error message to the console.log like, Entered value should be a number.
• Default that variable value to 20 .
• Later on we can add a pop-up message to signify this error. This pop-up message thing would be taken care of by the #21 assignee.
• Don't worry much about the styling things, make it similar to the other blocks in the site. You can use there class. No need to mess around with the CSS for now.

Comment below if you need some more clarifications.
Make all the PRs related to this in the notification branch of this repo.

Currently the background of the page is very monotonous, with only one color. Design and implement a good looking background for the page. Before implementing please post a photograph or share the design idea of the background here, then start implementing.
Also make the site responsive for various devices.
You may use bootstrap for this.

I would like to add modern design to buttons using bootstrap to make UI look better.

There is no user guide or documentation of the saving and loading part of the timers and other data.

Right now, this app is focused on counting the number of problems a user solves in a time duration. But to widen the scope of this project we need something through which a user can also keep track of their other tasks.
So the idea is to have a To-do list which will help users track their pending tasks throughout the day.

Features of this Todo list -

1. Completion - A user should be able to cross out a task (It will still be shown in UI with a strikethrough line).
2. Deletion - A user should be able to remove a task from the UI itself.
3. Updation - A user should be able to update a task at any point of time.
4. (OPTIONAL) Problem counter could be synchronized with No. of task completed. For ex. If a user completes his/her task then there should be an automatic increment in No. of problems solved.

Note : It'd be better if the to-do list is in a 100 viewport height itself.

Add a Button Export to Keep in the ToDo list, which first ask the user about to login to his google account, and then create a new TODO list in his google keep.
Later, we can also add an optionn to import from Keep which imports any list in keep with checkboxes into this.

Follow these steps, to reproduce the error:

1. Switch on the second timer, keeping first one is still off
2. After that let the second timer to run for few seconds
3. Then first timer is switched on (which is internally coupled with the second timer, i.e. it switches on the second timer everytime it switches on itself and vice versa due to #3, but in this case this coupling is of no use, since the second timer is already running),
4. And after this event, the second timer loses control, i.e. after this event you can't switch off or clear, or do anything with the second timer, which is a bug. Try to switch off the second timer now, it won't switch off.

Anyhow, after resolving #4, this bug would be gone, but i doubt that this thing might be due to some other logic fault which might pop up later, so better to remove it now only.

As shown in the picture, there is horizontal scroll bar, which was not there. Its because of the width given to the footer. I will work on this issue @Raghwendra-Dey Sir. Please assign it to me.

Write a JS function which plays a notification sound, whenever it is called. There should not be any controller of this sound to stop it or anything, it should work like an alarm clock tone.
This would be integrated for the notification system.
Comment below if you need some more clarifications.
Make all the PRs related to this in the notification branch of this repo.

When an entry is checked in its checkbox, then it gets striked off, but if the user unchecks that entry later, it doesn't gets unstricked.
Also, if the textbox is empty, and it is tried to be ticked, then it should simply do nothing, rather than stricking the background text Enter TaskName. Please make necessary amendments.

@Raghwendra-Dey
Press GO of the time devoted option . wait for a few seconds and now stop the actual time used and the time devoted.
Now , press clear on the time devoted. The time on actual time used should also be cleared. However , this does not happen and I want to fix this bug.

• The repository is missing necessary code of conduct file.

there is no property like style.

We can let a pop-up message to appear whenever there will be any increment/decrement in the number of problems solved. This pop-up message can be featured to fade away automatically after a certain duration of time, say 5 sec.
For increment we can use "Well done ! keep it up!" , and for decrement "Oops! you've got an extra problem to solve!".

Steps to reproduce the error:

• press +1 button more than once(twice or thrice or ..) consecutively, without giving the pop-up time to fade away.
• Now, before it getting fade away, press the cross button on the pop-up.
• Now, if you again press the +1 button any number of times, the pop-up for that wont function.

P.S: this is with all the four pop-ups, so the steps would be same, just replace the name of the button.

For setting a basic layout, we will have to start from adding the top most thing a website requires for sure- A Navbar.

Merge the work done in the localStorage branch into the master branch

Insert the logo before the productivity_meter text in the navbar. Try out both of the logos in the assets folder of the main repo:master, and post screenshots of how it looks, then we would decide later, which one to pick.

Currently the avg time/problem, is updated only when the +1 button, is pressed, but it doesn't do anything, when the -1 button is pressed. The problem was to save the delta time changes in the past problems, may blow up memory. But we may use a double ended Queue based solution for subtraction of one problem from the problem counter, and still showing the correct average time per problem. And keeping a max_capacity variable, and keep it to something like, 100, so, its highly unlikely, that a user would press -1 consecutively 100 times, And if the size of the deque becomes greater than the max_capacity, then pop-out elements from the front(which are the least recently used ones).
When the user presses -1 you would pop-out elements from the back, which are the recent time delta, and update the average accordingly, using that value.
If the deque is empty, then you may, do nothing. Later on we can implement a pop-up warning for the user, that decreasing problem count further might result in faulty avg time.

currently the Todo list cross button has no styling. Also the dimentions of the entries looks very odd, its too big. Also, the checkbox is too small. Correct these things, and give it a decent dimentions, along with styling it.

As there is no pressing and hovering effect on the Record button(would be introduced after #20 ) yet, so add some hovering effects so that it will look like to be pressed when pressed.

In Real world Projects, we should avoid inline styling. Although we have given id here so we can do styling using id selector in style.css file. One more thing = is not meaningful class name. We should give some meaning classname.

Add a new block, maybe similar in look with the two timers, with Hours Minutes Seconds Centiseconds sections, placed in between the two timers, to show the difference between the two timers, i.e. Time Devoted - Actual Time Used.
No need to handle the case of negative result, since that is a bug and would be fixed after #4 is fixed.
Keep in mind to orient the styling of the blocks accordingly while placing the difference block in between. You may need to tweak with the CSS a bit, and also change the positioning of the blocks. You may first draw your styling ideas, in some drawing software and we may discuss upon that, and then you may proceed for implementation.

This project is not made with keeping responsiveness in mind. And thus the view of this project in mobile phones is not that good. Make it responsive to be able to use in mobile phones as well with same ease. Also if you have a good sense of designing then do consider to give it some more styling to improve the look.

While calculating average, the thing that's going on now is that the previous average and the present number of problems are being used.

For better understanding this issue, do the following:

• First press the record button, add two tasks in six seconds, then stop recording
• Now add three more tasks
• Press record now again and add one task in six seconds
• Now stop the recording

If worked in a proper way the average has to be shown as (6 + 6) / 3 = 4s as only 3 problems have been done in 12 s recorded window , but what's happening is that (3[The previous avg]*5[No:of problems just before] + 6[New time] ) / 6[New count] = 3.5s

Look into the issue....

As of now, there is no hovering effect on the buttons. So, I would like to add hovering effect. I am thinking of adding some transformation from low scale to high. It will look good. Please assign this issue to me @Raghwendra-Dey Sir.

Thanks & Regards
Urvashi Anand

After #86 we can remove a problem, and thats taken time would be removed but theres some miscalculation due to this.
Follow these steps for reproducing the bug: (wait for suitable time according to your approximations)

• do +1 to get avg of around 2 secs
• then do +1 to make the avg 3-4 secs
• then do +1 to make the avg 4-5 secs
• then remove do a -1, you should get avg to be 3-4 secs(prev value)
• then again do -1 untill you get avg 0.
• then do a +1 immediately after you have done the last -1 which made the avg 0.
• you would see a much larger avg than expected. Since you have done the last +1 immediately, it should have shown you a much smaller value(like maybe 0/1).

I think this is something to do with accumulation of all the previous times(I mean all the +1's you did before all those times are getting added up). Maybe the starting time used during finding the time difference is not getting updated or maybe theres some variable which is also getting restored to the previous value which shouldn't have been.

Id is unique. We can't give multiple ids to an element OR same id for multiple elements.
One more little thing I would like to mention is if it is centiseconds instead of miliseconds use cs instead of ms.

I would like to work on this issue !! @Raghwendra-Dey Sir !!

Include the text of each block to include it. Try to also introduce a bit of bootstrap into the site with it, to give it responsiveness. Position the three blocks in the same row with the difference block in the middle, the Time Devoted on the right and Actual Time Used to the right of it.

At present the project has many cool features and many more would come. But it will never be that cool and efficient for the user, when the software keeps track on the history and analysis of the tasks he has completed. So it would be a good idea to add a feature that stores all such data.

Also it would be nice if the data can also be handled by the user such as deleting and many more actions such as downloading, analysing the whole time he has used with this.

Make buttons more stylish and while clicking them it should look like we are pressing a real button.They should come up while hover and should go inside when pressed giving a feel like it is actually getting pressed.

Bind start and stop of Time Devoted to the Actual Time Used so that whenever Time Devoted timer starts/stops it automatically does the same thing with Actual Time Used timer. But don't confuse it with the vice-versa of binding second with the first.

Instead of adding ❤️ directly in index.html we should use <i class="fas fa-heart"></i>

I am working on this issue @Raghwendra-Dey Sir.

Add a contributors section in the readme using all-contributors specification. You can take help from this repo. The section needed is exactly similar to this.

Currently the problem counter block's height is very odd, with unnecessary spaces here and there. Please make remove the unncessary spaces, and make the Problems Count: {number} to come in a singe line rather than in two lines. Please consider testing of being in single line even with numbers >100.
By removing unncessary spaces, I mean, reduce the space between the buttons and the text. And also you can yourself judge and tinker around with the dimentions, and see which fits best.

Make the Scrollbar of ToDo list only appear when its required, i.e. when the number of entries overflows the visible height of the list.

Basically for the count of the problems i added an extra button in place where reset currently is. And placing the reset button down the black area just like we have the Go button below the timer box. Apart from this I also thought of adding a sound effect on clicking the button Go and after clicking Stop just the way stopwatches have. And similarly , there can be a heading at the top(with an iconic name) and an image beside sort of an icon may be.
And yes a link at last with the manual page linked to it so that someone new can read the rules to operate it by clicking it.
Other issues which came to my mind are like having a data box showing the number of users who are using it per day and an option fir the users to rate the work.
I am very curious to contribute to this project if you assign me these issues.

We can add a footer in the website, so that we get a defined base of the webpage. Also adding footer will increase the beauty of the page.

As the project is aimed at increasing productivity in problem solving, approximate idea of time spent per problem will help in increasing the speed of problem solving.
So the idea is to display the average time spent per problem whenever clear or reset button is pressed, as a message.
When no problem is solved in the previous session then accordingly message can be provided.

Since, it is logical that the second timer wont run when the first one is stopped. So enforce a check while starting the second timer and only do so if the first timer is already running.