quarto shortcode

[gadenbuie]

countdown would make a great quarto extension and I fully intend to make it happen. Something like this:

{{< countdown-timer 1:30 warn_when=30 >}}

Although I haven't thought much about the shortcode syntax yet — this is mostly just to signal that I plan to do this as a way to learn about Quarto extensions.

[ddsjoberg]

Hey hey hey!

I know nothing about quarto shortcodes, but I have created a revealjs Quarto Presentation including countdown timers. The slide deck took a long time to render, so I added cache: true to the YAML. When I did that, I got errors like this:

So I needed to remove the cache from chunks with the timer.

```{r}
#| echo: false
#| cache: false
countdown(minutes = 8)

Just an FYI in case it helps creating the shortcode countdown timer 🤗 

[gadenbuie]

Yeah that kinda makes sense... I do something a little unusual here and write the CSS file on the fly for the first timer you include. That's why you get a message about a file in the temp dir, which would change between sessions and wouldn't be cached properly.

That's a design decision from my very early days learning htmltools; these days I would use CSS variables to avoid this problem. I thought about making the change before the v0.4.0 release but I already rewrote the JavaScript and that felt like enough for the moment 😄

I'll open a new issue to track the feature that would fix this.

[gadenbuie]

@jthomasmock I want to create a Quarto shortcode that bundles countdown without duplicating code or assets... Is octavo the approach I'm looking for?

[koliajaykr]

Also, the + icon in the timer is also not appearing correctly (the - icon is right), as we see in the attached picture.

[andrewpbray]

Howdy, I just wanted to check in to see: is this still on the roadmap?

[gadenbuie]

Hi @andrewpbray! I'd love to work on this – but apparently haven't quite found the confluence of time and motivation. I'd be very open to contributions or collaborations if you or anyone else is so inclined 😄

[gadenbuie]

Just a note, that I don't think the quarto shortcode API should replicate the kitchen-sink approach of the countdown() function. I think we'd want to support setting the time in MM:SS format, the play_sound, update_every, warn_when and absolute positioning arguments. Also id, class, and style (which could possibly be handled by passing unmatched arguments to the outer .countdown container?). I'm on the fence about font_size, margin and padding.

The rest of the features are style-related and can be better handled by moving the CSS to make better use of CSS variables (see #28) and then documenting how to use Quarto raw html blocks to set those values via <style>, either globally for a given class, or how to use style="" to set those variables inline for a specific timer.

[coatless]

Completed in #35.

For those interested, please feel free to take it out for a spin by installing the shortcode extension into your quarto project via:

quarto add gadenbuie/countdown/quarto

Some light documentation is available in the quarto/README.md:

https://github.com/gadenbuie/countdown/blob/main/quarto/README.md

Comments & Feedback appreciated! We'll have a few more updates to it over the next few weeks.