Janus007/Calendar
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

wip

Browse source
This commit is contained in:
Janus Knudsen 2025-08-05 00:49:00 +02:00
parent dc5063729b
commit 914239fb70
2 changed files with 52 additions and 33 deletions
Download patch file Download diff file Expand all files Collapse all files

30
src/managers/EventManager.ts
View file

@ -42,7 +42,7 @@ export class EventManager {
type: 'work',
allDay: false,
syncStatus: 'synced',
metadata: { duration: 60 }
metadata: { duration: 60, color: '#9c27b0' } // Purple
},
// Monday August 4, 2025
{
@ -53,7 +53,7 @@ export class EventManager {
type: 'meeting',
allDay: false,
syncStatus: 'synced',
metadata: { duration: 30 }
metadata: { duration: 30, color: '#ff5722' } // Deep Orange
},
{
id: '3',
@ -63,7 +63,7 @@ export class EventManager {
type: 'meeting',
allDay: false,
syncStatus: 'synced',
metadata: { duration: 90 }
metadata: { duration: 90, color: '#e91e63' } // Pink
},
// Tuesday August 5, 2025
{
@ -74,7 +74,7 @@ export class EventManager {
type: 'work',
allDay: false,
syncStatus: 'synced',
metadata: { duration: 120 }
metadata: { duration: 120, color: '#3f51b5' } // Indigo
},
{
id: '5',
@ -84,7 +84,7 @@ export class EventManager {
type: 'meal',
allDay: false,
syncStatus: 'synced',
metadata: { duration: 60 }
metadata: { duration: 60, color: '#ff9800' } // Orange
},
// Wednesday August 6, 2025
{
@ -95,7 +95,7 @@ export class EventManager {
type: 'meeting',
allDay: false,
syncStatus: 'synced',
metadata: { duration: 60 }
metadata: { duration: 60, color: '#795548' } // Brown
},
// Thursday August 7, 2025
{
@ -106,7 +106,7 @@ export class EventManager {
type: 'meeting',
allDay: false,
syncStatus: 'synced',
metadata: { duration: 90 }
metadata: { duration: 90, color: '#607d8b' } // Blue Grey
},
{
id: '8',
@ -116,7 +116,7 @@ export class EventManager {
type: 'work',
allDay: false,
syncStatus: 'synced',
metadata: { duration: 60 }
metadata: { duration: 60, color: '#009688' } // Teal
},
// Friday August 8, 2025
{
@ -127,7 +127,7 @@ export class EventManager {
type: 'meeting',
allDay: false,
syncStatus: 'synced',
metadata: { duration: 30 }
metadata: { duration: 30, color: '#8bc34a' } // Light Green
},
{
id: '10',
@ -137,7 +137,7 @@ export class EventManager {
type: 'meeting',
allDay: false,
syncStatus: 'synced',
metadata: { duration: 90 }
metadata: { duration: 90, color: '#cddc39' } // Lime
},
// Saturday August 9, 2025
{
@ -148,7 +148,7 @@ export class EventManager {
type: 'work',
allDay: false,
syncStatus: 'synced',
metadata: { duration: 120 }
metadata: { duration: 120, color: '#f44336' } // Red
},
// Test events for early/late hours
{
@ -159,7 +159,7 @@ export class EventManager {
type: 'work',
allDay: false,
syncStatus: 'synced',
metadata: { duration: 60 }
metadata: { duration: 60, color: '#00bcd4' } // Cyan
},
{
id: '13',
@ -169,7 +169,7 @@ export class EventManager {
type: 'meeting',
allDay: false,
syncStatus: 'synced',
metadata: { duration: 60 }
metadata: { duration: 60, color: '#673ab7' } // Deep Purple
},
{
id: '14',
@ -179,14 +179,14 @@ export class EventManager {
type: 'work',
allDay: false,
syncStatus: 'synced',
metadata: { duration: 120 }
metadata: { duration: 120, color: '#ffc107' } // Amber
},
// All-day events for demo
{
id: '15',
title: 'Company Holiday',
start: '2025-08-04T00:00:00',
end: '2025-08-04T23:59:59',
end: '2025-08-05T23:59:59',
type: 'milestone',
allDay: true,
syncStatus: 'synced',

55
src/managers/GridManager.ts
View file

@ -330,32 +330,51 @@ export class GridManager {
const weekDays = calendarConfig.get('weekDays');
const daysToShow = dates.slice(0, weekDays);
// Group all-day events by date
const eventsByDate = new Map<string, any[]>();
// Process each all-day event to calculate its span
this.allDayEvents.forEach(event => {
const eventDate = new Date(event.start);
const dateKey = this.formatDate(eventDate);
const startDate = new Date(event.start);
const endDate = new Date(event.end);
if (!eventsByDate.has(dateKey)) {
eventsByDate.set(dateKey, []);
}
eventsByDate.get(dateKey)!.push(event);
});
// Render all-day events for each day
daysToShow.forEach((date, dayIndex) => {
const dateKey = this.formatDate(date);
const dayEvents = eventsByDate.get(dateKey) || [];
// Find start and end column indices
let startColumnIndex = -1;
let endColumnIndex = -1;
dayEvents.forEach(event => {
daysToShow.forEach((date, index) => {
const dateStr = this.formatDate(date);
const startDateStr = this.formatDate(startDate);
const endDateStr = this.formatDate(endDate);
if (dateStr === startDateStr) {
startColumnIndex = index;
}
// For end date, we need to check if the event spans to this day
// All-day events typically end at 23:59:59, so we check if this date is <= end date
if (date <= endDate) {
endColumnIndex = index;
}
});
// Only render if the event starts within the visible week
if (startColumnIndex >= 0) {
// If end column is not found or is before start, default to single day
if (endColumnIndex < startColumnIndex) {
endColumnIndex = startColumnIndex;
}
const allDayEvent = document.createElement('swp-allday-event');
allDayEvent.textContent = event.title;
allDayEvent.style.gridColumn = `${dayIndex + 1} / ${dayIndex + 2}`; // Single column
// Set grid column span: start column (1-based) to end column + 1 (1-based)
const gridColumnStart = startColumnIndex + 1;
const gridColumnEnd = endColumnIndex + 2; // +2 because grid columns are 1-based and we want to include the end column
allDayEvent.style.gridColumn = `${gridColumnStart} / ${gridColumnEnd}`;
allDayEvent.style.backgroundColor = event.metadata?.color || '#ff9800';
console.log(`GridManager: All-day event "${event.title}" spans columns ${gridColumnStart} to ${gridColumnEnd-1} (${endColumnIndex - startColumnIndex + 1} days)`);
weekHeader.appendChild(allDayEvent);
});
}
});
}