-
Notifications
You must be signed in to change notification settings - Fork 0
/
script.js
32 lines (27 loc) · 884 Bytes
/
script.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
const starsEl = document.querySelectorAll(".fa-star");
const emojisEl = document.querySelectorAll(".fa-regular");
const colors = ["red", "orange", "lightblue", "lightgreen", "green"];
const button = document.querySelector(".button");
let rate = 1;
const updateRating = function (index) {
rate = index + 1;
starsEl.forEach((starEl, id) => {
if (id < index + 1) starEl.classList.add("active");
else starEl.classList.remove("active");
});
emojisEl.forEach((emojiEl) => {
emojiEl.style.transform = `translateX(-${index * 50}px)`;
emojiEl.style.color = colors[index];
});
};
updateRating(0);
starsEl.forEach((starEl, index) => {
starEl.addEventListener("click", () => {
updateRating(index);
});
});
button.addEventListener("click", () => {
console.log(`Rating : ${rate}`);
rate = 1;
updateRating(0);
});