Property types

This section describes standard property types and it's configuration.

Example of property definition

{
    "@type": "meta/property/text",
    "@context": "main",
    "id": "first_name",
    "label": "First name",
    "aliases": [ "{{$value}}" ],
    "icon": "/assets/prop.svg",
    "schema": "entity.person.name.first",
    "model": "$c.first_name",
    "required": true,
    "readonly": "$$c.editable",
    "hidden": "$isHidden",
    "$isHidden": {
        "@type": "meta/javascript",
        "value": "return (Math.random() > 0.5 ? true : false)"
    },
    "actions": [
        {
            "method": "navigate",
            "uri": "https://www.google.cz/search?q={{$this}}",
            "label": "Google it"
        }
    ]
}

General configuration

Each property is defined by common configuration properties which are same for all types.

Property Type * # Description
@type String Yes No Control type ID
@context String No No Where to display control, one of main, header, footer, aside. Defaults to main
id String No No Property ID - usable for parsing
label String Yes Yes Label of property
alises Array of String No Yes Alternative property labels, eg. different forms of words - helpful for voice control
icon String / URI No No URI to property icon, all image formats are supported but SVG is recommended
schema String No No MetaWEB schema identifier from Schema vocabulary
model String No No Specifies model scope passed to property control. New model is created by default
required Boolean / Model prop. as String No No If property is required
readonly Boolean / Model prop. as String No No If property is read-only and thus control and it's children must be disabled
hidden Boolean / Model prop. as String No No If property must be hidden
excerpt Boolean No No If to show property when document is embedded. Defaults to 'false'
actions Array of Object No No Actions as specified in meta/resource, uses local property model
$* Object No No Model property

Model scope
When model scope is defined then top document model is always accessible via $$ property.

Example of Group property

{
    "@type": "meta/properties/group",
    "label": "Personal information",
    "properties": [
        {
            "@type": "meta/properties/text",
            "label": "First name",
            "model": "$first_name",
            "required": true
        },
        {
            "@type": "meta/properties/text",
            "label": "Last name",
            "model": "$last_name",
            "required": true
        }
    ]
}

Group property

@type: meta/properties/group

Group of another properties.

Property Type * # Description
properties Array of Object Yes No Child properties array

Example of label property

{
    "@type": "meta/properties/label",
    "label": "Sample text",
    "content": "Lorem ipsum dolor sit amet..."
}

Label property

@type: meta/properties/label

Basic label

Property Type * # Description
content String No Yes Label content

When no content is defined then only label is displayed.

Example of text property

{
    "@type": "meta/properties/text",
    "label": "Username",
    "minLength": 5,
    "maxLength": 32,
    "pattern": "^[a-zA-Z0-9]+$",
    "multiline": true
}

Text property

@type: meta/properties/text

Basic text input

Property Type * # Description
minLength Integer No No Minimum input length
maxLength Integer No No Maximum input length
pattern String No No Validation RegExp
multiline Boolean No No If control is multiline and should be displayed as textarea

Example of email property

{
    "@type": "meta/properties/text/email",
    "label": "E-mail"
}

E-mail property

@type: meta/properties/text/email extends meta/properties/text

E-mail property

Example of URL property

{
    "@type": "meta/properties/text/url",
    "label": "Homepage"
}

URI & URL property

@type: meta/properties/text/uri extends meta/properties/text
@type: meta/properties/text/url extends meta/properties/text

Text property with URI and URL validation

Example of number property

{
    "@type": "meta/properties/number",
    "label": "Age",
    "min": 1,
    "max": 128,
    "decimal": 0,
    "style": "range"
}

Number property

@type: meta/properties/number

Basic numeric property

Property Type * # Description
min Float No No Minimum input value
max Float No No Maximum input value
decimal Integer No No Count of allowed decimal places
style String No No Defines how to display control - one of (input / range / gauge)

Example of currency property

{
    "@type": "meta/properties/number/currency",
    "label": "Age",
    "currency": "USD"
}

Currency property

@type: meta/properties/number/currency extends meta/properties/number

Currency numeric property

Property Type * # Description
currency String Yes Yes Currency label

Example of boolean property

{
    "@type": "meta/properties/boolean",
    "label": "Enabled"
}

Boolean property

