-
Notifications
You must be signed in to change notification settings - Fork 0
/
timer.js
59 lines (58 loc) · 1.86 KB
/
timer.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
// Create class
class Timer{
constructor(duraInput, startBtn, pauseBtn, callbacks){
this.duraInput = duraInput;
this.startBtn = startBtn;
this.pauseBtn = pauseBtn;
// this here ~ to startBtn, take callback functions as its
if (callbacks){
this.onStart = callbacks.onStart;
this.onTick = callbacks.onTick;
this.onComplete = callbacks.onComplete;
}
this.startBtn.addEventListener('click', this.start);
this.pauseBtn.addEventListener('click', this.pause);
this.isStarted = false;
}
// Getter and Setter
get timeRemaining(){
return parseFloat(this.duraInput.value);
}
set timeRemaining(time){
// Round the input displayed value to 2 decimals
this.duraInput.value = time.toFixed(2);
}
start = () => { // funciton triggered by button
// Event onStart()
if(this.onStart){
this.onStart();
}
this.tick();
this.interval = setInterval(this.tick, 100); // declare var interval as an id
this.startBtn.disabled = true;
this.pauseBtn.disabled = false;
this.duraInput.disabled = true;
}
tick = () => {
// Calling set and get doesnt have () and with format `this.(getfunc or setfunc)`
if (this.timeRemaining <= 0){
this.pause();
if(this.onComplete){
this.onComplete();
}
}
else{
this.timeRemaining = this.timeRemaining - .1; // use .1 for running smoothly
// Event onTick
if (this.onTick){
this.onTick();
}
}
}
pause = () => {
clearInterval(this.interval);
this.startBtn.disabled = false;
this.pauseBtn.disabled = true;
this.duraInput.disabled = false;
}
}