Interpretation

Interface is an integral part of every program, especially for low &no-code platforms. For easy and convenient using of the application made there, it must be user-friendly. Therefore, the type of displaying and its customizing are incredibly important. For this task, the interpretation exists. Its settings allows you to configure in which part of application and how the elements will be displayed.

In this article you can read about:

1. Interpretation Types

2. Interpretation Places

3. Interpretation of GH-elements

Interpretation Types

Interpretation type is a model on which the platform understand how to display the data. The programmer writes them himself, so he can edit and delete it or add a new one at any time.

Interpretation types are available in gh-elements settings. You can fluently change them during the application existing. There is the one that is used by default. It will be displayed, if the other interpretation types do not exist or are not selected.

Interpretation Places

Interpretation places are the places where the element with the selected type of interpretation will be displayed.

There are many types of such places. Each of them is set as an elem-src var.

Container deserves particular attention. This interpretation type which will be used first, if it exists.

Interpretation of GH-elements

Every gh-element has a variety of different interpretation types. In addition, developers can add their own one.

{
    "interpretation":[{
        "id": "default",
        "settings": {
            "editable": 0,
            "show_field": 1,
            "show_field_name": 0
        },
        "src": "table"
    }]
}

In fact, all differences between interpretation types are values of id and src properties. All other properties can be configured regardless of the source place.

Methods

There two available methods in GudHub which allows you to get the interpretation type of the certain gh-element. Since each element usually has several types of interpretation, the returns of this method will be different each time. So, we have identified the main groups of interpretations in a separate chapter.

getInterpretation

The first method is created to get the type of interpretation of a certain element in a certain container.

import GudHub from '@gudhub/core';

const AUTHKEY = "NKJHIUHknjcnkhios9w92ehds78/7T7GYfz67w2eu+dsidhfnc2365k";
let value = "#ffffff";
let field = 697462;
let dataType = {
    field_id: 697462,
    field_name: 'Color',
    field_value: '#ffffff',
    data_id: 'color',
    data_type: 'color',
    file_name: 0,
    data_model: {
        advanced_mode_by_default: true,
        interpretation : [
            {
            src: 'table',
            id: 'input',
            settings:{
                editable: 0,
                show_field_name: 0,
                show_field: 1
            }
            },{
            src: 'form',
            id: 'input',
            settings:{
                editable: 1,
                show_field_name: 1,
                show_field: 1
            }
            },{
            src: 'dropdown',
            id: 'default',
            settings:{
                editable: 0,
                show_field_name: 0,
                show_field: 1
            }
            },{
            src: 'input',
            id: 'default',
            settings:{
                editable: 0,
                show_field_name: 0,
                show_field: 1
            }
            },{
            src: 'input_list',
            id: 'default',
            settings:{
                editable: 0,
                show_field_name: 0,
                show_field: 1
            }
        }]
    }
};
let source = "form";
let itemId = 3205038;
let appId = 29860;
let containerId = 1575926;

(async ()=>{
    const gudhub = await new GudHub(AUTHKEY);
    let gottenInterpretation = await gudhub.getInterpretation(value, field, dataType, source, itemId, appId, containerId);
    console.log(gottenInterpretation);
})();

The current example will return:

'<gh-color gh-model="field_model.field_value" editable="field_model.settings.editable" mode="field_model.data_model.advanced_mode_by_default"/>'

getInterpretationById

The current method allows to get one of the interpretation type of the certain element by its location data and ID of the element interpretation type.

import GudHub from '@gudhub/core';

const AUTHKEY = "NKJHIUHknjcnkhios9w92ehds78/7T7GYfz67w2eu+dsidhfnc2365k";
let appId = 29674;
let itemId = 3186265;
let fieldId = 695215;
let interpretationId = "input";

(async ()=>{
    const gudhub = await new GudHub(AUTHKEY);
    let gottenInterpretation = await gudhub.getInterpretationById(appId, itemId, fieldId, interpretationId);
    console.log(gottenInterpretation);
})();

Four IDs are accepted as arguments:

In this case, the method will return:

'<gh-color gh-model="field_model.field_value" editable="field_model.settings.editable" mode="field_model.data_model.advanced_mode_by_default"/>'

Returns

Each of the data type has one and more interpretation types. That's why, the returned data is depends on the element and its type of interpretation.

Default

In most cases, these methods returns the string with HTML markup. That is because the content of most types of interpretation contains exactly this data.

'<gh-color gh-model="field_model.field_value" editable="field_model.settings.editable" mode="field_model.data_model.advanced_mode_by_default"/>'

HTML

With this interpretation type methods above will returns ready formatted valid HTML code.

Value

The interpretation types called Value returns the raw value of the certain field.

'#ffffff'

Functions

Types of interpretation of several elements contain functions in their Content. The get interpretation methods allow you to get the return of such functions.

{
    id: 'value',
    name: 'Value',
    content: () => {
        return 
        ...
    }
}