Kaizen #187 - Building a Timer and Worklog Widget (Part 1)

Kaizen #187 - Building a Timer and Worklog Widget (Part 1)



Howdy Tech Wizards!

Welcome back to a fresh week of Kaizen! 

This time, we are diving into a two-part series where you will learn how to build a Timer and Worklog Widget for Zoho CRM. This widget helps track active work time and log multitasking sessions using Zoho CRM APIs, Client Script, Functions, and Workflows.

Why It Matters?

Zoho CRM effectively captures stage/status transitions, like tracking when a case moves from Open to In Progress or On Hold. However, in dynamic work environments, employees juggle multiple work items and engage in impromptu tasks or conversations. 

Let’s take the On Hold status as an example. 

While it can be used to indicate pauses in progress, it does not always align with real-world workflows. Consider these scenarios:

Not all interruptions justify a status change 

Moving the case to On Hold for every minor detour (to clarify something with a colleague or respond to another emergency work item) would be impractical and could lead to under reporting actual work hours. Over time, this untracked effort adds up, creating a gap in visibility.

Frequent status changes may dilute their meaning 

In many teams, On Hold signifies a legitimate blocker like waiting on customer input or an external dependency. Using it frequently to reflect quick shifts in attention could compromise that clarity. 

A timer widget solves this by:
  • Capturing hands-on work items.
  • Logging context switches (unrelated tasks) with descriptive entries.
  • Feeding structured entries into a custom module for reporting and subform sync.

Business Scenario: IT Service Desk & Ticket Resolution

A tech support team uses the Cases module to resolve customer issues. Some tickets are straightforward; others require follow-ups, escalations, or cross-team coordination. While CRM timestamps (like stage transitions or picklist tracking) track when changes happen, they do not reflect how long someone actively worked on a case.

This Timer Widget can be the ultimate solution to track down the active time spent on each case through out the day.

What are we Building?

By the end of this two-part guide, you will know how to:
  • Build a timer widget to track time per task or any CRM record.
  • Log work sessions into a custom module every time the timer is started/stopped.
  • Automatically populate a subform in the corresponding record module using workflows and Deluge functions.
  • Leverage the Reports module to analyze work patterns, SLA adherence, and productivity trends.
 In Part I, we will focus on:
-> Building and configuring the Timer Widget.
-> Capturing each timed session as a record in a custom module.

Prerequisites

1. Create a Custom Module

Create a custom module named Timer Entries to log work details and generate reports from the Reports module. A new record will be added to this module each time a timer is started.

Set up the following custom fields in the Timer Entries module:

Custom Fields
Data Type
Start Time
DateTime
End Time
DateTime
Total Duration (in mins.)
Formula 
DateBetween(${Timer Entries.Start Time},${Timer Entries.End Time},'Minutes')
Related to Case
Lookup to Cases module
Work Description
Multi Line


2. Add a custom picklist option

Add a custom picklist option called In Progress to the Status picklist field in the Cases module for precisely identifying the status of the cases. 

Follow this Add/Remove Picklist Values help section for more details. 

3. Setup Custom Views for Contextual Filtering

To streamline the widget experience and ensure users only see relevant records to associate while tracking time, set up two smart custom views—one in the Cases module and another in the Timer Entries module. 

Active Cases View (Cases Module)

Create a custom view in the Cases module to list only the active tickets the logged-in user is working on. Use the following criteria tips:
  • Use the Status field to filter records with values like In Progress, On Hold, or Escalated.
  • Use the Case Owner field to show records that are assigned only to the currently logged-in user.
This view powers the drop-down inside the widget where users select the case they want to start the timer for.
Active Timers View (Timer Entries Module)

Set up a second custom view in the Timer Entries module to track entries where the timer has been started but not yet stopped. These represent active timers. Use the following logic for criteria:
  • The End Time field is empty (i.e., timer still running).
  • Timer Entry owner field matches the logged-in user.
This view is used internally by the widget to detect if a timer is already running and update the same entry once the timer is stopped.
Follow the Managing List View help page and use the specifications shown in the following image.

Building the Timer Widget 

Step -1: Review Basics

Refer to our earlier Kaizen on CLI Installation, Creating a Widget Project, and Internal hosting of the same.

Step 2 - Develop the Widget

After initializing your widget project using CLI, implement the timer logic:

Fetching Active Cases

On page load, the populateRecordsDropdown function initiates a Get Records API call to the Cases module, using the Active Cases custom view ID. This fetches all active case records assigned to the logged-in user. 

These records are then listed in a dropdown, allowing users to quickly select the relevant case they are about to work on.

async function populateRecordsDropdown() {
            const recordsDropdown = document.getElementById("moduleRecords");
            recordsDropdown.innerHTML = ""; 

            try {
                const recordsResponse = await ZOHO.CRM.API.getAllRecords({
                    Entity: casesModule,
                    cvid: casesCVID,
                    per_page: 10
                });

                if (recordsResponse.data && recordsResponse.data.length > 0) {
                    recordsResponse.data.forEach(record => {
                        const option = document.createElement("option");
                        option.value = record.id;
                        option.textContent = record.Subject || "Unnamed Record"; 
                        recordsDropdown.appendChild(option);
                    });
                } else {
                    const placeholderOption = document.createElement("option");
                    placeholderOption.value = "";
                    placeholderOption.textContent = "No records found";
                    placeholderOption.disabled = true;
                    placeholderOption.selected = true;
                    recordsDropdown.appendChild(placeholderOption);
                }
            } catch (error) {
                console.error("Error fetching records:", error);
            }
        }

Starting the Timer and Creating an Entry

Once the user starts the timer, The createRecord function triggers a Create Record API call to log the session in the Timer Entries custom module. The record captures the start time and the related case and description (if provided).

Even if no details are entered or case is selected, a timer entry is still created with the start time. This ensures that spontaneous work sessions are tracked and not lost.

async function createRecord(startTime) {
            try {
                const workDescription = document.getElementById("workDescription").value;
                const selectedRecordId = document.getElementById("moduleRecords").value;
                const selectedRecordText = document.getElementById("moduleRecords").options[
                    document.getElementById("moduleRecords").selectedIndex
                ].text;

                const data = {
                    Start_Time: startTime,
                    Owner: currentUserId,
                    Work_Description: workDescription,
                    Related_to_Case: selectedRecordId, 
                    Name: selectedRecordText 
                };

                const response = await ZOHO.CRM.API.insertRecord({
                    Entity: timerModule,
                    APIData: data
                });

                console.log("Start time recorded successfully");
            } catch (error) {
                console.error("Error creating record:", error);
            }
        }


Stopping the Timer and Updating the Entry

When the timer is stopped, the widget uses the Active Timer Entry custom view to locate the most recent Timer Entry record created by the logged-in user that does not have an end time. 

The updateRecord is then triggered to update that active entry using the Update Record API call. It updates the End time of the session and the related case, descriptions, if it was not already provided when the timer was started.

async function updateRecord(endTime) {
            try {
                const workDescription = document.getElementById("workDescription").value;
                const selectedRecordId = document.getElementById("moduleRecords").value;

                const response = await ZOHO.CRM.API.getAllRecords({
                    Entity: timerModule,
                    cvid: timerEntriesCVID,
                    per_page: 1
                });

                const latestRecord = response.data[0];
                if (latestRecord) {
                    const recordId = latestRecord.id;
                    const data = {
                        id: recordId,
                        End_Time: endTime,
                        Work_Description: workDescription,
                        Related_to_Case: selectedRecordId 
                    };

                    await ZOHO.CRM.API.updateRecord({
                        Entity: timerModule,
                        APIData: data,
                        RecordID: recordId
                    });
                    console.log("End time updated successfully");
                }
            } catch (error) {
                console.error("Error updating record:", error);
            }
        }

Step 3 - Validate and Pack the Widget

  • Follow the steps given in the Widget help page to validate and package the widget.
  • Go to Zoho CRM > Setup > Developer Hub > Widgets and click Create New Widget.
  • Fill in the required details as shown in this image and ensure to select Button as the widget type.

Step 4 - Associate it with Flyout

  • Go to Setup > Developer Space > Client Script. Click New Script.
  • Enter a name and description for the script. Choose Command type in Category. 

  • Create a Flyout and render a widget within it using its details like the API name of the widget, title, size, and animation type. You can get the Widget API name from the widget's detail page. 
