DayCellCollecter

Configs

eventFilter: function | String

A function, or the name of a function in the ownership hierarchy to filter which events are collected into the day cell data blocks. Return true to include the passed event, or a falsy value to exclude the event.

Parameter	Type	Description
`event`	EventModel	the passed event

Returns: Boolean

stackMultiDayEvents: Boolean= falseAlso a property

Set to true to stack multi-day events within each cell in the order of their start time.

When this property is set, multi day events will not sort to the top of day cells and flow in the same row from cell to cell.

Rather, the bar in the start cell will be sorted by its start time. In future cells, its bar will be sorted to the top of the cell.

Properties

Class hierarchy

isDayCellCollecter: Boolean= truereadonly

Identifies an object as an instance of DayCellCollecter class, or subclass thereof.

isDayCellCollecter: Boolean= truereadonlystatic

Identifies an object as an instance of DayCellCollecter class, or subclass thereof.

Other

stackMultiDayEvents: Boolean= falseAlso a config

Set to true to stack multi-day events within each cell in the order of their start time.

When this property is set, multi day events will not sort to the top of day cells and flow in the same row from cell to cell.

Rather, the bar in the start cell will be sorted by its start time. In future cells, its bar will be sorted to the top of the cell.

Events

cellMapPopulated

Fired when a new set of events has been gathered for this view's date range.

// Adding a listener using the "on" method
dayCellCollecter.on('cellMapPopulated', ({ cellMap }) => {

});

Parameter	Type	Description
`cellMap`	Map	The map of date keys to day cell data blocks.

dayCellPopulated

Fired after one day cell's events are collected in sorted order according to the eventSorter

An application may use this to intervene in the event load received by the UI by mutating the events array.

// Adding a listener using the "on" method
dayCellCollecter.on('dayCellPopulated', ({ events, The }) => {

});

Parameter	Type	Description
`events`	EventModel[]	The events to be shown for the passed date
`The`	Date	date the events are to be shown in.

eventPropagate

Fires when a day spanning event is found, and the date to which its encapsulating event bar extends has been calculated.

The default result in the event's propagateEndDate property may be mutated by a listener.

Note that this is an ending point in time, it does not refer to a 24 hour block. So setting the propagateEndDate to new Date(2022, 1, 10) means that the event bar will occupy cells up to and including February 9 2022 and no further.

This is relayed through the owning Calendar, so a single listener may be used, for example:

new Calendar({
    listeners : {
        eventPropagate(eventData) {
            // If the event only spills into the next day but not further
            // then we do not want an extended event bar.
            // An arrow will indicate that it continues rightwards.
            if (eventData.eventEndDate < DateHelper.add(eventData.date, 2, 'd')) {
                eventData.propagateEndDate = DateHelper.add(DateHelper.clearTime(eventData.eventRecord.startDate), 1, 'd');
            }
        }
    }
})

The eventEndDate in the data block may also be changed to override the event's real end date. This will mean that there will be no arrow indicating that the event continues:

new Calendar({
    listeners : {
        eventPropagate(eventData) {
            // If the event spills into the next day but not further
            // then we do not want an extended event bar.
            // Because we override the eventEndDate, no arrow will be present
            // to indicate any continuation.
            if (eventData.eventEndDate < DateHelper.add(eventData.date, 2, 'd')) {
                eventData.propagateEndDate = eventData.eventEndDate = DateHelper.add(DateHelper.clearTime(eventData.eventRecord.startDate), 1, 'd');
            }
        }
    }
});

// Adding a listener using the "on" method
dayCellCollecter.on('eventPropagate', ({ eventEndDate, propagateEndDate, isAllDay, isOverflow, overflows, eventRecord, date }) => {

});

Parameter	Type	Description
`eventEndDate`	Date	The end date for which to calculate the propagate end date.
`propagateEndDate`	Date	The system-calculated end point of the event bar.
`isAllDay`	Boolean	`true` if the event is an all day event, or spans multiple days.
`isOverflow`	Boolean	`true` if this is being called as part of further propagation.
`overflows`	Boolean	`true` if the event extends into future cells.
`eventRecord`	EventModel	The event record being propagated.
`date`	Date	The date from which the event is being propagated.

Event handlers

onCellMapPopulated

Called when a new set of events has been gathered for this view's date range.

new DayCellCollecter({
    onCellMapPopulated({ cellMap }) {

    }
});

Parameter	Type	Description
`cellMap`	Map	The map of date keys to day cell data blocks.

onDayCellPopulated

Called after one day cell's events are collected in sorted order according to the eventSorter

An application may use this to intervene in the event load received by the UI by mutating the events array.

new DayCellCollecter({
    onDayCellPopulated({ events, The }) {

    }
});

Parameter	Type	Description
`events`	EventModel[]	The events to be shown for the passed date
`The`	Date	date the events are to be shown in.

onEventPropagate

Called when a day spanning event is found, and the date to which its encapsulating event bar extends has been calculated.

The default result in the event's propagateEndDate property may be mutated by a listener.

This is relayed through the owning Calendar, so a single listener may be used, for example:

