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.
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.
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.
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 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.
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.
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.
Centralizes all date calculations into a new `DateCalculator` class for better maintainability and consistency.
Ensures correct ISO week handling (Monday as the first day) throughout the calendar.
Updates `CalendarConfig` to use ISO day numbering (1-7 for Mon-Sun) for work week definitions.
Fixes issue where date calculations were inconsistent.
Enhances event rendering and navigation.
Updates navigation logic to use pre-rendered events.
Removes the need for `CONTAINER_READY_FOR_EVENTS` event.
Refactors how the calendar week information is updated to use the actual rendered column dates, ensuring accuracy after workweek changes. It also adjusts event rendering to target the swp-calendar-container element, preventing rendering issues. The change also addresses a styling issue that was preventing the scroll bar from appearing in the correct location.
Implements configurable work week presets, allowing users to customize the days displayed in the calendar.
This includes:
- Defining work week settings (work days, day names, total days).
- Providing predefined work week presets (standard, compressed, weekend, full week).
- Adding UI elements to switch between presets.
- Updating grid and header rendering logic to reflect the selected work week.
- Emitting events when the work week changes, triggering necessary UI updates and data re-renders.
This provides a more flexible and personalized calendar experience.
Replaces custom scrollbar implementation with native scrollbars for better performance and accessibility.
Adds configuration options for scrollbar styling, including width, color, track color, hover color, and border radius.
Synchronizes week header and time axis scrolling with the scrollable content.
Refactors event rendering to leverage CSS for styling.
This change simplifies the event renderer by removing styling logic from the Typescript code and placing it in the CSS file. This improves maintainability and allows for easier customization of event appearance. Hover effects are also moved to CSS for consistency.
Improves event rendering by adding styling, filtering out all-day events (handled by GridManager), and calculating accurate positioning within the time grid.
Optimizes grid updates to avoid unnecessary rebuilding, instead updating only the week header for all-day events, leading to better performance.
Improves calendar week view by adding header sections.
This change introduces two new header sections, styled with an orange background, to the calendar week view. These sections are positioned in the second row of the week header, enhancing the visual organization and potentially providing space for additional information or actions related to the week view. The overall height of the header has also been adjusted to accommodate the new row.
Updates mock event data to reflect a more recent week and includes events spanning early/late hours.
Enhances event rendering by adjusting the top and height styles for better visual appearance.
Refactors CSS to improve grid line display and event hover effects, and moves hour marker styles to a more appropriate CSS file.
Provides default fallback values for time boundaries using CSS variables.
Updates mock event data to reflect future dates for testing purposes.
Adds console logging in various managers to aid in debugging and understanding the event loading and rendering process.
Specifically, logs the number of loaded events, the first and last event details, and information about event rendering and time axis creation.
Also, adds execution permission for PowerShell scripts in the .claude settings.
Changes the calendar week view to dynamically adjust its width based on the `--day-column-min-width` CSS variable.
This allows for more flexible and responsive layouts, avoiding fixed widths.
Also, the base calendar CSS file is now included in the index file.
Updates the grid structure to correctly position the scrollbars.
Replaces fixed scrollbars with a grid-based layout using spacers and
a right column for a more integrated and maintainable solution.
This change addresses layout issues related to scrollbar positioning
and ensures better alignment across different browsers.
Lowers the z-index of the week header to ensure it slides under the header-spacer during horizontal scrolling.
This prevents the week header from overlapping the header-spacer, improving the visual flow of the calendar layout.
Implements fixed scrollbars at the browser edges to enhance navigation within the calendar view. This ensures that the scrollbars remain visible regardless of the user's scroll position, providing consistent access to horizontal and vertical scrolling.
Removes the right header spacer and right column, integrating their functionality into the new fixed scrollbar components.
Additionally, synchronizes the week header position with the horizontal scroll, improving the user experience.
Scrollbar hiding is now handled in the CSS file.
Adjusts z-index values to ensure the week header and header spacer
elements cover the time axis during scrolling. This prevents visual
artifacts and improves the overall user experience.
Adds custom scroll management for the calendar week view, replacing native scrollbars with a custom handle.
Introduces categorized event logging with console grouping and styling, enhancing debug output. It also allows configuring logging for specific event categories.