let allowedUserEmails = [];
allowedUserEmails.push('user1_email_address');
allowedUserEmails.push('user2_email_address');
allowedUserEmails.push('user3_email_address');
let currentUserEmail = $Crm.user.email;
if (allowedUserEmails.indexOf(currentUserEmail) == -1) {
    ZDK.Client.showMessage('Command access resticted', { type: 'error' });
    return false;
}
ZDK.Client.createFlyout('myFlyout', {header: 'Timer', animation_type: 4, height: '600px', width: '500px', top: '10px', left: '10px', bottom: '10px', right: '10px' });
ZDK.Client.getFlyout('myFlyout').open({ api_name: 'Timer', type: 'widget' });
return true;

Refer to Creating a Client Script help page for more details. 

Try It Out!

A complete working code sample of this widget is attached to this post.

Now, let us see how this Timer widget works:

1. Start the Timer 

Open the widget and select an active case from the dropdown. As soon as you start the timer, a new record will be automatically created in the Timer Entries module to capture the session.

2. Stop the Timer 

When the task is complete, provide a description of the work you have done and stop the timer. The same Timer Entry record (created when the timer was started) will be updated automatically with the end time and your work description.

This forms the foundation for accurate time tracking at the record level. 

In Part 2, we will show how to:

-> Use a workflow and Deluge function to transfer these entries into the Work Log subform inside the relevant Cases record.
-> Use CRM Reports to slice and dice work time for better SLA and productivity insights.

In the meantime, would you like us to address any of your pain-points or have a topic to discuss? Let us know in the comments or reach out to us via support@zohocrm.com.

Until next time, Happy Coding! 

-----------------------------------------------------------------------------------------------------------------

Related Reading

-----------------------------------------------------------------------------------------------------------------

