ā± Show Game Time / Timer (with a modified stopwatch)

Background

My #TeamSeas Matching Game has a timer that shows your elapsed time playing the game. If your game time is fast enough, you make it on the leaderboard.

See in Action

Play the game:
https://teamseas.glideapp.io/

teamseasgame

Tutorial

A few people asked how I added the game timer, so I made this video to show you how:

Use Custom CSS at your own risk šŸ˜
<pre><span><style>

[title="Reset Timer"], [title="Start/Stop Timer"] {
 display: none !important;
}

.timer-container > svg {
 display: none !important;
}

.timer-container {
 height: 40px !important;
}
11 Likes

Hi
May I ask how did you get the timer to automatically start when you press the button?
Iā€™d like to create a form timer, i.e. how long has it taken the user to fill a certain form. Start time is when they press the button to enter the form, stop time is when they click on the submit button.
Thanks

You have to set the time when you press the button through a custom action before you go to the game screen.

I cover setting that up here:

1 Like

That very cool ! Could you explain how make ranking ? I would like to make a chrono, for exemple people have 1h for do the game, after this 1h hour the game close. I think if you expalin how do ranking i can find the solution for do what i want ( If you have directly the solution to my problem that fabulous).

( Sorry for my English, iā€™m French)

Basically you:

  1. Display the users and their scores in an inline list.

  2. Then sort the inline list by score.

  3. Then restrict the list to only show 10 items (or however many you want on the leaderboard).

@Robert_Petitto Has a number of tutorials on his channel showing different variations of this: https://www.youtube.com/c/RobertPetittoWA/search?query=leaderboard

1 Like