The EpochPrime Object ReferenceThe EpochPrime Object is the main calendar class that forms the core of the Epoch Prime JavaScript Calendar. It comprises all the calendar properties that you would access from your own JavaScript code (i.e. in a page that contains Epoch Prime). If you want to customize Epoch Prime, this is the place to start. ConstructorThis function runs when a new instance of Epoch Prime is created (i.e. mycalendar = new EpochPrime(...)). It initializes the internal calendar variables and initializes the calendar in the DOM so it may be displayed to the user. Arguments
Return Values(none)UsageThis function runs whenever a new instance of Epoch Prime is created. The targetelement argument is the element Epoch will be associated with. It can be any block-type element (<div>, <td>, <p>, etc) in flat mode, or an <input type="text"> element in popup mode—the easiest way to do this is use the document.getElementById() function; be sure to add an id attribute to the target element. AJAX developers can leave targetelement blank if the calendar will be assigned to an element that is created after the calendar is created. In the meantime, the calendar will be automatically appended to document.body and made invisible until setTarget() is called. The xmlconfig argument can be either a valid XML string or XMLDoc object. All configuration variables may be specified in xmlconfig; those not specified will default to the values in calConfig() and setLang(). In fact, xmlconfig does not need to be specified at all— the calendar will default to flat mode with multiselect enabled. More information on using xmlconfig may be found at the Using XML with Epoch Prime page. Public PropertiesThe most commonly-used properties. These can be accessed in your JavaScript code like any other object's properties, i.e. mycalendar.name='abcd'. stateint {0, 1, 2} EpochPrime::state The draw state of the calendar, can be 0 (initializing), 1 (redrawing), or 2 (ready). namestring EpochPrime::name The base name of the character – used in the DOM to prepend all calendar id attributes. Does not have to be the same as the JavaScript variable name for the calendar, but is recommended. curDateDate EpochPrime::curDate The date to display as the current date in the calendar—defaults to the current date. Note: the current date is not highlighted by default in Epoch Prime. You must set the CSS declaration for table.calcells td.curdate in epochprime_styles.css yourself. modestring {'popup', 'flat'} EpochPrime::mode Whether the calendar will pop up when a control is entered ('popup'), or if displayed inline with the page's HTML ('flat'). mode should NOT be set after calendar initialiation. selectMultiplebool EpochPrime::selectMultiple Whether the user is allowed to highlight multiple dates in the calendar. selectMultiple should not be used in popup/datepicker mode – multi-select is only available in flat mode. datesArray(Date) EpochPrime::dates Contains all dates of importance in the calendar, including selected dates, holidays, and non-selectable dates. UsageWe strongly recommend you do not set the dates array elements manually. Use the addDates(), selectDates(), or removeDates() methods instead. selectedDatesArray(Date) EpochPrime::selectedDates Points to all selected dates in the calendar's dates array. UsageWe strongly recommend you do not set the selectedDates array elements manually. Use the addDates(), selectDates(), or removeDates() methods instead. Call the private method updateSelectedDates() to refresh the selectedDates array. calendarHTMLTableElement EpochPrime::calendar The master table that contains all of the HTML elements belonging to Epoch Prime. calHeadingHTMLDivElement EpochPrime::calHeading Contains the top portion of the calendar, including the year and month <SELECT> elements. calCellsHTMLTableElement EpochPrime::calCells Table containing all dates and week headings(in the TBODY), as well as the day headings (in the THEAD). rowsArray(bool) EpochPrime::rows Array of boolean values indicating whether an entire week (row) is selected/deselected for the current month. Currently these values are not saved when changing months; instead all values are reset to false. colsArray(bool) EpochPrime::cols Array of boolean values indicating whether all instances of a certain day of week (column) are selected/deselected for the current month. Currently these values are not saved when changing months; instead all values are reset to false. cellsArray(CalCell) EpochPrime::cells Array containing all of the calendar's CalCell objects, i.e. each table cell in calCells has an attached CalCell object that is pointed to in cells. monthSelectHTMLSelectElement EpochPrime::monthSelect Pointer to the month list <SELECT> element. yearSelectHTMLSelectElement EpochPrime::yearSelect Pointer to the year list <SELECT> element. mouseinbool EpochPrime::mousein Indicates whether the user's mouse cursor lies within the calendar's calendar table, i.e. is inside Epoch Prime. Public MethodsThe most commonly-used methods. These can be accessed in your JavaScript code like any other object's methods, i.e. mycalendar.setTarget(element). dateInArray(arr,searchVal,startIndex)Find a date in the given array, returning its index if found, -1 if not. Arguments
Return ValuesintsetTarget(HTMLInputElement targetelement, bool focus)Changes the target element of this calendar to another input. Can be used in either flat or popup mode. Arguments
Return Values(none)UsagesetTarget() can be called at any time to change the location of the calendar within the page. This can save memory and increase speed, as opposed to initializing a new calendar. For example, in popup mode, setTarget() can be used to assign a single calendar to multiple <input> boxes. The calendar will seamlessly pop up when a user focuses on any of the boxes, while remembering the date selected in each box if the user goes back to a box they already filled in. This is particularly useful if the page you're developing allows the user to add new calendar-containing elements dynamically. setTarget() can also be used in flat mode. For aesthetic reasons you will probably not want to do this, though AJAX developers will find this feature useful if they initialize the calendar without a target element—see the entry for the Epoch Prime Constructor. nextMonth()Go to the next month - if the current month is December, go to January of the next year instead. Checks if the next month is within the minimum and maximum allowed dates allowed to be accessed by the user, and if so, returns true if the month will be incremented. Arguments(none)Return ValuesboolprevMonth()Go to the previous month - if the current month is January, go to December of the previous year. Checks if the previous month is within the minimum and maximum allowed dates allowed to be accessed by the user, and if so, returns true if the month will be decremented. Arguments(none)Return ValuesboolgoToMonth(year,month)Sets the calendar to display the requested month/year, returning true if the requested month/year is within the minimum and maximum allowed dates. Arguments
Return ValuesboolupdatePos(target)Moves the calendar's position in the page to the target element's position (popup mode only). Arguments
Return Valuesshow()Displays the calendar by setting the CSS:display property for the calendar table element to 'block'. Ideally should be set to 'table', but Internet Explorer 6.0 and below do not support this. Arguments(none)Return Values(none)hide()Hides the calendar by setting the CSS:display property for the calendar table element to 'none'. Arguments(none)Return Values(none)toggle()Toggles (shows/hides) the calendar depending on the current display state of the calendar element. Arguments(none)Return Values(none)addDates(dates,redraw)Adds the input array dates to the calendar's dates array, removing duplicate dates, then redraws the calendar if redraw is true. Arguments
Return Values(none)removeDates(dates,redraw)Removes the dates in the input array dates from the calendar's dates array, then redraws the calendar if redraw is true. Arguments
Return Values(none)selectDates(inpdates,selectVal,redraw,removeothers)Selects or Deselects an array of dates. Arguments
Return Values(none)sendForm(formid,inputname)Adds the dates in the calendar's dates array as hidden inputs in a form identified by id formid. inputname is the name of each hidden element. Arguments
Return Values(none)UsagesendForm() is a quick and easy way to send the calendar's selected dates to the server via standard form submission. It uses the DOM to add hidden <INPUT> elements to the form when the user clicks the sbumit button. The calendar does not need to be inside the form, as it uses the id provided in formid to get a handle on the form you want to use. <form id="myform" onsubmit="mycalendar.sendForm('myform','calendardates);">
outputAjaxQueryString(varname,dateFormat,includeConfig)Outputs a HTTP query string to send to the server via an xmlHTTP object or other method. Arguments
Return Values(none)UsageUse outputAjaxQueryString() to create an HTTP query string containing all of the currently selected dates and calendar state variables. You can then pass this string to an xmlHTTP object when making a request, or append it dynamically to URLs in the parent page. varnameis the name of the variable to use in the query string, i.e. mydates[0]&=2006-01-01&mydates[1]=2006-02-01, and dateFormat is the format to send the date as (using the formatting conventions of the dateFormat() function). This query string format is parsed by most server-side languages (i.e. PHP) into an array that can be used by a server-side script to, for example, store the data in a database. resetSelections(retMonth)Reset the calender. =Erases the dates array and resets the calendar's selection variables to defaults. If retMonth is true, the calendar will return to the initial default month/year. Arguments
Return Values(none)reDraw(index)Reapplies all the CSS classes for the calendar cells – usually called after changing their state. If index is specified, it will redraw that cell only. Arguments
Return Values(none)getCellIndex(date)Returns the index of the cell whose date value matches "date", or -1 if not found Arguments
Return ValuesintimportXML(xml)Takes an xml string or XMLDoc and inserts the dates into the calendar's dates array. See the Using XML Page for a how-to guide to using XML with Epoch Prime, or the Epoch Prime XML Specification for details on the Epoch Prime XML schema format. Arguments
Return Values(none)UsageimportXML() may be called at any time after the calendar has initialized. Epoch Prime's incredible flexibility lets it:
Note: configuration variables under the initcfg category, as well as month and day names, will not be loaded after the calendar has initialized. exportXML()Export the calendar's state configuration values and dates to an xml string. Arguments(none)Return ValuesstringUsageUse exportXML() to save the state of the calendar and its dates. Useful to save your users' selections for later use, such as an event search or customer page. Private PropertiesThese variables can only be accessed and set from within the Epoch Prime class – trying to do this from your page's JavaScript code will cause an error. Your only need to modify these if you're modifying the internal workings of Epoch Prime. selfEpochPrime EpochPrime::self A workaround due to JavaScript's varying definitions of this in variable scopes (see explanation in below paragraph). Basically, using self is exactly the same as using this – it always points to the main EpochPrime class prototype and is equivalent to using this in other object-oriented languages such as C++ and PHP. For consistency, we have replaced all references to this with self. In explicit function declarations (function myfunc() {....}), this refers to the current function prototype—this is fine until you nest functions (as we do to in Epoch Prime to achieve private methods. Then this refers to the nested function's prototype – meaning you cannot easily access the parent function's prototype. Hence self was born. QuirksMode has a good overview of the JavaScript this keyword here. Private MethodsThese functions can only be accessed and set from within the Epoch Prime class – trying to do this from your page's JavaScript code will cause an error. Your only need to modify these if you're modifying the internal workings of Epoch Prime. calConfig()Usage: void calConfig() Declares and initializes the calendar variables. All the variables here can be safely changed by the developer Arguments(none)Return Values(none)setLang()All language settings for Epoch are made in this function. Check Date.dateFormat() for the Date object's language settings. Arguments(none)Return Values(none)setDays()Initializes the standard Gregorian Calendar parameters Arguments(none)Return Values(none)createCalendar()Creates the full DOM implementation of the calendar Arguments(none)Return Values(none)createMainHeading()Creates the primary calendar heading, with months & years Arguments(none)Return ValuesHTMLDivElementcreateFooter()Creates the footer of the calendar – goes under the calendar cells Arguments(none)Return ValuesHTMLDivElementcreateDayHeading()Creates the heading containing the day names Arguments(none)Return ValuesHTMLTheadElementcreateCalCells()Creates the table containing the calendar day cells Arguments(none)Return ValuesHTMLTbodyElementsetMode(targetelement)Runs all the operations necessary to change the mode of the calendar Arguments
Return Values(none)deleteCells()Removes the calendar table cells from the DOM (does not delete the cell objects associated with them) Arguments(none)Return Values(none)setClass(element,className)Sets the CSS class of the element, W3C & IE Arguments
Return Values(none)setCellProperties(cellindex)Updates a cell's data, including CSS class and selection properties Arguments
Return Values(none)initXML(xml)Initializes the calendar's XML parser and processes the xml string/XMLDoc. Arguments
Return Values(none)processXML(xml, init)The core of Epoch Prime's XML and AJAX features. Parses and processes the XML data in xml into the calendar, loading the values into configuration values and the dates array. Arguments
Return Values(none)UsageprocessXML() will load configuration variables (except those in the initcfg category), as well as language and date values. See the Using XML with Epoch Prime page for more details. updateSelectedDates()Updates the selectedDates pointer array to point to all selected dates in dates. Arguments(none)Return Values(none)cal_onmouseover()Updates the mousein variable to true. This function is pointed to by the EpochPrime::calendar.onmouseover() event handler. Arguments(none)Return Values(none)cal_onmouseout()Updates the mousein variable to false. This function is pointed to by the EpochPrime::calendar.onmouseout() event handler. Arguments(none)Return Values(none) |
|