Defining an Embedded Widget Configuration - AFS

AFS Integration Guide

Product
AFS
AFS_Version
7.9
Category
Reference Guide

In this mode, configuring an AFS Widget consists of adding a script tag wrapped within the placeholder div of the concerned widget, like so:

<div data-type="AFSWidget" data-name="Foobar">
<script type="application/json">
<!-- Widget specific configuration and goes here -->
</script>
</div>

The script tag contains the widget specific configuration expressed using JSON. To make it simple, it is just a series of key/value pairs that should looks like:

<div data-type="AFSWidget" data-name="Foobar">
<script type="application/json">
{
"IntegerParam": 123,
"StringParam": "ABC",
"BooleanParam": true,
"ArrayParam": ["A", "B", "C"],
"ObjectParam": {
"WhateverParamType": "foobar",
...
},
...
}
</script>
</div>

  • Pros of this configuration mode:
    • the configuration applies directly and only to the surrounding widget
    • everything is in one place
  • Cons of this configuration mode:
    • each object key must be surrounding by double quotes
    • comments cannot be used
    • functions cannot be inlined
    • configuration have to be repeated if many widgets of the same type are installed
    • everything is in one place