Improves drag and drop event handling
Refactors drag and drop logic for better event handling and code clarity. - Moves drag styling to CSS class for cleaner code. - Emits a 'drag:convert-from-allday' event to handle the conversion of all-day events back to day events. - Adds logging for debugging purposes.
This commit is contained in:
parent
7e45293128
commit
b95a516806
3 changed files with 42 additions and 29 deletions
|
|
@ -123,11 +123,27 @@ export abstract class BaseEventRenderer implements EventRendererStrategy {
|
|||
// Handle drag end
|
||||
eventBus.on('drag:end', (event) => {
|
||||
const { eventId, finalColumn, finalY } = (event as CustomEvent).detail;
|
||||
|
||||
console.log('🎬 EventRenderer: Received drag:end', {
|
||||
eventId: eventId,
|
||||
finalColumn: finalColumn,
|
||||
finalY: finalY
|
||||
});
|
||||
|
||||
// Find element dynamically - could be swp-event or swp-allday-event
|
||||
let originalElement = document.querySelector(`swp-event[data-event-id="${eventId}"]`) as HTMLElement;
|
||||
let elementType = 'day-event';
|
||||
if (!originalElement) {
|
||||
originalElement = document.querySelector(`swp-allday-event[data-event-id="${eventId}"]`) as HTMLElement;
|
||||
elementType = 'all-day-event';
|
||||
}
|
||||
|
||||
console.log('🔍 EventRenderer: Found element', {
|
||||
elementType: elementType,
|
||||
found: !!originalElement,
|
||||
tagName: originalElement?.tagName
|
||||
});
|
||||
|
||||
if (originalElement) {
|
||||
this.handleDragEnd(eventId, originalElement, finalColumn, finalY);
|
||||
}
|
||||
|
|
@ -188,14 +204,7 @@ export abstract class BaseEventRenderer implements EventRendererStrategy {
|
|||
* Apply common drag styling to an element
|
||||
*/
|
||||
private applyDragStyling(element: HTMLElement): void {
|
||||
element.style.position = 'absolute';
|
||||
element.style.zIndex = '999999';
|
||||
element.style.pointerEvents = 'none';
|
||||
element.style.opacity = '0.8';
|
||||
element.style.left = '2px';
|
||||
element.style.right = '2px';
|
||||
element.style.marginLeft = '0px';
|
||||
element.style.width = '';
|
||||
element.classList.add('dragging');
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
@ -449,9 +458,7 @@ export abstract class BaseEventRenderer implements EventRendererStrategy {
|
|||
}
|
||||
|
||||
// Fully normalize the clone to be a regular event
|
||||
this.draggedClone.style.pointerEvents = '';
|
||||
this.draggedClone.style.opacity = '';
|
||||
this.draggedClone.style.userSelect = '';
|
||||
this.draggedClone.classList.remove('dragging');
|
||||
// Behold z-index hvis det er et stacked event
|
||||
|
||||
// Update dataset with new times after successful drop (only for timed events)
|
||||
|
|
@ -485,6 +492,7 @@ export abstract class BaseEventRenderer implements EventRendererStrategy {
|
|||
|
||||
// Clean up any drag artifacts from failed drag attempt
|
||||
if (this.draggedClone) {
|
||||
this.draggedClone.classList.remove('dragging');
|
||||
this.draggedClone.remove();
|
||||
this.draggedClone = null;
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue