Generating interaction URL with a template

Configuration Frontend
1

I have an automation that takes a snapshot of my 3D printer camera at the end of the print and saves it with a sequential number.

I would like to set up a lovelace card where the click action opens the most recent photo in a new tab.

My idea was to have the automation increment a counter, and then I would append that counter value onto the local url for the media folder.

The code for the card is as follows:

tap_action:
  action: url
  url_path: |
    /local/printercam/capture_{{states.input_number.counter.state}}.jpg

This does not insert the input number into the string, but rather opens a new tab with that exact url.

However, entering

 /local/printercam/capture_{{states.input_number.counter.state}}.jpg

into the template editor returns the correct url.

Is there other formatting that I need to use when templating the string?

2

Most Dashboard cards do not support templates at all, and even fewer support them in Card actions.

3

Just use markdown card for this:

type: markdown
content: |
  <a href="/local/printercam/capture_{{states.input_number.counter.state}}.jpg" target="_blank">Open image</a>

You can also change this to for example display just some icon, instead of text, to make it more ‘button like’:

type: markdown
content: |
  <a href="/local/printercam/capture_{{states.input_number.counter.state}}.jpg" target="_blank"><ha-icon icon="mdi:link-variant"></ha-icon></a>
4

Right at the bottom of the Actions page:

Also, use {{ states('input_number.counter') }}: see the warning at the end of this section:

5

Also consider

You can then add a camera view card and, when the file changes, the view updates.