To do so, create a Storyboard and mark that you will handle the Completed event.
<Storyboard Completed="OnTimerCompleted">
Put in the simplest Animation you can manage (name it, so that you can set the duration programmatically).
<DoubleAnimation x:Name="TimerDuration"
make sure you give it a duration, and point it at the simplest object you can create.
Duration="00:00:01.00" Storyboard.TargetName="MyRect" Storyboard.TargetProperty="Height"
When the duration expires you can take action and, if you wish, reset the timer.
function OnTimerCompleted…
Here's a complete sample…
<Canvas xmlns="http://schemas.microsoft.com/client/2007" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"> <Canvas.Resources> <Storyboard x:Name="myTimer" Completed="OnTimerCompleted"> <DoubleAnimation x:Name="TimerDuration" Duration="00:00:01.00" Storyboard.TargetName="MyRect" Storyboard.TargetProperty="Height" /> </Storyboard> </Canvas.Resources> <Canvas> <Rectangle x:Name="MyRect"/> </Canvas> </Canvas>
Here's the javascript…
MyDemo.Scene.prototype = { handleLoad: function(plugIn, userContext, rootElement) { // set the timer duration timer = plugIn.content.findName("TimerDuration"); timer.Duration="00:00:05.00"; // start the timer myStoryboard = plugIn.content.findName("myTimer"); myStoryboard.begin(); } } function OnTimerCompleted(sender, args) { alert ("Timer completed!"); myStoryboard = sender.findName("myTimer"); myStoryboard.begin(); //restart timer }