@type: meta/properties/boolean

Boolean property

Property Type * # Description
style String No No Defines how to display control - one of (checkbox / switch). Defaults to checkbox

Date & time properties

Values must be ISO-8601 compatible or expression.

Expression

Expression is used with $now variable and can specify past or future date or time (depends on control type).

$now-0000-01-00 $now+0000-01-00 $now

Example of date property

{
    "@type": "meta/properties/date",
    "label": "Date",
    "min": "$now",
    "max": "2016-12-01"
}

Date control

@type: meta/properties/date

Date property

Property Type * # Description
min String No No Minimum input value
max String No No Maximum input value

Example of time property

{
    "@type": "meta/properties/time",
    "label": "Time",
    "min": "10:00.0Z",
    "max": "22:00.0Z"
}

Time control

@type: meta/properties/time

Time property

Property Type * # Description
min String No No Minimum input value
max String No No Maximum input value

Example of datetime property

{
    "@type": "meta/properties/datetime",
    "label": "Start",
    "min": "2016-01-01T15:15:00.111Z",
    "max": "2016-12-01T15:15:00.111Z"
}

Datetime control

@type: meta/properties/datetime

Datetime property

Property Type * # Description
min String No No Minimum input value
max String No No Maximum input value

Example of options property

{
    "@type": "meta/properties/options",
    "label": "Role",
    "style": "switch",
    "options": [
        {
            "value": "1",
            "label": "Visitor",
            "alises": [ "Guest" ],
            "icon": "/assets/visitor.svg"
        },
        {
            "value": "2",
            "label": "Moderator",
            "icon": "/assets/moderator.svg"
        },
        {
            "value": "3",
            "label": "Administrator",
            "aliases": [ "Admin" ],
            "icon": "/assets/admin.svg"
        }
    ],
    "maxItems": 3
}

Options property

@type: meta/properties/options

Property which selects from predefined values.

Property Type * # Description
options Array of Object No No Array of available options
optionsUri String / URI No Yes Alternatively options can be specified as URI. Referenced resource must be JSON in options config format
minItems Integer No No Minimum number of selected items. Defaults to 0
maxItems Integer No No Maximum number of selected items. Defaults to 1. If set to -1 then infinite count of selected items is allowed
style String No No Defines how to display control - one of (dropdown / inline / switch). Defaults to dropdown

Option item properties

Property Type * # Description
value Any Yes No Item value
label String Yes if not separator Yes Item label
aliases Array of String No Yes Alternative property labels, eg. different forms of words - helpful for voice control
icon String / URI No No URI to item icon, all image formats are supported but SVG is recommended
separator Boolean No No Display item as separator. Value is then ignored and if label is set then separator shoud by displayed as group title

Example of collection property

{
    "@doctype": "meta/resource",
    "label: "Customers",
    "$datasource": {
        "@type": "meta/datasource",
        "uri": "customers.php"
    },
    "properties": [
        {
            "@type": "meta/properties/collection",
            "label": "Customer list",
            "datasource": "$$datasource",
            "template": "./record.meta",
            "model": "$list",
            "minItems": 0,
            "maxItems": -1,
            "style": "list",
            "filters": [
                {
                    "@type": "meta/properties/text",
                    "label": "Name",
                    "model": "$name"
                }
            ]
        }
    ],
    "actions": [
        {
            "method": "DELETE",
            "uri": "./customers.php",
            "model": "$list.selection",
            "label": "Trash",
            "icon": "/assets/trash.svg",
            "schema": "@delete"
        }
    ]
}

Example of embedded template

{
    "@doctype": "meta/resource",
    "label: "Customers",
    "properties": [
        {
            "@type": "meta/properties/collection",
            "label": "Customer list",
            "style": "grid",
            "$datasource": {
                "@type": "meta/datasource",
                "uri": "customers.php"
            },
            "datasource": "$datasource",
            "template": {
                "@doctype": "meta/resource",
                "label": "{{$first_name}} {{$last_name}}",
                "image": "./image.php?id={{$id}}",
                "properties": [
                    {
                        "@type": "meta/properties/text",
                        "label": "First name",
                        "model": "$first_name",
                        "readonly": true
                    },
                    {
                        "@type": "meta/properties/text",
                        "label": "Last name",
                        "model": "$last_name",
                        "readonly": true
                    }
                ],
                "action": [
                    {
                        "method": "navigate",
                        "label": "Detail",
                        "uri": "./{{$id}}.meta"
                    }
                ]
            }
        }
    ]
}

