Counter widgets

From SpinetiX Support Wiki

(Redirected from Counter widget)
Jump to: navigation, search

This page is about the counter widgets included in Elementi 2015 and later.

Description

Icon counter widgets.png

The counter widgets can be used to display different counter animations measuring the elapsed time from a date / time or remaining time to a date / time. The counter is refreshed every second.

Widgets

Counter widgets

Elementi software comes with four counter widgets accessible from the "Widgets" tab within the Browse panel of the Elementi GUI.

  • CountDown
    Counter starting at the initial time (e.g., 15 minutes) and counting down to 0.
  • CountUp
    Counter starting at 0 and counting up to the end time (e.g., 15 minutes).
  • CountTo
    Counter displaying the time left between the current moment and the expiration date & time.
  • CountFrom
    Counter displaying the time past from the origin date & time up to the current moment.

Configuration

  • Initial time / End time
    The starting or ending time duration, expressed using one of the following formats:
    • a number followed by the time unit: ms for milliseconds, s for seconds, min for minutes or h for hours (e.g., 1500ms, 30s, 1min, 2h). If the time unit is missing, it is assumed to be seconds.
    • m:ss, mm:ss, mmm:ss etc. (e.g., 1:30, 10:45, 120:05)
    • h:mm:ss, hh:mm:ss, hhh:mm:ss etc. (e.g., 1:30:45, 20:10:45, 240:00:00)
  • Origin date & time / Expiration date & time
    The starting or ending date-time expressed as a date in a format recognized by the parse method (e.g. "20 Oct 2010 14:20:00", "1 Apr 2100 23:59:59", "25 Dec 2015", "2011-10-30", "2016-10-10T14:48:00" etc.).
  • Count unit
    The highest time unit used within the "Text template", from seconds to years.
  • Text template
    The format used to display the remaining time using the following placeholder characters: "s", "m", "h", "D", "M", "Y". These characters are automatically replaced by the actual values for seconds, minutes ... years, according to the count unit, except for the case when they are between apostrophes (').
    Examples of formats: "h:mm:ss", "Y-M-D", 'D hh:mm:ss', "Y 'years' M 'months' and D 'days' hh:mm:ss".

Examples

New Year's countdown

Icon counter widgets.png

Let's say that we want to customize the CountTo widget to display the remaining time until the New Year's Day, like in the image on the right. For that, follow these steps:

  1. Set the expiration date & time property to "31 Dec 2023 23:59:59".
  2. Set the count unit property to "Days".
  3. Set the text template to "DD hh mm ss".


Note Note:
For more details and a sample project, see "New Year's Countdown" project page.

FIFA World Cup countdown

Fifa World Cup countdown.png

Let's say that we want to customize the CountTo widget to display the remaining time until the FIFA World Cup start, like in the image on the right. For that, follow these steps:

  1. Set the expiration date & time property to the time of the first match ("14 Jun 2018 18:00:00").
  2. Make sure to adjust the hour according to your time zone.
  3. Set the count unit property to "Days".
  4. Set the text template to "DD hh mm".
This page was last modified on 9 January 2023, at 17:43.