lucasvbr/timer
1
0
Fork 0
mirror of https://github.com/LucasVbr/timer.git synced 2026-05-13 17:22:04 +00:00
Code Issues Packages Projects Releases Wiki Activity

Refactor in POO

Browse Source
This commit is contained in:
Tchi
2021-07-04 16:09:20 +02:00
parent fa0a0fc1aa
commit ae62ecc4bd
5 changed files with 71 additions and 50 deletions
Download Patch File Download Diff File Expand all files Collapse all files
README.md
+12 -7
View File
@@ -8,11 +8,16 @@ Objective : Make a timer in JavaScript
- **Download** the repository and **execute** the `index.htm` file in your navigator - **Download** the repository and **execute** the `index.htm` file in your navigator
- To set time, you need to edit the url and add `?time=<number_of_seconds>` - To set time, you need to add parameters in the URL :
Example : URL syntax : `<URL>?[param1]&[param2]&[...]`
Parameter syntax : `<type>=<value>`
```url
https://lucasvbr.github.io/javascript-timer/index.htm?time=500
```
- 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
```
index.htm
+2
View File
@@ -8,6 +8,8 @@
</head> </head>
<body> <body>
<p id="timer"></p> <p id="timer"></p>
<script src="./js/url.js"></script>
<script src="./js/timer.js"></script>
<script src="./js/main.js"></script> <script src="./js/main.js"></script>
</body> </body>
</html> </html>
js/main.js
+13 -22
View File
@@ -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 queryString = window.location.search;
const urlParams = new URLSearchParams(queryString); const urlParams = new URLSearchParams(queryString);
let time = parseInt(urlParams.get('time')) time = getTimeUrl();
/* Set the timer */
let timer = new Timer(time)
function timerLoop() { let localTimer = setInterval(() => {
htmlTimer.innerHTML = convertSecMin(time); timerHTML.innerHTML = timer.toString();
time--; timer.decrement();
if(time < 0) { if(timer.getTime() < 0) {
clearInterval(timer) clearInterval(localTimer);
htmlTimer.style.color = "red"; timerHTML.style.color = "red";
} }
} }, 1000);
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});
}
js/timer.js
+26 -21
View File
@@ -1,5 +1,3 @@
// NOT USED CURRENTLY
class Timer { class Timer {
/** /**
@@ -8,32 +6,39 @@ class Timer {
* @throws TypeError if time is not a positive Integer * @throws TypeError if time is not a positive Integer
*/ */
constructor(time) { 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; this.time = time;
} }
/** /**
* Predicate that show if the value of the timer is correctly set * Show the timer in a String version
* @param {int} valueTest * in the format hh:mm:ss
* @return True if the predicate is verified
* False else
*/ */
isValid(valueTest) { toString() {
return Number.isInteger(valueTest) && valueTest > 0 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)}`
} }
/** /** Decrement the value of the current time */
* @return the current time decrement() {
*/ this.time--
}
/** @returns the current time */
getTime() { getTime() {
return this.time return this.time;
}
/**
* Make start the timer
*/
startTimer() {
setTimeout(this.time--, 1000)
} }
} }
js/url.js
+18
View File
@@ -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;
}