diff --git a/README.md b/README.md index 87e893a..4e03da2 100644 --- a/README.md +++ b/README.md @@ -8,11 +8,16 @@ Objective : Make a timer in JavaScript - **Download** the repository and **execute** the `index.htm` file in your navigator -- To set time, you need to edit the url and add `?time=` - Example : - - ```url - https://lucasvbr.github.io/javascript-timer/index.htm?time=500 - ``` - +- To set time, you need to add parameters in the URL : + URL syntax : `?[param1]&[param2]&[...]` + Parameter syntax : `=` + - Differents `type` : `seconds`, `minutes` and `hours` + If there is not parameters : **5 minutes** are in the timer by default + (There is no order for parameters) + + Example : + + ```url + https://lucasvbr.github.io/javascript-timer/index.htm?hours=10&minutes=10&seconds=10 + ``` diff --git a/index.htm b/index.htm index 54ba83a..a8ba3b2 100644 --- a/index.htm +++ b/index.htm @@ -8,6 +8,8 @@

+ + \ No newline at end of file diff --git a/js/main.js b/js/main.js index b661f40..6286be0 100644 --- a/js/main.js +++ b/js/main.js @@ -1,28 +1,19 @@ -var htmlTimer = document.getElementById("timer"); +/* HTML contents */ +var timerHTML = document.getElementById("timer"); -var timer = setInterval(timerLoop, 1000); +/* GET url variable */ const queryString = window.location.search; const urlParams = new URLSearchParams(queryString); -let time = parseInt(urlParams.get('time')) +time = getTimeUrl(); +/* Set the timer */ +let timer = new Timer(time) -function timerLoop() { - htmlTimer.innerHTML = convertSecMin(time); - time--; - if(time < 0) { - clearInterval(timer) - htmlTimer.style.color = "red"; +let localTimer = setInterval(() => { + timerHTML.innerHTML = timer.toString(); + timer.decrement(); + if(timer.getTime() < 0) { + clearInterval(localTimer); + timerHTML.style.color = "red"; } -} - -function convertSecMin(value) { - let seconds = Math.floor(value % 60); - let minuts = Math.floor(value / 60); - return `${convertDigits(minuts)}:${convertDigits(seconds)}` -} - -function convertDigits(number) { - return number.toLocaleString('en-US', { - minimumIntegerDigits : 2, - useGrouping : false}); -} \ No newline at end of file +}, 1000); \ No newline at end of file diff --git a/js/timer.js b/js/timer.js index 605c49a..43617a9 100644 --- a/js/timer.js +++ b/js/timer.js @@ -1,5 +1,3 @@ -// NOT USED CURRENTLY - class Timer { /** @@ -8,32 +6,39 @@ class Timer { * @throws TypeError if time is not a positive Integer */ constructor(time) { - if (!isValid(time)) throw new TypeError(`${time} n'est pas un entier valide`); + if (!Number.isInteger(time) && time <= 0) + throw new TypeError(`${time} is not valid`); this.time = time; } - /** - * Predicate that show if the value of the timer is correctly set - * @param {int} valueTest - * @return True if the predicate is verified - * False else + * Show the timer in a String version + * in the format hh:mm:ss */ - isValid(valueTest) { - return Number.isInteger(valueTest) && valueTest > 0 + toString() { + function formatDigits(number) { + return number.toLocaleString('en-US', { + minimumIntegerDigits : 2, + useGrouping : false} + ); + } + + let hours = Math.floor(this.time / 3600); + let minuts = Math.floor(this.time / 60) - hours * 60; + let seconds = Math.floor(this.time % 60); + + return `${formatDigits(hours)}:` + + `${formatDigits(minuts)}:` + + `${formatDigits(seconds)}` } - /** - * @return the current time - */ + /** Decrement the value of the current time */ + decrement() { + this.time-- + } + + /** @returns the current time */ getTime() { - return this.time - } - - /** - * Make start the timer - */ - startTimer() { - setTimeout(this.time--, 1000) + return this.time; } } \ No newline at end of file diff --git a/js/url.js b/js/url.js new file mode 100644 index 0000000..b3a5c0b --- /dev/null +++ b/js/url.js @@ -0,0 +1,18 @@ +function getTimeUrl() { + let time = 0; + + if (!urlParams.has('seconds') + && !urlParams.has('minutes') + && !urlParams.has('hours')) { + time = 300 + } else { + if (urlParams.has('seconds')) + time += parseInt(urlParams.get('seconds')); + if (urlParams.has('minutes')) + time += parseInt(urlParams.get('minutes')) * 60; + if (urlParams.has('hours')) + time += parseInt(urlParams.get('hours')) * 3600; + } + + return time; +} \ No newline at end of file