Introduces event resizing feature, allowing users to dynamically adjust event durations by dragging handles on the top or bottom of events.
Moves resize logic into a dedicated ResizeManager class for better code organization and separation of concerns.
Addresses an issue where dragging events that are part of a stack could lead to inconsistencies.
This change ensures that when an event is dragged and dropped, the other events in the stack are also repositioned correctly.
It traverses the stack, removes the related events from their original positions, and re-renders them in the correct column.
It also removes stack link data from the dragged element to prevent unexpected behavior.
Updates event start and end times in the dataset after a successful drag and drop operation. This ensures the event element reflects the new time position.
Also resets the z-index of the dropped element if no overlaps are detected, keeping the element's original appearance.
Ensures dragged event clones maintain correct positioning
by setting `marginLeft` to `0px`. This fixes a potential
visual issue where the clone might not fill the full
column width during dragging.
Replaces the old overlap handling system with a new approach.
The new system recalculates overlaps after a drag-and-drop action and re-renders the affected events, avoiding manual group management. This simplifies the overlap resolution logic and improves performance.
Restructures the project for better maintainability and clarity. Adds a ManagerFactory for dependency injection and reorganizes files.
Updates event rendering logic to correctly handle overlapping events using a stack link system. The EventRendererStrategy now correctly processes and renders event overlaps, ensuring proper display. Introduces processing tracking to avoid double rendering.
Updates documentation to reflect the new structure and build process. Also implements changes to build output and event system for improved clarity.
Fixes#123
Ensures existing events maintain their base positions when a new event is dragged and dropped into an overlapping time slot.
The fix prioritizes existing events in the stack, placing the newly dropped event on top. This ensures correct visual representation and expected behavior during event manipulation.
Ensures event stacking only occurs when events actually overlap in pixel space, preventing visual artifacts. Breaks stacking chains when events no longer overlap due to middle element removal, and correctly resets styling.
Refactors event overlap handling to use a DOM-centric approach with data attributes for stack tracking. This eliminates complex state management, reduces code complexity, and improves maintainability. Removes the previous Map-based linked list implementation.
The new approach offers better debugging, automatic memory management, and eliminates state synchronization bugs.
The solution maintains identical functionality with a significantly simpler implementation, focusing on DOM manipulation for visual stacking and column sharing.
Addresses potential performance concerns of DOM queries by scoping them to specific containers.
Refactors event overlap detection to use pixel-based comparison.
This improves accuracy and addresses issues with incorrect overlap
calculations when events have slight time differences but visually overlap.
It removes dependency on the event manager and the need to convert elements
to calendar events for overlap detection.
Refactors event dropping logic to first check for existing
event groups. If a group exists and the dropped event overlaps
with it, the dropped event is added to the group. Otherwise,
it proceeds with full overlap detection against individual events.
This change prevents unnecessary group creation and optimizes
event arrangement within columns. It also ensures the dragged
event is placed on the rightmost side by adding it to the
overlapping events array last.
Updates the event overlap detection to accurately determine when events overlap in time, fixing incorrect stacking behavior.
Implements column sharing for events starting within 30 minutes of each other.
Applies stacking only when events truly overlap in time but start times differ by more than 30 minutes.
Removes unnecessary data attributes and simplifies styling for stacked events, improving code cleanliness and performance.
Adds logic to handle event overlaps in the calendar view. It introduces two patterns: column sharing for events with the same start time (rendered using flexbox) and stacking for events with a >30 min difference (rendered with reduced width and z-index).
It also introduces deep linking to specific events via URL parameters.
Enhances drag and drop behavior by introducing free positioning during auto-scroll and snapping to grid intervals.
- Introduces a `calculateFreePosition` method to allow events to follow the mouse exactly during auto-scroll.
- Modifies the drag move event to emit the snapped position during normal drag behavior.
- Updates event rendering to use grid settings for snap intervals.
- Updates grid styles to configure CSS variables dynamically.
Refines the drag and drop autoscroll functionality to correctly update the position of the dragged element relative to the scrolling container.
Calculates the snapped position based on the column's bounding rectangle and scroll movement, ensuring accurate placement during autoscroll. This provides a smoother and more responsive user experience when dragging elements near the edges of the scrollable area.
Streamlines calendar configuration by adopting a singleton pattern for consistent access and simplifies event handling.
- Removes direct `CalendarConfig` dependency injection in favor of the `calendarConfig` singleton, reducing code complexity.
- Replaces specific event emissions for grid, date, and resource settings updates with a general `REFRESH_REQUESTED` event.
- Updates event names to be more descriptive and consistent ("NAVIGATION_COMPLETED", "PERIOD_INFO_UPDATE").
- Removes the need to pass the calendar config to renderers since it is now a singleton.
This improves code maintainability and simplifies the event emission process.
Improves drag and drop performance by caching DOM elements and consolidating position calculations.
This reduces redundant DOM queries and optimizes event handling for smoother user interaction.
Also leverages `DateCalculator` for date/time conversions.
Improves calendar rendering performance by centralizing DOM manipulation in a dedicated `GridRenderer` class. This reduces redundant DOM queries and improves overall efficiency.
Introduces `EventManager` for optimized event lifecycle management with caching and optimized data processing.
The `ViewManager` is refactored for optimized view switching and event handling, further streamlining the application's architecture.
This change moves from a strategy-based `GridManager` to a simpler approach leveraging the `GridRenderer` directly for DOM updates. This eliminates unnecessary abstractions and improves code maintainability.
The changes include removing the old `GridManager`, `EventManager` and introducing new versions.
This change refactors the DateCalculator class to be a static class.
This removes the need to instantiate DateCalculator in multiple
managers and renderers, simplifying dependency management and
ensuring consistent date calculations across the application.
The configuration is now initialized once at the application start.
Caches frequently accessed DOM elements in NavigationManager and
EventRenderer to reduce redundant queries, improving performance.
Updates the event renderer to trigger all-day height animations and
introduces a destroy method for resource management.
Refactors time formatting in EventRenderer to handle both total
minutes and Date objects using a unified method.
Optimizes all-day event header animation by caching DOM elements.
This change avoids redundant DOM queries during animation,
resulting in smoother transitions when adding or removing all-day
events. It also introduces a destroy method for proper cleanup
of cached elements.
Refactors the header animation to animate the calendar header's height instead of just the all-day container.
This change improves the perceived performance of the animation. It also reduces animation duration.
Refactors all-day event handling to enhance user experience.
Introduces dynamic height animation for all-day event rows, adapting to the number of overlapping events. This ensures efficient use of screen space and prevents unnecessary scrolling.
Additionally, events now store all relevant data, and the header height is checked and animated after navigation.
The previous HeaderRenderer.ts file has been refactored.
Simplifies header animation logic by leveraging CSS Grid for height transitions.
This change removes the direct height animation of the calendar header and relies on CSS Grid's auto row feature to manage the header expansion.
It also removes the manual spacer height calculations in Typescript, and relies on CSS variables to control this.
This results in a smoother and more efficient animation, especially when all-day events are present.
Simplifies and improves the all-day event rendering process, ensuring
consistent container creation and proper placement of events.
- Ensures all-day containers are consistently created during header
rendering, preventing potential issues with event placement.
- Removes the complex and unreliable mouseover detection for all-day
conversion, simplifying the event dragging logic.
- Eliminates the dynamic all-day row height calculation, relying on
CSS for layout control.
- Prevents errors when the all-day container is missing.
Cleans up the codebase by removing unnecessary console log statements.
These logs were primarily used for debugging and are no longer needed in the production code.
This reduces noise in the console and improves overall performance.
Allows users to drag timed events to the header area to convert them to all-day events.
This also enables dragging all-day events to different days
by updating the grid column position.
A header mouseover detection is set up to emit the 'header:mouseover' event,
handling both the timed event to all-day conversion and the
all-day event movement to different days.
Refactors all-day event container creation to be lazy, improving
initial load performance. The container is now created and animated
into view only when needed, specifically when the first event is
dragged into the all-day section. This avoids unnecessary DOM
manipulation and improves the perceived responsiveness of the
calendar.
Refines the drag and drop functionality in the event renderer.
Ensures proper cleanup and normalization of event clones after a drag operation.
Adds logging for debugging purposes.
Initializes drag event listeners within the DateEventRenderer class to ensure listeners are set up.
Introduces a DragDropManager to handle event dragging and dropping, replacing the ColumnDetector.
This change centralizes drag and drop logic, improving code organization and maintainability.
The EventRenderer now uses the DragDropManager's events to visually update the calendar during drag operations.
Removes ColumnDetector which is now replaced by the drag and drop manager.
Ensures the all-day event container's grid layout is correctly updated to reflect the number of rows needed, even when the overall height doesn't change.
This prevents layout issues when events are rearranged without triggering a height recalculation.
Also updates the grid template when the height is updated in the BaseEventRenderer.
Refactors all-day event container handling to improve rendering and event delegation.
Ensures all-day containers are consistently created and managed,
preventing issues with event display and drag-and-drop functionality.
Moves event listener setup into dedicated methods for better
organization and reusability.
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.
Enhances the drag and drop functionality by snapping the dragged element to a grid and ensuring continuous updates during auto-scroll.
The changes include tracking mouse position for consistent clone positioning, snapping to 15-minute intervals, and updating clone position during auto-scroll.
Also, removes unnecessary logging.
Adds auto-scrolling functionality to the column detector when dragging elements near the edges of the scrollable container.
This enhances the drag and drop experience by automatically scrolling the content when the user drags an element close to the top or bottom of the visible area.
The auto-scroll is triggered when the mouse cursor is within a defined threshold of the container's edges and stops when the mouse moves outside of the threshold.
A check is also added to ensure auto-scroll stops when the user releases the mouse button.
Enhances the drag and drop experience for all-day events by expanding the header to display the all-day row when dragging an event over it.
Introduces constants for all-day event layout.
Enhances the drag-and-drop experience for event elements by
introducing snapping to a configurable time interval and fading out
the original element upon successful drop.
This change allows users to configure the snap interval in minutes,
making it easier to align events to specific time slots. It also
adds visual feedback by making the original event transparent during
the drag and fading it out on drop, providing a clearer indication
of the event's movement.
Introduces a new manager responsible for detecting the column the mouse is currently over.
This enables event cloning and repositioning within the calendar columns during drag operations, enhancing the user experience.
Improves event rendering by introducing dedicated event
renderers and streamlining event display logic.
- Adds a base event renderer and specialized date and
resource-based renderers to handle event display logic.
- Renders all-day events within a dedicated container in the
calendar header.
- Removes the direct filtering of all-day events from the
`GridManager`.
- Fixes an issue where the 'Summer Festival' event started on the
wrong date.
The changes enhance the flexibility and maintainability of the
calendar, provide dedicated containers and styling for allday events and fix date issues related to certain events
Implements a fuzzy search filter system using Fuse.js to enhance event searching.
This system allows users to quickly find events by typing partial matches of event titles or descriptions, providing visual feedback by dimming non-matching events. The filter persists during navigation and includes escape key support for quick clearing. It also includes performance optimizations like requestAnimationFrame debouncing.
Introduces work hours management with weekly default and date-specific overrides to support per-column scheduling.
Calculates and applies non-work hour overlays to columns.
This allows users to visualize working and non-working times.
Adjusts event rendering to prevent overlap with horizontal timelines.
Introduces basic month view structure and styling with week numbers.
Creates expanded month view with event details and duration-based sizing.
Moves event color handling to CSS classes for better flexibility and theming.
Updates the codebase to utilize `CalendarMode` instead of the deprecated `CalendarType`.
Simplifies `CalendarConfig` by removing legacy methods and related type aliases, enhancing code maintainability and clarity.
Improves event rendering by ensuring `GRID_RENDERED` events include explicit start and end dates, preventing errors and ensuring correct data filtering.
Improves calendar performance and data flow by streamlining event emissions and grid rendering logic.
- Replaces generic CONFIG_UPDATE events with REFRESH_REQUESTED
for more specific refresh triggers.
- Removes redundant grid re-renders on DATE_CHANGED and
WEEK_CHANGED events, delegating navigation to NavigationManager.
- Introduces VIEW_CHANGED and DATE_CHANGED events for calendar
mode and date selection, respectively.
- NavigationManager now handles date validation.
- Moves rendering logic from NavigationManager to NavigationRenderer.
- Syncs scroll position based on PERIOD_CHANGED instead of
NAVIGATION_ANIMATION_COMPLETE.
This change optimizes the calendar's responsiveness and reduces
unnecessary re-renders, leading to a smoother user experience.
Migrates the application to use a new CoreEvents system.
This change removes the legacy EventTypes constant file and updates all managers, renderers, and core components to use the CoreEvents constant file for event emission and subscription.
This improves code maintainability and promotes a consistent eventing strategy across the application. Adds validation to EventBus emit and extractCategory functions.
Refactors the grid management to use a strategy pattern, allowing for different calendar views (week, month, day) to be rendered using separate strategy implementations.
This approach improves code organization, reduces complexity within the main grid manager, and makes it easier to add new view types in the future.
The strategy pattern centralizes view-specific logic, improves testability, and reduces code duplication.
A month view strategy has been added and is now selectable via UI.
Prepares the calendar component for month view implementation
by introducing a strategy pattern for view management,
splitting configuration settings, and consolidating events
into a core set. It also removes dead code and enforces type safety,
improving overall code quality and maintainability.
Addresses critical issues identified in the code review,
laying the groundwork for efficient feature addition.