Epoch Documentation

Public Properties & Methods:

These are the properties and methods you can access and manipulate in your scripts. They are roughly ordered in terms of most-frequent usage

Properties:

Format: Name – Type

state – Int

The current state of the calendar – 0: initializing, 1: redrawing, 2: finished.

name – String

A unique identifier for the calendar – ideally the same as the variable name for the calendar. It is prepended in front of any id attributes for its child elements.

curDate – Date

The current date (NOT the currently selected date)

selectedDates – Array

An array containing all the dates selected on the calendar. If the selectMultiple configuration property is set to false, it only contains one element - selectedDates[0]

displayYear – Int

The currently displayed 4-digit year – must respect UNIX date parameters (i.e. between 1970 and 2038). Do not set this manually — use goToMonth() instead.

displayMonth – Int

The currently displayed month, in JavaScript Notation (i.e. 0 (January) to 11 (December)). Do not set this manually — use goToMonth() instead.

visible – Bool

Indicates whether the calendar is showing (true) or hidden (false).

Methods:

Format: Name – Return Type

show() – none

Display the Calendar

hide() – none

Hide the Calendar from view

toggle() – none

Displays or hides the Calendar, based on whether it is currently showing or hidden

goToMonth(Int year, Int month) – none

Go to the requested month/year.

nextMonth() – none

Advances the month by 1. If the month is December, go to January of the next year

prevMonth() – none

Advances the month by 1. If the month is January, go to December of the previous year

outputDate(Date vDate, String vFormat) – String (Deprecated)

Takes the JavaScript Date object vDate and outputs a date string of the format vFormat

addDates(Array dates, bool redraw) – none (version 1.0.4 and above)

Adds an array of JavaScript Date Objects to the calendar's selectedDates array, redrawing the calendar if redraw is true (default).

removeDates(Array dates, bool redraw) – none (version 1.0.4 and above)

Removes the JavaScript Date Objects in dates from the calendar's selectedDates array, redrawing the calendar if redraw is true (default).

UpdatePos(HTMLElement target) – none

Moves the calendar to the HTML Element specified by target. Useful when page layout is changed after being loaded.

Configuration Variables

These variables are set by the programmer and are initialized upon calendar construction. Their scope is private, and as a rule should not be set after the calendar is initialized.

mode – String

The primary mode of the calendar: can be 'flat' (Standard) or 'popup' (DatePicker)

displayYearInitial – Int

The initial 4-digit year to display on calendar construction (1970 to 2038)

displayMonthInitial – Int

The initial month to display on load (0-11)

minDate – Date

The lowest date allowed on the calendar.

maxDate – Date

The highest date allowed on the calendar.

startDay – Int

The day the week will 'start' on: 0(Sun) to 6(Sat)

showWeeks – Bool

Whether the week numbers will be shown next to the calendar cells

selCurMonthOnly – Bool

Restrict user from selecting dates outside the currently displayed month

clearSelectedOnChange – Bool

Whether to clear all selected dates when changing months

Flat mode-only settings:

Flat mode sets the calendar to a block-level HTML element that by default will always display. This mode also allows the programmer to allow the user to select multiple dates sumultaneously.

selectMultiple – Bool

whether the user can simultaneously select multiple dates.

Popup mode-only settings:

Popup mode initializes the calendar to behave like a datepicker. i.e. it will display only when its target element has focus, disappearing when the user clicks on a date in the calendar. In this mode the user may not select multiple dates simultaneously.

topOffset – Int

The vertical distance (in pixels) to display the calendar from its input element.

leftOffset – Int

The horizontal distance (in pixels) to display the calendar from its input element.

Private Properties & Methods:

Familiarity with these properties and methods is only necessary if you plan to modify the internal workings of the calendar. Because the privacy of these properties and methods is not enforced in this version, it is strongly recommended you do not access them in your code, as they may be unavailable in future versions.

Properties

Format: Name – Type

calendar – HTMLTableElement

Holds the entirety of the DOM elements related to the calendar. This is appended to the element described in container in the calendar constructor

calHeading – HTMLTableElement

Holds the DOM elements related to the Day display above the calendar cells

calCells – HTMLTableElement

Table containing all of the table cells displaying the dates for the currently displayed month

rows – Array (Bool)

An array of boolean values describing whether the related row has been selected by the user. Applicable only when selectMultiple and showWeeks are true

