Widget:TimerTest2: Difference between revisions
Jump to navigation
Jump to search
Matt Pijoan (talk | contribs) No edit summary |
Matt Pijoan (talk | contribs) No edit summary |
||
| Line 1: | Line 1: | ||
<includeonly> | <includeonly> | ||
<script type='text/javascript' src="http://www.wikidoc.org/includes/raty/jquery.timer.js"></script> | |||
<script type='text/javascript'> | <script type='text/javascript'> | ||
var Example1 = new (function() { | var Example1 = new (function() { | ||
| Line 27: | Line 28: | ||
count++; | count++; | ||
$('#counter').html(count); | $('#counter').html(count); | ||
}); | |||
timer.set({ time : '', autostart : true }); | |||
var Example2 = new (function() { | |||
var $stopwatch2, // Stopwatch element on the page | |||
incrementTime = 70, // Timer speed in milliseconds | |||
currentTime = 0, // Current time in hundredths of a second | |||
updateTimer = function() { | |||
$stopwatch2.html(formatTime(currentTime)); | |||
currentTime += incrementTime / 10; | |||
}, | |||
init = function() { | |||
$stopwatch2 = $('#stopwatch2'); | |||
Example1.Timer = $.timer(updateTimer, incrementTime, true); | |||
}; | |||
this.resetStopwatch = function() { | |||
currentTime = 0; | |||
this.Timer.stop().once(); | |||
}; | |||
$(init); | |||
}); | |||
var count = 0, | |||
timer = $.timer(function() { | |||
count++; | |||
$('#counter2').html(count); | |||
}); | }); | ||
timer.set({ time : '', autostart : true }); | timer.set({ time : '', autostart : true }); | ||
| Line 46: | Line 77: | ||
} | } | ||
</script> | </script> | ||
<span id="stopwatch">00:00:00</span> | <span id="stopwatch">00:00:00</span> | ||
<p> | <p> | ||
<input type='button' value='Play/Pause' onclick='Example1.Timer.toggle();' /> | |||
<input type='button' value='Stop/Reset' onclick='Example1.resetStopwatch();' /> | |||
</p> | |||
<span id="stopwatch2">00:00:00</span> | |||
<p> | |||
<input type='button' value='Play/Pause' onclick='Example1.Timer.toggle();' /> | |||
<input type='button' value='Stop/Reset' onclick='Example1.resetStopwatch();' /> | |||
</p> | </p> | ||
</includeonly> | </includeonly> | ||