/* @license Copyright (C) Exontrol. All rights reserved. */ /////////////////////////////////////////////////////////// (exontrol.Schedule) // // The exontrol.Schedule class provides the following fields (public): // // Listeners {object}, holds a reference to exontrol.Lts which defines the events of the control. // Shortcuts {object}, holds a reference to exontrol.Sts which defines the shortcuts of the control. // // The exontrol.Schedule class provides the following methods (public): // // BeginUpdate(), prevents invalidating the control until the EndUpdate() method is called // EndUpdate(), resumes invalidating the control // Refresh(), refreshes the control // Update(callback, thisArg), locks the control's update during the callback, and invalidates the control once the method ends // Smooth(callback, thisArg), 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 // Home(), zooms to 100% and scrolls the control to the first-date in the layout (usually the Jan 1st) // Soom(zoomTo, oPointAbs), zooms or/and scrolls the control's content // FitToClient(rtLayout), ensures that the entire (null/undefined) or giving layout fits the control's client area // EnsureVisibleClient(clientA[, ensureOpts]), ensures that the giving client fits the control's client area // Selection/GetSelection()/SetSelection(value), gets or sets the control's selected-events // SelectAll(toSelect), selects all events within the control. For instance, SelectAll("vis"), selects the visible events only // UnselectAll, clears the selection // RemoveSelection(), deletes the selected-events // EnsureVisibleSelection(), scrolls the control's content to ensure that the control's selection fits the control's client area // AddScheduleView(name,attributes) {SV}, creates a new view to display the events // RemoveScheduleView(name), removes the view already created by the AddScheduleView() method // SurfaceView(name) {SV}, gets the schedule-view by name (which was previously created by the AddScheduleView() method) // Events/GetEvents()/SetEvents(oEventsDef) {Events}, defines the control's events // Event(id) {Event}, returns the event based on its index or identifier // Groups/GetGroups()/SetGroups(oGroupsDef) {Groups}, defines the control's groups of events // Group(id) {Group}, returns the group based on its index or identifier // MarkZones/GetMarkZones()/SetMarkZones(oMarkZonesDef) {MarkZones}, defines the control's mark-zones // MarkZone(id) {MarkZone}, returns the mark-zone based on its index or identifier // Scroll(key), scrolls the view based on the giving key // Layout/GetLayout()/SetLayout(value) {string}, saves or loads the control's UI layout // Statistics/GetStatistics() {string}, gives statistics data of objects being hold by the control // Cut(), moves the selection to the Clipboard // Copy(), copies the selection to the Clipboard // Paste(), pastes the contents of the Clipboard onto the view. // // Options/GetOptions()/SetOptions(value) {object}, specifies the options of the exontrol.Schedule control // Tfi/GetTfi()/SetTfi(value), specifies an object of {bold,italic,...}/exontrol.TFI type that defines font attributes to display the captions within the control // Locked/GetLocked()/SetLocked(value) {boolean}, specifies whether the control is locked(protected) or unlocked // ReadOnly/GetReadOnly()/SetReadOnly(value) {boolean}, specifies whether the control is read-only // WheelChange/GetWheelChange()/SetWheelChange(value), defines the amount the control scrolls when the user rolls the mouse wheel // GetSmooth()/SetSmooth(value), defines the time in ms the control goes from one layout to another // Zoom/GetZoom()/SetZoom(value), defines the zoom factor of the control's content // ZoomLevels/GetZoomLevels()/SetZoomLevels(value), defines the zoom-levels the user can magnify the control's content // SingleSel/GetSingleSel()/SetSingleSel(value), specifies whether the control supports single, multiple, toggle selection // Selection/GetSelection()/SetSelection(value), gets or sets the control's selected-events // FormatText/GetFormatText()/SetFormatText(value) {exontrol.DrawTextFormatEnum}, defines the global format to display the event's caption // Pad/GetPad()/SetPad(value) {(number|number[]|string)}, specifies the space between event's content and its borders // ImageSize/GetImageSize()/SetImageSize(value) {any}, defines the global size of the event's image. The image can be added using the exontrol.HTMLPicture.Add() method (reserved for future use only) // ImageAlign/GetImageAlign()/SetImageAlign(value) {number}, defines the global-alignment of the event's image relative to its caption (reserved for future use only) // Shapes/GetShapes()/SetShapes(value) {string}, defines the shapes each part of the control can display. The shapes field customizes the control's visual appearance // Cursors/GetCursors()/SetCursors(value) {string}, defines the mouse cursor to display when pointing over different parts of the control // AllowActions/GetAllowActions()/SetAllowActions(value) {string}, customizes the actions the user can perform once the control is clicked or touched // ScrollPos/GetScrollPos()/SetScrollPos(value) {object}, scrolls horizontally and/or vertically the control's default view // ToolTipDelay/GetToolTipDelay()/SetToolTipDelay(value) {number}, specifies how long the mouse pointer must point to an object before the tool tip appears // ToolTipPopDelay/GetToolTipPopDelay()/SetToolTipPopDelay(value) {number}, specifies the period in ms of time the tool top remains visible if the mouse pointer is stationary within a control // ToolTipWidth/GetToolTipWidth()/SetToolTipWidth(value) {number}, specifies the width of the control's tooltip // GetCalendar()/SetCalendar(value) {object}, specifies the options to apply for inside calendar control // Calendar {exontrol.Calendar}, returns a reference to the inside calendar control // OnResizeControl/GetOnResizeControl()/SetOnResizeControl(value) {exontrol.Schedule.OnResizeControlEnum}, defines the panel to resize once the entire control gets resized // ShowViewCompact/GetShowViewCompact()/SetShowViewCompact(value) {exontrol.Schedule.ShowViewCompactEnum}, specifies how the days get arranged within the schedule-view // DayViewWidth/GetDayViewWidth()/SetDayViewWidth(value) {number}, indicates the width of the day in the schedule panel // DayViewHeight/GetDayViewHeight()/SetDayViewHeight(value) {number}, indicates the height of the day's view in the schedule panel // PaneWidthLeft/GetPaneWidthLeft()/SetPaneWidthLeft(value) {number}, specifies the size(width) of the left panel // PaneMinWidthLeft/GetPaneMinWidthLeft()/SetPaneMinWidthLeft(value) {number}, specifies the minimum size(width) of the left panel // PaneWidthRight/GetPaneWidthRight()/SetPaneWidthRight(value) {number}, specifies the size(width) of the right panel // PaneMinWidthRight/GetPaneMinWidthRight()/SetPaneMinWidthRight(value) {number}, specifies the minimum size(width) of the right panel // Misc/GetMisc()/SetMisc(value) {MiscellaneousOptions}, defines the control's miscellaneous options // Background/GetBackground()/SetBackground(value) {object}, defines display options to show different parts of the control // HeaderDayHeight/GetHeaderDayHeight()/SetHeaderDayHeight(value) {number}, indicates the height of the day's header (relative to the font-size of the control) // ShowHighlightEvent/GetShowHighlightEvent()/SetShowHighlightEvent(value) {boolean}, indicates whether the control highlights days that contain events // HeaderDayLongLabel/GetHeaderDayLongLabel()/SetHeaderDayLongLabel(value) {string}, defines the alternate HTML labels being shown on date's header, when the time-scale is visible // HeaderDayShortLabel/GetHeaderDayShortLabel()/SetHeaderDayShortLabel(value) {string}, defines the alternate HTML labels being shown on date's header, when the time-scale is hidden // DayStartTime/GetDayStartTime()/SetDayStartTime(value) {string}, gets the time the day starts at, in "HH[:MM[:NN]]" format // DayEndTime/GetDayEndTime()/SetDayEndTime(value) {string}, gets the time the day ends at, in "HH[:MM[:NN]]" format // ShowGroupingEvents/GetShowGroupingEvents()/SetShowGroupingEvents(value) {boolean}, specifies whether the schedule view shows grouped events // DisplayGroupingButton/GetDisplayGroupingButton()/SetDisplayGroupingButton(value) {boolean}, gets or sets a value that indicates whether the grouping button is displayed in the date header // HeaderGroupHeight/GetHeaderGroupHeight()/SetHeaderGroupHeight(value) {number}, indicates the height of the group's header (relative to the font-size of the control) // ApplyGroupingColors/GetApplyGroupingColors()/SetApplyGroupingColors(value) {boolean}, specifies whether the schedule view shows the events using the colors of owner groups (group's eventShape option) // OnSelectDate/GetOnSelectDate()/SetOnSelectDate(value) {exontrol.Schedule.OnSelectDateEnum}, specifies the action that the control does once the user selects new dates in the calendar panel. // SelectEventStyle/GetSelectEventStyle()/SetSelectEventStyle(value) {number}, specifies how the selected-event gets displayed // AllowMoveEventToOtherGroup/GetAllowMoveEventToOtherGroup()/SetAllowMoveEventToOtherGroup(value) {boolean}, indicates whether the event can be moved from a group to another by drag and drop // DefaultEventToolTip/GetDefaultEventToolTip()/SetDefaultEventToolTip(value) {string}, defines the event's default tooltip // DefaultEventShortLabel/GetDefaultEventShortLabel()/SetDefaultEventShortLabel(value) {string}, defines the event's default short-label // DefaultEventLongLabel/GetDefaultEventLongLabel()/SetDefaultEventLongLabel(value) {string}, defines the event's default long-label // DefaultEventExtraLabel/GetDefaultEventExtraLabel()/SetDefaultEventExtraLabel(value) {string}, defines the event's default extra-label // ShortDateFormat/GetShortDateFormat()/SetShortDateFormat(value) {string}, defines the short date format // ShortTimeFormat/GetShortTimeFormat()/SetShortTimeFormat(value) {string}, defines the short time format // LongDateFormat/GetLongDateFormat()/SetLongDateFormat(value) {string}, defines the long date format // LongTimeFormat/GetLongTimeFormat()/SetLongTimeFormat(value) {string}, defines the long time format // ShowEventLabels/GetShowEventLabels()/SetShowEventLabels(value) {boolean}, specifies whether the short, long and extra labels of the events are visible or hidden // CreateEventLabel/GetCreateEventLabel()/SetCreateEventLabel(value) {string}, specifies the label to be shown on the event while user creates it by drag and drop // UpdateEventsLabel/GetUpdateEventsLabel()/SetUpdateEventsLabel(value) {string}, specifies the label to be shown while moving or resizing the events by drag and drop // ShowMarkZone/GetShowMarkZone()/SetShowMarkZone(value) {number}, indicates how the schedule panel shows the mark zones // ShowEvents/GetShowEvents()/SetShowEvents(value) {number}, indicates the type of the events the control displays // ShowAllDayHeader/GetShowAllDayHeader()/SetShowAllDayHeader(value) {boolean}, specifies whether the control's header for all-day events is visible or hidden // HeaderAllDayEventHeight/GetHeaderAllDayEventHeight()/SetHeaderAllDayEventHeight(value) {number}, specifies the height of the events to display within the all-day header // AllowMultiDaysEvent/GetAllowMultiDaysEvent()/SetAllowMultiDaysEvent(value) {boolean}, specifies whether the user can create events that may start on a day and ends on other // AllowAllDayEventScroll/GetAllowAllDayEventScroll()/SetAllowAllDayEventScroll(value) {null|number|number[]}, specifies whether the user can create events that may start on a day and ends on other // // The exontrol.Schedule class provides the following events (through Listeners): // // "onselchange", notifies your application that the control's selection has been changed. The onselchange's parameter could be any of the following: // // oEvent {null}, indicates that the control has no selected events // oEvent {object}, indicates an object of exontrol.Schedule.Event type that defines the control's single-event selected // oEvent {array}, specifies an array of [Event] type that holds all selected events within the control // // "oncalselchange", notifies your application that the calendar's selection has been changed. The oncalselchange's parameter could be any of the following: // // oEvent {null}, indicates that the calendar has no selected dates // oEvent {Date}, indicates an object of Date type that defines the calendar's single-date selected // oEvent {array}, specifies an array of [Date] type that holds all selected dates within the calendar // // "onaddevent", notifies your application once a new event has been added. The onaddevent's parameter is: // // oEvent {object}, indicates an object of exontrol.Schedule.Event type that defines the event being added // // "onremoveevent", notifies your application once an event has been removed. The onremoveevent's parameter is: // // oEvent {object}, indicates an object of exontrol.Schedule.Event type that defines the event being removed // // "onclick", occurs once the user clicks or double-clicks the view. The onclick's parameter is: // // oEvent {object}, specifies an object of {dblClick,button,modifiers,..} type, that holds information about the object being clicked // // oEvent.event {Event}, specifies null/undefined or an object of exontrol.Schedule.Event type that indicates the event being clicked // oEvent.date {Date}, specifies null/undefined or an object of Date type that indicates the date being clicked (not including the time) // oEvent.time {Date}, specifies null/undefined or an object of Date type that indicates the date and time being clicked // oEvent.group {Group}, specifies null/undefined or an object of exontrol.Schedule.Group type that indicates the group of events being clicked // oEvent.markZone {MarkZone}, specifies null/undefined or an object of exontrol.Schedule.MarkZone type that indicates the mark-zone being clicked // oEvent.view {object}, indicates an object of exontrol.Schedule.SV, ... type that specifies the view/window where the click occurred // oEvent.dblClick {boolean}, indicates whether the user clicks or double-clicks the event // oEvent.button {number}, indicates which button is pressed while clicking the event as 1 (left), 2 (right) or 4 (middle) // oEvent.modifiers {number}, specifies a combination of 1, 2, 4 and 16 according with modifier keys (ALT, CTRL, META and SHIFT), or 0 if no modifier keys // // "onanchorclick", (@since 2.2) occurs once the user clicks an anchor element (the ex-HTML part marks an anchor or hyperlink element). The onanchorclick's parameter is: // // oEvent {object}, specifies an object of {id,options} type, that holds information about the anchor being clicked. // // oEvent.id {string}, specifies null or the identifier of the anchor being clicked // oEvent.options {string}, specifies null or the options of the anchor being clicked // // "onscroll", notifies your application once the control's view is scrolled. The onscroll's parameter is: // // oEvent {object}, specifies an object of {view,type,value} type, that holds information about the view's scroll that has been changed as explained: // // oEvent.view {object}, specifies the view, where the scroll occurs // oEvent.type {exontrol.SB.ModeEnum}, specifies the view's scroll that has changed as 0(vertical), 1(horizontal) // oEvent.value {number}, specifies the scroll's value // // "onchange", notifies your application that an event or a group has been changed (create, move, resize events or show/hide, move or resize groups). The onchange's parameter is: // // oEvent {object}, specifies an object of {object,action} type, that holds information about the action that occured and the object being changed // // oEvent.object {object}, specifies an object of {Event} type for "create", "move" or "resize" action, specifies an object of {Group} type for "group", or undefined for "groups" // oEvent.action {string}, specifies the action as "create", "move", "resize" (for events), "group" when the user changes the group's position or width, or "groups" when the user shows or hides one or more groups of events // /////////////////////////////////////////////////////////// /////////////////////////////////////////////////////////// (exontrol.Def.Schedule) // // The exontrol.Def.Schedule namespace provides definitions for different objects, primitives, objects of exontrol.Schedule object // // The exontrol.Def.Schedule namespace provides the following fields: // // scrollBars {exontrol.ScrollBarsEnum}, determines whether the control has horizontal and/or vertical scroll bars // tfi {(string|object)}, holds the font attributes for captions within the control. The tfi field can be defined using a string representation such as "b monospace 16" or as an object such as {bold: true, fontName: "monospace", fontSize: 16}. // locked {boolean}, indicates whether the control is locked(protected) or unlocked // wheelChange {number}, specifies the amount the control scrolls when the user rolls the mouse wheel. // smooth {number}, defines the time in ms the control goes from one layout to another. // shapes {string}, defines the shapes each part of the control can display. The shapes field customizes the control's visual appearance. // cursors {string}, specifies the mouse cursor to be displayed when pointing over a part of the control. // singleSel {exontrol.Schedule.SingleSelEnum}, specifies whether the control supports single, multiple, toggle selection. // zoom {number}, defines the zoom factor of the control's content. The zoomLevels field defines the levels of the zoom-factor the control is allowed to magnify. // zoomLevels {string}, defines the zoom-levels the user can magnify the control's content // formatText {exontrol.DrawTextFormatEnum}, specifies the format and alignment to display the event's caption. // pad {(number|string|array)}, defines the event's padding (space between the event's content and its border) // imageSize {(null|number|array)}, defines the size of the event's image (reserved for future use only). // imageAlign {number}, defines the alignment of the image within the event (reserved for future use only). // allowActions {string}, customizes the actions the user can perform once the user clicks or touches the control. // scrollPos {object}, defines the horizontal and vertical scroll-position of the view, as an object of {x,y} type // toolTipDelay {number}, specifies how long the mouse pointer must point to an object before the tool tip appears // toolTipPopDelay {number}, specifies the period in ms of time the tool top remains visible if the mouse pointer is stationary within a control // toolTipWidth {number}, indicates the width of the control's tooltip // misc {MiscellaneousOptions}, holds the control's miscellaneous options // background {BackgroundOptions}, defines display options to show different parts of the control // calendar {object}, specifies the options to apply for inside calendar control // onResizeControl {exontrol.Schedule.OnResizeControlEnum}, specifies the panel to resize once the entire control gets resized. // showViewCompact {exontrol.Schedule.ShowViewCompactEnum}, specifies how the days get arranged within the schedule-view // dayViewWidth {number}, indicates the width of the day in the schedule panel // dayViewHeight {number}, indicates the height of the day's view in the schedule panel // paneWidthLeft {number}, specifies the size(width) of the left panel // paneMinWidthLeft {number}, specifies the minimum size(width) of the left panel // paneWidthRight {number}, specifies the size(width) of the right panel // paneMinWidthRight {number}, specifies the minimum size(width) of the right panel // headerDayHeight {number}, specifies the height of the day's header (relative to the font-size of the control) // showHighlightEvent {boolean}, indicates whether the control highlights days that contain events // headerDayLongLabel {string}, defines the alternate HTML labels being shown on date's header, when the time-scale is visible // headerDayShortLabel {string}, defines the HTML label to show on date's header when the time-scale is hidden // dayStartTime {string}, specifies the time the day starts from // dayEndTime {string}, specifies the time the day ends to // showGroupingEvents {boolean}, specifies whether the schedule view shows grouped events // displayGroupingButton {boolean}, gets or sets a value that indicates whether the grouping button is displayed in the date header // headerGroupHeight {number}, specifies the height of the group's header (relative to the font-size of the control) // applyGroupingColors {boolean}, specifies whether the schedule view shows the events using the colors of owner groups (group's eventShape option) // onSelectDate {exontrol.Schedule.OnSelectDateEnum}, specifies the action that the control does once the user selects new dates in the calendar panel. // selectEventStyle {number}, specifies how the selected-event gets displayed // allowMoveEventToOtherGroup {boolean}, indicates whether the event can be moved from a group to another by drag and drop // defaultEventToolTip {string}, defines the event's default tooltip // defaultEventShortLabel {string}, defines the event's default short-label // defaultEventLongLabel {string}, defines the event's default long-label // defaultEventExtraLabel {string}, defines the event's default extra-label // shortDateFormat {string}, defines the short date format. // shortTimeFormat {string}, defines the short time format. // longDateFormat {string}, defines the long date format. // longTimeFormat {string}, defines the long time format. // showEventLabels {boolean}, specifies whether the short, long and extra labels of the events are visible or hidden // createEventLabel {string}, specifies the label to be shown while creating events // updateEventsLabel {string}, specifies the label to be shown while moving or resizing the events // showMarkZone {number}, indicates how the schedule panel shows the mark zones // showEvents {number}, indicates the type of the events the control displays // showAllDayHeader {boolean}, specifies whether the control's header for all-day events is visible or hidden // headerAllDayEventHeight {number}, defines the height of the events to display within the all-day header // allowMultiDaysEvent {boolean}, specifies whether the user can create events that may start on a day and ends on other // allowAllDayEventScroll {null|number|number[]}, defines the number of events the all-day header can display one at the time // groups {object}, defines the groups of the control // markZones {object}, defines the mark-zones of the control // events {object}, defines the events of the control // selection {any}, defines the control's selection // // timeScale {object}, provides options of the control's time-scale as follows: // visible {boolean}, indicates whether the time-scale header is visible or hidden // shape {any}, defines the shape for the time-scale header // cursor {string}, defines the mouse-cursor for individual time-scale header, // minWidth {number}, specifies the minimal-size of the time-scale header // maxWidth {number}, specifies the maximal-size of the time-scale header // width {number}, defines the size of the time-scale header // allowResize {boolean}, specifies whether the user can resize the time-scale header by drag and drop // majorTimeLabel {string}, defines the label of the time-scale's major ruler // majorTimeRuler {string}, indicates the increment for the time-scale's major ruler // minorTimeLabel {string}, defines the label of the time-scale's minor ruler // minorTimeRuler {string}, indicates the increment for the time-scale's minor ruler // timeZone {string}, indicates the time zone for the time scale // caption {string}, specifies the HTML caption to be displayed on the top side of the time scale // // /////////////////////////////////////////////////////////// /** * @description The exontrol.Def.Schedule namespace provides definitions for different objects, primitives, objects of exontrol.Schedule object */ exontrol.Def.Schedule = { /** * @description The scrollBars field determines whether the control has horizontal and/or vertical scroll bars. A combination of one or more exontrol.ScrollBarsEnum flags that determines whether the control has horizontal and/or vertical scroll bars. * @type {exontrol.ScrollBarsEnum} * * The exontrol.ScrollBarsEnum type defines the following flags: * * exNoScroll (0), specifies that no scroll bars are shown (scroll is not allowed) * exHorizontal (1), specifies that only horizontal scroll bars is shown * exVertical (2), specifies that only vertical scroll bars is shown * exBoth (3), specifies that both horizontal and vertical scroll bars are shown * exDisableNoHorizontal (5), specifies that the horizontal scroll bar is always shown, it is disabled if it is unnecessary * exDisableNoVertical (10), specifies that the vertical scroll bar is always shown, it is disabled if it is unnecessary * exDisableBoth (15), specifies that both horizontal and vertical scroll bars are always shown, disabled if they are unnecessary * exHScrollOnThumbRelease (0x100), specifies that the control's content is horizontally scrolled as soon as the user releases the thumb of the horizontal scroll bar (use this option to specify that the user scrolls the control's content when the thumb of the scroll box is released) * exVScrollOnThumbRelease (0x200), specifies that the control's content is vertically scrolled as soon as the user releases the thumb of the vertical scroll bar (use this option to specify that the user scrolls the control's content when the thumb of the scroll box is released) * exScrollOnThumbRelease (0x300), specifies that the control's content is scrolled as soon as the user releases the thumb of the horizontal scroll bar (use this option to specify that the user scrolls the control's content when the thumb of the scroll box is released) * exHScrollEmptySpace (0x400), allows empty space, when the control's content is horizontally scrolled to the end * exVScrollEmptySpace (0x800), allows empty space, when the control's content is vertically scrolled to the end * exScrollEmptySpace (0xC00), allows empty space, when the control's content is scrolled to the end * exExtendSBS (0x3000), specifies that the control's scroll-bars are visible only when cursor hovers the window. Also, the control's client area is extended on the scroll bars portion * exMinSBS (0xC000), specifies that the control's scroll-bars are shown as minimized * exHideSBS (0x10000), specifies that no scroll bars are shown (scroll is allowed) * * @example * * 0 or exontrol.ScrollBarsEnum.exNoScroll {number}, removes the control's scroll bars, so scroll is not allowed * 15 or exontrol.ScrollBarsEnum.exDisableBoth {number}, the control always displays the scroll bars, and they are active only if scroll is possible * 12291 or exontrol.ScrollBarsEnum.exBoth | exontrol.ScrollBarsEnum.exExtendSBS {number}, the control shows the scroll bars only if the cursor hovers the control, and the control scroll bars are hidden as soon as the cursor leaves the control */ scrollBars: exontrol.ScrollBarsEnum.exBoth, /** * @description The tfi field applies font attributes to captions within the control. The tfi field can be defined using a string representation such as "b monospace 16" or as an object such as {bold: true, fontName: "monospace", fontSize: 16}. * * The tfi field 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: * * bold, displays the text in bold (equivalent of tag) * italic, displays the text in italics (equivalent of tag) * underline, underlines the text (equivalent of tag) * strikeout, specifies whether the text is strike-through (equivalent of tag) * , specifies the font's family (equivalent of tag) * , specifies the size of the font (equivalent of tag) * , specifies the text's foreground color (equivalent of tag) * , specifies the text's background color (equivalent of tag) * , defines the text's shadow (equivalent of tag) * , shows the text with outlined characters (CSScolor) (equivalent of tag) * , defines a gradient text (equivalent of tag) * * Any other word within the tfi field that's not recognized as a keyword is interpreted as: * * name of the font (not a number), specifies the font's family (equivalent of tag) * size of the font (number), specifies the size of the font (equivalent of tag) * * The tfi field as object supports any of the following fields: * * bold {boolean}, displays the text in bold (equivalent of tag) * italic {boolean}, displays the text in italics (equivalent of tag) * underline {boolean}, underlines the text (equivalent of tag) * strikeout {boolean}, specifies whether the text is strike-through (equivalent of tag) * fontName {string}, specifies the font's family (equivalent of tag) * fontSize {number}, specifies the size of the font (equivalent of tag) * fgColor {string}, specifies the text's foreground color (CSScolor) (equivalent of tag) * bgColor {string}, specifies the text's background color (CSScolor) (equivalent of tag) * shaColor {object}, specifies an object of {color, width, offset} type that defines the text's shadow (equivalent of 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 tag) * graColor {object}, specifies an object of {color, mode, blend} type that defines a gradient text (equivalent of 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)} * @example * * null {null}, the tfi field is ignored * "bold monospace 16" {string}, defines Monospace font of 16px height, bold * {bold: true, fontName: "monospace", fontSize: 16} {object}, defines Monospace font of 16px height, bold */ tfi: null, /** * @description The locked field indicates whether the control is locked(protected) or unlocked * @type {boolean} * @example * * false {boolean}, unlocks the control (can select any event) * true {boolean}, locks the control (can't select any event) */ locked: false, /** * @description The readOnly field indicates whether the control is read-only * @type {boolean} * @example * * false {boolean}, the user can edit or drag any event * true {boolean}, the user can not edit or drag the events */ readOnly: false, /** * @description The wheelChange field specifies the amount the control scrolls when the user rolls the mouse wheel. * @type {number} * @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) */ wheelChange: 18, /** * @description The smooth field defines the time in ms the control goes from one layout to another. * @type {number} * @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. */ smooth: 125, /** * @description The shapes field defines the shapes each part of the control can display. The shapes field customizes the control's visual appearance. * @type {string} * * 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) * * The shapes property supports any of the following parts: * * "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 * * @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 control */ shapes: 'shframe(date-frame,date-header,date-timeScale,date-all-day-header),shfill(date-grouping-header),Button(grouping-button,date-all-day-scroll-button),shighlight(uiHighlight),shframeSel(date-frame-select),shevent(event),Border(event-drag),FrameFit(frameFit),FrameSel(frameSel,select),shrect(select),shzone(mark-zone)', /** * @description The cursors field specifies the mouse cursor to be displayed when pointing over a part of the control. * @type {string} * * 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) * * The cursors property supports any of the following parts: * * "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 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) * * @example * * "pointer(xxx,yy)" {string}, indicates that the "pointer" mouse cursor is shown while cursor hovers any "xxx" or "yyy" part of the control */ cursors: "not-allowed(no),crosshair(create),pointer(grouping-button,date-grouping-header,date-all-day-scroll-button,event,drag-drop,anchor),col-resize(resize-group,resize-v),row-resize(resize-h)", /** * @description The singleSel field specifies whether the control supports single, multiple, toggle selection. * @type {exontrol.Schedule.SingleSelEnum} * * The exontrol.Schedule.SingleSelEnum type defines the following flags: * * exDisableSel(0), specifies that the control's selection is disabled (can not be combined with any other flags) * exEnableSel(1), specifies that the control's selection is enabled (multiple-selection, unless the exSingleSel is set ) * exSingleSel(2), specifies that the user can select a event only * exToggleSel(4), specifies that the event's selection state is toggled once the user clicks a event. * exDisableCtrlSel(8), disables toggling the event's selection state when user clicks a event, while CTRL modifier key is pressed. * exDisableShiftSel(16), disables selecting events using the SHIFT key. * exDisableDrag(32), disables selecting events by drag. * * @example * * 0 or exontrol.Schedule.SingleSelEnum.exDisableSel {number}, disables selecting any event * 3 or exontrol.Schedule.SingleSelEnum.exSingleSel | exontrol.Schedule.SingleSelEnum.exEnableSel {number}, enables control's single selection, so only a single event can be selected * 6 or exontrol.Schedule.SingleSelEnum.exToggleSel | exontrol.Schedule.SingleSelEnum.exSingleSel {number}, enables control's single and toggle selection, which means that once a event is selected it gets unselected once it is clicked, or reverse, and only a single-event can be selected at once. */ singleSel: exontrol.Schedule.SingleSelEnum.exEnableSel, /** * @description The zoom field defines the zoom factor of the control's content. The zoomLevels field defines the levels of the zoom-factor the control is allowed to magnify. * @type {number} * @example * * null {null}, Specifies normal-view (100%) * 150 {number}, Indicates that the control's content is magnfied to 150% */ zoom: 100, /** * @description The zoomLevels field defines the zoom-levels the user can magnify the control's content * @type {string} * @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% */ zoomLevels: "50,65,75,80,90,100,110,125,150,175,200,250,300,400,500", /** * @description The formatText field specifies the format and alignment to display the event's caption. A combination of one or more exontrol.DrawTextFormatEnum flags that defines the format to show the event's caption. * @type {exontrol.DrawTextFormatEnum} * * 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. * * @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-aligned */ formatText: exontrol.DrawTextFormatEnum.exTextAlignRight | exontrol.DrawTextFormatEnum.exTextAlignBottom | exontrol.DrawTextFormatEnum.exTextSingleLine | exontrol.DrawTextFormatEnum.exTextWordEllipsis, /** * @description The pad field defines the event's padding (space between the event's content and its border). A value that could be a numeric value, to pad horizontal and vertical size with the same value, or a "x,y" or [x,y] type to specify the padding on h/v size * @type {(number|string|array)} * @example * * null {null}, indicates that the default-padding field is used ([2,2]) * 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-pixels */ pad: [2,2], /** * @description The imageSize field defines the size of the event's image (reserved for future use only). * @type {(null|number|array)} * * The imageSize could be of one of the following types: * * {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. * {array}, 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. * * @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 rectangle */ imageSize: 18, /** * @description The imageAlign field defines the alignment of the image within the event (reserved for future use only). Indicates the alignment of the image within the event. as 0 (left, default), 1(right), 2(top) or 3(bottom). * @type {number} * * The imageAlign propery can be any of the following: * * 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 * * @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 caption */ imageAlign: 0, /** * @description The allowActions field customizes the actions the user can perform once the user clicks or touches the control. * @type {string} * * 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) * * "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 * * @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. * */ allowActions: "fit(Shift+MButton,Ctrl+MButton),zoom(Alt+MButton),group-resize,day-resize(MButton),select(Shift,Ctrl),group-drag,create(Alt),move,scroll", /** * @description The scrollPos field defines the horizontal and vertical scroll-position of the view. * @type {object} * * x {number}, indicates the horizontal scroll-position * y {number}, indicates the vertical scroll-position * * @example * * {x: 100} {object}, scrolls horizontally to position 100 * {x: 100, y: 50} {object}, scrolls horizontally to position 100, and vertically to 50 */ scrollPos: { /** * @description The x field defines the horizontal scroll-position of the view. * @type {number} * * @example * * 100 {number}, scrolls horizontally to position 100 * */ x: undefined, /** * @description The y field defines the vertical scroll-position of the view. * @type {number} * * @example * * 50 {number}, scrolls vertical to position 50 * */ y: undefined }, /** * @description The toolTipDelay field specifies how long the mouse pointer must point to an object before the tool tip appears * @type {number} * @example * * 0 {number}, the tooltip is shown "immediately" * 128 {number}, the tooltip is displayed in 128 ms. */ toolTipDelay: 500, /** * @description The toolTipPopDelay field specifies the period in ms of time the tool top remains visible if the mouse pointer is stationary within a control * @type {number} * @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 second */ toolTipPopDelay: 5000, /** * @description The toolTipWidth field indicates the max-width of the control's tooltip (in pixels) * @type {number} * @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 pixels */ toolTipWidth: -1, /** * @description The calendar field specifies the options to apply for inside calendar control. The options of the inside calendar control includes: *
    *
  • tfi {(string|object)}, holds the font attributes for captions within the control. The tfi field can be defined using a string representation such as "b monospace 16" or as an object such as {bold: true, fontName: "monospace", fontSize: 16}. *
  • mode {exontrol.Calendar.ModeEnum}, specifies the orientation the calendar displays the days of the weeks. *
  • flow {exontrol.Calendar.FlowEnum}, determines whether the months gets arranged from left to right or top to bottom. *
  • autoSize {exontrol.Calendar.AutoSizeEnum}, determines whether the size of the calendar's date is fixed, or relative to the current font or client area. *
  • smoothSel {number}, defines the time in ms the calendar's selection goes from one state to another. *
  • locked {boolean}, indicates whether the control is locked(protected) or unlocked. *
  • selection {(null|Date|array)} , specifies the selected date(s). *
  • singleSel {exontrol.Calendar.SingleSelEnum}, specifies whether the control supports single, multiple, toggle selection. *
  • allowSwitchView {boolean}, specifies whether the user can switch the view (month or year). *
  • allowScrollByDrag {boolean}, specifies whether the user can scroll the control by drag. *
  • padCal {(number|string|array)}, specifies the padding to display the calendar. *
  • alignCal {exontrol.AlignEnum} aligns the calendar relative to the canvas. *
  • wheelChange {number}, specifies the amount the calendar scrolls when the user rolls the mouse wheel. *
  • minMonthX {number}, specifies the minimum number of months horizontally displayed. *
  • maxMonthX {number}, specifies the maximum number of months horizontally displayed. *
  • minMonthX {number}, specifies the minimum number of months vertically displayed. *
  • maxMonthY {number}, specifies the maximum number of months vertically displayed. *
  • pad {(number|string|array)}, specifies the padding to be applied on dates of the calendar. *
  • dayLabel {string}, defines a HTML string that can include expression fields (<%...%>) to display the date while the calendar is in day-view. *
  • dayAlign {exontrol.DrawTextFormatEnum}, aligns the date's label, while the calendar is in day-view. *
  • dayFixedWidth {number}, defines the width of the calendar's date when autoSize is exontrol.Calendar.AutoSizeEnum.exFixedSize. *
  • dayFixedHeight {number}, defines the height of the calendar's date when autoSize is exontrol.Calendar.AutoSizeEnum.exFixedSize. *
  • dayWeekHeader {boolean}, specifies whether the calendar shows the header to display the days of the week (day-view only). *
  • dayWeekLabel {string}, defines the ex-HTML label to show the days of the week into the calendar's header (day-view only). *
  • dayWeekNoHeader {boolean}, specifies whether the calendar shows the header to display week-number (day-view only). *
  • dayWeekNoLabel {string}, defines the ex-HTML label to show the week-number into the calendar's header (day-view only). *
  • dayMonthHeader {boolean}, specifies whether the calendar shows the header to display month's name (day-view only). *
  • dayMonthLabel {string}, defines the ex-HTML label to show the month-name into the calendar's header (day-view only). *
  • dayMonthAlign {exontrol.DrawTextFormatEnum}, aligns the month's label, while the calendar is in day-view. *
  • dayNonMonth {boolean}, specifies whether the calendar displays the dates that are not part of the current month. *
  • dayNonMonthLabel {string}, the ex-HTML label to show the dates that are not part of the current month (day-view only). *
  • dayWeekAllLabel {string}, defines the ex-HTML label to show the first day of the month on the top-left corner of the calendar, when the week-number and week-days headers are present (day-view only). *
  • monthLabel {string}, specifies the ex-HTML string that can include expression fields (<%...%>) to display the month while the calendar is in month-view. *
  • monthAlign {exontrol.DrawTextFormatEnum}, aligns the month's label, while the calendar is in month-view. *
  • monthYearAlign {exontrol.DrawTextFormatEnum}, aligns the year's label, while the calendar is in month-view. *
  • yearLabel {string}, specifies the ex-HTML string that can include expression fields (<%...%>) to display the year while the calendar is in year-view. *
  • yearAlign {exontrol.DrawTextFormatEnum}, aligns the year's label, while the calendar is in year-view. *
  • yearRangeAlign {exontrol.DrawTextFormatEnum}, aligns the label that displays the range of years, while the calendar is in year-view. *
  • shapes {string}, defines the shapes each part of the control can display. The shapes field customizes the control's visual appearance. *
  • hlShapes {string}, field defines the shape(s) to be applied on a part of the control, when it requires to be highlighted *
  • cursors {string}, specifies the mouse cursor to be displayed when pointing over a part of the control. *