cols – Array (Bool)

An array of boolean values describing whether the related column has been selected by the user. Applicable only when selectMultiple is true

cells – Array (Object CalCell)

A numerically-indexed array of CalCell objects – length will match that of the total cells in the calCells table.

container – HTMLElement

The HTML Element the calendar is the child of in the DOM. Ideally, this should only contain the calendar.

tgt – HTMLInputElement

The HTML Input Element whose value will be manipulated when the user selects a date. Should be of type text or hidden

Methods

Format: Name – Return Type

getTop(HTMLElement element) – Int

Returns the absolute Top property value of an element, with respect to the absolute top of BODY

getLeft(HTMLElement element) – Int

Returns the absolute Left property value of an element, with respect to the absolute left of BODY

calConfig() – none

Function where the programmer-set variables are initialized

setLang() – none

Initializes language-related constants. Can be modified to change the language of the calendar.

setDays() – none

Initializes the basic day of week-related variables

setClass(HTMLElement element, String className) – none

Encapsulates the setAttribute DOM function to work with CSS classes on both W3C and Internet Explorer

createCalendar() – none

Creates the top-level Calendar HTMLTableElement and adds all child elements to it, finally adding it to the containing element

createMainHeading() – HTMLDivElement

Creates the DOM implementation of the main calendar heading & requisite child elements; including the month/year select elements and buttons

createFooter() – HTMLDivElement

Creates the Footer of the calendar & requisite child elements

createDayHeading() – HTMLTableElement

Creates the DOM implementation of the day headings, as well as initialization of the CalHeading objects if selectMultiple is true

resetSelections(Bool returnToDefaultMonth) – none

Resets the selection variables (selectedDates, rows, cols, and others) to their default values. Returns calendar to initial month if returnToDefaultMonth is true

createCalCells() – HTMLTableElement

Creates the DOM implementation of the calendar date cells, including the CalCell Objects and related event handlers, and the week headings, if showWeeks is true

reDraw() – none

Updates the CSS classes (styles) of the calendar date cells to reflect their status.

deleteCells() – none

Removes and destroys the DOM implementations of the date cells and their related CalCell objects

addZero() – String

Adds a leading zero to single-digit integers; used in formatting dates.

Additional Methods for the JavaScript Date Object

These are methods added to the JavaScript Date object to extend it's functionality. These methods will be automatically added to any Date object used when the Epoch class file is present.

int getDayOfYear()

Gets the day of the year for the given date (i.e. 1 for January 1, 365 for December 31). Takes leap years into account.

int getWeek()

Gets the week of the year for the given date.

int getUeDay() – version 1.0.4

Gets the number of days since the UNIX epoch, adjusting the result for the local timezone – useful for comparing dates without times.

string dateFormat(string format) – version 1.0.4

Formats the date in the format specified in format. If format is NOT set, it will default to the ISO 8601 date/time standard (i.e. 2006-04-05 20:52:21) The format string components are the same as the PHP date() function, with minor exceptions.

The format string consists of the following abbreviations:

Days

format character	Description	Example returned values
d	Day of the month, 2 digits with leading zeros	01 to 31
D	A textual representation of a day, three letters	Mon through Sun
j	Day of the month without leading zeros	1 to 31
l (lowercase 'L')	A full textual representation of the day of the week	Sunday through Saturday

Month

format character	Description	Example returned values
F	A full textual representation of a month, such as January or March	January through December
m	Numeric representation of a month, with leading zeros	01 through 12
M	A short textual representation of a month, three letters	Jan through Dec
n	Numeric representation of a month, without leading zeros	1 through 12

Year

format character	Description	Example returned values
Y	A full numeric representation of a year, 4 digits	1999 or 2003
y	A two digit representation of a year	99 or 03

Time

format character	Description	Example returned values
a	Lowercase Ante meridiem and Post meridiem	am or pm
A	Uppercase Ante meridiem and Post meridiem	AM or PM
g	12-hour format of an hour without leading zeros	1 through 12
G	24-hour format of an hour without leading zeros	0 through 23
h	12-hour format of an hour with leading zeros	01 through 12
H	24-hour format of an hour with leading zeros	00 through 23
i	Minutes with leading zeros	00 to 59
s	Seconds, with leading zeros	00 through 59