Timer-JavaScript/index.js at main · mahmoudfarahat/Timer-JavaScript · GitHub

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


const durationInput = document.querySelector('#duration');
const startButton = document.querySelector('#start');
const pauseButton = document.querySelector('#pause');

const circle = document.querySelector('circle')

const perimter = circle.getAttribute('r') * 2 * Math.PI
circle.setAttribute('stroke-dasharray',perimter)

let duration;

const timer = new Timer(durationInput, startButton, pauseButton ,{
    onStart(totalDuration){
            console.log('Timer started');
            duration = totalDuration
    },
    onTick(timeRemaing ){
        console.log('Timer just ticked down');

        circle.setAttribute('stroke-dashoffset',
            perimter * timeRemaing / duration - perimter

         )

    },
    onComplete(){
        console.log('Timer is completed');

    }
})