Using the `dates` array in Epoch

The dates array forms the core of Epoch, containing all important dates, holidays, and events.

Users familiar with the free Epoch version may wonder what happened to the selectedDates array. The dates array in Epoch replaces the function of selectedDates.

Overview

dates is an array contains all dates of importance for Epoch. Dates of importance include any date that is not the default standard, non-selected date. Use dates to specify dates that are holidays, have custom HTML/titles, are not selectable, or are otherwise important to the user.

selectedDates is an array containing all dates that are currently selected in Epoch. It is a simple pointer array; each element is a pointer to a date in the dates array—it is updated automatically whenever a date is selected/deselected.

Because of the complex nature of date handling in Epoch, we strongly recommend you do not add or remove dates from dates or selectedDates using the push(), pop(), or any other array methods. Instead, use Epoch's addDates(), selectDates(), removeDates(), and resetSelections() methods.

A few additions to the dates stored in `dates`

To allow the extra features in Epoch, a few modifications have been made to the dates that reside in the dates array, namely the addition of several extra properties. These are:

canSelect

A boolean (true/false) value – whether this date's calendar cell may be selected.

selected

A boolean (true/false) value – whether this date's calendar cell is currently selected.

type

A string (can be 'normal', or 'holiday') value – if a date is a 'holiday', its calendar cell will have a different color (which you can specify in epoch_styles.css).

title

A string (can be any text) value – contains the HTML title (or tooltip) that displays when the user hovers their mouse cursor over this date's calendar cell. You can use this to give hints or brief information about this date to the user.

href

A string (can be any text) value containing a URL for this date. A cell that has a date with a URL will have a hyperlink over the day of the month—you can choose to make it a traditional link (i.e. when the user clicks on the day number only), or a JavaScript link (user clicks anywhere in the cell). See the setURL() entry in the CalCell Object entry for more details.

cellHTML

A string (can be any text) value – contains any HTML you want to display under the date number in this date's calendar cell. Since by default Epoch's caledar cells are quite small, we recommend you change the default size of the calendar cells by modifying epoch_styles.css.

Adding Dates to the `dates` Array

Adding and removing dates to Epoch is quick and painless using the addDates() and removeDates() methods.

Using `addDates()`

Declare and initialize the dates

var date1 = new Date(2006,0,1) //Jan 1, 2006
var date2 = new Date(2006,3,1) //Apr 1, 2006

Add any custom attributes, such as type, cellHTML, etc.

//set the attribute values for date1 - if you don't set an attribute value, it will simply default to blank.
date1.title = "New Year's day bash at Stevo's house!";
date1.cellHTML = "<img src="/images/steveo.jpg"/> 123 Main St.<br/>B.Y.O.B";
//set attribute values for date2
date2.type = "holiday";
date2.title = "April Fool's day!";

Create an array and fill it with the newly-created dates. var myArray = new Array(date1,date2);

Pass the array to Epoch's addDates() method.

mycalendar1.addDates(myArray); //add the dates and display them on the calendar!

Epoch will process the dates and add them to the dates array, then redraw itself to show the new dates!

Removing Dates from Epoch

Using `removeDates()`

Create an array containing the dates you want to remove:

var date1 = new Date(2006,0,1); //Jan 1, 2006
var date2 = new Date(2006,3,1); //Apr 1, 2006
var removeArray = new Array(date1,date2);

Call the removeDates() method
```
mycalendar.removeDates(removeArray);
```

Resetting the `dates` Array

Resetting the dates array is easy; you can:

Call the resetSelections() method (preferred). This will remove all normal selected dates, keeping holidays and blackout dates intact.

mycalendar.resetSelections() //clear all dates, rows, and columns
mycalendar.resetSelections(true) //same as above, but returns calendar to default month/year

Reset the dates array manually. This will remove all dates, including holidays and blackout dates.
```
mycalendar.dates = new Array(); //works, but resetSelections() is preferred.
```

Using the dates array in Epoch