* @type {object} * @example * * null {null} or {} {object}, no options to apply on the calenda * {locale: "de"} {object}, changes the calendar's locale to German * {tfi: "bold "} {object}, shows days of the month bolded in blue */ calendar: null, /** * @description The onResizeControl field specifies the panel to resize once the entire control gets resized. * @type {exontrol.Schedule.OnResizeControlEnum} * * The exontrol.Schedule.OnResizeControlEnum type defines the following flags: * * exResizePanelLeft(0), specifies that the left panel of the control is resized, once the entire-control gets resized * exResizePanelRight(1), specifies that the right panel of the control is resized, once the entire-control gets resized * exDisableSplitter(128), disables the splitter, so the user can not resize the panels using the control's vertical split bar * exHideSplitter(256), hides the splitter, so a single panel is visible at runtime (calendar or schedule view) * exChangePanels(512), exchanges the content of the panels (the calendar panel is aligned to the right) * exCalendarFit(1024), ensures that the calendar fits to the panel that hosts it * exCalendarAutoHide(2048), turns on or off the calendar panel when the cursor leaves the panels * * @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) */ onResizeControl: exontrol.Schedule.OnResizeControlEnum.exResizePanelRight | exontrol.Schedule.OnResizeControlEnum.exCalendarFit, /** * @description The showViewCompact field specifies how the days get arranged within the schedule-view * @type {exontrol.Schedule.ShowViewCompactEnum} * * The exontrol.Schedule.ShowViewCompactEnum type defines the following flags: * * exViewCalendar(0), specifies that the schedule view arranges the days as they are shown in the calendar panel. * exViewCalendarCompact(-1), 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. * exViewSingleRow(1), the schedule view arranges all days to a single row (horizontally) * exViewSingleColumn(2), the schedule view arranges all days to a single column (vertically) * exViewSingleRowLockHeader(3), 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 * * @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. */ showViewCompact: exontrol.Schedule.ShowViewCompactEnum.exViewCalendarCompact, /** * @description The dayViewWidth field specifies the width of the day in the schedule panel. * @type {number} * @example * * null {null} or -1 {number}, the day fits horizontally the schedule view * 128 {number}, the day within the schedule panel has a fixed width */ dayViewWidth: -1, /** * @description The dayViewHeight field specifies the height of the day in the schedule panel. * @type {number} * @example * * null {null} or -1 {number}, the day fits vertically the schedule view * 128 {number}, the day within the schedule panel has a fixed height */ dayViewHeight: -1, /** * @description The paneWidthLeft field defines the size(width) of the left panel * @type {number} * @example * * null {null}, ignored * 0 {number}, hides the left-panel * 196 {number}, the size of the left-panel is set to 196 */ paneWidthLeft: 196, /** * @description The paneWidthRight field defines the size(width) of the right panel * @type {number} * @example * * null {null}, ignored * 0 {number}, hides the right-panel * 196 {number}, the size of the right-panel is set to 196 */ paneWidthRight: null, /** * @description The paneMinWidthLeft field defines the minimum size(width) of the left panel * @type {number} * @example * * null {null}, ignored * 196 {number}, the minimum size of the left-panel is set to 196 */ paneMinWidthLeft: null, /** * @description The paneMinWidthRight field defines the minimum size(width) of the right panel * @type {number} * @example * * null {null}, ignored * 196 {number}, the minimum size of the right-panel is set to 196 */ paneMinWidthRight: null, /** * @description The headerDayHeight field defines the height of the day's header (relative to the font-size of the control) * @type {number} * @example * * null {null}, the height of the day's header is 1.5 times the size of the control's font (200%) * 0 {number}, hides the day's header * 2 {number}, the height of the day's header is 2 times the size of the control's font */ headerDayHeight: 2, /** * @description The showHighlightEvent field specifies whether the control highlights the dates that contain events. The "uiHighlight"/"calendar-uiHighlight" shape is applied on dates with events. * @type {boolean} * @example * * false {boolean}, no date is highlighted * true {boolean}, the date with events is highlighted using the "uiHighlight"/"calendar-uiHighlight" shape * */ showHighlightEvent: true, /** * @description The headerDayLongLabel field defines the alternate HTML labels being shown on date's header, when the time-scale is visible. The format the headerDayLongLabel property 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 (, , , ...) 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. * * @type {string} * @example * * null {null}, the date's header displays the label using default alternate-labels (and expression) * "" {string}, the date's header displays no date * "<%loc_ldate%>" {string}, displays the date in the long format using the current user regional and language settings * "<%d3%>, <%d%><|><%d2%>, <%d%><|><%d1%>, <%d%><|><%d%>" {string}, the date's header displays one, two or three letters for the week day based on the best fit * "<%d3%>, <%d%><|><%d3%>, <%d%><=>month(value) = 1 ? 0 : 1" {string}, displays the date's header in red for January, and in black for the rest * */ headerDayLongLabel: "<%dddd%>, <%mmmm%> <%d%>, <%yyyy%><|><%dddd%>,<%mmmm%> <%d%>,<%yyyy%><|><%dddd%>, <%mmmm%> <%d%>,`<%yy%><|><%dddd%>, <%mmmm%> <%d%><|><%dddd%>, <%m3%> <%d%><|><%dddd%>, <%d%><|><%d3%>, <%d%><|><%d2%>, <%d%><|><%d1%>, <%d%><|><%d3%><|><%d2%><|><%d%>", /** * @description The headerDayShortLabel field defines the alternate HTML labels being shown on date's header, when the time-scale is hidden. The format the headerDayShortLabel property 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 (, , , ...) 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. * * @type {string} * @example * * null {null}, the date's header displays the label using default alternate-labels (and expression) * "" {string}, the date's header displays no date * "<%loc_ldate%>" {string}, displays the date in the long format using the current user regional and language settings * "<%d3%>, <%d%><|><%d2%>, <%d%><|><%d1%>, <%d%><|><%d%>" {string}, the date's header displays one, two or three letters for the week day based on the best fit * "<%d3%>, <%d%><|><%d3%>, <%d%><=>month(value) = 1 ? 0 : 1" {string}, displays the date's header in red for January, and in black for the rest * */ headerDayShortLabel: "<%mmmm%> <%d%><|><%m3%> <%d%><|><%d%><=>((( day(value) = 1) or ( month(value+1) != month(value))) ? -1 : 2)", /** * @description The dayStartTime field specifies the time the day starts from, in "HH[:MM[:NN]]" format * @type {string} * @example * * null {null}, every day starts at 8:00 AM * "07:00" {string}, the day starts at 07:00 AM */ dayStartTime: "08:00", /** * @description The dayEndTime field specifies the time the day ends to, in "HH[:MM[:NN]]" format * @type {string} * @example * * null {null}, every day ends at 4:00 PM * "17:00" {string}, the day ends at 05:00 PM */ dayEndTime: "16:00", /** * @description The showGroupingEvents field 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 * * @type {boolean} * @example * * false {boolean}, no grouped events are shown * true {boolean}, shows the events grouped */ showGroupingEvents: false, /** * @description The displayGroupingButton field gets or sets a value that indicates 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 * * @type {boolean} * @example * * false {boolean}, no grouping button is shown * true {boolean}, shows the grouping button within the date's header */ displayGroupingButton: false, /** * @description The headerGroupHeight field defines the height of the group's header (relative to the font-size of the control) * @type {number} * @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 font */ headerGroupHeight: 2, /** * @description The applyGroupingColors field specifies whether the schedule view shows the events using the colors of owner groups (group's eventShape option) * @type {boolean} * @example * * false {boolean}, no eventShape (option of Group) is applied to any event * true {boolean}, the group's eventShape is applied on the event while the event has no custom shape */ applyGroupingColors: true, /** * @description The onSelectDate field specifies the action that the control does once the user selects new dates in the calendar panel. * @type {exontrol.Schedule.OnSelectDateEnum} * * The exontrol.Schedule.OnSelectDateEnum type defines the following values: * * exFitSelToView (-1), changes the day's size and scrolls the view so the calendar's selection fits the schedule view * exNoViewChange (0), no change/scroll occurs within the view * exEnsureVisibleDate (1), scrolls the view to ensure that clicked date fits the schedule view * * @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 changed */ onSelectDate: exontrol.Schedule.OnSelectDateEnum.exFitSelToView, /** * @description The selectEventStyle field specifies how the selected-event gets displayed. * @type {number} * * The selectEventStyle field supports 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. * * @example * * null {null}, equivalent of 0 so the "select" shape is combined with the event's shape * 1 {number}, the event's shape and color is not altered so the "select" shape is displayed on the event's background */ selectEventStyle: 0, /** * @description The allowMoveEventToOtherGroup field indicates whether the event can be moved from a group to another by drag and drop. The allowMoveEventToOtherGroup field has effect only if the control displays groups. * * The control displays groups if: * * showGroupingEvents option is true * The Groups collection has visible elements. By default, the Groups collection contains no Group objects * * @type {boolean} * @example * * false {boolean}, indicates that the event can not be moved from a group to another * true {boolean}, indicates that the event can be moved from a group to another */ allowMoveEventToOtherGroup: true, /** * @description The defaultEventToolTip field defines the event's default tooltip. The event's tooltip is shown once the cursor hovers the event. The defaultEventToolTip field supports ex-HTML and <%=formula%> tags. The <%=formula%> tag indicates the result of the giving formula. The formula supports value formatting. Inside the formula the %0, %1, ... indicates the value of corresponding property of the event, such as %1 specifies the exEventStartDateTime, %2 exEventEndDateTime, and so on. The known identifiers within the <%=formula%> tag are: * * %1 (exEventStartDateTime) {Date}, indicates the starting date/time of the event. This property gets the Start property of the event. The Start property defines the lower margin of the event, and it includes the date and the time values. The exEventStartDate specifies the DATE value only, while the exEventStartTime includes the TIME value only. For instance, the LabelProperty = "<%=weekday(%1)%>" displays the day of the week where the event starts * %2 (exEventEndDateTime) {Date}, indicates the ending date/time of the event. This property gets or sets the End property of the event. The End property defines the upper margin of the event, and it includes the date and the time values. The exEventEndDate specifies the DATE value only, while the exEventEndTime includes the TIME value only. For instance, the LabelProperty = "<%=weekday(%2)%>" gets the day of the week where the event ends. * %3 (exEventAllDay) {boolean}, indicates if the current event is an all day event. This property is equivalent with the event's AllDay property which indicates if the current event is an all-day event. For instance, the LabelProperty = "<%=%3 ? `All-Day-Event: `: ``%><%=%256%>", displays automatically an "All-Day-Event: " prefix for all-day events. If the event is not an all-day event, the <%=%256%>, or exEventDisplayShortMargins, short margins of the events are displayed. * %4 (exEventGroupID) {any}, specifies the identifier/index of the event's group. The GroupID property of the event indicates the identifier of the group that event belongs to. The exEventGroupLabel property indicates the Caption property of the Group's event. The exEventGroupTitle property indicates the Title property of the Group's event. For instance, the LabelProperty = "<%=%4%>
<%=%256%>" displays on the first line, the group's identifier, and the short margins of the event on the second line. The caption of the label is automatically updated once an event is moved from a group to another. * %5 (exEventCaption) {string}, indicates the caption of the event. The Caption property of the event specifies the custom caption that can be displayed on the label, without having to change the event's label. For instance, the LabelProperty = "<%=%256%>
<%=%5%>" displays on the first line, the event's short margins, while on the second line displays the event's caption. Once you update or edit the event's Caption, the event's body automatically shows the new caption. * %6 (exEventUserData) {any}, indicates the extra data associated with the event. The UserData property of the event indicates an extra data associated with the event. For instance, the LabelProperty = "<%=%256%>
<%=%6%>" displays on the first line, the event's short margins, while on the second line displays the event's user data. Once you update or edit the event's UserData, the event's body automatically shows the new label. * %7 (exEventDuration) {number}, specifies the duration of the event. The returned values is of float type, and it indicates the duration of the event in days. For instance, the 1.5 indicates, 1 day and 12 hours. For instance, the LabelProperty = "<%=%256%>
<%=((1:=int(0:= (date(%2)-date(%1)))) != 0 ? (=:1 + ' day(s)') : '') + (=:1 ? ' ' : '' ) + ((1:=int(0:=((=:0 - =:1 + 1/24/60/60/2)*24))) != 0 ? =:1 + ' hour(s)' : '' ) + (=:1 ? ' ' : '' ) + ((1:=round((=:0 - =:1)*60)) != 0 ? =:1 + ' min(s)' : '')%>" displays on the first line, the event's short margins, while on the second line displays the event's durations in days, hours and minutes. Once you update or edit the event's margins, the event's body automatically shows the new length. You can use the MoveBy method to delay the current event with a specified value time. You can use the SetKnownProperty(exEventDuration) to change the event's duration. * %8 (exEventRepetitiveExpression) {string}, specifies the repetitive expression of the event. The Repetitive property of the event indicates the expression that determines whether the event is repetitive. For instance, the LabelProperty = "<%=%256%>
<%=len(%8)? `repetitive event`:``%>" displays repetitive event for repetitive events. * %12 (exEventID) {string}, specifies the event's unique key/identifier/index. * %256 (exEventDisplayShortMargins) {string}, displays the margins of the event in a short format (read-only). The ShortDateFormat property defines the short date format. The ShortTimeFormat property defines the short time format. * %257 (exEventDisplayLongMargins) {string}, displays the margins of the event in a long format (read-only). The LongDateFormat property defines the long date format. The LongTimeFormat property defines the long time format. * %258 (exEventStartDate) {Date}, gets the starting date ( not including the time ) of the event (read-only). You can use this property to get the starting date of the event. * %259 (exEventStartTime) {number}, gets the starting time ( not including the date ) of the event, as a number between 0 and 1 (read-only). You can use this property to get the starting time of the event. * %260 (exEventEndDate) {Date}, gets the ending date ( not including the time ) of the event (read-only). You can use this property to get the ending date of the event. * %261 (exEventEndTime) {number}, gets the ending time ( not including the date ) of the event, as a number between 0 and 1 (read-only). You can use this property to get the ending time of the event. * %262 (exEventGroupLabel) {string}, gets the label of the owner group (read-only). The exEventGroupLabel property indicates the Caption property of the Group's event. The GroupID property of the event indicates the identifier of the group that event belongs to. The exEventGroupTitle property indicates the Title property of the Group's event. For instance, the LabelProperty = "<%=%262%>
<%=%256%>" displays on the first line, the group's caption, and the short margins of the event on the second line. The caption of the label is automatically updated once an event is moved from a group to another. * %263 (exEventGroupTitle) {string}, gets the title of the owner group (read-only). The exEventGroupTitle property indicates the Title property of the Group's event. The exEventGroupLabel property indicates the Caption property of the Group's event. The GroupID property of the event indicates the identifier of the group that event belongs to. For instance, the LabelProperty = "<%=%263%>
<%=%256%>" displays on the first line, the group's caption, and the short margins of the event on the second line. The caption of the label is automatically updated once an event is moved from a group to another. * %264 (exEventRepetitive) {boolean}, Indicates if the current event is a repetitive event. (read-only). You can use this flag to specify whether Repetitive property is not empty, and valid. * * @type {string} * @example * * null {null} or undefined {undefined}, the default-tooltip is used ("Start: <%=%1%>
End: <%=%2%>
Duration: <%=((1:=int(0:= %7)) != 0 ? (=:1 + ' day(s)') : '') + (=:1 ? ' ' : '' ) + ((1:=int(0:=((=:0 - =:1 + 1/24/60/60/2)*24))) != 0 ? =:1 + ' hour(s)' : '' ) + (=:1 ? ' ' : '' ) + ((1:=round((=:0 - =:1)*60)) != 0 ? =:1 + ' min(s)' : '')%>") * "" {string}, no tooltip * "image and text" {string}, the image and text is being shown once the mouse pointer hovers the event. The image can be added using the exontrol.HTMLPicture.Add() method * "<%=%256%>", displays the event's start and end margins in a short format */ defaultEventToolTip: "Start: <%=%1%>
End: <%=%2%>
Duration: <%=((1:=int(0:= %7)) != 0 ? (=:1 + ' day(s)') : '') + (=:1 ? ' ' : '' ) + ((1:=int(0:=((=:0 - =:1 + 1/24/60/60/2)*24))) != 0 ? =:1 + ' hour(s)' : '' ) + (=:1 ? ' ' : '' ) + ((1:=round((=:0 - =:1)*60)) != 0 ? =:1 + ' min(s)' : '')%>", /** * @description The defaultEventShortLabel field defines the event's default short-label. The defaultEventShortLabel field supports ex-HTML and <%=formula%> tags. The <%=formula%> tag indicates the result of the giving formula. The formula supports value formatting. Inside the formula the %0, %1, ... indicates the value of corresponding property of the event, such as %1 specifies the exEventStartDateTime, %2 exEventEndDateTime, and so on. The known identifiers within the <%=formula%> tag are: * * %1 (exEventStartDateTime) {Date}, indicates the starting date/time of the event. This property gets the Start property of the event. The Start property defines the lower margin of the event, and it includes the date and the time values. The exEventStartDate specifies the DATE value only, while the exEventStartTime includes the TIME value only. For instance, the LabelProperty = "<%=weekday(%1)%>" displays the day of the week where the event starts * %2 (exEventEndDateTime) {Date}, indicates the ending date/time of the event. This property gets or sets the End property of the event. The End property defines the upper margin of the event, and it includes the date and the time values. The exEventEndDate specifies the DATE value only, while the exEventEndTime includes the TIME value only. For instance, the LabelProperty = "<%=weekday(%2)%>" gets the day of the week where the event ends. * %3 (exEventAllDay) {boolean}, indicates if the current event is an all day event. This property is equivalent with the event's AllDay property which indicates if the current event is an all-day event. For instance, the LabelProperty = "<%=%3 ? `All-Day-Event: `: ``%><%=%256%>", displays automatically an "All-Day-Event: " prefix for all-day events. If the event is not an all-day event, the <%=%256%>, or exEventDisplayShortMargins, short margins of the events are displayed. * %4 (exEventGroupID) {any}, specifies the identifier/index of the event's group. The GroupID property of the event indicates the identifier of the group that event belongs to. The exEventGroupLabel property indicates the Caption property of the Group's event. The exEventGroupTitle property indicates the Title property of the Group's event. For instance, the LabelProperty = "<%=%4%>
<%=%256%>" displays on the first line, the group's identifier, and the short margins of the event on the second line. The caption of the label is automatically updated once an event is moved from a group to another. * %5 (exEventCaption) {string}, indicates the caption of the event. The Caption property of the event specifies the custom caption that can be displayed on the label, without having to change the event's label. For instance, the LabelProperty = "<%=%256%>
<%=%5%>" displays on the first line, the event's short margins, while on the second line displays the event's caption. Once you update or edit the event's Caption, the event's body automatically shows the new caption. * %6 (exEventUserData) {any}, indicates the extra data associated with the event. The UserData property of the event indicates an extra data associated with the event. For instance, the LabelProperty = "<%=%256%>
<%=%6%>" displays on the first line, the event's short margins, while on the second line displays the event's user data. Once you update or edit the event's UserData, the event's body automatically shows the new label. * %7 (exEventDuration) {number}, specifies the duration of the event. The returned values is of float type, and it indicates the duration of the event in days. For instance, the 1.5 indicates, 1 day and 12 hours. For instance, the LabelProperty = "<%=%256%>
<%=((1:=int(0:= (date(%2)-date(%1)))) != 0 ? (=:1 + ' day(s)') : '') + (=:1 ? ' ' : '' ) + ((1:=int(0:=((=:0 - =:1 + 1/24/60/60/2)*24))) != 0 ? =:1 + ' hour(s)' : '' ) + (=:1 ? ' ' : '' ) + ((1:=round((=:0 - =:1)*60)) != 0 ? =:1 + ' min(s)' : '')%>" displays on the first line, the event's short margins, while on the second line displays the event's durations in days, hours and minutes. Once you update or edit the event's margins, the event's body automatically shows the new length. You can use the MoveBy method to delay the current event with a specified value time. You can use the SetKnownProperty(exEventDuration) to change the event's duration. * %8 (exEventRepetitiveExpression) {string}, specifies the repetitive expression of the event. The Repetitive property of the event indicates the expression that determines whether the event is repetitive. For instance, the LabelProperty = "<%=%256%>
<%=len(%8)? `repetitive event`:``%>" displays repetitive event for repetitive events. * %12 (exEventID) {string}, specifies the event's unique key/identifier/index. * %256 (exEventDisplayShortMargins) {string}, displays the margins of the event in a short format (read-only). The ShortDateFormat property defines the short date format. The ShortTimeFormat property defines the short time format. * %257 (exEventDisplayLongMargins) {string}, displays the margins of the event in a long format (read-only). The LongDateFormat property defines the long date format. The LongTimeFormat property defines the long time format. * %258 (exEventStartDate) {Date}, gets the starting date ( not including the time ) of the event (read-only). You can use this property to get the starting date of the event. * %259 (exEventStartTime) {number}, gets the starting time ( not including the date ) of the event, as a number between 0 and 1 (read-only). You can use this property to get the starting time of the event. * %260 (exEventEndDate) {Date}, gets the ending date ( not including the time ) of the event (read-only). You can use this property to get the ending date of the event. * %261 (exEventEndTime) {number}, gets the ending time ( not including the date ) of the event, as a number between 0 and 1 (read-only). You can use this property to get the ending time of the event. * %262 (exEventGroupLabel) {string}, gets the label of the owner group (read-only). The exEventGroupLabel property indicates the Caption property of the Group's event. The GroupID property of the event indicates the identifier of the group that event belongs to. The exEventGroupTitle property indicates the Title property of the Group's event. For instance, the LabelProperty = "<%=%262%>
<%=%256%>" displays on the first line, the group's caption, and the short margins of the event on the second line. The caption of the label is automatically updated once an event is moved from a group to another. * %263 (exEventGroupTitle) {string}, gets the title of the owner group (read-only). The exEventGroupTitle property indicates the Title property of the Group's event. The exEventGroupLabel property indicates the Caption property of the Group's event. The GroupID property of the event indicates the identifier of the group that event belongs to. For instance, the LabelProperty = "<%=%263%>
<%=%256%>" displays on the first line, the group's caption, and the short margins of the event on the second line. The caption of the label is automatically updated once an event is moved from a group to another. * %264 (exEventRepetitive) {boolean}, Indicates if the current event is a repetitive event. (read-only). You can use this flag to specify whether Repetitive property is not empty, and valid. * * @type {string} * @example * * null {null} or undefined {undefined}, the default short-label is used ("") * "" {string}, the short-label is hidden * "image and text" {string}, the event displays the image and text. The image can be added using the exontrol.HTMLPicture.Add() method * "<%=%256%>", displays the event's start and end margins in a short format */ defaultEventShortLabel: null, /** * @description The defaultEventLongLabel field defines the event's default long-label. The defaultEventLongLabel field supports ex-HTML and <%=formula%> tags. The <%=formula%> tag indicates the result of the giving formula. The formula supports value formatting. Inside the formula the %0, %1, ... indicates the value of corresponding property of the event, such as %1 specifies the exEventStartDateTime, %2 exEventEndDateTime, and so on. The known identifiers within the <%=formula%> tag are: * * %1 (exEventStartDateTime) {Date}, indicates the starting date/time of the event. This property gets the Start property of the event. The Start property defines the lower margin of the event, and it includes the date and the time values. The exEventStartDate specifies the DATE value only, while the exEventStartTime includes the TIME value only. For instance, the LabelProperty = "<%=weekday(%1)%>" displays the day of the week where the event starts * %2 (exEventEndDateTime) {Date}, indicates the ending date/time of the event. This property gets or sets the End property of the event. The End property defines the upper margin of the event, and it includes the date and the time values. The exEventEndDate specifies the DATE value only, while the exEventEndTime includes the TIME value only. For instance, the LabelProperty = "<%=weekday(%2)%>" gets the day of the week where the event ends. * %3 (exEventAllDay) {boolean}, indicates if the current event is an all day event. This property is equivalent with the event's AllDay property which indicates if the current event is an all-day event. For instance, the LabelProperty = "<%=%3 ? `All-Day-Event: `: ``%><%=%256%>", displays automatically an "All-Day-Event: " prefix for all-day events. If the event is not an all-day event, the <%=%256%>, or exEventDisplayShortMargins, short margins of the events are displayed. * %4 (exEventGroupID) {any}, specifies the identifier/index of the event's group. The GroupID property of the event indicates the identifier of the group that event belongs to. The exEventGroupLabel property indicates the Caption property of the Group's event. The exEventGroupTitle property indicates the Title property of the Group's event. For instance, the LabelProperty = "<%=%4%>
<%=%256%>" displays on the first line, the group's identifier, and the short margins of the event on the second line. The caption of the label is automatically updated once an event is moved from a group to another. * %5 (exEventCaption) {string}, indicates the caption of the event. The Caption property of the event specifies the custom caption that can be displayed on the label, without having to change the event's label. For instance, the LabelProperty = "<%=%256%>
<%=%5%>" displays on the first line, the event's short margins, while on the second line displays the event's caption. Once you update or edit the event's Caption, the event's body automatically shows the new caption. * %6 (exEventUserData) {any}, indicates the extra data associated with the event. The UserData property of the event indicates an extra data associated with the event. For instance, the LabelProperty = "<%=%256%>
<%=%6%>" displays on the first line, the event's short margins, while on the second line displays the event's user data. Once you update or edit the event's UserData, the event's body automatically shows the new label. * %7 (exEventDuration) {number}, specifies the duration of the event. The returned values is of float type, and it indicates the duration of the event in days. For instance, the 1.5 indicates, 1 day and 12 hours. For instance, the LabelProperty = "<%=%256%>
<%=((1:=int(0:= (date(%2)-date(%1)))) != 0 ? (=:1 + ' day(s)') : '') + (=:1 ? ' ' : '' ) + ((1:=int(0:=((=:0 - =:1 + 1/24/60/60/2)*24))) != 0 ? =:1 + ' hour(s)' : '' ) + (=:1 ? ' ' : '' ) + ((1:=round((=:0 - =:1)*60)) != 0 ? =:1 + ' min(s)' : '')%>" displays on the first line, the event's short margins, while on the second line displays the event's durations in days, hours and minutes. Once you update or edit the event's margins, the event's body automatically shows the new length. You can use the MoveBy method to delay the current event with a specified value time. You can use the SetKnownProperty(exEventDuration) to change the event's duration. * %8 (exEventRepetitiveExpression) {string}, specifies the repetitive expression of the event. The Repetitive property of the event indicates the expression that determines whether the event is repetitive. For instance, the LabelProperty = "<%=%256%>
<%=len(%8)? `repetitive event`:``%>" displays repetitive event for repetitive events. * %12 (exEventID) {string}, specifies the event's unique key/identifier/index. * %256 (exEventDisplayShortMargins) {string}, displays the margins of the event in a short format (read-only). The ShortDateFormat property defines the short date format. The ShortTimeFormat property defines the short time format. * %257 (exEventDisplayLongMargins) {string}, displays the margins of the event in a long format (read-only). The LongDateFormat property defines the long date format. The LongTimeFormat property defines the long time format. * %258 (exEventStartDate) {Date}, gets the starting date ( not including the time ) of the event (read-only). You can use this property to get the starting date of the event. * %259 (exEventStartTime) {number}, gets the starting time ( not including the date ) of the event, as a number between 0 and 1 (read-only). You can use this property to get the starting time of the event. * %260 (exEventEndDate) {Date}, gets the ending date ( not including the time ) of the event (read-only). You can use this property to get the ending date of the event. * %261 (exEventEndTime) {number}, gets the ending time ( not including the date ) of the event, as a number between 0 and 1 (read-only). You can use this property to get the ending time of the event. * %262 (exEventGroupLabel) {string}, gets the label of the owner group (read-only). The exEventGroupLabel property indicates the Caption property of the Group's event. The GroupID property of the event indicates the identifier of the group that event belongs to. The exEventGroupTitle property indicates the Title property of the Group's event. For instance, the LabelProperty = "<%=%262%>
<%=%256%>" displays on the first line, the group's caption, and the short margins of the event on the second line. The caption of the label is automatically updated once an event is moved from a group to another. * %263 (exEventGroupTitle) {string}, gets the title of the owner group (read-only). The exEventGroupTitle property indicates the Title property of the Group's event. The exEventGroupLabel property indicates the Caption property of the Group's event. The GroupID property of the event indicates the identifier of the group that event belongs to. For instance, the LabelProperty = "<%=%263%>
<%=%256%>" displays on the first line, the group's caption, and the short margins of the event on the second line. The caption of the label is automatically updated once an event is moved from a group to another. * %264 (exEventRepetitive) {boolean}, Indicates if the current event is a repetitive event. (read-only). You can use this flag to specify whether Repetitive property is not empty, and valid. * * @type {string} * @example * * null {null} or undefined {undefined}, the default short-label is used ("<%=%256%>") * "" {string}, the short-label is hidden * "image and text" {string}, the event displays the image and text. The image can be added using the exontrol.HTMLPicture.Add() method * "<%=%256%>", displays the event's start and end margins in a short format */ defaultEventLongLabel: "<%=%256%>", /** * @description The defaultEventExtraLabel field defines the event's default extra-label. The defaultEventExtraLabel field supports ex-HTML and <%=formula%> tags. The <%=formula%> tag indicates the result of the giving formula. The formula supports value formatting. Inside the formula the %0, %1, ... indicates the value of corresponding property of the event, such as %1 specifies the exEventStartDateTime, %2 exEventEndDateTime, and so on. The known identifiers within the <%=formula%> tag are: * * %1 (exEventStartDateTime) {Date}, indicates the starting date/time of the event. This property gets the Start property of the event. The Start property defines the lower margin of the event, and it includes the date and the time values. The exEventStartDate specifies the DATE value only, while the exEventStartTime includes the TIME value only. For instance, the LabelProperty = "<%=weekday(%1)%>" displays the day of the week where the event starts * %2 (exEventEndDateTime) {Date}, indicates the ending date/time of the event. This property gets or sets the End property of the event. The End property defines the upper margin of the event, and it includes the date and the time values. The exEventEndDate specifies the DATE value only, while the exEventEndTime includes the TIME value only. For instance, the LabelProperty = "<%=weekday(%2)%>" gets the day of the week where the event ends. * %3 (exEventAllDay) {boolean}, indicates if the current event is an all day event. This property is equivalent with the event's AllDay property which indicates if the current event is an all-day event. For instance, the LabelProperty = "<%=%3 ? `All-Day-Event: `: ``%><%=%256%>", displays automatically an "All-Day-Event: " prefix for all-day events. If the event is not an all-day event, the <%=%256%>, or exEventDisplayShortMargins, short margins of the events are displayed. * %4 (exEventGroupID) {any}, specifies the identifier/index of the event's group. The GroupID property of the event indicates the identifier of the group that event belongs to. The exEventGroupLabel property indicates the Caption property of the Group's event. The exEventGroupTitle property indicates the Title property of the Group's event. For instance, the LabelProperty = "<%=%4%>
<%=%256%>" displays on the first line, the group's identifier, and the short margins of the event on the second line. The caption of the label is automatically updated once an event is moved from a group to another. * %5 (exEventCaption) {string}, indicates the caption of the event. The Caption property of the event specifies the custom caption that can be displayed on the label, without having to change the event's label. For instance, the LabelProperty = "<%=%256%>
<%=%5%>" displays on the first line, the event's short margins, while on the second line displays the event's caption. Once you update or edit the event's Caption, the event's body automatically shows the new caption. * %6 (exEventUserData) {any}, indicates the extra data associated with the event. The UserData property of the event indicates an extra data associated with the event. For instance, the LabelProperty = "<%=%256%>
<%=%6%>" displays on the first line, the event's short margins, while on the second line displays the event's user data. Once you update or edit the event's UserData, the event's body automatically shows the new label. * %7 (exEventDuration) {number}, specifies the duration of the event. The returned values is of float type, and it indicates the duration of the event in days. For instance, the 1.5 indicates, 1 day and 12 hours. For instance, the LabelProperty = "<%=%256%>
<%=((1:=int(0:= (date(%2)-date(%1)))) != 0 ? (=:1 + ' day(s)') : '') + (=:1 ? ' ' : '' ) + ((1:=int(0:=((=:0 - =:1 + 1/24/60/60/2)*24))) != 0 ? =:1 + ' hour(s)' : '' ) + (=:1 ? ' ' : '' ) + ((1:=round((=:0 - =:1)*60)) != 0 ? =:1 + ' min(s)' : '')%>" displays on the first line, the event's short margins, while on the second line displays the event's durations in days, hours and minutes. Once you update or edit the event's margins, the event's body automatically shows the new length. You can use the MoveBy method to delay the current event with a specified value time. You can use the SetKnownProperty(exEventDuration) to change the event's duration. * %8 (exEventRepetitiveExpression) {string}, specifies the repetitive expression of the event. The Repetitive property of the event indicates the expression that determines whether the event is repetitive. For instance, the LabelProperty = "<%=%256%>
<%=len(%8)? `repetitive event`:``%>" displays repetitive event for repetitive events. * %12 (exEventID) {string}, specifies the event's unique key/identifier/index. * %256 (exEventDisplayShortMargins) {string}, displays the margins of the event in a short format (read-only). The ShortDateFormat property defines the short date format. The ShortTimeFormat property defines the short time format. * %257 (exEventDisplayLongMargins) {string}, displays the margins of the event in a long format (read-only). The LongDateFormat property defines the long date format. The LongTimeFormat property defines the long time format. * %258 (exEventStartDate) {Date}, gets the starting date ( not including the time ) of the event (read-only). You can use this property to get the starting date of the event. * %259 (exEventStartTime) {number}, gets the starting time ( not including the date ) of the event, as a number between 0 and 1 (read-only). You can use this property to get the starting time of the event. * %260 (exEventEndDate) {Date}, gets the ending date ( not including the time ) of the event (read-only). You can use this property to get the ending date of the event. * %261 (exEventEndTime) {number}, gets the ending time ( not including the date ) of the event, as a number between 0 and 1 (read-only). You can use this property to get the ending time of the event. * %262 (exEventGroupLabel) {string}, gets the label of the owner group (read-only). The exEventGroupLabel property indicates the Caption property of the Group's event. The GroupID property of the event indicates the identifier of the group that event belongs to. The exEventGroupTitle property indicates the Title property of the Group's event. For instance, the LabelProperty = "<%=%262%>
<%=%256%>" displays on the first line, the group's caption, and the short margins of the event on the second line. The caption of the label is automatically updated once an event is moved from a group to another. * %263 (exEventGroupTitle) {string}, gets the title of the owner group (read-only). The exEventGroupTitle property indicates the Title property of the Group's event. The exEventGroupLabel property indicates the Caption property of the Group's event. The GroupID property of the event indicates the identifier of the group that event belongs to. For instance, the LabelProperty = "<%=%263%>
<%=%256%>" displays on the first line, the group's caption, and the short margins of the event on the second line. The caption of the label is automatically updated once an event is moved from a group to another. * %264 (exEventRepetitive) {boolean}, Indicates if the current event is a repetitive event. (read-only). You can use this flag to specify whether Repetitive property is not empty, and valid. * * @type {string} * @example * * "" {string}, no extra label is shown * "image and text" {string}, the event displays the image and text. The image can be added using the exontrol.HTMLPicture.Add() method * "<%=%256%>", displays the event's start and end margins in a short format */ defaultEventExtraLabel: "", /** * @description The shortDateFormat field defines the short date format. The KnownProperty(exEventDisplayShortMargins) property uses the ShortDateFormat property to display the event's margins in short format. * * The shortDateFormat field supports ex-HTLM tags such as (, , , ...) 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 * * @type {string} * @example * * null {null}, "<%loc_sdate%>" * "" {string}, nothing is displayed * "<%loc_sdate%>" {string}, displays the date in the short format using the current user regional and language settings * "<%mm%>/<%dd%>/<%yyyy%>" {string}, displays the date in mm/dd/yyyy format * */ shortDateFormat: "<%loc_sdate%>", /** * @description The shortTimeFormat field defines the short time format. The KnownProperty(exEventDisplayShortMargins) property uses the ShortTimeFormat property to display the event's margins in short format. * * The shortTimeFormat field supports ex-HTLM tags such as (, , , ...) 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 * * @type {string} * @example * * null {null}, "<%h%>:<%nn%> <%AM/PM%>" * "" {string}, nothing is displayed * "<%loc_time%>" {string}, Indicates the time using the current user regional and language settings * "<%hh%>:<%nn%>" {string}, displays the time in hh:nn format * */ shortTimeFormat: "<%h%>:<%nn%> <%AM/PM%>", /** * @description The longDateFormat field defines the long date format. The KnownProperty(exEventDisplayLongMargins) property uses the LongDateFormat property to display the event's margins in long format. * * The longDateFormat field supports ex-HTLM tags such as (, , , ...) 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 * * @type {string} * @example * * null {null}, "<%loc_ldate%>" * "" {string}, nothing is displayed * "<%loc_ldate%>" {string}, displays the date in the long format using the current user regional and language settings * "<%mm%>/<%dd%>/<%yyyy%>" {string}, displays the date in mm/dd/yyyy format * */ longDateFormat: "<%loc_ldate%>", /** * @description The longTimeFormat field defines the long time format. The KnownProperty(exEventDisplayLongMargins) property uses the LongTimeFormat property to display the event's margins in long format. * * The longTimeFormat field supports ex-HTLM tags such as (, , , ...) 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 * * @type {string} * @example * * null {null}, "<%hh%>:<%nn%>:<%ss%> <%AM/PM%>" * "" {string}, nothing is displayed * "<%loc_time24%>" {string}, Indicates the time in 24 hours format without a time marker using the current user regional and language settings * "<%hh%>:<%nn%>:<%ss%>" {string}, displays the time in hh:nn:ss format * */ longTimeFormat: "<%hh%>:<%nn%>:<%ss%> <%AM/PM%>", /** * @description The showEventLabels field specifies whether the short, long and extra labels of the events are visible or hidden. * @type {boolean} * @example * * false {boolean}, the event's short, long or extra labels are not shown * true {boolean}, the event's short, long or extra labels are visible */ showEventLabels: true, /** * @description The createEventLabel field specifies the label to be shown while creating events. The formatCreateEventLabel misc options defines the format to show the label. The createEventLabel field supports ex-HTML and <%=formula%> tags. The <%=formula%> tag indicates the result of the giving formula. The formula supports value formatting. Inside the formula the %0, %1, ... indicates the value of corresponding property of the event, such as %1 specifies the exEventStartDateTime, %2 exEventEndDateTime, and so on. The known identifiers within the <%=formula%> tag are: * * %1 (exEventStartDateTime) {Date}, indicates the starting date/time of the event. This property gets the Start property of the event. The Start property defines the lower margin of the event, and it includes the date and the time values. The exEventStartDate specifies the DATE value only, while the exEventStartTime includes the TIME value only. For instance, the LabelProperty = "<%=weekday(%1)%>" displays the day of the week where the event starts * %2 (exEventEndDateTime) {Date}, indicates the ending date/time of the event. This property gets or sets the End property of the event. The End property defines the upper margin of the event, and it includes the date and the time values. The exEventEndDate specifies the DATE value only, while the exEventEndTime includes the TIME value only. For instance, the LabelProperty = "<%=weekday(%2)%>" gets the day of the week where the event ends. * %3 (exEventAllDay) {boolean}, indicates if the current event is an all day event. This property is equivalent with the event's AllDay property which indicates if the current event is an all-day event. For instance, the LabelProperty = "<%=%3 ? `All-Day-Event: `: ``%><%=%256%>", displays automatically an "All-Day-Event: " prefix for all-day events. If the event is not an all-day event, the <%=%256%>, or exEventDisplayShortMargins, short margins of the events are displayed. * %4 (exEventGroupID) {any}, specifies the identifier/index of the event's group. The GroupID property of the event indicates the identifier of the group that event belongs to. The exEventGroupLabel property indicates the Caption property of the Group's event. The exEventGroupTitle property indicates the Title property of the Group's event. For instance, the LabelProperty = "<%=%4%>
<%=%256%>" displays on the first line, the group's identifier, and the short margins of the event on the second line. The caption of the label is automatically updated once an event is moved from a group to another. * %5 (exEventCaption) {string}, indicates the caption of the event. The Caption property of the event specifies the custom caption that can be displayed on the label, without having to change the event's label. For instance, the LabelProperty = "<%=%256%>
<%=%5%>" displays on the first line, the event's short margins, while on the second line displays the event's caption. Once you update or edit the event's Caption, the event's body automatically shows the new caption. * %6 (exEventUserData) {any}, indicates the extra data associated with the event. The UserData property of the event indicates an extra data associated with the event. For instance, the LabelProperty = "<%=%256%>
<%=%6%>" displays on the first line, the event's short margins, while on the second line displays the event's user data. Once you update or edit the event's UserData, the event's body automatically shows the new label. * %7 (exEventDuration) {number}, specifies the duration of the event. The returned values is of float type, and it indicates the duration of the event in days. For instance, the 1.5 indicates, 1 day and 12 hours. For instance, the LabelProperty = "<%=%256%>
<%=((1:=int(0:= (date(%2)-date(%1)))) != 0 ? (=:1 + ' day(s)') : '') + (=:1 ? ' ' : '' ) + ((1:=int(0:=((=:0 - =:1 + 1/24/60/60/2)*24))) != 0 ? =:1 + ' hour(s)' : '' ) + (=:1 ? ' ' : '' ) + ((1:=round((=:0 - =:1)*60)) != 0 ? =:1 + ' min(s)' : '')%>" displays on the first line, the event's short margins, while on the second line displays the event's durations in days, hours and minutes. Once you update or edit the event's margins, the event's body automatically shows the new length. You can use the MoveBy method to delay the current event with a specified value time. You can use the SetKnownProperty(exEventDuration) to change the event's duration. * %8 (exEventRepetitiveExpression) {string}, specifies the repetitive expression of the event. The Repetitive property of the event indicates the expression that determines whether the event is repetitive. For instance, the LabelProperty = "<%=%256%>
<%=len(%8)? `repetitive event`:``%>" displays repetitive event for repetitive events. * %12 (exEventID) {string}, specifies the event's unique key/identifier/index. * %256 (exEventDisplayShortMargins) {string}, displays the margins of the event in a short format (read-only). The ShortDateFormat property defines the short date format. The ShortTimeFormat property defines the short time format. * %257 (exEventDisplayLongMargins) {string}, displays the margins of the event in a long format (read-only). The LongDateFormat property defines the long date format. The LongTimeFormat property defines the long time format. * %258 (exEventStartDate) {Date}, gets the starting date ( not including the time ) of the event (read-only). You can use this property to get the starting date of the event. * %259 (exEventStartTime) {number}, gets the starting time ( not including the date ) of the event, as a number between 0 and 1 (read-only). You can use this property to get the starting time of the event. * %260 (exEventEndDate) {Date}, gets the ending date ( not including the time ) of the event (read-only). You can use this property to get the ending date of the event. * %261 (exEventEndTime) {number}, gets the ending time ( not including the date ) of the event, as a number between 0 and 1 (read-only). You can use this property to get the ending time of the event. * %262 (exEventGroupLabel) {string}, gets the label of the owner group (read-only). The exEventGroupLabel property indicates the Caption property of the Group's event. The GroupID property of the event indicates the identifier of the group that event belongs to. The exEventGroupTitle property indicates the Title property of the Group's event. For instance, the LabelProperty = "<%=%262%>
<%=%256%>" displays on the first line, the group's caption, and the short margins of the event on the second line. The caption of the label is automatically updated once an event is moved from a group to another. * %263 (exEventGroupTitle) {string}, gets the title of the owner group (read-only). The exEventGroupTitle property indicates the Title property of the Group's event. The exEventGroupLabel property indicates the Caption property of the Group's event. The GroupID property of the event indicates the identifier of the group that event belongs to. For instance, the LabelProperty = "<%=%263%>
<%=%256%>" displays on the first line, the group's caption, and the short margins of the event on the second line. The caption of the label is automatically updated once an event is moved from a group to another. * %264 (exEventRepetitive) {boolean}, Indicates if the current event is a repetitive event. (read-only). You can use this flag to specify whether Repetitive property is not empty, and valid. * * @type {string} * @example * * null {null}, the control's DefaultEventLongLabel/DefaultEventShortLabel property defines the event's label while the user creates it by drag and drop * "" {string}, no label is shown for event to create * "Start: <%=%1%>
End: <%=%2%>" {string}, displays the starting margin of the even on the first line, while on the second line it displays the ending point of the event * "Duration: <%=((1:=int(0:= %7)) != 0 ? (=:1 + ' day(s)') : '') + (=:1 ? ' ' : '' ) + ((1:=int(0:=((=:0 - =:1 + 1/24/60/60/2)*24))) != 0 ? =:1 + ' hour(s)' : '' ) + (=:1 ? ' ' : '' ) + ((1:=round((=:0 - =:1)*60)) != 0 ? =:1 + ' min(s)' : '')%>" {string}, displays the duration of the event in days, hours and minutes * */ createEventLabel: "<%=%256%>
<%=((1:=int(0:= %7)) != 0 ? (=:1 + ' day(s)') : '') + (=:1 ? ' ' : '' ) + ((1:=int(0:=((=:0 - =:1 + 1/24/60/60/2)*24))) != 0 ? =:1 + ' hour(s)' : '' ) + (=:1 ? ' ' : '' ) + ((1:=round((=:0 - =:1)*60)) != 0 ? =:1 + ' min(s)' : '')%>", /** * @description The updateEventsLabel field specifies the label to be shown while moving or resizing the events. The formatEventUpdateLabel misc options defines the format to show the label. The updateEventsLabel field supports ex-HTML and <%=formula%> tags. The <%=formula%> tag indicates the result of the giving formula. The formula supports value formatting. Inside the formula the %0, %1, ... indicates the value of corresponding property of the event, such as %1 specifies the exEventStartDateTime, %2 exEventEndDateTime, and so on. The known identifiers within the <%=formula%> tag are: * * %1 (exEventStartDateTime) {Date}, indicates the starting date/time of the event. This property gets the Start property of the event. The Start property defines the lower margin of the event, and it includes the date and the time values. The exEventStartDate specifies the DATE value only, while the exEventStartTime includes the TIME value only. For instance, the LabelProperty = "<%=weekday(%1)%>" displays the day of the week where the event starts * %2 (exEventEndDateTime) {Date}, indicates the ending date/time of the event. This property gets or sets the End property of the event. The End property defines the upper margin of the event, and it includes the date and the time values. The exEventEndDate specifies the DATE value only, while the exEventEndTime includes the TIME value only. For instance, the LabelProperty = "<%=weekday(%2)%>" gets the day of the week where the event ends. * %3 (exEventAllDay) {boolean}, indicates if the current event is an all day event. This property is equivalent with the event's AllDay property which indicates if the current event is an all-day event. For instance, the LabelProperty = "<%=%3 ? `All-Day-Event: `: ``%><%=%256%>", displays automatically an "All-Day-Event: " prefix for all-day events. If the event is not an all-day event, the <%=%256%>, or exEventDisplayShortMargins, short margins of the events are displayed. * %4 (exEventGroupID) {any}, specifies the identifier/index of the event's group. The GroupID property of the event indicates the identifier of the group that event belongs to. The exEventGroupLabel property indicates the Caption property of the Group's event. The exEventGroupTitle property indicates the Title property of the Group's event. For instance, the LabelProperty = "<%=%4%>
<%=%256%>" displays on the first line, the group's identifier, and the short margins of the event on the second line. The caption of the label is automatically updated once an event is moved from a group to another. * %5 (exEventCaption) {string}, indicates the caption of the event. The Caption property of the event specifies the custom caption that can be displayed on the label, without having to change the event's label. For instance, the LabelProperty = "<%=%256%>
<%=%5%>" displays on the first line, the event's short margins, while on the second line displays the event's caption. Once you update or edit the event's Caption, the event's body automatically shows the new caption. * %6 (exEventUserData) {any}, indicates the extra data associated with the event. The UserData property of the event indicates an extra data associated with the event. For instance, the LabelProperty = "<%=%256%>
<%=%6%>" displays on the first line, the event's short margins, while on the second line displays the event's user data. Once you update or edit the event's UserData, the event's body automatically shows the new label. * %7 (exEventDuration) {number}, specifies the duration of the event. The returned values is of float type, and it indicates the duration of the event in days. For instance, the 1.5 indicates, 1 day and 12 hours. For instance, the LabelProperty = "<%=%256%>
<%=((1:=int(0:= (date(%2)-date(%1)))) != 0 ? (=:1 + ' day(s)') : '') + (=:1 ? ' ' : '' ) + ((1:=int(0:=((=:0 - =:1 + 1/24/60/60/2)*24))) != 0 ? =:1 + ' hour(s)' : '' ) + (=:1 ? ' ' : '' ) + ((1:=round((=:0 - =:1)*60)) != 0 ? =:1 + ' min(s)' : '')%>" displays on the first line, the event's short margins, while on the second line displays the event's durations in days, hours and minutes. Once you update or edit the event's margins, the event's body automatically shows the new length. You can use the MoveBy method to delay the current event with a specified value time. You can use the SetKnownProperty(exEventDuration) to change the event's duration. * %8 (exEventRepetitiveExpression) {string}, specifies the repetitive expression of the event. The Repetitive property of the event indicates the expression that determines whether the event is repetitive. For instance, the LabelProperty = "<%=%256%>
<%=len(%8)? `repetitive event`:``%>" displays repetitive event for repetitive events. * %12 (exEventID) {string}, specifies the event's unique key/identifier/index. * %256 (exEventDisplayShortMargins) {string}, displays the margins of the event in a short format (read-only). The ShortDateFormat property defines the short date format. The ShortTimeFormat property defines the short time format. * %257 (exEventDisplayLongMargins) {string}, displays the margins of the event in a long format (read-only). The LongDateFormat property defines the long date format. The LongTimeFormat property defines the long time format. * %258 (exEventStartDate) {Date}, gets the starting date ( not including the time ) of the event (read-only). You can use this property to get the starting date of the event. * %259 (exEventStartTime) {number}, gets the starting time ( not including the date ) of the event, as a number between 0 and 1 (read-only). You can use this property to get the starting time of the event. * %260 (exEventEndDate) {Date}, gets the ending date ( not including the time ) of the event (read-only). You can use this property to get the ending date of the event. * %261 (exEventEndTime) {number}, gets the ending time ( not including the date ) of the event, as a number between 0 and 1 (read-only). You can use this property to get the ending time of the event. * %262 (exEventGroupLabel) {string}, gets the label of the owner group (read-only). The exEventGroupLabel property indicates the Caption property of the Group's event. The GroupID property of the event indicates the identifier of the group that event belongs to. The exEventGroupTitle property indicates the Title property of the Group's event. For instance, the LabelProperty = "<%=%262%>
<%=%256%>" displays on the first line, the group's caption, and the short margins of the event on the second line. The caption of the label is automatically updated once an event is moved from a group to another. * %263 (exEventGroupTitle) {string}, gets the title of the owner group (read-only). The exEventGroupTitle property indicates the Title property of the Group's event. The exEventGroupLabel property indicates the Caption property of the Group's event. The GroupID property of the event indicates the identifier of the group that event belongs to. For instance, the LabelProperty = "<%=%263%>
<%=%256%>" displays on the first line, the group's caption, and the short margins of the event on the second line. The caption of the label is automatically updated once an event is moved from a group to another. * %264 (exEventRepetitive) {boolean}, Indicates if the current event is a repetitive event. (read-only). You can use this flag to specify whether Repetitive property is not empty, and valid. * * @type {string} * @example * * null {null}, the control's DefaultEventLongLabel/DefaultEventShortLabel property defines the event's label while the user moves or resizes the events by drag and drop * "" {string}, no label is shown for the event to resize or move * "Start: <%=%1%>
End: <%=%2%>" {string}, displays the starting margin of the even on the first line, while on the second line it displays the ending point of the event * "Duration: <%=((1:=int(0:= %7)) != 0 ? (=:1 + ' day(s)') : '') + (=:1 ? ' ' : '' ) + ((1:=int(0:=((=:0 - =:1 + 1/24/60/60/2)*24))) != 0 ? =:1 + ' hour(s)' : '' ) + (=:1 ? ' ' : '' ) + ((1:=round((=:0 - =:1)*60)) != 0 ? =:1 + ' min(s)' : '')%>" {string}, displays the duration of the event in days, hours and minutes * */ updateEventsLabel: "<%=%256%>
<%=((1:=int(0:= %7)) != 0 ? (=:1 + ' day(s)') : '') + (=:1 ? ' ' : '' ) + ((1:=int(0:=((=:0 - =:1 + 1/24/60/60/2)*24))) != 0 ? =:1 + ' hour(s)' : '' ) + (=:1 ? ' ' : '' ) + ((1:=round((=:0 - =:1)*60)) != 0 ? =:1 + ' min(s)' : '')%>", /** * @description The showMarkZone field indicates how the control shows the mark-zones, as explained: * * 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} * @example * * null {null}, the mark-zones are displayed on front * 0 {number}, hides the mark-zones * 1 {number}, shows the mark-zones on the background (behind events) * */ showMarkZone: 2 /*exShowMarkZonesFront*/, /** * @description The showEvents field indicates the type of the events the control displays, as explained: * * -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} * @example * * -1 {number} or null {null}, the control displayes all events (equivalent of exShowAllEvents) * 0 {number}, hides the events * 1 {number}, shows only the regular events (non-repetitive events) * 3 {number}, shows regular and repetitive events, where 3 is 1 (exShowRegularEvents) | 2 (exShowRepetitiveEvents) * */ showEvents: -1 /*exShowAllEvents*/, /** * @description The showAllDayHeader field specifies whether the control's header for all-day events is visible or hidden. * @type {boolean} * @example * * false{boolean} or null {null}, hides the all-day header * true{boolean}, shows the all-day header * */ showAllDayHeader: false, /** * @description The headerAllDayEventHeight field defines the height of the events to display within the all-day header (relative to the font-size of the control) * @type {number} * @example * * null {null}, the height of the event within the control's 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 event within the control's all-day header is 2 times the size of the control's font */ headerAllDayEventHeight: 1, /** * @description The allowMultiDaysEvent field specifies whether the user can create events that may start on a day and ends on other. * @type {boolean} * @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) */ allowMultiDaysEvent: true, /** * @description The allowAllDayEventScroll field defines 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|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 levels * */ allowAllDayEventScroll: null, /** * @description The markZones field defines the mark-zones within the control. The mark-zones field can be any of the following: * * {string}, defines a single mark-zone with specified caption/identifier * {array(any)}, defines multiple mark-zones, with specified caption/identifier/options, as an array of [caption] or [{MarkZoneOptions}] type * {object}, defines multiple mark-zones, where each property of the object defines a mark-zone with its options, of MarkZoneOptions type * * @type {array|object} * @example * * markZones: "Now", {string} defines a single mark-zone with the identifier/caption "Now" * markZones: ["Z1",{caption: "Z2", visible: false}], {array} defines two mark-zones "Z1" and "Z2" (hidden) * markZones: * { * "Z1": * { * }, * "Z2": * { * }, * "Z3": * { * shape: * { * pattern: 6, * patternColor: "lightgray" * }, * visible: false * } * }, {object} defines three mark-zones "Z1", "Z2" and "Z3" * */ markZones: null, /** * @description The groups field defines the groups within the control. The groups field can be any of the following: * * {string}, defines a single group with specified caption/identifier * {array(any)}, defines multiple groups, with specified caption/identifier/options, as an array of [caption] or [{GroupOptions}] type * {object}, defines multiple groups, where each property of the object defines a group with its options, of GroupOptions type * * @type {array|object} * @example * * groups: "G1", {string} defines a single group with the identifier/caption "G1" * groups: ["G1",{caption: "G2", visible: true}], {array} defines two groups "G1" and "G2" * groups: * { * "G1": * { * }, * "G2": * { * visible: true * }, * "G3": * { * eventShape: "red", * visible: true * } * }, {object} defines three groups "G1", "G2" and "G3" * */ groups: null, /** * * @description The events field defines the events within the control. The events field can be any of the following: * * {array(any)}, defines multiple events, with specified options, as an array of [{EventOptions}] type * {object}, defines multiple events, where each property(key) of the object defines the event with its options, of EventOptions type * * @type {array|object} * @example * * events: [{start: "#1/1/2001 10:00#", end: "#1/1/2001 12:00#"}], {array} defines a single event * events: * { * "E1": * { * start: "#1/1/2001 10:00#", * end: "#1/1/2001 12:00#" * }, * "E2": * { * start: "#1/1/2001 12:00#", * end: "#1/1/2001 14:00#", * visible: false * } * }, {object} defines two events "E1" and "E2" * */ events: null, /** * @description The selection field defines the control's selection, as one of the following: * * value {null}, clears the entire selection (unselect all) * value {number}, selects an event giving index within the events collection * value {string}, selects an event giving its identifier/key * value {Event}, selects an event giving its reference * value {Event}, selects all events within the control * value {array}, specifies an array of [type] type, where type could be any number, string or Event type. * * @type {any} * @example * * null {null}, clears the entire selection * 0 {number}, selects the event with the index 0 * [0,"key"] {number}, selects the event with the index 0 and the event with the identifier/key "key" * * @since 1.9 */ selection: null, /** * @description The timeScale field holds options to apply on the control's time-scale * @type {TimeScaleOptions} */ timeScale: { /** * @description The visible field indicates whether the time-scale header is visible or hidden. * @type {boolean} * @example * * false {boolean}, hides the time-scale header * true {boolean}, shows the time-scale header */ visible: true, /** * @description The shape field defines the shape for individual time-scale header. * * The shape field can be any of the following: *
    *
  • the shape's name within the exontrol.Shape.Schedule or exontrol.Shape namespace *
  • a CSS color *
  • a JSON string-representation of an object of exontrol.Def.Shape type, for the time-scale header itself *
  • an object of {normal,hover,click,disabled} type. The normal, hover, click and disabled are objects of exontrol.Def.Shape type *
