Janus007/Calendar
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Consolidates all-day event row limit

Browse source 
Centralizes the maximum number of displayed all-day event rows into a single constant.

This change ensures consistency and simplifies management of the all-day event row limit across the application.

Corrects off-by-one error in overflow count.
This commit is contained in:
Janus C. H. Knudsen 2025-10-02 15:37:01 +02:00
parent 135787146c
commit 0f2d96f76f
2 changed files with 14 additions and 10 deletions
Download patch file Download diff file Expand all files Collapse all files

1
src/core/CalendarConfig.ts
View file

@ -12,6 +12,7 @@ export const ALL_DAY_CONSTANTS = {
EVENT_HEIGHT: 22, // Height of single all-day event
EVENT_GAP: 2, // Gap between stacked events
CONTAINER_PADDING: 4, // Container padding (top + bottom)
MAX_COLLAPSED_ROWS: 4, // Show 4 rows when collapsed (3 events + 1 indicator row)
get SINGLE_ROW_HEIGHT() {
return this.EVENT_HEIGHT + this.EVENT_GAP; // 28px
}

15
src/managers/AllDayManager.ts
View file

@ -37,7 +37,7 @@ export class AllDayManager {
// Expand/collapse state
private isExpanded: boolean = false;
private actualRowCount: number = 0;
private readonly MAX_COLLAPSED_ROWS = 4; // Show 4 rows when collapsed (3 events + 1 indicator row)
constructor(eventManager: EventManager) {
this.eventManager = eventManager;
@ -215,14 +215,14 @@ export class AllDayManager {
// Determine what to display
let displayRows = maxRows;
if (maxRows > this.MAX_COLLAPSED_ROWS) {
if (maxRows > ALL_DAY_CONSTANTS.MAX_COLLAPSED_ROWS) {
// Show chevron button
this.updateChevronButton(true);
// Show 4 rows when collapsed (3 events + indicators)
if (!this.isExpanded) {
displayRows = this.MAX_COLLAPSED_ROWS;
displayRows = ALL_DAY_CONSTANTS.MAX_COLLAPSED_ROWS;
this.updateOverflowIndicators();
} else {
@ -461,6 +461,9 @@ export class AllDayManager {
element.style.gridRow = layout.row.toString();
element.style.gridColumn = `${layout.startColumn} / ${layout.endColumn + 1}`;
if (layout.row > ALL_DAY_CONSTANTS.MAX_COLLAPSED_ROWS)
element.style.display = "none";
// Remove transition class after animation
setTimeout(() => element.classList.remove('transitioning'), 200);
}
@ -550,15 +553,15 @@ export class AllDayManager {
columns.forEach((columnBounds) => {
let totalEventsInColumn = this.countEventsInColumn(columnBounds);
let overflowCount = Math.max(0, totalEventsInColumn - 3);
let overflowCount = totalEventsInColumn - ALL_DAY_CONSTANTS.MAX_COLLAPSED_ROWS
if (overflowCount > 0) {
// Create new overflow indicator element
let overflowElement = document.createElement('swp-event');
overflowElement.className = 'max-event-overflow';
overflowElement.style.gridRow = '4';
overflowElement.style.gridRow = ALL_DAY_CONSTANTS.MAX_COLLAPSED_ROWS.toString();
overflowElement.style.gridColumn = columnBounds.index.toString();
overflowElement.innerHTML = `<span>+${overflowCount} more</span>`;
overflowElement.innerHTML = `<span>+${overflowCount + 1} more</span>`;
overflowElement.onclick = (e) => {
e.stopPropagation();
this.toggleExpanded();