new SV(oSchedule)
Defines the schedule view of the control, that displays the events. The oSV field defines the control's base schedule-view. Use the AddScheduleView() method to add a new view to the control. Use the RemoveScheduleView() method removes a schedule-view already created by AddScheduleView() method.
Parameters:
| Name | Type | Description |
|---|---|---|
oSchedule |
Schedule | Specifies an object of Schedule type that defines the owner control of the view to be created |
Methods
Copy()
The Copy() method copies the selection to the Clipboard. The Cut/Copy/Paste methods work only if the control is visible.
- Since:
- 2.1
Example
The control requires focus, so CTRL + C, CTRL + X or CTRL + V to make it works. In the same manner, the tabIndex attribute must be present into the defintion of the canvas HTML event.
addEventListener("copy", oSchedule.Copy), calls the control's Copy() method as soon as the 'copy' event occurs (CTRL + C). The copy event fires when the user initiates a copy action through the browser's user interface.
oSchedule.Shortcuts.Add("CTRL + C", oSchedule.Copy, oSchedule), calls the control's Copy() method as soon as user presses CTRL + C key combinationCut()
The Cut() method moves the selection to the Clipboard. The Cut/Copy/Paste methods work only if the control is visible.
- Since:
- 2.1
Example
The control requires focus, so CTRL + C, CTRL + X or CTRL + V to make it works. In the same manner, the tabIndex attribute must be present into the defintion of the canvas HTML event.
addEventListener("cut", oSchedule.Cut), calls the control's Cut() method as soon as the 'cut' event occurs (CTRL + X). The cut event is fired when the user has initiated a "cut" action through the browser's user interface.
oSchedule.Shortcuts.Add("CTRL + X", oSchedule.Cut, oSchedule), calls the control's Cut() method as soon as user presses CTRL + X key combinationEnsureVisibleClient(clientA, ensureOptsopt)
The EnsureVisibleClient() method ensures that the giving client fits the control's client area.
Parameters:
| Name | Type | Attributes | Description |
|---|---|---|---|
clientA |
object | The client parameter could be any of the following:
|
|
ensureOpts |
object |
<optional> |
Specifies different options to run the current method as explained:
|
EnsureVisibleDate(dateopt, flagsopt)
The EnsureVisibleDate() method scrolls the schedule view so the giving date(s) fit the view's client-rectangle
Parameters:
| Name | Type | Attributes | Description |
|---|---|---|---|
date |
any |
<optional> |
Specifies a date or a collection of dates to ensure that fits the view's client rectangle. If missing the EnsureVisibleDate() method ensures that the first visible date of the layout fits the schedule view's client area |
flags |
number |
<optional> |
Specifies the flags to run the EnsureVisibleDate() method as explained: 1 {number}, allows horizontal scroll 2 {number}, allows vertical scroll |
EnsureVisibleSelection(ensureOptsopt)
The EnsureVisibleSelection() method scrolls the control's content to ensure that the control's selection fits the control's client area.
Parameters:
| Name | Type | Attributes | Description |
|---|---|---|---|
ensureOpts |
object |
<optional> |
Specifies different options to run the current method as explained:
|
FitToClient(rtLayoutopt)
The FitToClient() method ensures that the entire (null/undefined) or giving layout fits the control's client area
Parameters:
| Name | Type | Attributes | Description |
|---|---|---|---|
rtLayout |
Array.<number> |
<optional> |
Indicates null for entire layout or an array of [x,y,width,height] type that defines the absolute-coordinate to fit to client |
GetAllowActions() → {string}
The GetAllowActions() method gets the actions the user can perform once the control is clicked or touched
Returns:
Returns the actions the user can perform once the control is clicked or touched.
The format of allowActions field is:
"action(shortcut,shortcut,...),action(shortcut,shortcut,...)..."where
- "action", indicates the name of the action. The "action" can have any of the following values:
- "scroll", scrolls the control's content by drag. The "scroll" action allows flags such as:
- [view], specifies that the "scroll" is possible once the user clicks the view
- [timeScale], specifies that the "scroll" is possible once the user clicks the time-scale
- "zoom", zooms the control's content at dragging-point.
- "fit", fits the drag-area into the control's client area.
- "select", selects events by drag
- "drag-drop", carries out the drag and drop of the ui-event (the ui-event can be dropped inside or outside of the control). The ExDrop(event, data) method of the target HTML element is invoked once the user drops the ui-event. The event parameter holds information about the mouse/touch event once the ui-event has been dropped. The data parameter holds information about the source-object that initiated the drag and drop operation, as an object of {object,source,client,shape} type.
- "day-resize", resizes the day by drag and drop (not available if the control is read-only)
- "group-resize", resizes the group by drag and drop (not available if the control is read-only)
- "group-drag", changes the group's position by drag and drop (not available if the control is read-only)
- "create", creates event by drag (not available if the control is read-only)
- "move", moves or resizes events by drag (not available if the control is read-only)
- "scroll", scrolls the control's content by drag. The "scroll" action allows flags such as:
- "shortcut", defines the event's button or/and the modifier-keys that are required to perform the action. The "shortcut" is a combination of none, one or more of the following values:
- "Shift", indicates that the SHIFT key is pressed
- "Ctrl" or "Control", indicates that the CTRL key is pressed
- "Alt" or "Menu", indicates that the ALT key is pressed
- "Meta" , indicates that the META key is pressed
- "LButton", specifies that the mouse's left-button is pressed
- "RButton", specifies that the mouse's right-button is pressed
- "MButton", specifies that the mouse's middle/wheel-button is pressed
- "Long", specifies that the action requires a "long" click or touch before it begins
- "Double", specifies that the action requires a "double" click before it begins (this flag is available for non-dragable actions only such as "edit")
- "+", indicates AND between values
- Type
- string
GetAllowAllDayEventScroll() → {null|number|Array.<number>}
The GetAllowAllDayEventScroll() method gets the number of events the all-day header can display one at the time
Returns:
Returns the number of events the all-day header can display one at the time, as explained:
- null {null}, the all-day header displays events as many as it fits
- positive-number {number}, the all-day header always displays an exact number of levels
- negative-number {number}, the all-day header displays up to specified number of levels
- [min,max] {array}, indicates a two-elements array of [min,max] type that defines the minimum and maximum number of levels, where min must be zero or any positive number, while max can be null, negative (up to) or positive number(fixed)
- Type
- null | number | Array.<number>
Example
null {null}, the all-day header displays events as many as it fits
3 {number}, indicates that the all-day header always displays 3 levels
-3 {number}, indicates that the all-day header can display up to 3 levels
[1] {array}, indicates 1 to unlimited levels
[1,4] {array}, always displays 4 levels
[1,-4] {array}, displays from 1 to 4 levelsGetAllowMoveEventToOtherGroup() → {boolean}
The GetAllowMoveEventToOtherGroup() method indicates whether the event can be moved from a group to another by drag and drop
Returns:
Returns true if the event can be moved from a group to another
- Type
- boolean
GetAllowMultiDaysEvent() → {boolean}
The GetAllowMultiDaysEvent() method specifies whether the user can create events that may start on a day and ends on other
Returns:
Returns a truly value if user can create or resizes multi-dates events
- Type
- boolean
GetApplyGroupingColors() → {boolean}
The GetApplyGroupingColors() method specifies whether the schedule view shows the events using the colors of owner groups (group's eventShape option)
Returns:
Returns true if the grouping button is displayed in the date header.
- Type
- boolean
GetBackground() → {BackgroundOptions}
The GetBackground() method indicates the display options to show different parts of the control
Returns:
Returns the display options to show different parts of the control
- Type
- BackgroundOptions
GetCalendar() → {object}
The GetCalendar() method returns the options of the inside calendar control
Returns:
Returns the current options of the inside calendar control, as an object of {exontrol.Calendar.Options} type
- Type
- object
GetCanvasRect() → {Array.<number>}
The GetCanvasRect() method returns the canvas's client rectangle.
Returns:
Returns an array of [x,y,width,height] type that specifies the canvas's client rectangle
- Type
- Array.<number>
GetClientRect() → {Array.<number>}
The GetClientRect() method returns the control's client area.
Returns:
Returns an array of [x,y,width,height] type that specifies the control's client area
- Type
- Array.<number>
GetCreateEventLabel() → {string}
The GetCreateEventLabel() method gets the event's label while it is created by drag and drop
Returns:
Returns the event's label while it is created by drag and drop
- Type
- string
GetCursors() → {string}
The GetCursors() method defines the mouse cursor to display when pointing over different parts of the control.
Returns:
A string expression that defines the mouse cursor to display when pointing over different parts of the control.
The format of cursors property is:
"cursor(part),cursor(part),..."where:
- "cursor", defines the CSS mouse cursor to display while cursor hovers the part
- "part", defines the name of the part the cursor is applied on (as defined below)
- "date", defines the mouse-cursor when the mouse pointer hovers the date (any part)
- "date-header", defines the mouse-cursor when the mouse pointer hovers the header's date
- "grouping-button", defines the mouse-cursor when the mouse pointer hovers the header's grouping-button
- "date-grouping-header", defines the mouse-cursor when the mouse pointer hovers the date's grouping-header part
- "date-all-day-header", defines the mouse-cursor when the mouse pointer hovers the date's all-day header
- "date-all-day-scroll-button", defines the mouse-cursor when the mouse pointer hovers the date's scroll-button of the all-day header
- "date-all-day-scroll-wheel", defines the mouse-cursor when the mouse pointer hovers the date's scroll-wheel of the all-day header (the scroll-wheel zone is the portion of the all-day header where user can scroll the events using the mouse wheel)
- "date-timeScale", defines the mouse-cursor when the mouse pointer hovers the date's time-scale part
- "resize-group", defines the mouse-cursor when the mouse pointer hovers the group's resize margin
- "event", defines the mouse-cursor when the mouse pointer hovers any movable event
- "create", defines the mouse-cursor to create new events by drag and drop
- "drag-drop", defines the cursor while the event is being dragged using the "drag-drop" action
- "timeScale", defines the mouse-cursor when the mouse pointer hovers the control's time-scale header
- "resize-h" (resize-event-horizontal), defines the mouse-cursor when the mouse pointer hovers the all-day event's start and end margins
- "resize-v" (resize-event-vertical), defines the mouse-cursor when the mouse pointer hovers the event's start and end margins
- "anchor" (hyperlink), defines the mouse-cursor when the mouse pointer hovers the anchor (the <a id;options> ex-HTML part marks an anchor or hyperlink element) (@since 2.2)
- "long", specifies the mouse-cursor to be shown as soon as a "long" click or touch action begins (see allowActions field)
- Type
- string
GetDayEndTime() → {string}
The GetDayEndTime() method gets the time the day ends at, in "HH[:MM[:NN]]" format
Returns:
Returns the time the day ends at
- Type
- string
GetDayStartTime() → {string}
The GetDayStartTime() method gets the time the day starts at, in "HH[:MM[:NN]]" format
Returns:
Returns the time the day starts at
- Type
- string
GetDayViewHeight() → {number}
The GetDayViewHeight() method indicates the height of the day within the schedule panel
Returns:
Returns the height of the day within the schedule panel
- Type
- number
GetDayViewWidth() → {number}
The GetDayViewWidth() method indicates the width of the day within the schedule panel
Returns:
Returns the width of the day within the schedule panel
- Type
- number
GetDefaultEventExtraLabel() → {string}
The GetDefaultEventExtraLabel() method gets event's default extra-label
Returns:
Returns the event's default extra-label
- Type
- string
GetDefaultEventLongLabel() → {string}
The GetDefaultEventLongLabel() method gets event's default long-label
Returns:
Returns the event's default long-label
- Type
- string
GetDefaultEventShortLabel() → {string}
The GetDefaultEventShortLabel() method gets event's default short-label
Returns:
Returns the event's default short-label
- Type
- string
GetDefaultEventToolTip() → {string}
The GetDefaultEventToolTip() method gets event's default tooltip
Returns:
Returns the event's default tooltip
- Type
- string
GetDisplayGroupingButton() → {boolean}
The GetDisplayGroupingButton() method specifies whether the grouping button is displayed in the date header.
Returns:
Returns true if the grouping button is displayed in the date header.
- Type
- boolean
GetFormatText() → {exontrol.DrawTextFormatEnum}
The GetFormatText() method specifies the format and alignment to display the event's caption.
Returns:
Returns a value of exontrol.DrawTextFormatEnum type, that defines the format to display the event's caption.
The exontrol.DrawTextFormatEnum type supports the following flags:
- exTextAlignTop (0x00), justifies the text to the top of the rectangle
- exTextAlignLeft (0x00), aligns text to the left
- exTextAlignCenter (0x01), centers text horizontally in the rectangle
- exTextAlignRight (0x02), aligns text to the right
- exTextAlignVCenter (0x04), centers text vertically
- exTextAlignBottom (0x08), justifies the text to the bottom of the rectangle.
- exTextAlignMask (0x0F), specifies the mask for text's alignment.
- exTextWordBreak (0x10), breaks words. Lines are automatically broken between words if a word would extend past the edge of the rectangle specified by the lpRect parameter. A carriage return-line feed sequence also breaks the line. If this is not specified, output is on one line.
- exTextSingleLine (0x20), displays text on a single line only. Carriage returns and line feeds do not break the line.
- exTextExpandTabs (0x40), expands tab characters. The default number of characters per tab is eight.
- exPlainText (0x80), treats the text as plain text.
- exTextNoClip (0x0100), draws without clipping.
- exHTMLTextNoColors (0x0200), ignores the
and tags. - exTextCalcRect (0x0400), determines the width and height of the text.
- exHTMLTextNoTags (0x0800), ignores all HTML tags.
- exTextPathEllipsis (0x4000), for displayed text, replaces characters in the middle of the string with ellipses so that the result fits in the specified rectangle. If the string contains backslash (\) characters, exTextPathEllipsis preserves as much as possible of the text after the last backslash.
- exTextEndEllipsis (0x8000), for displayed text, if the end of a string does not fit in the rectangle, it is truncated and ellipses are added. If a word that is not at the end of the string goes beyond the limits of the rectangle, it is truncated without ellipses.
- exTextWordEllipsis (0x040000), truncates any word that does not fit in the rectangle and adds ellipses.
- Type
- exontrol.DrawTextFormatEnum
GetHeaderAllDayEventHeight() → {number}
The GetHeaderAllDayEventHeight() method indicates the height of the events to display within the all-day header
Returns:
Returns the height of the events to display within the all-day header (relative to the font-size of the control)
- Type
- number
GetHeaderDayHeight() → {number}
The GetHeaderDayHeight() method indicates the height of the day's header
Returns:
Returns the height of the day's header (relative to the font-size of the control)
- Type
- number
GetHeaderDayLongLabel() → {string}
The GetHeaderDayLongLabel() method gets the alternate HTML labels being shown on date's header, when the time-scale is visible. The format the "headerDayLongLabel" option is "ALT1[<|>ALT2<|>...][<=>EXPR]", where ALT defines a HTML label that supports a lot of predefined built-in tags, EXPR defines an expression to specify which HTML label to be shown when a condition is met.
The ALT part of the label supports ex-HTLM tags such as (<b>, <i>, <fgcolor>, ...) and <%DATE%> tags as follows:
- <%d%> - Day of the month in one or two numeric digits, as needed (1 to 31)
- <%dd%> - Day of the month in two numeric digits (01 to 31)
- <%d1%> - First letter of the weekday (S to S)
- <%loc_d1%> - Indicates day of week as a one-letter abbreviation using the current user settings
- <%d2%> - First two letters of the weekday (Su to Sa)
- <%loc_d2%> - Indicates day of week as a two-letters abbreviation using the current user settings
- <%d3%> - First three letters of the weekday (Sun to Sat)
- <%loc_d3%> equivalent with <%loc_ddd%>
- <%ddd%> - First three letters of the weekday (Sun to Sat)
- <%loc_ddd%> - Indicates the day of week as a three-letter abbreviation using the current user regional and language settings
- <%dddd%> - Full name of the weekday (Sunday to Saturday)
- <%loc_dddd%> - Indicates day of week as its full name using the current user regional and language settings
- <%i%> - Displays the number instead the date
- <%w%> - Day of the week (1 to 7)
- <%ww%> - Week of the year (1 to 53)
- <%m%> - Month of the year in one or two numeric digits, as needed (1 to 12)
- <%mr%> - Month of the year in Roman numerals, as needed (I to XII)
- <%mm%> - Month of the year in two numeric digits (01 to 12)
- <%m1%> - First letter of the month (J to D)
- <%loc_m1%> - Indicates month as a one-letter abbreviation using the current user settings
- <%m2%> - First two letters of the month (Ja to De)
- <%loc_m2%> - Indicates month as a two-letters abbreviation using the current user settings
- <%m3%> - First three letters of the month (Jan to Dec)
- <%loc_m3%> - equivalent with <%loc_mmm%>
- <%mmm%> - First three letters of the month (Jan to Dec)
- <%loc_mmm%> - Indicates month as a three-letter abbreviation using the current user regional and language settings
- <%mmmm%> - Full name of the month (January to December)
- <%loc_mmmm%> - Indicates month as its full name using the current user regional and language settings
- <%q%> - Date displayed as the quarter of the year (1 to 4)
- <%y%> - Number of the day of the year (1 to 366)
- <%yy%> - Last two digits of the year (01 to 99)
- <%yyyy%> - Full year (0100 to 9999)
- <%hy%> - Date displayed as the half of the year (1 to 2)
- <%loc_g%> - Indicates period/era using the current user regional and language settings
- <%loc_gg%> - Indicates period/era using the current user regional and language settings
- <%loc_sdate%> - Indicates the date in the short format using the current user regional and language settings
- <%loc_ldate%> - Indicates the date in the long format using the current user regional and language settings
- <%loc_dsep%> - Indicates the date separator using the current user regional and language settings (/)
- <%h%> - Hour in one or two digits, as needed (0 to 23)
- <%hh%> - Hour in two digits (00 to 23)
- <%h12%> - Hour in 12-hour time format, in one or two digits - [0(12),11]
- <%hh12%> - Hour in 12-hour time format, in two digits - [00(12),11]
- <%n%> - Minute in one or two digits, as needed (0 to 59)
- <%nn%> - Minute in two digits (00 to 59)
- <%s%> - Second in one or two digits, as needed (0 to 59)
- <%ss%> - Second in two digits (00 to 59)
- <%AM/PM%> - Twelve-hour clock with the uppercase letters "AM" or "PM", as appropriate
- <%loc_AM/PM%> - Indicates the time marker such as AM or PM using the current user regional and language settings
- <%loc_A/P%> - Indicates the one character time marker such as A or P using the current user regional and language settings
- <%loc_time%> - Indicates the time using the current user regional and language settings
- <%loc_time24%> - Indicates the time in 24 hours format without a time marker using the current user regional and language settings
- <%loc_tsep%> - indicates the time separator using the current user regional and language settings (:)
- <%loc_y%> - Represents the Year only by the last digit, using current regional settings
- <%loc_yy%> - Represents the Year only by the last two digits, using current regional settings. A leading zero is added for single-digit years
- <%loc_yyyy%> - Represents the Year by a full four or five digits, depending on the calendar used. Thai Buddhist and Korean calendars have five-digit years. The "yyyy" pattern shows five digits for these two calendars, and four digits for all other supported calendars. Calendars that have single-digit or two-digit years, such as for the Japanese Emperor era, are represented differently. A single-digit year is represented with a leading zero, for example, "03". A two-digit year is represented with two digits, for example, "13". No additional leading zeros are displayed
The EXPR supports the value keyword that specifies the date being queried. The EXPR supports predefined constants, functions and operators such as day, month, year, +, -, and so on.
Returns:
Returns the alternate HTML labels being shown on date's header, when the time-scale is visible.
- Type
- string
GetHeaderDayShortLabel() → {string}
The GetHeaderDayShortLabel() method gets the alternate HTML labels being shown on date's header, when the time-scale is not visible. The format the "headerDayShortLabel" option is "ALT1[<|>ALT2<|>...][<=>EXPR]", where ALT defines a HTML label that supports a lot of predefined built-in tags, EXPR defines an expression to specify which HTML label to be shown when a condition is met.
The ALT part of the label supports ex-HTLM tags such as (<b>, <i>, <fgcolor>, ...) and <%DATE%> tags as follows:
- <%d%> - Day of the month in one or two numeric digits, as needed (1 to 31)
- <%dd%> - Day of the month in two numeric digits (01 to 31)
- <%d1%> - First letter of the weekday (S to S)
- <%loc_d1%> - Indicates day of week as a one-letter abbreviation using the current user settings
- <%d2%> - First two letters of the weekday (Su to Sa)
- <%loc_d2%> - Indicates day of week as a two-letters abbreviation using the current user settings
- <%d3%> - First three letters of the weekday (Sun to Sat)
- <%loc_d3%> equivalent with <%loc_ddd%>
- <%ddd%> - First three letters of the weekday (Sun to Sat)
- <%loc_ddd%> - Indicates the day of week as a three-letter abbreviation using the current user regional and language settings
- <%dddd%> - Full name of the weekday (Sunday to Saturday)
- <%loc_dddd%> - Indicates day of week as its full name using the current user regional and language settings
- <%i%> - Displays the number instead the date
- <%w%> - Day of the week (1 to 7)
- <%ww%> - Week of the year (1 to 53)
- <%m%> - Month of the year in one or two numeric digits, as needed (1 to 12)
- <%mr%> - Month of the year in Roman numerals, as needed (I to XII)
- <%mm%> - Month of the year in two numeric digits (01 to 12)
- <%m1%> - First letter of the month (J to D)
- <%loc_m1%> - Indicates month as a one-letter abbreviation using the current user settings
- <%m2%> - First two letters of the month (Ja to De)
- <%loc_m2%> - Indicates month as a two-letters abbreviation using the current user settings
- <%m3%> - First three letters of the month (Jan to Dec)
- <%loc_m3%> - equivalent with <%loc_mmm%>
- <%mmm%> - First three letters of the month (Jan to Dec)
- <%loc_mmm%> - Indicates month as a three-letter abbreviation using the current user regional and language settings
- <%mmmm%> - Full name of the month (January to December)
- <%loc_mmmm%> - Indicates month as its full name using the current user regional and language settings
- <%q%> - Date displayed as the quarter of the year (1 to 4)
- <%y%> - Number of the day of the year (1 to 366)
- <%yy%> - Last two digits of the year (01 to 99)
- <%yyyy%> - Full year (0100 to 9999)
- <%hy%> - Date displayed as the half of the year (1 to 2)
- <%loc_g%> - Indicates period/era using the current user regional and language settings
- <%loc_gg%> - Indicates period/era using the current user regional and language settings
- <%loc_sdate%> - Indicates the date in the short format using the current user regional and language settings
- <%loc_ldate%> - Indicates the date in the long format using the current user regional and language settings
- <%loc_dsep%> - Indicates the date separator using the current user regional and language settings (/)
- <%h%> - Hour in one or two digits, as needed (0 to 23)
- <%hh%> - Hour in two digits (00 to 23)
- <%h12%> - Hour in 12-hour time format, in one or two digits - [0(12),11]
- <%hh12%> - Hour in 12-hour time format, in two digits - [00(12),11]
- <%n%> - Minute in one or two digits, as needed (0 to 59)
- <%nn%> - Minute in two digits (00 to 59)
- <%s%> - Second in one or two digits, as needed (0 to 59)
- <%ss%> - Second in two digits (00 to 59)
- <%AM/PM%> - Twelve-hour clock with the uppercase letters "AM" or "PM", as appropriate
- <%loc_AM/PM%> - Indicates the time marker such as AM or PM using the current user regional and language settings
- <%loc_A/P%> - Indicates the one character time marker such as A or P using the current user regional and language settings
- <%loc_time%> - Indicates the time using the current user regional and language settings
- <%loc_time24%> - Indicates the time in 24 hours format without a time marker using the current user regional and language settings
- <%loc_tsep%> - indicates the time separator using the current user regional and language settings (:)
- <%loc_y%> - Represents the Year only by the last digit, using current regional settings
- <%loc_yy%> - Represents the Year only by the last two digits, using current regional settings. A leading zero is added for single-digit years
- <%loc_yyyy%> - Represents the Year by a full four or five digits, depending on the calendar used. Thai Buddhist and Korean calendars have five-digit years. The "yyyy" pattern shows five digits for these two calendars, and four digits for all other supported calendars. Calendars that have single-digit or two-digit years, such as for the Japanese Emperor era, are represented differently. A single-digit year is represented with a leading zero, for example, "03". A two-digit year is represented with two digits, for example, "13". No additional leading zeros are displayed
The EXPR supports the value keyword that specifies the date being queried. The EXPR supports predefined constants, functions and operators such as day, month, year, +, -, and so on.
Returns:
Returns the alternate HTML labels being shown on date's header, when the time-scale is not visible.
- Type
- string
GetHeaderGroupHeight() → {number}
The GetHeaderGroupHeight() method indicates the height of the group's header
Returns:
Returns the height of the group's header (relative to the font-size of the control)
- Type
- number
GetImageAlign() → {number}
The GetImageAlign() method specifies the alignment of the event's image (reserved for future use only).
Returns:
Returns the alignment of the event's image as explained:
- 0, the image is on the left of the event's caption
- 1, the image is on the right of the event's caption
- 2, the image is on the top of the event's caption
- 3, the image is on the bottom of the event's caption
- Type
- number
GetImageSize() → {any}
The GetImageSize() method defines the size of the event's image (reserved for future use only).
Returns:
Returns the size, range of limits the event's image is displayed as expalined:
- {null}, Indicates that the event's image is displayed as it is (full-sized).
- {number}, Specifies that the event's image is displayed into a square of giving size (same width and height). If 0 the event displays no image, if negative the event's image is stretched to giving square, else the event's picture is scaled to fit the giving rectangle.
- {number[]}, Specifies an array of [aspect-width,aspect-height] type that defines the limits for width or/and height. The aspect-width and aspect-height define the width/height of the event's picture to scale or stretch to.
- Type
- any
GetLocked() → {boolean}
The GetLocked() method specifies whether the control is locked(protected) or unlocked
Returns:
Returns true, if the control is locked(protected) or unlocked
- Type
- boolean
GetLongDateFormat() → {string}
The GetLongDateFormat() method gets the long date format
Returns:
Returns the long date format
- Type
- string
GetLongTimeFormat() → {string}
The GetLongTimeFormat() method gets the long time format
Returns:
Returns the long time format
- Type
- string
GetMisc() → {MiscellaneousOptions}
The GetMisc() method indicates the control's miscellaneous options
Returns:
Returns the control's miscellaneous options
- Type
- MiscellaneousOptions
GetOnResizeControl() → {exontrol.Schedule.OnResizeControlEnum}
The GetOnResizeControl() method specifies the panel to resize once the entire control gets resized
Returns:
Returns the panel to resize once the entire control gets resized
- Type
- exontrol.Schedule.OnResizeControlEnum
GetOnSelectDate() → {exontrol.Schedule.OnSelectDateEnum}
The GetOnSelectDate() method specifies the action that the control does once the user selects new dates in the calendar panel
Returns:
Returns the action that the control does once the user selects new dates in the calendar panel
- Type
- exontrol.Schedule.OnSelectDateEnum
GetOptions() → {object}
The GetOptions() method returns the current options of the control.
Returns:
An object of Schedule.Options type that indicates the options to display the control.
- Type
- object
GetPad() → {number|Array.<number>|string}
The GetPad() method specifies the space between event's content and its borders.
Returns:
Returns a value that could be:
- {number} a numeric value, to pad horizontal and vertical size with the same value
- {(string|number[])} a "x,y" or [x,y] type to specify the padding on horizontal and vertical side
- Type
- number | Array.<number> | string
GetPaneMinWidthLeft() → {number}
The GetPaneMinWidthLeft() method defines the minimum size(width) of the left panel
Returns:
Returns the minimum size(width) of the left panel
- Type
- number
GetPaneMinWidthRight() → {number}
The GetPaneMinWidthRight() method defines the minimum size(width) of the right panel
Returns:
Returns the minimum size(width) of the right panel
- Type
- number
GetPaneWidthLeft() → {number}
The GetPaneWidthLeft() method defines the size(width) of the left panel
Returns:
Returns the size(width) of the left panel
- Type
- number
GetPaneWidthRight() → {number}
The GetPaneWidthRight() method defines the size(width) of the right panel
Returns:
Returns the size(width) of the right panel
- Type
- number
GetReadOnly() → {string}
The GetReadOnly() method specifies whether the control is read-only
Returns:
Returns true, if the control is read-only
- Type
- string
GetScrollPos() → {object}
The GetScrollPos() method retrieves the horizontal and vertical scroll-position of the view.
Returns:
Returns an object of {x,y} type that defines the view's horizontal and vertical scroll-position as explained:
x {number}, indicates the horizontal scroll-position
y {number}, indicates the vertical scroll-position
- Type
- object
GetSelectEventStyle() → {number}
The GetSelectEventStyle() method specifies how the selected-event gets displayed
Returns:
Returns how the selected-event gets displayed, as one of the following values:
0 {number}, the "select" shape is combined with the event's shape
1 {number}, the "select" shape is displayed on the event's background. The misc.padSelectEvent field specifies the space between the event's content and its selection border.
2 {number}, the "select" shape is displayed on the event's background, but it is shown using the event's primitive (rectangle, round, oval...). The misc.padSelectEvent field specifies the space between the event's content and its selection border.
- Type
- number
GetShapes() → {string}
The GetShapes() method defines the shapes each part of the control can display. The shapes field customizes the control's visual appearance.
Returns:
A string expression that defines the shapes each part of the control can display.
The format of shapes property is:
"shape(part),shape(part),..."where:
- "shape", defines the shape to apply on the UI part as one of the following:
◦ any of 140 color names any browser supports (such as red, blue, green, ...)
◦ hexadecimal colors, is specified with: #RRGGBB, where the RR (red), GG (green) and BB (blue) hexadecimal integers specify the components of the color. All values must be between 00 and FF (such as #0000ff which defines a blue background)
◦ hexadecimal colors with transparency, is specified with: #RRGGBBAA, where AA (alpha) value must be between 00 and FF (such as #0000ff80 which defines a semi-transparent blue background)
◦ RGB colors, is specified with the RGB(red, green, blue) function. Each parameter (red, green, and blue) defines the intensity of the color and can be an integer between 0 and 255( such as rgb(0,0,255) that defines a blue background)
◦ RGBA colors, are an extension of RGB color values with an alpha channel as RGBA(red, green, blue, alpha) function, where the alpha parameter is a number between 0.0 (fully transparent) and 1.0 (fully opaque) ( such as rgba(0,0,255,0.5) which defines a semi-transparent blue background)
◦ HSL colors, is specified with the HSL(hue, saturation, lightness) function, where hue is a degree on the color wheel (from 0 to 360) - 0 (or 360) is red, 120 is green, 240 is blue. saturation is a percentage value; 0% means a shade of gray and 100% is the full color. lightness is also a percentage; 0% is black, 100% is white. HSL stands for hue, saturation, and lightness - and represents a cylindrical-coordinate representation of colors (such as hsl(240, 100%, 50%) that defines a blue background)
◦ HSLA colors, are an extension of HSL color values with an alpha channel - which specifies the opacity of the object as HSLA(hue, saturation, lightness, alpha) function, where alpha parameter is a number between 0.0 (fully transparent) and 1.0 (fully opaque) (such as hsla(240, 100%, 50%,0.5) that defines a semi-transparent blue background)
◦ a JSON representation of the shape object to apply (while it starts with { character, such as '{"normal": {"primitive": "RoundRect","fillColor":"black","tfi": {"fgColor": "white"}}}')
◦ specifies the name of the field within the exontrol.Shapes.Schedule object (while it starts with a lowercase letter, such as shevent which refers to exontrol.Shapes.Schedule.shevent shape)
◦ specifies the name of the field within the exontrol.Shapes object (while it starts with an uppercase letter, such as Button which refers to exontrol.Shapes.Button shape)
- "part", defines the name of the part the shape is applied on (as defined below)
- "date-frame", defines the visual-appearance for the frame around each date (schedule view only)
- "date-frame-select", defines the visual-appearance for the frame around each selected date (schedule view only)
- "dateAlt", defines the visual-appearance for alternate-date (schedule view only)
- "date-header", defines the visual-appearance for the date's header (schedule view only)
- "dateAlt-header", defines the visual-appearance for the alternate-date's header (schedule view only)
- "grouping-button", defines the visual-appearance for the header's grouping-button (schedule view only)
- "date-timeScale", defines the visual-appearance for the date's time-scale part (schedule view only)
- "date-grouping-header", defines the visual-appearance for the date's grouping-header (schedule view only)
- "date-all-day-header", defines the visual-appearance for the date's all-day-header (schedule view only)
- "date-all-day-scroll-button", defines the visual-appearance for scroll-butttons to display within the all-day header
- "uiHighlight", defines the visual-appearance to highlight the date that contains events (The showHighlightEvent option specifies whether the control highlights the dates that contain events)
- "calendar-uiHighlight", defines the visual-appearance to highlight the date that contains events (similar with uiHighlight but applied to calendar-panel only) (The showHighlightEvent option specifies whether the control highlights the dates that contain events)
- "event", defines the visual-appearance for all events within the control
- "event-drag", defines additional visual-appearance to apply on the event being dragged
- "mark-zone", defines the visual-appearance for all mark-zones within the control
- "select", defines the visual-appearance of selected-event
- "frameFit", defines the visual-appearance to display the frame while fitting objects into the control's client area by drag
- "frameSel", defines the visual appearance to display a frame while selecting objects by drag
- "timeScale", defines the visual appearance for control's time-scale
- Type
- string
GetShortDateFormat() → {string}
The GetShortDateFormat() method gets the short date format
Returns:
Returns the short date format
- Type
- string
GetShortTimeFormat() → {string}
The GetShortTimeFormat() method gets the short time format
Returns:
Returns the short time format
- Type
- string
GetShowAllDayHeader() → {boolean}
The GetShowAllDayHeader() method specifies whether the control's header for all-day events is visible or hidden
Returns:
Returns true if the control's header for all-day events is visible
- Type
- boolean
GetShowEventLabels() → {boolean}
The GetShowEventLabels() method specifies whether the short, long and extra labels of the events are visible or hidden
Returns:
Returns true if the short, long and extra labels of the events are visible or hidden
- Type
- boolean
GetShowEvents() → {number}
The GetShowEvents() method indicates the type of the events the control displays
Returns:
Returns a numeric value that specifies the type of the events the control displays, as epxlained:
-1 (exShowAllEvents) {number}, shows all events
0 (exHideEvents) {number}, the control displays no events
1 (exShowRegularEvents) {number}, the control displays regular events
2 (exShowRepetitiveEvents) {number}, the control displays repetitive events (The Repetitive property indicates the expression that defines the dates where the event occurs)
- Type
- number
GetShowGroupingEvents() → {boolean}
The GetShowGroupingEvents() method specifies whether the schedule view shows grouped events.
Returns:
Returns true if the schedule view shows grouped events.
- Type
- boolean
GetShowHighlightEvent() → {boolean}
The GetShowHighlightEvent() method indicates whether the control highlights the dates that contain events. The "uiHighlight" shape is applied on dates with events.
Returns:
Returns truly value if the control highlights the dates that contain events (relative to the font-size of the control)
- Type
- boolean
GetShowMarkZone() → {number}
The GetShowMarkZone() method indicates how the control's mark-zones are shown
Returns:
Returns a numeric value that specifies how the control's mark-zones are shown as epxlained:
0 (exHideMarkZones) {number}, no mark-zone is displayed
1 (exShowMarkZonesBack) {number}, the mark-zone(s) are displayed on the background (behind events)
2 (exShowMarkZonesFront) {number}, the mark-zone(s) are displayed on the foreground
- Type
- number
GetShowViewCompact() → {exontrol.Schedule.ShowViewCompactEnum}
The GetShowViewCompact() method specifies how the days get arranged within the schedule-view
Returns:
Returns a value that specifies how the days get arranged within the schedule-view
- Type
- exontrol.Schedule.ShowViewCompactEnum
GetSmooth() → {number}
The GetSmooth() method defines the time in ms the control goes from one layout to another.
Returns:
Returns the time in ms the control goes from one layout to another.
- Type
- number
GetTfi() → {string|object}
The GetTfi() method gets the font attributes to apply on captions of the control.
Returns:
Returns the font attributes as a string representation such as "b monospace 16" or as an object such as {bold: true, fontName: "monospace", fontSize: 16}.
The result as a {string} can include any of the following keywords separated by space characters:
- bold, displays the text in bold (equivalent of <b> tag)
- italic, displays the text in italics (equivalent of <i> tag)
- underline, underlines the text (equivalent of <u> tag)
- strikeout, specifies whether the text is strike-through (equivalent of <s> tag)
- <fontName name>, specifies the font's family (equivalent of <font name> tag)
- <fontSize size>, specifies the size of the font (equivalent of <font ;size> tag)
- <fgColor CSSColor>, specifies the text's foreground color (equivalent of <fgcolor> tag)
- <bgColor CSSColor>, specifies the text's background color (equivalent of <bgcolor> tag)
- <shaColor CSSColor;width;offset>, defines the text's shadow (equivalent of <sha color;width;offset> tag)
- <outColor CSSColor>, shows the text with outlined characters (CSScolor) (equivalent of <out color> tag)
- <graColor CSSColor;mode;blend>, defines a gradient text (equivalent of <gra color;mode;blend> tag)
Any other word within the string result that's not recognized as a keyword is interpreted as:
- name of the font (not a number), specifies the font's family (equivalent of <font name> tag)
- size of the font (number), specifies the size of the font (equivalent of <font ;size> tag)
The result as {object} can include any of the following fields:
- bold {boolean}, displays the text in bold (equivalent of <b> tag)
- italic {boolean}, displays the text in italics (equivalent of <i> tag)
- underline {boolean}, underlines the text (equivalent of <u> tag)
- strikeout {boolean}, specifies whether the text is strike-through (equivalent of <s> tag)
- fontName {string}, specifies the font's family (equivalent of <font name> tag)
- fontSize {number}, specifies the size of the font (equivalent of <font ;size> tag)
- fgColor {string}, specifies the text's foreground color (CSScolor) (equivalent of <fgcolor> tag)
- bgColor {string}, specifies the text's background color (CSScolor) (equivalent of <bgcolor> tag)
- shaColor {object}, specifies an object of {color, width, offset} type that defines the text's shadow (equivalent of <sha color;width;offset> tag), where:
- color {string}, defines the color of the text's shadow (CSScolor)
- width {number}, defines the size of the text's shadow
- offset {number}, defines the offset to show the text's shadow relative to the text
- outColor {string}, shows the text with outlined characters (CSScolor) (equivalent of <out color> tag)
- graColor {object}, specifies an object of {color, mode, blend} type that defines a gradient text (equivalent of <gra color;mode;blend> tag), where:
- color {string}, defines the gradient-color (CSScolor)
- mode {number}, defines the gradient mode as a value between 0 and 4
- blend {number}, defines the gradient blend as a value between 0 and 1
CSSColor or CSS legal color values can be specified by the following methods:
- Hexadecimal colors, is specified with: #RRGGBB, where the RR (red), GG (green) and BB (blue) hexadecimal integers specify the components of the color. All values must be between 00 and FF. For example, #0000ff value is rendered as blue, because the blue component is set to its highest value (ff) and the others are set to 00.
- Hexadecimal colors with transparency, is specified with: #RRGGBBAA, where AA (alpha) value must be between 00 and FF. For example, #0000ff80 defines a semi-transparent blue.
- RGB colors, is specified with the RGB(red, green, blue) function. Each parameter (red, green, and blue) defines the intensity of the color and can be an integer between 0 and 255. For example, rgb(0,0,255) defines the blue color.
- RGBA colors, are an extension of RGB color values with an alpha channel as RGBA(red, green, blue, alpha) function, where the alpha parameter is a number between 0.0 (fully transparent) and 1.0 (fully opaque). For example, rgba(0,0,255,0.5) defines a semi-transparent blue.
- HSL colors, is specified with the HSL(hue, saturation, lightness) function, where hue is a degree on the color wheel (from 0 to 360) - 0 (or 360) is red, 120 is green, 240 is blue. saturation is a percentage value; 0% means a shade of gray and 100% is the full color. lightness is also a percentage; 0% is black, 100% is white. HSL stands for hue, saturation, and lightness - and represents a cylindrical-coordinate representation of colors. For example, hsl(240, 100%, 50%) defines the blue color.
- HSLA colors, are an extension of HSL color values with an alpha channel - which specifies the opacity of the object as HSLA(hue, saturation, lightness, alpha) function, where alpha parameter is a number between 0.0 (fully transparent) and 1.0 (fully opaque). For example, hsla(240, 100%, 50%,0.5) defines a semi-transparent blue.
- Predefined/Cross-browser color names, 140 color names are predefined in the HTML and CSS color specification. For example, blue defines the blue color.
- Type
- string | object
GetTimeScale() → {object}
The GetTimeScale() method applies different options to the schedule-view's time scale
Returns:
Returns the options of the view's time-scale, as an object of TimeScaleOptions type
- Type
- object
GetToolTipDelay() → {number}
The GetToolTipDelay() method specifies how long the mouse pointer must point to an object before the tool tip appears
Returns:
Returns how long the mouse pointer must point to an object before the tool tip appears
- Type
- number
GetToolTipPopDelay() → {number}
The GetToolTipPopDelay() method specifies the period in ms of time the tool top remains visible if the mouse pointer is stationary within a control
Returns:
Returns the period in ms of time the tool top remains visible if the mouse pointer is stationary within a control
- Type
- number
GetToolTipWidth() → {number}
The GetToolTipWidth() method specifies the width of the tooltip window, in pixels
Returns:
Returns the width of the tooltip window, in pixels
- Type
- number
GetUpdateEventsLabel() → {string}
The GetUpdateEventsLabel() method gets the event's label while it is resized or moved by drag and drop
Returns:
Returns the event's label while it is resized or moved by drag and drop
- Type
- string
GetVisibleRect() → {Array.<number>}
The GetVisibleRect() method indicates the control's visible rectangle
Returns:
Returns an array of [x,y,width,height] type that specifies the canvas's client rectangle
- Type
- Array.<number>
GetWheelChange() → {number}
The GetWheelChange() method defines the amount the control scrolls when the user rolls the mouse wheel.
Returns:
Returns the amount the control scrolls when the user rolls the mouse wheel.
- Type
- number
GetWindowRect() → {Array.<number>}
The GetWindowRect() method returns the window's client area.
Returns:
Returns an array of [x,y,width,height] type that specifies the window's client area
- Type
- Array.<number>
GetZoom() → {number}
The GetZoom() method defines the zoom factor of the control's content.
Returns:
A numeric value between 10 and 1000 that specifies the zoom factor of the control's content.
- Type
- number
GetZoomLevels() → {string}
The GetZoomLevels() method defines the zoom-levels the user can magnify the control's content
Returns:
Specifies a list of numbers separated by comma that indicates the zoom-levels/zoom-levels the control's content is allowed to zoom.
- Type
- string
Home()
The Home() method zooms to 100% and scrolls the control to the first-date in the layout (usually the Jan 1st)
Paste()
The Paste() method pastes the contents of the Clipboard onto the view. The Cut/Copy/Paste methods work only if the control is visible.
- Since:
- 2.1
Example
The control requires focus, so CTRL + C, CTRL + X or CTRL + V to make it works. In the same manner, the tabIndex attribute must be present into the defintion of the canvas HTML event.
addEventListener("paste", oSchedule.Paste), calls the control's Paste() method as soon as the 'paste' event occurs (CTRL + V). The paste event is fired when the user has initiated a "paste" action through the browser's user interface.
oSchedule.Shortcuts.Add("CTRL + V", oSchedule.Paste, oSchedule), calls the control's Paste() method as soon as user presses CTRL + V key combination (the "See text and images copied to the clipboard /Allow/Block" message may occur due security permissions)Scroll(key, countopt)
The Scroll() method scrolls the window based on the giving key
Parameters:
| Name | Type | Attributes | Description |
|---|---|---|---|
key |
string | Specifies a key to determines the direction to scroll the view as follows:
|
|
count |
object |
<optional> |
indicates the number of lines to scroll if key is "Up", "Down", "Left" or "Right" |
SetAllowActions(value)
The SetAllowActions() method customizes the actions the user can perform once the control is clicked or touched
Parameters:
| Name | Type | Description |
|---|---|---|
value |
string | Indicates the actions the user can perform once the control is clicked or touched.
The format of allowActions field is:
"action(shortcut,shortcut,...),action(shortcut,shortcut,...)..."where
|
Example
null {null}, indicates the control's default allowActions value
"" {string}, specifies that no operation is allowed once the user clicks or touches the control
"scroll" {string}, specifies that only "scroll" operation is allowed, no matter of the event's button or modifier-keys is pressed.SetAllowAllDayEventScroll(value)
The SetAllowAllDayEventScroll() method defines the number of events the all-day header can display one at the time
Parameters:
| Name | Type | Description |
|---|---|---|
value |
null | number | Array.<number> | Indicates the number of events the all-day header can display one at the time, as explained:
|
Example
null {null}, the all-day header displays events as many as it fits
3 {number}, indicates that the all-day header always displays 3 levels
-3 {number}, indicates that the all-day header can display up to 3 levels
[1] {array}, indicates 1 to unlimited levels
[1,4] {array}, always displays 4 levels
[1,-4] {array}, displays from 1 to 4 levelsSetAllowMoveEventToOtherGroup(value)
The SetAllowMoveEventToOtherGroup() method changes whether the event can be moved from a group to another by drag and drop
Parameters:
| Name | Type | Description |
|---|---|---|
value |
boolean | A value that indicates whether the event can be moved from a group to another by drag and drop. |
Example
0 {boolean}, the "select" shape is combined with the event's shape
1 {boolean}, the "select" shape is displayed on the event's background. The misc.padSelectEvent field specifies the space between the event's content and its selection border. SetAllowMultiDaysEvent(value)
The SetAllowMultiDaysEvent() method specifies whether the user can create events that may start on a day and ends on other
Parameters:
| Name | Type | Description |
|---|---|---|
value |
boolean | Indicates whether the user can create or resize single or multi-dates events |
Example
false {boolean}, the user can create or resize just single-date events only
true {boolean}, the user can create multi-dates events by drag and drop (create or resize)SetApplyGroupingColors(value)
The SetApplyGroupingColors() method specifies whether the schedule view shows the events using the colors of owner groups (group's eventShape option)
Parameters:
| Name | Type | Description |
|---|---|---|
value |
boolean | Indicates the schedule view shows the events using the colors of owner groups |
SetBackground(value)
The SetBackground() method defines the display options to show different parts of the control
Parameters:
| Name | Type | Description |
|---|---|---|
value |
BackgroundOptions | A value that indicates the display options to show different parts of the control. |
SetCalendar(oOptionsCal)
The SetCalendar() method applies options to the inside calendar control
Parameters:
| Name | Type | Description |
|---|---|---|
oOptionsCal |
object | Indicates options to apply to the inside calendar control, as an object of exontrol.Calendar.Options type |
SetCreateEventLabel(value)
The SetCreateEventLabel() method defines event's label while it is created by drag and drop
Parameters:
| Name | Type | Description |
|---|---|---|
value |
string | A value that indicates the event's label while it is created by drag and drop |
SetCursors(value)
The SetCursors() method changes the mouse cursor to display when pointing over different parts of the control.
Parameters:
| Name | Type | Description |
|---|---|---|
value |
string | A string expression that defines the mouse cursor to display when pointing over different parts of the control.
The format of cursors property is:
"cursor(part),cursor(part),..."where:
|
SetDayEndTime(value)
The SetDayEndTime() method defines the time the day ends at, in "HH[:MM[:NN]]" format
Parameters:
| Name | Type | Description |
|---|---|---|
value |
string | A value that indicates the time the day ends at |
SetDayStartTime(value)
The SetDayStartTime() method defines the time the day starts at, in "HH[:MM[:NN]]" format
Parameters:
| Name | Type | Description |
|---|---|---|
value |
string | A value that indicates the time the day starts at |
SetDayViewHeight(value)
The SetDayViewHeight() method defines the height of the day within the schedule panel
Parameters:
| Name | Type | Description |
|---|---|---|
value |
number | A value that indicates the height of the day within the schedule panel. |
SetDayViewWidth(value)
The SetDayViewWidth() method defines the width of the day within the schedule panel
Parameters:
| Name | Type | Description |
|---|---|---|
value |
number | A value that indicates the width of the day within the schedule panel. |
SetDefaultEventExtraLabel(value)
The SetDefaultEventExtraLabel() method defines event's default extra-label
Parameters:
| Name | Type | Description |
|---|---|---|
value |
string | A value that indicates the event's default extra-label |
SetDefaultEventLongLabel(value)
The SetDefaultEventLongLabel() method defines event's default long-label
Parameters:
| Name | Type | Description |
|---|---|---|
value |
string | A value that indicates the event's default long-label |
SetDefaultEventShortLabel(value)
The SetDefaultEventShortLabel() method defines event's default short-label
Parameters:
| Name | Type | Description |
|---|---|---|
value |
string | A value that indicates the event's default short-label |
SetDefaultEventToolTip(value)
The SetDefaultEventToolTip() method defines event's default tooltip
Parameters:
| Name | Type | Description |
|---|---|---|
value |
string | A value that indicates the event's default tooltip |
SetDisplayGroupingButton(value)
The SetDisplayGroupingButton() method specifies whether the grouping button is displayed in the date header.
The grouping button is displayed if:
- displayGroupingButton option is true
- showGroupingEvents option is true
The control displays groups if:
- showGroupingEvents option is true
- The Groups collection has visible elements. By default, the Groups collection contains no Group objects
Parameters:
| Name | Type | Description |
|---|---|---|
value |
boolean | Indicates whether the grouping button is displayed in the date header |
SetEvents(oEventsDef)
The SetEvents() method defines the events of the control
Parameters:
| Name | Type | Description |
|---|---|---|
oEventsDef |
object | Defines the events to add |
SetFormatText(value)
The SetFormatText() method changes the format to display the event's caption.
Parameters:
| Name | Type | Description |
|---|---|---|
value |
exontrol.DrawTextFormatEnum | Specifies a value of exontrol.DrawTextFormatEnum value that defines the format to show the event's caption.
The exontrol.DrawTextFormatEnum type supports the following flags:
|
Example
null {null}, centers the caption
32 or exontrol.DrawTextFormatEnum.exTextSingleLine {number}, defines a single-line caption
0x2A or exontrol.DrawTextFormatEnum.exTextSingleLine | exontrol.DrawTextFormatEnum.exTextAlignRight | exontrol.DrawTextFormatEnum.exTextAlignBottom {number}, defines a single-line caption right/bottom-alignedSetGroups(oGroupsDef)
The SetGroups() method defines the groups of the control
Parameters:
| Name | Type | Description |
|---|---|---|
oGroupsDef |
object | Defines the groups to add |
SetHeaderAllDayEventHeight(value)
The SetHeaderAllDayEventHeight() method defines the height of the events to display within the all-day header (relative to the font-size of the control)
Parameters:
| Name | Type | Description |
|---|---|---|
value |
number | A value that indicates the height of the events to display within the all-day header. |
Example
null {null}, the height of the events to display within the all-day header is the same as the size of the control's font (100%)
0 {number}, hides the all-day header
2 {number}, the height of the events to display within the all-day header is 2 times the size of the control's fontSetHeaderDayHeight(value)
The SetHeaderDayHeight() method defines the height of the day's header (relative to the font-size of the control)
Parameters:
| Name | Type | Description |
|---|---|---|
value |
number | A value that indicates the height of the day's header. |
SetHeaderDayLongLabel(value)
The SetHeaderDayLongLabel() method sets the alternate HTML labels being shown on date's header, when the time-scale is visible. The format the "headerDayLongLabel" option is "ALT1[<|>ALT2<|>...][<=>EXPR]", where ALT defines a HTML label that supports a lot of predefined built-in tags, EXPR defines an expression to specify which HTML label to be shown when a condition is met.
The ALT part of the label supports ex-HTLM tags such as (<b>, <i>, <fgcolor>, ...) and <%DATE%> tags as follows:
- <%d%> - Day of the month in one or two numeric digits, as needed (1 to 31)
- <%dd%> - Day of the month in two numeric digits (01 to 31)
- <%d1%> - First letter of the weekday (S to S)
- <%loc_d1%> - Indicates day of week as a one-letter abbreviation using the current user settings
- <%d2%> - First two letters of the weekday (Su to Sa)
- <%loc_d2%> - Indicates day of week as a two-letters abbreviation using the current user settings
- <%d3%> - First three letters of the weekday (Sun to Sat)
- <%loc_d3%> equivalent with <%loc_ddd%>
- <%ddd%> - First three letters of the weekday (Sun to Sat)
- <%loc_ddd%> - Indicates the day of week as a three-letter abbreviation using the current user regional and language settings
- <%dddd%> - Full name of the weekday (Sunday to Saturday)
- <%loc_dddd%> - Indicates day of week as its full name using the current user regional and language settings
- <%i%> - Displays the number instead the date
- <%w%> - Day of the week (1 to 7)
- <%ww%> - Week of the year (1 to 53)
- <%m%> - Month of the year in one or two numeric digits, as needed (1 to 12)
- <%mr%> - Month of the year in Roman numerals, as needed (I to XII)
- <%mm%> - Month of the year in two numeric digits (01 to 12)
- <%m1%> - First letter of the month (J to D)
- <%loc_m1%> - Indicates month as a one-letter abbreviation using the current user settings
- <%m2%> - First two letters of the month (Ja to De)
- <%loc_m2%> - Indicates month as a two-letters abbreviation using the current user settings
- <%m3%> - First three letters of the month (Jan to Dec)
- <%loc_m3%> - equivalent with <%loc_mmm%>
- <%mmm%> - First three letters of the month (Jan to Dec)
- <%loc_mmm%> - Indicates month as a three-letter abbreviation using the current user regional and language settings
- <%mmmm%> - Full name of the month (January to December)
- <%loc_mmmm%> - Indicates month as its full name using the current user regional and language settings
- <%q%> - Date displayed as the quarter of the year (1 to 4)
- <%y%> - Number of the day of the year (1 to 366)
- <%yy%> - Last two digits of the year (01 to 99)
- <%yyyy%> - Full year (0100 to 9999)
- <%hy%> - Date displayed as the half of the year (1 to 2)
- <%loc_g%> - Indicates period/era using the current user regional and language settings
- <%loc_gg%> - Indicates period/era using the current user regional and language settings
- <%loc_sdate%> - Indicates the date in the short format using the current user regional and language settings
- <%loc_ldate%> - Indicates the date in the long format using the current user regional and language settings
- <%loc_dsep%> - Indicates the date separator using the current user regional and language settings (/)
- <%h%> - Hour in one or two digits, as needed (0 to 23)
- <%hh%> - Hour in two digits (00 to 23)
- <%h12%> - Hour in 12-hour time format, in one or two digits - [0(12),11]
- <%hh12%> - Hour in 12-hour time format, in two digits - [00(12),11]
- <%n%> - Minute in one or two digits, as needed (0 to 59)
- <%nn%> - Minute in two digits (00 to 59)
- <%s%> - Second in one or two digits, as needed (0 to 59)
- <%ss%> - Second in two digits (00 to 59)
- <%AM/PM%> - Twelve-hour clock with the uppercase letters "AM" or "PM", as appropriate
- <%loc_AM/PM%> - Indicates the time marker such as AM or PM using the current user regional and language settings
- <%loc_A/P%> - Indicates the one character time marker such as A or P using the current user regional and language settings
- <%loc_time%> - Indicates the time using the current user regional and language settings
- <%loc_time24%> - Indicates the time in 24 hours format without a time marker using the current user regional and language settings
- <%loc_tsep%> - indicates the time separator using the current user regional and language settings (:)
- <%loc_y%> - Represents the Year only by the last digit, using current regional settings
- <%loc_yy%> - Represents the Year only by the last two digits, using current regional settings. A leading zero is added for single-digit years
- <%loc_yyyy%> - Represents the Year by a full four or five digits, depending on the calendar used. Thai Buddhist and Korean calendars have five-digit years. The "yyyy" pattern shows five digits for these two calendars, and four digits for all other supported calendars. Calendars that have single-digit or two-digit years, such as for the Japanese Emperor era, are represented differently. A single-digit year is represented with a leading zero, for example, "03". A two-digit year is represented with two digits, for example, "13". No additional leading zeros are displayed
The EXPR supports the value keyword that specifies the date being queried. The EXPR supports predefined constants, functions and operators such as day, month, year, +, -, and so on.
Parameters:
| Name | Type | Description |
|---|---|---|
value |
string | A value that specifies the alternate HTML labels being shown on date's header, when the time-scale is visible. |
SetHeaderDayShortLabel(value)
The SetHeaderDayShortLabel() method sets the alternate HTML labels being shown on date's header, when the time-scale is not visible. The format the "headerDayShortLabel" option is "ALT1[<|>ALT2<|>...][<=>EXPR]", where ALT defines a HTML label that supports a lot of predefined built-in tags, EXPR defines an expression to specify which HTML label to be shown when a condition is met.
The ALT part of the label supports ex-HTLM tags such as (<b>, <i>, <fgcolor>, ...) and <%DATE%> tags as follows:
- <%d%> - Day of the month in one or two numeric digits, as needed (1 to 31)
- <%dd%> - Day of the month in two numeric digits (01 to 31)
- <%d1%> - First letter of the weekday (S to S)
- <%loc_d1%> - Indicates day of week as a one-letter abbreviation using the current user settings
- <%d2%> - First two letters of the weekday (Su to Sa)
- <%loc_d2%> - Indicates day of week as a two-letters abbreviation using the current user settings
- <%d3%> - First three letters of the weekday (Sun to Sat)
- <%loc_d3%> equivalent with <%loc_ddd%>
- <%ddd%> - First three letters of the weekday (Sun to Sat)
- <%loc_ddd%> - Indicates the day of week as a three-letter abbreviation using the current user regional and language settings
- <%dddd%> - Full name of the weekday (Sunday to Saturday)
- <%loc_dddd%> - Indicates day of week as its full name using the current user regional and language settings
- <%i%> - Displays the number instead the date
- <%w%> - Day of the week (1 to 7)
- <%ww%> - Week of the year (1 to 53)
- <%m%> - Month of the year in one or two numeric digits, as needed (1 to 12)
- <%mr%> - Month of the year in Roman numerals, as needed (I to XII)
- <%mm%> - Month of the year in two numeric digits (01 to 12)
- <%m1%> - First letter of the month (J to D)
- <%loc_m1%> - Indicates month as a one-letter abbreviation using the current user settings
- <%m2%> - First two letters of the month (Ja to De)
- <%loc_m2%> - Indicates month as a two-letters abbreviation using the current user settings
- <%m3%> - First three letters of the month (Jan to Dec)
- <%loc_m3%> - equivalent with <%loc_mmm%>
- <%mmm%> - First three letters of the month (Jan to Dec)
- <%loc_mmm%> - Indicates month as a three-letter abbreviation using the current user regional and language settings
- <%mmmm%> - Full name of the month (January to December)
- <%loc_mmmm%> - Indicates month as its full name using the current user regional and language settings
- <%q%> - Date displayed as the quarter of the year (1 to 4)
- <%y%> - Number of the day of the year (1 to 366)
- <%yy%> - Last two digits of the year (01 to 99)
- <%yyyy%> - Full year (0100 to 9999)
- <%hy%> - Date displayed as the half of the year (1 to 2)
- <%loc_g%> - Indicates period/era using the current user regional and language settings
- <%loc_gg%> - Indicates period/era using the current user regional and language settings
- <%loc_sdate%> - Indicates the date in the short format using the current user regional and language settings
- <%loc_ldate%> - Indicates the date in the long format using the current user regional and language settings
- <%loc_dsep%> - Indicates the date separator using the current user regional and language settings (/)
- <%h%> - Hour in one or two digits, as needed (0 to 23)
- <%hh%> - Hour in two digits (00 to 23)
- <%h12%> - Hour in 12-hour time format, in one or two digits - [0(12),11]
- <%hh12%> - Hour in 12-hour time format, in two digits - [00(12),11]
- <%n%> - Minute in one or two digits, as needed (0 to 59)
- <%nn%> - Minute in two digits (00 to 59)
- <%s%> - Second in one or two digits, as needed (0 to 59)
- <%ss%> - Second in two digits (00 to 59)
- <%AM/PM%> - Twelve-hour clock with the uppercase letters "AM" or "PM", as appropriate
- <%loc_AM/PM%> - Indicates the time marker such as AM or PM using the current user regional and language settings
- <%loc_A/P%> - Indicates the one character time marker such as A or P using the current user regional and language settings
- <%loc_time%> - Indicates the time using the current user regional and language settings
- <%loc_time24%> - Indicates the time in 24 hours format without a time marker using the current user regional and language settings
- <%loc_tsep%> - indicates the time separator using the current user regional and language settings (:)
- <%loc_y%> - Represents the Year only by the last digit, using current regional settings
- <%loc_yy%> - Represents the Year only by the last two digits, using current regional settings. A leading zero is added for single-digit years
- <%loc_yyyy%> - Represents the Year by a full four or five digits, depending on the calendar used. Thai Buddhist and Korean calendars have five-digit years. The "yyyy" pattern shows five digits for these two calendars, and four digits for all other supported calendars. Calendars that have single-digit or two-digit years, such as for the Japanese Emperor era, are represented differently. A single-digit year is represented with a leading zero, for example, "03". A two-digit year is represented with two digits, for example, "13". No additional leading zeros are displayed
The EXPR supports the value keyword that specifies the date being queried. The EXPR supports predefined constants, functions and operators such as day, month, year, +, -, and so on.
Parameters:
| Name | Type | Description |
|---|---|---|
value |
string | A value that specifies the alternate HTML labels being shown on date's header, when the time-scale is not visible. |
SetHeaderGroupHeight(value)
The SetHeaderGroupHeight() method defines the height of the group's header (relative to the font-size of the control)
Parameters:
| Name | Type | Description |
|---|---|---|
value |
number | A value that indicates the height of the group's header. |
Example
0 {number}, hides the group's header
2 {number}, the height of the group's header is 2 times the size of the control's fontSetImageAlign(value)
The SetImageAlign() method changes the alignment of the event's image (reserved for future use only).
Parameters:
| Name | Type | Description |
|---|---|---|
value |
number | Defines the alignment of the event's image as one of the following:
|
Example
null {null}, the image is aligned left to the caption (default)
1 {number}, the image is displayed to the right of the event's captionSetImageSize(value)
The SetImageSize() method changes the size of the event's image (reserved for future use only).
Parameters:
| Name | Type | Description |
|---|---|---|
value |
any | Indicates the size of the event's image as explained:
|
Example
null {null}, Indicates that the event's image is displayed as it is (full-sized).
0 {number}, no image is displayed
64 {number}, the image is scaled to fit a 64 x 64 rectangle
-64 {number}, the image is strected to a 64 x 64 rectangle
[32,64] {array}, scales the image to the largest ratio-rectangle (32 x 64) that fits the client
[-32,-64] {array}, stretches the image to a 32 x 64 rectangleSetLocked(value)
The SetLocked() method locks or unlocks the control.
Parameters:
| Name | Type | Description |
|---|---|---|
value |
boolean | A boolean value that indicates whether the control is locked(protected) or unlocked |
Example
false {boolean}, unlocks the control (can select any event)
true {boolean}, locks the control (can't select any event)SetLongDateFormat(value)
The SetLongDateFormat() method defines the long date format
Parameters:
| Name | Type | Description |
|---|---|---|
value |
string | A value that indicates the long date format |
SetLongTimeFormat(value)
The SetLongTimeFormat() method defines the long time format
Parameters:
| Name | Type | Description |
|---|---|---|
value |
string | A value that indicates the long time format |
SetMisc(value)
The SetMisc() method defines the control's miscellaneous options
Parameters:
| Name | Type | Description |
|---|---|---|
value |
MiscellaneousOptions | A value that indicates the control's miscellaneous options. |
SetOnResizeControl(value)
The SetOnResizeControl() method changes the panel to resize once the entire control gets resized
Parameters:
| Name | Type | Description |
|---|---|---|
value |
exontrol.Schedule.OnResizeControlEnum | A value that specifies the panel to resize once the entire control gets resized. |
Example
128 or exontrol.Schedule.OnResizeControlEnum.exDisableSplitter {number}, disables the splitter, so the user can not resize the panels using the control's vertical split bar
768 or exontrol.Schedule.OnResizeControlEnum.exChangePanels | exontrol.Schedule.OnResizeControlEnum.exHideSplitter {number}, shows the schedule view only (hides the calendar panel)SetOnSelectDate(value)
The SetOnSelectDate() method changes the action that the control does once the user selects new dates in the calendar panel
Parameters:
| Name | Type | Description |
|---|---|---|
value |
exontrol.Schedule.OnSelectDateEnum | A value that specifies the action that the control does once the user selects new dates in the calendar panel. |
Example
null {null}, equivalent of -1 or exontrol.Schedule.OnSelectDateEnum.exFitSelToView
0 or exontrol.Schedule.OnSelectDateEnum.exNoViewChange {number}, no scroll / change occurs whitin the schedule view once the calendar's selection is changedSetOptions(nOptions, bIncludeAllopt) → {boolean}
The SetOptions() method applies new options to the view.
Parameters:
| Name | Type | Attributes | Description |
|---|---|---|---|
nOptions |
object | Specifies an object of Schedule.Options type that indicates the new options to apply | |
bIncludeAll |
boolean |
<optional> |
Indicates whether all fields of nOptions are included in the event's oOptions object |
Returns:
Returns true, if there were options applied to the event
- Type
- boolean
Example
oSchedule.Options = {imageAlign: 1, imageSize: 24}, changes the alignment and the size for all images within the control.
The oSchedule.Options = value statement is equivalent with oSchedule.SetOptions(value) or oSchedule.oSV.SetOptions(value)SetPad(value)
The SetPad() method changes the event's padding or the space between event's content and its borders.
Parameters:
| Name | Type | Description |
|---|---|---|
value |
number | Array.<number> | string | Specifies a value that could be:
|
Example
null {null}, indicates that the default-padding field is used ([4,4])
0 {number}, indicates no padding
"8,4" {string}, increases the event's width with 2 * 8-pixels and event's height with 2 * 4-pixels
[8,4] {array}, increases the event's width with 2 * 8-pixels and event's height with 2 * 4-pixelsSetPaneMinWidthLeft(value)
The SetPaneMinWidthLeft() method defines the minimum size(width) of the left panel
Parameters:
| Name | Type | Description |
|---|---|---|
value |
number | A value that defines the minimum size(width) of the left panel. |
SetPaneMinWidthRight(value)
The SetPaneMinWidthRight() method defines the minimum size(width) of the right panel
Parameters:
| Name | Type | Description |
|---|---|---|
value |
number | A value that defines the minimum size(width) of the right panel. |
SetPaneWidthLeft(value)
The SetPaneWidthLeft() method defines the size(width) of the left panel
Parameters:
| Name | Type | Description |
|---|---|---|
value |
number | A value that defines the size(width) of the left panel. |
SetPaneWidthRight(value)
The SetPaneWidthRight() method defines the size(width) of the right panel
Parameters:
| Name | Type | Description |
|---|---|---|
value |
number | A value that defines the size(width) of the right panel. |
SetReadOnly(value)
The SetReadOnly() method sets the control in read-only mode
Parameters:
| Name | Type | Description |
|---|---|---|
value |
boolean | A boolean value that indicates whether the control is read-only |
Example
false {boolean}, the user can edit or drag any event
true {boolean}, the user can not edit or drag the eventsSetScrollPos(value)
The SetScrollPos() method scrolls horizontally and/or vertically the control's default view.
Parameters:
| Name | Type | Description | |||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|
value |
object | Specifies an object of {x,y} type that defines the view's horizontal and vertical scroll-position.
Properties
|
SetSelectEventStyle(value)
The SetSelectEventStyle() method changes how the selected-event gets displayed
Parameters:
| Name | Type | Description |
|---|---|---|
value |
number | A value that specifies how the selected-event gets displayed. |
Example
0 {number}, the "select" shape is combined with the event's shape
1 {number}, the "select" shape is displayed on the event's background. The misc.padSelectEvent field specifies the space between the event's content and its selection border.
2 {number}, the "select" shape is displayed on the event's background, but it is shown using the event's primitive (rectangle, round, oval...). The misc.padSelectEvent field specifies the space between the event's content and its selection border.SetShapes(value)
The SetShapes() method changes the shapes each part of the control can display.
Parameters:
| Name | Type | Description |
|---|---|---|
value |
string | A string expression that defines the shapes each part of the control can display.
The format of shapes property is:
"shape(part),shape(part),..."where:
|
Example
null {null}, specifies the default visual appearance
"" {string}, no shape (no visual appearance is applied to any part of the control)
"red(eventAlt)", "#FF0000(eventAlt)", "rgb(255,0,0)(eventAlt)", "rgba(255,0,0,1)(eventAlt)" {string}, shows alternate-events in red
'{"hover":{"fillColor":"black","tfi":{"fgColor":"white"}}}(event)' {string}, shows the event in white on a black-background, while the cursor hovers it
"xxx(d),yyy(d,m),zzz(y)" {string}, specifies that the exontrol.Shapes.Schedule.xxx combined with exontrol.Shapes.Schedule.yyy object defines the visual appearance of "d" part of the control, exontrol.Shapes.Schedule.yyy object defines the visual appearance of "m" part of the control and exontrol.Shapes.Schedule.zzz object defines the visual appearance of "y" part of the controlSetShortDateFormat(value)
The SetShortDateFormat() method defines the short date format
Parameters:
| Name | Type | Description |
|---|---|---|
value |
string | A value that indicates the short date format |
SetShortTimeFormat(value)
The SetShortTimeFormat() method defines the short time format
Parameters:
| Name | Type | Description |
|---|---|---|
value |
string | A value that indicates the short time format |
SetShowAllDayHeader(value)
The SetShowAllDayHeader() method shows or hides the header for all-day events
Parameters:
| Name | Type | Description |
|---|---|---|
value |
boolean | Specifies any of the following values: false{boolean} or null {null}, hides the control's all-day header true{boolean}, shows the control's all-day header |
SetShowEventLabels(value)
The SetShowEventLabels() method specifies whether the short, long and extra labels of the events are visible or hidden
Parameters:
| Name | Type | Description |
|---|---|---|
value |
boolean | A value that indicates whether the short, long and extra labels of the events are visible or hidden |
SetShowEvents(value)
The SetShowEvents() method indicates the type of the events the control displays
Parameters:
| Name | Type | Description |
|---|---|---|
value |
number | Specifies any of the following values: -1 (exShowAllEvents) {number}, shows all events 0 (exHideEvents) {number}, the control displays no events 1 (exShowRegularEvents) {number}, the control displays regular events 2 (exShowRepetitiveEvents) {number}, the control displays repetitive events (The Repetitive property indicates the expression that defines the dates where the event occurs) |
SetShowGroupingEvents(value)
The SetShowGroupingEvents() method specifies whether the schedule view shows grouped events.
The control displays groups if:
- showGroupingEvents option is true
- The Groups collection has visible elements. By default, the Groups collection contains no Group objects
Parameters:
| Name | Type | Description |
|---|---|---|
value |
boolean | Indicates whether the schedule view shows grouped events |
SetShowHighlightEvent(value)
The SetShowHighlightEvent() method defines whether the control highlights the dates that contain events (relative to the font-size of the control)
Parameters:
| Name | Type | Description |
|---|---|---|
value |
boolean | A value that indicates whether the control highlights the dates that contain events. |
SetShowMarkZone(value)
The SetShowMarkZone() method indicates how the control's mark-zones are shown
Parameters:
| Name | Type | Description |
|---|---|---|
value |
number | Specifies any of the following values: 0 (exHideMarkZones) {number}, no mark-zone is displayed 1 (exShowMarkZonesBack) {number}, the mark-zone(s) are displayed on the background (behind events) 2 (exShowMarkZonesFront) {number}, the mark-zone(s) are displayed on the foreground |
SetShowViewCompact(value)
The SetShowViewCompact() method changes how the days get arranged within the schedule-view
Parameters:
| Name | Type | Description |
|---|---|---|
value |
exontrol.Schedule.ShowViewCompactEnum | A value that specifies how the days get arranged within the schedule-view. |
Example
-1 or exontrol.Schedule.ShowViewCompactEnum.exViewCalendarCompact {number}, the schedule view arranges the days as they are shown in the calendar panel, excepts that the first day of the month starts right after the last day of the previously month, or start to a new row.
3 or exontrol.Schedule.ShowViewCompactEnum.exViewSingleRowLockHeader {number}, the schedule view arranges all days to a single row (horizontally), while the date header is shown/locked on the top while the chart is vertically scrolled.SetSmooth(value)
The SetSmooth() method changes the time in ms the control goes from one layout to another (0 indicates no smooth-transition is performed).
Parameters:
| Name | Type | Description |
|---|---|---|
value |
number | Indicates the time in ms the control goes from one layout to another. |
Example
0 {number}, no smooth changes once the control goes from a layout to another
125 {number}, specifies that a smooth-transition is performed from a layout to another for 125 ms.SetTfi(value)
The SetTfi() method sets the font attributes to apply on captions of the control.
Parameters:
| Name | Type | Description |
|---|---|---|
value |
string | object | Indicates a string representation such as "b monospace 16" or as an object such as {bold: true, fontName: "monospace", fontSize: 16}.
The value as {string} supports any of the following keywords (each keyword can be specified using first letters only such as "b" for "bold) separated by space characters:
Any other word within the string value that's not recognized as a keyword is interpreted as:
The value as {object} supports any of the following fields:
CSSColor or CSS legal color values can be specified by the following methods:
|
Example
null {null}, the tfi field is ignored
"bold monospace 16 <fg blue>" {string}, defines Monospace font of 16px height, bold and blue
{bold: true, fontName: "monospace", fontSize: 16, fgColor: "blue"} {object}, defines Monospace font of 16px height, bold and blueSetTimeScale(oTimeScaleOpts)
The SetTimeScale() method applies different options to the schedule-view's time scale
Parameters:
| Name | Type | Description |
|---|---|---|
oTimeScaleOpts |
object | Specifies the options to apply on the schedule-view's time scale, as an object of TimeScaleOptions type |
SetToolTipDelay(value)
The SetToolTipDelay() method changes how long the mouse pointer must point to an object before the tool tip appears
Parameters:
| Name | Type | Description |
|---|---|---|
value |
number | A value that specifies how long the mouse pointer must point to an object before the tool tip appears. |
Example
0 {number}, the tooltip is shown "immediately"
128 {number}, the tooltip is displayed in 128 ms.SetToolTipPopDelay(value)
The SetToolTipPopDelay() method changes the period in ms of time the tool top remains visible if the mouse pointer is stationary within a control
Parameters:
| Name | Type | Description |
|---|---|---|
value |
number | A value that specifies the period in ms of time the tool top remains visible if the mouse pointer is stationary within a control. |
Example
0 {number}, no tooltip is shown for any object (disabled)
-1 {number}, the tooltip stays indefinitely (negative)
1000 {number}, the tooltip is visible for 1 secondSetToolTipWidth(value)
The SetToolTipWidth() method changes the width of the tooltip window, in pixels
Parameters:
| Name | Type | Description |
|---|---|---|
value |
number | A value that specifies the width of the tooltip window, in pixels. |
Example
0 {number}, no tooltip is shown for any object (disabled)
-1 {number}, the tooltip's content is displayed on a single line (without limit the width of it)
300 {number}, the tooltip's max-width is 300 pixelsSetUpdateEventsLabel(value)
The SetUpdateEventsLabel() method defines event's label while it is resized or moved by drag and drop
Parameters:
| Name | Type | Description |
|---|---|---|
value |
string | A value that indicates the event's label while it is resized or moved by drag and drop |
SetWheelChange(value)
The SetWheelChange() method changes the amount the control scrolls when the user rolls the mouse wheel.
Parameters:
| Name | Type | Description |
|---|---|---|
value |
number | A value that specifies the amount the control scrolls when the user rolls the mouse wheel. |
Example
0 {number}, locks any action the mouse's wheel performs
18 {number}, scrolls the control by 18-pixels when mouse's wheel is rotated (CTRL + wheel scrolls horizontally)SetZoom(value)
The SetZoom() method defines the zoom factor of the control's content.
Parameters:
| Name | Type | Description |
|---|---|---|
value |
number | A numeric value between 10 and 1000 that specifies the zoom factor of the control's content. |
Example
null {null}, Specifies normal-view (100%)
150 {number}, Indicates that the control's content is magnfied to 150%SetZoomLevels(value)
The SetZoomLevels() method defines the zoomLevels factor of the control's content.
Parameters:
| Name | Type | Description |
|---|---|---|
value |
string | specifies a list of numbers separated by comma that indicates the zoom-levels/zoom-levels the control's content is allowed to zoom |
Example
null {null}, Specifies that the control's zoom factor is always 100%
150 {number}, Specifies that the control's zoom factor is always 150%
"50,100,200,350" {string}, Indicates that the zoom-factor can be any of selected values, and the levels of zoom-factor is 50% to 350%Smooth(callback, thisArg, oSmoothOptsopt, thisArg)
The Smooth() method performs a smooth-transition from a layout to another. The smooth-transition goes from the current layout to the new layout generated by the callback.
Parameters:
| Name | Type | Attributes | Description |
|---|---|---|---|
callback |
callback | Indicates a callback function that generates the new layout for the control ( such as removing or adding new events to the control). The callback is provided with no arguments. | |
thisArg |
any | Specifies the value of this keyword for callback functions. If missing, the SV object reference is used instead | |
oSmoothOpts |
object |
<optional> |
Indicates an object of {cbkR,cbkI,cbkT} type that defines callback to invoke when Smooth operation begins, progress and ends as explained below:
|
thisArg |
any | defines the value of "this" keyword during cbkI, cbkR or cbkT callbacks. |
Soom(zoomTo, oPointAbsopt)
The Soom() method zooms or/and scrolls the control's content.
Parameters:
| Name | Type | Attributes | Description |
|---|---|---|---|
zoomTo |
number | Indicates a numeric value that defines the target-zoom factor as a value between 10 and 1000 (no zoom if null or undefined) | |
oPointAbs |
object |
<optional> |
Specifies an object of {x,y} or array as [x,y] type that specifies the absolute-coordinates of the point to scroll into the client |
Example
oSchedule.Soom(100, [0,0]), zooms to 100% and brings the origin (0,0) at its original position (Home)ToggleDate(date)
The ToggleDate() method resizes the date to full-fits the view, or restores back the view
Parameters:
| Name | Type | Description |
|---|---|---|
date |
Date | Indicates the date to fit |
slADS(oTypeopt)
slADS/setLastAllDayScroll() method stores or resets the last scroll-button of all-day header being clicked, to prevent double-clicking the view once the scroll-button is not required anymore
Parameters:
| Name | Type | Attributes | Description |
|---|---|---|---|
oType |
object |
<optional> |
Indicates null to reste, or an object of {s(croll)} type |
toDSE(date) → {number|Date}
The toDSE/toDayStartEnd() method changes the date to fit the day's start-end margins (dayStartTime and dayEndTime).
Parameters:
| Name | Type | Description |
|---|---|---|
date |
number | Date | Specifies the date to fit within the control's start-end margins, as a number or a Date |
Returns:
Returns the date itself (as provided)
- Type
- number | Date
Example
oSchedule.oSV.toDSE(Date.Create("#1/1/2001#")), returns "Mon, 01 Jan 2001 08:00:00 GMT", while the dayStartTime is "08:00" or "Mon, 01 Jan 2001 06:30:00 GMT", while the dayStartTime is "6:30"Events
onanchorclick
The onanchorclick() event occurs once the user clicks an anchor element (the <a id;options> ex-HTML part marks an anchor or hyperlink element)
Parameters:
| Name | Type | Description | |||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|
oEvent |
object | Holds information about anchor being clicked
Properties
|
- Since:
- 2.2
Example
The following samples display information about the element being clicked:
oSchedule.Listeners.Add("onanchorclick", function (oEvent)
{
console.log(oEvent);
})
or
oSchedule.oSV.onanchorclick = function (oEvent)
{
console.log(oEvent);
}
where oSchedule is an object of Schedule type, oSV is member of Schedule type, of TV type.onchange
The onchange() event notifies your application that an event, or more has been changed (create, move/resize)
Parameters:
| Name | Type | Description | |||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|
oEvent |
object | Holds information about the object / action that occured
Properties
|
Example
The following samples display the change within the control that just occured:
oSchedule.Listeners.Add("onchange", function (oEvent)
{
console.log(oEvent);
})
or
oSchedule.oSV.onchange = function (oEvent)
{
console.log(oEvent);
}
where oSchedule is an object of Schedule type, oSV is member of Schedule type, of SV type.onclick
The onclick() method occurs once the user clicks or double-clicks the view.
Parameters:
| Name | Type | Description | ||||||||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
oEvent |
object | specifies an object of {dblClick,button,modifiers,..} type, that holds information about the object being clicked
Properties
|
Example
The following samples display information about the event being clicked:
oSchedule.Listeners.Add("onclick", function (oEvent)
{
console.log(oEvent);
})
or
oSchedule.oSV.onclick = function (oEvent)
{
console.log(oEvent);
}
where oSchedule is an object of Schedule type. The oSV is member of Schedule type, of SV type.onscroll
The onscroll() method notifies your application once the view has been scrolled.
Parameters:
| Name | Type | Description | ||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
oEvent |
object | Specifies an object of {view,type,value} that holds information about the view's scroll that has been changed
Properties
|
Example
The following samples display the view's scroll position once it is changed:
oSchedule.Listeners.Add("onscroll", function (oEvent)
{
console.log(oEvent);
})
or
oSchedule.oSV.onscroll = function (oEvent)
{
console.log(oEvent);
}
where oSchedule is an object of Schedule type. The oSV is member of Schedule type, of SV type.