The Pomodoro Technique is a time management method developed by Francesco Cirillo in the late 1980s. The technique uses a timer to break down work into intervals, traditionally 25 minutes in length, separated by short breaks. -from Wikipedia's article
Pomodoro.js allows you to visualize the above technic in your browser.
You only need to use the Pomodoro.js file from this project.
or via
git clone https://github.com/GeorgeGks/Pomodoro.js.git
Create a new class instance and fill the output object keys with the ids (or classes) of the html elements you want the time to be shown.
var Pclock = new PomodoroClock({
'hoursOutput': '#hours',
'minutesOutput': '.minutes',
'secondsOutput': '#seconds'
});
You can fill only some of the above values. So if you want to show only minutes you do the following:
var Pclock = new PomodoroClock({
'minutesOutput': '.minutes'
});
To start the timer with the default values type:
Pclock.start();
This will start a countdown clock with one working period of 25 minutes following by a break of 5 minutes.
If you want to reset the timer to zero in the middle of the process use the bellow line:
Pclock.reset();
The power of this library lies in the customization of the clock parameters. You can start a custom clock like this:
Pclock.start({
'workingTime': 25,
'shortBreakTime': 5,
'longBreakTime': '15',
'repeats': 1,
'repeatsUntilLongBreak': '4'
});
Note that the above values are represent minutes and should be numbers or string numbers. Also the above values are the default values of the clock. You can also not use all the fields.
Let's say we want to change only the short break time to 10 minutes. We type:
Pclock.start({
'workingTime': '',
'shortBreakTime': 10
});
The other values left untouched so the result would be a 25 time work and 10 time break for one repeat.
Also note that if we pass an empty string, the program it uses the default value (useful for html input fields that are left bank).
You can pass a callback function in the .start()
method:
Pclock.start(function() {
alert('The lock has finished');
});
The above example will run a default clock and will alert a message on end.
Copyright (c) 2016 George G. Gkasdrogkas Licensed under the MIT license.