Skip to content

The Trio in the Frontend

The Trio structure is requested from the back end whenever a new module is requested in the front end. The 3-level JSON object returned contains the complete Categories/Groups/Options structure. normalizeTrio() "normalizes" this object into three separate structures:

  • categories

  • groupsObj

  • optionsObj

    They are then stored in TrioStore.trio:

ts
 trio {
    categories: [
        'Registration',
        'Basic Characteristics',
        // ...
    ],
    groupsObj: {
        '00' : {},
        '01' : {},
        // ...
    }
    optionsObj : {
        '000': {
                text: 'A',
                extra: 0
            },
        '001': {
                text: 'B',
                extra: 1
            },
            // ...
    }
 }

Note that the keys to groupObj and optionsObj are zero padded string representations of running integers assigned by trioNormalize(). These structures facilitate uniform and easy access to groups and options which also keeps track of their original order.

Three arrays are used by the frontend to keep track of selected options (they store the selected optionKeys):

  • filterSelected: currently active filters
  • itemSelected: option keys derived directly from the item's fields (enums, lookups, categorized filters)
  • newItemSelected: newly-selected option keys (derived directly form the item's fields) ready to be synchronized to the backend

Two Indices, catgoryIndex and groupIndex, keep track of the current displayed category and group tabs in either the filter or tagger forms.

The currently selected options are shown in the selectedOptions form as a three-level structure.