Recipe for Timers with pause, resume and reset for auto-refreshing data collections

[TiagoFreire]

Hi all,

I have poked around for a way to auto-refresh some galleries, but the scenario is an interactive one.

The Timer should be hidden, the user will never muck with it directly, and it will have to be controlled as a result of other user actions within the interface. 

Scenario:

User navigates to a page with a gallery. 

1) Gallery should auto-refresh every 5 minutes if the user is idling on this screen.

If the user clicks on an "Edit" button, a form shows up to edit a gallery item. 

2) While the form is active, the Timer should pause, because the user is editing an item. You don't want to refresh the gallery while the user is editing an item, to preserve consistency.

3) When the form is dismissed, the Timer should resume.

4) When the form is submitted, the Timer should reset and continue counting.

Turns out no one asked for this exact scenario, but it's a pretty reasonable one. I figured that by posting it here it could help others. 

1) The first part is easily solved by setting AutoStart, AutoPause and Repeat to true.

AutoStart and AutoPause take effect when the user navigates in and out of the screen.

Repeat makes the timer start over as it reaches the end. This creates our timer reload loop, which we will then need to pause and reset if necessary. Duration is in miliseconds, the default 60000 is 1 minute, set it to the frequency you want to trigger the action. 

Use OnTimerEnd to trigger the gallery/collection refresh - or any other action that suits your app.

2) To prepare for the timer pause/resume command, we will need a context variable. The variable should be preset to a consistent state in the Screen's OnVisible event:

UpdateContext({TimerState:true})

The Timer's Start property should be set to TimerState, so we can pause/resume it by controlling the variable. 

In the element where you trigger your Form to show up (a Button or whatever, likely an OnSelect property), you update the variable to false to pause the Timer:

UpdateContext({TimerState:false})

When the Form is dismissed, just change it to true again to make the timer resume.

If you want to reset the timer to start the counting over, just do: 

UpdateContext({TimerState:false});

Reset(Timer);

UpdateContext({TimerState:true})

If you don't force the variable TimerState to false before Reset, the Timer will stay paused and will not start running.

By combining this with your interface, you will be able to auto-refresh a gallery/collection/data source periodically, but will also be able to pause, resume and restart the timer to block the reload if the user is performing some action in the data.

Just be mindful of interface throttling limits to not overload the servers.

[v-siky-msft]

Hi @TiagoFreire ,

That is a great idea, and thanks for sharing.

But should the formula I labeled in the screenshot below be UpdateContext({TimerState:false}) according to you description?

Best regards,

Sik

[TiagoFreire · Accepted solution]

You are right, I have corrected that part. 

Thanks!