Countdown.js counter embed

[patricktokeeffe]

Is the wsuwp_countdown embed being used in production? It's not documented and the output formatting is rough, but it does work. I want to add user-defined formatting and need help deciding which approach should be used:

1) extend the current framework

• keep constructing the output from individual time components
• keep applying CSS classes to individual time components (as well as individual numeric values and unit labels)
• add the missing time units (only DAYS/HOURS/MINS/SECS are currently supported)
• have user specify which time components to include by specifying an associated unit label string
• don't worry about correct handling of plurals vs. singles when choosing unit labels
• don't worry about exposing the max or digits arguments of Countdown.js to users 2) embrace the underlying library
• have user specify which time components to include using True/False values (gentler than bitwise selection)
• have user optionally specify the max or digits arguments to countdown() constructor
• have user optionally specify localization details to affect output formatting (i.e. expose the arguments for countdown.setLabels())
• construct output string as a whole using .toString()
• do not apply individual CSS classes to individual time components

The second approach offers more utility to users and I prefer it unless there's some important reason to have individual components wrapped in different CSS classes. It's not clear why the individual components are styled instead of the whole output block.

• Will anything break if the CSS class wrappers are eliminated or merged into a single <span> wrapper?
• Is it possible to pass-through arguments in the correct format to countdown.setLabels()?
  • Certain arguments are provided as pipe-delimited lists (e.g. " ms| sec| min| hr| day| wk| mo| yr| | |") but the sanitize_key() function will strip out the pipes
  • Would asking users to just use underscore instead of pipe be the best workaround?
  • Or is there a different sanitize function that would be more appropriate?

[patricktokeeffe]

A rough draft of the first approach can be seen here.

This might be good enough, but I still think it's worth exploring the second approach.