forked from swapnilsparsh/30DaysOfJavaScript
-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathscript.js
More file actions
44 lines (37 loc) · 1.29 KB
/
Copy pathscript.js
File metadata and controls
44 lines (37 loc) · 1.29 KB
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
const fig = document.getElementById("fig");
const timeTaken = document.getElementById("timeTaken");
let start = new Date().getTime();
// Function to change color of the figure
const figureColor = () => {
const colorArray = '0123456789ABCDEF';
let hash = '#';
for (let i = 0; i < 6; i++) {
hash += colorArray[Math.floor(Math.random() * 16)];
}
fig.style.backgroundColor = hash;
}
// Function to change the figure position
const figurePosition = (top, left) => {
fig.style.top = `${top}%`;
fig.style.left = `${left}%`;
fig.style.transform = `translate(-50%, -50%)`;
}
// Function to change the figure shape
const figureShape = (size) => {
start = new Date().getTime();
const choice = Math.floor(Math.random() * 2);
fig.style.width = `${size}px`;
fig.style.height = `${size}px`;
fig.style.borderRadius = choice == 0 ? "50%" : "0";
}
// Event listener to change the figure properties once it is clicked
fig.addEventListener("click", () => {
const end = new Date().getTime();
timeTaken.innerHTML = (end - start) / 1000;
const top = Math.floor(Math.random() * 100);
const left = Math.floor(Math.random() * 100);
const size = Math.floor(Math.random() * 100) + 50;
figurePosition(top, left);
figureShape(size);
figureColor();
});