JSON schema for Content Control and Shape configuration

JSON schema

JSON Content Control configuration has the following schema:

{
  "templafy": {
    "type": "",
    "binding": "",
    "format": "",
    "visibility": {
      "action": "",
      "binding": "",
      "operator": "",
      "compareValue": "",
      "compareValues": ["", ""]
    }
  }
}

• All types, operations, and actions must be camelCase.
• All bindings and compare values must be PascalCased.
• All Content Controls must be locked for editing (unless they are bound to a textbox on a form).
• In PowerPoint, all binding must be on layouts/masters. Only translations are allowed on slides.

Types

• "text" - when inserting raw text to a content control.
• "date" - when inserting a date that needs formatting in text to a content control.
• "image" - when updating an image in the picture content control (and possibility of an image shape later).
• "group" - when we want to group content controls like "label" and "value" to show/hide the entire group. Not enabled for shapes.
• "textElement" - when inserting a text element (content of a .docx file) into a content control.

Attributes 

• Type: "text", "date", "image", "group", and "textElement". Required on all.
• Binding: reference to a form field, or a data source.
• Format: Only for dates, e.g. "yyyy-dd-mm".
• Visibility: Used to hide/delete a content control based on a condition. If a condition is not specified, the content control will be hidden/deleted when the binding is empty.  
• Action: "hide", "delete".
• Binding: A reference to the form field, or data source for visibility settings.
• Operator: "Equals", or "NotEquals". Must be written in CamelCase. (Not confirmed operators "LessThan", "GreaterThan", "LessThanOrEquals", "StartsWith", "EndsWith").
• CompareValue: Defaults to "" (empty string).

Document context entry points

When specifying a value for a binding, format and compareValue(s), the actual value in the "DocumentContext" is looked up. There are a few entry points: 

• Form: refers to the form, and all controls.
• UserProfile: shorthand syntax for Form.UserProfile.
• DocumentLanguage: if it exists, Form.Language.Code, otherwise UserProfile.Language.Code, otherwise empty string (meaning Culture.InvarientCulture).
• Translations: look up in the translations datasource where {{DocumentLanguage}} is the column name, and the value is the row Id.
• DateFormats: Look up in the DateFormats datasource where {{DocumentLanguage}} is the column name, and value is the row Id.

Built Templates

Inserting content from a .docx file uses "assetId" as the attribute, instead of "binding".
The "assetId" can be located by browsing the text element that is to be inserted, and copying the ID from the browser URL (as seen below).

The structure of the JSON configuration is as follows, with more advanced examples later in the article:

{
  "templafy": {
  "type": "textElement",
  "assetId": "636598080776569532"
  }
}

Examples of bindings and settings in document context

Text bindings:

// Will simply insert the text entered in the form
{ "templafy": { "type": "text", "binding": "Form.YourRef" } }
// Here we are referencing an Office dropdown on the UserProfile. 
{ "templafy": { "type": "text", "binding": "UserProfile.Office.Company" } }
// Here we are referencing an Office dropdown on the form. 
{ "templafy": { "type": "text", "binding": "Form.Office.Company" } } 

Image bindings:

// Inserts a logo from the Office datesource
{ "templafy": { "type": "image", "binding": "UserProfile.Office.Logo" } } 
// Inserts a logo with fixed width and height
{ "templafy": { "type": "image", "width": "4.18 cm", "height": "1.74 cm", "binding": "UserProfile.Office.Logo" } } 
// Dynamic width
{ "templafy": { "type": "image", "width": "{{UserProfile.Office.LogoWidth}}", "binding": "UserProfile.Office.Logo" } }
// Dynamic height  
{ "templafy": { "type": "image", "height": "{{UserProfile.Office.LogoHeight}}", "binding": "UserProfile.Office.Logo" } } 

Date bindings:

When inserting a date, a "format" property is always required, which says how the date is to be formatted. This can be hard coded in the templates like "yyyy-MM-dd" or "d. MMMM yyyy". {{DocumentLanguage}} is always used for this. For "format", it is possible to read the format from the special "DateFormats" data source. The data source will have one row for each supported language, where the key is "en-GB", "da-DK", then each format will be a column.