Collection property

@type: meta/properties/collection

Advanced property which represents collection of records a displays them as complex objects.

Collection should support:

  • Pagination*
  • Filtering*
  • Selection of records
  • Depends on datasource

Configuration properties

Property Type * # Description
datasource String Yes No Model property to collection records
template String / URI, Object Yes No URI to template document or document template embedded as object. Record object is passed to template as root model
filters Array of Object No No Document properties displayed as filters. Filter properties has it's own independent model
key String No No Export specified record's key to selection model instead of entire object
minItems Integer No No Minimum number of selected items. Defaults to 0
maxItems Integer No No Maximum number of selected items. Defaults to 1. If set to -1 then infinite count of selected items is allowed
style String No No Defines how to display control - one of list, grid. Defaults to list

Datasource
Datasource must be an object or an array.

If datasource is array then collection should implement filtering and ordering internaly on client side.

If datasource is of type meta/datasource then pagination, filtering and ordering must be provided on server side as specified in meta/datasource documentation.

Model

Collection exports following properties to it's model:

Property Type Description
selection Array of Object Selected record objects
filters Object Model of filter properties

Example of list property

{
    "@type": "meta/properties/list",
    "label": "Attachments",
    "template": {
        "@doctype": "meta/resource",
        "label": "Attachment",
        "properties": [
            {
                "@type": "meta/properties/text",
                "label": "Name",
                "model": "$name",
                "required": true
            },
            {
                "@type": "meta/properties/file",
                "label": "File",
                "model": "$file",
                "required": true
            }
        ]
    },
    "maxItems": 10
}

Example of list property as map

{
    "@type": "meta/properties/map",
    "label": "Attributes",
    "key": "$name",
    "template": {
        "@doctype": "meta/resource",
        "label": "Attribute",
        "properties": [
            {
                "@type": "meta/properties/text",
                "label": "Name",
                "model": "$name",
                "required": true
            },
            {
                "@type": "meta/properties/text",
                "label": "Value",
                "model": "$value",
                "required": true
            }
        ]
    }
}

List property

@type: meta/properties/list

Property which represents dynamic list of items.

When key is specified then list works as map, eg. key-value.

Property Type * # Description
template String / URI, Object Yes No URI to template document or document template embedded as object. Template model is used as item object
key String No No Item model property which is used as map key for item
minItems Integer No No Minimum number of items to be valid. Defaults to 0
maxItems Integer No No Maximum number of items. Defaults to -1. If set to -1 then infinite count of selected items is allowed

Model
Initial model must be an array of objects or object of objects (map) which are passed to template as root model.

Example of file property

