Workout-Countdown: Big, colored-by-percent, with end-sound?

1

Hi,

I have been searching for a countdown-timer for my workout-TW.
In time-based exercises I need such with saved times (exercise A: 50 seconds, exercise B 5 minutes,…).

I found 3 possibilities, but none of them have all functions what I need.
Which one would be the most simplest way to implement the missing features?

My requirements are:

  1. Play sound at the reached end of countdown.
  2. BIG: It doesn’t matter if a circle or a bar or any other shape- or even only color-changing-numbers, but it should be quite big.
  3. The actual remaining time should be shown with numbers.
  4. Some kind of colour coding (background or shape or the remaining time itself): After half of the time other f.e. yellow, after three-quarters f.e. orange, at the end f.e. red.

I found these:

  • TiddlyTools (SampleCountdown) by @EricShulman : Fantastic, but not big (maybe easy to change size), no color, good really big message, no sound. No idea if possible & how to implement automatic audio-playing at countdown-end.
  • TalkTimer by @sukima : Really huge & clear color coding not by percent but by time, but no sound, maybe not so good to use on mobile, because I cannot click Alton mobile for resetting timer (but maybe not so difficult to create button for that), No idea if possible & how to implement automatic audio-playing at countdown-end.
  • Soundcite by Florian Kohrt: Plays sound. But again very small, no color. And I also don’t know if and how I could easily change times, especially on mobile. (f.e. “yesterday I did exercise A for 2 minutes, today I’ll do it for 3 minutes”).

So, do you know, which one I could edit to my goal the most easiest?
Or did I even overlook any other plugin, that does this already have?

Thanks in advance!

2

That link is VERY old (23rd September 2020), and has been replaced by

https://tiddlytools.com/#SampleCountdown

Note that to use SampleCountdown, you also need:
TiddlyTools/Time/CountDown
TiddlyTools/Time/Ticker
TiddlyTools/Time/action-timeout.js

It is also possible to customize the CountDown to

  • change size
  • add color
  • play sounds

Give me a little while, and I will post a solution that includes the above customizations.

-e

3

Oh, that would be my jackpot :melting_face:
Huge thanks!

4

Give this a try:

\import TiddlyTools/Time/CountDown
\define done() <$macrocall $name=showMessage msg="$(here)$ done!<br><<playsound done.mp3>>"/>
\define show()
<style>.myWorkout-$(class)$ .tt-countdown { background:<<color>>; }</style>
@@font-size:200%;.myWorkout-$(class)$ <<getCountdown>> <<start>> <<pause>> <<reset>>@@
\end
<$let here=<<currentTiddler>> class={{{ [<here>slugify[]search-replace[.],[_]] }}}
      time={{{ [{!!hours}multiply[60]add{!!mins}multiply[60]add{!!secs}] }}}
   percent={{{ [<temp>get[text]divide<time>] }}}
     color={{{
         [<percent>match[]then[default]]
        ~[<percent>match[NaN]then[default]]
        ~[<percent>compare:number:lteq[0.00]then[red]]
        ~[<percent>compare:number:lteq[0.25]then[orange]]
        ~[<percent>compare:number:lteq[0.50]then[yellow]]
     }}}>
<<show>>
  • Create a tiddler (e.g., “Exercise A”) containing the following fields:
    text: {{||Workout-Countdown}}
    hours: 0
    mins: 0
    secs: 50
  • Create another tiddler (e.g., “Exercise B”) containing the following fields:
    text: {{||Workout-Countdown}}
    hours: 0
    mins: 5
    secs: 0
  • Import an .mp3 file. After importing, rename the tiddler “done.mp3”.
  • Alternatively, you can just put a file named “done.mp3” in the same local folder as your TiddlyWiki

Let me know how it goes…

enjoy,
-e