{"templafy": { "type": "date", "binding": "Form.InvoiceDate", "format": "yyyy-MM-dd" } } 
{"templafy": {"type":"date","binding":"Form.Date","format":"{{DateFormats.DateCustomE}}"}} // Date formats based on language works with language selection in the user profile. 
{"templafy": { "type": "date", "binding": "Form.InvoiceDate", "format": "{{DateFormats.LongDate}}" } // Will look up the "LongDate" column in the DateFormats data source, with the rowId of of {{DocumentLanguage}} (e.g. en-GB).

Groups:

Groups are used when a content control wraps content, but does not insert or update data.
Groups are not supported in shapes.

// Checkbox/Boolean flag on form. As default value is "" then we must have a compareValue for checkboxes
{ "templafy": { "type": "group", "visibility": { "action": "delete", "binding": "Form.HideLogo", "operator": "equals", "compareValue": "true" } } } 
// We use the compareValue to allow negating checkbox values.
{ "templafy": { "type": "group", "visibility": { "action": "hide", "binding": "Form.InsertEnclosure", "operator": "equals", "compareValue": "false" } } }

Visibility actions:

// Shape or CC with static content
{ "templafy": { "type": "text", "visibility": { "action": "hide", "binding": "Form.Office.Address1" } } } 
// Default "binding" on visibility is the bind of the parent element
{ "templafy": { "type": "text", "binding": "UserProfile.Office.Address1", "visibility": { "action": "hide" } } 
// Default "compareOperator": "Equals", "compareValue": ""
{ "templafy": { "type": "text", "binding": "UserProfile.Office.Address1", "visibility": { "action": "hide", "binding": "UserProfile.Office.Address1" } } } 
{ "templafy": { "type": "text", "binding": "UserProfile.Office.Address1", "visibility": { "action": "hide", "binding": "UserProfile.Office.Address1", "operator": "Equals", "compareValue": "" } } } 
{ "templafy": { "type": "text", "binding": "UserProfile.Office.Address1", "visibility": { "action": "hide", "binding": "UserProfile.Office.Address1", "operator": "NotEquals", "compareValue": "" } } }
// Example with delete instead of hide
{ "templafy": { "type": "text", "binding": "UserProfile.Office.Address1", "visibility": { "action": "delete", "binding": "UserProfile.Office.Address1" } } }  
 

Translations:

"Translation" is used to look up a translations data source. For this to work, the Translations table must be edited to create columns for each translation.

// Will lookup the row "Mobile" in the Translations DataSource with the column {{DocumentLanguage}} (e.g. en-GB)
{ "templafy": { "type": "text", "binding": "Translations.Mobile" }}
//Inserts a value based on the language selection
{"templafy": { "type": "text", "binding": "UserProfile.Office.OfficeName_{{DocumentLanguage}}" } }

Complex bindings:

Looking up the value of the "Disclaimer-External_en-GB" column in the Office data source is required. 

// _External markup will default to the "External" column in the Office data source.
{"templafy":{"type":"text","binding":"UserProfile.LegalEntity.DisclaimerPowerPoint_External"}}
// Form.Audience.Audience will resolve to "External" if that is selected in the dropdown on the form. 
{"templafy":{"type":"text","binding":"UserProfile.LegalEntity.DisclaimerPowerPoint_{{Form.Audience.Audience}}"}} 
// {{DocumentLanguage}} will resolve to "en-GB" because that is the taken form the selected UserProfile.Langue
{"templafy": { "type": "text", "binding": "UserProfile.LegalEntity.Web_{{Form.InternalExternal.InternalExternal}}_{{DocumentLanguage}}" } }

Built Templates:

{"templafy":{"type":"textElement","assetId":"636598080776569532"}}
{"templafy":{"type":"textElement","assetId":"{{Form.DropdownField.ColumnName}}"}}
{"templafy":{"type":"textElement","replaceOnUpdate":true,"assetId":"{{Binding}}"}}