Selectable Dates in Calendar

Problem

You want your bot to present a calendar that a user can select a date from (perhaps to make an appointment). However, this requires you to set minDate to today’s date dynamically.

Solution

Use the Change node with JSON data expressions to set the dates.

Example

calendar-markup-nodes.png

[{"id":"d33e9f9e.ab0db","type":"markup","z":"a635abea.f55998","name":"Calendar","markup":"<TimelineMessage>\n  <Calendar\n    title=\"When would you like to set it?\" \n    minDate=\"${today}\"\n    maxDate=\"${nextWeek}\"/>\n</TimelineMessage>","markupType":"str","syntax":"markdown","x":660,"y":260,"wires":[[]]},{"id":"d99bcfdd.a7e52","type":"change","z":"a635abea.f55998","name":"Set Calendar Data","rules":[{"t":"set","p":"payload.user.today","pt":"msg","to":"$millis()","tot":"jsonata"},{"t":"set","p":"payload.oneDayInMs","pt":"msg","to":"1000 * 60 * 60 * 24","tot":"jsonata"},{"t":"set","p":"payload.user.nextWeek","pt":"msg","to":"$sum([$millis(), msg.payload.oneDayInMs * 7])\t","tot":"jsonata"}],"action":"","property":"","from":"","to":"","reg":false,"x":450,"y":260,"wires":[["d33e9f9e.ab0db"]]}]

To try it out simply copy the above json and import it in the flow designer.
Key shortcut Ctrl/⌘-i, Menu option Import

Discussion

Data setup

The Change node can be used to set properties of a message. Using JSONata expression you can set required timestamps:

  • $milis() Returns the number of milliseconds since the Unix Epoch
  • 1000 * 60 * 60 * 24 1000ms in 1s, 60s in 1m, 60m in 1h, 24h in 1 day.
  • $sum([$millis(), msg.payload.oneDayInMs * 7]) - sum of today’s Epoch and 7 days in milliseconds

Set the properties to msg.payload.user.XXXX in order for us to be able to use them within markup.

Markup

You can double click on the markup node (labelled Calendar in our example) and paste this markup into the “Properties” tab.