* * @type {any} * @example * * null {null}, no custom shape is applied (default object's shape may be applied) * "" {string}, no custom shape is applied (no default object's shape is be applied) * "red" {string}, fills the object's background in red (CSS color) * '{"fillColor": "red"}' or '{"normal":{"fillColor": "red"}}' {string}, fills the object's background in red (JSON-representation of an object of exontrol.Def.Shape type) * "xxx" {string}, indicates that exontrol.Shapes.Schedule.xxx or exontrol.Shapes.xxx is applied on the object's background. If the xxx field is missing, no custom shape is applied (no default object's shape is be applied) * exontrol.Shapes.Button {object}, applies the "Button" shape on the object as defined into exontrol.Shapes namespace */ shape: null, /** * @description The cursor field defines the mouse-cursor for individual time-scale header. * @type {string} * @example * * "pointer" {string}, The cursor is a pointer that indicates a link (typically an image of a pointing hand) */ cursor: null, /** * @description The minWidth field defines the minimal size of the time-scale header. * @type {number} * @example * * null {null}, The minWidth field is ignored * 32 {number}, The time-scale header minimal-size is set to 32 */ minWidth: null, /** * @description The maxWidth field defines the maximal size of the time-scale header. * @type {number} * @example * * null {null}, The maxWidth field is ignored * 96 {number}, The time-scale header maximal-size is set to 96 */ maxWidth: 96, /** * @description The width field defines the size of the time-scale header. * @type {number} * @example * * null {null}, Sets the time-scale's width to 9 * 64 {number}, Sets the size of the time-scale header to 64 */ width: 64, /** * @description The allowResize field specifies whether the user can resize the time-scale header * @type {boolean} * @example * * false {boolean}, the user can not resize the time-scale header by drag and drop * true {boolean}, the user can resize the time-scale header by drag and drop */ allowResize: true, /** * @description The majorTimeLabel field defines the label of the time-scale's major ruler * * The majorTimeLabel field supports ex-HTLM tags such as (, , , ...) and <%DATE%> tags as follows: * * <%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 * * @type {string} * @example * * null {null}, the default label of the major ruler is "<%hh%>:<%nn%> <%AM/PM%>" * "<%hh%>:<%nn%>" {string}, displays the major ruler without AM/PM indicators (24-hours) */ majorTimeLabel: "<%hh%>:<%nn%> <%AM/PM%>", /** * @description The majorTimeRuler field indicates the increment for the time-scale's major ruler. The format of majorTimeRuler field is "HH[:MM[:NN]]" format, where HH indicates hours, MM indicates minutes, and NN indicates seconds * @type {string} * @example * * null {null}, displays major rulers from hour to hour, equivalent of "01:00" * "02:00" {string}, displays the major rulers every 2 hours */ majorTimeRuler: "01:00", /** * @description The minorTimeLabel field defines the label of the time-scale's minor ruler * * The minorTimeLabel field supports ex-HTLM tags such as (, , , ...) and <%DATE%> tags as follows: * * <%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 * * @type {string} * @example * * null {null}, the default label of the minor ruler is ":<%nn%>" * "<%hh%>:<%nn%>" {string}, displays the minor ruler without AM/PM indicators (24-hours) */ minorTimeLabel: ":<%nn%>", /** * @description The minorTimeRuler field indicates the increment for the time-scale's minor ruler. The format of minorTimeRuler field is "HH[:MM[:NN]]" format, where HH indicates hours, MM indicates minutes, and NN indicates seconds * @type {string} * @example * * null {null}, displays minor rulers from 15 to 15 minutes, equivalent of "00:15" * "00:30" {string}, displays the minor rulers every half an hour */ minorTimeRuler: "00:15", /** * @description The timeZone field indicates the time zone for the time scale. The format of minorTimeRuler field is "[-]HH[:MM[:NN]]" format, where HH indicates hours, MM indicates minutes, and NN indicates seconds * @type {string} * @example * * null {null}, no time delay is applied * "-02:00" {string}, delays the time scale with 2 hours earlier * "+03:00" {string}, adds a three hours to the current time */ timeZone: "00:00", /** * @description The caption field specifies the HTML caption to be displayed on the top side of the time scale. * @type {string} * @example * * null {null}, no caption is displayed * "time" {string}, displays the "time" caption in bold */ caption: "" }, /** * @description The misc object holds the control's miscellaneous options * @type {MiscellaneousOptions} */ misc: { /** * @description The minHeight field specifies the minimum-height for the day's view. The minHeight field is relative to the control's font size while positive or fixed if negative. * @type {number} * @example: * * -32 {number} indicates a minimum 32-pixels * 2 {number} specifies 2 times control's font-size */ minHeight: 1, /** * @description The requireTimeScaleHeight field specifies the minimum-height for the view's time-scale header to be visible. The requireTimeScaleHeight field is relative to the control's font size while positive or fixed if negative. * @type {number} * @example: * * 0 {number} hides the view's time-scale * -32 {number} indicates a minimum 32-pixels * 2 {number} specifies 2 times control's font-size */ requireTimeScaleHeight: 4, /** * @description The displayTimeScaleHeight field specifies the minimum-height for the day's time-scale so it is visible. The displayTimeScaleHeight field is relative to the control's font size while positive or fixed if negative. * @type {number} * @example: * * 0 {number} hides the date's time-scale * -32 {number} indicates a minimum 32-pixels * 2 {number} specifies 2 times control's font-size */ displayTimeScaleHeight: 1, /** * @description The requireRulerDistance field specifies the minimum-distance between two consecutive rulers. The requireRulerDistance field is relative to the control's font size while positive or fixed if negative. * @type {number} * @example: * * 0 {number} the requireRulerDistance option is ignored * -32 {number} indicates a minimum 32-pixels * 2 {number} specifies 2 times control's font-size */ requireRulerDistance: 1, /** * @description The groupingButtonPrompt field defines the message to show within the prompt, once the user clicks the header's grouping-button (if no exontrol.menu library is not included). * @type {string} * @example: * * null {null}, equivalent of "Enter the id or index of each visible-group (separated by comma):" * "" {string}, no message is displayed */ groupingButtonPrompt: "Enter the id or index of each visible-group (separated by comma):", /** * @description The arrowSizeMultiDatesEvent field specifies the size of the up/down arrow(s) to show within the multi-dates events. The arrowSizeMultiDatesEvent field can be a number which indicates a fixed width, or an array of [min, max] type that specifies the minimum and maximum size of the arrow. The size of the up/down arrow depends on the size of the event/date. * @type {number|number[]} * @example: * * 0 {number}, hides the up/down arrow(s) are for any multi-dates event * 4 {number}, indicates a 4-pixels wide for up/down arrow(s) of multi-dates event (fixed size) * [4,8] {number[]}, specifies that the size of up/down arrow(s) of multi-dates event is variable from 4 to 8-pixels wide (variable size) */ arrowSizeMultiDatesEvent: [3,6], /** * @description The createEventMargin field specifies the size of the right-margin/down-margin of each date to allow users to create new events by drag and drop * @type {number} * @example: * * 0 {number}, hides the right-margin/down-margin of each date to allow users to create new events by drag and drop * 8 {number}, indicates a 8-pixels wide for the right-margin/down-margin of each date to allow users to create new events by drag and drop */ createEventMargin: 6, /** * @description The eventMargin field specifies the distance (horizontal or/and vertical) between events and date's borders. * @type {number|number[]} * @example: * * 0 {number}, indicates no distance between events * 4 {number} or [4,4] {array}, indicates a 4-pixels distance between events, horizontally and vertically as well * [4,0] {array}, indicates a 4-pixels distance between events horizontally and 0 vertically * [8,4] {array}, indicates a 8-pixels distance between events horizontally and 4-pixels vertically */ eventMargin: 3, /** * @description The padSelectEvent field specifies the distance between event and its selected-border. The padSelectEvent field has effect only if the selectEventStyle option is 1 (the event's shape and color is not altered so the "select" shape is displayed on the event's background) * @type {(number|string|array)} * @example: * * null {null}, indicates that the default-padding field is used ([3,3]) * 0 {number}, indicates no padding * 4 {number} or [4,4] {array}, increases the size of selected-border around event, with 2 * 4-pixels * "8,4" {string} or [8,4] {array}, increases the width of selected-border around event, with 2 * 8-pixels height with 2 * 4-pixels */ padSelectEvent: 3, /** * @description The formatGroupCaption field specifies the format and alignment to display the group's caption. A combination of one or more exontrol.DrawTextFormatEnum flags that defines the format to show the group's caption. * @type {exontrol.DrawTextFormatEnum} * * 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. * * @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-aligned */ formatGroupCaption: exontrol.DrawTextFormatEnum.exTextAlignCenter | exontrol.DrawTextFormatEnum.exTextAlignVCenter | exontrol.DrawTextFormatEnum.exTextWordEllipsis, /** * @description The dragAlpha field specifies the transparency to display the source-event being dragged (while dragAlphaNegate option is false). * @type {number} * @example: * * null {null} or 1 {number}, the field is ignored, so the source-event being dragged is shown unchanged * 0 {number}, hides the source-event being dragged (fully transparent) * 0.5 {number}, the source-event being dragged is shown semi-transparent */ dragAlpha: 0.5, /** * @description The dragAlphaNegate field indicates that the dragAlpha transparency is applied to any other than source-event. * @type {boolean} * @example: * * false {boolean}, the dragAlpha transparency is applied to source-event only * true {boolean}, the dragAlpha transparency is applied to any other than source-event */ dragAlphaNegate: false, /** * @description The dragDummyAlpha field specifies the transparency to display the dummy-event being dragged. The dummy-event is moved during drag and drop. * @type {number} * @example: * * null {null} or 1 {number}, the field is ignored, so the dummy-event being dragged is shown unchanged * 0 {number}, hides the dummy-event being dragged (fully transparent) * 0.5 {number}, the dummy-event being dragged is shown semi-transparent */ dragDummyAlpha: 1, /** * @description The allowEmptyEvents field specifies whether the user can create empty events by drag and drop. The allowEmptyEvents field can be one of the following: * * {number} * 0 {number}, permits empty events or events with duration 0 (start and end are equals) * positive {number}, specifies how many minorTimeRuler defines the minimum duration * negative {number}, that indicates the number of miliseconds (absolute value) * * {string} indicates the hours and minutes in "hh:mm" format * * @type {number|string} * @example: * * 0 {number}, the user can create empty events * 1 {number}, the mimimum duration for events being created or resized is specified by minorTimeRuler option of the time-scale. For instance, if the minor time-scale are displayed from 15 to 15 minutes, the mimimum duration is 15 minutes * 2 {number}, the mimimum duration for events being created or resized is minorTimeRuler option of the time-scale multiplied by 2. For instance, if the minor time-scale are displayed from 15 to 15 minutes, the mimimum duration is 30 minutes * -5 * 1000 or -5 * exontrol.mssec {number}, defines 5 seconds * -5 * 60 * 1000 or -5 * exontrol.msmin {number}, defines 5 minutes * -5 * 60 * 60 * 1000 or -5 * exontrol.mshour {number}, defines 5 hours * -5 * 24 * 60 * 60 * 1000 or -5 * exontrol.msday {number}, defines 5 days * "1:30" {string}, indicates 1 hour and 30 minutes */ allowEmptyEvents: 1, /** * @description The formatEventShortLabel field specifies the format and alignment to display the event's short-label. A combination of one or more exontrol.DrawTextFormatEnum flags that defines the format to show the event's short-label. * @type {exontrol.DrawTextFormatEnum} * * 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. * * @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-aligned */ formatEventShortLabel: exontrol.DrawTextFormatEnum.exTextSingleLine | exontrol.DrawTextFormatEnum.exTextWordEllipsis, /** * @description The formatEventLongLabel field specifies the format and alignment to display the event's long-label. A combination of one or more exontrol.DrawTextFormatEnum flags that defines the format to show the event's long-label. * @type {exontrol.DrawTextFormatEnum} * * 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. * * @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-aligned */ formatEventLongLabel: exontrol.DrawTextFormatEnum.exTextWordBreak, /** * @description The formatEventExtraLabel field specifies the format and alignment to display the event's extra-label. A combination of one or more exontrol.DrawTextFormatEnum flags that defines the format to show the event's extra-label. * @type {exontrol.DrawTextFormatEnum} * * 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. * * @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-aligned */ formatEventExtraLabel: exontrol.DrawTextFormatEnum.exTextAlignBottom | exontrol.DrawTextFormatEnum.exTextSingleLine | exontrol.DrawTextFormatEnum.exTextEndEllipsis, /** * @description The formatCreateEventLabel field specifies the format and alignment to display the event's label while user creates it by drag and drop. A combination of one or more exontrol.DrawTextFormatEnum flags that defines the format to show the event's label event's label while user creates it by drag and drop. * @type {exontrol.DrawTextFormatEnum} * * 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. * * @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-aligned */ formatCreateEventLabel: exontrol.DrawTextFormatEnum.exTextWordBreak | exontrol.DrawTextFormatEnum.exTextNoClip, /** * @description The formatUpdateEventLabel field specifies the format and alignment to display the event's label while user moves or resizes it by drag and drop. A combination of one or more exontrol.DrawTextFormatEnum flags that defines the format to show the event's label event's label while user creates it by drag and drop. * @type {exontrol.DrawTextFormatEnum} * * 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. * * @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-aligned */ formatUpdateEventLabel: exontrol.DrawTextFormatEnum.exTextWordBreak | exontrol.DrawTextFormatEnum.exTextNoClip, /** * @description The eventDisplayMarginsSep field indicates the separator character(s) between start and end date-times * @type {string} * @example: * * " - " {string}, defines " - " the separator character(s) between start and end date-times */ eventDisplayMarginsSep: " - ", /** * @description The formatMarkZoneCaption field specifies the format and alignment to display the mark-zone's caption. A combination of one or more exontrol.DrawTextFormatEnum flags that defines the format to show the mark-zone's caption. * @type {exontrol.DrawTextFormatEnum} * * 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. * * @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-aligned */ formatMarkZoneCaption: exontrol.DrawTextFormatEnum.exTextAlignCenter | exontrol.DrawTextFormatEnum.exTextAlignVCenter | exontrol.DrawTextFormatEnum.exTextWordBreak | exontrol.DrawTextFormatEnum.exTextWordEllipsis, /** * @description The arrangeEventsOnDrag field indicates whether the control re-arranges the events during the drag and drop * @type {boolean} * @example * * false {boolean}, no event gets arranged during the drag and drop * true {boolean}, the events get arranged during the drag and drop */ arrangeEventsOnDrag: false, /** * @description The dragStartOnMove field specifies the drag-operations (create, resize or move) that start once the pointer is moved. The dragStartOnMove field can be a combination of zero, one or more of the following values: * * 1 {number}, create a new event by drag and drop * 2 {number}, resize one or more events by drag and drop * 4 {number}, move one or more events by drag and drop * * @type {number} * @example * * 0 {number}, any drag-operation (create, resize or move) begins once the user clicks the view, without initially dragging the pointer * -1 {number}, any drag-operation (create, resize or move) begins once the user clicks and drags the pointer * 1 {number}, a new event is created once the user clicks and drags the pointer (prevents creating a new event once the user clicks the control without dragging/moving the mouse/pointer) * 6 {number}, the move or resize drag-operation begins once the user clicks and drags the pointer */ dragStartOnMove: 1, /** * @description The ensureVisibleOnDrag field specifies the drag-operations (create, resize or move) that calls the EnsureVisibleClient() method once the drag-operation ends. The EnsureVisibleClient() method scrolls the control's content to ensure that the event fits the view's client-area. The ensureVisibleOnDrag field can be a combination of zero, one or more of the following values: * * 1 {number}, create a new event by drag and drop * 2 {number}, resize one or more events by drag and drop * 4 {number}, move one or more events by drag and drop * * @type {number} * @example * * 0 {number}, no EnsureVisibleClient() method is called once any drag-operation (create, resize or move) ends * -1 {number}, the EnsureVisibleClient() method is called for any drag and drop operation (create, resize or move) * 1 {number}, the EnsureVisibleClient() method is called only if the user creates new events by drag and drop * 6 {number}, the EnsureVisibleClient() method is called only if the user moves or resizes events by drag and drop */ ensureVisibleOnDrag: -1 }, /** * @description The background object defines display options to show different parts of the control. * @type {BackgroundOptions} */ background: { /** * @description The majorTimeRulerColor field specifies the color of the major ruler line, within the schedule panel. * @type {string} * @example: * * null {null} hides the lines * "red" {string} shows the ruler in red */ majorTimeRulerColor: "#C0C0C0", /** * @description The majorTimeRulerStyle field specifies the style of the major ruler line, within the schedule panel * @type {any} * @example: * * null {null}, defines a solid line * [] {array}, indicates a solid line * 2 {number}, will become [2, 2, ...] * [5, 15, 25] {array}, will become [5, 15, 25, 5, 15, 25, ...] * */ majorTimeRulerStyle: 1, /** * @description The timeScaleMajorTimeRulerColor field specifies the color of the timeScaleMajor ruler line, within the time-scale panel. * @type {string} * @example: * * null {null} hides the lines * "red" {string} shows the ruler in red */ timeScaleMajorTimeRulerColor: "#C0C0C0", /** * @description The timeScaleMajorTimeRulerStyle field specifies the style of the timeScaleMajor ruler line, within the time-scale panel * @type {any} * @example: * * null {null}, defines a solid line * [] {array}, indicates a solid line * 2 {number}, will become [2, 2, ...] * [5, 15, 25] {array}, will become [5, 15, 25, 5, 15, 25, ...] * */ timeScaleMajorTimeRulerStyle: 1, /** * @description The minorTimeRulerColor field specifies the color of the minor ruler line, within the schedule panel. * @type {string} * @example: * * null {null} hides the lines * "red" {string} shows the ruler in red */ minorTimeRulerColor: null, /** * @description The minorTimeRulerStyle field specifies the style of the minor ruler line, within the schedule panel * @type {any} * @example: * * null {null}, defines a solid line * [] {array}, indicates a solid line * 2 {number}, will become [2, 2, ...] * [5, 15, 25] {array}, will become [5, 15, 25, 5, 15, 25, ...] * */ minorTimeRulerStyle: null, /** * @description The timeScaleMinorTimeRulerColor field specifies the color of the timeScaleMinor ruler line, within the time-scale panel. * @type {string} * @example: * * null {null} hides the lines * "red" {string} shows the ruler in red */ timeScaleMinorTimeRulerColor: "#C0C0C0", /** * @description The timeScaleMinorTimeRulerStyle field specifies the style of the timeScaleMinor ruler line, within the time-scale panel * @type {any} * @example: * * null {null}, defines a solid line * [] {array}, indicates a solid line * 2 {number}, will become [2, 2, ...] * [5, 15, 25] {array}, will become [5, 15, 25, 5, 15, 25, ...] * */ timeScaleMinorTimeRulerStyle: 1, /** * @description The groupingButtonCaption field specifies the caption of the header's grouping-button * @type {string} * @example: * * null {null}, show the horizontal ellipsis (three horizontal dots) * "" {string}, hides the caption for all grouping-buttons * "+" {string}, displays '+' character for all grouping-buttons * */ groupingButtonCaption: "…"/*horizontal ellipsis*/, /** * @description The eventContinueDay field specifies the up/down/keft/right arrow's color when event continues on previously or next day (multi-dates event), single-date event starts before time-scale's start time, ends after time-scale's end time * @type {string} * @example: * * null {null} or "transparent" {string} hides the event's up/down arrow(s) * "red" {string} shows the event's up/down arrow(s) in red */ eventContinueDay: "black", } } /////////////////////////////////////////////////////////// (exontrol.Schedule.Groups) // // The Groups object holds a collection of Group type (group of events) // // The Groups object provides the following methods: // // Add(oGroupOpts) {Group}, creates and adds a new group into the control // Count/GetCount() {number}, returns the number of groups within the collection. // Group(id) {Group}, gets the group giving its index, identifier or reference // Remove(id), removes the group giving its index, identifier or reference // Clear(), removes all groups of the control // /////////////////////////////////////////////////////////// /////////////////////////////////////////////////////////// (exontrol.Schedule.Group) // // The Group object holds group objects of the control. The Add(oGroupOpts) method of exontrol.Schedule.Groups object creates and adds a new group into the control. // // The Group object provides the following methods: // // Remove(), removes the group itself from groups collection ( equivalent of Groups.Remove(id) method ) // Options/GetOptions()/SetOptions(value) {exontrol.Schedule.GroupOptions}, indicates the group's options (at once) such as visibility, position and so on // Index/GetIndex() {number}, returns the index of the group (0-based) // Caption/GetCaption()/SetCaption(value) {string}, defines the caption of the group (the group's header displays its caption) // Title/GetTitle()/SetTitle(value) {string}, defines the title of the group (the group's title defines the caption of the group within the groups list, visible once the user clicks the drop down grouping button) // ID/GetID()/SetID(value) {any}, specifies the group's identifier (the Groups.Group(id) requests a group by its index, identifier or reference) // Visible/GetVisible()/SetVisible(value) {boolean}, shows or hides the group // HeaderShape/GetHeaderShape()/SetHeaderShape(value) {any}, defines the shape for the group's header // EventShape/GetEventShape()/SetEventShape(value) {any}, defines the shape to apply on events of the same group // Position/GetPosition()/SetPosition(value) {number}, specifies the group's position (0-based) // Width/GetWidth()/SetWidth(value) {number}, specifies the group's width // /////////////////////////////////////////////////////////// /////////////////////////////////////////////////////////// (exontrol.Schedule.GroupOptions) // // The GroupOptions type holds all options a group can display or own // // The GroupOptions type defines the following fields: // // caption {string}, defines the caption of the group (the group's header displays its caption) // title {string}, defines the title of the group (the group's title defines the caption of the group within the groups list, visible once the user clicks the drop down grouping button) // visible {boolean}, indicates whether the group is visible or hidden // id {any}, specifies the identifier of the group // headerShape {any}, defines the shape for the group's header // eventShape {any}, defines the shape to apply on events of the same group // position {number}, indicates the position of the group // width {number}, specifies the width of the group // /////////////////////////////////////////////////////////// exontrol.Schedule.GroupOptions = { /** * @description The caption field defines the caption of the group (the group's header displays its caption). * @type {string} * * @example * * null {null}, resets the caption of the group * "caption" {string}, defines the plain-caption for the group * */ caption: null, /** * @description The title field defines the title of the group (the group's title defines the caption of the group within the groups list, visible once the user clicks the drop down grouping button). * @type {string} * * @example * * null {null}, indicates that that group's caption is also the group's title * "" {string}, shows no title for the group * "title" {string}, defines the plain-title for the group * */ title: null, /** * @description The visible field indicates whether the group is visible or hidden. * @type {boolean} * @example * * false {boolean}, hides the group * true {boolean}, shows the group */ visible: true, /** * @description The id field specifies the group's unique identifier. * @type {any} * @example * * "G1" {number}, defines the group with the identifier (G1). You can use the oSchedule.Group("G1") method to request the group giving its identifier. */ id: null, /** * @description The headerShape field defines the shape for the group's header. * * The headerShape field can be any of the following: *
    *
  • the shape's name within the exontrol.Shape.Schedule or exontrol.Shape namespace *
  • a CSS color *
  • a JSON string-representation of an object of exontrol.Def.Shape type, for the group itself *
  • an object of {normal,hover,click,disabled} type. The normal, hover, click and disabled are objects of exontrol.Def.Shape type *
