Revert "updated ui of stars rate me buttons"

tarunkumar2005 · Oct 9, 2024 · 797683d · 797683d
1 parent ce74cc7
commit 797683d
Showing 4 changed files with 26 additions and 54 deletions.
diff --git a/index.html b/index.html
@@ -1,6 +1,6 @@
 <!DOCTYPE html>
 <html lang="en">
-<head>
+  <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <meta
@@ -712,22 +712,17 @@ <h2>Rate your experience</h2>
             <label for="destination">Destination/Service:</label>
             <input type="text" id="destination" name="destination" required />
 
-            <label>Rating:</label>
-            <div class="rating-container">
-              <div class="star-buttons">
-                <button type="button" class="star-btn" data-rating="5">☆</button>
-                <button type="button" class="star-btn" data-rating="4">☆</button>
-                <button type="button" class="star-btn" data-rating="3">☆</button>
-                <button type="button" class="star-btn" data-rating="2">☆</button>
-                <button type="button" class="star-btn" data-rating="1">☆</button>
-              </div>
-              <input type="hidden" id="rating" name="rating" required>
-              <div id="rating-value">0</div>
-            </div>
+            <label for="rating">Rating:</label>
+            <select id="rating" name="rating">
+              <option value="5">⭐⭐⭐⭐⭐</option>
+              <option value="4">⭐⭐⭐⭐</option>
+              <option value="3">⭐⭐⭐</option>
+              <option value="2">⭐⭐</option>
+              <option value="1">⭐</option>
+            </select>
 
             <label for="review">Your Review:</label>
             <textarea id="review" name="review" rows="4" required></textarea>
-
             <label for="complaint">Complaint (if any):</label>
             <textarea id="complaint" name="complaint" rows="3"
               placeholder="Describe any issue with the staff here. Please explain every single detail ex:location,name of the person"></textarea>

diff --git a/project-structure.md b/project-structure.md
@@ -3,9 +3,6 @@
 ├── Code_of_Conduct.md
 ├── README.md
 ├── RatingStyle.css
-├── auth.css
-├── auth.html
-├── auth.js
 ├── book.html
 ├── boy.png
 ├── chatbot.gif
@@ -29,9 +26,14 @@
 │   ├── logo2.png
 │   └── new-york-page.png
 ├── index.html
+├── login.css
+├── login.html
+├── login.js
 ├── project-structure.md
 ├── project_structure.txt
 ├── script.js
+├── signUp.css
+├── signUp.html
 ├── star-rating.js
 └── style.css
 ```

diff --git a/project_structure.txt b/project_structure.txt
@@ -1,9 +1,6 @@
 ├── Code_of_Conduct.md
 ├── README.md
 ├── RatingStyle.css
-├── auth.css
-├── auth.html
-├── auth.js
 ├── book.html
 ├── boy.png
 ├── chatbot.gif
@@ -27,8 +24,13 @@
 │   ├── logo2.png
 │   └── new-york-page.png
 ├── index.html
+├── login.css
+├── login.html
+├── login.js
 ├── project-structure.md
 ├── project_structure.txt
 ├── script.js
+├── signUp.css
+├── signUp.html
 ├── star-rating.js
 └── style.css
diff --git a/star-rating.js b/star-rating.js
@@ -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');
-});
+}