Fixed calendar statistic calculations / json file locations adjusted

Author: paviro

Cargo.toml

@@ -1,6 +1,6 @@
 [package]
 name = "koshelf"
-version = "1.0.12"
+version = "1.0.14"
 description = "Transform your KOReader library into a beautiful reading dashboard with statistics."
 repository = "https://github.com/paviro/KOShelf"
 license = "EUPL-1.2 license"

README.md

@@ -209,14 +209,19 @@ site/
     │   ├── calendar.js     # Calendar functionality
     │   ├── heatmap.js      # Activity heatmap visualization
     │   └── event-calendar.min.js # Event calendar library
-    └── json/               # Statistics data (when available)
-        ├── week_0.json     # Weekly statistics data
-        ├── week_1.json
-        ├── ...
-        ├── calendar_data.json # Calendar events and book data
-        ├── daily_activity_2023.json # Daily activity data for heatmap
-        ├── daily_activity_2024.json
-        └── ...
+    └── json/               # Data files (when available)
+        ├── calendar/           # Calendar data split by month
+        │   ├── available_months.json # List of months with calendar data
+        │   ├── 2024-01.json   # January 2024 events and book data
+        │   ├── 2024-02.json   # February 2024 events and book data
+        │   └── ...            # Additional monthly files
+        └── statistics/         # Statistics data
+            ├── week_0.json     # Weekly statistics data
+            ├── week_1.json
+            ├── ...
+            ├── daily_activity_2023.json # Daily activity data for heatmap
+            ├── daily_activity_2024.json
+            └── ...
 ```
 
 ## Credits

assets/calendar.js

@@ -7,38 +7,143 @@
 let calendar;
 let currentEvents = [];
 let currentBooks = {};
+let monthlyDataCache = new Map(); // Cache for monthly data: month -> {events, books}
+let availableMonths = []; // List of months that have data
+let currentDisplayedMonth = null;
 
 // Exported entry point
 export function initializeCalendar() {
-    // Load calendar data from JSON
-    loadCalendarData().then(calendarData => {
-        if (calendarData) {
-            currentEvents = calendarData.events || [];
-            currentBooks = calendarData.books || {};
+    // First, load the list of available months
+    loadAvailableMonths().then(() => {
+        // Load calendar data for current month
+        const now = new Date();
+        const currentMonth = `${now.getFullYear()}-${String(now.getMonth() + 1).padStart(2, '0')}`;
+        
+        loadCalendarData(currentMonth).then(calendarData => {
+            if (calendarData) {
+                currentEvents = calendarData.events || [];
+                currentBooks = calendarData.books || {};
+                currentDisplayedMonth = currentMonth;
 
-            initializeEventCalendar(currentEvents);
+                initializeEventCalendar(currentEvents);
 
-            // Populate statistics widgets
-            updateCalendarStats(currentEvents);
+                // Populate statistics widgets
+                updateCalendarStats(currentEvents);
 
-            // Wire up DOM interaction handlers (today / prev / next / modal)
-            setupEventHandlers();
-        }
+                // Wire up DOM interaction handlers (today / prev / next / modal)
+                setupEventHandlers();
+            }
+        });
     });
 }
 
-// Load calendar data from JSON file
-async function loadCalendarData() {
+// Load the list of available months
+async function loadAvailableMonths() {
+    try {
+        const response = await fetch('/assets/json/calendar/available_months.json');
+        if (response.ok) {
+            availableMonths = await response.json();
+        } else {
+            console.warn('Could not load available months list');
+            availableMonths = [];
+        }
+    } catch (error) {
+        console.warn('Error loading available months:', error);
+        availableMonths = [];
+    }
+}
+
+// Load and update calendar for a specific month
+async function loadAndUpdateCalendarForMonth(targetMonth) {
+    // Skip if this month is already displayed
+    if (currentDisplayedMonth === targetMonth) {
+        return;
+    }
+    
+    try {
+        // Load the target month's data (will use cache if available)
+        await loadCalendarData(targetMonth);
+        currentDisplayedMonth = targetMonth;
+        
+        // Combine all cached events and books to show events from adjacent months
+        currentEvents = [];
+        currentBooks = {};
+        
+        for (const [month, monthData] of monthlyDataCache) {
+            // Add all events from all cached months
+            currentEvents.push(...(monthData.events || []));
+            
+            // Merge all books from all cached months
+            Object.assign(currentBooks, monthData.books || {});
+        }
+        
+        // Update calendar events with all cached data
+        if (calendar) {
+            const mapEvents = evts => evts.map(ev => {
+                const book = currentBooks[ev.book_id] || {};
+                return {
+                    id: ev.book_id,
+                    title: book.title || 'Unknown Book',
+                    start: ev.start,
+                    end: ev.end || ev.start,
+                    allDay: true,
+                    backgroundColor: book.color || getEventColor(ev),
+                    borderColor: book.color || getEventColor(ev),
+                    textColor: '#ffffff',
+                    extendedProps: {
+                        ...ev,
+                        book_title: book.title || 'Unknown Book',
+                        authors: book.authors || [],
+                        book_path: book.book_path,
+                        book_cover: book.book_cover,
+                        color: book.color,
+                        md5: ev.book_id
+                    }
+                };
+            });
+            
+            calendar.setOption('events', mapEvents(currentEvents));
+        }
+    } catch (error) {
+        console.error(`Failed to load calendar data for ${targetMonth}:`, error);
+    }
+}
+
+// Load calendar data from monthly JSON files
+async function loadCalendarData(targetMonth = null) {
     try {
-        const response = await fetch('/assets/json/calendar_data.json');
+        // If no target month specified, use current month
+        if (!targetMonth) {
+            const now = new Date();
+            targetMonth = `${now.getFullYear()}-${String(now.getMonth() + 1).padStart(2, '0')}`;
+        }
+        
+        // Check if month data is already cached
+        if (monthlyDataCache.has(targetMonth)) {
+            return monthlyDataCache.get(targetMonth);
+        }
+        
+        // Check if this month has data available
+        if (availableMonths.length > 0 && !availableMonths.includes(targetMonth)) {
+            console.info(`No calendar data available for ${targetMonth}`);
+            return { events: [], books: {} }; // Return empty data instead of null
+        }
+        
+        const response = await fetch(`/assets/json/calendar/${targetMonth}.json`);
         if (!response.ok) {
-            console.error('Failed to load calendar data:', response.status);
-            return null;
+            console.error(`Failed to load calendar data for ${targetMonth}:`, response.status);
+            return { events: [], books: {} };
         }
-        return await response.json();
+        
+        const calendarData = await response.json();
+        
+        // Cache the loaded data
+        monthlyDataCache.set(targetMonth, calendarData);
+        
+        return calendarData;
     } catch (error) {
-        console.error('Error loading calendar data:', error);
-        return null;
+        console.error(`Error loading calendar data for ${targetMonth}:`, error);
+        return { events: [], books: {} };
     }
 }
 
@@ -104,6 +209,10 @@ function initializeEventCalendar(events) {
             updateCalendarTitleDirect(viewTitle);
             updateMonthlyStats(currentMonthDate);
 
+            // Load data for the new month if it's different from current data
+            const newMonth = `${currentMonthDate.getFullYear()}-${String(currentMonthDate.getMonth() + 1).padStart(2, '0')}`;
+            loadAndUpdateCalendarForMonth(newMonth);
+            
             // Scroll current day into view if needed
             setTimeout(() => scrollCurrentDayIntoView(), 100);
         }
@@ -302,10 +411,25 @@ function updateMonthlyStats(currentDate) {
         // Count unique books (using book_id)
         uniqueBooks.add(event.book_id);
 
-        // Count unique dates (format as YYYY-MM-DD)
-        const eventDate = new Date(event.start);
-        const dateString = eventDate.toISOString().split('T')[0];
-        uniqueDates.add(dateString);
+        // Count all dates within the event's date range
+        const startDate = new Date(event.start);
+        const endDate = event.end ? new Date(event.end) : new Date(event.start);
+        
+        // If end date exists, it's exclusive, so we subtract 1 day
+        if (event.end) {
+            endDate.setDate(endDate.getDate() - 1);
+        }
+        
+        // Iterate through all dates from start to end (inclusive)
+        const currentDate = new Date(startDate);
+        while (currentDate <= endDate) {
+            // Check if this date is in the target month/year
+            if (currentDate.getMonth() === targetMonth && currentDate.getFullYear() === targetYear) {
+                const dateString = currentDate.toISOString().split('T')[0];
+                uniqueDates.add(dateString);
+            }
+            currentDate.setDate(currentDate.getDate() + 1);
+        }
 
         // Sum pages and time
         totalPages += event.total_pages_read || 0;

assets/heatmap.js

@@ -53,7 +53,7 @@ class ActivityHeatmap {
     // Load activity data for a specific year
     async loadYearData(year) {
         try {
-            const response = await fetch(`/assets/json/daily_activity_${year}.json`);
+            const response = await fetch(`/assets/json/statistics/daily_activity_${year}.json`);
             if (!response.ok) {
                 throw new Error(`Failed to load activity data for ${year}`);
             }

assets/input.css

@@ -192,7 +192,7 @@
 
   /* Style the calendar body */
   .calendar-container .ec .ec-body {
-    @apply bg-gray-50 dark:bg-dark-850/50 rounded-lg mt-1 border border-gray-200 dark:border-dark-700 shadow-sm;
+    @apply bg-gray-50 dark:bg-dark-850/50 mt-1 border border-gray-200 dark:border-dark-700 shadow-sm;
     border-top: none;
   }
 
@@ -208,8 +208,8 @@
 
   /* Event styling */
   .calendar-container .ec-event {
-    @apply shadow-lg rounded-lg px-1 md:py-1 md:px-2 text-2xs md:text-xs lg:text-sm;
-    @apply mb-1;
+    @apply shadow-lg rounded-md md:rounded-lg px-1 md:py-1 md:px-2 text-2xs md:text-xs lg:text-sm;
+    @apply mb-1 mx-0.5;
   }
 
   /* Scrollbar styling */

assets/statistics.js

@@ -166,7 +166,7 @@ class StatisticsManager {
             // Wait for transition out to complete before fetching
             await new Promise(resolve => setTimeout(resolve, 200));
 
-            const response = await fetch(`/assets/json/week_${weekIndex}.json`);
+            const response = await fetch(`/assets/json/statistics/week_${weekIndex}.json`);
             if (!response.ok) {
                 throw new Error(`HTTP error! status: ${response.status}`);
             }