{
    "@type": "meta/properties/file",
    "label": "Profile picture",
    "mimeType: "image/*",
    "maxSize": 1000000
}

File property

@type: meta/properties/file

Property which enabled to upload file and provides link to current file if set.

Property Type * # Description
mimeType String No No RegExp of allowed file mime types
maxSize Integer No No Maximum allowed size of file in bytes

Multiple files
Multiple files (array) can be implemented using meta/properties/list type.

Model & encoding

File property model is object and has following structure:

Property Type Description
filename String Filename
mimeType String File mimetype
size Integer File size in bytes
uri String Uri to current file

Filename, mimetype and size is provided when new file is selected.

When loading remote model it's recommended to provide URI property which references to current uploaded file if possible. Server also can provide filename, mimetype and size too.

Encoding

File contents is sent to server as base64.

Example of HTML property

{
    "@type": "meta/properties/html",
    "label": "Content"
}

HTML property

@type: meta/properties/html

Property which represents content as HTML.

When not read-only then content should be editable same way as contenteditable attribute works in browsers.

Styling and scripts
No CSS and scripting is allowed in HTML control.

It is recommended to format content using semantic tags such as <strong> or <em>.

Example of Link property

{
    "@type": "meta/properties/text/link",
    "label": "Source",
    "select": "http://www.identity.meta/profiles/index.meta",
    "pattern": "^http:\/\/www.identity.meta\/profiles\/*$"
}

Link property

@type: meta/properties/text/link extends meta/properties/uri

Link property represents link to existing MetaWEB resource.

Can be displayed as text input or as selector of available resources.

Property Type * # Description
select String / URI No Yes URI to MetaWEB resource which can be used as menu. Target resource MUST implement action with @select schema ID

Validation
Client must validate selected resource by trying to load it. Then it can display it's item and icon.

Multiple links

Multiple links (array) can be implemented using meta/properties/list control.

Example of Image property

{
    "@type": "meta/properties/image",
    "label": "Avatar",
    "uri": "/avatar.jpg",
    "style": "avatar"
}

Image property

@type: meta/properties/image extends meta/properties/text/uri

Image property represented as URI.

Property Type * # Description
uri String / URI Yes No URI to image resource
style String No No How to display image, one of default, cover, contain, circle, avatar, icon
vAlign String No No Vertical image alignment when croped, one of top, center, bottom. Default is center
hAlign String No No Horinzotal image alignment when croped, one of left, center, right. Default is center

TO-DO
Styles must be described.

Example of Code property

{
    "@type": "meta/properties/text/code",
    "label": "Source",
    "language": "javascript"
}

Code property

@type: meta/properties/text/code extends meta/properties/text

Code property represents various source-codes.

Client should support interactive editor and syntax highlighting.

Property Type * # Description
language String Yes Yes Code language

Supported languages

ID Name
text Plain text
javascript JavaScript
html HTML
css CSS

TO-DO
All supported languages should be specified.

IDs may change to mimetypes in the future.

Example of Meter property

{
    "@type": "meta/properties/number/meter",
    "label": "Temperature",
    "min": 0,
    "max": 30,
    "units": "°C"
}

Meter property

@type: meta/properties/number/meter extends meta/properties/number

Meter property represents measured and target value.

Usable for temperature, pressure, speed or other controls.

Property Type * # Description
units String Yes Yes Units

UI
Client can display this property as gauge.

Model properties

Property name Type Description
value Number Current set value
state Number Current measured value

IP address properties

Various properties which are representing IPv4 and IPv6 addresses and masks.

Example of IPv4 address property

{
    "@type": "meta/properties/ipv4/address",
    "label": "IP address",
    "subnet": "192.168.0.0",
    "mask": 24
}

IP address

@type: meta/properties/ipv4/address
@type: meta/properties/ipv6/address

IPv4 and IPv6 address.

Property Type * # Description
subnet String No No IP address of allowed subnet
mask Integer Yes if subnet specified No Count of mask bits for subnet validation

Example of IPv4 mask property

{
    "@type": "meta/properties/ipv4/mask",
    "label": "Subnet mask",
    "minBits": 16,
    "maxBits": 24
}

IP mask

@type: meta/properties/ipv4/mask
@type: meta/properties/ipv6/mask

IPv4 and IPv6 mask.

Property Type * # Description
minBits Integer No No Minimal mask bit count
maxBits Integer No No Maximal mask bit count

Example of Map property

{
    "@type": "meta/properties/map",
    "label": "Office location"
}

MAP property

@type: meta/properties/map

Map property represents one or more locations or areas and should be displayed as interactive map.

Map implementation is up to client browser (Google, Bing, etc...) but all features should be supported.

TO-DO

Example of Embed property

{
    "@type": "meta/properties/embed",
    "label": "Your profile",
    "uri": "../profile.meta",
    "link": true
}

Embed property

@type: meta/properties/embed

Property which embeds another MetaWEB resource. Property model is passed to child document.

Property Type * # Description
uri String / URI Yes Yes URI of embedded MetaWEB resource
link Boolean No No If link to targer resource should be displayed

Example of App property

{
    "@type": "meta/properties/map",
    "label": "3D view",
    "uri": "./viewer.html"
}

App property

@type: meta/properties/app

App property represents full-featured HTML5 application which is displayed as iframe.

All HTML, CSS and scripting features must be supported.

Property Type * # Description
uri String / URI Yes Yes URI to application main HTML file

Usage
This property should be used only in extrem cases when special functionality is needed because application runs out of MetaWEB platform so it is not parsable and does not provide MetaWEB benefits.