# Display a running timer **URL:** \ **Category:** Need help\ **Created:** [April 4, 2022, 10:35pm UTC](https://forum.bubble.io/t/display-a-running-timer/200525 "2022-04-04T22:35:48Z")\ **Posts on this page:** 12\ **Page:** 1
**Author:** ![ramzizi](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/ramzizi/32/176232_2.png) [@ramzizi](https://forum.bubble.io/u/ramzizi)\ **Post date:** [April 4, 2022, 10:35pm UTC](https://forum.bubble.io/t/display-a-running-timer/200525/1 "2022-04-04T22:35:48Z")
I want to build a function: User hits a button that starts a stopwatch which shows the time since hitting the button in seconds/minutes/hours/days. The time that the user hits the button goes into the user database. Currently I’m able to show this data but I want it to be a running timer, I don’t want the user to have to refresh the page to see the time elapsed. It should look something like this: [Online Stopwatch - vClock](https://vclock.com/stopwatch/#start=2022-04-04T15:30:59.553) It looks like the current timer plug ins reset when the user refreshes, whereas I need the user to be able to save the time that they hit start, leave the page, and come back to see the time elapsed and stop the timer if needed Is that possible in Bubble? ---
**Author:** ![rpetribu](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/rpetribu/32/90852_2.png) [@rpetribu](https://forum.bubble.io/u/rpetribu)\ **Post date:** [April 5, 2022, 9:30am UTC](https://forum.bubble.io/t/display-a-running-timer/200525/2 "2022-04-05T09:30:16Z")
Hi! 👋 Did you already tried to find a plugin for it? ---
**Author:** ![ramzizi](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/ramzizi/32/176232_2.png) [@ramzizi](https://forum.bubble.io/u/ramzizi)\ **Post date:** [April 5, 2022, 1:51pm UTC](https://forum.bubble.io/t/display-a-running-timer/200525/3 "2022-04-05T13:51:08Z")
No, Zeroqode has own but I don’t think it saves the timer for the user, it may restart when the user leaves the page ---
**Author:** ![bcart0v](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/bcart0v/32/73592_2.png) [@bcart0v](https://forum.bubble.io/u/bcart0v)\ **Post date:** [April 5, 2022, 2:03pm UTC](https://forum.bubble.io/t/display-a-running-timer/200525/4 "2022-04-05T14:03:02Z")
You could create a Data Type named Time that references the current user, or a Data Entry in the User’s Data Type that would save the current time whenever the User hits a button, that way if they leave the page and come back, it’s referencing a starting time and would show the time elapsed between then and now. Then when they hit the button again it could clear or save it, however you want. That’s one way I could think of that wouldn’t restart a timer if the page is left, since you always have a reference point. ---
**Author:** ![NigelG](https://avatars.discourse-cdn.com/v4/letter/n/ea5d25/32.png) [@NigelG](https://forum.bubble.io/u/NigelG)\ **Post date:** [April 5, 2022, 2:38pm UTC](https://forum.bubble.io/t/display-a-running-timer/200525/5 "2022-04-05T14:38:35Z")
Save the time on the user. And a status stopped/running or something like that. When the page loads check the status. If it is running then load up the start time into a custom state. Run a workflow every x seconds on the page to update current time. Then show current time - start time formatted as a stopwatch. This is very old example. [https://buildingonbubble.com/block/countdown-timer-1466528802569x695336233767534600](https://buildingonbubble.com/block/countdown-timer-1466528802569x695336233767534600) ---
**Author:** ![Eugene\_West](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/eugene_west/32/106508_2.png) [@Eugene\_West](https://forum.bubble.io/u/Eugene_West)\ **Post date:** [April 5, 2022, 3:06pm UTC](https://forum.bubble.io/t/display-a-running-timer/200525/6 "2022-04-05T15:06:35Z")
I’m running this plugin to display current time You can use it as a stopwatch and play around as you want > **[Calendar & Timeslots Custom · BEP Plugin for Bubble, by Renato Asse](https://bubble.io/plugin/rg-calendar-1618831050749x230024566736683000)** > > Calendar & Timeslots Custom · BEP Plugin page on Bubble, by Renato Asse. Add Calendar & Timeslots Custom · BEP in one click to your app. Bubble lets you build web apps without any code. How to use: ![Screenshot 2022-04-05 at 11.03.58](https://us1.discourse-cdn.com/bubble/original/3X/e/8/e879e5004bbe1ec0dd74512f2900a8fcae471432.png) ---
**Author:** ![darren.james7518](https://avatars.discourse-cdn.com/v4/letter/d/a3d4f5/32.png) [@darren.james7518](https://forum.bubble.io/u/darren.james7518)\ **Post date:** [April 5, 2022, 4:04pm UTC](https://forum.bubble.io/t/display-a-running-timer/200525/7 "2022-04-05T16:04:08Z")
This can be done with JavaScript. I don’t want to confuse this by giving incomplete information but I paid a freelancer to do this for me a while ago and it worked. Unfortunately I don’t understand how it works but maybe these screen shots will trigger ideas for you. The timer looked like this (on preview it counts each second) ![time2](https://us1.discourse-cdn.com/bubble/original/3X/d/6/d63c5141f920821818344f898d08de89f12caf16.png) And the workflow is; ![time1](https://us1.discourse-cdn.com/bubble/original/3X/6/d/6d568c98be4ddaef5e0109e8d66d25e361fd9e5d.png) ---
**Author:** ![ramzizi](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/ramzizi/32/176232_2.png) [@ramzizi](https://forum.bubble.io/u/ramzizi)\ **Post date:** [April 5, 2022, 11:25pm UTC](https://forum.bubble.io/t/display-a-running-timer/200525/8 "2022-04-05T23:25:56Z")
That could work, however that leaves the challenge of how to convert that result from seconds elapsed to something like: 0 years 5 months 10 days 19 hours 25 minutes 25 seconds Which I would imagine would take a lot of algebra done every second Is there a more elegant solution? ---
**Author:** ![ramzizi](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/ramzizi/32/176232_2.png) [@ramzizi](https://forum.bubble.io/u/ramzizi)\ **Post date:** [April 5, 2022, 11:43pm UTC](https://forum.bubble.io/t/display-a-running-timer/200525/9 "2022-04-05T23:43:51Z")
Is there a Javascriptobubble element on that page? Can you show me how that is set up? Thanks! ---
**Author:** ![NigelG](https://avatars.discourse-cdn.com/v4/letter/n/ea5d25/32.png) [@NigelG](https://forum.bubble.io/u/NigelG)\ **Post date:** [April 6, 2022, 6:31am UTC](https://forum.bubble.io/t/display-a-running-timer/200525/10 "2022-04-06T06:31:14Z")
> [@ramzizi](#): > > Which I would imagine would take a lot of algebra done every second That is all in the link. It does require a bit of fiddling. Alternative is to use some JavaScript as above. Which is probably neater. ---
**Author:** ![darren.james7518](https://avatars.discourse-cdn.com/v4/letter/d/a3d4f5/32.png) [@darren.james7518](https://forum.bubble.io/u/darren.james7518)\ **Post date:** [April 6, 2022, 10:01am UTC](https://forum.bubble.io/t/display-a-running-timer/200525/11 "2022-04-06T10:01:09Z")
> [@ramzizi](#): > > That could work, however that leaves the challenge of how to convert that result from seconds elapsed to something like: Yeah this was tricky, I remember we had to divide everything by 60 then times it to get the result, although it was a little more tricky than that. I’m going to private message you with access to my old app so you can see how the timer worked. ---
**Author:** ![system](https://us1.discourse-cdn.com/bubble/original/3X/2/8/2847faa74692c2ffa5d939d3dc3724cdd060d247.png) [@system](https://forum.bubble.io/u/system)\ **Post date:** [June 13, 2022, 10:36pm UTC](https://forum.bubble.io/t/display-a-running-timer/200525/13 "2022-06-13T22:36:34Z")
Closed on June 13, 2022, 10:36pm UTC This topic was automatically closed after 70 days. New replies are no longer allowed.