diff --git a/src/elements/SwpEventElement.ts b/src/elements/SwpEventElement.ts index 772d9b9..a4965d2 100644 --- a/src/elements/SwpEventElement.ts +++ b/src/elements/SwpEventElement.ts @@ -225,7 +225,7 @@ export class SwpEventElement extends BaseEventElement { } /** - * All-day event element (swp-allday-event) + * All-day event element (now using unified swp-event tag) */ export class SwpAllDayEventElement extends BaseEventElement { private columnIndex: number; @@ -239,7 +239,7 @@ export class SwpAllDayEventElement extends BaseEventElement { } protected createElement(): HTMLElement { - return document.createElement('swp-allday-event'); + return document.createElement('swp-event'); } /** @@ -295,7 +295,7 @@ export class SwpAllDayEventElement extends BaseEventElement { const finalColumnSpan = targetDate ? 1 : columnSpan; // Find occupied rows in the spanned columns using computedStyle - const existingEvents = document.querySelectorAll('swp-allday-event'); + const existingEvents = document.querySelectorAll('swp-allday-container swp-event'); const occupiedRows = new Set(); console.log('🔍 SwpAllDayEventElement: Checking grid row for new event', { diff --git a/src/managers/AllDayManager.ts b/src/managers/AllDayManager.ts index cd04daa..fc196d4 100644 --- a/src/managers/AllDayManager.ts +++ b/src/managers/AllDayManager.ts @@ -84,7 +84,7 @@ export class AllDayManager { if (!isAllDayEvent) return; const eventId = draggedElement.dataset.eventId; - const dragClone = document.querySelector(`swp-allday-container swp-allday-event[data-event-id="clone-${eventId}"]`); + const dragClone = document.querySelector(`swp-allday-container swp-event[data-event-id="clone-${eventId}"]`); if (dragClone) { this.handleDragMove(dragClone as HTMLElement, mousePosition); } @@ -101,8 +101,8 @@ export class AllDayManager { eventId: eventId, finalPosition }); +const dragClone = document.querySelector(`swp-allday-container swp-event[data-event-id="clone-${eventId}"]`); - const dragClone = document.querySelector(`swp-allday-container swp-allday-event[data-event-id="clone-${eventId}"]`); console.log('🎯 AllDayManager: Ending drag for all-day event', { eventId }); this.handleDragEnd(draggedElement, dragClone as HTMLElement, finalPosition.column); @@ -191,8 +191,8 @@ export class AllDayManager { public checkAndAnimateAllDayHeight(): void { const container = this.getAllDayContainer(); if (!container) return; +const allDayEvents = container.querySelectorAll('swp-event'); - const allDayEvents = container.querySelectorAll('swp-allday-event'); // Calculate required rows - 0 if no events (will collapse) let maxRows = 0; @@ -339,7 +339,7 @@ export class AllDayManager { }; // Check if all-day clone already exists for this event ID - const existingAllDayEvent = document.querySelector(`swp-allday-container swp-allday-event[data-event-id="${eventId}"]`); + const existingAllDayEvent = document.querySelector(`swp-allday-container swp-event[data-event-id="${eventId}"]`); if (existingAllDayEvent) { // All-day event already exists, just ensure clone is hidden const dragClone = document.querySelector(`swp-event[data-event-id="clone-${eventId}"]`); diff --git a/src/managers/DragDropManager.ts b/src/managers/DragDropManager.ts index 49c1c01..78a3dd5 100644 --- a/src/managers/DragDropManager.ts +++ b/src/managers/DragDropManager.ts @@ -42,7 +42,7 @@ export class DragDropManager { private initialMousePosition: Position = { x: 0, y: 0 }; // Drag state - private draggedElement: HTMLElement | null = null ; + private draggedElement!: HTMLElement | null; private currentColumn: string | null = null; private isDragStarted = false; @@ -134,7 +134,7 @@ export class DragDropManager { let eventElement = target; while (eventElement && eventElement.tagName !== 'SWP-EVENTS-LAYER') { - if (eventElement.tagName === 'SWP-EVENT' || eventElement.tagName === 'SWP-ALLDAY-EVENT') { + if (eventElement.tagName === 'SWP-EVENT') { break; } eventElement = eventElement.parentElement as HTMLElement; diff --git a/src/renderers/AllDayEventRenderer.ts b/src/renderers/AllDayEventRenderer.ts index f72dcad..b29ca87 100644 --- a/src/renderers/AllDayEventRenderer.ts +++ b/src/renderers/AllDayEventRenderer.ts @@ -60,7 +60,7 @@ export class AllDayEventRenderer { const container = this.getContainer(); if (!container) return; - const eventElement = container.querySelector(`swp-allday-event[data-event-id="${eventId}"]`); + const eventElement = container.querySelector(`swp-event[data-event-id="${eventId}"]`); if (eventElement) { eventElement.remove(); } diff --git a/wwwroot/css/calendar-layout-css.css b/wwwroot/css/calendar-layout-css.css index b9d447c..2908a32 100644 --- a/wwwroot/css/calendar-layout-css.css +++ b/wwwroot/css/calendar-layout-css.css @@ -299,7 +299,7 @@ swp-allday-column { } /* All-day events in containers */ -swp-allday-event { +swp-allday-container swp-event { height: 22px; /* Fixed height for consistent stacking */ background: #ff9800; /* Default orange background */ display: flex; @@ -317,7 +317,7 @@ swp-allday-event { border-left: 3px solid rgba(0, 0, 0, 0.2); } -swp-allday-event:last-child { +swp-allday-container swp-event:last-child { margin-bottom: 0; }