new Calendar({
    listeners : {
        eventPropagate(eventData) {
            // If the event only spills into the next day but not further
            // then we do not want an extended event bar.
            // An arrow will indicate that it continues rightwards.
            if (eventData.eventEndDate < DateHelper.add(eventData.date, 2, 'd')) {
                eventData.propagateEndDate = DateHelper.add(DateHelper.clearTime(eventData.eventRecord.startDate), 1, 'd');
            }
        }
    }
})

The eventEndDate in the data block may also be changed to override the event's real end date. This will mean that there will be no arrow indicating that the event continues:

new Calendar({
    listeners : {
        eventPropagate(eventData) {
            // If the event spills into the next day but not further
            // then we do not want an extended event bar.
            // Because we override the eventEndDate, no arrow will be present
            // to indicate any continuation.
            if (eventData.eventEndDate < DateHelper.add(eventData.date, 2, 'd')) {
                eventData.propagateEndDate = eventData.eventEndDate = DateHelper.add(DateHelper.clearTime(eventData.eventRecord.startDate), 1, 'd');
            }
        }
    }
});

new DayCellCollecter({
    onEventPropagate({ eventEndDate, propagateEndDate, isAllDay, isOverflow, overflows, eventRecord, date }) {

    }
});

Parameter	Type	Description
`eventEndDate`	Date	The end date for which to calculate the propagate end date.
`propagateEndDate`	Date	The system-calculated end point of the event bar.
`isAllDay`	Boolean	`true` if the event is an all day event, or spans multiple days.
`isOverflow`	Boolean	`true` if this is being called as part of further propagation.
`overflows`	Boolean	`true` if the event extends into future cells.
`eventRecord`	EventModel	The event record being propagated.
`date`	Date	The date from which the event is being propagated.

Typedefs

DayCell

A data block created by all DayCellCollecter Calendar views to encapsulate occupied day cells and the events which intersect with each date to be shown in the UI. All useful data about the date and the shape of the UI is included.

Parameter	Type	Description
`view`	CalendarView	The owning view of the cell.
`date`	Date	The date of the cell.
`key`	String	a `YYYY-MM-DD` formatted date key for the cell.
`cellIndex`	Number	The overall cell index in the cell-based UI being created.
`day`	Number	The day of week for the cell: 0=Sunday, 6=Saturday
`columnIndex`	Number	The column index in the cell-based UI being created.
`visibleColumnIndex`	Number	The visible column index (eg 0 for a Monday if Sunday is the week start day, but was hidden)
`isNonWorking`	Boolean	`true` if the owning view considers the date a non-working day.
`week`	Number[]	The `[year, week]` encapsulating the cell.
`isOtherMonth`	Boolean	The cell is outside the view's primary time range. Only significant when used by a CalendarPanel which encapsulates a single month.
`visible`	Boolean	`true` if the date cell is not for a hidden day.
`tomorrow`	Date	The date of the following cell.
`isRowStart`	Boolean	`true` if the cell is at the start of a visible row.
`isRowEnd`	Boolean	`true` if the cell is at the end of a visible row.
`hasOverflow`	Boolean	`true` if the `renderedEvents` overflow the cell height and require a `+n more` button.
`events`	EventModel[]	The events which are to be shown for this date.
`resource`	ResourceModel	Note this only exists when the cell is owned by a subview of a ResourceView, or while creating resource columns in a DayResourceView.
`renderedEvents`	EventBar[]	If this view renders event bars (MonthView, CalendarRow), then this is an array of event bar definitions which belong in the cell. Whether all can be rendered depends upon the view's configured eventHeight and whether the cell is of fixed height. The `hasOverflow` property is set if the rendered events overflow a cell's fixed capacity.
`resourceDayEvents`	EventModel[]	The events for the passed resource for the day (applies in a `DayResourceCalendarRow`) column
`timeRanges`	TimeRangeModel[]	All time ranges which intersect with this date cell, including short ones which are rendered.
`allDayTimeRanges`	TimeRangeModel[]	The all day time ranges which intersect with the whole day of this date cell.

EventBar

A data block which describes how an event bar is to be rendered into a day cell.

Parameter	Type	Description
`eventRecord`	EventModel	The event record for which the event bar is being rendered.
`propagateEndDate`	Date	The date of the last cell into which the event bar will extend.
`cls`	DomClassList	The CSS classes to apply to the event bar.
`iconCls`	DomClassList	The CSS classes to apply to an event icon.
`dataset`	Object	Property names and values to be applied to the Event bar's DOM `dataset`
`eventColor`	String	Either a predefined colour name, or a DOM colour value to apply to the event bar.
`isAllDay`	Boolean	`true` if the event is flagged as an all day event in its data, or if it spans a day boundary and occupies more than one cell.
`isOverflow`	Boolean	`true` if this event bar is a continuation from a previous cell.
`overflows`	Boolean	`true` if this event bar flows into the next cell.
`solidBar`	Boolean	`true` if the event bar is to be rendered with a solid background of its defined colour. All day events are solid by default.