Notice: Trying to access array offset on value of type bool in /var/www/wp-content/plugins/wp-social-sharing/includes/class-public.php on line 81

Adaptive Cards with Microsoft Teams – JSON Templates Part 1


Notice: Trying to access array offset on value of type bool in /var/www/wp-content/plugins/wp-social-sharing/includes/class-public.php on line 81

In a continuation of my previous article, Adaptive Cards with Microsoft Teams with Examples, we continue with the details of how to create these Adaptive Cards with authored JSON templates. The templates can be used as-is, edited to suit your organization’s needs, or used as a launching point to customize your templates.  

Samples and Templates of Adaptive Cards for Microsoft Teams

This is exciting as these select samples and templates are created and offered for Microsoft Teams to show what you can create. These can be copied, edited, and tweaked to create any possible scenario. There are limitless scenarios to design and create.

Part 1 of this series includes templates for Activity Update Sample, Activity Update with Labels, Calendar Reminder, and Calendar Reminder with Labels.

Activity Update Sample

Data JSON:
{
    "title": "Publish Adaptive Card Schema",
    "description": "Now that we have defined the main rules and features of the format, we need to produce a schema and publish it to GitHub. The schema will be the starting point of our reference documentation.",
    "creator": {
        "name": "Matt Hidinger",
        "profileImage": "https://pbs.twimg.com/profile_images/3647943215/d7f12830b3c17a5a9e4afcc370e3a37e_400x400.jpeg"
    },
    "createdUtc": "2017-02-14T06:08:39Z",
    "viewUrl": "https://adaptivecards.io",
    "properties": [
        { "key": "Board", "value": "Adaptive Cards" },
        { "key": "List", "value": "Backlog" },
        { "key": "Assigned to", "value": "Matt Hidinger" },
        { "key": "Due date", "value": "Not set" }
    ]
}

Template JSON: 

{
  "type": "AdaptiveCard",
  "body": [
    {
      "type": "TextBlock",
      "size": "Medium",
      "weight": "Bolder",
      "text": "${title}",
      "wrap": true,
      "style": "heading"
    },
    {
      "type": "ColumnSet",
      "columns": [
        {
          "type": "Column",
          "items": [
            {
              "type": "Image",
              "style": "Person",
              "url": "${creator.profileImage}",
              "size": "Small"
            }
          ],
          "width": "auto"
        },
        {
          "type": "Column",
          "items": [
            {
              "type": "TextBlock",
              "weight": "Bolder",
              "text": "${creator.name}",
              "wrap": true
            },
            {
              "type": "TextBlock",
              "spacing": "None",
              "text": "Created {{DATE(${string(createdUtc)}, SHORT)}}",
              "isSubtle": true,
              "wrap": true
            }
          ],
          "width": "stretch"
        }
      ]
    },
    {
      "type": "TextBlock",
      "text": "${description}",
      "wrap": true
    },
    {
      "type": "FactSet",
      "facts": [
        {
          "$data": "${properties}",
          "title": "${key}:",
          "value": "${value}"
        }
      ]
    }
  ],
  "actions": [
    {
      "type": "Action.ShowCard",
      "title": "Set due date",
      "card": {
        "type": "AdaptiveCard",
        "body": [
          {
            "type": "Input.Date",
            "id": "dueDate"
          },
          {
            "type": "Input.Text",
            "id": "comment",
            "placeholder": "Add a comment",
            "isMultiline": true
          }
        ],
        "actions": [
          {
            "type": "Action.Submit",
            "title": "OK"
          }
        ],
        "$schema": "http://adaptivecards.io/schemas/adaptive-card.json"
      }
    },
    {
      "type": "Action.OpenUrl",
      "title": "View",
      "url": "${viewUrl}"
    }
  ],
  "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
  "version": "1.0"
}

Activity Update with Labels

Data JSON:
{
    "title": "Publish Adaptive Card Schema",
    "description": "Now that we have defined the main rules and features of the format, we need to produce a schema and publish it to GitHub. The schema will be the starting point of our reference documentation.",
    "creator": {
        "name": "Matt Hidinger",
        "profileImage": "https://pbs.twimg.com/profile_images/3647943215/d7f12830b3c17a5a9e4afcc370e3a37e_400x400.jpeg"
    },
    "createdUtc": "2017-02-14T06:08:39Z",
    "viewUrl": "https://adaptivecards.io",
    "properties": [
        { "key": "Board", "value": "Adaptive Cards" },
        { "key": "List", "value": "Backlog" },
        { "key": "Assigned to", "value": "Matt Hidinger" },
        { "key": "Due date", "value": "Not set" }
    ]
} 