* * @type {any} * @example * * null {null}, no custom shape is applied (default object's shape may be applied) * "" {string}, no custom shape is applied (no default object's shape is be applied) * "red" {string}, fills the object's background in red (CSS color) * '{"fillColor": "red"}' or '{"normal":{"fillColor": "red"}}' {string}, fills the object's background in red (JSON-representation of an object of exontrol.Def.Shape type) * "xxx" {string}, indicates that exontrol.Shapes.Schedule.xxx or exontrol.Shapes.xxx is applied on the object's background. If the xxx field is missing, no custom shape is applied (no default object's shape is be applied) * exontrol.Shapes.Button {object}, applies the "Button" shape on the object as defined into exontrol.Shapes namespace */ headerShape: null, /** * @description The eventShape field defines the shape to apply on events of the same group. * * The eventShape field can be any of the following: *
    *
  • the shape's name within the exontrol.Shape.Schedule or exontrol.Shape namespace *
  • a CSS color *
  • a JSON string-representation of an object of exontrol.Def.Shape type, for the group itself *
  • an object of {normal,hover,click,disabled} type. The normal, hover, click and disabled are objects of exontrol.Def.Shape type *
* * @type {any} * @example * * null {null}, no custom shape is applied (default object's shape may be applied) * "" {string}, no custom shape is applied (no default object's shape is be applied) * "red" {string}, fills the object's background in red (CSS color) * '{"fillColor": "red"}' or '{"normal":{"fillColor": "red"}}' {string}, fills the object's background in red (JSON-representation of an object of exontrol.Def.Shape type) * "xxx" {string}, indicates that exontrol.Shapes.Schedule.xxx or exontrol.Shapes.xxx is applied on the object's background. If the xxx field is missing, no custom shape is applied (no default object's shape is be applied) * exontrol.Shapes.Button {object}, applies the "Button" shape on the object as defined into exontrol.Shapes namespace */ eventShape: null, /** * @description The position field specifies the group's position. * @type {number} * @example * * null {null}, the null value has no effect * 0 {number}, moves the group on the first position */ position: null, /** * @description The width field specifies the group's width. * @type {number} * @example * * -1 {number} or null {null}, all groups with width on null are shown equaly * 128 {number}, defines the width of 128px */ width: null, }; /////////////////////////////////////////////////////////// (exontrol.Schedule.MarkZones) // // The MarkZones object holds a collection of MarkZone type (mark-zone of the control) // // The MarkZones object provides the following methods: // // Add(oMarkZoneOpts) {MarkZone}, creates and adds a new mark-zone into the control // Count/GetCount() {number}, returns the number of mark-zones within the collection. // MarkZone(id) {MarkZone}, gets the mark-zone giving its index, identifier/key or reference // Remove(id), removes the mark-zone giving its index, identifier/key or reference // Clear(), removes all mark-zones of the control // /////////////////////////////////////////////////////////// /////////////////////////////////////////////////////////// (exontrol.Schedule.MarkZone) // // The MarkZone object holds mark-zone objects of the control. The Add(oMarkZoneOpts) method of exontrol.Schedule.MarkZones object creates and adds a new mark-zone into the control. // // The MarkZone object provides the following methods: // // Options/GetOptions()/SetOptions(value) {exontrol.Schedule.MarkZoneOptions}, indicates the mark-zone's options (at once) such as visibility, position and so on // Index/GetIndex() {number}, returns the index of the mark-zone (0-based) // Start/GetStart()/SetStart(value) {any}, indicates the date/time when the mark-zone begins // End/GetEnd()/SetEnd(value) {any}, indicates the date/time when the mark-zone ends // Time/GetTime()/SetTime(value) {any}, specifies the date/time of the mark-zone (simulates a timer, so start, end and time are identhical) // GroupID/GetGroupID()/SetGroupID(value) {any}, specifies the identifier of the group where the MarkZone object belongs // Caption/GetCaption()/SetCaption(value) {any[]}, defines the caption of the mark-zone // Key/GetKey()/SetKey(value) {any}, specifies the mark-zone's key (the MarkZones.MarkZone(key) requests a mark-zone by its index, identifier/key or reference) // Visible/GetVisible()/SetVisible(value) {boolean}, shows or hides the mark-zone // Shape/GetShape()/SetShape(value) {any}, the shape for the mark-zone. // Repetitive/GetRepetitive()/SetRepetitive(value) {string}, returns or sets the expression to define the repetitive-mark-zone // ShortLabel/GetShortLabel()/SetShortLabel(value) {string}, defines the mark-zone's short-label // LongLabel/GetLongLabel()/SetLongLabel(value) {string}, defines the mark-zone's long-label (visible while it fits the mark-zone's body, else the mark-zone's short-label is displayed) // EventShape/GetEventShape()/SetEventShape(value) {any}, defines the shape to apply on events that intersect the current mark-zone // TimeScaleShape/GetTimeScaleShape()/SetTimeScaleShape(value) {any}, defines the shape for the mark-zone (applied on the time-scale only) // // Also, the exontrol.Schedule.MarkZone object provides the following methods: // // Remove(), removes the mark-zone from mark-zones collection ( equivalent of MarkZones.Remove(id) method ) // /////////////////////////////////////////////////////////// exontrol.Schedule.MarkZoneOptions = { /** * @description The start field indicates the date/time when the mark-zone begins. The start field can be any of the following: *
    *
  • {null} or {undefined}, indicates the current date and time (equivalent of Date.Now()) *
  • {number}, indicates the Jan 1st of the year, such as "Jan 1st 2001" for 2001 *
  • {string}, defines the date in string-format as "#MM/DD/YYYY[ HH:mm:ss]#", such as "#10/10/2011 14:48#" or string-format as "YYYY-MM-DDTHH:mm:ss.sssZ" (ISO 8601), such as "2011-10-10" (date-only format), "2011-10-10T14:48:00" (local date-time format), "2011-10-10T14:48:00Z" (UTC date-time format), or "2011-10-10T14:48:00.000+09:00" (date-time format with milliseconds and time zone offset) *
  • {Date}, indicates a javascript Date to be copied, such as "Wed, 25 Mar 2015 15:00:00 GMT" for new Date("2015-03-25T15:00:00Z") *
