diff --git a/src/managers/AllDayManager.ts b/src/managers/AllDayManager.ts
index 8cb2262..f2d9ac4 100644
--- a/src/managers/AllDayManager.ts
+++ b/src/managers/AllDayManager.ts
@@ -53,8 +53,7 @@ export class AllDayManager {
originalElementTag: payload.originalElement?.tagName
});
- this.handleConvertToAllDay(payload);
- this.checkAndAnimateAllDayHeight();
+ this.handleConvertToAllDay(payload);
});
eventBus.on('drag:mouseleave-header', (event) => {
@@ -64,7 +63,7 @@ export class AllDayManager {
originalElementId: originalElement?.dataset?.eventId
});
- this.checkAndAnimateAllDayHeight();
+ //this.checkAndAnimateAllDayHeight();
});
// Listen for drag operations on all-day events
@@ -117,15 +116,8 @@ export class AllDayManager {
reason
});
- // Recalculate all-day height since clones may have been removed
- this.checkAndAnimateAllDayHeight();
});
- // Listen for height check requests from EventRendererManager
- eventBus.on('allday:checkHeight', () => {
- console.log('📏 AllDayManager: Received allday:checkHeight request');
- this.checkAndAnimateAllDayHeight();
- });
}
private getAllDayContainer(): HTMLElement | null {
@@ -212,7 +204,7 @@ export class AllDayManager {
}
} else {
-
+
// Hide chevron - not needed
this.updateChevronButton(false);
this.clearOverflowIndicators();
@@ -313,7 +305,19 @@ export class AllDayManager {
return layoutEngine.calculateLayout(events);
}
+ public initAllDayEventsLayout(events: CalendarEvent[], weekDates: string[]): EventLayout[] {
+ // Store current state
+ this.currentAllDayEvents = events;
+ this.currentWeekDates = weekDates;
+
+ // Initialize layout engine with provided week dates
+ var layoutEngine = new AllDayLayoutEngine(weekDates);
+
+ // Calculate layout for all events together - AllDayLayoutEngine handles CalendarEvents directly
+ this.currentLayouts = layoutEngine.calculateLayout(events);
+ return this.currentLayouts;
+ }
/**
* Handle conversion of timed event to all-day event - SIMPLIFIED
@@ -412,12 +416,8 @@ export class AllDayManager {
if (dragEndEvent.draggedClone == null)
return;
-
// 2. Normalize clone ID
- const cloneId = dragEndEvent.draggedClone?.dataset.eventId;
- if (cloneId?.startsWith('clone-')) {
- dragEndEvent.draggedClone.dataset.eventId = cloneId.replace('clone-', '');
- }
+ dragEndEvent.draggedClone.dataset.eventId = dragEndEvent.draggedClone.dataset.eventId?.replace('clone-', '');
// 3. Create temporary array with existing events + the dropped event
let eventId = dragEndEvent.draggedClone.dataset.eventId;
@@ -430,7 +430,7 @@ export class AllDayManager {
const droppedEvent: CalendarEvent = {
id: eventId,
- title: dragEndEvent.draggedClone.dataset.title || dragEndEvent.draggedClone.textContent || '',
+ title: dragEndEvent.draggedClone.dataset.title|| '',
start: new Date(eventDate),
end: new Date(eventDate),
type: eventType,
@@ -449,16 +449,14 @@ export class AllDayManager {
this.newLayouts.forEach((layout) => {
// Find current layout for this event
var currentLayout = this.currentLayouts.find(old => old.calenderEvent.id === layout.calenderEvent.id);
- var currentGridArea = currentLayout?.gridArea;
- var newGridArea = layout.gridArea;
- if (currentGridArea !== newGridArea) {
+ if (currentLayout?.gridArea !== layout.gridArea) {
changedCount++;
const element = dragEndEvent.draggedClone;
if (element) {
// Add transition class for smooth animation
element.classList.add('transitioning');
- element.style.gridArea = newGridArea;
+ element.style.gridArea = layout.gridArea;
element.style.gridRow = layout.row.toString();
element.style.gridColumn = `${layout.startColumn} / ${layout.endColumn + 1}`;
@@ -529,7 +527,7 @@ export class AllDayManager {
private countEventsInColumn(columnBounds: ColumnBounds): number {
var columnIndex = columnBounds.index;
var count = 0;
-
+
this.currentLayouts.forEach((layout) => {
// Check if event spans this column
if (layout.startColumn <= columnIndex && layout.endColumn >= columnIndex) {
@@ -546,23 +544,26 @@ export class AllDayManager {
const container = this.getAllDayContainer();
if (!container) return;
- container.querySelectorAll('swp-event').forEach((element) => {
- const event = element as HTMLElement;
- const gridRow = parseInt(event.style.gridRow) || 1;
+ // Create overflow indicators for each column that needs them
+ var columns = ColumnDetectionUtils.getColumns();
- if (gridRow === 4) {
-
- // Convert row 4 events to indicators
- const overflowCount = this.actualRowCount - 3; // Total overflow rows
- event.classList.add('max-event-overflow');
- event.innerHTML = `+${overflowCount} more`;
- event.onclick = (e) => {
+ columns.forEach((columnBounds) => {
+ var totalEventsInColumn = this.countEventsInColumn(columnBounds);
+ var overflowCount = Math.max(0, totalEventsInColumn - 3);
+
+ if (overflowCount > 0) {
+ // Create new overflow indicator element
+ var overflowElement = document.createElement('swp-event');
+ overflowElement.className = 'max-event-overflow';
+ overflowElement.style.gridRow = '4';
+ overflowElement.style.gridColumn = columnBounds.index.toString();
+ overflowElement.innerHTML = `+${overflowCount} more`;
+ overflowElement.onclick = (e) => {
e.stopPropagation();
this.toggleExpanded();
};
- } else if (gridRow > 4) {
- // Hide events beyond row 4
- event.style.display = 'none';
+
+ container.appendChild(overflowElement);
}
});
}
@@ -574,21 +575,12 @@ export class AllDayManager {
const container = this.getAllDayContainer();
if (!container) return;
- container.querySelectorAll('.max-event-overflow').forEach((event) => {
- const htmlEvent = event as HTMLElement;
- htmlEvent.classList.remove('max-event-overflow');
- htmlEvent.onclick = null;
-
- // Restore original title from data-title
- if (htmlEvent.dataset.title) {
- htmlEvent.innerHTML = htmlEvent.dataset.title;
- }
+ // Remove all overflow indicator elements
+ container.querySelectorAll('.max-event-overflow').forEach((element) => {
+ element.remove();
});
- // Show all hidden events
- container.querySelectorAll('swp-event[style*="display: none"]').forEach((event) => {
- (event as HTMLElement).style.display = '';
- });
+
}
}
\ No newline at end of file
diff --git a/src/managers/DragDropManager.ts b/src/managers/DragDropManager.ts
index 653be03..52df166 100644
--- a/src/managers/DragDropManager.ts
+++ b/src/managers/DragDropManager.ts
@@ -243,8 +243,10 @@ export class DragDropManager {
// Check for column change using cached data
const newColumn = ColumnDetectionUtils.getColumnBounds(currentPosition);
+ if (newColumn == null)
+ return;
- if (newColumn && newColumn !== this.currentColumnBounds) {
+ if (newColumn?.index !== this.currentColumnBounds?.index) {
const previousColumn = this.currentColumnBounds;
this.currentColumnBounds = newColumn;
@@ -279,7 +281,7 @@ export class DragDropManager {
// Detect drop target (swp-day-column or swp-day-header)
const dropTarget = this.detectDropTarget(mousePosition);
- if(!dropTarget)
+ if (!dropTarget)
throw "dropTarget is null";
console.log('🎯 DragDropManager: Emitting drag:end', {
@@ -298,7 +300,9 @@ export class DragDropManager {
target: dropTarget
};
this.eventBus.emit('drag:end', dragEndPayload);
-
+
+
+ this.draggedElement = null;
} else {
// This was just a click - emit click event instead
diff --git a/src/renderers/EventRendererManager.ts b/src/renderers/EventRendererManager.ts
index b058d74..5babfcb 100644
--- a/src/renderers/EventRendererManager.ts
+++ b/src/renderers/EventRendererManager.ts
@@ -371,15 +371,13 @@ export class EventRenderingService {
// Pass current events to AllDayManager for state tracking
this.allDayManager.setCurrentEvents(allDayEvents, weekDates);
- const layouts = this.allDayManager.calculateAllDayEventsLayout(allDayEvents, weekDates);
+ const layouts = this.allDayManager.initAllDayEventsLayout(allDayEvents, weekDates);
// Render each all-day event with pre-calculated layout
layouts.forEach(layout => {
this.allDayEventRenderer.renderAllDayEventWithLayout(layout.calenderEvent, layout);
});
- // Check and adjust all-day container height after rendering
- this.eventBus.emit('allday:checkHeight');
}
/**
diff --git a/src/types/EventPayloadMap.ts b/src/types/EventPayloadMap.ts
index d9393ad..e2630d2 100644
--- a/src/types/EventPayloadMap.ts
+++ b/src/types/EventPayloadMap.ts
@@ -135,7 +135,6 @@ export interface CalendarEventPayloadMap {
};
// All-day events
- 'allday:checkHeight': undefined;
'allday:convert-to-allday': {
eventId: string;
element: HTMLElement;
diff --git a/src/utils/ColumnDetectionUtils.ts b/src/utils/ColumnDetectionUtils.ts
index 28bf816..bf0b4aa 100644
--- a/src/utils/ColumnDetectionUtils.ts
+++ b/src/utils/ColumnDetectionUtils.ts
@@ -83,17 +83,8 @@ export class ColumnDetectionUtils {
return column || null;
}
- /**
- * Clear cache (useful for testing or when DOM structure changes)
- */
- public static clearCache(): void {
- this.columnBoundsCache = [];
- }
-
- /**
- * Get current cache for debugging
- */
- public static getCache(): ColumnBounds[] {
+
+ public static getColumns(): ColumnBounds[] {
return [...this.columnBoundsCache];
}
}
\ No newline at end of file