Template JSON: 
{
  "type": "AdaptiveCard",
  "body": [
    {
      "type": "TextBlock",
      "size": "medium",
      "weight": "bolder",
      "text": "${title}",
      "style": "heading"
    },
    {
      "type": "ColumnSet",
      "columns": [
        {
          "type": "Column",
          "items": [
            {
              "type": "Image",
              "style": "person",
              "url": "${creator.profileImage}",
              "size": "small"
            }
          ],
          "width": "auto"
        },
        {
          "type": "Column",
          "items": [
            {
              "type": "TextBlock",
              "weight": "bolder",
              "text": "${creator.name}",
              "wrap": true
            },
            {
              "type": "TextBlock",
              "spacing": "none",
              "text": "Created {{DATE(${string(createdUtc)}, SHORT)}}",
              "isSubtle": true,
              "wrap": true
            }
          ],
          "width": "stretch"
        }
      ]
    },
    {
      "type": "TextBlock",
      "text": "${description}",
      "wrap": true
    },
    {
      "type": "FactSet",
      "facts": [
        {
          "$data": "${properties}",
          "title": "${key}:",
          "value": "${value}"
        }
      ]
    }
  ],
  "actions": [
    {
      "type": "Action.ShowCard",
      "title": "Set due date",
      "card": {
        "type": "AdaptiveCard",
        "body": [
          {
            "type": "Input.Date",
            "label": "Enter the due date",
            "id": "dueDate"
          },
          {
            "type": "Input.Text",
            "id": "comment",
            "isMultiline": true,
            "label": "Add a comment"
          }
        ],
        "actions": [
          {
            "type": "Action.Submit",
            "title": "OK"
          }
        ],
        "$schema": "http://adaptivecards.io/schemas/adaptive-card.json"
      }
    },
    {
      "type": "Action.OpenUrl",
      "title": "View",
      "url": "${viewUrl}"
    }
  ],
  "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
  "version": "1.0"
}

Calendar Reminder

Data JSON:

{
  "kind": "calendar#event",
  "etag": "\"3007572097704000\"",
  "id": "_6sp3gdjcksmab9kc4rgq1aldjelm8chhcgp66phocg_20191105T150000Z",
  "status": "confirmed",
  "htmlLink": "https://www.google.com/calendar/event?eid=XzZzcDNnZGoxNjBxamdiYjRja3NtYWI5a2M0cmplYjlwNjhyM2diOXA2Z3FtOGNoaGNncDY2cGhvY2dfMjA2xO1UwMDAuZ0Bt",
  "created": "2016-12-29T06:35:05.000Z",
  "updated": "2018-04-24T14:04:50.184Z",
  "summary": "Adaptive Card design session",
  "location": "Conf Room 112/3377 (10)",
  "creator": {
    "email": "sundance@outlook.com",
    "displayName": "John Doe",
    "self": true
  },
  "organizer": {
    "email": "sundance@outlook.com",
    "displayName": "John Doe",
    "self": true
  },
  "start": {
    "dateTime": "2019-11-05T12:30:00-08:00",
    "timeZone": "America/Los_Angeles"
  },
  "end": {
    "dateTime": "2019-11-05T13:30:00-08:00",
    "timeZone": "America/Los_Angeles"
  },
  "recurringEventId": "_6sp3gdj160qjgbb4cksmab9kc4rjeb9p68r3gb9p6gqm8chhcgp66phocg",
  "originalStartTime": {
    "dateTime": "12:30",
    "timeZone": "America/Los_Angeles"
  },
  "visibility": "private",
  "iCalUID": "7286a058-de9e-4a77-9268-945d21d2cf8d",
  "sequence": 4,
  "reminders": {
    "useDefault": false,
    "overrides": [
      {
        "method": "popup",
        "minutes": "5"
      },
      {
        "method": "popup",
        "minutes": "15"
      },
      {
        "method": "popup",
        "minutes": "30"
      }
    ]
  }
}

Template JSON: 

