GH-Elements

Calendar

Calendar is a gh-element that allows to display different events in different calendar forms. It allows to monitor any events. This element can be associated with the date and duration fields of the application elements and, depending on their values, displays events on certain dates.

The calendar has a few displaying modes:

  • Month - standard calendar. Events are displayed in squares of days.

    Month calendar

  • Week - days are displayed as columns with rows of the time. Events are rectangles occupying the certain space.

    Week calendar

  • Day - shows certain day as a list with hour rows. Event is displayed as the same rectangles occupying the certain space.

    Day calendar

  • List - shows all events of the selected day as a bulleted list.

    List calendar

Each user can change the mode using the buttons in the upper right corner of the element.

The buttons in upper left color allows to change the time period and, accordingly, to see all events.

Functional Characteristics

This element is mainly used for scheduling. For example, it is useful for scheduling events, tracking projects, and assigning tasks.

Value Format

This gh-element does not have the field value.

Element Options

The calendar element has three blocks of settings.

Field Settings

The first one is field settings. It does not have unique for calendar options. There sre only standard Field Name and Name Space.

Settings of calendar field

Main Settings and View Template

The second group allows to configure the calendar work and connections with other elements.

Main settings of the calendar

Name Description
Source App allows to select the source application; details...
Item action allows to select calendar mark action; details...
Event name allows to select the field whose value will be displayed in the calendar; details...
Start field allows to select the field with a start date; details...
Use Duration allows to use duration instead of end date; details...
End Date allows to select the field with the end date; available when Use Duration is off; details...
Duration allows to select field with duration; available when Use Duration is on; details...
View name allows to select which view will be opened if the action is configured for this; details...

Source App

This is the application from which fields and values will be taken.

Item Action

Here you can select the actions that will be performed after clicking on marker in the calendar. There are only two possible values:

  • Open item. Open selected in settings view.
  • None. Nothing is happening after clicking.

Event Name

This is the name that is displayed in the calendar. It is taken from the selected fields. So, event name is a value of certain field.

Start Field

Start field is a field where the value is a date that becomes a start date of the event. Unlike Event Name, any type of field is not accepted here, only the date element.

Use Duration

This function allow to change the type of field that allows to determine event length. If Use Duration is off, the End Date is used. If it is on, as you can gather, the Duration is used.

End Date

End date is a value of the date field. It is used as end limit of the event.

Duration

This is the value of the duration element. It is taken as an event duration.

View Name

It is the name of the view which is opened after clicking. It is mandatory when Item Action has 'Open item' value.

Items Styles Settings

The last block of settings is responsible for the look of the marks which will be displayed. That means, it allows to customize the style of events displaying.

Settings of calendar items styles

Name Description
Text color allows to select color of the text; details...
Background color allows to select the background color of the calendar mark; details...
Conditions allows you to set which colors corresponds to which event; details...
Edit allows to edit or delete the style; details...

Text Color

The first setting of the mark styles is the color of the text which is displayed in the calendar as a mark. There is a standard color picker for this.

Background Color

This one is a color of the mark background. In settings you can open the color picker and select any color which you like.

Conditions

Conditions actually contains filters. It allows to filter out the items for which will be used current mark style.

Edit

This column contains two buttons that allows to edit or delete the style.

Element Style

The calendar style does not have special options. As you can see below, there are only standard settings and calendar interpretation types.

Style of calendar element

Data Model

Despite the number of element settings, calendar element has very simple data model:

{
    "data_model": {
        "interpretation": [],
        "itemsConfig": {
            "displayFieldId": "645900",
            "durationFieldId": "677682",
            "endDateFieldId": "",
            "startFieldId": "677681",
        },
        "itemsStyles": [{
            "background-color": "#67f98a",
            "color": "#6287ce",
            "filters_list": []
        }],
        "source_app_id": "27824",
        "table_settings": {
            "action": "open_item"
        },
        "use_duration": 1,
        "view_id": "1433982"
    }
}
Name Type Description
interpretation array contains all element interpretations
itemsConfig object contains all IDs of the fields which are associated with calendar
displayFieldId string ID of the field that will be displayed in calendar
durationFieldId string ID of the field from which the duration will be taken
endDateFieldId string ID of the field where contains the end date of event
startFieldId string ID of the field where contains the start date of event
itemsStyles array contains all values of style options
background-color string contains the hex code of the background color of the calendar mark
color string contains the hex code of the text color of the calendar mark
filters_list array contains all filters of the calendar marks
source_app_id string contains ID of the source application
table_settings object contains the setting of the field action
action string shows which action sill be after clicking on the calendar mark
use_duration boolean shows whether the duration is used or not
view_id string ID of the view which will be opened after clicking on the calendar mark

Filtration

The calendar element cannot be filtered out.

Interpretation

There are two calendar interpretations. Only one of them allows you to display the entire calendar.

Types of calendar interpretation

Default

This is the interpretation type that allows to display the element as a familiar for user calendar with all events.

Icon

The second and the last interpretation type of calendar element only displays the icon.