Idea
Previous Kaizen: Client Script Support for Subforms | Kaizen Collection: Directory


      • Recent Topics

      • Invoice Copy 2005116990189

        Please provide the invoice for the trancaction 2005116990189

      • Darshan Hiranandani About

        Hi, I’m Darshan Hiranandani, a dedicated software developer with a strong passion for creating efficient and user-friendly applications. With a degree in Computer Science and several years of experience in the tech industry, I specialize in full-stack

      • Latest update in Zoho Meeting | On-demand webinars

        Hello everyone, We’re excited to introduce our new on-demand webinar feature, you can now provide pre-recorded sessions that your audience can access immediately, no need to wait for scheduled sessions. Benefits of On-demand webinars : Scheduling flexibility

      • Zoho Meeting iOS app update - Join breakout rooms, access polls, paste links and join sessions, in session host controls

        Hello, everyone! In the latest iOS version(v1.7) of the Zoho Meeting app, we have brought in support for the following features: Polls in meeting session Join Breakout rooms Paste link in join meeting screen Foreign time zone in the meeting details screen.

      • Zoho Meeting app update.

        Hello, everyone! In the latest Android (v2.3.7) and iOS (v1.7.1) versions of the Zoho Meeting app, we have brought in support for the following features: Report Abuse option. WorkDrive integration. Report Abuse option You can now report to us any deceptive

      • Zoho Meeting Android app update - v2.4.0

        Hello everyone! We are excited to announce that we have brought in support for the following features in the latest version of the Zoho Meeting Android app(v2.4.0): 1. Start Personal Meeting Rooms 2. Revamp of the schedule meeting screen and meeting details

      • Introducing Zoho Desk integration and a few minor enhancements

        Zoho Desk Integration We've now introduced an integration between Zoho Meeting and Zoho Desk to efficiently manage meeting-related customer inquiries. With this integration, you can track, respond to, and resolve meeting-related tickets directly from

      • Zoho Meeting iOS app update: Hearing aid, bluetooth car audio and AirPlay audio support.

        Hello everyone! We are excited to announce the below new features in the latest iOS update(v1.7.4) of the Zoho Meeting app: 1. Hearing aid support: Hearing aid support has been integrated into the application. 2. Bluetooth car Audio, AirPlay audio support:

      • Zoho Meeting Android app update: Breakout rooms, noise cancellation

        Hello everyone! In the latest version(v2.6.1) of the Zoho Meeting app update, we have brought in support for the following features: 1. Join Breakout rooms. 2. Noise cancellation Join Breakout rooms. Breakout Rooms are virtual rooms created within a meeting

      • iOS 12 update: Introducing autofill passwords and Siri Shortcuts in Zoho Vault

        With this iOS 12 release, Zoho Vault users can now autofill usernames and passwords on Safari and other third-party apps. Users can enjoy a seamless login experience to their everyday apps without compromising security and also access passwords stored in Zoho vault with Siri Shortcuts by adding personalized phrases. How to enable autofill password on your iOS device? First, you need to update your device to iOS 12.  Apple recommends you to take a backup before you update your device to the latest

      • Zoho Vault: A look at what's new for iOS, iPadOS, and macOS

        Hi everyone, At Zoho Vault, we constantly aim to improve your security experience. Based on both internal and external feedback, we have recently rolled out updates across our iOS, iPadOS, and support for macOS platforms. Introducing the desktop app for

      • Biometric Access Support on Zoho Vault Desktop App

        Is there any plans to add biometric authentication (fingerprint, face recognition) for Vault desktop apps (Windows/macOS) to enhance security and ease of access. I would love to hear other members view on this

      • Free webinar: Learn the benefits of migrating to Zoho Vault's new interface

        With remote work becoming more and more common across the globe, productivity and time management are now pivotal concerns for every organization. With the number of business applications employed by companies constantly increasing, a password manager like Zoho Vault saves a lot of productive hours for your team. Vault's new interface has been carefully designed to address these pressing needs, helping users increase their productivity while improving their overall online experience.  This July,

      • Free Webinar: An exclusive live Q&A session with the Zoho Vault team

        As 2020 draws to an end, we're closing out a year that has seen drastic changes all around the world. Many businesses have adopted cloud solutions and a remote work culture for the first time, and this has given rise to newer cyber risks and threats that

      • Why passwordless authentication should be your top security project for 2021

        Hello users! We know that nobody likes to remember passwords, yet they form an indispensable part of our lives. Many of us working with any kind of technology today manage numerous passwords for personal and business accounts. With the widespread adoption

      • Free Webinar: See why Zoho Vault is the best alternative to LastPass

        When LastPass was acquired by LogMeIn in Oct 2015, we expressed our genuine concern about how this would change the LastPass business model and how customer trust would transfer from one company to another. As we suspected, LastPass doubled their pricing

      • Managing cyber threats when working remotely | A Customer Survey Report

        The nearly universal adoption of remote work has changed the way businesses function. Globally, enterprises continue to work to find new ways to make life easier for employees working remotely. However, a commonly cited concern has been the lack of cybersecurity

      • World Password Day: 5 interesting facts about passwords

        It's World Password Day: that time of the year when we talk about password hygiene and the importance of safe password management. World Password Day is observed on the first Thursday of every May, and this year, we'd like to talk about some of the most

      • Free Webinar: Go passwordless in 2022 with Zoho Vault

        Passwords have long been the preferred authentication method, largely due to their universal appeal. While they're easy for people to use and implement, they're also convenient for hackers to exploit. Reports from 2021 state that weak and stolen passwords

      • Myki has announced EOL for its services | Learn why Zoho Vault password manager is the best alternative

        Hello Myki users,   Myki has announced end-of-life for its Teams, MSP, and GUARD services, after being acquired by JumpCloud. In their recent announcement, Myki stated that they will be removing their apps and extensions from the respective stores, turning

      • Join our exclusive meetup with Zoho's Real Estate community

        Hey there, The Zoho Vault team is conducting a meetup for all real-estate users from Zoho. During this session, we will be discussing the need for secure password management and how Vault can help you and your clients safely protect passwords and other

      • Free webinar: A quick walkthrough of Zoho Vault and major updates in 2023

        Managing passwords is crucial for all businesses. You can securely store, share, and manage passwords effectively from anywhere with Zoho Vault. We have introduced several new features in 2023 to offer the best online experience for our users. Join our

      • Free webinar: Why a password manager is a “must-have” for everyone in 2024

        In the past decade, we've witnessed numerous cybersecurity breaches globally, with a significant portion resulting from the "it won't happen to me" mindset. Shockingly, in 2023, 86% of breaches involved weak and stolen passwords. Password hygiene is crucial

      • Zoho Vault - Webinars 2023 - Video Recordings and Slide Decks

        Hello, We wanted to offer a consolidated list of Zoho Vault webinar resources from 2023. Therefore, we're putting together a list that includes links to our webinar recordings and slide decks for easy access. Webinar Video recording Slide deck Getting

      • Free webinar: ‌Focal point: Building a financial ecosystem with Zoho Vault and Zoho Workplace

        Hi everyone! Cyber threats against the financial sector are escalating. In the last two decades, nearly one-fifth of reported incidents targeted financial institutions, causing $12 billion in direct losses. Cybercriminals are becoming more sophisticated,

      • New features in Zoho Vault

        We’re thrilled to introduce a wave of powerful updates in Zoho Vault, designed to enhance security, streamline workflows, and improve your overall experience. Let’s dive into what’s new! Folder creation restrictions Limit who can create folders in your

      • Join our World Password and Passkey Day expert Q&A 2025

        Hey everyone! World Password and Passkey Day is almost here, and there's no better time to talk about something we all rely on daily—secure authentication. Did you know that a staggering 60% of hacking-related breaches are tied to weak or stolen passwords?

      • Dashlane discontinued its free plan: Here's why Zoho Vault's free plan is worth the switch

        Hey everyone, Dashlane password manager has officially announced that its free plan will be discontinued starting September 16, 2025. This change means that current free users will need to either upgrade to a paid subscription or export their data and

      • Introducing SecureForms in Zoho Vault

        Hey everyone, Let’s face it—asking someone to send over a password or other sensitive data is rarely straightforward. You wait. You nudge. You follow up once, twice—maybe more. And when the information finally arrives, it shows up in the worst possible

      • Clickjacking: Zoho Vault's Response

        Issue: Password manager browser extensions are found to be vulnerable to clickjacking security vulnerabilities that could allow attackers to steal account credentials, TFA codes, and card details under certain conditions. Reported by: Marek Toth, Independent

      • Free webinar: Security that works: Building resilience for the AI-powered workforce

        Hello there, Did you know that more than 51% of organizations worldwide have experienced one or more security breaches, each costing over $1 million in losses or incident response? In today’s threat landscape, simply playing defense is no longer enough.

      • Free webinar—Redefining workforce security with Zoho Vault: Passwords, passkeys, and multi-factor authentication

        Hi everyone! Did you know that in Q2 alone, 94 million data records were leaked globally? Behind every breach is a combination of poor password habits, phishing attacks, privilege misuse, and simple human error. The fallout—including reputational damage,

      • In arattai received message can't be deleted

        The issue has been noticed in following: arattai app (Android) arattai app (Window) arattai web While the message posted by me may be deleted, the ones received from others can't be. The item <Delete> change to <Report> when the message is a received

      • Fill Colors

        Hello, Just curious, is it possible to manage the Used and standard colors in the fill drop down menu ? I would like to change/edit them is possible to colors I frequently use. Thanks for you reply, Bruce

      • Is there a way to generate a virtual meeting for a group service in Zoho Bookings?

        Are virtual meetings not supported for group services/meetings? I have integrated Zoom with one-on-one services, but I need a way to create an online group meeting. Thanks

      • Items Below Reorder Point Report?

        Is there a way to run a report of Items that are below the Reorder Point? I don't see this as a specific report, nor can I figure out how to customize any of the other stock reports to give me this information. Please tell me I'm missing something s

      • Markdown for Desk?

        Hi, my company wants to use markdown for formatting text in Desk (in all modules there, especially Tickets and Helpcenter). Zoho already offers use of markdown in several products (see https://help.zoho.com/portal/en/kb/backstage/microsite-guide/formatting-with-markdown/articles/formatting-with-markdo)

      • Client scripts for Zoho Books ?

        Good day everyone, I am looking for a way to be able to interact with the Quotes and Invoices as they are being created. Think of it like Zoho client script in Zoho CRM. But for the life of me I dont see a way to do this. The issue with having function

      • Fillable template with dynamic tables?

        Is there a way to build a fillable template so that users can add rows to a table? To describe what I'm trying to accomplish the table has 3 sections; a header row, some number of rows with custom information, and a summary row with totals. I can't figure

      • Documents don't sync properly

        Hello, My team recently moved to Zoho workDrive, some of my team, work remotely so we believed Zoho would be the best way to share and edit files as well as access files withing the team. However we are experiencing sync issues, when a file is uploaded in the file explorer and shows sync complete, same file can be seen on the Zoho web app but other team members can't see the said file because it is not syncing properly. i figured out that if i were to go to preferences in settings and resync the

      • Next Page