add conditional color

src/pages/tick/v1.astro

@@ -131,24 +131,34 @@ import Layout from "../../layouts/Layout.astro";
     };
 
     function saveUserData() {
-        // Get checkbox values
-        const checkboxValues = {
-            a1: document.getElementById('a1').checked,
-            a2: document.getElementById('a2').checked,
-            a3: document.getElementById('a3').checked,
-            a4: document.getElementById('a4').checked,
-            a5: document.getElementById('a5').checked,
-            a6: document.getElementById('a6').checked,
-        };
-        console.log(checkboxValues)
+         // Get checkbox values and corresponding elements
+        const checkboxes = ['a1', 'a2', 'a3', 'a4', 'a5', 'a6'];
+        const checkboxValues = checkboxes.map(id => {
+            const checkbox = document.getElementById(id);
+            const element = document.getElementById('image' + id.slice(-1));
+            return {
+                id: id,
+                checked: checkbox.checked,
+                element: element
+            };
+        });
+
+        // Count points based on checkbox values and "greenBorder" class
+        let totalPoints = 0;
+        checkboxValues.forEach(checkbox => {
+            if (checkbox.checked && checkbox.element.classList.contains('greenBorder')) {
+                totalPoints += 1;
+            }
+        });
+
         // Move the userData object creation inside the saveUserData function if needed
         let userData = {
-        'user': 'tick-v1@beanstalkedu.com',
-        'game_name': gameName,
-        'starts': formatedDateTime,
-        'game_start' : gameStartTime,
+            'user': 'tick-v1@beanstalkedu.com',
+            'game_name': gameName,
+            'starts': formatedDateTime,
+            'score': totalPoints, // Include the totalPoints in the userData
         };
-
+        console.log(userData);
         fetch(`https://2016.dev2-cs.siliconpin.com/save/`, {
             method: 'POST',
             headers: {
@@ -168,6 +178,7 @@ import Layout from "../../layouts/Layout.astro";
             });
     }
 
+
     document.addEventListener('DOMContentLoaded', function () {
         const contactForm = document.getElementById('contactForm');
         contactForm.addEventListener('submit', async function (event) {