Help

Adding a stopwatch timer to an interface

1599 0
cancel
Showing results for 
Search instead for 
Did you mean: 
Josh_Colina
6 - Interface Innovator
6 - Interface Innovator

Sharing a very basic timer I built in Interface Designer, since you cannot currently use base extensions from interfaces. Pretty easy to set-up and requires no automations - hope others find this helpful! (see attached video)

Description

This is a simple stopwatch timer that will not show a running time, but by clicking buttons you can check your time. It offers basic stopwatch functionality - you can start, stop, check, and reset the timer, but you cannot pause the timer and pick it back up. 

In my base design, time entries are a child record of task records. In the interface, this allows users to select a task and log time to it.

Set-Up
In my base, I have my time entries table with 3 checkbox fields. Each of these fields also has a Last Modified Time field that inspects it. I've named these:

  • "Start Timer" & "Start Timer - Last Modified Time"
  • "Check Timer" & "Check Timer - Last Modified Time"
  • "Stop Timer" & "Stop Timer - Last Modified Time"

In my interface, when you open a time entry you can run the stopwatch timer by clicking on the buttons. I've configured the buttons so that:

  • "Start" will check off the "Start Timer" checkbox field
  • "Stop" will check off the "Stop Timer" checkbox field
  • There are 2 "Check" buttons - one will check off the "Check Timer" checkbox field, and the other will uncheck the "Check Timer" checkbox field. At any given time, only one can be clicked, so it operates a bit like a chess clock.
  • Reset will uncheck all 3 checkbox fields

Back in the base, I have 3 formula fields:

Check Timer - DATETIME_DIFF

 

IF(
  AND(
    {Start Timer},
    {Check Timer - Last Modified Time}
  ),
  DATETIME_DIFF(
    {Check Timer - Last Modified Time},
    {Start Timer - Last Modified Time}
  ),
  0
)

 

As you can see, this field will simply return the DATETIME_DIFF between when the Start Timer and Check Timer checkbox fields were last manipulated

Stop Timer - DATETIME_DIFF

 

IF(
  AND(
    {Start Timer},
    NOT(
      {Stop Timer}
    )
  ),
  0,
  IF(
    AND(
      {Start Timer},
      {Stop Timer}
    ),
    DATETIME_DIFF(
      {Stop Timer - Last Modified Time},
      {Start Timer - Last Modified Time}
    ),
    0
  )
)

 

Likewise, this field will give the DATETIME_DIFF between when the stopwatch timer was started and stopped (under the condition that both checkbox fields are marked which, because users are only manipulating this using the interface buttons, should be the case)

Check Timer (Interface Element)

 

IF(
  {DATETIME_DIFF - Stop Timer (h:mm:ss)} != 0,
  {DATETIME_DIFF - Stop Timer (h:mm:ss)},
  IF(
    NOT(
      {Start Timer}
    ),
    0,
    IF(
      AND(
        {DATETIME_DIFF - Stop Timer (h:mm:ss)} = 0,
        {DATETIME_DIFF - Check Timer (h:mm:ss)}
      ),
      {DATETIME_DIFF - Check Timer (h:mm:ss)}
    )
  )
)

 

This field I display in the interface (and set to extra large!) so users can see their time. It is configured to show:

  • "0:00" when the Start Timer checkbox field is unchecked (i.e. it either hasn't been started or has been reset)
  • The value of the Check Timer - DATETIME_DIFF field if the timer is still running (i.e. the Stop button hasn't been clicked to check the Stop Timer checkbox field)
  • The value of the Stop Timer - DATETIME_DIFF field if the timer has been stopped

Conclusion

In my base, this is one of 3 methods by which users can enter time. They can also manually enter time using a simple duration field, or they can enter a start time and an end time and the base will just calculate the difference. The "true" time of the time entry is given by this formula field:

 

IF(
  {Manual Duration (h:mm)},
  {Manual Duration (h:mm)},
  IF(
    AND(
      NOT(
        {Manual Duration (h:mm)}
      ),
      {Duration from Start and End Time Subtraction (h:mm:ss)}
    ),
    {Duration from Start and End Time Subtraction (h:mm:ss)},
    IF(
      AND(
        NOT(
          {Manual Duration (h:mm)}
        ),
        NOT(
          {Duration from Start and End Time Subtraction (h:mm:ss)}
        ),
        {DATETIME_DIFF - Stop Timer (h:mm:ss)}
      ),
      {DATETIME_DIFF - Stop Timer (h:mm:ss)},
      IF(
        AND(
          NOT(
            {Manual Duration (h:mm)}
          ),
          NOT(
            {Duration from Start and End Time Subtraction (h:mm:ss)}
          ),
          NOT(
            {DATETIME_DIFF - Stop Timer (h:mm:ss)}
          )
        ),
        0
      )
    )
  )
)

 

 

Hope people find this helpful, and I'm always open to feedback on ways to streamline this system!

0 Replies 0