Streak Counter

static/js/script.js

@@ -34,6 +34,38 @@ function getPastDates(days) {
     return dates;
 }
 
+function calculateStreak(completedDates) {
+    if (!completedDates || completedDates.length === 0) {
+        return 0;
+    }
+    
+    // Sort dates in descending order (newest first)
+    const sortedDates = completedDates.sort((a, b) => new Date(b) - new Date(a));
+    const today = getCurrentDate();
+    
+    let streak = 0;
+    let currentDate = new Date();
+    
+    // Check if today is completed, if not, start from yesterday
+    if (!sortedDates.includes(today)) {
+        currentDate.setDate(currentDate.getDate() - 1);
+    }
+    
+    // Count consecutive days backwards from today (or yesterday)
+    while (true) {
+        const dateStr = `${currentDate.getFullYear()}-${String(currentDate.getMonth() + 1).padStart(2, '0')}-${String(currentDate.getDate()).padStart(2, '0')}`;
+        
+        if (sortedDates.includes(dateStr)) {
+            streak++;
+            currentDate.setDate(currentDate.getDate() - 1);
+        } else {
+            break;
+        }
+    }
+    
+    return streak;
+}
+
 async function fetchHabits() {
     try {
         const response = await fetch('/habits');
@@ -95,6 +127,23 @@ function renderHabits(habits) {
         });
         habitItem.appendChild(dateGrid);
 
+        // Streak Counter hinzufügen
+        const streakContainer = document.createElement('div');
+        streakContainer.className = 'streak-container';
+        
+        const flameIcon = document.createElement('span');
+        flameIcon.className = 'flame-icon';
+        flameIcon.innerHTML = '🔥'; // Flammen-Emoji
+        
+        const streakCount = document.createElement('span');
+        streakCount.className = 'streak-count';
+        const currentStreak = calculateStreak(habit.completed_dates);
+        streakCount.textContent = `${currentStreak} Tag${currentStreak !== 1 ? 'e' : ''}`;
+        
+        streakContainer.appendChild(flameIcon);
+        streakContainer.appendChild(streakCount);
+        habitItem.appendChild(streakContainer);
+
         habitListDiv.appendChild(habitItem);
     });
 }