forked from PriyaGhosal/BuddyTrail
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Revert "updated ui of stars rate me buttons"
1 parent
ce74cc7
commit 797683d
Showing
4 changed files
with
26 additions
and
54 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,36 +1,9 @@ | ||
| document.addEventListener('DOMContentLoaded', () => { | ||
| const starContainer = document.querySelector('.star-rating'); | ||
| const stars = document.querySelectorAll('.star'); | ||
| const showValue = document.querySelector('#rating-value'); | ||
| let star = document.querySelectorAll('input'); | ||
| let showValue = document.querySelector('#rating-value'); | ||
|
|
||
| if (!starContainer) { | ||
| console.error('Star rating container not found'); | ||
| return; | ||
| } | ||
|
|
||
| if (!stars.length) { | ||
| console.error('No star rating inputs found'); | ||
| return; | ||
| } | ||
|
|
||
| if (!showValue) { | ||
| console.error('Rating value display element not found'); | ||
| return; | ||
| } | ||
|
|
||
| starContainer.addEventListener('change', (event) => { | ||
| if (event.target.matches('input')) { | ||
| const selectedRating = event.target.value; | ||
| console.log('Selected rating:', selectedRating); | ||
|
|
||
| showValue.textContent = `You rated this ${selectedRating} star${selectedRating !== '1' ? 's' : ''}`; | ||
|
|
||
| // Update visual state of stars | ||
| stars.forEach((star) => { | ||
| star.checked = star.value <= selectedRating; | ||
| }); | ||
| } | ||
| for(let i = 0; i < star.length; i++) { | ||
| star[i].addEventListener('click', function() { | ||
| let selectedRating = this.value; | ||
| showValue.innerHTML = selectedRating; // Only show the rating value | ||
| }); | ||
|
|
||
| console.log('Star rating initialization complete'); | ||
| }); | ||
| } |