Improves all-day event drag and drop
Handles dragging of both timed events (converting to all-day) and existing all-day events to different days. Refactors all-day height recalculation to support animated transitions for a smoother user experience when all-day event counts change. Uses event delegation for header mouseover detection. Updates ScrollManager to listen for header height changes.
This commit is contained in:
parent
6ede297bb5
commit
f2763ad826
6 changed files with 186 additions and 48 deletions
|
|
@ -135,12 +135,30 @@ export class GridRenderer {
|
|||
|
||||
headerRenderer.render(calendarHeader, context);
|
||||
|
||||
// Add mouseover listeners on day headers for drag detection
|
||||
const dayHeaders = calendarHeader.querySelectorAll('swp-day-header');
|
||||
dayHeaders.forEach(dayHeader => {
|
||||
dayHeader.addEventListener('mouseover', () => {
|
||||
eventBus.emit('header:mouseover', { dayHeader, headerRenderer });
|
||||
});
|
||||
// Use event delegation for mouseover detection on entire header
|
||||
calendarHeader.addEventListener('mouseover', (event) => {
|
||||
const target = event.target as HTMLElement;
|
||||
|
||||
// Check what was hovered - could be day-header OR all-day-container
|
||||
const dayHeader = target.closest('swp-day-header');
|
||||
const allDayContainer = target.closest('swp-allday-container');
|
||||
|
||||
if (dayHeader || allDayContainer) {
|
||||
const hoveredElement = dayHeader || allDayContainer;
|
||||
const targetDate = (hoveredElement as HTMLElement).dataset.date;
|
||||
|
||||
console.log('GridRenderer: Detected hover over:', {
|
||||
elementType: dayHeader ? 'day-header' : 'all-day-container',
|
||||
targetDate,
|
||||
element: hoveredElement
|
||||
});
|
||||
|
||||
eventBus.emit('header:mouseover', {
|
||||
element: hoveredElement,
|
||||
targetDate,
|
||||
headerRenderer
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
|
|
@ -179,7 +197,7 @@ export class GridRenderer {
|
|||
// Clear existing content
|
||||
calendarHeader.innerHTML = '';
|
||||
|
||||
// Re-render headers using Strategy Pattern
|
||||
// Re-render headers using Strategy Pattern - this will also re-attach the event listener
|
||||
this.renderCalendarHeader(calendarHeader as HTMLElement, currentWeek, resourceData);
|
||||
}
|
||||
}
|
||||
Loading…
Add table
Add a link
Reference in a new issue