{
  "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
  "type": "AdaptiveCard",
  "version": "1.0",
  "speak": "Your  meeting about \"Adaptive Card design session\" is starting at ${formatDateTime(start.dateTime, 'HH:mm')}pmDo you want to snooze  or do you want to send a late notification to the attendees?",
  "body": [
    {
      "type": "TextBlock",
      "text": "${summary}",
      "size": "Large",
      "weight": "Bolder",
      "wrap": true,
      "style": "heading"
    },
    {
      "type": "TextBlock",
      "text": " ${location} ",
      "isSubtle": true,
      "wrap": true
    },
    {
      "type": "TextBlock",
      "text": "${formatDateTime(start.dateTime, 'HH:mm')} - ${formatDateTime(end.dateTime, 'hh:mm')}",
      "isSubtle": true,
      "spacing": "None",
      "wrap": true
    },
    {
      "type": "TextBlock",
      "text": "Snooze for",
      "wrap": true
    },
    {
      "type": "Input.ChoiceSet",
      "id": "snooze",
      "value": "${reminders.overrides[0].minutes}",
      "choices": [
        {
          "$data": "${reminders.overrides}",
          "title": "${minutes} minutes",
          "value": "${minutes}"
        }
      ]
    }
  ],
  "actions": [
    {
      "type": "Action.Submit",
      "title": "Snooze",
      "data": {
        "x": "snooze"
      }
    },
    {
      "type": "Action.Submit",
      "title": "I'll be late",
      "data": {
        "x": "late"
      }
    }
  ]
}

Calendar Reminder with Labels

Data JSON:

{
  "kind": "calendar#event",
  "etag": "\"3007572097704000\"",
  "id": "_6sp3gdjcksmab9kc4rgq1aldjelm8chhcgp66phocg_20191105T150000Z",
  "status": "confirmed",
  "htmlLink": "https://www.google.com/calendar/event?eid=XzZzcDNnZGoxNjBxamdiYjRja3NtYWI5a2M0cmplYjlwNjhyM2diOXA2Z3FtOGNoaGNncDY2cGhvY2dfMjA2xO1UwMDAuZ0Bt",
  "created": "2016-12-29T06:35:05.000Z",
  "updated": "2018-04-24T14:04:50.184Z",
  "summary": "Adaptive Card design session",
  "location": "Conf Room 112/3377 (10)",
  "creator": {
    "email": "sundance@outlook.com",
    "displayName": "John Doe",
    "self": true
  },
  "organizer": {
    "email": "sundance@outlook.com",
    "displayName": "John Doe",
    "self": true
  },
  "start": {
    "dateTime": "2019-11-05T12:30:00-08:00",
    "timeZone": "America/Los_Angeles"
  },
  "end": {
    "dateTime": "2019-11-05T13:30:00-08:00",
    "timeZone": "America/Los_Angeles"
  },
  "recurringEventId": "_6sp3gdj160qjgbb4cksmab9kc4rjeb9p68r3gb9p6gqm8chhcgp66phocg",
  "originalStartTime": {
    "dateTime": "12:30",
    "timeZone": "America/Los_Angeles"
  },
  "visibility": "private",
  "iCalUID": "7286a058-de9e-4a77-9268-945d21d2cf8d",
  "sequence": 4,
  "reminders": {
    "useDefault": false,
    "overrides": [
      {
        "method": "popup",
        "minutes": "5"
      },
      {
        "method": "popup",
        "minutes": "15"
      },
      {
        "method": "popup",
        "minutes": "30"
      }
    ]
  }
}

Template JSON: 

{
  "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
  "type": "AdaptiveCard",
  "version": "1.0",
  "speak": "Your  meeting about \"Adaptive Card design session\" is starting at ${formatDateTime(start.dateTime, 'HH:mm')}pmDo you want to snooze  or do you want to send a late notification to the attendees?",
  "body": [
    {
      "type": "TextBlock",
      "text": "${summary}",
      "size": "Large",
      "weight": "Bolder",
      "style": "heading"
    },
    {
      "type": "TextBlock",
      "text": " ${location} ",
      "isSubtle": true
    },
    {
      "type": "TextBlock",
      "text": "${formatDateTime(start.dateTime, 'HH:mm')} - ${formatDateTime(end.dateTime, 'hh:mm')}",
      "isSubtle": true,
      "spacing": "None"
    },
    {
      "type": "Input.ChoiceSet",
      "id": "snooze",
      "label": "Snooze for",
      "value": "${reminders.overrides[0].minutes}",
      "choices": [
        {
          "$data": "${reminders.overrides}",
          "title": "${minutes} minutes",
          "value": "${minutes}"
        }
      ]
    }
  ],
  "actions": [
    {
      "type": "Action.Submit",
      "title": "Snooze",
      "data": {
        "x": "snooze"
      }
    },
    {
      "type": "Action.Submit",
      "title": "I'll be late",
      "data": {
        "x": "late"
      }
    }
  ]
}

JSON Scripts and Templates: Microsoft.com

  • Tuesday, November 16, 2021 By : Mike Maadarani    0 comment