Introduction

The “diff” array is an array of modifications described in the “diff” property of a schema. The array is used for generating module views in the system UI. Each array element is a metadata. The UI controls are generated based on these metadata.

The diff property contains an array of configuration objects that are responsible for schema display. The diff array contains objects that configure display of containers, controls, modules, fields and other visual components.

The diff array object properties

The diff array elements have the following properties:

• operation – can have the following values:
  • set – schema element value is set by the values parameter.
  • merge – the values from the parent, replacing and replacement schemas are merged. The properties from values parameter have the highest priority.
  • remove – the element is removed from the schema.
  • move – the element is moved to another parent element.
  • insert – the element is inserted in the schema.
• name – the name of schema element that the operation is applied to.
• parentName – the name of schema parent element where the element is placed as a result of the insert or move operation;
• propertyName – the name of parent element parameter in the insert operation. Also used in the remove operation if it is needed to remove specific element parameters and not the element itself;
• index – the index in which the parameter is being moved or inserted. The parameter is used in the insert and move operations. If the parameter is not specified, the element will be inserted as the last element in the array.
• values – the object whose properties will be set or merged with schema element properties. It is used in the set, merge and insert operations.
  

Bpm'online has a set of basic elements that can be displayed on a page. They are specified in the Terrasoft.ViewItemType list (Table. 1).

Table 1. – Element type

An example of using the “diff” property

diff: /**SCHEMA_DIFF*/[
  {
      "operation": "insert",
      "name": "CardContentWrapper",
      "values": {
          "id": "CardContentWrapper",
          "itemType": Terrasoft.ViewItemType.CONTAINER,
          "wrapClass": ["card-content-container"],
          "items": []
      }
  },
  {
      "operation": "insert",
      "name": "CardContentContainer",
      "parentName": "CardContentWrapper",
      "propertyName": "items",
      "values": {
          "itemType": Terrasoft.ViewItemType.CONTAINER,
          "items": []
      }
  },
  {
      "operation": "insert",
      "name": "HeaderContainer",
      "parentName": "CardContentContainer",
      "propertyName": "items",
      "values": {
          "itemType": Terrasoft.ViewItemType.CONTAINER,
          "wrapClass": ["header-container-margin-bottom"],
          "items": []
      }
  },
  {
      "operation": "insert",
      "name": "Header",
      "parentName": "HeaderContainer",
      "propertyName": "items",
      "values": {
          "itemType": Terrasoft.ViewItemType.GRID_LAYOUT,
          "items": [],
          "collapseEmptyRow": true
      }
  }
]/**SCHEMA_DIFF*/