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

Updates event dates using 1970 reference

Browse source 
Modifies event rendering to correctly handle dates that use a 1970 reference point during drag and drop operations.

This ensures that events maintain their correct date when moved between columns, resolving an issue where dragged events would revert to the 1970 reference date.
This commit is contained in:
Janus Knudsen 2025-09-10 00:33:39 +02:00
parent d205ccb0b6
commit 17b9b563a4
1 changed files with 48 additions and 56 deletions
Download patch file Download diff file Expand all files Collapse all files

104
src/renderers/EventRenderer.ts
View file

@ -238,6 +238,17 @@ export abstract class BaseEventRenderer implements EventRendererStrategy {
const cachedDuration = parseInt(clone.dataset.originalDuration || '60');
const endTotalMinutes = snappedStartMinutes + cachedDuration;
// Update dataset with reference date for performance
const referenceDate = new Date('1970-01-01T00:00:00');
const startDate = new Date(referenceDate);
startDate.setMinutes(startDate.getMinutes() + snappedStartMinutes);
const endDate = new Date(referenceDate);
endDate.setMinutes(endDate.getMinutes() + endTotalMinutes);
clone.dataset.start = startDate.toISOString();
clone.dataset.end = endDate.toISOString();
// Update display
const timeElement = clone.querySelector('swp-event-time');
if (timeElement) {
@ -433,7 +444,7 @@ export abstract class BaseEventRenderer implements EventRendererStrategy {
// Behold z-index hvis det er et stacked event
// Update dataset with new times after successful drop
const newEvent = this.elementToCalendarEventWithNewPosition(this.draggedClone, finalColumn);
const newEvent = this.elementToCalendarEvent(this.draggedClone);
if (newEvent) {
this.draggedClone.dataset.start = newEvent.start.toISOString();
this.draggedClone.dataset.end = newEvent.end.toISOString();
@ -490,7 +501,7 @@ export abstract class BaseEventRenderer implements EventRendererStrategy {
if (!eventsLayer) return;
// Convert dropped element to CalendarEvent with new position
const droppedEvent = this.elementToCalendarEventWithNewPosition(droppedElement, targetColumn);
const droppedEvent = this.elementToCalendarEvent(droppedElement);
if (!droppedEvent) return;
// Get existing events in the column (excluding the dropped element)
@ -568,41 +579,52 @@ export abstract class BaseEventRenderer implements EventRendererStrategy {
}
}
/**
* Convert DOM element to CalendarEvent using its NEW position after drag
* Convert DOM element to CalendarEvent - handles both normal and 1970 reference dates
*/
private elementToCalendarEventWithNewPosition(element: HTMLElement, targetColumn: string): CalendarEvent | null {
private elementToCalendarEvent(element: HTMLElement): CalendarEvent | null {
const eventId = element.dataset.eventId;
const title = element.dataset.title;
const type = element.dataset.type;
const originalDuration = element.dataset.originalDuration;
const start = element.dataset.start;
const end = element.dataset.end;
if (!eventId || !title || !type) {
if (!eventId || !title || !type || !start || !end) {
return null;
}
// Calculate new start/end times based on current position
const currentTop = parseInt(element.style.top) || 0;
const durationMinutes = originalDuration ? parseInt(originalDuration) : 60;
let startDate = new Date(start);
let endDate = new Date(end);
// Convert position to time
const gridSettings = calendarConfig.getGridSettings();
const hourHeight = gridSettings.hourHeight;
const dayStartHour = gridSettings.dayStartHour;
// Calculate minutes from grid start
const minutesFromGridStart = (currentTop / hourHeight) * 60;
const actualStartMinutes = (dayStartHour * 60) + minutesFromGridStart;
const actualEndMinutes = actualStartMinutes + durationMinutes;
// Create ISO date strings for the target column
const targetDate = new Date(targetColumn + 'T00:00:00');
const startDate = new Date(targetDate);
startDate.setMinutes(startDate.getMinutes() + actualStartMinutes);
const endDate = new Date(targetDate);
endDate.setMinutes(endDate.getMinutes() + actualEndMinutes);
// Check if we have 1970 reference date (from drag operations)
if (startDate.getFullYear() === 1970) {
// Find the parent column to get the actual date
const columnElement = element.closest('swp-day-column') as HTMLElement;
if (columnElement && columnElement.dataset.date) {
const columnDate = new Date(columnElement.dataset.date + 'T00:00:00');
// Keep the time portion from the 1970 dates, but use the column's date
startDate = new Date(
columnDate.getFullYear(),
columnDate.getMonth(),
columnDate.getDate(),
startDate.getHours(),
startDate.getMinutes()
);
endDate = new Date(
columnDate.getFullYear(),
columnDate.getMonth(),
columnDate.getDate(),
endDate.getHours(),
endDate.getMinutes()
);
}
}
const duration = element.dataset.duration;
return {
id: eventId,
title: title,
@ -611,36 +633,6 @@ export abstract class BaseEventRenderer implements EventRendererStrategy {
type: type,
allDay: false,
syncStatus: 'synced',
metadata: {
duration: durationMinutes
}
};
}
/**
* Convert DOM element to CalendarEvent for overlap detection
*/
private elementToCalendarEvent(element: HTMLElement): CalendarEvent | null {
const eventId = element.dataset.eventId;
const title = element.dataset.title;
const start = element.dataset.start;
const end = element.dataset.end;
const type = element.dataset.type;
const duration = element.dataset.duration;
if (!eventId || !title || !start || !end || !type) {
return null;
}
return {
id: eventId,
title: title,
start: new Date(start),
end: new Date(end),
type: type,
allDay: false,
syncStatus: 'synced', // Default to synced for existing events
metadata: {
duration: duration ? parseInt(duration) : 60
}