Class: UWA.Controls.Calendar

UWA/Controls/Calendar. UWA.Controls.Calendar

new UWA.Controls.Calendar(options)

Display a calendar with day/week/month views.

Available Events
Event Description
onDateChange Fired when the selected date change
onDateSelect Fired when the user click on a date
Parameters
Name Type Description
options Object

Options hash or a option/value pair.

Properties
Name Type Argument Default Description
className String <optional>
''

Control theme ('dark' for a dark theme)

date String <optional>
undefined

The initial date

view String <optional>
'month'

Default view

weekFirstDay String <optional>
'monday'

First day of the week

Extends

Index

Members

<protected> name

Properties:
Name Type Description
name String

The Calendar name. Default: 'uwa-calendar'

<protected> defaultOptions

Properties:
Name Type Description
defaultOptions Object

The default controls options.

<protected> weekOffset

Properties:
Name Type Description
weekOffset Object

links a day name with its offset in the week, starting at sunday.

<protected> elements :Object

The current control elements.

Type
  • Object
Inherited From:

Methods

getWeekOffset() → {Integer}

Get the offset of the first day of the week given the current option.

Returns

the offset (0 = sunday, 6 = saturday)

Type
Integer

getMonthFirstDay() → {Number}

Get the position of the first day of the current month in its week.

Returns
Type
Number

getWeekFirstDay() → {Number}

Get the day of the month of the first day of the week.

Returns
Type
Number

iterateWeek(iter, context) → {this}

Iterate over the current week

Parameters
Name Type Description
iter Function

the callback function called with the index as first argument and the date as second argument.

context Object

the context used to call the callback

Returns
Type
this

displayView(view) → {this}

Display a given view

Parameters
Name Type Description
view String

the view name

Returns
Type
this

setDate(selectDate, displayDate) → {this}

Set the current date of the calendar. Two dates can be set: the "select date" is the date shown as selected and the one returned by <getDate>. the "display date" is used to draw the calendar around this date. Typically, when the user will be navigating around with arrows to change the displayed month, the display date will be updated but not the select date.

Parameters
Name Type Description
selectDate Date

the selected date (default to "today at midnight")

displayDate Date

the display date (default to selectDate value)

Returns
Type
this

getDate() → {Date|null}

Returns the selected date.

Returns

The selected date

Type
Date | null

setLimit(limit) → {this}

Set the calendar limit.

Example
//Sync two calendars to select a date range
var start = new UWA.Controls.Calendar(),
   end = new UWA.Controls.Calendar();

start.setLimit({ max: end });
end.setLimit({ min: start });
Parameters
Name Type Description
limit Object

an object with the optional properties min and max Each of those properties can be either fixed dates or objects with a getTime or getDate method. Default: no limit.

Returns
Type
this

getLimit() → {Object}

Get the current limit.

Returns

An object with the properties 'min' and 'max' as numbers (timestamp in millisecond). If there is no limit, the 'min' will be -Infinity, and the 'max' will be '+Infinity'.

Type
Object

refreshLimit() → {this}

Refresh the limit display. This will be called each time the setLimit is called, and can call be called manually if the limit changes (ea: the getTime or getDate of the limit value have change).

Returns
Type
this

preventRefresh() → {this}

Calling this method will prevent the display to be refreshed. Each call to <preventRefresh> have to be followed by an <allowRefresh> call.

Returns
Type
this

allowRefresh() → {this}

Calling this method will allow the display to be refreshed. Each call to <preventRefresh> have to be followed by an <allowRefresh> call.

Returns
Type
this

buildSkeleton()

Build the initial dom container.

buildMonthView() → {Element}

Build the dom of the month view.

Returns

The resulting dom

Type
Element

buildWeekView() → {Element}

Build the dom of the week view.

Returns

The resulting dom

Type
Element

refreshMonthView()

Refresh the display of the month view according to the display date.

refreshWeekView()

Refresh the display of the week view according to the display date.

buildDay(day, iterDate) → {Element}

Update a dom element representing a day.

Parameters
Name Type Description
day Element

The element to update

iterDate Date

The current iterated date

Returns

The day element

Type
Element

inject(element, where) → {this}

Inject control in the dom.

Parameters
Name Type Argument Description
element HTMLelement

Dom target

where String <optional>

Where to inject

Returns
Type
this
Inherited From:

remove() → {this}

Remove the control from the dom

Returns
Type
this
Inherited From:

getContent() → {HTMLelement}

Returns control content.

Returns

Control container.

Type
HTMLelement
Inherited From:

getClassNames(suffixes) → {String}

Generate a CSS class name based on the class name property, its parent classes, and the options "className". It should be used internally (in the control).

Example
var Input = UWA.Controls.Abstract.extend({
   name: 'uwa-input',

   options: {
       className: '',
   },

   buildSkeleton: function () {
       this.elements.container = UWA.createElement('div', { 'class': this.getClassNames() });
       this.elements.content = UWA.createElement('div', { 'class': this.getClassNames('-content') });
   }
});

var Radio = Input.extend({
   name: 'uwa-inputradio'
});

new Radio({
    className: 'toto black'
});
// container will have the class 'toto black uwa-inputradio uwa-input'
// content will have the class 'toto black uwa-inputradio-content uwa-input-content'
Parameters
Name Type Description
suffixes String

All parameters should be strings, used as suffix to append to the UWA.Class names of the inheritance chain.

Returns

The generated CSS class name.

Type
String
Inherited From:

hide()

Hide control content.

Inherited From:

show()

Show control content.

Inherited From:

destroy()

Destroy the control elements and its children. Remove all events and remove the element from the dom. This control and its children should not be used after this.

Inherited From: