Let’s start with something simple of just how to display a card in the specified room.
For this we will need an inject node, function node, http request node and a debug node which can come in handy while debugging our flow.
Copy [{"id":"b02aed05.5a51a","type":"tab","label":"Send ACard to room","disabled":false,"info":""},{"id":"2f914fdb.97cbc","type":"function","z":"b02aed05.5a51a","name":"Adaptive Card","func":"msg.roomId = \"!avGWZRMXzxybyGFKAh:m.tekos.co\"\n\nmsg.url = \"https://\"+env.get('BASE_URL')+'/_matrix/client/r0/rooms/' +msg.roomId+ '/send/m.room.message?access_token='+global.get('user_access_token')\nmsg.headers ={\n \"Content-type\": \"application/json\"\n}\n\n\nmsg.payload={\n \"body\": \"\",\n \"msgtype\": \"m.text\",\n \"adaptiveCard\": {\n \"$schema\":\"http://adaptivecards.io/schemas/adaptive-card.json\",\n \"type\":\"AdaptiveCard\",\n \"version\":\"1.2\",\n \"body\":[\n {\n \"type\":\"Container\",\n \"items\":[\n {\n \"type\":\"TextBlock\",\n \"text\":\"Amazon.com, Inc. (NASDAQ: AMZN)\",\n \"size\":\"Medium\",\n \"isSubtle\":true\n },\n {\n \"type\":\"TextBlock\",\n \"text\":\"September 19, 4:00 PM EST\",\n \"isSubtle\":true\n }\n ]\n },\n {\n \"type\":\"Container\",\n \"spacing\":\"None\",\n \"items\":[\n {\n \"type\":\"ColumnSet\",\n \"columns\":[\n {\n \"type\":\"Column\",\n \"width\":\"stretch\",\n \"items\":[\n {\n \"type\":\"TextBlock\",\n \"text\":\"75\",\n \"size\":\"ExtraLarge\",\n \"isVisible\":false\n },\n {\n \"type\":\"TextBlock\",\n \"text\":\"▼ 0.20 (0.32%)\",\n \"size\":\"Small\",\n \"color\":\"Attention\",\n \"spacing\":\"None\"\n }\n ]\n },\n {\n \"type\":\"Column\",\n \"width\":\"auto\",\n \"items\":[\n {\n \"type\":\"FactSet\",\n \"facts\":[\n {\n \"title\":\"Open\",\n \"value\":\"62.24\"\n },\n {\n \"title\":\"High\",\n \"value\":\"62.98\"\n },\n {\n \"title\":\"Low\",\n \"value\":\"62.20\"\n }\n ]\n }\n ]\n }\n ]\n }\n ]\n }\n ],\n \"backgroundImage\":{\n \"horizontalAlignment\":\"Right\",\n \"verticalAlignment\":\"Center\"\n },\n \"verticalContentAlignment\":\"Bottom\"\n }\n}\n\nreturn msg;\n","outputs":1,"noerr":0,"initialize":"","finalize":"","x":420,"y":200,"wires":[["6c62af61.9266"]]},{"id":"6c62af61.9266","type":"http request","z":"b02aed05.5a51a","name":"Post Request","method":"POST","ret":"obj","paytoqs":"ignore","url":"","tls":"","persist":false,"proxy":"","authType":"","x":620,"y":200,"wires":[["69514855.dbc0c8"]]},{"id":"69514855.dbc0c8","type":"debug","z":"b02aed05.5a51a","name":"Post Adaptive card to room","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"true","targetType":"full","statusVal":"","statusType":"auto","x":860,"y":200,"wires":[]},{"id":"33450c6d.ba8ea4","type":"inject","z":"b02aed05.5a51a","name":"Inject","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","payload":"","payloadType":"date","x":250,"y":200,"wires":[["2f914fdb.97cbc"]]}] We have already discussed how to send a message to the tekos chat room. To send an adaptive card you only need one more parameter in the msg.payload object containing the code of the adaptive Card.
Let’s take a look what is inside the Function node:
Copy msg .roomId = "!avGWZRMXzxybyGFKAh:m.tekos.co"
msg.url = "https://"+env.get('BASE_URL')+'/_matrix/client/r0/rooms/' +msg.roomId+ '/send/m.room.message?access_token='+global.get('user_access_token')
msg .headers = {
"Content-type" : "application/json"
}
msg .payload = {
"body" : "" ,
"msgtype" : "m.text" ,
"adaptiveCard" : "" // enter CARD JSON
}
return msg; As you can see there is almost no different between messages with and without the Adaptive Cards. All you need to do is paste the ACard code to the adaptiveCard object in the msg.payload.
Of Course we only mentioned a basic usage of the card with static data, in the next steps we are going to discuss how to use the variables in the cards and how to structure a code with dynamic content. Also there is an option to build forms inside the cards and that will be also mentioned in the next steps under the “Http actions”