* @type {any} * * @example * * null {null}, is equivalent of Date.Now() * 2001 {number}, is equivalent of Mon, 01 Jan 2001 00:00:00 GMT * "#12/31/1971 13:00#" {string}, is equivalent of Fri, 31 Dec 1971 13:00:00 GMT * new Date("2015-03-25T15:00:00Z"), is equivalent of Wed, 25 Mar 2015 15:00:00 GMT */ start: null, /** * @description The end field indicates the date/time when the mark-zone ends. The end field can be any of the following: *
    *
  • {null} or {undefined}, indicates the current date and time (equivalent of Date.Now()) *
  • {number}, indicates the Jan 1st of the year, such as "Jan 1st 2001" for 2001 *
  • {string}, defines the date in string-format as "#MM/DD/YYYY[ HH:mm:ss]#", such as "#10/10/2011 14:48#" or string-format as "YYYY-MM-DDTHH:mm:ss.sssZ" (ISO 8601), such as "2011-10-10" (date-only format), "2011-10-10T14:48:00" (local date-time format), "2011-10-10T14:48:00Z" (UTC date-time format), or "2011-10-10T14:48:00.000+09:00" (date-time format with milliseconds and time zone offset) *
  • {Date}, indicates a javascript Date to be copied, such as "Wed, 25 Mar 2015 15:00:00 GMT" for new Date("2015-03-25T15:00:00Z") *
* @type {any} * * @example * * null {null}, is equivalent of Date.Now() * 2001 {number}, is equivalent of Mon, 01 Jan 2001 00:00:00 GMT * "#12/31/1971 13:00#" {string}, is equivalent of Fri, 31 Dec 1971 13:00:00 GMT * new Date("2015-03-25T15:00:00Z"), is equivalent of Wed, 25 Mar 2015 15:00:00 GMT */ end: null, /** * @description The time field indicates the date/time of the mark-zone (simulates a timer, so time, end and time are identhical) *
    *
  • {null} or {undefined}, indicates the current date and time (equivalent of Date.Now()) *
  • {number}, indicates the Jan 1st of the year, such as "Jan 1st 2001" for 2001 *
  • {string}, defines the date in string-format as "#MM/DD/YYYY[ HH:mm:ss]#", such as "#10/10/2011 14:48#" or string-format as "YYYY-MM-DDTHH:mm:ss.sssZ" (ISO 8601), such as "2011-10-10" (date-only format), "2011-10-10T14:48:00" (local date-time format), "2011-10-10T14:48:00Z" (UTC date-time format), or "2011-10-10T14:48:00.000+09:00" (date-time format with milliseconds and time zone offset) *
  • {Date}, indicates a javascript Date to be copied, such as "Wed, 25 Mar 2015 15:00:00 GMT" for new Date("2015-03-25T15:00:00Z") *
* @type {any} * * @example * * null {null}, is equivalent of Date.Now() * 2001 {number}, is equivalent of Mon, 01 Jan 2001 00:00:00 GMT * "#12/31/1971 13:00#" {string}, is equivalent of Fri, 31 Dec 1971 13:00:00 GMT * new Date("2015-03-25T15:00:00Z"), is equivalent of Wed, 25 Mar 2015 15:00:00 GMT */ time: null, /** * @description The groupID field specifies the identifier of the group where the MarkZone object belongs * @type {any} * * @example * * null {null}, no group is associated with the mark-zone * 0 {number}, the mark-zone is associated with the group index 0 (0-based) * "G1" {string}, the mark-zone is associated with the group of identifier "G1" */ groupID: null, /** * @description The caption field defines the caption of the mark-zone. * @type {any} * * @example * * null {null}, resets the caption of the mark-zone * "caption" {string}, defines the plain-caption for the mark-zone * */ caption: undefined, /** * @description The visible field indicates whether the mark-zone is visible or hidden. * @type {boolean} * @example * * false {boolean}, hides the mark-zone * true {boolean}, shows the mark-zone */ visible: null, /** * @description The key field specifies the key associated with the mark-zone. * @type {string} * @example * * "logo" {string}, defines the mark-zone with the giving key (logo). You can use the oSchedule.MarkZone("logo") method to request the mark-zone giving its key. */ key: null, /** * @description The shape field defines the shape for the mark-zone (applied on the schedule view only). * * The shape field can be any of the following: *
    *
  • the shape's name within the exontrol.Shape.Schedule or exontrol.Shape namespace *
  • a CSS color *
  • a JSON string-representation of an object of exontrol.Def.Shape type, for the mark-zone *
  • an object of {normal,hover,click,disabled} type. The normal, hover, click and disabled are objects of exontrol.Def.Shape type *
* * @type {any} * @example * * null {null}, no custom shape is applied (default object's shape may be applied) * "" {string}, no custom shape is applied (no default object's shape is be applied) * "red" {string}, fills the object's background in red (CSS color) * '{"fillColor": "red"}' or '{"normal":{"fillColor": "red"}}' {string}, fills the object's background in red (JSON-representation of an object of exontrol.Def.Shape type) * "xxx" {string}, indicates that exontrol.Shapes.Schedule.xxx or exontrol.Shapes.xxx is applied on the object's background. If the xxx field is missing, no custom shape is applied (no default object's shape is be applied) * exontrol.Shapes.Button {object}, applies the "Button" shape on the object as defined into exontrol.Shapes namespace */ shape: null, /** * @description The repetitive field indicates the expression to define the repetitive-mark-zone. If You specify a not empty and valid formula for the Repetitive property, the time part of the Start and End properties determines the time to start and end the repetitive mark-zone. The date part is determined by the Repetitive expression. * @type {string} * @example * * "" {string} or null {null}, the event is not repetitive (no effect) * "0" {string}, no occurrence * "1" {string}, the event occurs every day * "weekday(value) = 1" {string}, the event occurs every Monday * "weekday(value) in (1,2) and month(value) = 6", the event occurs every Monday and Tuesday, on June only * "value in (#6/8/2012#,#6/11/2012#,#6/20/2012#)", the event occurs on 6/8/2012, 6/11/2012 and 6/20/2012 * "value >= #6/1/2012# and ( (value - #6/1/2012#)/86400000 mod 5 = 0)", the event starts on 6/1/2012, and shows up every 5 days * */ repetitive: null, /** * @description The eventShape field defines the shape to apply on events that intersect the current mark-zone. * * The eventShape field can be any of the following: *
    *
  • the shape's name within the exontrol.Shape.Schedule or exontrol.Shape namespace *
  • a CSS color *
  • a JSON string-representation of an object of exontrol.Def.Shape type, for the group itself *
  • an object of {normal,hover,click,disabled} type. The normal, hover, click and disabled are objects of exontrol.Def.Shape type *
* * @type {any} * @example * * null {null}, no custom shape is applied (default object's shape may be applied) * "" {string}, no custom shape is applied (no default object's shape is be applied) * "red" {string}, fills the object's background in red (CSS color) * '{"fillColor": "red"}' or '{"normal":{"fillColor": "red"}}' {string}, fills the object's background in red (JSON-representation of an object of exontrol.Def.Shape type) * "xxx" {string}, indicates that exontrol.Shapes.Schedule.xxx or exontrol.Shapes.xxx is applied on the object's background. If the xxx field is missing, no custom shape is applied (no default object's shape is be applied) * exontrol.Shapes.Button {object}, applies the "Button" shape on the object as defined into exontrol.Shapes namespace */ eventShape: null, /** * @description The timeScaleShape field defines the shape for the mark-zone (applied on the time-scale only). * * The timeScaleShape field can be any of the following: *
    *
  • the shape's name within the exontrol.Shape.Schedule or exontrol.Shape namespace *
  • a CSS color *
  • a JSON string-representation of an object of exontrol.Def.Shape type, for the mark-zone *
  • an object of {normal,hover,click,disabled} type. The normal, hover, click and disabled are objects of exontrol.Def.Shape type *
* * @type {any} * @example * * null {null}, no custom shape is applied (default object's shape may be applied) * "" {string}, no custom shape is applied (no default object's shape is be applied) * "red" {string}, fills the object's background in red (CSS color) * '{"fillColor": "red"}' or '{"normal":{"fillColor": "red"}}' {string}, fills the object's background in red (JSON-representation of an object of exontrol.Def.Shape type) * "xxx" {string}, indicates that exontrol.Shapes.Schedule.xxx or exontrol.Shapes.xxx is applied on the object's background. If the xxx field is missing, no custom shape is applied (no default object's shape is be applied) * exontrol.Shapes.Button {object}, applies the "Button" shape on the object as defined into exontrol.Shapes namespace */ timeScaleShape: null, }; /////////////////////////////////////////////////////////// (exontrol.Schedule.Events) // // The exontrol.Schedule.Events object holds a collection of exontrol.Schedule.Event type (event of the control) // // The exontrol.Schedule.Events object provides the following methods: // // Add(oEventOpts) or Add(start,end) {exontrol.Schedule.Event}, creates and adds a new event into the control // Count/GetCount() {number}, returns the number of events within the collection. // Item(id) {exontrol.Schedule.Event}, gets the event giving its index, identifier/key or reference // Remove(id), removes the event giving its index, identifier/key or reference // Clear(), removes all events of the control // /////////////////////////////////////////////////////////// /////////////////////////////////////////////////////////// (exontrol.Schedule.Event) // // The exontrol.Schedule.Event object holds information(options) about an event within the control. // // The exontrol.Schedule.Event object provides the following methods: // // Options/GetOptions()/SetOptions(value) {exontrol.Schedule.EventOptions}, indicates the event's options (at once) such as visibility, position and so on // Index/GetIndex() {number}, returns the index of the event (0-based) // Start/GetStart()/SetStart(value) {any}, indicates the date/time when the event or the appointment begins // End/GetEnd()/SetEnd(value) {any}, indicates the date/time when the event or the appointment ends // Duration/GetDuration()/SetDuration(value) {number}, specifies the duration of the event (in ms). // GroupID/GetGroupID()/SetGroupID(value) {any}, specifies the identifier of the group where the Event object belongs // Caption/GetCaption()/SetCaption(value) {string}, defines the caption of the event // Key/GetKey()/SetKey(value) {any}, specifies the event's key (the Events.Item(key) requests an event by its index, identifier/key or reference) // Visible/GetVisible()/SetVisible(value) {boolean}, shows or hides the event // Enabled/GetEnabled()/SetEnabled(value) {boolean}, enables or disables the event // Shape/GetShape()/SetShape(value) {any}, the shape for the event. // Cursor/GetCursor()/SetCursor(value) {string}, the mouse cursor for the event. // Selectable/GetSelectable()/SetSelectable(value) {boolean}, specifies whether the event is selectable // Selected/GetSelected()/SetSelected(value) {boolean}, specifies whether the event is selected or unselected // Repetitive/GetRepetitive()/SetRepetitive(value) {string}, returns or sets the expression to define the repetitive-event // ToolTip/GetToolTip()/SetToolTip(value) {string}, defines the event's predefined tooltip // Movable/GetMovable()/SetMovable(value) {boolean}, specifies whether the user can move the event by drag and drop // Resizable/GetResizable()/SetResizable(value) {exontrol.Schedule.EventResizableEnum}, specifies whether the user can resizes the event at runtime // AllDay/GetAllDay()/SetAllDay(value) {boolean}, indicates an all-day event event. The time is ignored for all-day events // UserData/GetUserData()/SetUserData(value) {any}, associates any extra-data with the event // ShortLabel/GetShortLabel()/SetShortLabel(value) {string}, defines the event's short-label // LongLabel/GetLongLabel()/SetLongLabel(value) {string}, defines the event's long-label (visible while it fits the event's body, else the event's short-label is displayed) // ExtraLabel/GetExtraLabel()/SetExtraLabel(value) {string}, defines the event's extra-label // // Also, the exontrol.Schedule.Event object provides the following methods: // // Remove(), removes the event from events collection ( equivalent of Events.Remove(id) method ) // MoveBy(value), moves the event by specified time // GetKnownProperty(index)/SetKnownProperty(index, value) {any}, gets or sets the value for the Event's property giving its identifier. // EnsureVisible(), scrolls the view so the event (calendar appointment) fits the control's visible-area // /////////////////////////////////////////////////////////// /////////////////////////////////////////////////////////// (exontrol.Schedule.EventOptions) // // The exontrol.Schedule.EventOptions type holds all options an event can display or own // // The exontrol.Schedule.EventOptions type defines the following fields: // // start {any}, indicates the date/time when the event or the appointment begins // end {any}, indicates the date/time when the event or the appointment ends // duration {number|string}, specifies the event's duration in days (or hours, minutes, seconds if including the decimal point, for instance 0.5 indicates a 12 hours lenght) // groupID {any}, specifies the identifier of the group where the Event object belongs // caption {any}, defines the event's caption // visible {boolean}, indicates whether the event is visible or hidden // enabled {boolean}, indicates whether the event is enabled or disabled // key {string}, specifies the key associated with the event // shape {any}, defines the shape for the event // cursor {string}, defines the mouse-cursor for the event // selectable {boolean}, specifies whether the event is selectable // selected {boolean}, specifies whether the event is selected or unselected // repetitive {string}, returns or sets the expression to define the repetitive-event // toolTip {string}, defines the event's predefined tooltip // movable {boolean}, specifies whether the user can move the event by drag and drop // resizable {exontrol.Schedule.EventResizableEnum}, specifies whether the user can resizes the event at runtime // allDay {boolean}, indicates an all-day event event. The time is ignored for all-day events // userData {any}, associates any extra-data with the event // shortLabel {string}, defines the event's short-label // longLabel {string}, defines the event's long-label (visible while it fits the event's body, else the event's short-label is displayed) // extraLabel {string}, specifies an extra HTML label, to be displayed on the event's body // /////////////////////////////////////////////////////////// exontrol.Schedule.EventOptions = { /** * @description The start field indicates the date/time when the event or the appointment begins. The start field can be any of the following: * * {null} or {undefined}, indicates the current date and time (equivalent of Date.Now()) * {number}, indicates the Jan 1st of the year, such as "Jan 1st 2001" for 2001 * {string}, defines the date in string-format as "#MM/DD/YYYY[ HH:mm:ss]#", such as "#10/10/2011 14:48#" or string-format as "YYYY-MM-DDTHH:mm:ss.sssZ" (ISO 8601), such as "2011-10-10" (date-only format), "2011-10-10T14:48:00" (local date-time format), "2011-10-10T14:48:00Z" (UTC date-time format), or "2011-10-10T14:48:00.000+09:00" (date-time format with milliseconds and time zone offset) * {Date}, indicates a javascript Date to be copied, such as "Wed, 25 Mar 2015 15:00:00 GMT" for new Date("2015-03-25T15:00:00Z") * * @type {any} * * @example * * null {null}, is equivalent of Date.Now() * 2001 {number}, is equivalent of Mon, 01 Jan 2001 00:00:00 GMT * "#12/31/1971 13:00#" {string}, is equivalent of Fri, 31 Dec 1971 13:00:00 GMT * new Date("2015-03-25T15:00:00Z"), is equivalent of Wed, 25 Mar 2015 15:00:00 GMT */ start: null, /** * @description The end field indicates the date/time when the event or the appointment ends. The end field can be any of the following: * * {null} or {undefined}, indicates the current date and time (equivalent of Date.Now()) * {number}, indicates the Jan 1st of the year, such as "Jan 1st 2001" for 2001 * {string}, defines the date in string-format as "#MM/DD/YYYY[ HH:mm:ss]#", such as "#10/10/2011 14:48#" or string-format as "YYYY-MM-DDTHH:mm:ss.sssZ" (ISO 8601), such as "2011-10-10" (date-only format), "2011-10-10T14:48:00" (local date-time format), "2011-10-10T14:48:00Z" (UTC date-time format), or "2011-10-10T14:48:00.000+09:00" (date-time format with milliseconds and time zone offset) * {Date}, indicates a javascript Date to be copied, such as "Wed, 25 Mar 2015 15:00:00 GMT" for new Date("2015-03-25T15:00:00Z") * * @type {any} * * @example * * null {null}, is equivalent of Date.Now() * 2001 {number}, is equivalent of Mon, 01 Jan 2001 00:00:00 GMT * "#12/31/1971 13:00#" {string}, is equivalent of Fri, 31 Dec 1971 13:00:00 GMT * new Date("2015-03-25T15:00:00Z"), is equivalent of Wed, 25 Mar 2015 15:00:00 GMT */ end: null, /** * @description The duration field specifies the event's duration in days (or hours, minutes, seconds if including the decimal point, for instance 0.5 indicates a 12 hours lenght). The duration field can be any of the following: * * {number}, indicates a numeric expression that defines the event's duration in days. The duration field can be one of the following: * * 0 {number}, specifies that the start and end margins of the event are identichal * positive {number}, specifies that the end margin of the event is changed as end = start + duration * negative {number}, specifies that the start margin of the event is changed as start = end + duration * * {string}, specifes the hours and minutes in "[-]hh:mm" format * * @type {number|string} * * @example * * 1 {number}, defines a 1-day event (changes the end-margin of the event) * 12/24 or 0.5 {number}, defines a 12 hours event (changes the end-margin of the event) * -12/24 or -0.5 {number}, defines a 12 hours event (changes the start-margin of the event) * "4:30" {number}, defines the event's duration to 4 hours and 30 minutes (changes the end-margin of the event) * "-4:30" {number}, defines the event's duration to 4 hours and 30 minutes (changes the start-margin of the event) */ duration: null, /** * @description The groupID field specifies the identifier of the group where the Event object belongs * @type {any} * * @example * * null {null}, no group is associated with the event * 0 {number}, the event is associated with the group index 0 (0-based) * "G1" {string}, the event is associated with the group of identifier "G1" */ groupID: null, /** * @description The caption field defines the caption of the event. * @type {any} * * @example * * null {null}, resets the caption of the event * "caption" {string}, defines the plain-caption for the event * */ caption: null, /** * @description The visible field indicates whether the event is visible or hidden. * @type {boolean} * @example * * false {boolean}, hides the event * true {boolean}, shows the event */ visible: true, /** * @description The enabled field indicates whether the event is enabled or disabled * @type {boolean} * @example * * false {boolean}, disables the event * true {boolean}, enables the event */ enabled: true, /** * @description The key field specifies the key associated with the event. * @type {string} * @example * * "logo" {string}, defines the event with the giving key (logo). You can use the oSchedule.Event("logo") method to request the event giving its key. */ key: null, /** * @description The shape field defines the shape for the event. A string expression that defines shape's name within the exontrol.Shape.Schedule or exontrol.Shape namespace, a CSS color, a JSON string-representation of an object of exontrol.Def.Shape type, for the event or an object of {normal,hover,click,disabled} type. The normal,hover,click and disabled are objects of exontrol.Def.Shape type. * @type {any} * @example * * null {null}, no custom shape is applied (default object's shape may be applied) * "" {string}, no custom shape is applied (no default object's shape is be applied) * "red" {string}, fills the object's background in red (CSS color) * '{"fillColor": "red"}' or '{"normal":{"fillColor": "red"}}' {string}, fills the object's background in red (JSON-representation of an object of exontrol.Def.Shape type) * "xxx" {string}, indicates that exontrol.Shapes.Schedule.xxx or exontrol.Shapes.xxx is applied on the object's background. If the xxx field is missing, no custom shape is applied (no default object's shape is be applied) * exontrol.Shapes.Button {object}, applies the "Button" shape on the object as defined into exontrol.Shapes namespace */ shape: null, /** * @description The cursor field defines the mouse-cursor for the event. * @type {string} * @example * * "pointer" {string}, The cursor is a pointer that indicates a link (typically an image of a pointing hand) */ cursor: null, /** * @description The selectable field indicates whether the user can select, resize or move the event * @type {boolean} * @example * * false {boolean}, the event is unselectable * true {boolean}, the event is selectable */ selectable: true, /** * @description The selected field indicates whether the event is selected or unselected * @type {boolean} * @example * * false {boolean}, the event is unselected * true {boolean}, the event is selected */ selected: null, /** * @description The repetitive field indicates the expression to define the repetitive-event. If You specify a not empty and valid formula for the Repetitive property, the time part of the Start and End properties determines the time to start and end the repetitive event. The date part is determined by the Repetitive expression. The Repetitive property supports: 1) Value format, when using the value keyword. For instance, "weekday(value) = 1", the event occurs every Monday or 2) ICalendar format, as described in RFC 5545. For instance, "FREQ=WEEKLY;BYDAY=MO", the event occurs every Monday (requires "exontrol.icalendar.js") * @type {string} * @example * * "" {string} or null {null}, the event is not repetitive (no effect) * "0" {string}, no occurrence * "1" {string}, the event occurs every day * "weekday(value) = 1" {string}, the event occurs every Monday * "weekday(value) in (1,2) and month(value) = 6", the event occurs every Monday and Tuesday, on June only * "value in (#6/8/2012#,#6/11/2012#,#6/20/2012#)", the event occurs on 6/8/2012, 6/11/2012 and 6/20/2012 * "value >= #6/1/2012# and ( (value - #6/1/2012#)/86400000 mod 5 = 0)", the event starts on 6/1/2012, and shows up every 5 days * */ repetitive: null, /** * @description The toolTip field defines the event's predefined tooltip. The event's tooltip is shown once the cursor hovers the event. The toolTip field supports ex-HTML and <%=formula%> tags. The <%=formula%> tag indicates the result of the giving formula. The formula supports value formatting. Inside the formula the %0, %1, ... indicates the value of corresponding property of the event, such as %1 specifies the exEventStartDateTime, %2 exEventEndDateTime, and so on. The known identifiers within the <%=formula%> tag are: * * %1 (exEventStartDateTime) {Date}, indicates the starting date/time of the event. This property gets the Start property of the event. The Start property defines the lower margin of the event, and it includes the date and the time values. The exEventStartDate specifies the DATE value only, while the exEventStartTime includes the TIME value only. For instance, the LabelProperty = "<%=weekday(%1)%>" displays the day of the week where the event starts * %2 (exEventEndDateTime) {Date}, indicates the ending date/time of the event. This property gets or sets the End property of the event. The End property defines the upper margin of the event, and it includes the date and the time values. The exEventEndDate specifies the DATE value only, while the exEventEndTime includes the TIME value only. For instance, the LabelProperty = "<%=weekday(%2)%>" gets the day of the week where the event ends. * %3 (exEventAllDay) {boolean}, indicates if the current event is an all day event. This property is equivalent with the event's AllDay property which indicates if the current event is an all-day event. For instance, the LabelProperty = "<%=%3 ? `All-Day-Event: `: ``%><%=%256%>", displays automatically an "All-Day-Event: " prefix for all-day events. If the event is not an all-day event, the <%=%256%>, or exEventDisplayShortMargins, short margins of the events are displayed. * %4 (exEventGroupID) {any}, specifies the identifier/index of the event's group. The GroupID property of the event indicates the identifier of the group that event belongs to. The exEventGroupLabel property indicates the Caption property of the Group's event. The exEventGroupTitle property indicates the Title property of the Group's event. For instance, the LabelProperty = "<%=%4%>
<%=%256%>" displays on the first line, the group's identifier, and the short margins of the event on the second line. The caption of the label is automatically updated once an event is moved from a group to another. * %5 (exEventCaption) {string}, indicates the caption of the event. The Caption property of the event specifies the custom caption that can be displayed on the label, without having to change the event's label. For instance, the LabelProperty = "<%=%256%>
<%=%5%>" displays on the first line, the event's short margins, while on the second line displays the event's caption. Once you update or edit the event's Caption, the event's body automatically shows the new caption. * %6 (exEventUserData) {any}, indicates the extra data associated with the event. The UserData property of the event indicates an extra data associated with the event. For instance, the LabelProperty = "<%=%256%>
<%=%6%>" displays on the first line, the event's short margins, while on the second line displays the event's user data. Once you update or edit the event's UserData, the event's body automatically shows the new label. * %7 (exEventDuration) {number}, specifies the duration of the event. The returned values is of float type, and it indicates the duration of the event in days. For instance, the 1.5 indicates, 1 day and 12 hours. For instance, the LabelProperty = "<%=%256%>
<%=((1:=int(0:= (date(%2)-date(%1)))) != 0 ? (=:1 + ' day(s)') : '') + (=:1 ? ' ' : '' ) + ((1:=int(0:=((=:0 - =:1 + 1/24/60/60/2)*24))) != 0 ? =:1 + ' hour(s)' : '' ) + (=:1 ? ' ' : '' ) + ((1:=round((=:0 - =:1)*60)) != 0 ? =:1 + ' min(s)' : '')%>" displays on the first line, the event's short margins, while on the second line displays the event's durations in days, hours and minutes. Once you update or edit the event's margins, the event's body automatically shows the new length. You can use the MoveBy method to delay the current event with a specified value time. You can use the SetKnownProperty(exEventDuration) to change the event's duration. * %8 (exEventRepetitiveExpression) {string}, specifies the repetitive expression of the event. The Repetitive property of the event indicates the expression that determines whether the event is repetitive. For instance, the LabelProperty = "<%=%256%>
<%=len(%8)? `repetitive event`:``%>" displays repetitive event for repetitive events. * %12 (exEventID) {string}, specifies the event's unique key/identifier/index. * %256 (exEventDisplayShortMargins) {string}, displays the margins of the event in a short format (read-only). The ShortDateFormat property defines the short date format. The ShortTimeFormat property defines the short time format. * %257 (exEventDisplayLongMargins) {string}, displays the margins of the event in a long format (read-only). The LongDateFormat property defines the long date format. The LongTimeFormat property defines the long time format. * %258 (exEventStartDate) {Date}, gets the starting date ( not including the time ) of the event (read-only). You can use this property to get the starting date of the event. * %259 (exEventStartTime) {number}, gets the starting time ( not including the date ) of the event, as a number between 0 and 1 (read-only). You can use this property to get the starting time of the event. * %260 (exEventEndDate) {Date}, gets the ending date ( not including the time ) of the event (read-only). You can use this property to get the ending date of the event. * %261 (exEventEndTime) {number}, gets the ending time ( not including the date ) of the event, as a number between 0 and 1 (read-only). You can use this property to get the ending time of the event. * %262 (exEventGroupLabel) {string}, gets the label of the owner group (read-only). The exEventGroupLabel property indicates the Caption property of the Group's event. The GroupID property of the event indicates the identifier of the group that event belongs to. The exEventGroupTitle property indicates the Title property of the Group's event. For instance, the LabelProperty = "<%=%262%>
<%=%256%>" displays on the first line, the group's caption, and the short margins of the event on the second line. The caption of the label is automatically updated once an event is moved from a group to another. * %263 (exEventGroupTitle) {string}, gets the title of the owner group (read-only). The exEventGroupTitle property indicates the Title property of the Group's event. The exEventGroupLabel property indicates the Caption property of the Group's event. The GroupID property of the event indicates the identifier of the group that event belongs to. For instance, the LabelProperty = "<%=%263%>
<%=%256%>" displays on the first line, the group's caption, and the short margins of the event on the second line. The caption of the label is automatically updated once an event is moved from a group to another. * %264 (exEventRepetitive) {boolean}, Indicates if the current event is a repetitive event. (read-only). You can use this flag to specify whether Repetitive property is not empty, and valid. * * @type {string} * @example * * null {null} or undefined {undefined}, the control's DefaultEventToolTip property defines the event's tooltip * "" {string}, no tooltip for the event is displayed * "image and text" {string}, the image and text is being shown once the mouse pointer hovers the event. The image can be added using the exontrol.HTMLPicture.Add() method * "<%=%256%>", displays the event's start and end margins in a short format */ toolTip: null, /** * @description The movable field specifies whether the user can move the event by drag and drop * @type {boolean} * @example * * false {boolean}, the event can not be moved by drag and drop * true {boolean}, the event is movable */ movable: true, /** * @description The resizable field specifies whether the user can resizes the event at runtime * @type {exontrol.Schedule.EventResizableEnum} * * The exontrol.Schedule.EventResizableEnum type supports the following flags: * * exNoResizable (0), the event can not be resized * exResizableStart (1), only the starting point of the event can be resized * exResizableEnd (2), only the ending point of the event can be resized * exResizableBoth (3), indicates a sizeable event, so the user can resize at runtime the start or end point of the event (default) * * @example * * false {boolean} exNoResizable (0), the event can not be resized * true {boolean} or exResizableStart(1), only the starting point of the event can be resized * 3 {number} or exResizableBoth(3), indicates a sizeable event, so the user can resize at runtime the start or end point of the event (default) */ resizable: exontrol.Schedule.EventResizableEnum.exResizableBoth, /** * @description The allDay field indicates an all-day event event. The time is ignored for all-day events * @type {boolean} * @example * * false {boolean}, the event is not an all-day event, and it is displayed in the time-scale of the day * true {boolean}, the event is an all-day event, and it is displayed in All-Day header */ allDay: false, /** * @description The userData field stores any extra-data associated with the event * @type {any} */ userData: undefined, /** * @description The shortLabel field defines the event's short-label. The formatEventShortLabel misc option defines the format to show the short-label. The shortLabel field supports ex-HTML and <%=formula%> tags. The <%=formula%> tag indicates the result of the giving formula. The formula supports value formatting. Inside the formula the %0, %1, ... indicates the value of corresponding property of the event, such as %1 specifies the exEventStartDateTime, %2 exEventEndDateTime, and so on. The known identifiers within the <%=formula%> tag are: * * %1 (exEventStartDateTime) {Date}, indicates the starting date/time of the event. This property gets the Start property of the event. The Start property defines the lower margin of the event, and it includes the date and the time values. The exEventStartDate specifies the DATE value only, while the exEventStartTime includes the TIME value only. For instance, the LabelProperty = "<%=weekday(%1)%>" displays the day of the week where the event starts * %2 (exEventEndDateTime) {Date}, indicates the ending date/time of the event. This property gets or sets the End property of the event. The End property defines the upper margin of the event, and it includes the date and the time values. The exEventEndDate specifies the DATE value only, while the exEventEndTime includes the TIME value only. For instance, the LabelProperty = "<%=weekday(%2)%>" gets the day of the week where the event ends. * %3 (exEventAllDay) {boolean}, indicates if the current event is an all day event. This property is equivalent with the event's AllDay property which indicates if the current event is an all-day event. For instance, the LabelProperty = "<%=%3 ? `All-Day-Event: `: ``%><%=%256%>", displays automatically an "All-Day-Event: " prefix for all-day events. If the event is not an all-day event, the <%=%256%>, or exEventDisplayShortMargins, short margins of the events are displayed. * %4 (exEventGroupID) {any}, specifies the identifier/index of the event's group. The GroupID property of the event indicates the identifier of the group that event belongs to. The exEventGroupLabel property indicates the Caption property of the Group's event. The exEventGroupTitle property indicates the Title property of the Group's event. For instance, the LabelProperty = "<%=%4%>
<%=%256%>" displays on the first line, the group's identifier, and the short margins of the event on the second line. The caption of the label is automatically updated once an event is moved from a group to another. * %5 (exEventCaption) {string}, indicates the caption of the event. The Caption property of the event specifies the custom caption that can be displayed on the label, without having to change the event's label. For instance, the LabelProperty = "<%=%256%>
<%=%5%>" displays on the first line, the event's short margins, while on the second line displays the event's caption. Once you update or edit the event's Caption, the event's body automatically shows the new caption. * %6 (exEventUserData) {any}, indicates the extra data associated with the event. The UserData property of the event indicates an extra data associated with the event. For instance, the LabelProperty = "<%=%256%>
<%=%6%>" displays on the first line, the event's short margins, while on the second line displays the event's user data. Once you update or edit the event's UserData, the event's body automatically shows the new label. * %7 (exEventDuration) {number}, specifies the duration of the event. The returned values is of float type, and it indicates the duration of the event in days. For instance, the 1.5 indicates, 1 day and 12 hours. For instance, the LabelProperty = "<%=%256%>
<%=((1:=int(0:= (date(%2)-date(%1)))) != 0 ? (=:1 + ' day(s)') : '') + (=:1 ? ' ' : '' ) + ((1:=int(0:=((=:0 - =:1 + 1/24/60/60/2)*24))) != 0 ? =:1 + ' hour(s)' : '' ) + (=:1 ? ' ' : '' ) + ((1:=round((=:0 - =:1)*60)) != 0 ? =:1 + ' min(s)' : '')%>" displays on the first line, the event's short margins, while on the second line displays the event's durations in days, hours and minutes. Once you update or edit the event's margins, the event's body automatically shows the new length. You can use the MoveBy method to delay the current event with a specified value time. You can use the SetKnownProperty(exEventDuration) to change the event's duration. * %8 (exEventRepetitiveExpression) {string}, specifies the repetitive expression of the event. The Repetitive property of the event indicates the expression that determines whether the event is repetitive. For instance, the LabelProperty = "<%=%256%>
<%=len(%8)? `repetitive event`:``%>" displays repetitive event for repetitive events. * %12 (exEventID) {string}, specifies the event's unique key/identifier/index. * %256 (exEventDisplayShortMargins) {string}, displays the margins of the event in a short format (read-only). The ShortDateFormat property defines the short date format. The ShortTimeFormat property defines the short time format. * %257 (exEventDisplayLongMargins) {string}, displays the margins of the event in a long format (read-only). The LongDateFormat property defines the long date format. The LongTimeFormat property defines the long time format. * %258 (exEventStartDate) {Date}, gets the starting date ( not including the time ) of the event (read-only). You can use this property to get the starting date of the event. * %259 (exEventStartTime) {number}, gets the starting time ( not including the date ) of the event, as a number between 0 and 1 (read-only). You can use this property to get the starting time of the event. * %260 (exEventEndDate) {Date}, gets the ending date ( not including the time ) of the event (read-only). You can use this property to get the ending date of the event. * %261 (exEventEndTime) {number}, gets the ending time ( not including the date ) of the event, as a number between 0 and 1 (read-only). You can use this property to get the ending time of the event. * %262 (exEventGroupLabel) {string}, gets the label of the owner group (read-only). The exEventGroupLabel property indicates the Caption property of the Group's event. The GroupID property of the event indicates the identifier of the group that event belongs to. The exEventGroupTitle property indicates the Title property of the Group's event. For instance, the LabelProperty = "<%=%262%>
<%=%256%>" displays on the first line, the group's caption, and the short margins of the event on the second line. The caption of the label is automatically updated once an event is moved from a group to another. * %263 (exEventGroupTitle) {string}, gets the title of the owner group (read-only). The exEventGroupTitle property indicates the Title property of the Group's event. The exEventGroupLabel property indicates the Caption property of the Group's event. The GroupID property of the event indicates the identifier of the group that event belongs to. For instance, the LabelProperty = "<%=%263%>
<%=%256%>" displays on the first line, the group's caption, and the short margins of the event on the second line. The caption of the label is automatically updated once an event is moved from a group to another. * %264 (exEventRepetitive) {boolean}, Indicates if the current event is a repetitive event. (read-only). You can use this flag to specify whether Repetitive property is not empty, and valid. * * @type {string} * @example * * null {null} or undefined {undefined}, the control's DefaultEventShortLabel property defines the event's short-label * "" {string}, no short-label is displayed * "image and text" {string}, displays the image and the text. The image can be added using the exontrol.HTMLPicture.Add() method * "<%=%256%>", displays the event's start and end margins in a short format */ shortLabel: null, /** * @description The longLabel field defines the event's long-label. The event's long-label is displayed only if it is not empty and fits the event. The event's short-label is displayed if the event's long-label is empty or does not fit the event. The caption and extra-label of the event are always displayed. The formatEventLongLabel misc option defines the format to show the long-label. The longLabel field supports ex-HTML and <%=formula%> tags. The <%=formula%> tag indicates the result of the giving formula. The formula supports value formatting. Inside the formula the %0, %1, ... indicates the value of corresponding property of the event, such as %1 specifies the exEventStartDateTime, %2 exEventEndDateTime, and so on. The known identifiers within the <%=formula%> tag are: * * %1 (exEventStartDateTime) {Date}, indicates the starting date/time of the event. This property gets the Start property of the event. The Start property defines the lower margin of the event, and it includes the date and the time values. The exEventStartDate specifies the DATE value only, while the exEventStartTime includes the TIME value only. For instance, the LabelProperty = "<%=weekday(%1)%>" displays the day of the week where the event starts * %2 (exEventEndDateTime) {Date}, indicates the ending date/time of the event. This property gets or sets the End property of the event. The End property defines the upper margin of the event, and it includes the date and the time values. The exEventEndDate specifies the DATE value only, while the exEventEndTime includes the TIME value only. For instance, the LabelProperty = "<%=weekday(%2)%>" gets the day of the week where the event ends. * %3 (exEventAllDay) {boolean}, indicates if the current event is an all day event. This property is equivalent with the event's AllDay property which indicates if the current event is an all-day event. For instance, the LabelProperty = "<%=%3 ? `All-Day-Event: `: ``%><%=%256%>", displays automatically an "All-Day-Event: " prefix for all-day events. If the event is not an all-day event, the <%=%256%>, or exEventDisplayLongMargins, long margins of the events are displayed. * %4 (exEventGroupID) {any}, specifies the identifier/index of the event's group. The GroupID property of the event indicates the identifier of the group that event belongs to. The exEventGroupLabel property indicates the Caption property of the Group's event. The exEventGroupTitle property indicates the Title property of the Group's event. For instance, the LabelProperty = "<%=%4%>
<%=%256%>" displays on the first line, the group's identifier, and the long margins of the event on the second line. The caption of the label is automatically updated once an event is moved from a group to another. * %5 (exEventCaption) {string}, indicates the caption of the event. The Caption property of the event specifies the custom caption that can be displayed on the label, without having to change the event's label. For instance, the LabelProperty = "<%=%256%>
<%=%5%>" displays on the first line, the event's long margins, while on the second line displays the event's caption. Once you update or edit the event's Caption, the event's body automatically shows the new caption. * %6 (exEventUserData) {any}, indicates the extra data associated with the event. The UserData property of the event indicates an extra data associated with the event. For instance, the LabelProperty = "<%=%256%>
<%=%6%>" displays on the first line, the event's long margins, while on the second line displays the event's user data. Once you update or edit the event's UserData, the event's body automatically shows the new label. * %7 (exEventDuration) {number}, specifies the duration of the event. The returned values is of float type, and it indicates the duration of the event in days. For instance, the 1.5 indicates, 1 day and 12 hours. For instance, the LabelProperty = "<%=%256%>
<%=((1:=int(0:= (date(%2)-date(%1)))) != 0 ? (=:1 + ' day(s)') : '') + (=:1 ? ' ' : '' ) + ((1:=int(0:=((=:0 - =:1 + 1/24/60/60/2)*24))) != 0 ? =:1 + ' hour(s)' : '' ) + (=:1 ? ' ' : '' ) + ((1:=round((=:0 - =:1)*60)) != 0 ? =:1 + ' min(s)' : '')%>" displays on the first line, the event's long margins, while on the second line displays the event's durations in days, hours and minutes. Once you update or edit the event's margins, the event's body automatically shows the new length. You can use the MoveBy method to delay the current event with a specified value time. You can use the SetKnownProperty(exEventDuration) to change the event's duration. * %8 (exEventRepetitiveExpression) {string}, specifies the repetitive expression of the event. The Repetitive property of the event indicates the expression that determines whether the event is repetitive. For instance, the LabelProperty = "<%=%256%>
<%=len(%8)? `repetitive event`:``%>" displays repetitive event for repetitive events. * %12 (exEventID) {string}, specifies the event's unique key/identifier/index. * %256 (exEventDisplayShortMargins) {string}, displays the margins of the event in a short format (read-only). The ShortDateFormat property defines the short date format. The ShortTimeFormat property defines the short time format. * %257 (exEventDisplayLongMargins) {string}, displays the margins of the event in a long format (read-only). The LongDateFormat property defines the long date format. The LongTimeFormat property defines the long time format. * %258 (exEventStartDate) {Date}, gets the starting date ( not including the time ) of the event (read-only). You can use this property to get the starting date of the event. * %259 (exEventStartTime) {number}, gets the starting time ( not including the date ) of the event, as a number between 0 and 1 (read-only). You can use this property to get the starting time of the event. * %260 (exEventEndDate) {Date}, gets the ending date ( not including the time ) of the event (read-only). You can use this property to get the ending date of the event. * %261 (exEventEndTime) {number}, gets the ending time ( not including the date ) of the event, as a number between 0 and 1 (read-only). You can use this property to get the ending time of the event. * %262 (exEventGroupLabel) {string}, gets the label of the owner group (read-only). The exEventGroupLabel property indicates the Caption property of the Group's event. The GroupID property of the event indicates the identifier of the group that event belongs to. The exEventGroupTitle property indicates the Title property of the Group's event. For instance, the LabelProperty = "<%=%262%>
<%=%256%>" displays on the first line, the group's caption, and the short margins of the event on the second line. The caption of the label is automatically updated once an event is moved from a group to another. * %263 (exEventGroupTitle) {string}, gets the title of the owner group (read-only). The exEventGroupTitle property indicates the Title property of the Group's event. The exEventGroupLabel property indicates the Caption property of the Group's event. The GroupID property of the event indicates the identifier of the group that event belongs to. For instance, the LabelProperty = "<%=%263%>
<%=%256%>" displays on the first line, the group's caption, and the short margins of the event on the second line. The caption of the label is automatically updated once an event is moved from a group to another. * %264 (exEventRepetitive) {boolean}, Indicates if the current event is a repetitive event. (read-only). You can use this flag to specify whether Repetitive property is not empty, and valid. * * @type {string} * @example * * null {null} or undefined {undefined}, the control's DefaultEventLongLabel property defines the event's long-label. The event's long-label is displayed only if it is not empty and fits the event. The event's short-label is displayed if the event's long-label is empty or does not fit the event. The caption and extra-label of the event are always displayed. * "" {string}, no long-label is displayed * "image and text" {string}, displays the image and the text. The image can be added using the exontrol.HTMLPicture.Add() method * "<%=%256%>", displays the event's start and end margins in a long format */ longLabel: null, /** * @description The extraLabel field specifies an extra HTML label, to be displayed on the event's body. The formatEventExtraLabel misc option defines the format to show the extra-label. The extraLabel field supports ex-HTML and <%=formula%> tags. The <%=formula%> tag indicates the result of the giving formula. The formula supports value formatting. Inside the formula the %0, %1, ... indicates the value of corresponding property of the event, such as %1 specifies the exEventStartDateTime, %2 exEventEndDateTime, and so on. The known identifiers within the <%=formula%> tag are: * * %1 (exEventStartDateTime) {Date}, indicates the starting date/time of the event. This property gets the Start property of the event. The Start property defines the lower margin of the event, and it includes the date and the time values. The exEventStartDate specifies the DATE value only, while the exEventStartTime includes the TIME value only. For instance, the LabelProperty = "<%=weekday(%1)%>" displays the day of the week where the event starts * %2 (exEventEndDateTime) {Date}, indicates the ending date/time of the event. This property gets or sets the End property of the event. The End property defines the upper margin of the event, and it includes the date and the time values. The exEventEndDate specifies the DATE value only, while the exEventEndTime includes the TIME value only. For instance, the LabelProperty = "<%=weekday(%2)%>" gets the day of the week where the event ends. * %3 (exEventAllDay) {boolean}, indicates if the current event is an all day event. This property is equivalent with the event's AllDay property which indicates if the current event is an all-day event. For instance, the LabelProperty = "<%=%3 ? `All-Day-Event: `: ``%><%=%256%>", displays automatically an "All-Day-Event: " prefix for all-day events. If the event is not an all-day event, the <%=%256%>, or exEventDisplayLongMargins, long margins of the events are displayed. * %4 (exEventGroupID) {any}, specifies the identifier/index of the event's group. The GroupID property of the event indicates the identifier of the group that event belongs to. The exEventGroupLabel property indicates the Caption property of the Group's event. The exEventGroupTitle property indicates the Title property of the Group's event. For instance, the LabelProperty = "<%=%4%>
<%=%256%>" displays on the first line, the group's identifier, and the long margins of the event on the second line. The caption of the label is automatically updated once an event is moved from a group to another. * %5 (exEventCaption) {string}, indicates the caption of the event. The Caption property of the event specifies the custom caption that can be displayed on the label, without having to change the event's label. For instance, the LabelProperty = "<%=%256%>
<%=%5%>" displays on the first line, the event's long margins, while on the second line displays the event's caption. Once you update or edit the event's Caption, the event's body automatically shows the new caption. * %6 (exEventUserData) {any}, indicates the extra data associated with the event. The UserData property of the event indicates an extra data associated with the event. For instance, the LabelProperty = "<%=%256%>
<%=%6%>" displays on the first line, the event's long margins, while on the second line displays the event's user data. Once you update or edit the event's UserData, the event's body automatically shows the new label. * %7 (exEventDuration) {number}, specifies the duration of the event. The returned values is of float type, and it indicates the duration of the event in days. For instance, the 1.5 indicates, 1 day and 12 hours. For instance, the LabelProperty = "<%=%256%>
<%=((1:=int(0:= (date(%2)-date(%1)))) != 0 ? (=:1 + ' day(s)') : '') + (=:1 ? ' ' : '' ) + ((1:=int(0:=((=:0 - =:1 + 1/24/60/60/2)*24))) != 0 ? =:1 + ' hour(s)' : '' ) + (=:1 ? ' ' : '' ) + ((1:=round((=:0 - =:1)*60)) != 0 ? =:1 + ' min(s)' : '')%>" displays on the first line, the event's long margins, while on the second line displays the event's durations in days, hours and minutes. Once you update or edit the event's margins, the event's body automatically shows the new length. You can use the MoveBy method to delay the current event with a specified value time. You can use the SetKnownProperty(exEventDuration) to change the event's duration. * %8 (exEventRepetitiveExpression) {string}, specifies the repetitive expression of the event. The Repetitive property of the event indicates the expression that determines whether the event is repetitive. For instance, the LabelProperty = "<%=%256%>
<%=len(%8)? `repetitive event`:``%>" displays repetitive event for repetitive events. * %12 (exEventID) {string}, specifies the event's unique key/identifier/index. * %256 (exEventDisplayShortMargins) {string}, displays the margins of the event in a short format (read-only). The ShortDateFormat property defines the short date format. The ShortTimeFormat property defines the short time format. * %257 (exEventDisplayLongMargins) {string}, displays the margins of the event in a long format (read-only). The LongDateFormat property defines the long date format. The LongTimeFormat property defines the long time format. * %258 (exEventStartDate) {Date}, gets the starting date ( not including the time ) of the event (read-only). You can use this property to get the starting date of the event. * %259 (exEventStartTime) {number}, gets the starting time ( not including the date ) of the event, as a number between 0 and 1 (read-only). You can use this property to get the starting time of the event. * %260 (exEventEndDate) {Date}, gets the ending date ( not including the time ) of the event (read-only). You can use this property to get the ending date of the event. * %261 (exEventEndTime) {number}, gets the ending time ( not including the date ) of the event, as a number between 0 and 1 (read-only). You can use this property to get the ending time of the event. * %262 (exEventGroupLabel) {string}, gets the label of the owner group (read-only). The exEventGroupLabel property indicates the Caption property of the Group's event. The GroupID property of the event indicates the identifier of the group that event belongs to. The exEventGroupTitle property indicates the Title property of the Group's event. For instance, the LabelProperty = "<%=%262%>
<%=%256%>" displays on the first line, the group's caption, and the short margins of the event on the second line. The caption of the label is automatically updated once an event is moved from a group to another. * %263 (exEventGroupTitle) {string}, gets the title of the owner group (read-only). The exEventGroupTitle property indicates the Title property of the Group's event. The exEventGroupLabel property indicates the Caption property of the Group's event. The GroupID property of the event indicates the identifier of the group that event belongs to. For instance, the LabelProperty = "<%=%263%>
<%=%256%>" displays on the first line, the group's caption, and the short margins of the event on the second line. The caption of the label is automatically updated once an event is moved from a group to another. * %264 (exEventRepetitive) {boolean}, Indicates if the current event is a repetitive event. (read-only). You can use this flag to specify whether Repetitive property is not empty, and valid. * * @type {string} * @example * * null {null}, undefined {undefined}, no extra-label is displayed * "" {string}, no extra-label is displayed * "image and text" {string}, displays the image and the text. The image can be added using the exontrol.HTMLPicture.Add() method * "<%=%256%>", displays the event's start and end margins in a long format */ extraLabel: null }; /////////////////////////////////////////////////////////// (exontrol.Shapes.Schedule) // // The exontrol.Shapes.Schedule namespace provides support to customize the visual appearance of different parts of the exontrol.Schedule object. // /////////////////////////////////////////////////////////// /** * @description The exontrol.Shapes.Schedule namespace provides support to customize the visual appearance of different parts of the exontrol.Schedule object. */ exontrol.Shapes.Schedule = { /** * @description The shframe field specifies the visual appearance to display the frames * @type {object} Indicates an object of {normal,disabled,hover,click} type */ shframe: { /** * @description The normal field holds an object of exontrol.Def.Shape type that's applied on the part. * @type {object} Indicates an object of exontrol.Def.Shape type that's applied on the part. */ normal: { frameColor: "rgb(200,200,200)", }, }, /** * @description The shfill field specifies the visual appearance to display the solid background * @type {object} Indicates an object of {normal,disabled,hover,click} type */ shfill: { /** * @description The normal field holds an object of exontrol.Def.Shape type that's applied on the part. * @type {object} Indicates an object of exontrol.Def.Shape type that's applied on the part. */ normal: { frameColor: "rgb(200,200,200)", fillColor: "rgb(240,240,240)", }, }, /** * @description The shframe field specifies the visual appearance to display the frame while selected * @type {object} Indicates an object of {normal,disabled,hover,click} type */ shframeSel: { /** * @description The normal field holds an object of exontrol.Def.Shape type that's applied on the part. * @type {object} Indicates an object of exontrol.Def.Shape type that's applied on the part. */ normal: { frameColor: "dodgerblue", }, }, /** * @description The shighlight field specifies the visual appearance to highlight the dates with events * @type {object} Indicates an object of {normal,disabled,hover,click} type */ shighlight: { /** * @description The normal field holds an object of exontrol.Def.Shape type that's applied on the part. * @type {object} Indicates an object of exontrol.Def.Shape type that's applied on the part. */ normal: { tfi: "bold", }, }, /** * @description The shevent field specifies the visual appearance to display the events * @type {object} Indicates an object of {normal,disabled,hover,click} type */ shevent: { /** * @description The normal field includes definitions to draw the object. * @type {object} An object of exontrol.Def.Shape type to be applied on the part's background. */ normal: { fillColor: "#C0C0C0", client: "[x+3,,width-3]", draw: function(ctx, client, clientShape, oShapeData /*oEventSE*/) { ctx.lineWidth++; ctx.drawVLine(exontrol.G.R2C(client, 0x11), client[3 /*height*/]); ctx.lineWidth--; } }, /** * @description The disabled field includes definitions to draw the object in disabled state. * @type {object} An object of exontrol.Def.Shape type to be applied on the part's background on disabled state. */ disabled: { opacity: 0.5 } }, /** * @description The shrect field uses rectangular shape rather than rounded. * @type {object} Indicates an object of {normal,disabled,hover,click} type */ shrect: { /** * @description The normal field includes definitions to draw the object. * @type {object} An object of exontrol.Def.Shape type to be applied on the part's background. */ normal: { primitive: "Rectangle", //frameColor: "transparent" }, }, /** * @description The shzone field specifies the visual appearance to display the mark-zones * @type {object} Indicates an object of {normal,disabled,hover,click} type */ shzone: { /** * @description The normal field includes definitions to draw the object. * @type {object} An object of exontrol.Def.Shape type to be applied on the part's background. */ normal: { pattern: 6, patternColor: "#888888" }, }, }