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

Refactors event positioning and drag-and-drop

Browse source 
Centralizes event position calculations into `PositionUtils` for consistency and reusability across managers and renderers.

Improves drag-and-drop functionality by emitting events for all-day event conversion and streamlining position calculations during drag operations.

Introduces `AllDayManager` and `AllDayEventRenderer` to manage and render all-day events in the calendar header. This allows dragging events to the header to convert them to all-day events.
This commit is contained in:
Janus Knudsen 2025-09-13 00:39:56 +02:00
parent 8b96376d1f
commit 7054c0d40a
9 changed files with 404 additions and 72 deletions
Download patch file Download diff file Expand all files Collapse all files

24
src/managers/WorkHoursManager.ts
View file

@ -2,6 +2,7 @@
import { DateCalculator } from '../utils/DateCalculator';
import { calendarConfig } from '../core/CalendarConfig';
import { PositionUtils } from '../utils/PositionUtils';
/**
* Work hours for a specific day
@ -91,7 +92,7 @@ export class WorkHoursManager {
}
/**
* Calculate CSS custom properties for non-work hour overlays (before and after work)
* Calculate CSS custom properties for non-work hour overlays using PositionUtils
*/
calculateNonWorkHoursStyle(workHours: DayWorkHours | 'off'): { beforeWorkHeight: number; afterWorkTop: number } | null {
if (workHours === 'off') {
@ -100,7 +101,6 @@ export class WorkHoursManager {
const gridSettings = calendarConfig.getGridSettings();
const dayStartHour = gridSettings.dayStartHour;
const dayEndHour = gridSettings.dayEndHour;
const hourHeight = gridSettings.hourHeight;
// Before work: from day start to work start
@ -109,28 +109,28 @@ export class WorkHoursManager {
// After work: from work end to day end
const afterWorkTop = (workHours.end - dayStartHour) * hourHeight;
return {
beforeWorkHeight: Math.max(0, beforeWorkHeight),
afterWorkTop: Math.max(0, afterWorkTop)
return {
beforeWorkHeight: Math.max(0, beforeWorkHeight),
afterWorkTop: Math.max(0, afterWorkTop)
};
}
/**
* Calculate CSS custom properties for work hours overlay (legacy - for backward compatibility)
* Calculate CSS custom properties for work hours overlay using PositionUtils
*/
calculateWorkHoursStyle(workHours: DayWorkHours | 'off'): { top: number; height: number } | null {
if (workHours === 'off') {
return null;
}
const gridSettings = calendarConfig.getGridSettings();
const dayStartHour = gridSettings.dayStartHour;
const hourHeight = gridSettings.hourHeight;
// Create dummy time strings for start and end of work hours
const startTime = `${workHours.start.toString().padStart(2, '0')}:00`;
const endTime = `${workHours.end.toString().padStart(2, '0')}:00`;
const top = (workHours.start - dayStartHour) * hourHeight;
const height = (workHours.end - workHours.start) * hourHeight;
// Use PositionUtils for consistent position calculation
const position = PositionUtils.calculateEventPosition(startTime, endTime);
return { top, height };
return { top: position.top, height: position.height };
}
/**