Update index.html

index.html

@@ -19,7 +19,6 @@
     * { margin: 0; padding: 0; box-sizing: border-box; }
     
     body { 
-        /* Added a slight radial gradient for depth */
         background: radial-gradient(circle at center, #161618 0%, #050506 100%);
         color: #fff; 
         font-family: 'Space Grotesk', sans-serif; 
@@ -28,7 +27,6 @@
         overflow-x: hidden;
     }
 
-    /* Subtle dot overlay remains for texture */
     body::before {
         content: "";
         position: fixed;
@@ -77,7 +75,6 @@
         box-shadow: 0 0 20px var(--glow);
     }
 
-    /* Grid with high spacing */
     .exams-grid { 
         display: grid; 
         grid-template-columns: repeat(auto-fill, minmax(500px, 1fr)); 
@@ -86,13 +83,11 @@
         perspective: 1000px; 
     }
 
-    /* 4x3 Rectangular Card */
     .brushed-plate { 
         position: relative; 
         background: rgba(13, 13, 15, 0.8); 
         border: 1px solid var(--etch); 
         padding: 45px;
-        /* Smoother transition for a "lil bit" of movement */
         transition: transform 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94), border-color 0.3s, box-shadow 0.3s;
         cursor: pointer;
         aspect-ratio: 4 / 3; 
@@ -108,7 +103,6 @@
         box-shadow: 0 15px 40px rgba(0,0,0,0.7), 0 0 10px var(--glow);
     }
 
-    /* Flat content (No float) */
     .card-content {
         height: 100%;
         display: flex;
@@ -159,7 +153,6 @@
     }
     .del:hover { color: #ff4b2b; }
 
-    /* Modals */
     .modal { 
         display: none; position: fixed; inset: 0; 
         background: rgba(0,0,0,0.95); z-index: 100; 
@@ -245,6 +238,23 @@
         onValue(examsRef, (snapshot) => {
             const data = snapshot.val();
             dataStore = data ? Object.entries(data).map(([id, v]) => ({ id, ...v })) : [];
+
+            // --- AUTO DELETE LOGIC START ---
+            const today = new Date();
+            today.setHours(0,0,0,0); // Normalize 'today' to midnight
+
+            dataStore.forEach(exam => {
+                const examDate = new Date(exam.date);
+                examDate.setHours(0,0,0,0); // Normalize exam date to midnight
+
+                // If exam date is strictly LESS than today (meaning yesterday or older)
+                if (examDate.getTime() < today.getTime()) {
+                    console.log(`Auto-deleting expired node: ${exam.name}`);
+                    remove(ref(database, `exams/${exam.id}`));
+                }
+            });
+            // --- AUTO DELETE LOGIC END ---
+
             render();
         });
 
@@ -255,8 +265,9 @@
                 const target = new Date(e.date); target.setHours(0,0,0,0);
                 const diff = Math.ceil((target - now) / 86400000);
                 
-                let val = diff < 0 ? 'OK' : diff;
-                let label = diff < 0 ? 'MISSION_COMPLETE' : (diff === 1 ? 'CYCLE_REMAINING' : 'CYCLES_REMAINING');
+                // Since auto-delete removes negatives, we just handle 0 (Today) and positives
+                let val = diff === 0 ? 'NOW' : diff;
+                let label = diff === 0 ? 'CRITICAL_EVENT' : (diff === 1 ? 'CYCLE_REMAINING' : 'CYCLES_REMAINING');
 
                 return `
                 <div class="brushed-plate" onmousemove="tilt(event, this)" onmouseleave="resetTilt(this)" onclick="showSyll('${e.id}')">
@@ -273,18 +284,14 @@
             }).join('');
         }
 
-        // --- SUBTLE Tilt Logic ---
         window.tilt = (e, card) => {
             const rect = card.getBoundingClientRect();
             const x = e.clientX - rect.left;
             const y = e.clientY - rect.top;
             const centerX = rect.width / 2;
             const centerY = rect.height / 2;
-            
-            // Increased divisor (50 instead of 15) for very minimal movement
             const rotateX = (y - centerY) / 50;
             const rotateY = (centerX - x) / 50;
-            
             card.style.transform = `rotateX(${rotateX}deg) rotateY(${rotateY}deg)`;
         };
 
@@ -296,6 +303,7 @@
 
         window.showSyll = (id) => {
             const e = dataStore.find(x => x.id === id);
+            if (!e) return; // Prevent error if item was just auto-deleted
             document.getElementById('syllTitle').innerText = `NODE_STREAM: ${e.name}`;
             document.getElementById('syllArea').value = e.syllabus || '';
             document.getElementById('syllId').value = id;