Dynamic Stopwatch Row Highlighter

Overview

The Dynamic Stopwatch Row Highlighter Plugin adds a real-time stopwatch to each row of a table, calculating and displaying elapsed time since a given timestamp. It visually highlights rows based on elapsed time: red for over 45 minutes, yellow for 30 to 44 minutes, and green for under 30 minutes. The stopwatch updates every second and dynamically adjusts row color and text formatting, providing an intuitive way to monitor time-sensitive data such as task tracking or project timelines.

Use Cases

• This plugin is ideal for applications that require real-time tracking of elapsed time, such as live order processing, delivery tracking, task monitoring, or project management. It enhances visibility and urgency by dynamically adjusting row colors based on time elapsed, helping users focus on time-sensitive tasks.

Installing the plugin

Prerequisites:

1. The page must have a table component
2. The table must have a date/time field
3. Javascript must be enabled (applicable if your're on trial account)

Step-by-Step Installation:

1. Navigate to the page with this table, this can be a parent or child page. 
2. Click on the Plugins
3. Find the Dynamic Stopwatch Row Highlighter
4. Select the table
5. Select the date/time field

Removing the Plugin

To remove the plugin, find the Javascript code that is surrounted with a comment for the plugin name and delete the code. Do the same for the CSS as well.