Cht-core: Introduce our own markup which will be substituted for tel links and can have `<output>` embedded inside

[sglangevin]

Spawned from #1554 which @alxndrsn determined could not be fixed directly. Instead of the original fix, we'd like to go with the first option that was suggested. So this would allow us to do something like
____tel:<output value="/issue-1554/phone_number"/>____

[alxndrsn]

Perhaps:

[Call this patient](tel:<output value="/issue-1554/phone_number"/>)

This could then be converted at widget init-time to:

<span class="live-link">
  <a href="#">
    <span class="ll-label">Call this patient!</span>
    <span class="ll-href" style="display:none">tel:<output value="/issue-1554/phone_number"/>
  </a>
</span>

With the following binding in the widget init:

$liveLink.find('a').on('click', function(e) {
  e.originalEvent.currentTarget.href = $(this).find('.ll-href').text();
});

[abbyad]

Using the link notation from markdown is a nice touch.

I imagine this would still allow for some styling as a button when creating the XLSForm? For example: [<span style='background-color: #CCCC00; padding: 1em; text-decoration: none; '>Call this patient</span>](tel:${phone_number}). Although I am not sure that that CSS would work as intended though given that it is nested in another span and a.

[alxndrsn]

Implemented using the standard markdown links. Inside notes, any link with HTML inside will be treated as "live", and handled by javascript. Other links will be handled as before.

[alxndrsn]

Welcome back :¬)

[estellecomment]

Cool, check out if .hidden will work, and then LGTM. Thanks!

[alxndrsn]

I think .hidden will work, from looking in the inbox.css bundle. But I've got no idea where it gets defined... It may be from bootstrap, in which case all good. If you're not already onto this, I can check later.

[alxndrsn]

I just read your further comment on the PR - I'll switch to .hidden, thanks!

[sglangevin]

I'm not sure how to AT this. @alxndrsn do you have a sample xform that explains the format required?

[alxndrsn]

@sglangevin you'll need to test by including something like the following code to a note:

[Call this patient](tel:<output value="/issue-1554/phone_number"/>)

Note that normal links have always been specified in this way, e.g.

[Visit medic website](http://medicmobile.org/)

Hopefully unsurprising!

[sglangevin]

Thanks! I had never specified a link in xlsform before and it did not dawn on me to look into that - @abbyad and I tried a few different things last week and had gotten stuck. This is working well and is very exciting!

[alxndrsn]

👍 Glad to hear it 😄