Month

A class which encapsulates a calendar view of a month, and offers information about the weeks and days within that calendar view.

  // December 2018 using Monday as week start
  const m = new Month({
      date         : '2018-12-01',
      weekStartDay : 1
  });

  m.eachWeek((week, dates) => console.log(dates.map(d => d.getDate())))

Useful configs and functions

Config / Function	Description
date	Date the month encapsulates
weekStartDay	First day of the week (0=Sun, 6=Sat)
eachWeek	Iterate over each week with its dates
eachDay	Iterate over each day in the month

Configs

Configs are options you supply in a configuration object when creating an instance of this class

date : Date/String

The date which the month should encapsulate. May be a Date object, or a YYYY-MM-DD format string.

Mutating a passed Date after initializing a Month object has no effect on the Month object.
hideNonWorkingDays : Boolean

Configure as true to have the visibleDayColumnIndex and visibleColumnCount properties respect the configured nonWorkingDays.
nonWorkingDays : Object<String, Boolean>

Non-working days as an object where keys are day indices, 0-6 (Sunday-Saturday), and the value is true. Defaults to nonWorkingDays.
sixWeeks : Boolean

Configure as true to always have the month encapsulate six weeks. This is useful for UIs which must be a fixed height.

Has a corresponding runtime sixWeeks property.
weekStartDay : Number

The week start day, 0 meaning Sunday, 6 meaning Saturday. Defaults to weekStartDay.

Properties

Properties are getters/setters or publicly accessible variables on this class

canonicalDayNumbers : Number[]

READONLY

For use when this Month's weekStartDay is non-zero.

An array to map the days of the week 0-6 of this Calendar to the canonical day numbers used by the Javascript Date object.

dayColumnIndex : Number[]

READONLY

An array to map a canonical day number to a 0-6 column index. For example, if we have weekStartDay as Monday which is 1, then the calendar would look like

┌────┬────┬────┬────┬────┬────┬────┐
| Mo | Tu | We | Th | Fr | Sa | Su |
└────┴────┴────┴────┴────┴────┴────┘

So we'd need this array: [ 6, 0, 1, 2, 3, 4, 5]

dayCount : Number

READONLY

The number of days in the calendar for this month. This will always be a multiple of 7, because this represents the number of calendar cells occupied by this month.
endDate : Date

READONLY

The date of the last cell in the calendar view of this month.
firstDate : Date

READONLY

The first date of the current month.
lastDate : Date

READONLY

The last date of the current month.
sixWeeks : Boolean

Configure as true to always have the month encapsulate six weeks. This is useful for UIs which must be a fixed height.

Has a corresponding sixWeeks config.
startDate : Date

READONLY

The date of the first cell in the calendar view of this month.
visibleDayColumnIndex : Number[]

READONLY
An array to map a canonical day number to a visible column index. For example, if we have weekStartDay as Monday which is 1, and non working days as Wednesday, and hideNonWorkingDays : true, then the calendar would look like
```
┌────┬────┬────┬────┬────┬────┐
| Mo | Tu | Th | Fr | Sa | Su |
└────┴────┴────┴────┴────┴────┘
```
So we'd need this array: [ 5, 0, 1, undefined, 2, 3, 4]
weekCount : Number

READONLY

The number of weeks in the calendar for this month.
weekLength : Number

READONLY

The number of visible days in the week as defined by the nonWorkingDays and hideNonWorkingDays options.

Functions

Functions are methods available for calling on the class

eachDay( fn )

Iterates through all calendar cells in this month, calling the passed function for each date.
eachWeek( fn )

Iterates through all weeks in this month, calling the passed function for each week.
getWeekNumber( date )
: Number[]

Returns the week of the year for the passed date. This returns an array containing two values, the year and the week number are returned.

The week number is calculated according to ISO rules, meaning that if the first week of the year contains less than four days, it is considered to be the last week of the preceding year.

The configured weekStartDay is honoured in this calculation. So if the weekStartDay is NOT the ISO standard of 1, (Monday), then the weeks do not coincide with ISO weeks.
getWeekStart( week )

Returns the week start date, based on the configured weekStartDay of the passed week.

Events

Events are triggered for certain actions in this class and can be listened for to react to those actions in your code

dateChange

Fired when setting the date property causes the encapsulated date to change in any way, date, week, month or year.
monthChange

Fired when setting the date property causes a change of month. This will fire when changing to the same month in a different year.
weekChange

Fired when setting the date property causes a change of week. Note that weeks are calculated in the ISO standard form such that if there are fewer than four days in the first week of a year, then that week is owned by the previous year.

The weekStartDay is honoured when making this calculation and this is a locale-specific value which defaults to the ISO standard of 1 (Monday) in provided European locales and 0 (Sunday) in the provided US English locale.
yearChange

Fired when setting the date property causes a change of year.

Event handlers

Event handlers are callbacks called as a result of certain actions in this class

onDateChange

Called when setting the date property causes the encapsulated date to change in any way, date, week, month or year.
onMonthChange

Called when setting the date property causes a change of month. This will fire when changing to the same month in a different year.
onWeekChange

Called when setting the date property causes a change of week. Note that weeks are calculated in the ISO standard form such that if there are fewer than four days in the first week of a year, then that week is owned by the previous year.

The weekStartDay is honoured when making this calculation and this is a locale-specific value which defaults to the ISO standard of 1 (Monday) in provided European locales and 0 (Sunday) in the provided US English locale.
onYearChange

Called when setting the date property causes a change of year.

Source path

Core/util/Month.js

Inheritance tree1

Month